Skip to content

Commit c203dc0

Browse files
mominulmominul
committed
first iteration
1 parent c1c363d commit c203dc0

6 files changed

Lines changed: 410 additions & 52 deletions

File tree

‎Cargo.toml‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ edition = "2024"
66
# See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html
77

88
[dependencies]
9-
axum = { version = "0.8", features = ["macros", "query"] }
9+
axum = { version = "0.8", features = ["macros", "query", "json"] }
1010
axum-extra = { version = "0.10", features = ["typed-header"] }
1111
axum-server = { version = "0.7", features = ["tls-rustls"] }
1212
askama = "0.13"

‎pages/assets/packhub.css‎

Lines changed: 78 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -236,6 +236,16 @@ hr {
236236
overflow-x: auto;
237237
}
238238

239+
.input-container {
240+
display: flex;
241+
align-items: center;
242+
justify-content: center;
243+
gap: 10px;
244+
width: 80%;
245+
margin-left: auto;
246+
margin-right: auto;
247+
}
248+
239249
.github-link {
240250
outline: none;
241251
border: none;
@@ -246,12 +256,71 @@ hr {
246256
padding: 1rem 1rem 1rem 1rem;
247257
overflow: hidden;
248258
overflow-x: auto;
249-
width: 60%;
250-
margin-left: 50px;
251-
margin-right: 50px;
259+
flex: 1;
252260
text-align: center;
253261
}
254262

263+
.detect-button {
264+
background-color: #0b7261;
265+
color: #fff;
266+
border: none;
267+
border-radius: 10px;
268+
padding: 1rem 1.5rem;
269+
font-size: 0.6em;
270+
font-family: "Fira Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
271+
font-weight: 500;
272+
cursor: pointer;
273+
white-space: nowrap;
274+
transition: background-color 0.2s;
275+
}
276+
277+
.detect-button:hover {
278+
background-color: #0d8b75;
279+
}
280+
281+
.sse-status {
282+
margin-top: 1rem;
283+
font-size: 0.8em;
284+
}
285+
286+
.sse-status.detecting {
287+
color: #0b7261;
288+
}
289+
290+
.sse-status.complete {
291+
color: #0b7261;
292+
}
293+
294+
.sse-status.error {
295+
color: #cc3333;
296+
}
297+
298+
#detected-packages {
299+
margin-top: 1rem;
300+
text-align: left;
301+
width: 80%;
302+
}
303+
304+
#detected-packages h3 {
305+
font-size: 1rem;
306+
font-weight: 500;
307+
margin-bottom: 0.5rem;
308+
}
309+
310+
#detected-packages ul {
311+
list-style: none;
312+
padding: 0;
313+
margin: 0;
314+
}
315+
316+
#detected-packages li {
317+
font-family: "Fira Mono", ui-monospace, SFMono-Regular, Menlo, Monaco,
318+
Consolas, "Liberation Mono", "Courier New", monospace;
319+
font-size: 0.55em;
320+
padding: 0.3rem 0;
321+
border-bottom: 1px solid #eee;
322+
}
323+
255324
#card div.copy-container {
256325
display: flex;
257326
align-items: center;
@@ -364,10 +433,13 @@ hr {
364433
text-align: justify;
365434
}
366435

436+
.input-container {
437+
width: 95%;
438+
flex-direction: column;
439+
}
440+
367441
.github-link {
368-
width: 80%;
369-
margin-left: 10px;
370-
margin-right: 10px;
442+
width: 100%;
371443
}
372444

373445
.platform-header {

‎pages/assets/packhub.js‎

Lines changed: 109 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -81,62 +81,134 @@ function set_up_copy_button_clicks() {
8181

8282
set_up_copy_button_clicks();
8383

84-
function set_ubuntu(owner, repo) {
85-
const ubuntu = document.querySelector(".command.ubuntu");
84+
const platformCommandMap = {
85+
ubuntu: '.command.ubuntu',
86+
debian: '.command.debian',
87+
fedora: '.command.fedora',
88+
opensuse: '.command.suse',
89+
};
8690

87-
console.log("Setting Ubuntu install command for:", ubuntu);
91+
let currentEventSource = null;
8892

89-
ubuntu.textContent = `wget -qO- https://packhub.dev/sh/ubuntu/github/${owner}/${repo} | sh`
93+
function extractGithubInfo(value) {
94+
const githubRegex = /https?:\/\/github\.com\/([^\/]+)\/([^\/]+)/;
95+
return value.match(githubRegex);
9096
}
9197

92-
function set_debian(owner, repo) {
93-
const ubuntu = document.querySelector(".command.debian");
98+
function resetDetection() {
99+
// Hide all platform sections
100+
document.querySelectorAll('.platform-section').forEach(el => {
101+
el.style.display = 'none';
102+
});
94103

95-
console.log("Setting Ubuntu install command for:", ubuntu);
104+
// Clear package list
105+
const packageList = document.getElementById('package-list');
106+
packageList.innerHTML = '';
107+
document.getElementById('detected-packages').style.display = 'none';
96108

97-
ubuntu.textContent = `wget -qO- https://packhub.dev/sh/debian/github/${owner}/${repo} | sh`
109+
// Clear status
110+
document.getElementById('sse-status').textContent = '';
111+
document.getElementById('sse-status').className = '';
98112
}
99113

100-
function set_fedora(owner, repo) {
101-
const rpm = document.querySelector(".command.fedora");
114+
function startDetection(owner, repo) {
115+
if (currentEventSource) {
116+
currentEventSource.close();
117+
currentEventSource = null;
118+
}
102119

103-
console.log("Setting Fedora install command for:", rpm);
120+
resetDetection();
104121

105-
rpm.textContent = `wget -qO- https://packhub.dev/sh/yum/github/${owner}/${repo} | sh`
106-
}
122+
const status = document.getElementById('sse-status');
123+
status.textContent = 'Detecting packages...';
124+
status.className = 'sse-status detecting';
107125

108-
function set_suse(owner, repo) {
109-
const rpm = document.querySelector(".command.suse");
126+
const packageList = document.getElementById('package-list');
127+
document.getElementById('detected-packages').style.display = 'block';
110128

111-
console.log("Setting Suse install command for:", rpm);
129+
const es = new EventSource(`/sse/detect?owner=${encodeURIComponent(owner)}&repo=${encodeURIComponent(repo)}`);
130+
currentEventSource = es;
131+
132+
es.addEventListener('package', (e) => {
133+
const data = JSON.parse(e.data);
134+
const li = document.createElement('li');
135+
let text = data.file_name;
136+
if (data.distro) {
137+
text += ` (${data.distro})`;
138+
}
139+
text += ` [${data.architecture}]`;
140+
li.textContent = text;
141+
packageList.appendChild(li);
142+
});
143+
144+
es.addEventListener('link', (e) => {
145+
const data = JSON.parse(e.data);
146+
const section = document.querySelector(`.platform-section[data-platform="${data.platform}"]`);
147+
if (section) {
148+
section.style.display = 'block';
149+
const commandSelector = platformCommandMap[data.platform];
150+
if (commandSelector) {
151+
const command = document.querySelector(commandSelector);
152+
if (command) {
153+
command.textContent = `wget -qO- ${data.url} | sh`;
154+
}
155+
}
156+
}
157+
});
158+
159+
es.addEventListener('done', (e) => {
160+
status.textContent = 'Detection complete.';
161+
status.className = 'sse-status complete';
162+
es.close();
163+
currentEventSource = null;
164+
});
165+
166+
es.addEventListener('error', (e) => {
167+
if (e.data) {
168+
const data = JSON.parse(e.data);
169+
status.textContent = 'Error: ' + data.message;
170+
} else {
171+
status.textContent = 'Connection error.';
172+
}
173+
status.className = 'sse-status error';
174+
es.close();
175+
currentEventSource = null;
176+
});
177+
178+
es.onerror = () => {
179+
if (es.readyState === EventSource.CLOSED) return;
180+
status.textContent = 'Connection lost.';
181+
status.className = 'sse-status error';
182+
es.close();
183+
currentEventSource = null;
184+
};
185+
}
112186

113-
rpm.textContent = `wget -qO- https://packhub.dev/sh/zypp/github/${owner}/${repo} | sh`
187+
function triggerDetection() {
188+
const input = document.querySelector('.github-link');
189+
const value = input.value || input.placeholder;
190+
const match = extractGithubInfo(value);
191+
if (match) {
192+
startDetection(match[1], match[2]);
193+
} else {
194+
const status = document.getElementById('sse-status');
195+
status.textContent = 'Please enter a valid GitHub repository URL.';
196+
status.className = 'sse-status error';
197+
}
114198
}
115199

116200
document.addEventListener("DOMContentLoaded", () => {
117-
const inputElement = document.querySelector(".github-link");
118-
119-
function extractGithubInfo(value) {
120-
const githubRegex = /https?:\/\/github\.com\/([^\/]+)\/([^\/]+)/;
121-
const match = value.match(githubRegex);
122-
123-
if (match) {
124-
set_ubuntu(match[1], match[2]);
125-
set_debian(match[1], match[2]);
126-
set_fedora(match[1], match[2]);
127-
set_suse(match[1], match[2]);
128-
} else {
129-
console.log("Invalid or missing GitHub URL");
130-
}
201+
const detectBtn = document.getElementById('detect-btn');
202+
if (detectBtn) {
203+
detectBtn.addEventListener('click', triggerDetection);
131204
}
132205

206+
const inputElement = document.querySelector('.github-link');
133207
if (inputElement) {
134-
// Extract initial value (if present)
135-
extractGithubInfo(inputElement.value || inputElement.placeholder);
136-
137-
// Listen for changes in the input field
138-
inputElement.addEventListener("input", (event) => {
139-
extractGithubInfo(inputElement.value || inputElement.placeholder);
208+
inputElement.addEventListener('keydown', (e) => {
209+
if (e.key === 'Enter') {
210+
triggerDetection();
211+
}
140212
});
141213
}
142214
});

‎pages/index.html‎

Lines changed: 25 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -204,14 +204,25 @@ <h3>Smart Versioning</h3>
204204
Paste your GitHub repository URL below to get the command to setup
205205
<span class="text-bold">PackHub</span> repository in your system.
206206
</p>
207-
<input
208-
class="github-link"
209-
type="text"
210-
name=""
211-
id=""
212-
placeholder="https://github.com/OpenBangla/OpenBangla-Keyboard"
213-
/>
207+
<div class="input-container">
208+
<input
209+
class="github-link"
210+
type="text"
211+
name=""
212+
id=""
213+
placeholder="https://github.com/OpenBangla/OpenBangla-Keyboard"
214+
/>
215+
<button id="detect-btn" class="detect-button" type="button">Detect</button>
216+
</div>
217+
218+
<div id="sse-status"></div>
214219

220+
<div id="detected-packages" style="display: none;">
221+
<h3>Detected Packages</h3>
222+
<ul id="package-list"></ul>
223+
</div>
224+
225+
<div class="platform-section" data-platform="ubuntu" style="display: none;">
215226
<div class="platform-header">
216227
<img src="./assets/ubuntu.png" width="50px" alt="" />
217228
<span>Ubuntu Derivatives</span>
@@ -245,7 +256,9 @@ <h3>Smart Versioning</h3>
245256
</div>
246257
</button>
247258
</div>
259+
</div>
248260

261+
<div class="platform-section" data-platform="debian" style="display: none;">
249262
<div class="platform-header">
250263
<img src="./assets/debian.svg" width="50px" height="50px" alt="" />
251264
<span>Debian Derivatives</span>
@@ -280,8 +293,9 @@ <h3>Smart Versioning</h3>
280293
</div>
281294
</button>
282295
</div>
296+
</div>
283297

284-
298+
<div class="platform-section" data-platform="fedora" style="display: none;">
285299
<div class="platform-header">
286300
<img src="./assets/fedora.png" width="40px" height="40px" alt="" />
287301
<span>Fedora</span>
@@ -316,7 +330,9 @@ <h3>Smart Versioning</h3>
316330
</div>
317331
</button>
318332
</div>
333+
</div>
319334

335+
<div class="platform-section" data-platform="opensuse" style="display: none;">
320336
<div class="platform-header">
321337
<img src="./assets/openSUSE.svg" width="50px" height="50px" alt="" />
322338
<span>openSUSE</span>
@@ -351,6 +367,7 @@ <h3>Smart Versioning</h3>
351367
</div>
352368
</button>
353369
</div>
370+
</div>
354371
</div>
355372

356373
<div id="card" class="instructions">

‎src/lib.rs‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,7 @@ mod repository;
2424
mod rpm;
2525
mod script;
2626
mod selector;
27+
mod sse;
2728
pub mod state;
2829
mod utils;
2930
pub mod cron;
@@ -53,6 +54,7 @@ pub fn app(state: AppState) -> Router {
5354
.nest("/v1", v1())
5455
.nest("/v2", v2())
5556
.nest("/sh", script::script_routes())
57+
.nest("/sse", sse::sse_routes())
5658
.nest_service("/assets", ServeDir::new("pages/assets"))
5759
.with_state(state)
5860
.layer(TraceLayer::new_for_http().on_response(

0 commit comments

Comments
 (0)