Update test page. Minor aesthetic error in background.js

SpaceK33z · Jul 11, 2019 · 9f29bf0 · 9f29bf0
1 parent 3fa7e2e
commit 9f29bf0
Show file tree

Hide file tree

Showing 3 changed files with 51 additions and 9 deletions.
diff --git a/src/background.js b/src/background.js
@@ -62,7 +62,7 @@ function ChangeStatus({ ITEM_ID, ITEM_TITLE, ITEM_TYPE, ID_PROVIDER, ITEM_YEAR,
 
     let FILE_TITLE = ITEM_TITLE.replace(/\-/g, ' ').replace(/[\s\:]{2,}/g, ' - ').replace(/[^\w\s\-\']+/g, ''),
             // File friendly title
-        SEARCH_TITLE = ITEM_TITLE.replace(/[\-\s]+/g, '-').replace(/[^\w\-\'\*\#]+/g, ''),
+        SEARCH_TITLE = ITEM_TITLE.replace(/[\-\s]+/g, '-').replace(/\s*&\s*/g, ' and ').replace(/[^\w\-\'\*\#]+/g, ''),
             // Search friendly title
         SEARCH_PROVIDER = /^im/i.test(ID_PROVIDER)? 'VO': /^tm/i.test(ID_PROVIDER)? 'GX': 'GG';
 

diff --git a/src/options/test/index.html b/src/options/test/index.html
@@ -116,6 +116,29 @@
                 width: 75%;
             }
 
+            #description {
+                color: #FFF;
+                font-size: 20px;
+                text-indent: 5%;
+                overflow: overlay;
+
+                left: 0;
+                padding-left: 1%;
+                position: absolute;
+                top: 0;
+
+                width: 30%;
+                height: 100%;
+            }
+
+            #frame[content=false] + #description {
+                opacity: 1 !important;
+            }
+
+            #frame[content=true] + #description {
+                display: none;
+            }
+
             /* Foot */
             #foot {
                 background: #0008;
@@ -166,13 +189,15 @@
             }
 
             #loading {
-                transition: all 0.5s;
-
                 left: calc(50% - 24px);
                 position: absolute;
                 top: calc(50% - 24px);
             }
 
+            [loading] {
+                transition: all 0.5s;
+            }
+
             [loading=true] {
                 opacity: 1;
             }
@@ -204,9 +229,12 @@
                 <a id="tvdb" target="frame"></a>
             </div>
 
+
             <iframe id="frame" name="frame" srcdoc="<style>html,body{margin:0;padding:0;overflow:hidden}</style>">
-                Frames not supported
+                iFrames are not supported by your device
             </iframe>
+
+            <div id="description"></div>
         </div>
 
         <div id="foot">

diff --git a/src/options/test/index.js b/src/options/test/index.js
@@ -46,6 +46,7 @@ function as(type) {
                 'runtime':      "1:53",
                 'genre':        "Comedy, Drama, Fantasy",
                 'release-date': "December 3, 1999 (USA)",
+                'description':  `One day at work, unsuccessful puppeteer Craig finds a portal into the head of actor John Malkovich. The portal soon becomes a passion for anybody who enters it's mad and controlling world of overtaking another human body.`,
 
                 'imdb': "tt0120601",
                 'IMDB': "vi3568894233",
@@ -65,6 +66,7 @@ function as(type) {
                 'runtime':      "0:15",
                 'genre':        "Animation, Comedy, Fantasy, Horror, Science-Fiction",
                 'release-date': "May 15, 2019 (USA)",
+                'description':  `Terrifying creatures, wicked surprises and dark comedy converge in this NSFW anthology of animated stories presented by Tim Miller and David Fincher.`,
 
                 'imdb': "tt9561862",
                 'IMDB': "vi1035648281",
@@ -81,23 +83,35 @@ document.querySelectorAll('#movie, #tv-show').forEach(element => {
     element.onmouseup = event => {
         let self = event.target;
 
+        $('#frame').setAttribute('content', false);
+
         as(self.id);
     };
 });
 
 document.querySelectorAll('[target="frame"]').forEach(element => {
     let body = document.body,
         frame = $('#frame'),
-        loading = $('#loading');
+        loading = $('#loading'),
+        description = $('#description');
 
     element.onmouseup = event => {
-        loading.setAttribute('loading', true);
-        loading.removeAttribute('style');
+        frame.setAttribute('content', true);
+
+        [loading, description]
+            .forEach(element => {
+                element.setAttribute('loading', true);
+                element.removeAttribute('style');
+            });
     }
 
     frame.onload = frame.onerror = event => {
-        loading.setAttribute('loading', false);
-        setTimeout(() => loading.setAttribute('style', 'display:none'), 500);
+
+        [loading]
+            .forEach(element => {
+                element.setAttribute('loading', false);
+                setTimeout(() => element.setAttribute('style', 'display:none'), 500);
+            });
     }
 });