diff --git a/javascript/pages/anime/51009.js b/javascript/pages/anime/51009.js
new file mode 100644
index 0000000..a029d51
--- /dev/null
+++ b/javascript/pages/anime/51009.js
@@ -0,0 +1,13 @@
+import { Screenshots } from "../watch/mod_resource.js";
+
+const url = "https://image.tmdb.org/t/p/original/fgPa2oJD8lbLaTanzlGDd32tqDE.jpg";
+
+$(`.page-loading`).css("--image", `url(${url})`);
+
+export default {
+ OnLoad: () => {
+ $('.galery-slider').prepend(``);
+ $(`.galery-slider > .slide[data-id="${Screenshots.length - 1}"]`).click();
+ Screenshots.push({ original: url });
+ }
+}
\ No newline at end of file
diff --git a/javascript/pages/anime/51122.js b/javascript/pages/anime/51122.js
index 3f33161..73c0d0e 100644
--- a/javascript/pages/anime/51122.js
+++ b/javascript/pages/anime/51122.js
@@ -10,7 +10,7 @@ if (/Android|webOS|iPhone|iPad|iPod|Opera Mini/i.test(navigator.userAgent)) {
const url = "https://image.tmdb.org/t/p/original/Ao8SbtYJbxBuzFTQFSdHF7lLmDE.jpg";
const bg = "https://image.tmdb.org/t/p/original/iCqaGYVQw9MYZap5pNgTRkdPBWf.jpg";
-$(`.page-loading`).css({ "background": `linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 1)), url('${load_image}') no-repeat center center / cover` });
+$(`.page-loading`).css("--image", `url(${load_image})`);
export default {
OnLoad: () => {
diff --git a/javascript/pages/settings.js b/javascript/pages/settings.js
index bd2592a..a255e79 100644
--- a/javascript/pages/settings.js
+++ b/javascript/pages/settings.js
@@ -92,6 +92,12 @@ const Parameters = [
name: 'Скрыть героев',
description: 'Позволяет пользователю убирать изображения персонажей для более нейтрального просмотра сайта.'
},
+ {
+ type: 'boolean',
+ param: 'customstyle',
+ name: 'Кастомизация',
+ description: 'Включить кастомные стили для некоторых аниме.'
+ },
// {
// type: 'boolean',
// param: '',
diff --git a/javascript/pages/watch.js b/javascript/pages/watch.js
index a4de3c1..8b642c9 100644
--- a/javascript/pages/watch.js
+++ b/javascript/pages/watch.js
@@ -29,11 +29,13 @@ import(`/javascript/pages/watch/mod_collection.js`);
//Авторизируем пользователя
Main(async (e) => {
- try {
- const data = await import(`/javascript/pages/anime/${$ID}.js`);
- $RULES = data.default;
- console.log(`[watch] - Custom RULES uploaded`);
- } catch { }
+ if ($PARAMETERS.anime.customstyle) {
+ try {
+ const data = await import(`/javascript/pages/anime/${$ID}.js`);
+ $RULES = data.default;
+ console.log(`[watch] - Custom RULES uploaded`);
+ } catch { }
+ }
//Проверка на существование такого ID
const check = await CheckID($ID);
diff --git a/javascript/parametrs.js b/javascript/parametrs.js
index cc7d50a..bd7cd43 100644
--- a/javascript/parametrs.js
+++ b/javascript/parametrs.js
@@ -9,6 +9,7 @@ const $PARAMETERS = {
anime: {
syncdata: true,
hidehero: false,
+ customstyle: true,
},
watch: {
dubanime: false,
diff --git a/style/css/list.css b/style/css/list.css
index eee6087..034b75f 100644
--- a/style/css/list.css
+++ b/style/css/list.css
@@ -1055,7 +1055,6 @@ body.menuver[data-orientation="90"] .span-row {
}
.app > .wrapper .anime-content .anime-list .card-loader,
.app > .wrapper .anime-content .anime-search-result .card-loader {
- max-height: 200px;
aspect-ratio: 1/1.44;
border-radius: 4px;
display: flex;
diff --git a/style/css/watch.css b/style/css/watch.css
index 3d2a281..4fadd76 100644
--- a/style/css/watch.css
+++ b/style/css/watch.css
@@ -21,10 +21,29 @@ body.loading {
left: 0;
width: 100%;
height: 100dvh;
- background: #101318;
opacity: 1;
z-index: 9999;
}
+.page-loading::before {
+ content: "";
+ position: absolute;
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ background: #101318;
+ z-index: 1;
+}
+.page-loading::after {
+ content: "";
+ position: absolute;
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ z-index: 2;
+ background: linear-gradient(rgba(0, 0, 0, 0.5), rgb(0, 0, 0)), var(--image) center center/cover no-repeat;
+}
.page-loading .loader {
position: absolute;
top: calc(50% - 32px);
@@ -33,6 +52,7 @@ body.loading {
height: 64px;
border-radius: 50%;
perspective: 800px;
+ z-index: 3;
}
.page-loading .wrapper {
max-width: 900px;
@@ -43,6 +63,7 @@ body.loading {
width: 100%;
left: 0;
right: 0;
+ z-index: 3;
}
.page-loading .wrapper .text-error {
position: absolute;
@@ -632,6 +653,12 @@ main .player-title .player-controls .btn {
background: #191C21;
}
+.spotify {
+ margin-left: 20px;
+ margin-right: 20px;
+ margin-top: 20px;
+}
+
.episodes {
margin: 20px 20px 10px 20px;
overflow: hidden;
diff --git a/style/watch.scss b/style/watch.scss
index 194561a..c2dd332 100644
--- a/style/watch.scss
+++ b/style/watch.scss
@@ -15,124 +15,7 @@ body {
}
}
-.page-loading {
- position: fixed;
- top: 0;
- left: 0;
- width: 100%;
- height: 100dvh;
- background: #101318;
- opacity: 1;
- z-index: 9999;
-
- .loader {
- position: absolute;
- top: calc(50% - 32px);
- left: calc(50% - 32px);
- width: 64px;
- height: 64px;
- border-radius: 50%;
- perspective: 800px;
- }
-
- .wrapper {
- max-width: 900px;
- margin: 0 auto;
- position: absolute;
- bottom: 20px;
- height: 4px;
- width: 100%;
- left: 0;
- right: 0;
-
- .text-error {
- position: absolute;
- bottom: 10px;
- text-align: center;
- left: 20px;
- right: 20px;
- color: #ff000057;
- font-family: "Manrope";
- font-size: 12px;
- }
-
- .progress {
- position: relative;
- height: 4px;
- margin-left: 20px;
- margin-right: 20px;
- border-radius: 3px;
- background: #ffffff07;
- overflow: hidden;
-
- .bar {
- width: 0%;
- height: 100%;
- background: #5fbff325;
- transition: 0.6s ease-in-out;
- }
- }
- }
-
- .inner {
- position: absolute;
- box-sizing: border-box;
- width: 100%;
- height: 100%;
- border-radius: 50%;
- }
-
- .inner.one {
- left: 0%;
- top: 0%;
- animation: rotate-one 1s linear infinite;
- border-bottom: 3px solid #efeffa;
- }
-
- .inner.two {
- right: 0%;
- top: 0%;
- animation: rotate-two 1s linear infinite;
- border-right: 3px solid #efeffa;
- }
-
- .inner.three {
- right: 0%;
- bottom: 0%;
- animation: rotate-three 1s linear infinite;
- border-top: 3px solid #efeffa;
- }
-
- @keyframes rotate-one {
- 0% {
- transform: rotateX(35deg) rotateY(-45deg) rotateZ(0deg);
- }
-
- 100% {
- transform: rotateX(35deg) rotateY(-45deg) rotateZ(360deg);
- }
- }
-
- @keyframes rotate-two {
- 0% {
- transform: rotateX(50deg) rotateY(10deg) rotateZ(0deg);
- }
-
- 100% {
- transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg);
- }
- }
-
- @keyframes rotate-three {
- 0% {
- transform: rotateX(35deg) rotateY(55deg) rotateZ(0deg);
- }
-
- 100% {
- transform: rotateX(35deg) rotateY(55deg) rotateZ(360deg);
- }
- }
-}
+@import './watch/pageloading';
header {
width: 100%;
@@ -748,6 +631,12 @@ main {
}
}
+.spotify {
+ margin-left: 20px;
+ margin-right: 20px;
+ margin-top: 20px;
+}
+
.episodes {
margin: 20px 20px 10px 20px;
overflow: hidden;
diff --git a/style/watch/_pageloading.scss b/style/watch/_pageloading.scss
new file mode 100644
index 0000000..d288d9b
--- /dev/null
+++ b/style/watch/_pageloading.scss
@@ -0,0 +1,142 @@
+.page-loading {
+ position: fixed;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100dvh;
+ opacity: 1;
+ z-index: 9999;
+
+
+ &::before {
+ content: '';
+ position: absolute;
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ background: #101318;
+ z-index: 1;
+ }
+
+ &::after {
+ content: '';
+ position: absolute;
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ z-index: 2;
+ background: linear-gradient(rgba(0, 0, 0, 0.5), rgb(0, 0, 0)), var(--image) center center / cover no-repeat;
+ }
+
+ .loader {
+ position: absolute;
+ top: calc(50% - 32px);
+ left: calc(50% - 32px);
+ width: 64px;
+ height: 64px;
+ border-radius: 50%;
+ perspective: 800px;
+ z-index: 3;
+ }
+
+ .wrapper {
+ max-width: 900px;
+ margin: 0 auto;
+ position: absolute;
+ bottom: 20px;
+ height: 4px;
+ width: 100%;
+ left: 0;
+ right: 0;
+ z-index: 3;
+
+ .text-error {
+ position: absolute;
+ bottom: 10px;
+ text-align: center;
+ left: 20px;
+ right: 20px;
+ color: #ff000057;
+ font-family: "Manrope";
+ font-size: 12px;
+ }
+
+ .progress {
+ position: relative;
+ height: 4px;
+ margin-left: 20px;
+ margin-right: 20px;
+ border-radius: 3px;
+ background: #ffffff07;
+ overflow: hidden;
+
+ .bar {
+ width: 0%;
+ height: 100%;
+ background: #5fbff325;
+ transition: 0.6s ease-in-out;
+ }
+ }
+ }
+
+ .inner {
+ position: absolute;
+ box-sizing: border-box;
+ width: 100%;
+ height: 100%;
+ border-radius: 50%;
+ }
+
+ .inner.one {
+ left: 0%;
+ top: 0%;
+ animation: rotate-one 1s linear infinite;
+ border-bottom: 3px solid #efeffa;
+ }
+
+ .inner.two {
+ right: 0%;
+ top: 0%;
+ animation: rotate-two 1s linear infinite;
+ border-right: 3px solid #efeffa;
+ }
+
+ .inner.three {
+ right: 0%;
+ bottom: 0%;
+ animation: rotate-three 1s linear infinite;
+ border-top: 3px solid #efeffa;
+ }
+
+ @keyframes rotate-one {
+ 0% {
+ transform: rotateX(35deg) rotateY(-45deg) rotateZ(0deg);
+ }
+
+ 100% {
+ transform: rotateX(35deg) rotateY(-45deg) rotateZ(360deg);
+ }
+ }
+
+ @keyframes rotate-two {
+ 0% {
+ transform: rotateX(50deg) rotateY(10deg) rotateZ(0deg);
+ }
+
+ 100% {
+ transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg);
+ }
+ }
+
+ @keyframes rotate-three {
+ 0% {
+ transform: rotateX(35deg) rotateY(55deg) rotateZ(0deg);
+ }
+
+ 100% {
+ transform: rotateX(35deg) rotateY(55deg) rotateZ(360deg);
+ }
+ }
+}
\ No newline at end of file
diff --git a/sw.js b/sw.js
index 252859e..d1910fa 100644
--- a/sw.js
+++ b/sw.js
@@ -1,5 +1,5 @@
-const version = '2.5.1';
-const hash = '5f177';
+const version = '2.5.2';
+const hash = 'eae05';
const cacheName = `pwa-tunime-${hash}-v${version}`;
const appShellFilesToCache = [
// Директория: /images/genres
diff --git a/watch.html b/watch.html
index d0d8846..759b6be 100644
--- a/watch.html
+++ b/watch.html
@@ -17,8 +17,7 @@
-
+