KSPlayer: заполнение меню серий

src/main/resources/kinosearch/webapp/player.ftl

@@ -29,6 +29,6 @@
 <div id="ksplayer"></div>
 <br>
 <script type="text/javascript"> 
-    const ksplayer = new KSPlayer('ksplayer');
+    const ksplayer = new KSPlayer('ksplayer', ${json});
 </script>
 [#include "/fother.inc.ftl"]

src/main/resources/kinosearch/webapp/static/js/ksplayer.js

@@ -1,12 +1,15 @@
-const KSPlayer = function(containerId) {
+const KSPlayer = function(containerId, data) {
     /* --- FIELDS -------------- */
 
-    let videoType = 'unknown';
     let isShowTitle = false;
 
+    /* --- PRIVATE FIELDS ------ */
+
+    let titleElement;
+
     /* --- PRIVATE FUNCTIONS --- */
 
-    function createSerialMenuElement() {
+    function createSerialMenuElement(serials) {
         let div = document.createElement('div');
         div.id = 'pl-serial';
         div.className = 'dropdown';
@@ -31,13 +34,18 @@ const KSPlayer = function(containerId) {
         ul.className = 'dropdown-menu';
         ul.setAttribute('aria-labelledby', 'dropdownSerial');
 
-        let li = document.createElement('li');
+        serials.forEach(item => {
-        let a = document.createElement('a');
+            let li = document.createElement('li');
-        a.href = '#';
+            let a = document.createElement('a');
-        a.innerText = 'Serial';
+            a.href = '#';
+            a.innerText = item.title;
+            a.setAttribute('data-file', item.file);
+            a.onclick = function() { return false; }
+
+            li.appendChild(a);
+            ul.appendChild(li);
+        });
 
-        li.appendChild(a);
-        ul.appendChild(li);
         button.appendChild(text);
         button.appendChild(span);
         div.appendChild(button);
@@ -86,6 +94,11 @@ const KSPlayer = function(containerId) {
         return div;
     }
 
+    function initTitleElement() {
+        titleElement = document.createElement('h2');
+        titleElement.id = 'title';
+    }
+
     /* --- CONSTRUCTOR --------- */
 
     const containerElement = document.getElementById(containerId);
@@ -99,16 +112,20 @@ const KSPlayer = function(containerId) {
     videoElement.setAttribute('controls', 'controls');
     videoElement.setAttribute('preload', 'none');
 
-    let titleElement = document.createElement('h2');
+    if (data.hasOwnProperty('title')) {
-    titleElement.id = 'title';
+        this.setTitle(data.title);
+    }
 
-    let seasonMenu = createSeasonMenuElement();
+    if (data.type === 'simple_serial') {
-    let serialMenu = createSerialMenuElement();
+        let serialMenu = createSerialMenuElement(data.serials);
+        containerElement.appendChild(serialMenu);
+        containerElement.appendChild(document.createElement('br'));
+        containerElement.appendChild(document.createElement('br'));
+    }
+
+    // let seasonMenu = createSeasonMenuElement();
+    // containerElement.appendChild(seasonMenu);    
 
-    containerElement.appendChild(seasonMenu);
-    containerElement.appendChild(serialMenu);
-    containerElement.appendChild(document.createElement('br'));
-    containerElement.appendChild(document.createElement('br'));
     containerElement.appendChild(videoElement);
 
     /* --- FUNCTIONS ----------- */
@@ -119,13 +136,15 @@ const KSPlayer = function(containerId) {
 
     this.setTitle = function(text) {
         if (text) {
+            if (!titleElement) initTitleElement();
             titleElement.innerText = text;
+
             if (!isShowTitle) {
                 containerElement.insertBefore(titleElement, videoElement);
                 isShowTitle = true;
             }
         } else {
-            if (isShowTitle) {
+            if (isShowTitle && titleElement) {
                 containerElement.removeChild(titleElement);
                 isShowTitle = false;
             }