finicky9298/quixotic
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

more fixes

Browse Source
This commit is contained in:
Andrey Kondratev
2025-08-28 17:42:49 +05:00
parent 8213ca33e2
commit 3c615acaeb
14 changed files with 695 additions and 239 deletions
Download Patch File Download Diff File Expand all files Collapse all files

58
public/script.ts
View File

@@ -44,6 +44,7 @@ class QuixoticApp {
private loading!: HTMLElement;
private results!: HTMLElement;
private noResults!: HTMLElement;
private welcomePlaceholder!: HTMLElement;
constructor() {
this.tg = (window as WindowWithTelegram).Telegram?.WebApp;
@@ -63,6 +64,7 @@ class QuixoticApp {
this.loading = document.getElementById('loading') as HTMLElement;
this.results = document.getElementById('results') as HTMLElement;
this.noResults = document.getElementById('noResults') as HTMLElement;
this.welcomePlaceholder = document.getElementById('welcomePlaceholder') as HTMLElement;
}
private bindEvents(): void {
@@ -105,14 +107,17 @@ class QuixoticApp {
}
private showLoading(): void {
this.loading.classList.remove('hidden');
this.results.classList.add('hidden');
this.noResults.classList.add('hidden');
this.welcomePlaceholder.classList.add('tg-hidden');
this.loading.classList.remove('tg-hidden');
this.loading.classList.add('tg-spinner--visible');
this.results.classList.remove('tg-list--visible');
this.noResults.classList.add('tg-hidden');
this.searchBtn.disabled = true;
}
private hideLoading(): void {
this.loading.classList.add('hidden');
this.loading.classList.add('tg-hidden');
this.loading.classList.remove('tg-spinner--visible');
this.searchBtn.disabled = false;
}
@@ -125,31 +130,38 @@ class QuixoticApp {
}
this.results.innerHTML = videos.map(video => `
<div class="video-item" onclick="app.convertVideo('${video.id}', '${this.escapeHtml(video.title)}', '${this.escapeHtml(video.url)}')">
<img class="video-thumbnail" src="${video.thumbnail}" alt="${this.escapeHtml(video.title)}" loading="lazy">
<div class="video-info">
<div class="video-title">${this.escapeHtml(video.title)}</div>
<div class="video-channel">${this.escapeHtml(video.channel)}</div>
<div class="video-duration">${this.formatDuration(video.duration)}</div>
<div class="tg-list-item" onclick="app.convertVideo('${video.id}', '${this.escapeHtml(video.title)}', '${this.escapeHtml(video.url)}')">
<div class="tg-list-item__content">
<div class="tg-list-item__media">
<img class="tg-list-item__thumbnail"
src="${video.thumbnail}"
alt="${this.escapeHtml(video.title)}"
loading="lazy">
<div class="tg-list-item__duration">${this.formatDuration(video.duration)}</div>
</div>
<div class="tg-list-item__info">
<div class="tg-list-item__title">${this.escapeHtml(video.title)}</div>
<div class="tg-list-item__subtitle">${this.escapeHtml(video.channel)}</div>
</div>
</div>
</div>
`).join('');
this.results.classList.remove('hidden');
this.noResults.classList.add('hidden');
this.results.classList.add('tg-list--visible');
this.noResults.classList.add('tg-hidden');
}
private showNoResults(): void {
this.hideLoading();
this.results.classList.add('hidden');
this.noResults.classList.remove('hidden');
this.results.classList.remove('tg-list--visible');
this.noResults.classList.remove('tg-hidden');
}
public async convertVideo(videoId: string, title: string, url: string): Promise<void> {
console.log('Convert video called:', { videoId, title, url });
const videoElement = (event as any)?.currentTarget as HTMLElement;
if (videoElement) {
videoElement.classList.add('converting');
videoElement.classList.add('tg-list-item--converting');
}
try {
@@ -198,7 +210,6 @@ class QuixoticApp {
this.showMessage('✓ MP3 скачан!', 'success');
}
} else {
// Should not happen since we removed fallbacks
throw new Error('No audio URL received');
}
} catch (error: any) {
@@ -215,10 +226,10 @@ class QuixoticApp {
errorMsg = 'Видео заблокировано для скачивания.';
}
this.showMessage(`❌ ${errorMsg}`, 'warning');
this.showMessage(`❌ ${errorMsg}`, 'error');
} finally {
if (videoElement) {
videoElement.classList.remove('converting');
videoElement.classList.remove('tg-list-item--converting');
}
}
}
@@ -232,21 +243,18 @@ class QuixoticApp {
private showMessage(message: string, type: string = 'info'): void {
// Remove existing message if any
const existingMessage = document.querySelector('.status-message');
const existingMessage = document.querySelector('.tg-status-message');
if (existingMessage) {
existingMessage.remove();
}
// Create message element
const messageEl = document.createElement('div');
messageEl.className = `status-message status-${type}`;
messageEl.className = `tg-status-message tg-status-message--${type}`;
messageEl.textContent = message;
// Add to page
const container = document.querySelector('.container');
if (container) {
container.insertBefore(messageEl, container.firstChild);
}
// Add to body (fixed position, won't affect layout)
document.body.appendChild(messageEl);
// Auto-remove after 5 seconds
setTimeout(() => {