-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.js
113 lines (105 loc) · 3.36 KB
/
index.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
synctube.octosubs = class {
constructor(obj) {
this.api = obj.api;
this.path = obj.path;
if (!window.SubtitlesOctopus) {
const url = `${this.path}/subtitles-octopus.js`;
this.api.addScriptToHead(url, () => this.init());
}
}
init() {
this.apiPolyfill();
this.api.addSubtitleSupport('ass');
let instance;
this.api.notifyOnVideoRemove(item => {
if (instance) {
instance.dispose();
instance = null;
}
});
this.api.notifyOnVideoChange(item => {
if (instance) {
this.removeToggleButton();
instance.dispose();
instance = null;
}
let subsUrl = item.subs;
if (subsUrl == null || subsUrl == '') {
if (item.duration < 60 * 5) return;
if (item.url.indexOf('.mp4') == -1) return;
subsUrl = item.url.replace('.mp4', '.ass');
}
if (subsUrl.indexOf('.ass') == -1) return;
const localIp = this.api.getLocalIp();
const globalIp = this.api.getGlobalIp();
// do not need proxy for same server urls
if (item.url.indexOf(globalIp) != -1) {
// looks like we are server and connected from localhost
// use local ip instead of our external ip then
if (localIp != globalIp) subsUrl = subsUrl.replace(globalIp, localIp);
} else {
subsUrl = `/proxy?url=${encodeURI(subsUrl)}`;
}
// subsUrl = `${this.path}/test.ass`;
this.fetchStatus(subsUrl, status => {
if (status != 200) return;
const options = {
video: document.getElementById('videoplayer'),
subUrl: subsUrl,
workerUrl: `${this.path}/subtitles-octopus-worker.js`,
legacyWorkerUrl: `${this.path}/subtitles-octopus-worker-legacy.js`
};
instance = new SubtitlesOctopus(options);
this.addToggleButton();
});
});
}
fetchStatus(address, callback) {
const client = new XMLHttpRequest();
client.onload = function () {
callback(this.status);
}
client.open('HEAD', address, true);
client.send();
}
addToggleButton() {
const togglesubs = document.querySelector('#togglesubs');
if (togglesubs) return;
const button = this.nodeFromString(`
<button id="togglesubs" title="Toggle subtitles">
<ion-icon name="text"></ion-icon>
</button>
`);
button.onclick = () => {
const subsEl = document.querySelector('.libassjs-canvas-parent');
if (!subsEl) return;
if (subsEl.style.display == '') {
subsEl.style.display = 'none';
button.style.opacity = 0.5;
} else {
subsEl.style.display = '';
button.style.opacity = 1;
}
}
const togglesynch = document.querySelector('#togglesynch');
togglesynch.parentElement.insertBefore(button, togglesynch);
}
removeToggleButton() {
const togglesubs = document.querySelector('#togglesubs');
if (!togglesubs) return;
togglesubs.remove();
}
apiPolyfill() {
let api = this.api;
let host = location.hostname;
if (host === '') host = 'localhost';
if (!api.addSubtitleSupport) api.addSubtitleSupport = () => { };
if (!api.getLocalIp) api.getLocalIp = () => host;
if (!api.getGlobalIp) api.getGlobalIp = () => host;
}
nodeFromString(div) {
const wrapper = document.createElement('div');
wrapper.innerHTML = div;
return wrapper.firstElementChild;
}
}