eplayer 1.6.1 → 1.6.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/docs/danmaku.js +1 -1
- package/docs/eplayer.js +80 -141
- package/docs/icons/danmu-ok.svg +1 -0
- package/docs/icons/danmu-op.svg +1 -0
- package/docs/icons/danmu-x.svg +1 -0
- package/docs/icons/emoj.svg +1 -0
- package/docs/icons/fullscreen.svg +1 -0
- package/docs/icons/later.svg +1 -0
- package/docs/icons/pause.svg +1 -0
- package/docs/icons/play.svg +1 -0
- package/docs/icons/volume-ok.svg +1 -0
- package/docs/icons/volume-x.svg +1 -0
- package/docs/icons/web-fullscreen.svg +1 -0
- package/docs/index.html +3 -10
- package/package.json +1 -1
- package/docs/res/anniu1.png +0 -0
- package/docs/res/anniu2.png +0 -0
- package/docs/res/anniu3.png +0 -0
- package/docs/res/anniu4.png +0 -0
- package/docs/res/bad.png +0 -0
- package/docs/res/beiban.png +0 -0
- package/docs/res/beijing.png +0 -0
- package/docs/res/bjt1.png +0 -0
- package/docs/res/bjt2.png +0 -0
- package/docs/res/bjt3.png +0 -0
- package/docs/res/bjt4.png +0 -0
- package/docs/res/fanhuianniu.png +0 -0
- package/docs/res/good.png +0 -0
- package/docs/res/hong3.png +0 -0
- package/docs/res/huang3.png +0 -0
- package/docs/res/kaishianniu.png +0 -0
- package/docs/res/kong.png +0 -0
- package/docs/res/lan3.png +0 -0
- package/docs/res/lv3.png +0 -0
- package/docs/res/miss.png +0 -0
- package/docs/res/perfect.png +0 -0
- package/docs/res/touming.png +0 -0
package/docs/danmaku.js
CHANGED
package/docs/eplayer.js
CHANGED
|
@@ -19,12 +19,12 @@ class Eplayer extends HTMLElement {
|
|
|
19
19
|
if (name === 'src') {
|
|
20
20
|
this.src = this.$('.video').src = newVal
|
|
21
21
|
this.stream()
|
|
22
|
-
this.video.load()
|
|
22
|
+
this.$('.video').load()
|
|
23
23
|
}
|
|
24
24
|
if (name === 'type') {
|
|
25
25
|
this.type = newVal
|
|
26
26
|
this.stream()
|
|
27
|
-
this.video.load()
|
|
27
|
+
this.$('.video').load()
|
|
28
28
|
}
|
|
29
29
|
if (name === 'live') {
|
|
30
30
|
this.live = JSON.parse(newVal)
|
|
@@ -81,25 +81,21 @@ class Eplayer extends HTMLElement {
|
|
|
81
81
|
if (this.video.paused) {
|
|
82
82
|
this.video.play()
|
|
83
83
|
this.danmaku.resume()
|
|
84
|
-
this.$('.
|
|
85
|
-
this.$('.is-play').classList.replace('ep-play', 'ep-pause')
|
|
84
|
+
this.$('.is-play').setAttribute('icon-id', 'pause')
|
|
86
85
|
} else {
|
|
87
86
|
this.video.pause()
|
|
88
87
|
this.danmaku.pause()
|
|
89
|
-
this.$('.
|
|
90
|
-
this.$('.is-play').classList.replace('ep-pause', 'ep-play')
|
|
88
|
+
this.$('.is-play').setAttribute('icon-id', 'play')
|
|
91
89
|
}
|
|
92
90
|
}
|
|
93
91
|
|
|
94
92
|
volume() {
|
|
95
93
|
if (this.video.muted) {
|
|
96
94
|
this.video.muted = false
|
|
97
|
-
|
|
98
|
-
this.$('.is-volume').classList.replace('ep-volume-off', 'ep-volume')
|
|
95
|
+
this.$('.is-volume').setAttribute('icon-id', 'volume-ok')
|
|
99
96
|
} else {
|
|
100
97
|
this.video.muted = true
|
|
101
|
-
|
|
102
|
-
this.$('.is-volume').classList.replace('ep-volume', 'ep-volume-off')
|
|
98
|
+
this.$('.is-volume').setAttribute('icon-id', 'volume-x')
|
|
103
99
|
}
|
|
104
100
|
}
|
|
105
101
|
|
|
@@ -141,15 +137,8 @@ class Eplayer extends HTMLElement {
|
|
|
141
137
|
}
|
|
142
138
|
|
|
143
139
|
alow() {
|
|
144
|
-
|
|
145
|
-
this.$('.controls').style.bottom = 0
|
|
146
|
-
this.$('.ep-video').style.bottom = 70 + 'px'
|
|
140
|
+
// this.$('.controls').style.bottom = 0
|
|
147
141
|
this.$('.mark').style.cursor = 'default'
|
|
148
|
-
this.timer = setTimeout(() => {
|
|
149
|
-
this.$('.controls').style.bottom = -70 + 'px'
|
|
150
|
-
this.$('.ep-video').style.bottom = 25 + 'px'
|
|
151
|
-
this.$('.mark').style.cursor = 'none'
|
|
152
|
-
}, 5000)
|
|
153
142
|
}
|
|
154
143
|
|
|
155
144
|
keydown(e) {
|
|
@@ -178,7 +167,7 @@ class Eplayer extends HTMLElement {
|
|
|
178
167
|
}
|
|
179
168
|
|
|
180
169
|
ended() {
|
|
181
|
-
this.$('.is-play').classList.replace('ep-pause', 'ep-play')
|
|
170
|
+
// this.$('.is-play').classList.replace('ep-pause', 'ep-play')
|
|
182
171
|
}
|
|
183
172
|
|
|
184
173
|
full() {
|
|
@@ -245,6 +234,7 @@ class Eplayer extends HTMLElement {
|
|
|
245
234
|
list-style:none;
|
|
246
235
|
}
|
|
247
236
|
.eplayer,video{
|
|
237
|
+
font-family:'黑体';
|
|
248
238
|
height:100%;
|
|
249
239
|
width:100%;
|
|
250
240
|
color:var(--icons,rgba(255,255,255,0.6));
|
|
@@ -261,70 +251,42 @@ class Eplayer extends HTMLElement {
|
|
|
261
251
|
left:0;
|
|
262
252
|
right:0;
|
|
263
253
|
bottom:0;
|
|
264
|
-
padding:10px;
|
|
265
254
|
background:linear-gradient(transparent,rgba(0,0,0,.5));
|
|
266
|
-
transition: .3s ease-out;
|
|
255
|
+
transition: .3s ease-out;
|
|
256
|
+
bottom:-34px;
|
|
267
257
|
z-index:1;
|
|
268
258
|
}
|
|
259
|
+
.eplayer:hover .controls{
|
|
260
|
+
bottom:0;
|
|
261
|
+
}
|
|
269
262
|
.progress{
|
|
270
263
|
display:${this.live ? 'none' : 'block'};
|
|
271
264
|
position:relative;
|
|
272
|
-
bottom:
|
|
265
|
+
bottom:5px;
|
|
273
266
|
left:0;
|
|
274
267
|
right:0;
|
|
275
268
|
cursor:pointer;
|
|
269
|
+
transition: .3s ease-out;
|
|
270
|
+
}
|
|
271
|
+
.progress:hover .bg,.progress:hover .current,.progress:hover .buffer{
|
|
272
|
+
height:6px;
|
|
273
|
+
}
|
|
274
|
+
.progress:hover .dot,.progress:hover .cycle{
|
|
275
|
+
display:block;
|
|
276
276
|
}
|
|
277
277
|
.options{
|
|
278
278
|
display:flex;
|
|
279
279
|
align-items:center;
|
|
280
280
|
}
|
|
281
|
-
.epicon{
|
|
282
|
-
color:var(--icons,rgba(255,255,255,0.6));
|
|
283
|
-
padding:0 10px;
|
|
284
|
-
}
|
|
285
|
-
.epicon{
|
|
286
|
-
font-size:18px;
|
|
287
|
-
transition: .3s;
|
|
288
|
-
cursor:pointer;
|
|
289
|
-
}
|
|
290
|
-
.epicon:hover{
|
|
291
|
-
color:#fff;
|
|
292
|
-
}
|
|
293
281
|
.time{
|
|
294
|
-
|
|
282
|
+
display:${this.live ? 'none' : 'inline-block'};
|
|
295
283
|
position:relative;
|
|
296
|
-
|
|
297
|
-
}
|
|
298
|
-
.time b{
|
|
299
|
-
font-weight:normal;
|
|
300
|
-
}
|
|
301
|
-
.lines{
|
|
302
|
-
padding:0 10px;
|
|
303
|
-
display:flex;
|
|
304
|
-
align-items: center;
|
|
305
|
-
}
|
|
306
|
-
.line{
|
|
307
|
-
padding:0 2px;
|
|
308
|
-
cursor:pointer
|
|
309
|
-
}
|
|
310
|
-
.line i{
|
|
311
|
-
width:4px;
|
|
312
|
-
border-radius:4px;
|
|
313
|
-
display: inline-block;
|
|
314
|
-
background: var(--icons,rgba(255,255,255,0.6));
|
|
315
|
-
height: 12px;
|
|
316
|
-
transform:scaleX(0.7);
|
|
317
|
-
transition: .3s;
|
|
318
|
-
}
|
|
319
|
-
.line:hover i{
|
|
320
|
-
height:14px;
|
|
321
|
-
background:var(--theme,#946ce6);
|
|
322
|
-
}
|
|
323
|
-
.active i{
|
|
324
|
-
background:var(--theme,#946ce6);
|
|
284
|
+
font-size:15px;
|
|
325
285
|
}
|
|
326
286
|
.left{
|
|
327
287
|
flex:1;
|
|
288
|
+
display:flex;
|
|
289
|
+
align-items:center;
|
|
328
290
|
}
|
|
329
291
|
.right{
|
|
330
292
|
flex:1;
|
|
@@ -337,6 +299,7 @@ class Eplayer extends HTMLElement {
|
|
|
337
299
|
height:3px;
|
|
338
300
|
position:absolute;
|
|
339
301
|
top:0;
|
|
302
|
+
transition: .3s ease-out;
|
|
340
303
|
}
|
|
341
304
|
.bg{
|
|
342
305
|
right:0;
|
|
@@ -349,27 +312,15 @@ class Eplayer extends HTMLElement {
|
|
|
349
312
|
background:var(--buffer,rgba(255,255,255,.5));
|
|
350
313
|
}
|
|
351
314
|
.dot{
|
|
315
|
+
display:none;
|
|
352
316
|
position:absolute;
|
|
353
317
|
border-radius: 50%;
|
|
354
|
-
|
|
355
|
-
|
|
356
|
-
|
|
357
|
-
|
|
358
|
-
right
|
|
359
|
-
|
|
360
|
-
cursor:pointer;
|
|
361
|
-
z-index:1;
|
|
362
|
-
}
|
|
363
|
-
.cycle{
|
|
364
|
-
position:absolute;
|
|
365
|
-
border-radius: 50%;
|
|
366
|
-
display: block;
|
|
367
|
-
background:var(--theme,#946ce6);
|
|
368
|
-
opacity:0.3;
|
|
369
|
-
height: 15px;
|
|
370
|
-
width:15px;
|
|
371
|
-
right:-8px;
|
|
372
|
-
top:-6px;
|
|
318
|
+
background:#fff;
|
|
319
|
+
height: 12px;
|
|
320
|
+
width:12px;
|
|
321
|
+
top:-50%;
|
|
322
|
+
right:0px;
|
|
323
|
+
transform: translate(50%,0);
|
|
373
324
|
cursor:pointer;
|
|
374
325
|
z-index:1;
|
|
375
326
|
}
|
|
@@ -395,22 +346,16 @@ class Eplayer extends HTMLElement {
|
|
|
395
346
|
top: 50%;
|
|
396
347
|
left: 50%;
|
|
397
348
|
margin:-20px 0 0 -20px;
|
|
398
|
-
width:
|
|
399
|
-
height:
|
|
349
|
+
width: 30px;
|
|
350
|
+
height: 30px;
|
|
400
351
|
z-index:1;
|
|
401
|
-
|
|
352
|
+
border-top: 4px solid rgba(255, 255, 255, 0.2);
|
|
353
|
+
border-right: 4px solid rgba(255, 255, 255, 0.2);
|
|
354
|
+
border-bottom: 4px solid rgba(255, 255, 255, 0.2);
|
|
355
|
+
border-left: 4px solid #fff;
|
|
402
356
|
border-radius: 50%;
|
|
403
357
|
animation: loading 1s linear infinite;
|
|
404
358
|
}
|
|
405
|
-
.ep-video {
|
|
406
|
-
position: absolute;
|
|
407
|
-
bottom: 25px;
|
|
408
|
-
right: 20px;
|
|
409
|
-
font-size:40px;
|
|
410
|
-
color:var(--icons,rgba(255,255,255,.6));
|
|
411
|
-
z-index:1;
|
|
412
|
-
cursor: pointer;
|
|
413
|
-
}
|
|
414
359
|
.panel {
|
|
415
360
|
position: absolute;
|
|
416
361
|
bottom: 200px;
|
|
@@ -430,64 +375,65 @@ class Eplayer extends HTMLElement {
|
|
|
430
375
|
border-radius:4px;
|
|
431
376
|
background:rgba(0,0,0,.8)
|
|
432
377
|
}
|
|
433
|
-
.speed{
|
|
434
|
-
font-size:10px;
|
|
435
|
-
font-style:italic;
|
|
436
|
-
width:22px;
|
|
437
|
-
text-align:center;
|
|
438
|
-
border-radius:11px;
|
|
439
|
-
color:rgba(0,0,0,.5);
|
|
440
|
-
font-weight:900;
|
|
441
|
-
background:var(--icons,rgba(255,255,255,.8));
|
|
442
|
-
margin-left:-10px;
|
|
443
|
-
display:inline-block;
|
|
444
|
-
}
|
|
445
378
|
|
|
446
379
|
.danmaku {
|
|
447
|
-
|
|
448
|
-
|
|
449
|
-
|
|
450
|
-
|
|
451
|
-
|
|
452
|
-
|
|
453
|
-
|
|
454
|
-
|
|
455
|
-
|
|
456
|
-
|
|
457
|
-
|
|
380
|
+
position: absolute;
|
|
381
|
+
top: 0;
|
|
382
|
+
left: 0;
|
|
383
|
+
right: 0;
|
|
384
|
+
bottom: 0;
|
|
385
|
+
pointer-events: none;
|
|
386
|
+
overflow: hidden;
|
|
387
|
+
z-index: 999;
|
|
388
|
+
height:100%;
|
|
389
|
+
width:100%;
|
|
390
|
+
}
|
|
391
|
+
|
|
392
|
+
iconpark-icon{
|
|
393
|
+
margin-right:5px;
|
|
394
|
+
cursor:pointer;
|
|
395
|
+
}
|
|
396
|
+
|
|
397
|
+
em{
|
|
398
|
+
font-size: 16px;
|
|
399
|
+
font-weight:bold;
|
|
400
|
+
font-style:normal;
|
|
401
|
+
color:#fff;
|
|
402
|
+
margin:0 10px 0 8px;
|
|
403
|
+
cursor: pointer;
|
|
404
|
+
}
|
|
405
|
+
|
|
458
406
|
</style>
|
|
459
407
|
|
|
460
408
|
<div class="eplayer">
|
|
461
409
|
<div class="danmaku"></div>
|
|
462
410
|
<video id="video" class="video" src="${this.src || ''}"></video>
|
|
463
411
|
<div class="mark loading"></div>
|
|
464
|
-
<div class="controls"
|
|
412
|
+
<div class="controls">
|
|
465
413
|
<div class="progress">
|
|
466
414
|
<b class="bg"></b>
|
|
467
415
|
<b class="buffer"></b>
|
|
468
416
|
<div class="current" style="width:0">
|
|
469
417
|
<div class="dot"></div>
|
|
470
|
-
<div class="cycle"></div>
|
|
471
418
|
</div>
|
|
472
419
|
</div>
|
|
473
420
|
<div class="options">
|
|
474
421
|
<div class="left">
|
|
475
|
-
<
|
|
422
|
+
<iconpark-icon icon-id="play" size="2rem" class="is-play"></iconpark-icon>
|
|
476
423
|
<span class="time">
|
|
477
|
-
<b class="now">00:00</b
|
|
424
|
+
<b class="now">00:00</b>/<b class="total">00:00</b>
|
|
478
425
|
</span>
|
|
479
426
|
</div>
|
|
480
427
|
<div class="right">
|
|
481
|
-
<
|
|
482
|
-
<
|
|
483
|
-
|
|
484
|
-
|
|
485
|
-
|
|
486
|
-
<i class="epicon ep-full"></i>
|
|
428
|
+
<em class="speed">倍速</em>
|
|
429
|
+
<em class="pip">画中画</em>
|
|
430
|
+
<iconpark-icon icon-id="volume-ok" size="2rem" class="is-volume"></iconpark-icon>
|
|
431
|
+
<iconpark-icon icon-id="web-fullscreen" size="2rem"></iconpark-icon>
|
|
432
|
+
<iconpark-icon icon-id="fullscreen" size="2rem" class="fullscreen"></iconpark-icon>
|
|
487
433
|
</div>
|
|
488
434
|
</div>
|
|
489
435
|
</div>
|
|
490
|
-
<
|
|
436
|
+
<iconpark-icon icon-id="play"></iconpark-icon>
|
|
491
437
|
<div class="panel"></div>
|
|
492
438
|
</div>
|
|
493
439
|
`
|
|
@@ -508,19 +454,14 @@ class Eplayer extends HTMLElement {
|
|
|
508
454
|
'.current',
|
|
509
455
|
'.buffer',
|
|
510
456
|
'.is-play',
|
|
511
|
-
'.ep-video',
|
|
512
457
|
'.is-volume',
|
|
513
458
|
'.cycle',
|
|
514
459
|
'.progress',
|
|
515
460
|
'.controls',
|
|
516
461
|
'.line',
|
|
517
|
-
'.ep-pause',
|
|
518
|
-
'.ep-play',
|
|
519
|
-
'.ep-volume-off',
|
|
520
|
-
'.ep-volume',
|
|
521
462
|
'.bg',
|
|
522
463
|
'.eplayer',
|
|
523
|
-
'.
|
|
464
|
+
'.fullscreen',
|
|
524
465
|
'.panel',
|
|
525
466
|
'.speed',
|
|
526
467
|
'.pip',
|
|
@@ -556,14 +497,13 @@ class Eplayer extends HTMLElement {
|
|
|
556
497
|
this.video.onended = this.ended.bind(this)
|
|
557
498
|
this.delegate('click', {
|
|
558
499
|
'.is-volume': this.volume,
|
|
559
|
-
'.
|
|
560
|
-
'.ep-video': this.play,
|
|
500
|
+
'.fullscreen': this.full,
|
|
561
501
|
'.is-play': this.play,
|
|
562
502
|
'.ep-speed': this.speed,
|
|
563
503
|
'.speed': this.speed,
|
|
564
504
|
'.bg': this.progress,
|
|
565
505
|
'.buffer': this.progress,
|
|
566
|
-
'.
|
|
506
|
+
'.pip': this.pip,
|
|
567
507
|
})
|
|
568
508
|
this.delegate('pointerdown', {
|
|
569
509
|
'.cycle': this.down,
|
|
@@ -622,9 +562,8 @@ function isFullScreen() {
|
|
|
622
562
|
}
|
|
623
563
|
|
|
624
564
|
; (function () {
|
|
625
|
-
let link = document.createElement('
|
|
626
|
-
link.setAttribute('
|
|
627
|
-
link.setAttribute('rel', 'stylesheet')
|
|
565
|
+
let link = document.createElement('script')
|
|
566
|
+
link.setAttribute('src', 'https://lf1-cdn-tos.bytegoofy.com/obj/iconpark/icons_34101_11.6161dfd06f46009a9dea0fcffc6234bf.js')
|
|
628
567
|
document.head.appendChild(link)
|
|
629
568
|
})()
|
|
630
569
|
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
<svg width="24" height="24" fill="none" xmlns="http://www.w3.org/2000/svg" class="" viewBox="0 0 24 24"><path fill-rule="evenodd" clip-rule="evenodd" d="M4.29 6.29a2 2 0 012-2h10.693a2 2 0 012 2v5.404a5.55 5.55 0 00-2.472-.55V8.274a.6.6 0 00-.6-.6h-.771l.321-.478a.6.6 0 10-.996-.67l-.771 1.148h-.317l-.772-1.148a.6.6 0 00-.996.67l.322.478h-.775a.6.6 0 00-.6.6v3.772a.6.6 0 00.6.6h1.609a5.602 5.602 0 00-.625.69h-1.463a.6.6 0 100 1.2h.763a5.554 5.554 0 00-.443 2.181c0 .76.152 1.484.428 2.144H6.289a2 2 0 01-2-2V6.29zm11.021 4.997a5.525 5.525 0 00-.552.158h-.626v-.684h1.178v.526zM6.277 7.332a.6.6 0 01.6-.6h2.378a.6.6 0 01.6.6v2.83a.6.6 0 01-.6.6H7.477v1.157h1.778a.6.6 0 01.6.6v3.3a.6.6 0 01-.6.6H6.877a.6.6 0 010-1.2h1.778v-2.1H6.877a.6.6 0 01-.6-.6V10.16a.6.6 0 01.6-.6h1.778V7.932H6.877a.6.6 0 01-.6-.6zm5.48 4.113v-.684h1.177v.684h-1.178zm0-1.884h1.177v-.688h-1.178v.688zm2.377 0h1.177v-.688h-1.178v.688z" fill="#fff"></path><path d="M20.425 16.713a3.857 3.857 0 11-7.714 0 3.857 3.857 0 017.714 0z" fill="#fff"></path><path d="M15.258 16.802l1.028 1.079L18 15.859" stroke="#FE2C55" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg>
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
<svg width="24" height="24" fill="none" xmlns="http://www.w3.org/2000/svg" class="vpn447p8" viewBox="0 0 24 24"><path fill-rule="evenodd" clip-rule="evenodd" d="M3.867 6.29a2 2 0 012-2H16.44a2 2 0 012 2v5.25l-1.644-.959a1 1 0 00-.801-.09V8.272a.6.6 0 00-.6-.6h-.76l.32-.48a.6.6 0 00-.999-.666l-.764 1.146h-.305l-.764-1.146a.6.6 0 00-.998.666l.32.48h-.765a.6.6 0 00-.6.6v3.772a.6.6 0 00.6.6h1.57l-.605.353a1 1 0 00-.346.337h-1.091a.6.6 0 100 1.2h.94v4.178c0 .05.005.1.012.147H5.867a2 2 0 01-2-2V6.29zm10.927 4.87l-.488.285h-.67v-.684h1.158v.4zM5.836 7.333a.6.6 0 01.6-.6h2.358a.6.6 0 01.6.6v2.83a.6.6 0 01-.6.6H7.036v1.157h1.758a.6.6 0 01.6.6v3.3a.6.6 0 01-.6.6H6.436a.6.6 0 010-1.2h1.758v-2.1H6.436a.6.6 0 01-.6-.6V10.16a.6.6 0 01.6-.6h1.758V7.932H6.436a.6.6 0 01-.6-.6zm5.443 4.113v-.684h1.157v.684h-1.157zm0-1.884h1.157v-.688h-1.157v.688zm2.357 0h1.158v-.688h-1.158v.688z" fill="#fff"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M16.778 12.703a1 1 0 00-.98 0l-2.429 1.366a1 1 0 00-.51.871v2.688a1 1 0 00.51.871l2.429 1.366a1 1 0 00.98 0l2.429-1.366a1 1 0 00.51-.871V14.94a1 1 0 00-.51-.871l-2.429-1.366zm-.49 2.299a1.286 1.286 0 100 2.571 1.286 1.286 0 000-2.571z" fill="#fff"></path></svg>
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
<svg width="24" height="24" fill="none" xmlns="http://www.w3.org/2000/svg" class="" viewBox="0 0 24 24"><path fill-rule="evenodd" clip-rule="evenodd" d="M4.29 6.29a2 2 0 012-2h10.693a2 2 0 012 2v5.404a5.55 5.55 0 00-2.472-.55V8.274a.6.6 0 00-.6-.6h-.771l.321-.478a.6.6 0 10-.996-.67l-.771 1.148h-.317l-.772-1.148a.6.6 0 00-.996.67l.322.478h-.775a.6.6 0 00-.6.6v3.772a.6.6 0 00.6.6h1.609a5.602 5.602 0 00-.625.69h-1.463a.6.6 0 100 1.2h.763a5.554 5.554 0 00-.443 2.181c0 .76.152 1.484.428 2.144H6.289a2 2 0 01-2-2V6.29zm11.021 4.997a5.525 5.525 0 00-.552.158h-.626v-.684h1.178v.526zM6.277 7.332a.6.6 0 01.6-.6h2.378a.6.6 0 01.6.6v2.83a.6.6 0 01-.6.6H7.477v1.157h1.778a.6.6 0 01.6.6v3.3a.6.6 0 01-.6.6H6.877a.6.6 0 010-1.2h1.778v-2.1H6.877a.6.6 0 01-.6-.6V10.16a.6.6 0 01.6-.6h1.778V7.932H6.877a.6.6 0 01-.6-.6zm5.48 4.113v-.684h1.177v.684h-1.178zm0-1.884h1.177v-.688h-1.178v.688zm2.377 0h1.177v-.688h-1.178v.688z" fill="#fff"></path><circle cx="16.566" cy="16.714" r="3.855" fill="#fff"></circle><path fill-rule="evenodd" clip-rule="evenodd" d="M17.613 18.824a2.355 2.355 0 01-3.157-3.157l3.157 3.157zm1.061-1.06l-3.158-3.158a2.355 2.355 0 013.158 3.158zm1.747-1.05a3.855 3.855 0 11-7.71 0 3.855 3.855 0 017.71 0z" fill="#FE2C55"></path></svg>
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" focusable="false" class="Ykki_0Um"><path d="M10 10C10 11.1046 9.32843 12 8.5 12C7.67157 12 7 11.1046 7 10C7 8.89543 7.67157 8 8.5 8C9.32843 8 10 8.89543 10 10Z" fill="currentColor"></path><path d="M15.5 12C16.3284 12 17 11.1046 17 10C17 8.89543 16.3284 8 15.5 8C14.6716 8 14 8.89543 14 10C14 11.1046 14.6716 12 15.5 12Z" fill="currentColor"></path><path d="M12 16.5303C10.3432 16.5303 9.00004 15.5709 9.00004 14.3874C9.00004 13.2039 15 13.2039 15 14.3874C15 15.5709 13.6569 16.5303 12 16.5303Z" fill="currentColor"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2ZM4 12C4 7.58172 7.58172 4 12 4C16.4183 4 20 7.58172 20 12C20 16.4183 16.4183 20 12 20C7.58172 20 4 16.4183 4 12Z" fill="currentColor"></path></svg>
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
<svg width="32" height="32" fill="none" xmlns="http://www.w3.org/2000/svg" class="xg-get-fullscreen" viewBox="0 0 32 32"><path fill-rule="evenodd" clip-rule="evenodd" d="M9.5 8a2 2 0 00-2 2v12a2 2 0 002 2h13a2 2 0 002-2V10a2 2 0 00-2-2h-13zm10 11h-1.501v2H20.5a1 1 0 001-1v-2.5h-2V19zm-7 0v-1.5h-2V20a1 1 0 001 1h2.499v-2H12.5zm0-6h1.499v-2H11.5a1 1 0 00-1 1v2.5h2V13zm7 0h-1.501v-2H20.5a1 1 0 011 1v2.5h-2V13z" fill="#fff"></path></svg>
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
<svg width="32" height="32" fill="none" xmlns="http://www.w3.org/2000/svg" class="" viewBox="0 0 32 32"><path fill-rule="evenodd" clip-rule="evenodd" d="M8.97 8.73C7.882 8.73 7 9.72 7 10.94v10.58c0 1.22.882 2.21 1.97 2.21h8.254A5.5 5.5 0 0123 15.59v-4.65c0-1.22-.882-2.21-1.97-2.21H8.97zm4.723 10.464l3.822-2.451a1.025 1.025 0 000-1.743l-3.822-2.451c-.724-.464-1.693.035-1.693.871v4.902c0 .837.97 1.336 1.693.872z" fill="#fff" fill-opacity="0.9"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M22 25a4 4 0 100-8 4 4 0 000 8zm.4-6a.9.9 0 10-1.8 0v2.5a.9.9 0 00.9.9H24a.9.9 0 100-1.8h-1.6V19z" fill="#fff" fill-opacity="0.9"></path></svg>
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
<svg width="32" height="32" fill="none" xmlns="http://www.w3.org/2000/svg" class="xg-icon-pause" viewBox="0 0 32 32"><rect x="9" y="8" width="5" height="16" rx="1" fill="#fff"></rect><rect x="18" y="8" width="5" height="16" rx="1" fill="#fff"></rect></svg>
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
<svg width="32" height="32" fill="none" xmlns="http://www.w3.org/2000/svg" class="xg-icon-play" viewBox="0 0 32 32"><path d="M23.5 15.134a1 1 0 010 1.732l-11.25 6.495a1 1 0 01-1.5-.866V9.505a1 1 0 011.5-.866l11.25 6.495z" fill="#fff"></path></svg>
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
<svg width="32" height="32" fill="none" xmlns="http://www.w3.org/2000/svg" class="xg-volume" viewBox="0 0 32 32"><path d="M7 14a2 2 0 012-2h1l4.36-3.633a1 1 0 011.64.768v13.73a1 1 0 01-1.64.768L10 20H9a2 2 0 01-2-2v-4zM18 19a3 3 0 100-6v6z" fill="#fff"></path><path d="M18 23.734a7.75 7.75 0 000-15.468v2.507a5.25 5.25 0 010 10.453v2.508z" fill="#fff"></path></svg>
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
<svg width="32" height="32" fill="none" xmlns="http://www.w3.org/2000/svg" class="xg-volume-mute" viewBox="0 0 32 32"><path d="M7 14a2 2 0 012-2h1l4.36-3.633a1 1 0 011.64.768v13.73a1 1 0 01-1.64.768L10 20H9a2 2 0 01-2-2v-4z" fill="#fff"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M21.002 17.55l2.499 2.954 1.502-1.316-2.693-3.185 2.694-3.185-1.503-1.316-2.499 2.955-2.5-2.955L17 12.818l2.694 3.185-2.693 3.185 1.502 1.316 2.499-2.955z" fill="#fff"></path></svg>
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
<svg width="32" height="32" fill="none" xmlns="http://www.w3.org/2000/svg" class="" viewBox="0 0 32 32"><path fill-rule="evenodd" clip-rule="evenodd" d="M9.75 8.5a2 2 0 00-2 2v11a2 2 0 002 2h12.5a2 2 0 002-2v-11a2 2 0 00-2-2H9.75zM15 11.25h-3.75a1 1 0 00-1 1V16h2v-2.75H15v-2zm5.75 9.5H17v-2h2.75V16h2v3.75a1 1 0 01-1 1z" fill="#fff"></path></svg>
|
package/docs/index.html
CHANGED
|
@@ -13,7 +13,7 @@
|
|
|
13
13
|
<body>
|
|
14
14
|
<style>
|
|
15
15
|
body {
|
|
16
|
-
background: url(https://
|
|
16
|
+
background: url(https://fontawesome.com/images/icons-gray-bg.svg);
|
|
17
17
|
}
|
|
18
18
|
|
|
19
19
|
.wrapper {
|
|
@@ -23,6 +23,8 @@
|
|
|
23
23
|
left: 50%;
|
|
24
24
|
top: 50%;
|
|
25
25
|
height: 450px;
|
|
26
|
+
border-radius: 8px;
|
|
27
|
+
overflow: hidden;
|
|
26
28
|
}
|
|
27
29
|
|
|
28
30
|
@media screen and (max-width: 500px) {
|
|
@@ -58,14 +60,9 @@
|
|
|
58
60
|
</style>
|
|
59
61
|
|
|
60
62
|
<div class="wrapper">
|
|
61
|
-
<div class="container"></div>
|
|
62
63
|
<e-player id="ep"
|
|
63
64
|
src="https://a1.alibabausercontent.com/prod/feupload/user/edos8/2f0e7af0-29f1-11ef-b3cd-818e64ac843d.mp4">
|
|
64
65
|
</e-player>
|
|
65
|
-
|
|
66
|
-
<a href="https://github.com/132yse/eplayer">github</a>
|
|
67
|
-
<a href="https://github.com/132yse/eplayer/blob/master/README.md">README</a>
|
|
68
|
-
<a href="https://www.clicli.cc">clicli.cc</a>
|
|
69
66
|
</div>
|
|
70
67
|
<script src="https://unpkg.com/@webcomponents/webcomponentsjs"></script>
|
|
71
68
|
<script src="https://unpkg.com/hls.js"></script>
|
|
@@ -92,10 +89,6 @@
|
|
|
92
89
|
|
|
93
90
|
function init(danmaku) {
|
|
94
91
|
for (let i = 0; i < 100; i++) {
|
|
95
|
-
// danmaku.add({
|
|
96
|
-
// msg: messages[parseInt(Math.random() * messages.length)],
|
|
97
|
-
// fontSize: Math.floor(Math.random() * 20) + 20
|
|
98
|
-
// })
|
|
99
92
|
document.querySelector('e-player').setAttribute('danma', messages[parseInt(Math.random() * messages.length)])
|
|
100
93
|
}
|
|
101
94
|
}
|
package/package.json
CHANGED
package/docs/res/anniu1.png
DELETED
|
Binary file
|
package/docs/res/anniu2.png
DELETED
|
Binary file
|
package/docs/res/anniu3.png
DELETED
|
Binary file
|
package/docs/res/anniu4.png
DELETED
|
Binary file
|
package/docs/res/bad.png
DELETED
|
Binary file
|
package/docs/res/beiban.png
DELETED
|
Binary file
|
package/docs/res/beijing.png
DELETED
|
Binary file
|
package/docs/res/bjt1.png
DELETED
|
Binary file
|
package/docs/res/bjt2.png
DELETED
|
Binary file
|
package/docs/res/bjt3.png
DELETED
|
Binary file
|
package/docs/res/bjt4.png
DELETED
|
Binary file
|
package/docs/res/fanhuianniu.png
DELETED
|
Binary file
|
package/docs/res/good.png
DELETED
|
Binary file
|
package/docs/res/hong3.png
DELETED
|
Binary file
|
package/docs/res/huang3.png
DELETED
|
Binary file
|
package/docs/res/kaishianniu.png
DELETED
|
Binary file
|
package/docs/res/kong.png
DELETED
|
Binary file
|
package/docs/res/lan3.png
DELETED
|
Binary file
|
package/docs/res/lv3.png
DELETED
|
Binary file
|
package/docs/res/miss.png
DELETED
|
Binary file
|
package/docs/res/perfect.png
DELETED
|
Binary file
|
package/docs/res/touming.png
DELETED
|
Binary file
|