Skip to content

Commit f65109b

Browse files
committed
Added UI, local_storage and refactored some function
1 parent 6918e26 commit f65109b

File tree

8 files changed

+354
-52
lines changed

8 files changed

+354
-52
lines changed

README.md

Lines changed: 16 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,25 +1,32 @@
11
# jut.su_next-series
22

3-
Chrome Extension for the site "jut.su" which makes auto-transition to the next series after the end of the current one
3+
Chrome Extension for the site "jut.su" which makes video auto-play and auto-transition to the next series after the end of the current one.
44

55
## How to install/use extension
66

7-
1. Install zip and unpack to a convenient location
7+
To use the extension on your phone, you can use the kiwi browser.
8+
9+
### Install
10+
11+
1. Install zip and unpack to a convenient location.
812
2. Open the chrome://extensions page.
913
3. Turn on developer mode in the top right corner.
1014
4. Click Load unpacked extension.
1115
5. Find and select the extension folder.
1216

13-
## Some Error
17+
### Use
1418

15-
1. Switching to a non-existent series
16-
![SitesErrorImg](./img/S_Error.png)
19+
![ExtensionUi](./img/UI.png)
1720

18-
The site itself solved this problem, it simply writes that the series does not exist or it has been deleted.
21+
1. "Следующая серия до титров" - auto-transition to the next series on credits, before the video end.
22+
2. "Следующая серия после конца серии" - auto-transition to the next series after the video end.
23+
3. "Пропускать заставку" - skip anime intro.
24+
25+
## Some Error
1926

20-
2. Console error after page reload
27+
1. Console error after page reload
2128
![GoogleErrorImg](./img/G_Error.png)
2229

23-
Due to Google's policy that video autoplay does not work before the user has interacted with the site.
30+
Due to Google's policy that video auto-play does not work before the user has interacted with the site.
2431

25-
After reloading the page, video autoplay does not work. But the next series will start.
32+
After reloading the page, video auto-play does not work. But the next series will start.

img/S_Error.png

-56.3 KB
Binary file not shown.

img/UI.png

50.7 KB
Loading

main.js

Lines changed: 88 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -1,64 +1,112 @@
1-
window.addEventListener("load", function() {
2-
main();
3-
});
4-
1+
window.addEventListener("load", function () {
2+
storage();
3+
});
4+
5+
function storage() {
6+
chrome.storage.local.get(
7+
["nextSeriesBeforeEndBool", "nextSeriesAfterEndBool", "skipIntroBool"],
8+
(result) => {
9+
let nextSeriesBeforeEndBool = result.nextSeriesBeforeEndBool;
10+
let nextSeriesAfterEndBool = result.nextSeriesAfterEndBool;
11+
let skipIntroBool = result.skipIntroBool;
12+
13+
if (
14+
nextSeriesBeforeEndBool == undefined ||
15+
nextSeriesAfterEndBool == undefined ||
16+
skipIntroBool == undefined
17+
) {
18+
chrome.storage.local.set({ nextSeriesBeforeEndBool: true });
19+
chrome.storage.local.set({ nextSeriesAfterEndBool: false });
20+
chrome.storage.local.set({ skipIntroBool: true });
21+
return storage();
22+
}
523

6-
let page = window.location.href;
24+
main(nextSeriesBeforeEndBool, nextSeriesAfterEndBool, skipIntroBool);
25+
}
26+
);
27+
}
728

29+
chrome.storage.onChanged.addListener(function (changes, namespace) {
30+
// console.log(changes, namespace);
31+
storage();
32+
});
833

9-
function getRefactoredEpisodeString(websitePage){
10-
let episodeString = websitePage.split("episode-");
11-
return episodeString // return example ["https://jut.su/anime/","20.html"]
34+
function getRefactoredEpisodeString(websitePage) {
35+
if (websitePage.includes("episode-")) {
36+
let urlString = websitePage.split("episode-");
37+
urlString.push("episode-");
38+
return urlString;
39+
}
40+
if (websitePage.includes("film-")) {
41+
let urlString = websitePage.split("film-");
42+
urlString.push("film-");
43+
return urlString;
44+
}
45+
return null;
1246
}
1347

1448
function getEpisodeNum(str) {
15-
let num = parseInt(str.replace(/[^\d]/g, ''));
49+
let num = parseInt(str.replace(/[^\d]/g, ""));
1650
return num; // return example 20
1751
}
1852

19-
function nextSeries(episodeString,intervalFunc){
53+
function nextSeries(episodeString, intervalFunc) {
2054
clearInterval(intervalFunc);
2155
let episodeNum = getEpisodeNum(String(episodeString[1]));
22-
window.location.href = String(episodeString[0])+ "episode-" + String(episodeNum + 1) +".html";
56+
57+
window.location.href =
58+
String(episodeString[0]) +
59+
String(episodeString[2]) +
60+
String(episodeNum + 1) +
61+
".html";
2362
}
2463

64+
function skipIntro(element, intervalFunc) {
65+
clearInterval(intervalFunc);
66+
element.click();
67+
}
2568

26-
function main(){
69+
function main(nextSeriesBeforeEndBool, nextSeriesAfterEndBool, skipIntroBool) {
70+
let page = window.location.href;
2771
let refactoredEpisodeString = getRefactoredEpisodeString(page);
2872

29-
if (refactoredEpisodeString.length != 1){ //Verification is weird but works
73+
if (refactoredEpisodeString != null) {
3074
let video = document.querySelector("#my-player_html5_api");
3175
let nextSerBtn = document.querySelector(".vjs-overlay-bottom-right");
76+
let skipIntroBtn = document.querySelector(".vjs-overlay-bottom-left");
3277

3378
video.play();
3479
video.mute = false;
35-
36-
let checkVideoEnded = setInterval(function() {
37-
if(nextSerBtn.classList.contains('vjs-hidden') != true){
38-
nextSeries(refactoredEpisodeString,checkVideoEnded);
39-
}
40-
}, 3000);//checks every 3 second if the nextSerBtn is visible
41-
42-
// let checkVideoEnded = setInterval(function() {
43-
// if(video.ended == true){
44-
// nextSeries(refactoredEpisodeString,checkVideoEnded);
45-
// }
46-
// }, 1000);//checks every second if the video is ended
4780

81+
if (skipIntroBtn) {
82+
if (skipIntroBool == true) {
83+
let checkSkipIntroBtnVisible = setInterval(function () {
84+
if (skipIntroBtn.classList.contains("vjs-hidden") != true) {
85+
skipIntro(skipIntroBtn, checkSkipIntroBtnVisible);
86+
}
87+
}, 2000);
88+
}
89+
} else {
90+
console.log("skipIntroBtn не найден.");
91+
}
92+
93+
if (nextSerBtn) {
94+
if (nextSeriesBeforeEndBool == true) {
95+
let checkVideoEnded = setInterval(function () {
96+
if (nextSerBtn.classList.contains("vjs-hidden") != true) {
97+
nextSeries(refactoredEpisodeString, checkVideoEnded);
98+
}
99+
}, 3000);
100+
}
101+
if (nextSeriesAfterEndBool == true) {
102+
let checkVideoEnded = setInterval(function () {
103+
if (video.ended == true) {
104+
nextSeries(refactoredEpisodeString, checkVideoEnded);
105+
}
106+
}, 3000);
107+
}
108+
} else {
109+
console.log("nextSerBtn не найден.");
110+
}
48111
}
49112
}
50-
51-
52-
53-
54-
55-
56-
57-
58-
59-
60-
61-
62-
63-
64-

manifest.json

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
22
"name": "jut.su - Next series",
33
"description": "Extension for the site 'jut.su' which makes auto-transition to the next series after the end of the current one",
4-
"version": "1.0",
4+
"version": "2.0",
55
"manifest_version": 3,
66
"icons": {
77

@@ -10,8 +10,10 @@
1010
"48":"./icons/48.png",
1111
"128":"./icons/128.png"
1212
},
13-
"action": {},
14-
"permissions": ["scripting", "activeTab"],
13+
"action": {
14+
"default_popup":"popup.html"
15+
},
16+
"permissions": ["scripting", "activeTab", "storage"],
1517
"content_scripts": [
1618
{
1719
"js": ["./main.js"],

popup.css

Lines changed: 143 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,143 @@
1+
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@500;700&display=swap');
2+
3+
* {
4+
padding: 0;
5+
margin: 0;
6+
box-sizing: border-box;
7+
}
8+
9+
body {
10+
-moz-user-select: none;
11+
user-select: none;
12+
font-family: 'Open Sans', sans-serif;
13+
font-weight: 500;
14+
text-align: center;
15+
min-width: 400px;
16+
width: auto;
17+
font-size: medium;
18+
background-color: #363a37;
19+
color:#9aa777;
20+
}
21+
22+
header{
23+
background: #272827;
24+
padding: 10px;
25+
font-weight: 700;
26+
}
27+
28+
main{
29+
margin: 10px;
30+
}
31+
32+
button {
33+
transition: all 0.1s;
34+
height: 40px;
35+
width: 100%;
36+
color: #000000;
37+
font-size: medium;
38+
background: #9aa777;
39+
border-width: 0px;
40+
padding: 5px;
41+
font-weight: bold;
42+
cursor: pointer;
43+
}
44+
45+
button:hover {
46+
background: #7f8865;
47+
}
48+
49+
button:active {
50+
background: #9aa777;
51+
}
52+
53+
section{
54+
margin-bottom: 15px;
55+
display: flex;
56+
flex-direction: column;
57+
align-items: flex-start;
58+
gap: 15px;
59+
}
60+
61+
62+
label{
63+
margin:0 10px;
64+
cursor: pointer;
65+
/* padding-left: 32px; */
66+
text-align: left;
67+
gap: 15px;
68+
display: flex;
69+
}
70+
71+
72+
.checkbox{
73+
appearance: none;
74+
-webkit-appearance: none;
75+
width: 22px;
76+
height: 22px;
77+
border: 2px solid #272827;
78+
background:#272827;
79+
border-radius: 25%;
80+
transition: all 0.3s ease-in-out;
81+
}
82+
83+
84+
.checkbox:checked::before {
85+
display: block;
86+
border-radius: 25%;
87+
cursor: pointer;
88+
margin-left: 2px;
89+
margin-top: -3px;
90+
content: "✔";
91+
color:rgb(255, 255, 255);
92+
font-size: 18px;
93+
z-index: 1;
94+
animation-name: change-opacity;
95+
animation-duration: 1s;
96+
97+
}
98+
99+
100+
.radio {
101+
appearance: none;
102+
-webkit-appearance: none;
103+
width: 22px;
104+
height: 22px;
105+
border: 2px solid #272827;
106+
background: #272827;
107+
border-radius: 50%;
108+
transition: all 0.3s ease-in-out;
109+
}
110+
111+
112+
.radio:checked::before {
113+
display: block;
114+
border-radius: 50%;
115+
cursor: pointer;
116+
margin: 4px auto 5px auto;
117+
content: "";
118+
z-index: 1;
119+
width: 10px;
120+
height: 10px;
121+
background: white;
122+
animation-name: change-opacity;
123+
animation-duration: 1s;
124+
125+
}
126+
127+
128+
.checkbox:checked,
129+
.radio:checked {
130+
border-color: #9aa777;
131+
background-color: #9aa777;
132+
}
133+
134+
135+
@keyframes change-opacity {
136+
0% {
137+
opacity: 0;
138+
}
139+
140+
100% {
141+
opacity: 1;
142+
}
143+
}

0 commit comments

Comments
 (0)