Improve bookmarking

Author: Correct-Syntax

lib/models/json_to_bible.dart

@@ -22,9 +22,12 @@ abstract class JsonToBible {
   }
 
   String bookmarkIconHTML(String verseId, List<String> bookmarks) {
-    bool isBookmarked = bookmarks.contains(verseId.replaceAll('primary-', '').replaceAll('secondary-', ''));
+    verseId = verseId.replaceAll('primary-', '').replaceAll('secondary-', '');
+
+    bool isBookmarked = bookmarks.contains(verseId);
+
     String svg =
-        """<svg id="$verseId-svg" class="svg ${isBookmarked ? "bookmarked" : ""}" style="fill: ${verseId.textToHslColor()} !important;"  xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 256 256"><path d="M184,32H72A16,16,0,0,0,56,48V224a8,8,0,0,0,12.24,6.78L128,193.43l59.77,37.35A8,8,0,0,0,200,224V48A16,16,0,0,0,184,32Zm0,177.57-51.77-32.35a8,8,0,0,0-8.48,0L72,209.57V48H184Z"></path></svg>""";
+        """<svg class="svg $verseId-svg ${isBookmarked ? "bookmarked" : ""}" style="fill: ${verseId.textToHslColor()} !important;"  xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 256 256"><path d="M184,32H72A16,16,0,0,0,56,48V224a8,8,0,0,0,12.24,6.78L128,193.43l59.77,37.35A8,8,0,0,0,200,224V48A16,16,0,0,0,184,32Zm0,177.57-51.77-32.35a8,8,0,0,0-8.48,0L72,209.57V48H184Z"></path></svg>""";
     return svg;
   }
 

lib/ui/views/bookmarks/bookmarks_viewmodel.dart

@@ -28,13 +28,9 @@ class BookmarksViewModel extends BaseViewModel {
     var [bookCode, chapter, verse] = bookmarkId.split('-');
 
     _biblesService.setBook(bookCode);
+    _biblesService.setChapter(int.parse(chapter));
+    _biblesService.setVerse(int.parse(verse));
 
-    if (viewBy == ViewBy.section) {
-      _biblesService.setChapter(int.parse(chapter));
-      _biblesService.setVerse(int.parse(verse));
-    } else {
-      _biblesService.setChapter(int.parse(chapter));
-    }
     _navigationService.clearStackAndShow(Routes.readerView);
   }
 

lib/ui/views/navigation_sections_chapters/navigation_sections_chapters_viewmodel.dart

@@ -86,6 +86,7 @@ class NavigationSectionsChaptersViewModel extends BaseViewModel {
     _biblesService.addBookToRecentHistory(bookCode);
 
     _biblesService.setChapter(index);
+    _biblesService.setVerse(1);
 
     _navigationService.clearStackAndShow(Routes.readerView);
   }

lib/ui/views/reader/reader_viewmodel.dart

@@ -133,21 +133,12 @@ class ReaderViewModel extends ReactiveViewModel {
         themeName = CurrentTheme.contrast.name;
     }
 
-    // If viewBy is 'section', jump to a specific verse. Otherwise
-    // for 'chapter' we fallback on the first verse of the chapter.
     // When scrolling is linked, only ``primaryScrollToId`` is used
     // so that even with different contents lengths the primary reader
-    // area will be scrolled to the right place.
-    String scrollToId = '$bookCode-$chapterNumber-1';
-    String primaryScrollToId;
-    String secondaryScrollToId;
-    if (viewBy == ViewBy.section) {
-      scrollToId = '$bookCode-$chapterNumber-$verseNumber';
-    } else {
-      scrollToId = '$bookCode-$chapterNumber-1';
-    }
-    primaryScrollToId = 'primary-$scrollToId';
-    secondaryScrollToId = 'secondary-$scrollToId';
+    // area will still be scrolled to the right place.
+    String scrollToId = '$bookCode-$chapterNumber-$verseNumber';
+    String primaryScrollToId = 'primary-$scrollToId';
+    String secondaryScrollToId = 'secondary-$scrollToId';
 
     log('Primary ID->: $primaryScrollToId | Secondary ID->: $secondaryScrollToId');
 
@@ -516,14 +507,20 @@ class ReaderViewModel extends ReactiveViewModel {
   }
 
   Future<void> setBookmark(String bookmarkId) async {
-    // Update the icon
-    await webviewController.runJavaScript('document.getElementById("$bookmarkId-svg").classList.toggle("bookmarked");');
-
-    List<String> existingBookmarks = await _settingsService.getBookmarks();
-
     // Save ids without a specific reader area indentifier.
     bookmarkId = bookmarkId.replaceAll('primary-', '').replaceAll('secondary-', '');
 
+    // Update the icons in both reader areas.
+    await webviewController.runJavaScript('''
+      var svgElements = [...document.getElementsByClassName("$bookmarkId-svg")];
+
+      svgElements.forEach((ele) => {
+        ele.classList.toggle("bookmarked");
+      });
+    ''');
+
+    List<String> existingBookmarks = await _settingsService.getBookmarks();
+
     // If the bookmark already exists, remove it.
     if (existingBookmarks.contains(bookmarkId)) {
       existingBookmarks.remove(bookmarkId);