+ removed useless console.log

+ added youtube chapters export

src-tauri/Cargo.toml

@@ -1,6 +1,6 @@
 [package]
 name = "app"
-version = "0.2.0"
+version = "0.2.2"
 description = "A Tauri App"
 authors = ["you"]
 license = ""

src-tauri/tauri.conf.json

@@ -8,7 +8,7 @@
 	},
 	"package": {
 		"productName": "Quran Caption",
-		"version": "2.1.0"
+		"version": "2.2.0"
 	},
 	"tauri": {
 		"allowlist": {

src/lib/components/layout/ExportPage.svelte

@@ -5,7 +5,7 @@
 	import { spaceBarPressed } from '$lib/stores/ShortcutStore';
 	import { open as openLink } from '@tauri-apps/api/shell';
 	import { fullScreenPreview } from '$lib/stores/LayoutStore';
-	import { currentProject } from '$lib/stores/ProjectStore';
+	import { currentProject, downloadYoutubeChapters } from '$lib/stores/ProjectStore';
 	import { latinNumberToArabic, millisecondsToSubtitlesTimeFormat } from '$lib/ext/Utilities';
 	import toast from 'svelte-french-toast';
 
@@ -179,7 +179,7 @@
 					<section class="h-full flex items-center flex-col justify-center pb-24">
 						<p class="mt-28 text-center">Please select what you want to export :</p>
 
-						<div class="flex justify-center mt-4">
+						<div class="flex justify-center mt-4 flex-wrap gap-y-3">
 							<button
 								class="bg-green-700 hover:bg-green-900 duration-100 text-white font-bold py-2 px-4 rounded"
 								on:click={() => (outputType = 'video')}
@@ -192,6 +192,12 @@
 							>
 								Export the subtitles
 							</button>
+							<button
+								class="bg-green-700 hover:bg-green-900 duration-100 text-white font-bold py-2 px-4 rounded ml-2"
+								on:click={() => downloadYoutubeChapters()}
+							>
+								Export as YouTube chapters
+							</button>
 						</div>
 
 						<h1 class="mt-auto text-center text-xl font-bold">

src/lib/components/preview/VideoPreview.svelte

@@ -77,8 +77,6 @@
 			(audio.start > 0 && audio.start - 1000 < $cursorPosition && audio.end >= $cursorPosition)
 	);
 
-	$: console.log($currentProject.timeline.audiosTracks);
-
 	let currentSubtitle: SubtitleClip;
 
 	$: if ($spaceBarPressed) {

src/lib/components/timeline/track/ClipComponent.svelte

@@ -72,8 +72,6 @@
 			});
 		}
 
-		console.log(track.clips);
-
 		track.clips = track.clips;
 	}
 

src/lib/ext/GlobalVariables.ts

@@ -1,4 +1,4 @@
-export const SOFTWARE_VERSION = 'v2.1';
+export const SOFTWARE_VERSION = 'v2.2';
 export const GITHUB_API_URL =
 	'https://api.github.com/repos/zonetecde/QuranCaption-2/releases/latest';
 export const GITHUB_REPO_LINK = 'https://github.com/zonetecde/QuranCaption-2';

src/lib/ext/Utilities.ts

@@ -127,3 +127,14 @@ export function millisecondsToSubtitlesTimeFormat(milliseconds: number) {
 		.toString()
 		.padStart(2, '0')},${ms.toString().padStart(3, '0')}`;
 }
+
+export function millisecondsToHHMMSS(milliseconds: number) {
+	const date = new Date(milliseconds);
+	const hours = date.getUTCHours();
+	const minutes = date.getUTCMinutes();
+	const seconds = date.getUTCSeconds();
+
+	return `${hours.toString().padStart(2, '0')}:${minutes.toString().padStart(2, '0')}:${seconds
+		.toString()
+		.padStart(2, '0')}`;
+}

src/lib/stores/ProjectStore.ts

@@ -3,6 +3,9 @@ import { get, writable, type Writable } from 'svelte/store';
 import { cursorPosition, scrollPosition, zoom } from './TimelineStore';
 import Id from '$lib/ext/Id';
 import type { ProjectDesc } from '$lib/models/Project';
+import { getSurahName } from './QuranStore';
+import { millisecondsToHHMMSS } from '$lib/ext/Utilities';
+import toast from 'svelte-french-toast';
 
 export const currentProject: Writable<Project> = writable();
 
@@ -192,3 +195,50 @@ export function updateUsersProjects(project: Project): ProjectDesc[] {
 
 	return projects;
 }
+
+export function downloadYoutubeChapters() {
+	const _currentProject = get(currentProject);
+
+	// first chapter should be 00:00:00, first surah name in the projet
+	// then the rest of the chapters should be the surah names
+	const chapters: {
+		start: string;
+		end: string;
+		title: string;
+	}[] = [];
+
+	let lastChapterName = '';
+	let i = 0;
+	_currentProject.timeline.subtitlesTracks[0].clips.forEach((clip) => {
+		if (clip.surah >= 1 && clip.surah <= 114) {
+			const surahName = getSurahName(clip.surah);
+			if (surahName !== lastChapterName) {
+				chapters.push({
+					start: millisecondsToHHMMSS(clip.start),
+					end: _currentProject.timeline.subtitlesTracks[0].clips[i - 1]
+						? millisecondsToHHMMSS(_currentProject.timeline.subtitlesTracks[0].clips[i - 1].end)
+						: '00:00:00',
+					title: surahName
+				});
+				lastChapterName = surahName;
+			}
+		}
+
+		i++;
+	});
+
+	// first chapter should start at 00:00:00 even if there's a silence or basmallah
+	if (chapters.length > 0) chapters[0].start = '00:00:00';
+
+	// download as text :
+	// 00:00:00 - Al-Fatihah
+	// ...
+	const a = document.createElement('a');
+	const file = new Blob([chapters.map((c) => `${c.start} - ${c.title}`).join('\n')], {
+		type: 'text/plain'
+	});
+	a.href = URL.createObjectURL(file);
+	a.download = 'youtube chapters for ' + _currentProject.name + '.txt';
+	a.click();
+	URL.revokeObjectURL(a.href);
+}

src/lib/stores/QuranStore.ts

@@ -80,6 +80,16 @@ export function getNumberOfVerses(surahId: number) {
 	return quran.surahs[surahId - 1].total_verses;
 }
 
+/**
+ * Get the name of a surah
+ * @param surahId The ID of the surah
+ * @returns The name of the surah
+ */
+export function getSurahName(surahId: number) {
+	const quran = get(Mushaf);
+	return quran.surahs[surahId - 1].transliteration;
+}
+
 // Cache for the translations
 const caches = new Map<string, string>();
 

src/routes/+layout.svelte

@@ -3,8 +3,12 @@
 	import '../app.css';
 	import { onMount } from 'svelte';
 	import { isCtrlPressed, spaceBarPressed } from '$lib/stores/ShortcutStore';
-	import { currentProject, updateUsersProjects } from '$lib/stores/ProjectStore';
-	import { Mushaf, getEditions, getQuran } from '$lib/stores/QuranStore';
+	import {
+		currentProject,
+		downloadYoutubeChapters,
+		updateUsersProjects
+	} from '$lib/stores/ProjectStore';
+	import { Mushaf, getEditions, getQuran, getSurahName } from '$lib/stores/QuranStore';
 	import {
 		cursorPosition,
 		forceUpdateCurrentPlayingMedia,
@@ -17,6 +21,7 @@
 		fullScreenPreview,
 		getFonts
 	} from '$lib/stores/LayoutStore';
+	import { millisecondsToHHMMSS } from '$lib/ext/Utilities';
 
 	onMount(() => {
 		window.onkeydown = (e) => {
@@ -77,6 +82,10 @@
 					toast.success('Best performance mode deactivated');
 				}
 			}
+			// if key is F3, download youtube chapters
+			else if (e.key === 'F4') {
+				downloadYoutubeChapters();
+			}
 		};
 
 		window.onkeyup = (e) => {

src/routes/+page.svelte

@@ -44,7 +44,7 @@
 		const response = await fetch(GITHUB_API_URL);
 		if (response.ok) {
 			const data = await response.json();
-			console.log(data.tag_name);
+
 			if (data.tag_name !== SOFTWARE_VERSION) {
 				newUpdateAvailable.set(true);
 				newUpdateDescription.set(data.body);