update settings page

tim-hub · Mar 25, 2024 · 226435b · 226435b
1 parent c497e11
commit 226435b
Show file tree

Hide file tree

Showing 2 changed files with 77 additions and 55 deletions.
diff --git a/src/ui/BibleReferenceSettingTab.ts b/src/ui/BibleReferenceSettingTab.ts
@@ -47,27 +47,39 @@ export class BibleReferenceSettingTab extends PluginSettingTab {
     this.startListeningToEvents()
     const headingSection = this.containerEl.createDiv()
     headingSection.innerHTML = `
-        <iframe src="https://github.com/sponsors/tim-hub/button" title="Sponsor Obsidian Bible Reference" width="116" height="32px" style="margin-right: 2em"/>
+        <iframe src="https://github.com/sponsors/tim-hub/button" title="Sponsor Obsidian Bible Reference" width="116" height="32px" class="sponsor-button"/>
     `
 
-    this.containerEl.createEl('h1', { text: APP_NAMING.appName })
+    this.containerEl.createEl('h1', {text: APP_NAMING.appName})
     this.setUpVersionSettingsAndVersionOptions()
 
-    this.containerEl.createEl('h2', { text: 'Verses Rendering' })
+    this.containerEl.createEl('h2', {text: 'Verses Rendering'})
     this.setUpReferenceLinkPositionOptions()
     this.setUpVerseFormatOptions()
     this.setUpVerseNumberFormatOptions()
     this.setUpBibleIconPrefixToggle()
     this.setUpCollapsibleToggle()
     this.setUpStatusIndicationOptions()
-    this.containerEl.createEl('h2', { text: 'Others' })
+    this.containerEl.createEl('h2', {text: 'Others'})
     this.setUpExpertSettings()
 
     this.containerEl.createSpan({}, (span) => {
       span.innerHTML = `
+
 <a href="https://github.com/tim-hub/obsidian-bible-reference">Github Repo</a> |
 <a href="https://github.com/tim-hub/obsidian-bible-reference/blob/master/docs/privacy.md">Privacy Policy</a> |
-<a href="https://github.com/sponsors/tim-hub/button">Support</a>
+<a href="https://github.com/sponsors/tim-hub">Support Us</a>
+
+<br/>
+<br/>
+
+<span class="setting-item-description">
+Obsidian Bible Reference  is proudly powered by 
+    <a href="https://antioch.tech/obsidian-bible-reference/">
+        <img src="https://antioch.tech/wp-content/uploads/2023/10/logo_128.png" alt="Antioch Tech logo" class="logo"> Antioch Tech
+    </a> 
+</span>
+
     `
     })
 
@@ -78,7 +90,7 @@ export class BibleReferenceSettingTab extends PluginSettingTab {
     }
     EventStats.logUIOpen(
       'settingsOpen',
-      { key: 'open', value: 1 },
+      {key: 'open', value: 1},
       this.plugin.settings.optOutToEvents
     )
   }
@@ -102,7 +114,7 @@ export class BibleReferenceSettingTab extends PluginSettingTab {
   private displayExpertSettings(): void {
     if (this.expertSettingContainer) {
       this.expertSettingContainer.empty()
-      this.expertSettingContainer.createEl('h2', { text: 'Expert Settings' })
+      this.expertSettingContainer.createEl('h2', {text: 'Expert Settings'})
 
       new Setting(this.expertSettingContainer)
         .setName('Add a Book Tag')
@@ -115,7 +127,7 @@ export class BibleReferenceSettingTab extends PluginSettingTab {
               await this.plugin.saveSettings()
               EventStats.logSettingChange(
                 'changeVerseFormatting',
-                { key: `book-tagging-${value}`, value: 1 },
+                {key: `book-tagging-${value}`, value: 1},
                 this.plugin.settings.optOutToEvents
               )
             })
@@ -131,7 +143,7 @@ export class BibleReferenceSettingTab extends PluginSettingTab {
               await this.plugin.saveSettings()
               EventStats.logSettingChange(
                 'changeVerseFormatting',
-                { key: `chapter-tagging-${value}`, value: 1 },
+                {key: `chapter-tagging-${value}`, value: 1},
                 this.plugin.settings.optOutToEvents
               )
             })
@@ -231,7 +243,7 @@ export class BibleReferenceSettingTab extends PluginSettingTab {
             new Notice(`Bible Reference - use Version ${value.toUpperCase()}`)
             EventStats.logSettingChange(
               'changeVersion',
-              { key: value, value: 1 },
+              {key: value, value: 1},
               this.plugin.settings.optOutToEvents
             )
           })
@@ -258,7 +270,7 @@ export class BibleReferenceSettingTab extends PluginSettingTab {
         dropdown
           .setValue(
             this.plugin.settings.bibleVersionStatusIndicator ??
-              BibleVersionNameLengthEnum.Short
+            BibleVersionNameLengthEnum.Short
           )
           .onChange(async (value) => {
             this.plugin.settings.bibleVersionStatusIndicator =
@@ -270,7 +282,7 @@ export class BibleReferenceSettingTab extends PluginSettingTab {
             ])
             EventStats.logSettingChange(
               'others',
-              { key: `version-status-indicator-${value}`, value: 1 },
+              {key: `version-status-indicator-${value}`, value: 1},
               this.plugin.settings.optOutToEvents
             )
           })
@@ -283,14 +295,14 @@ export class BibleReferenceSettingTab extends PluginSettingTab {
       .setDesc('Where to put the reference link of the Bible')
       .addDropdown((dropdown: DropdownComponent) => {
         BibleVerseReferenceLinkPositionCollection.forEach(
-          ({ name, description }) => {
+          ({name, description}) => {
             dropdown.addOption(name, description)
           }
         )
         dropdown
           .setValue(
             this.plugin.settings.referenceLinkPosition ??
-              BibleVerseReferenceLinkPosition.None
+            BibleVerseReferenceLinkPosition.None
           )
           .onChange(async (value) => {
             this.plugin.settings.referenceLinkPosition =
@@ -300,7 +312,7 @@ export class BibleReferenceSettingTab extends PluginSettingTab {
             new Notice('Bible Reference Settings Updated ')
             EventStats.logSettingChange(
               'changeVerseFormatting',
-              { key: `link-position-${value}`, value: 1 },
+              {key: `link-position-${value}`, value: 1},
               this.plugin.settings.optOutToEvents
             )
           })
@@ -314,7 +326,7 @@ export class BibleReferenceSettingTab extends PluginSettingTab {
         'Sets how to format the verses in Obsidian, either line by line or in 1 paragraph'
       )
       .addDropdown((dropdown: DropdownComponent) => {
-        BibleVerseFormatCollection.forEach(({ name, description }) => {
+        BibleVerseFormatCollection.forEach(({name, description}) => {
           dropdown.addOption(name, description)
         })
         dropdown
@@ -328,7 +340,7 @@ export class BibleReferenceSettingTab extends PluginSettingTab {
             new Notice('Bible Verse Format Settings Updated')
             EventStats.logSettingChange(
               'changeVerseFormatting',
-              { key: `verse-format-${value}`, value: 1 },
+              {key: `verse-format-${value}`, value: 1},
               this.plugin.settings.optOutToEvents
             )
           })
@@ -340,13 +352,13 @@ export class BibleReferenceSettingTab extends PluginSettingTab {
       .setName('Verse Number Formatting Options')
       .setDesc('Sets how to format the verse numbers in Obsidian')
       .addDropdown((dropdown: DropdownComponent) => {
-        BibleVerseNumberFormatCollection.forEach(({ name, description }) => {
+        BibleVerseNumberFormatCollection.forEach(({name, description}) => {
           dropdown.addOption(name, description)
         })
         dropdown
           .setValue(
             this.plugin.settings.verseNumberFormatting ??
-              BibleVerseNumberFormat.Period
+            BibleVerseNumberFormat.Period
           )
           .onChange(async (value) => {
             this.plugin.settings.verseNumberFormatting =
@@ -356,7 +368,7 @@ export class BibleReferenceSettingTab extends PluginSettingTab {
             new Notice('Bible Verse Format Number Settings Updated')
             EventStats.logSettingChange(
               'changeVerseFormatting',
-              { key: `verse-number-format-${value}`, value: 1 },
+              {key: `verse-number-format-${value}`, value: 1},
               this.plugin.settings.optOutToEvents
             )
           })
@@ -384,7 +396,7 @@ export class BibleReferenceSettingTab extends PluginSettingTab {
           await this.plugin.saveSettings()
           EventStats.logSettingChange(
             'changeVerseFormatting',
-            { key: `collapsible-${value}`, value: 1 },
+            {key: `collapsible-${value}`, value: 1},
             this.plugin.settings.optOutToEvents
           )
         })
@@ -410,7 +422,7 @@ export class BibleReferenceSettingTab extends PluginSettingTab {
             pluginEvent.trigger('bible-reference:settings:re-render', [])
             EventStats.logSettingChange(
               'others',
-              { key: `displayBibleIconPrefix-${value}`, value: 1 },
+              {key: `displayBibleIconPrefix-${value}`, value: 1},
               this.plugin.settings.optOutToEvents
             )
           })
@@ -437,42 +449,42 @@ export class BibleReferenceSettingTab extends PluginSettingTab {
 
   private setUpBookTagging(): void {
     this.expertSettingContainer &&
-      new Setting(this.expertSettingContainer)
-        .setName('Add a Book Tag')
-        .setDesc('Add a hidden book tag at bottom, for example #John')
-        .addToggle((toggle) =>
-          toggle
-            .setValue(!!this.plugin.settings?.bookTagging)
-            .onChange(async (value) => {
-              this.plugin.settings.bookTagging = value
-              await this.plugin.saveSettings()
-              EventStats.logSettingChange(
-                'changeVerseFormatting',
-                { key: `book-tagging-${value}`, value: 1 },
-                this.plugin.settings.optOutToEvents
-              )
-            })
-        )
+    new Setting(this.expertSettingContainer)
+      .setName('Add a Book Tag')
+      .setDesc('Add a hidden book tag at bottom, for example #John')
+      .addToggle((toggle) =>
+        toggle
+          .setValue(!!this.plugin.settings?.bookTagging)
+          .onChange(async (value) => {
+            this.plugin.settings.bookTagging = value
+            await this.plugin.saveSettings()
+            EventStats.logSettingChange(
+              'changeVerseFormatting',
+              {key: `book-tagging-${value}`, value: 1},
+              this.plugin.settings.optOutToEvents
+            )
+          })
+      )
   }
 
   private setUpChapterTagging(): void {
     this.expertSettingContainer &&
-      new Setting(this.expertSettingContainer)
-        .setName('Add a Chapter Tag')
-        .setDesc('Add a hidden chapter tag at bottom, for example #John1')
-        .addToggle((toggle) =>
-          toggle
-            .setValue(!!this.plugin.settings?.chapterTagging)
-            .onChange(async (value) => {
-              this.plugin.settings.chapterTagging = value
-              await this.plugin.saveSettings()
-              EventStats.logSettingChange(
-                'changeVerseFormatting',
-                { key: `chapter-tagging-${value}`, value: 1 },
-                this.plugin.settings.optOutToEvents
-              )
-            })
-        )
+    new Setting(this.expertSettingContainer)
+      .setName('Add a Chapter Tag')
+      .setDesc('Add a hidden chapter tag at bottom, for example #John1')
+      .addToggle((toggle) =>
+        toggle
+          .setValue(!!this.plugin.settings?.chapterTagging)
+          .onChange(async (value) => {
+            this.plugin.settings.chapterTagging = value
+            await this.plugin.saveSettings()
+            EventStats.logSettingChange(
+              'changeVerseFormatting',
+              {key: `chapter-tagging-${value}`, value: 1},
+              this.plugin.settings.optOutToEvents
+            )
+          })
+      )
   }
 
   private setUpOptOutEventsOptions(
@@ -489,7 +501,7 @@ export class BibleReferenceSettingTab extends PluginSettingTab {
           .onChange(async (value) => {
             EventStats.logSettingChange(
               'others',
-              { key: `opt-${value ? 'out' : 'in'}`, value: 1 },
+              {key: `opt-${value ? 'out' : 'in'}`, value: 1},
               this.plugin.settings.optOutToEvents
             )
             this.plugin.settings.optOutToEvents = value

diff --git a/styles.css b/styles.css
@@ -8,3 +8,13 @@
 .obr-loading-container {
   padding: 1em;
 }
+
+
+.sponsor-button {
+  margin-right: 2em
+}
+
+
+.logo {
+  height:16px
+}