Improvement: Novel Updates: Fix lazyloaded images and small fixes (#1359)

* novel_updates: fixes

* novel_updates: fixes

* novel_updates: remove lazyloading for images

* novel_updates: remove script remover

* novel_updates: remove noscript images

* novel_updates: remove noscripts

* novel_updates: clean up Novel World Translations

* novel_updates: fix

* novel_updates: add Darkstar Translations

* novel_updates: add Darkstar Translations to outliers

* novel_updates: fix

* novel_updates: revert version

* novel_updates: added CSS

public/static/src/en/novelupdates/customCSS.css

@@ -8,7 +8,6 @@
     font-weight: 400;
     text-align: center;
     margin: 15px auto;
-    max-width: fit-content;
 }
 .litrpg-frame {
     border: solid #00219b;
@@ -34,8 +33,6 @@
  * Necessary to display chapterContent correctly
  */
 .letter-style {
-    min-width: 230px;
-    max-width: fit-content;
     margin: 15px auto;
     box-shadow: 0 0 10px 1px #5e636e;
     border-radius: 5px;
@@ -55,116 +52,338 @@
 }
 
 /**
- * Novel Updates -> Genesis Translations
+ * Novel Updates -> Genesis Studio
- * https://www.novelupdates.com/group/genesis-translations/
+ * https://www.novelupdates.com/group/genesis-studio/
  * Necessary to display chapterContent correctly
  */
-.game-prompt-gold-info {
+.red-box .red-text,
-    min-width: 230px;
+.blue-box .blue-text,
-    padding: 20px;
+.gold-box .gold-text,
-    box-sizing: content-box;
+.silver-box .silver-text {
-    width: fit-content;
+    display:inline-flex;
-    margin: 15px auto;
+    align-items:start;
-    border: solid #e0cc00;
+    justify-content:start;
-    box-shadow: 0 0 10px 1px #e0cc00;
+    text-align:left;
-    border-radius: 5px;
+    flex-direction:column;
-    font-family: 'Oswald', sans-serif;
+    margin-left:0;
-    background-color: #000000;
+    margin-bottom:0;
+    margin-top:0
 }
-.game-prompt-gold-info-title {
+.red-box .red-text p,
-    color: #fff;
+.blue-box .blue-text p,
-    font-weight: bold;
+.gold-box .gold-text p,
-    text-shadow: -1px 5px 13px #e0cc00, -1px 0px 10px #544d00;
+.silver-box .silver-text p {
-    border-bottom: 3px solid #fff;
+    text-align:left
-    padding-bottom: 5px;
-}
-.game-prompt-gold-info-content {
-    text-shadow: -1px 5px 13px #e0cc00, -1px 0px 10px #e0cc00;
-    color: #fff;
-    padding-top: 10px;
-}
-.game-prompt-info {
-    min-width: 230px;
-    padding: 20px;
-    box-sizing: content-box;
-    width: fit-content;
-    margin: 15px auto;
-    border: solid #00219b;
-    box-shadow: 0 0 10px 1px #00219b;
-    border-radius: 5px;
-    font-family: 'Oswald', sans-serif;
-    background-color: #000000;
-}
-.game-prompt-info-title {
-    color: #fff;
-    font-weight: bold;
-    text-shadow: -1px 5px 13px #004fff, -1px 0px 10px #002775;
-    border-bottom: 3px solid #fff;
-    padding-bottom: 5px;
-}
-.game-prompt-info-content {
-    text-shadow: -1px 5px 13px #004fff, -1px 0px 10px #002775;
-    color: #fff;
-    padding-top: 10px;
-}
-.game-prompt-info-small {
-    min-width: 230px;
-    max-width: fit-content;
-    padding: 10px 30px 10px 30px;
-    margin: 15px auto;
-    border: solid #00219b;
-    box-shadow: 0 0 10px 1px #00219b;
-    border-radius: 5px;
-    font-family: 'Oswald', sans-serif;
-    background-color: #000000;
-}
-.game-prompt-info-small-content {
-    text-shadow: -1px 5px 13px #004fff, -1px 0px 10px #002775;
-    color: #fff;
-}
-.game-prompt-silver-info {
-    min-width: 230px;
-    padding: 20px;
-    box-sizing: content-box;
-    width: fit-content;
-    margin: 15px auto;
-    border: solid #c2c2c2;
-    box-shadow: 0 0 10px 1px #737373;
-    border-radius: 5px;
-    font-family: 'Oswald', sans-serif;
-    background-color: #000000;
-}
-.game-prompt-silver-info-content {
-    text-shadow: -1px 5px 13px #b4b4b4, -1px 0px 10px #737373;
-    color: #fff;
-    padding-top: 10px;
-}
-.game-prompt-warning {
-    min-width: 230px;
-    padding: 20px;
-    box-sizing: content-box;
-    width: fit-content;
-    margin: 15px auto;
-    border: solid #750b00e3;
-    box-shadow: 0 0 20px 3px #750b0070;
-    border-radius: 5px;
-    font-family: 'Oswald', sans-serif;
-    background-color: #000000;
-}
-.game-prompt-warning-title {
-    color: #ff4348;
-    font-weight: bold;
-    text-shadow: -1px 5px 13px #ff230c, -1px 0px 10px #750b00;
-    border-bottom: 3px solid #fff;
-    padding-bottom: 5px;
-}
-.game-prompt-warning-content {
-    text-shadow: -1px 5px 13px #ff230c, -1px 0px 10px #750b00;
-    color: #fff;
-    padding-top: 10px;
 }
 .ta-center {
-    text-align: center;
+    display:flex;
+    text-align:center!important;
+    align-items:center!important;
+    justify-content:center!important;
+    margin-left:auto;
+    margin-right:auto
+}
+.ta-between {
+    align-items:center!important
+}
+.blue-box,
+.red-box,
+.gold-box,
+.silver-box {
+    overflow-wrap:break-word;
+    word-wrap:break-word;
+    word-break:break-word
+}
+.blue-box {
+    display:flex;
+    flex-direction:column;
+    justify-content:center;
+    box-sizing:content-box;
+    width:auto;
+    margin:15px auto;
+    box-shadow:0 0 10px 1px #00219b;
+    border-radius:5px;
+    background-color:#000;
+    padding:20px;
+    color:#fff;
+    font-family: Oswald Variable, serif
+}
+.blue-box div {
+    text-indent:0;
+}
+.blue-box p {
+    text-align:center;
+    text-indent:0;
+    margin-bottom:.75rem;
+    margin-top:.75rem;
+}
+.blue-title {
+    display:flex;
+    flex-direction:column;
+    text-align:center;
+    align-items:center;
+    justify-content:center;
+    padding-left:0;
+    margin-left:0;
+    color:#fff;
+    font-weight:700;
+    text-shadow:-1px 5px 13px #004fff,-1px 0 10px #002775;
+    border-bottom:3px solid #fff;
+    padding-bottom:15px;
+    margin-bottom:15px;
+}
+.blue-text {
+    display:flex;
+    flex-direction:row;
+    align-items:start;
+    justify-content:center;
+    text-shadow:-1px 5px 13px #004fff,-1px 0 10px #002775;
+    font-weight:400;
+    font-family: Quattrocento, serif
+}
+.blue-text p {
+    text-align:center;
+    text-indent:0;
+    margin-bottom:.25rem;
+    margin-top:.25rem;
+}
+.red-box {
+    display:flex;
+    flex-direction:column;
+    justify-content:center;
+    padding:20px;
+    box-sizing:content-box;
+    width:auto;
+    margin:15px auto;
+    border:solid #750b00e3;
+    box-shadow:0 0 20px 3px #750b0070;
+    border-radius:5px;
+    background-color:#000;
+    color:#fff;
+    font-family: Oswald Variable, serif
+}
+.red-box div {
+    text-indent:0;
+}
+.red-box p {
+    text-align:center;
+    text-indent:0;
+    margin-bottom:.25rem;
+    margin-top:.25rem;
+}
+.red-title {
+    display:flex;
+    flex-direction:column;
+    text-align:center;
+    align-items:center;
+    justify-content:center;
+    padding-left:0;
+    margin-left:0;
+    color:#ff4348;
+    font-weight:700;
+    text-shadow:-1px 5px 13px #ff230c,-1px 0px 10px #750b00;
+    border-bottom:3px solid #fff;
+    padding-bottom:15px;
+    margin-bottom:15px;
+}
+.red-text {
+    display:flex;
+    flex-direction:row;
+    align-items:center;
+    justify-content:center;
+    text-shadow:-1px 5px 13px #ff230c,-1px 0px 10px #750b00;
+    font-weight:400;
+    margin-left:auto;
+    margin-right:auto;
+    font-family: Quattrocento, serif
+}
+.red-text p {
+    text-align:center;
+    text-indent:0;
+    margin-bottom:.25rem;
+    margin-top:.25rem;
+}
+.gold-box {
+    display:flex;
+    flex-direction:column;
+    justify-content:center;
+    padding:20px;
+    box-sizing:content-box;
+    width:auto;
+    margin:15px auto;
+    border:solid #e0cc00;
+    box-shadow:0 0 10px 1px #e0cc00;
+    border-radius:5px;
+    background-color:#000;
+    color:#fff;
+    font-family: Oswald Variable, serif;
+}
+.gold-box div {
+    text-indent:0;
+}
+.gold-box p {
+    text-align:center;
+    text-indent:0;
+    margin-bottom:.75rem;
+    margin-top:.75rem;
+}
+.gold-title {
+    display:flex;
+    flex-direction:column;
+    text-align:center;
+    align-items:center;
+    justify-content:center;
+    padding-left:0;
+    margin-left:0;
+    color:#fff;
+    font-weight:700;
+    text-shadow:-1px 5px 13px #e0cc00,-1px 0px 10px #544d00;
+    border-bottom:3px solid #fff;
+    padding-bottom:15px;
+    margin-bottom:15px;
+}
+.gold-text {
+    display:flex;
+    flex-direction:row;
+    align-items:center;
+    justify-content:center;
+    text-align:center;
+    text-shadow:-1px 5px 13px #e0cc00,-1px 0 10px #e0cc00;
+    row-gap:1.5rem;
+    font-weight:400;
+    font-family: Quattrocento, serif
+}
+.gold-text p {
+    text-align:center;
+    text-indent:0;
+    margin-bottom:.25rem;
+    margin-top:.25rem;
+}
+.gold-letter {
+    display:flex;
+    flex-direction:column;
+    align-items:center;
+    justify-content:center;
+    text-shadow:-1px 5px 13px #e0cc00,-1px 0 10px #e0cc00;
+    row-gap:1.5rem;
+    font-weight:700;
+    font-family: Amita, serif;
+    margin-left:auto;
+    margin-right:auto
+}
+.gold-letter p {
+    text-align:center;
+    text-indent:0;
+    margin-bottom:.25rem;
+    margin-top:.25rem;
+}
+.silver-box {
+    display:flex;
+    flex-direction:column;
+    justify-content:center;
+    padding:20px;
+    box-sizing:content-box;
+    width:auto;
+    margin:15px auto;
+    border:solid #c2c2c2;
+    box-shadow:0 0 10px 1px #737373;
+    border-radius:5px;
+    background-color:#000;
+    color:#fff;
+    font-family: Oswald Variable, serif;
+}
+.silver-box div {
+    text-indent:0;
+}
+.silver-box p {
+    text-align:center;
+    text-indent:0;
+    margin-bottom:.75rem;
+    margin-top:.75rem;
+}
+.silver-title {
+    display:flex;
+    flex-direction:column;
+    text-align:center;
+    align-items:center;
+    justify-content:center;
+    padding-left:0;
+    margin-left:0;
+    color:#fff;
+    font-weight:700;
+    text-shadow:-1px 5px 13px #b4b4b4,-1px 0 10px #737373;
+    border-bottom:3px solid #fff;
+    padding-bottom:15px;
+    margin-bottom:15px;
+}
+.silver-text {
+    display:flex;
+    flex-direction:row;
+    align-items:center;
+    justify-content:center;
+    text-shadow:-1px 5px 13px #b4b4b4,-1px 0 10px #737373;
+    row-gap:1.5rem;
+    font-weight:400;
+    margin: 2rem auto;
+    font-family: Quattrocento, serif
+}
+.silver-text p {
+    text-align:center;
+    text-indent:0;
+    margin-bottom:.25rem;
+    margin-top:.25rem;
+}
+.silver-letter {
+    display:flex;
+    flex-direction:column;
+    text-align:center;
+    align-items:center;
+    justify-content:center;
+    text-shadow:-1px 5px 13px #b4b4b4,-1px 0 10px #737373;
+    row-gap:1.5rem;
+    font-weight:700;
+    margin: 2rem auto;
+    font-family: MedievalSharp, serif
+}
+.silver-letter p {
+    text-align:center;
+    text-indent:0;
+    margin-bottom:.25rem;
+    margin-top:.25rem;
+}
+.blue-text,
+.gold-text,
+.silver-text,
+.red-text,
+.blue-box,
+.red-box,
+.gold-box,
+.silver-box,
+.red-title,
+.gold-title,
+.silver-title,
+.blue-title,
+.blue-text p,
+.gold-text p,
+.silver-text p,
+.red-text p {
+    text-indent:0!important
+}
+div.red-text,
+div.gold-text,
+div.silver-text,
+div.blue-text {
+    display:flex;
+    flex-direction:column;
+    margin-bottom:2.25rem;
+    margin-top:2.25rem
+}
+.blue-box .blue-text p,
+.red-box .red-text p,
+.gold-box .gold-text p,
+.silver-box .silver-text p {
+    display:flex;
+    flex-direction:column
 }
 
 /**

src/plugins/english/novelupdates.ts

@@ -6,7 +6,7 @@ import { Plugin } from '@typings/plugin';
 class NovelUpdates implements Plugin.PluginBase {
   id = 'novelupdates';
   name = 'Novel Updates';
-  version = '0.7.11';
+  version = '0.7.12';
   icon = 'src/en/novelupdates/icon.png';
   customCSS = 'src/en/novelupdates/customCSS.css';
   site = 'https://www.novelupdates.com/';
@@ -224,6 +224,27 @@ class NovelUpdates implements Plugin.PluginBase {
         chapterContent = loadedCheerio('.chapter__content').html()!;
         chapterText = `<h2>${chapterTitle}</h2><hr><br>${chapterContent}`;
         break;
+      // Last edited in 0.7.12 - 08/12/2024
+      case 'darkstartranslations':
+        chapterTitle =
+          loadedCheerio('ol.breadcrumb li').last().text().trim() ||
+          'Title not found';
+        chapterContent = loadedCheerio('.text-left').html()!;
+
+        // Load the extracted chapter content into Cheerio
+        const chapterCheerio_darkstar = parseHTML(chapterContent);
+
+        // Add an empty row (extra <br>) after each <br> element
+        chapterCheerio_darkstar('br').each((_, el) => {
+          chapterCheerio_darkstar(el).after('<br>'); // Add one more <br> for an empty row
+        });
+
+        // Get the updated content
+        chapterContent = chapterCheerio_darkstar.html();
+
+        // Combine the title and the updated content into the final chapter text
+        chapterText = `<h2>${chapterTitle}</h2><hr><br>${chapterContent}`;
+        break;
       case 'fictionread':
         bloatElements = [
           '.content > style',
@@ -313,17 +334,17 @@ class NovelUpdates implements Plugin.PluginBase {
         /**
          * Get the chapter link from the main page
          */
-        const link_infinite = loadedCheerio('.cm-entry-summary > p > a').attr(
+        const link_infinite = loadedCheerio('article > p > a')
-          'href',
+          .first()
-        )!;
+          .attr('href')!;
         if (link_infinite) {
           const result_infinite = await fetchApi(link_infinite);
           const body_infinite = await result_infinite.text();
           loadedCheerio = parseHTML(body_infinite);
         }
-        chapterContent = loadedCheerio('.cm-entry-summary').html()!;
+        chapterContent = loadedCheerio('.hentry').html()!;
         chapterTitle =
-          loadedCheerio('.cm-entry-title').text() || 'Title not found';
+          loadedCheerio('.page-entry-title').text() || 'Title not found';
         chapterText = `<h2>${chapterTitle}</h2><hr><br>${chapterContent}`;
         break;
       case 'inoveltranslation':
@@ -377,9 +398,11 @@ class NovelUpdates implements Plugin.PluginBase {
         chapterContent = loadedCheerio('.halChap--kontenInner ').html()!;
         chapterText = `<h2>${chapterTitle}</h2><hr><br>${chapterContent}`;
         break;
+      // Last edited in 0.7.12 - 08/12/2024
       case 'novelworldtranslations':
         bloatElements = ['.separator img'];
         bloatElements.forEach(tag => loadedCheerio(tag).remove());
+
         loadedCheerio('.entry-content a')
           .filter((_, el) => {
             return (
@@ -392,12 +415,23 @@ class NovelUpdates implements Plugin.PluginBase {
           .each((_, el) => {
             loadedCheerio(el).parent().remove();
           });
+
         chapterTitle =
           loadedCheerio('.entry-title').first().text() || 'Title not found';
         chapterContent = loadedCheerio('.entry-content')
           .html()!
           .replace(/&nbsp;/g, '')
           .replace(/\n/g, '<br>');
+
+        // Load the chapter content into Cheerio and clean up empty elements
+        const chapterCheerio_novelworld = parseHTML(chapterContent);
+        chapterCheerio_novelworld('span, p, div').each((_, el) => {
+          if (chapterCheerio_novelworld(el).text().trim() === '') {
+            chapterCheerio_novelworld(el).remove();
+          }
+        });
+        chapterContent = chapterCheerio_novelworld.html()!;
+
         chapterText = `<h2>${chapterTitle}</h2><hr><br>${chapterContent}`;
         break;
       case 'raeitranslations':
@@ -508,7 +542,7 @@ class NovelUpdates implements Plugin.PluginBase {
         if (ageVerification_skydemon.includes('age verification required')) {
           throw new Error('Age verification required, please open in webview.');
         }
-        chapterTitle = `${loadedCheerio('.pl-4 h1').first().text() || 'Title not found'} | ${loadedCheerio('.pl-4 div').first().text() || 'Title not found'}`;
+        chapterTitle = `${loadedCheerio('header h2').first().text().trim() || 'Title not found'} | ${loadedCheerio('header h3').first().text().trim() || 'Title not found'}`;
         chapterContent = loadedCheerio('#startContainer + * > *')
           .first()
           .html()!;
@@ -711,6 +745,7 @@ class NovelUpdates implements Plugin.PluginBase {
     const outliers = [
       'anotivereads',
       'asuratls',
+      'darkstartranslations',
       'fictionread',
       'helscans',
       'infinitenoveltranslations',
@@ -739,6 +774,7 @@ class NovelUpdates implements Plugin.PluginBase {
      * - Anomlaously Creative (Outlier)
      * - Arcane Translations
      * - Blossom Translation
+     * - Darkstar Translations (Outlier)
      * - Dumahs Translations
      * - ElloMTL
      * - Femme Fables
@@ -839,6 +875,7 @@ class NovelUpdates implements Plugin.PluginBase {
         loadedCheerio('.td-page-content').html() ||
         loadedCheerio('.reader-content').html() ||
         loadedCheerio('#content').html() ||
+        loadedCheerio('#the-content').html() ||
         loadedCheerio('article.post').html()!;
       if (chapterTitle && chapterContent) {
         chapterText = `<h2>${chapterTitle}</h2><hr><br>${chapterContent}`;
@@ -864,6 +901,37 @@ class NovelUpdates implements Plugin.PluginBase {
       );
     }
 
+    // Parse the HTML with Cheerio
+    const chapterCheerio = parseHTML(chapterText);
+
+    // Remove unwanted elements
+    chapterCheerio('noscript').remove();
+
+    // Process the images
+    chapterCheerio('img').each((i, el) => {
+      const $el = chapterCheerio(el);
+
+      // Prioritize data-lazy-src or src for the main src attribute
+      const imgSrc = $el.attr('data-lazy-src') || $el.attr('src');
+
+      if (imgSrc) {
+        $el.attr('src', imgSrc); // Set the src value
+      }
+
+      // Prioritize data-lazy-srcset or srcset for the srcset attribute
+      const imgSrcset = $el.attr('data-lazy-srcset') || $el.attr('srcset');
+
+      if (imgSrcset) {
+        $el.attr('srcset', imgSrcset); // Set the srcset value
+      }
+
+      // Remove lazy-loading classes
+      $el.removeClass('lazyloaded');
+    });
+
+    // Extract the updated HTML
+    chapterText = chapterCheerio.html();
+
     return chapterText;
   }