hexo-theme-shokax 0.4.4 → 0.4.6-beta1
Sign up to get free protection for your applications and to get access to all the features.
- package/CODE_OF_CONDUCT.md +128 -128
- package/CONTRIBUTING.md +58 -58
- package/LICENSE +660 -660
- package/LICENSE-shoka +21 -21
- package/README.md +99 -98
- package/README_en.MD +91 -90
- package/UsageRestrictions.md +25 -25
- package/_config.yml +381 -388
- package/_images.yml +9 -9
- package/eslint.config.mjs +55 -55
- package/index.html +231 -0
- package/languages/README.md +19 -19
- package/languages/default.yml +1 -1
- package/languages/en.yml +153 -153
- package/languages/ja.yml +153 -153
- package/languages/zh-CN.yml +153 -153
- package/languages/zh-HK.yml +153 -153
- package/languages/zh-TW.yml +153 -153
- package/layout/_alternate/atom.ejs +30 -30
- package/layout/_alternate/json.ejs +16 -16
- package/layout/_alternate/rss.ejs +34 -34
- package/layout/_mixin/breadcrumb.pug +33 -33
- package/layout/_mixin/card.pug +38 -38
- package/layout/_mixin/comment.pug +6 -6
- package/layout/_mixin/postmeta.pug +29 -29
- package/layout/_mixin/segment.pug +35 -35
- package/layout/_mixin/sidebar.pug +40 -40
- package/layout/_mixin/widgets.pug +28 -28
- package/layout/_partials/footer.pug +43 -43
- package/layout/_partials/head/head.pug +55 -56
- package/layout/_partials/head/head_com.pug +24 -24
- package/layout/_partials/head/pwa.pug +18 -18
- package/layout/_partials/header.pug +18 -18
- package/layout/_partials/layout.pug +140 -140
- package/layout/_partials/loading.pug +13 -13
- package/layout/_partials/pagination.pug +4 -4
- package/layout/_partials/post/copyright.pug +20 -20
- package/layout/_partials/post/footer.pug +17 -17
- package/layout/_partials/post/nav.pug +13 -13
- package/layout/_partials/post/post.pug +41 -41
- package/layout/_partials/post/reward.pug +18 -18
- package/layout/_partials/sidebar/menu.pug +37 -37
- package/layout/_partials/sidebar/overview.pug +42 -42
- package/layout/_partials/third-party/baidu-analytics.pug +11 -11
- package/layout/_partials/third-party/clarity.pug +8 -8
- package/layout/_partials/third-party/google-analytics.pug +9 -9
- package/layout/archive.pug +118 -118
- package/layout/category.pug +59 -59
- package/layout/index.pug +33 -33
- package/layout/page.pug +55 -55
- package/layout/post.pug +36 -36
- package/layout/tag.pug +43 -43
- package/meta.json +6431 -0
- package/package.json +72 -70
- package/scripts/helpers/engine.js +10 -0
- package/scripts/plugin/check.js +2 -2
- package/scripts/tags/links.js +4 -4
- package/source/assets/algolia_logo.svg +9 -9
- package/source/assets/logo.svg +16 -16
- package/source/css/_colors.styl +207 -207
- package/source/css/_common/components/components.styl +6 -6
- package/source/css/_common/components/highlight/highlight.styl +357 -357
- package/source/css/_common/components/highlight/operation.styl +21 -21
- package/source/css/_common/components/pages/collapse.styl +119 -119
- package/source/css/_common/components/pages/home.styl +391 -391
- package/source/css/_common/components/pages/pages.styl +56 -56
- package/source/css/_common/components/pages/tag-cloud.styl +12 -12
- package/source/css/_common/components/post/breadcrumb.styl +39 -39
- package/source/css/_common/components/post/copyright.styl +41 -41
- package/source/css/_common/components/post/expand.styl +263 -263
- package/source/css/_common/components/post/footer.styl +11 -11
- package/source/css/_common/components/post/header.styl +79 -79
- package/source/css/_common/components/post/nav.styl +64 -64
- package/source/css/_common/components/post/post.styl +29 -29
- package/source/css/_common/components/post/reward.styl +50 -50
- package/source/css/_common/components/post/rtl.styl +12 -12
- package/source/css/_common/components/post/tags.styl +39 -39
- package/source/css/_common/components/tags/collapse.styl +72 -72
- package/source/css/_common/components/tags/container.styl +49 -49
- package/source/css/_common/components/tags/label.styl +12 -12
- package/source/css/_common/components/tags/links.styl +77 -77
- package/source/css/_common/components/tags/list.styl +131 -131
- package/source/css/_common/components/tags/note.styl +70 -70
- package/source/css/_common/components/tags/player.styl +361 -361
- package/source/css/_common/components/tags/quiz.styl +200 -200
- package/source/css/_common/components/tags/tabs.styl +89 -89
- package/source/css/_common/components/tags/tags.styl +9 -9
- package/source/css/_common/components/third-party/loading.styl +222 -222
- package/source/css/_common/components/third-party/mermaid/class.styl +90 -90
- package/source/css/_common/components/third-party/mermaid/flowchart.styl +72 -72
- package/source/css/_common/components/third-party/mermaid/gantt.styl +251 -251
- package/source/css/_common/components/third-party/mermaid/git.styl +7 -7
- package/source/css/_common/components/third-party/mermaid/mermaid.styl +37 -37
- package/source/css/_common/components/third-party/mermaid/pie.styl +9 -9
- package/source/css/_common/components/third-party/mermaid/sequence.styl +95 -95
- package/source/css/_common/components/third-party/mermaid/state.styl +130 -130
- package/source/css/_common/components/third-party/pace.styl +18 -18
- package/source/css/_common/components/third-party/search.styl +167 -167
- package/source/css/_common/components/third-party/theme.styl +151 -151
- package/source/css/_common/components/third-party/third-party.styl +22 -22
- package/source/css/_common/components/third-party/widgets.styl +57 -57
- package/source/css/_common/outline/footer/footer.styl +67 -67
- package/source/css/_common/outline/header/brand.styl +77 -77
- package/source/css/_common/outline/header/header.styl +20 -20
- package/source/css/_common/outline/header/image.styl +85 -85
- package/source/css/_common/outline/header/menu.styl +117 -117
- package/source/css/_common/outline/header/nav.styl +81 -81
- package/source/css/_common/outline/header/right.styl +15 -15
- package/source/css/_common/outline/header/tool.styl +207 -207
- package/source/css/_common/outline/header/waves.styl +57 -57
- package/source/css/_common/outline/mobile.styl +46 -46
- package/source/css/_common/outline/outline.styl +78 -78
- package/source/css/_common/outline/sidebar/author.styl +59 -59
- package/source/css/_common/outline/sidebar/dimmer.styl +23 -23
- package/source/css/_common/outline/sidebar/menu.styl +63 -63
- package/source/css/_common/outline/sidebar/quick.styl +43 -43
- package/source/css/_common/outline/sidebar/related.styl +56 -56
- package/source/css/_common/outline/sidebar/sidebar.styl +80 -80
- package/source/css/_common/outline/sidebar/social.styl +69 -69
- package/source/css/_common/outline/sidebar/state.styl +37 -37
- package/source/css/_common/outline/sidebar/tab.styl +71 -71
- package/source/css/_common/outline/sidebar/toc.styl +47 -47
- package/source/css/_common/scaffolding/animate.styl +322 -322
- package/source/css/_common/scaffolding/base.styl +190 -190
- package/source/css/_common/scaffolding/buttons.styl +48 -48
- package/source/css/_common/scaffolding/divider.styl +36 -36
- package/source/css/_common/scaffolding/iconfont.styl +443 -443
- package/source/css/_common/scaffolding/normalize.styl +273 -273
- package/source/css/_common/scaffolding/pagination.styl +81 -81
- package/source/css/_common/scaffolding/ribbon.styl +38 -38
- package/source/css/_common/scaffolding/scaffolding.styl +14 -14
- package/source/css/_common/scaffolding/scrollbar.styl +37 -37
- package/source/css/_common/scaffolding/tables.styl +50 -50
- package/source/css/_common/scaffolding/tip.styl +19 -19
- package/source/css/_common/scaffolding/toggles.styl +59 -59
- package/source/css/_iconfont.styl +455 -455
- package/source/css/_mixins.styl +148 -148
- package/source/css/_variables.styl +89 -89
- package/source/css/app.styl +41 -41
- package/source/css/mermaid.styl +5 -5
- package/source/css/optimize.styl +5 -5
- package/source/js/_app/components/comments.js +59 -0
- package/source/js/_app/components/comments.ts +88 -89
- package/source/js/_app/components/sidebar.js +244 -0
- package/source/js/_app/components/sidebar.ts +239 -239
- package/source/js/_app/components/tcomments.js +47 -0
- package/source/js/_app/components/tcomments.ts +54 -55
- package/source/js/_app/globals/globalVars.ts +99 -99
- package/source/js/_app/globals/handles.js +105 -0
- package/source/js/_app/globals/handles.ts +124 -123
- package/source/js/_app/globals/themeColor.ts +63 -64
- package/source/js/_app/globals/thirdparty.ts +63 -63
- package/source/js/_app/globals/tools.ts +75 -75
- package/source/js/_app/library/anime.ts +110 -110
- package/source/js/_app/library/declare.d.ts +128 -133
- package/source/js/_app/library/dom.ts +28 -26
- package/source/js/_app/library/loadFile.js +43 -0
- package/source/js/_app/library/loadFile.ts +47 -43
- package/source/js/_app/library/proto.ts +137 -141
- package/source/js/_app/library/scriptPjax.ts +72 -72
- package/source/js/_app/library/storage.ts +12 -12
- package/source/js/_app/library/vue.js +52 -0
- package/source/js/_app/library/vue.ts +49 -50
- package/source/js/_app/page/common.js +45 -0
- package/source/js/_app/page/common.ts +43 -42
- package/source/js/_app/page/fancybox.js +70 -0
- package/source/js/_app/page/fancybox.ts +72 -71
- package/source/js/_app/page/post.js +253 -0
- package/source/js/_app/page/post.ts +266 -266
- package/source/js/_app/page/search.js +111 -0
- package/source/js/_app/page/search.ts +115 -115
- package/source/js/_app/page/tab.ts +60 -60
- package/source/js/_app/pjax/domInit.js +80 -0
- package/source/js/_app/pjax/domInit.ts +97 -97
- package/source/js/_app/pjax/refresh.js +137 -0
- package/source/js/_app/pjax/refresh.ts +140 -138
- package/source/js/_app/pjax/siteInit.js +115 -0
- package/source/js/_app/pjax/siteInit.ts +106 -104
- package/source/js/_app/player.js +777 -0
- package/source/js/_app/player.ts +798 -799
- package/toolbox/compiler.mjs +73 -0
- package/toolbox/hoistdep.mjs +6 -0
- package/toolbox/lib.mjs +40 -0
@@ -0,0 +1,777 @@
|
|
1
|
+
"use strict";
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
3
|
+
exports.mediaPlayer = void 0;
|
4
|
+
const globalVars_1 = require("./globals/globalVars");
|
5
|
+
const tools_1 = require("./globals/tools");
|
6
|
+
const anime_1 = require("./library/anime");
|
7
|
+
const dom_1 = require("./library/dom");
|
8
|
+
const storage_1 = require("./library/storage");
|
9
|
+
const tab_1 = require("./page/tab");
|
10
|
+
const proto_1 = require("./library/proto");
|
11
|
+
let NOWPLAYING = null;
|
12
|
+
const isMobile = /mobile/i.test(window.navigator.userAgent);
|
13
|
+
const mediaPlayer = (t, config) => {
|
14
|
+
const buttons = {
|
15
|
+
el: {},
|
16
|
+
create() {
|
17
|
+
if (!t.player.options.btns) {
|
18
|
+
return;
|
19
|
+
}
|
20
|
+
t.player.options.btns.forEach((item) => {
|
21
|
+
if (buttons.el[item]) {
|
22
|
+
return;
|
23
|
+
}
|
24
|
+
buttons.el[item] = (0, proto_1.createChild)(t, 'div', {
|
25
|
+
className: item + ' btn',
|
26
|
+
onclick(event) {
|
27
|
+
t.player.fetch().then(() => {
|
28
|
+
t.player.options.events[item](event);
|
29
|
+
});
|
30
|
+
}
|
31
|
+
});
|
32
|
+
});
|
33
|
+
}
|
34
|
+
};
|
35
|
+
const controller = {
|
36
|
+
el: null,
|
37
|
+
btns: {
|
38
|
+
mode: undefined,
|
39
|
+
volume: undefined
|
40
|
+
},
|
41
|
+
step: 'next',
|
42
|
+
create: () => {
|
43
|
+
if (!t.player.options.controls) {
|
44
|
+
return;
|
45
|
+
}
|
46
|
+
const that = controller;
|
47
|
+
t.player.options.controls.forEach((item) => {
|
48
|
+
if (that.btns[item]) {
|
49
|
+
return;
|
50
|
+
}
|
51
|
+
const opt = {
|
52
|
+
onclick(event) {
|
53
|
+
that.events[item] ? that.events[item](event) : t.player.options.events[item](event);
|
54
|
+
}
|
55
|
+
};
|
56
|
+
switch (item) {
|
57
|
+
case 'volume':
|
58
|
+
opt.className = ' ' + (source.muted ? 'off' : 'on');
|
59
|
+
opt.innerHTML = '<div class="bar"></div>';
|
60
|
+
opt['on' + utils.nameMap.dragStart] = that.events.volume;
|
61
|
+
opt.onclick = null;
|
62
|
+
break;
|
63
|
+
case 'mode':
|
64
|
+
opt.className = ' ' + t.player.options.mode;
|
65
|
+
break;
|
66
|
+
default:
|
67
|
+
opt.className = '';
|
68
|
+
break;
|
69
|
+
}
|
70
|
+
opt.className = item + opt.className + ' btn';
|
71
|
+
that.btns[item] = (0, proto_1.createChild)(that.el, 'div', opt);
|
72
|
+
});
|
73
|
+
that.btns.volume.bar = that.btns.volume.child('.bar');
|
74
|
+
},
|
75
|
+
events: {
|
76
|
+
mode(e) {
|
77
|
+
switch (t.player.options.mode) {
|
78
|
+
case 'loop':
|
79
|
+
t.player.options.mode = 'random';
|
80
|
+
break;
|
81
|
+
case 'random':
|
82
|
+
t.player.options.mode = 'order';
|
83
|
+
break;
|
84
|
+
default:
|
85
|
+
t.player.options.mode = 'loop';
|
86
|
+
}
|
87
|
+
controller.btns.mode.className = 'mode ' + t.player.options.mode + ' btn';
|
88
|
+
storage_1.$storage.set('_PlayerMode', t.player.options.mode);
|
89
|
+
},
|
90
|
+
volume(e) {
|
91
|
+
e.preventDefault();
|
92
|
+
const current = e.currentTarget;
|
93
|
+
let drag = false;
|
94
|
+
const thumbMove = (e) => {
|
95
|
+
e.preventDefault();
|
96
|
+
t.player.volume(controller.percent(e, current));
|
97
|
+
drag = true;
|
98
|
+
};
|
99
|
+
const thumbUp = (e) => {
|
100
|
+
e.preventDefault();
|
101
|
+
current.removeEventListener(utils.nameMap.dragEnd, thumbUp);
|
102
|
+
current.removeEventListener(utils.nameMap.dragMove, thumbMove);
|
103
|
+
if (drag) {
|
104
|
+
t.player.muted();
|
105
|
+
t.player.volume(controller.percent(e, current));
|
106
|
+
}
|
107
|
+
else {
|
108
|
+
if (source.muted) {
|
109
|
+
t.player.muted();
|
110
|
+
t.player.volume(source.volume);
|
111
|
+
}
|
112
|
+
else {
|
113
|
+
t.player.muted('muted');
|
114
|
+
controller.update(0);
|
115
|
+
}
|
116
|
+
}
|
117
|
+
};
|
118
|
+
current.addEventListener(utils.nameMap.dragMove, thumbMove);
|
119
|
+
current.addEventListener(utils.nameMap.dragEnd, thumbUp);
|
120
|
+
},
|
121
|
+
backward(e) {
|
122
|
+
controller.step = 'prev';
|
123
|
+
t.player.mode();
|
124
|
+
},
|
125
|
+
forward(e) {
|
126
|
+
controller.step = 'next';
|
127
|
+
t.player.mode();
|
128
|
+
}
|
129
|
+
},
|
130
|
+
update(percent) {
|
131
|
+
controller.btns.volume.className = 'volume ' + (!source.muted && percent > 0 ? 'on' : 'off') + ' btn';
|
132
|
+
(0, proto_1.setWidth)(controller.btns.volume.bar, Math.floor(percent * 100) + '%');
|
133
|
+
},
|
134
|
+
percent(e, el) {
|
135
|
+
let percentage = ((e.clientX || e.changedTouches[0].clientX) - (0, proto_1.getLeft)(el)) / (0, proto_1.getWidth)(el);
|
136
|
+
percentage = Math.max(percentage, 0);
|
137
|
+
return Math.min(percentage, 1);
|
138
|
+
}
|
139
|
+
};
|
140
|
+
const progress = {
|
141
|
+
el: null,
|
142
|
+
bar: null,
|
143
|
+
create() {
|
144
|
+
const current = playlist.current().el;
|
145
|
+
if (current) {
|
146
|
+
if (progress.el) {
|
147
|
+
progress.el.parentNode.removeClass('current')
|
148
|
+
.removeEventListener(utils.nameMap.dragStart, progress.drag);
|
149
|
+
progress.el.remove();
|
150
|
+
}
|
151
|
+
progress.el = (0, proto_1.createChild)(current, 'div', {
|
152
|
+
className: 'progress'
|
153
|
+
});
|
154
|
+
progress.el.setAttribute('data-dtime', utils.secondToTime(0));
|
155
|
+
progress.bar = (0, proto_1.createChild)(progress.el, 'div', {
|
156
|
+
className: 'bar'
|
157
|
+
});
|
158
|
+
current.addClass('current');
|
159
|
+
current.addEventListener(utils.nameMap.dragStart, progress.drag);
|
160
|
+
playlist.scroll();
|
161
|
+
}
|
162
|
+
},
|
163
|
+
update(percent) {
|
164
|
+
(0, proto_1.setWidth)(progress.bar, Math.floor(percent * 100) + '%');
|
165
|
+
progress.el.setAttribute('data-ptime', utils.secondToTime(percent * source.duration));
|
166
|
+
},
|
167
|
+
seeking(type) {
|
168
|
+
if (type) {
|
169
|
+
progress.el.addClass('seeking');
|
170
|
+
}
|
171
|
+
else {
|
172
|
+
progress.el.removeClass('seeking');
|
173
|
+
}
|
174
|
+
},
|
175
|
+
percent(e, el) {
|
176
|
+
let percentage = ((e.clientX || e.changedTouches[0].clientX) - (0, proto_1.getLeft)(el)) / (0, proto_1.getWidth)(el);
|
177
|
+
percentage = Math.max(percentage, 0);
|
178
|
+
return Math.min(percentage, 1);
|
179
|
+
},
|
180
|
+
drag(e) {
|
181
|
+
e.preventDefault();
|
182
|
+
const current = playlist.current().el;
|
183
|
+
const thumbMove = (e) => {
|
184
|
+
e.preventDefault();
|
185
|
+
const percentage = progress.percent(e, current);
|
186
|
+
progress.update(percentage);
|
187
|
+
lyrics.update(percentage * source.duration);
|
188
|
+
};
|
189
|
+
const thumbUp = (e) => {
|
190
|
+
e.preventDefault();
|
191
|
+
current.removeEventListener(utils.nameMap.dragEnd, thumbUp);
|
192
|
+
current.removeEventListener(utils.nameMap.dragMove, thumbMove);
|
193
|
+
const percentage = progress.percent(e, current);
|
194
|
+
progress.update(percentage);
|
195
|
+
t.player.seek(percentage * source.duration);
|
196
|
+
source.disableTimeupdate = false;
|
197
|
+
progress.seeking(false);
|
198
|
+
};
|
199
|
+
source.disableTimeupdate = true;
|
200
|
+
progress.seeking(true);
|
201
|
+
current.addEventListener(utils.nameMap.dragMove, thumbMove);
|
202
|
+
current.addEventListener(utils.nameMap.dragEnd, thumbUp);
|
203
|
+
}
|
204
|
+
};
|
205
|
+
const preview = {
|
206
|
+
el: null,
|
207
|
+
create() {
|
208
|
+
const current = playlist.current();
|
209
|
+
preview.el.innerHTML = '<div class="cover"><div class="disc"><img src="' + (current.cover) + '" class="blur" alt="music cover"/></div></div>' +
|
210
|
+
'<div class="info"><h4 class="title">' + current.name + '</h4><span>' + current.artist + '</span>' +
|
211
|
+
'<div class="lrc"></div></div>';
|
212
|
+
preview.el.child('.cover').addEventListener('click', t.player.options.events['play-pause']);
|
213
|
+
lyrics.create(preview.el.child('.lrc'));
|
214
|
+
}
|
215
|
+
};
|
216
|
+
let source;
|
217
|
+
const playlist = {
|
218
|
+
el: null,
|
219
|
+
data: [],
|
220
|
+
index: -1,
|
221
|
+
errnum: 0,
|
222
|
+
add: (group, list) => {
|
223
|
+
list.forEach((item) => {
|
224
|
+
item.group = group;
|
225
|
+
item.name = item.name || item.title || 'Meida name';
|
226
|
+
item.artist = item.artist || item.author || 'Anonymous';
|
227
|
+
item.cover = item.cover || item.pic;
|
228
|
+
item.type = item.type || 'normal';
|
229
|
+
playlist.data.push(item);
|
230
|
+
});
|
231
|
+
},
|
232
|
+
clear() {
|
233
|
+
playlist.data = [];
|
234
|
+
playlist.el.innerHTML = '';
|
235
|
+
if (playlist.index !== -1) {
|
236
|
+
playlist.index = -1;
|
237
|
+
t.player.fetch();
|
238
|
+
}
|
239
|
+
},
|
240
|
+
create() {
|
241
|
+
const el = playlist.el;
|
242
|
+
playlist.data.map((item, index) => {
|
243
|
+
if (item.el) {
|
244
|
+
return null;
|
245
|
+
}
|
246
|
+
const id = 'list-' + t.player._id + '-' + item.group;
|
247
|
+
let tab = (0, dom_1.$dom)('#' + id);
|
248
|
+
if (!tab) {
|
249
|
+
tab = (0, proto_1.createChild)(el, 'div', {
|
250
|
+
id,
|
251
|
+
className: t.player.group ? 'tab' : '',
|
252
|
+
innerHTML: '<ol></ol>'
|
253
|
+
});
|
254
|
+
if (t.player.group) {
|
255
|
+
tab.setAttribute('data-title', t.player.options.rawList[item.group].title);
|
256
|
+
tab.setAttribute('data-id', t.player._id);
|
257
|
+
}
|
258
|
+
}
|
259
|
+
item.el = (0, proto_1.createChild)(tab.child('ol'), 'li', {
|
260
|
+
title: item.name + ' - ' + item.artist,
|
261
|
+
innerHTML: '<span class="info"><span>' + item.name + '</span><span>' + item.artist + '</span></span>',
|
262
|
+
onclick(event) {
|
263
|
+
const current = event.currentTarget;
|
264
|
+
if (playlist.index === index && progress.el) {
|
265
|
+
if (source.paused) {
|
266
|
+
t.player.play();
|
267
|
+
}
|
268
|
+
else {
|
269
|
+
t.player.seek(source.duration * progress.percent(event, current));
|
270
|
+
}
|
271
|
+
return;
|
272
|
+
}
|
273
|
+
t.player.switch(index);
|
274
|
+
t.player.play();
|
275
|
+
}
|
276
|
+
});
|
277
|
+
return item;
|
278
|
+
});
|
279
|
+
if (__shokax_tabs__) {
|
280
|
+
(0, tab_1.tabFormat)();
|
281
|
+
}
|
282
|
+
},
|
283
|
+
current() {
|
284
|
+
return this.data[this.index];
|
285
|
+
},
|
286
|
+
scroll() {
|
287
|
+
const item = this.current();
|
288
|
+
let li = this.el.child('li.active');
|
289
|
+
li && li.removeClass('active');
|
290
|
+
let tab = this.el.child('.tab.active');
|
291
|
+
tab && tab.removeClass('active');
|
292
|
+
li = this.el.find('.nav li')[item.group];
|
293
|
+
li && li.addClass('active');
|
294
|
+
tab = this.el.find('.tab')[item.group];
|
295
|
+
tab && tab.addClass('active');
|
296
|
+
(0, anime_1.pageScroll)(item.el, item.el.offsetTop);
|
297
|
+
return this;
|
298
|
+
},
|
299
|
+
title() {
|
300
|
+
if (source.paused) {
|
301
|
+
return;
|
302
|
+
}
|
303
|
+
const current = this.current();
|
304
|
+
document.title = 'Now Playing...' + current.name + ' - ' + current.artist + ' | ' + globalVars_1.originTitle;
|
305
|
+
},
|
306
|
+
error() {
|
307
|
+
const current = this.current();
|
308
|
+
current.el.removeClass('current').addClass('error');
|
309
|
+
current.error = true;
|
310
|
+
this.errnum++;
|
311
|
+
}
|
312
|
+
};
|
313
|
+
const info = {
|
314
|
+
el: null,
|
315
|
+
create() {
|
316
|
+
if (this.el) {
|
317
|
+
return;
|
318
|
+
}
|
319
|
+
this.el = (0, proto_1.createChild)(t, 'div', {
|
320
|
+
className: 'player-info',
|
321
|
+
innerHTML: (t.player.options.type === 'audio' ? '<div class="preview"></div>' : '') + '<div class="controller"></div><div class="playlist"></div>'
|
322
|
+
}, 'after');
|
323
|
+
preview.el = this.el.child('.preview');
|
324
|
+
playlist.el = this.el.child('.playlist');
|
325
|
+
controller.el = this.el.child('.controller');
|
326
|
+
},
|
327
|
+
hide() {
|
328
|
+
const el = this.el;
|
329
|
+
el.addClass('hide');
|
330
|
+
window.setTimeout(() => {
|
331
|
+
el.removeClass('show hide');
|
332
|
+
}, 300);
|
333
|
+
}
|
334
|
+
};
|
335
|
+
const option = {
|
336
|
+
type: 'audio',
|
337
|
+
mode: 'random',
|
338
|
+
btns: ['play-pause', 'music'],
|
339
|
+
controls: ['mode', 'backward', 'play-pause', 'forward', 'volume'],
|
340
|
+
events: {
|
341
|
+
'play-pause'(event) {
|
342
|
+
if (source.paused) {
|
343
|
+
t.player.play();
|
344
|
+
}
|
345
|
+
else {
|
346
|
+
t.player.pause();
|
347
|
+
}
|
348
|
+
},
|
349
|
+
music(event) {
|
350
|
+
if (info.el.hasClass('show')) {
|
351
|
+
info.hide();
|
352
|
+
}
|
353
|
+
else {
|
354
|
+
info.el.addClass('show');
|
355
|
+
playlist.scroll().title();
|
356
|
+
}
|
357
|
+
}
|
358
|
+
}
|
359
|
+
};
|
360
|
+
const utils = {
|
361
|
+
random(len) {
|
362
|
+
return Math.floor((Math.random() * len));
|
363
|
+
},
|
364
|
+
parse(link) {
|
365
|
+
let result = [];
|
366
|
+
[
|
367
|
+
['music.163.com.*song.*id=(\\d+)', 'netease', 'song'],
|
368
|
+
['music.163.com.*album.*id=(\\d+)', 'netease', 'album'],
|
369
|
+
['music.163.com.*artist.*id=(\\d+)', 'netease', 'artist'],
|
370
|
+
['music.163.com.*playlist.*id=(\\d+)', 'netease', 'playlist'],
|
371
|
+
['music.163.com.*discover/toplist.*id=(\\d+)', 'netease', 'playlist'],
|
372
|
+
['y.qq.com.*song/(\\w+)(.html)?', 'tencent', 'song'],
|
373
|
+
['y.qq.com.*album/(\\w+)(.html)?', 'tencent', 'album'],
|
374
|
+
['y.qq.com.*singer/(\\w+)(.html)?', 'tencent', 'artist'],
|
375
|
+
['y.qq.com.*playsquare/(\\w+)(.html)?', 'tencent', 'playlist'],
|
376
|
+
['y.qq.com.*playlist/(\\w+)(.html)?', 'tencent', 'playlist'],
|
377
|
+
['xiami.com.*song/(\\w+)', 'xiami', 'song'],
|
378
|
+
['xiami.com.*album/(\\w+)', 'xiami', 'album'],
|
379
|
+
['xiami.com.*artist/(\\w+)', 'xiami', 'artist'],
|
380
|
+
['xiami.com.*collect/(\\w+)', 'xiami', 'playlist']
|
381
|
+
].forEach((rule) => {
|
382
|
+
const patt = new RegExp(rule[0]);
|
383
|
+
const res = patt.exec(link);
|
384
|
+
if (res !== null) {
|
385
|
+
result = [rule[1], rule[2], res[1]];
|
386
|
+
}
|
387
|
+
});
|
388
|
+
return result;
|
389
|
+
},
|
390
|
+
fetch(source) {
|
391
|
+
const list = [];
|
392
|
+
return new Promise((resolve, reject) => {
|
393
|
+
source.forEach((raw) => {
|
394
|
+
const meta = utils.parse(raw);
|
395
|
+
if (meta[0]) {
|
396
|
+
const skey = JSON.stringify(meta);
|
397
|
+
const playlist = storage_1.$storage.get(skey);
|
398
|
+
if (playlist) {
|
399
|
+
// list.push.apply(list, JSON.parse(playlist))
|
400
|
+
list.push(...JSON.parse(playlist));
|
401
|
+
resolve(list);
|
402
|
+
}
|
403
|
+
else {
|
404
|
+
fetch(`${globalVars_1.CONFIG.playerAPI}/meting/?server=` + meta[0] + '&type=' + meta[1] + '&id=' + meta[2] + '&r=' + Math.random())
|
405
|
+
.then((response) => {
|
406
|
+
return response.json();
|
407
|
+
}).then((json) => {
|
408
|
+
storage_1.$storage.set(skey, JSON.stringify(json));
|
409
|
+
// list.push.apply(list, json)
|
410
|
+
list.push(...json);
|
411
|
+
resolve(list);
|
412
|
+
}).catch((ex) => {
|
413
|
+
// (不)处理catch的异常
|
414
|
+
});
|
415
|
+
}
|
416
|
+
}
|
417
|
+
else {
|
418
|
+
list.push(raw);
|
419
|
+
resolve(list);
|
420
|
+
}
|
421
|
+
});
|
422
|
+
});
|
423
|
+
},
|
424
|
+
secondToTime(second) {
|
425
|
+
const add0 = (num) => {
|
426
|
+
return isNaN(num) ? '00' : (num < 10 ? '0' + num : '' + num);
|
427
|
+
};
|
428
|
+
const hour = Math.floor(second / 3600);
|
429
|
+
const min = Math.floor((second - hour * 3600) / 60);
|
430
|
+
const sec = Math.floor(second - hour * 3600 - min * 60);
|
431
|
+
return (hour > 0 ? [hour, min, sec] : [min, sec]).map(add0).join(':');
|
432
|
+
},
|
433
|
+
nameMap: {
|
434
|
+
dragStart: isMobile ? 'touchstart' : 'mousedown',
|
435
|
+
dragMove: isMobile ? 'touchmove' : 'mousemove',
|
436
|
+
dragEnd: isMobile ? 'touchend' : 'mouseup'
|
437
|
+
}
|
438
|
+
};
|
439
|
+
source = null;
|
440
|
+
t.player = {
|
441
|
+
_id: utils.random(999999),
|
442
|
+
group: true,
|
443
|
+
// 加载播放列表
|
444
|
+
load(newList) {
|
445
|
+
let d = '';
|
446
|
+
if (newList && newList.length > 0) {
|
447
|
+
if (this.options.rawList !== newList) {
|
448
|
+
this.options.rawList = newList;
|
449
|
+
playlist.clear();
|
450
|
+
// 获取新列表
|
451
|
+
this.fetch();
|
452
|
+
}
|
453
|
+
}
|
454
|
+
else {
|
455
|
+
// 没有列表时,隐藏按钮
|
456
|
+
d = 'none';
|
457
|
+
this.pause();
|
458
|
+
}
|
459
|
+
for (const el in buttons.el) {
|
460
|
+
(0, proto_1.setDisplay)(buttons.el[el], d);
|
461
|
+
}
|
462
|
+
return this;
|
463
|
+
},
|
464
|
+
fetch() {
|
465
|
+
return new Promise((resolve, reject) => {
|
466
|
+
if (playlist.data.length > 0) {
|
467
|
+
resolve(true);
|
468
|
+
}
|
469
|
+
else {
|
470
|
+
if (this.options.rawList) {
|
471
|
+
const promises = [];
|
472
|
+
this.options.rawList.forEach((raw, index) => {
|
473
|
+
promises.push(new Promise((resolve, reject) => {
|
474
|
+
let group = index;
|
475
|
+
let source;
|
476
|
+
if (!raw.list) {
|
477
|
+
group = 0;
|
478
|
+
this.group = false;
|
479
|
+
source = [raw];
|
480
|
+
}
|
481
|
+
else {
|
482
|
+
this.group = true;
|
483
|
+
source = raw.list;
|
484
|
+
}
|
485
|
+
utils.fetch(source).then((list) => {
|
486
|
+
playlist.add(group, list);
|
487
|
+
resolve(0);
|
488
|
+
});
|
489
|
+
}));
|
490
|
+
});
|
491
|
+
Promise.all(promises).then(() => {
|
492
|
+
resolve(true);
|
493
|
+
});
|
494
|
+
}
|
495
|
+
}
|
496
|
+
}).then((c) => {
|
497
|
+
if (c) {
|
498
|
+
playlist.create();
|
499
|
+
controller.create();
|
500
|
+
this.mode();
|
501
|
+
}
|
502
|
+
});
|
503
|
+
},
|
504
|
+
// 根据模式切换当前曲目index
|
505
|
+
mode() {
|
506
|
+
const total = playlist.data.length;
|
507
|
+
if (!total || playlist.errnum === total) {
|
508
|
+
return;
|
509
|
+
}
|
510
|
+
const step = controller.step === 'next' ? 1 : -1;
|
511
|
+
const next = () => {
|
512
|
+
let index = playlist.index + step;
|
513
|
+
if (index > total || index < 0) {
|
514
|
+
index = controller.step === 'next' ? 0 : total - 1;
|
515
|
+
}
|
516
|
+
playlist.index = index;
|
517
|
+
};
|
518
|
+
const random = () => {
|
519
|
+
const p = utils.random(total);
|
520
|
+
if (playlist.index !== p) {
|
521
|
+
playlist.index = p;
|
522
|
+
}
|
523
|
+
else {
|
524
|
+
next();
|
525
|
+
}
|
526
|
+
};
|
527
|
+
switch (this.options.mode) {
|
528
|
+
case 'random':
|
529
|
+
random();
|
530
|
+
break;
|
531
|
+
case 'order':
|
532
|
+
next();
|
533
|
+
break;
|
534
|
+
case 'loop':
|
535
|
+
if (controller.step) {
|
536
|
+
next();
|
537
|
+
}
|
538
|
+
if (playlist.index === -1) {
|
539
|
+
random();
|
540
|
+
}
|
541
|
+
break;
|
542
|
+
}
|
543
|
+
this.init();
|
544
|
+
},
|
545
|
+
// 直接设置当前曲目index
|
546
|
+
switch(index) {
|
547
|
+
if (typeof index === 'number' &&
|
548
|
+
index !== playlist.index &&
|
549
|
+
playlist.current() &&
|
550
|
+
!playlist.current().error) {
|
551
|
+
playlist.index = index;
|
552
|
+
this.init();
|
553
|
+
}
|
554
|
+
},
|
555
|
+
// 更新source为当前曲目index
|
556
|
+
init() {
|
557
|
+
const item = playlist.current();
|
558
|
+
if (!item || item.error) {
|
559
|
+
this.mode();
|
560
|
+
return;
|
561
|
+
}
|
562
|
+
let playing = false;
|
563
|
+
if (!source.paused) {
|
564
|
+
playing = true;
|
565
|
+
this.stop();
|
566
|
+
}
|
567
|
+
source.setAttribute('src', item.url);
|
568
|
+
source.setAttribute('title', item.name + ' - ' + item.artist);
|
569
|
+
this.volume(storage_1.$storage.get('_PlayerVolume') || '0.7');
|
570
|
+
this.muted(storage_1.$storage.get('_PlayerMuted'));
|
571
|
+
progress.create();
|
572
|
+
if (this.options.type === 'audio') {
|
573
|
+
preview.create();
|
574
|
+
}
|
575
|
+
if (playing === true) {
|
576
|
+
this.play();
|
577
|
+
}
|
578
|
+
},
|
579
|
+
play() {
|
580
|
+
NOWPLAYING && NOWPLAYING.player.pause();
|
581
|
+
if (playlist.current().error) {
|
582
|
+
this.mode();
|
583
|
+
return;
|
584
|
+
}
|
585
|
+
source.play().then(() => {
|
586
|
+
playlist.scroll();
|
587
|
+
}).catch((e) => {
|
588
|
+
// 不处理错误
|
589
|
+
});
|
590
|
+
},
|
591
|
+
pause() {
|
592
|
+
source.pause();
|
593
|
+
document.title = globalVars_1.originTitle;
|
594
|
+
},
|
595
|
+
stop() {
|
596
|
+
source.pause();
|
597
|
+
source.currentTime = 0;
|
598
|
+
document.title = globalVars_1.originTitle;
|
599
|
+
},
|
600
|
+
seek(time) {
|
601
|
+
time = Math.max(time, 0);
|
602
|
+
time = Math.min(time, source.duration);
|
603
|
+
source.currentTime = time;
|
604
|
+
progress.update(time / source.duration);
|
605
|
+
},
|
606
|
+
muted(status) {
|
607
|
+
if (status === 'muted') {
|
608
|
+
source.muted = status;
|
609
|
+
storage_1.$storage.set('_PlayerMuted', status);
|
610
|
+
controller.update(0);
|
611
|
+
}
|
612
|
+
else {
|
613
|
+
storage_1.$storage.del('_PlayerMuted');
|
614
|
+
source.muted = false;
|
615
|
+
controller.update(source.volume);
|
616
|
+
}
|
617
|
+
},
|
618
|
+
volume(percentage) {
|
619
|
+
if (!isNaN(percentage)) {
|
620
|
+
controller.update(percentage);
|
621
|
+
storage_1.$storage.set('_PlayerVolume', percentage);
|
622
|
+
source.volume = percentage;
|
623
|
+
}
|
624
|
+
},
|
625
|
+
mini() {
|
626
|
+
info.hide();
|
627
|
+
}
|
628
|
+
};
|
629
|
+
const lyrics = {
|
630
|
+
el: null,
|
631
|
+
data: null,
|
632
|
+
index: 0,
|
633
|
+
create(box) {
|
634
|
+
const current = playlist.index;
|
635
|
+
// const that = this
|
636
|
+
const raw = playlist.current().lrc;
|
637
|
+
const callback = (body) => {
|
638
|
+
if (current !== playlist.index) {
|
639
|
+
return;
|
640
|
+
}
|
641
|
+
this.data = this.parse(body);
|
642
|
+
let lrc = '';
|
643
|
+
this.data.forEach((line, index) => {
|
644
|
+
lrc += '<p' + (index === 0 ? ' class="current"' : '') + '>' + line[1] + '</p>';
|
645
|
+
});
|
646
|
+
this.el = (0, proto_1.createChild)(box, 'div', {
|
647
|
+
className: 'inner',
|
648
|
+
innerHTML: lrc
|
649
|
+
}, 'replace');
|
650
|
+
this.index = 0;
|
651
|
+
};
|
652
|
+
if (raw.startsWith('http')) {
|
653
|
+
this.fetch(raw, callback);
|
654
|
+
}
|
655
|
+
else {
|
656
|
+
callback(raw);
|
657
|
+
}
|
658
|
+
},
|
659
|
+
update(currentTime) {
|
660
|
+
if (!this.data) {
|
661
|
+
return;
|
662
|
+
}
|
663
|
+
if (this.index > this.data.length - 1 || currentTime < this.data[this.index][0] || (!this.data[this.index + 1] || currentTime >= this.data[this.index + 1][0])) {
|
664
|
+
for (let i = 0; i < this.data.length; i++) {
|
665
|
+
if (currentTime >= this.data[i][0] && (!this.data[i + 1] || currentTime < this.data[i + 1][0])) {
|
666
|
+
this.index = i;
|
667
|
+
const y = -(this.index - 1);
|
668
|
+
this.el.style.transform = 'translateY(' + y + 'rem)';
|
669
|
+
// this.el.style.webkitTransform = 'translateY(' + y + 'rem)';
|
670
|
+
this.el.getElementsByClassName('current')[0].removeClass('current');
|
671
|
+
this.el.getElementsByTagName('p')[i].addClass('current');
|
672
|
+
}
|
673
|
+
}
|
674
|
+
}
|
675
|
+
},
|
676
|
+
parse(lrc_s) {
|
677
|
+
if (lrc_s) {
|
678
|
+
lrc_s = lrc_s.replace(/([^\]^\n])\[/g, (match, p1) => {
|
679
|
+
return p1 + '\n[';
|
680
|
+
});
|
681
|
+
const lyric = lrc_s.split('\n');
|
682
|
+
let lrc = [];
|
683
|
+
const lyricLen = lyric.length;
|
684
|
+
for (let i = 0; i < lyricLen; i++) {
|
685
|
+
// match lrc time
|
686
|
+
const lrcTimes = lyric[i].match(/\[(\d{2}):(\d{2})(\.(\d{2,3}))?]/g);
|
687
|
+
// match lrc text
|
688
|
+
const lrcText = lyric[i]
|
689
|
+
.replace(/.*\[(\d{2}):(\d{2})(\.(\d{2,3}))?]/g, '')
|
690
|
+
.replace(/<(\d{2}):(\d{2})(\.(\d{2,3}))?>/g, '')
|
691
|
+
.trim();
|
692
|
+
if (lrcTimes) {
|
693
|
+
// handle multiple time tag
|
694
|
+
const timeLen = lrcTimes.length;
|
695
|
+
for (let j = 0; j < timeLen; j++) {
|
696
|
+
const oneTime = /\[(\d{2}):(\d{2})(\.(\d{2,3}))?]/.exec(lrcTimes[j]);
|
697
|
+
const min2sec = oneTime[1] * 60;
|
698
|
+
const sec2sec = parseInt(oneTime[2]);
|
699
|
+
const msec2sec = oneTime[4] ? parseInt(oneTime[4]) / ((oneTime[4] + '').length === 2 ? 100 : 1000) : 0;
|
700
|
+
const lrcTime = min2sec + sec2sec + msec2sec;
|
701
|
+
lrc.push([lrcTime, lrcText]);
|
702
|
+
}
|
703
|
+
}
|
704
|
+
}
|
705
|
+
// sort by time
|
706
|
+
lrc = lrc.filter((item) => item[1]);
|
707
|
+
lrc.sort((a, b) => a[0] - b[0]);
|
708
|
+
return lrc;
|
709
|
+
}
|
710
|
+
else {
|
711
|
+
return [];
|
712
|
+
}
|
713
|
+
},
|
714
|
+
fetch(url, callback) {
|
715
|
+
fetch(url)
|
716
|
+
.then((response) => {
|
717
|
+
return response.text();
|
718
|
+
}).then((body) => {
|
719
|
+
callback(body);
|
720
|
+
}).catch((ex) => {
|
721
|
+
// 不处理错误
|
722
|
+
});
|
723
|
+
}
|
724
|
+
};
|
725
|
+
const events = {
|
726
|
+
onerror() {
|
727
|
+
playlist.error();
|
728
|
+
t.player.mode();
|
729
|
+
},
|
730
|
+
ondurationchange() {
|
731
|
+
if (source.duration !== 1) {
|
732
|
+
progress.el.setAttribute('data-dtime', utils.secondToTime(source.duration));
|
733
|
+
}
|
734
|
+
},
|
735
|
+
onloadedmetadata() {
|
736
|
+
t.player.seek(0);
|
737
|
+
progress.el.setAttribute('data-dtime', utils.secondToTime(source.duration));
|
738
|
+
},
|
739
|
+
onplay() {
|
740
|
+
t.parentNode.addClass('playing');
|
741
|
+
(0, tools_1.showtip)(this.getAttribute('title'));
|
742
|
+
NOWPLAYING = t;
|
743
|
+
},
|
744
|
+
onpause() {
|
745
|
+
t.parentNode.removeClass('playing');
|
746
|
+
NOWPLAYING = null;
|
747
|
+
},
|
748
|
+
ontimeupdate() {
|
749
|
+
if (!this.disableTimeupdate) {
|
750
|
+
progress.update(this.currentTime / this.duration);
|
751
|
+
lyrics.update(this.currentTime);
|
752
|
+
}
|
753
|
+
},
|
754
|
+
onended(argument) {
|
755
|
+
t.player.mode();
|
756
|
+
t.player.play();
|
757
|
+
}
|
758
|
+
};
|
759
|
+
const init = (config) => {
|
760
|
+
if (t.player.created) {
|
761
|
+
return;
|
762
|
+
}
|
763
|
+
t.player.options = Object.assign(option, config);
|
764
|
+
t.player.options.mode = storage_1.$storage.get('_PlayerMode') || t.player.options.mode;
|
765
|
+
// 初始化button、controls以及click事件
|
766
|
+
buttons.create();
|
767
|
+
// 初始化audio or video
|
768
|
+
source = (0, proto_1.createChild)(t, t.player.options.type, events);
|
769
|
+
// 初始化播放列表、预览、控件按钮等
|
770
|
+
info.create();
|
771
|
+
t.parentNode.addClass(t.player.options.type);
|
772
|
+
t.player.created = true;
|
773
|
+
};
|
774
|
+
init(config);
|
775
|
+
return t;
|
776
|
+
};
|
777
|
+
exports.mediaPlayer = mediaPlayer;
|