From 5966004a82f635586648094a26c7aa6b1ad1cc12 Mon Sep 17 00:00:00 2001
From: Muhannad Elbolaky <think-basin-amber@duck.com>
Date: Mon, 30 Dec 2024 22:22:43 +0200
Subject: [PATCH] feat: allow user to customize format with configurable space
 and audio position

- Added settings to let users choose whether the Quran quote appears
above or below the audio element.
- Enabled option to toggle an empty line between the Quran quote and the
audio element.
- Fixed previously broken callout formatting.
- Updated version to 0.16.0.
---
 src/api/HadithApi.ts |  2 +-
 src/api/QuranApi.ts  | 24 ++++++++++++++++++++----
 src/settings.ts      | 33 +++++++++++++++++++++++++++++++++
 versions.json        |  2 +-
 4 files changed, 55 insertions(+), 6 deletions(-)

diff --git a/src/api/HadithApi.ts b/src/api/HadithApi.ts
index 64e6d7a..89952ac 100644
--- a/src/api/HadithApi.ts
+++ b/src/api/HadithApi.ts
@@ -58,7 +58,7 @@ ${this.getMoreSection(hadith)}
 		if (content.length == 0) return '';
 
 		let moreKeyword = this.plugin.settings.hadithLanguage == 'ar' ? 'مزيد' : 'more';
-		return `> > [!Quote]+ ${moreKeyword}
+		return `> > [!Quote]- ${moreKeyword}
 ${content}
 `;
 	}
diff --git a/src/api/QuranApi.ts b/src/api/QuranApi.ts
index cd3c262..d1aa330 100644
--- a/src/api/QuranApi.ts
+++ b/src/api/QuranApi.ts
@@ -38,13 +38,29 @@ export class QuranApi {
 			this.fetchData(surah, this.plugin.settings.translationOption, ayah)
 		]);
 
-		return `<audio src="${arabicResponse.ayahs![0].audio}" controls>
-<p> Audio tag not supported </p>
-</audio>
-> [!Quote] ${this.getSurahTitle(arabicResponse)} - [[${arabicResponse.number}:${arabicResponse.ayahs![0].numberInSurah}](https://surahquran.com/english.php?sora=${arabicResponse.number}&aya=${arabicResponse.ayahs![0].numberInSurah})]
+		const qoute = `> [!Quote] ${this.getSurahTitle(arabicResponse)} - [[${arabicResponse.number}:${arabicResponse.ayahs![0].numberInSurah}](https://surahquran.com/english.php?sora=${arabicResponse.number}&aya=${arabicResponse.ayahs![0].numberInSurah})]
 > 
 > ${arabicResponse.ayahs![0].text}${this.getTranslation(translationResponse)}
 `;
+
+		const audio = `<audio src="${arabicResponse.ayahs![0].audio}" controls>
+<p> Audio tag not supported </p>
+</audio>
+`;
+
+		const emptyNewLine = this.plugin.settings.insertEmptyLineBetweenQuoteAudio ? '&nbsp;' : '';
+
+		return this.plugin.settings.audioPosition == "audioAbove"
+			? `${audio}
+
+${emptyNewLine}
+
+${qoute}`
+			: `${qoute}
+
+${emptyNewLine}
+
+${audio}`;
 	}
 
 	private getSurahTitle(arabicResponse: Surah) {
diff --git a/src/settings.ts b/src/settings.ts
index 46cbba4..5e74ebc 100644
--- a/src/settings.ts
+++ b/src/settings.ts
@@ -7,6 +7,8 @@ import {languageNames} from "./constants/languages";
 
 export interface NoorPluginSettings {
 	dhikrFilepath: string;
+	audioPosition: string;
+	insertEmptyLineBetweenQuoteAudio: boolean;
 	reciter: string;
 	showTranslation: boolean;
 	translationLanguage: string;
@@ -16,6 +18,8 @@ export interface NoorPluginSettings {
 
 export const DEFAULT_SETTINGS: NoorPluginSettings = {
 	dhikrFilepath: 'dhikr.md',
+	audioPosition: 'audioAbove',
+	insertEmptyLineBetweenQuoteAudio: false,
 	reciter: 'ar.abdulbasitmurattal',
 	showTranslation: true,
 	translationLanguage: 'en',
@@ -71,6 +75,35 @@ export class NoorSettingTab extends PluginSettingTab {
 			)
 
 		containerEl.createEl('h3', {text: 'Quran Settings'});
+		new Setting(containerEl)
+			.setName('Audio Position Preference')
+			.setDesc('Choose whether audio should appear above or below the quote.')
+			.addDropdown((dropdown) => {
+				dropdown
+					.addOptions({
+						'audioAbove': 'Audio Above Quote',
+						'quoteAbove': 'Quote Above Audio'
+					})
+					.setValue(this.plugin.settings.audioPosition)
+					.onChange(async (value) => {
+						this.plugin.settings.audioPosition = value;
+						await this.plugin.saveSettings();
+						this.display();
+					});
+			});
+
+		new Setting(containerEl)
+			.setName('Space between Quote and Audio')
+			.setDesc('Add an empty line between the Quran quote and the audio element')
+			.addToggle((toggle) => {
+				toggle
+					.setValue(this.plugin.settings.insertEmptyLineBetweenQuoteAudio)
+					.onChange(async (value) => {
+						this.plugin.settings.insertEmptyLineBetweenQuoteAudio = value;
+						await this.plugin.saveSettings();
+						this.display();
+					});
+			});
 
 		new Setting(containerEl)
 			.setName('Reciter')
diff --git a/versions.json b/versions.json
index 26382a1..4973a31 100644
--- a/versions.json
+++ b/versions.json
@@ -1,3 +1,3 @@
 {
-	"1.0.0": "0.15.0"
+	"1.0.0": "0.16.0"
 }