Merge pull request #17 from jhassan8/bug/episodes

bug/episodes
jhassan8 · May 7, 2023 · 3100ea6 · 3100ea6
2 parents 42585db + 7c10788
commit 3100ea6
Show file tree

Hide file tree

Showing 15 changed files with 330 additions and 527 deletions.
diff --git a/.gitignore b/.gitignore
@@ -1,11 +1,10 @@
 .project
 .settings/
-dist
 .sign
 .package
 .vscode
+.mockoon
 
-cdn/
-online/
+dist
 node_modules/
 package-lock.json
diff --git a/Crunchyroll.wgt b/Crunchyroll.wgt
diff --git a/README.md b/README.md
@@ -46,9 +46,15 @@
     - Convert To Tizen Project
 8. The app opens on the TV and will be installed.
 
-## Instalation CLI
+## Instalation CLI (recommended)
+
+### required: npm, configure device (developer mode, "on" device in "device manager")
+### veresions: online (auto-update use cdn), offline (no auto-update)
 
 1. Set tizen var
     - Linux: ```export PATH=$PATH:<your_tizen_path>/tizen-studio/tools/ide/bin```
     - Windows: ```set PATH=%PATH%;<your_tizen_path>/tizen-studio/tools/ide/bin```
-2. In project folder run: ```npm run install --tv=<name_of_tv_device_manager>```
+2. Install build dependencies: ```npm install```
+3. In project folder run:
+    - online: ```npm run start-tv-online --tv=<name_of_tv_device_manager>```
+    - offline: ```npm run start-tv --tv=<name_of_tv_device_manager>```
diff --git a/gruntfile.js b/gruntfile.js
@@ -4,26 +4,22 @@ module.exports = function (grunt) {
   grunt.initConfig({
     pkg: grunt.file.readJSON("package.json"),
 
-    clean: {
-      cdn: ["cdn"],
-      online: ["online"],
-      offline: ["offline"],
-    },
+    clean: ["dist"],
     cssmin: {
       cdn: {
         options: {
           banner: "",
         },
         files: {
-          "cdn/crunchyroll.min.css": ["**/server/css/**/*.css"],
+          "dist/crunchyroll.min.css": ["**/server/css/**/*.css"],
         },
       },
       online: {
         options: {
           banner: "",
         },
         files: {
-          "online/app.min.css": ["css/**/*.css"],
+          "dist/app.min.css": ["css/**/*.css"],
         },
       },
     },
@@ -33,11 +29,11 @@ module.exports = function (grunt) {
       },
       cdn: {
         src: ["server/js/**/*.js"],
-        dest: "cdn/crunchyroll.min.js",
+        dest: "dist/crunchyroll.min.js",
       },
       online: {
         src: ["js/**/*.js"],
-        dest: "online/app.min.js",
+        dest: "dist/app.min.js",
       },
     },
     copy: {
@@ -47,13 +43,13 @@ module.exports = function (grunt) {
             expand: true,
             cwd: "server/css/icons/webfonts",
             src: ["**/*"],
-            dest: "cdn/assets/icons",
+            dest: "dist/assets/icons",
           },
           {
             expand: true,
             cwd: "server/img/",
             src: ["**/*"],
-            dest: "cdn/assets/imgs",
+            dest: "dist/assets/imgs",
           },
         ],
       },
@@ -63,25 +59,57 @@ module.exports = function (grunt) {
             expand: true,
             cwd: "css/fonts/",
             src: ["**/*"],
-            dest: "online/fonts",
+            dest: "dist/fonts",
+          },
+          {
+            expand: true,
+            cwd: "img/",
+            src: ["**/*"],
+            dest: "dist/img",
+          },
+          {
+            src: ["index.html", "config.xml", "icon.png"],
+            dest: "dist/",
+          },
+        ],
+      },
+      offline: {
+        files: [
+          {
+            expand: true,
+            cwd: "server/",
+            src: ["**/*"],
+            dest: "dist/server",
           },
           {
             expand: true,
             cwd: "img/",
             src: ["**/*"],
-            dest: "online/img",
+            dest: "dist/img",
+          },
+          {
+            expand: true,
+            cwd: "css/",
+            src: ["**/*"],
+            dest: "dist/css",
+          },
+          {
+            expand: true,
+            cwd: "js/",
+            src: ["**/*"],
+            dest: "dist/js",
           },
           {
             src: ["index.html", "config.xml", "icon.png"],
-            dest: "online/",
+            dest: "dist/",
           },
         ],
       },
     },
     "string-replace": {
       cdn: {
         files: {
-          "cdn/": "cdn/*",
+          "dist/": "dist/*",
         },
         options: {
           replacements: [
@@ -100,7 +128,7 @@ module.exports = function (grunt) {
       },
       online: {
         files: {
-          "online/": "online/index.html",
+          "dist/": "dist/index.html",
         },
         options: {
           replacements: [
@@ -121,17 +149,18 @@ module.exports = function (grunt) {
     },
   });
   grunt.registerTask("cdn", [
-    "clean:cdn",
+    "clean",
     "uglify:cdn",
     "cssmin:cdn",
     "copy:cdn",
     "string-replace:cdn",
   ]);
   grunt.registerTask("online", [
-    "clean:online",
+    "clean",
     "uglify:online",
     "cssmin:online",
     "copy:online",
     "string-replace:online",
   ]);
+  grunt.registerTask("offline", ["clean", "copy:offline"]);
 };
diff --git a/package.json b/package.json
@@ -4,16 +4,18 @@
   "description": "## Description:",
   "main": "index.js",
   "scripts": {
-    "build": "tizen build-web -opt -out dist -e package.json layouts.gif .gitignore *.md **.github/* server/mock/* **.git/*",
+    "build": "grunt offline",
     "build-online": "grunt online",
-    "package-online": "tizen package -t wgt -- online -o .",
+    "build-cdn": "grunt cdn",
+    "deploy": "npm run build-cdn && gh-pages -d dist -b cdn",
     "package": "tizen package -t wgt -- dist -o .",
     "install-app": "tizen install -t $npm_config_tv --name Crunchyroll.wgt",
     "init": "tizen run -t $npm_config_tv -p qXuEoRvlCp.Crunchyroll",
+    "start-tv-online": "npm run build-online && npm run package && npm run install-app --tv=$npm_config_tv && npm run init --tv=$npm_config_tv",
     "start-tv": "npm run build && npm run package && npm run install-app --tv=$npm_config_tv && npm run init --tv=$npm_config_tv",
     "start": "npm run start-tv --tv=T-samsung-7.0-x86",
-    "run": "npm run start-tv --tv=LS27AM500NLXZB",
-    "deploy": "gh-pages -d cdn -b cdn"
+    "start-online": "npm run start-tv-online --tv=T-samsung-7.0-x86",
+    "run": "npm run start-tv --tv=LS27AM500NLXZB"
   },
   "repository": {
     "type": "git",

diff --git a/server/css/home.css b/server/css/home.css
@@ -423,6 +423,9 @@
   position: absolute;
   display: flex;
   background: rgba(0, 0, 0, 0.8);
+  overflow: hidden;
+  left: 0;
+  top: 0;
 }
 
 .home_episodes-screen.home_episodes-screen_content .seasons {
@@ -459,23 +462,42 @@
   padding: 15px 25px;
   opacity: 0.5;
   margin: 15px 0;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  height: 57px;
+  border: 2px solid transparent;
 }
 
 .home_episodes-screen.home_episodes-screen_content
   .seasons
   .seasons-list
-  .season.selected {
-  /* box-shadow: 0 0 25px 6px #f47521, 0 0 15px 6px #f47521 inset; */
-  border: 2px solid rgb(244, 130, 33, 0.9);
-  filter: grayscale(1);
-  opacity: 0.5;
+  .season.active {
+  opacity: 1;
+  font-weight: bolder;
+  padding-left: 50px;
+  position: relative;
+}
+
+.home_episodes-screen.home_episodes-screen_content
+  .seasons
+  .seasons-list
+  .season.active::after {
+  content: "";
+  position: absolute;
+  left: 26px;
+  top: 18px;
+  border-left: 10px solid white;
+  border-bottom: 10px solid transparent;
+  border-top: 10px solid transparent;
 }
 
 .home_episodes-screen.home_episodes-screen_content
   .seasons.active
   .seasons-list
   .season.selected {
-  filter: none;
+  border: 2px solid rgb(244, 130, 33, 0.9);
+  /* box-shadow: 0 0 25px 6px #f47521, 0 0 15px 6px #f47521 inset; */
   opacity: 1;
 }
 
@@ -555,6 +577,20 @@
   position: relative;
 }
 
+.home_episodes-screen.home_episodes-screen_content
+  .episodes
+  .episode
+  .episode-image
+  .premium {
+  position: absolute;
+  color: #f47521;
+  right: 0;
+  top: 0;
+  font-size: 35px;
+  padding: 10px 15px;
+  text-shadow: 4px 2px black;
+}
+
 .home_episodes-screen.home_episodes-screen_content
   .episodes
   .episode

diff --git a/server/css/loading.css b/server/css/loading.css
@@ -99,3 +99,40 @@
     bottom: 0px;
   }
 }
+
+#loading-screen.flat {
+  left: 0;
+  top: 0;
+  z-index: 5;
+  background: rgba(0, 0, 0, 0.7);
+}
+
+#loading-screen.flat .content .loading {
+  position: absolute;
+  left: 0;
+  right: 0;
+  top: 0;
+  bottom: 0;
+  margin: auto;
+  width: 4vw;
+  height: 5vw;
+}
+
+#loading-screen.flat .content .loading {
+  box-sizing: border-box;
+  width: 4vw;
+  height: 4vw;
+  border-radius: 100%;
+  border: 0.7rem solid rgba(255, 255, 255, 0.4);
+  border-top-color: #fff;
+  animation: spin 0.8s infinite linear;
+  transform: none;
+}
+
+
+
+@keyframes spin {
+  100% {
+    transform: rotate(360deg);
+  }
+}
diff --git a/server/js/core/player.js b/server/js/core/player.js
@@ -234,7 +234,7 @@ window.player = {
     player.pause();
     clearTimeout(player.timers.forward_rewind);
     video.showBTN("rewind");
-    player.values.forward_rewind -= player.getDuration() * 0.03;
+    player.values.forward_rewind -= player.getDuration() * 0.01;
     callback(player.values.forward_rewind);
     player.timers.forward_rewind = setTimeout(function () {
       player.getVideo().currentTime =
@@ -251,7 +251,7 @@ window.player = {
     player.pause();
     clearTimeout(player.timers.forward_rewind);
     video.showBTN("forward");
-    player.values.forward_rewind += player.getDuration() * 0.03;
+    player.values.forward_rewind += player.getDuration() * 0.01;
     callback(player.values.forward_rewind);
     player.timers.forward_rewind = setTimeout(function () {
       player.getVideo().currentTime =