bugfix
This commit is contained in:
parent
77dd35a6ae
commit
f2c3ad98c3
@ -4,9 +4,7 @@ bricks.Svg = class extends bricks.VBox {
|
||||
options:{
|
||||
rate:
|
||||
url:
|
||||
blink:false
|
||||
color:*
|
||||
blinkcolor:*
|
||||
blinktime:*
|
||||
}
|
||||
*/
|
||||
@ -20,9 +18,6 @@ bricks.Svg = class extends bricks.VBox {
|
||||
if (! this.color) {
|
||||
this.color = bricks.app.get_color();
|
||||
}
|
||||
if (!this.blinkcolor){
|
||||
this.blinkcolor = bricks.app.get_bgcolor()
|
||||
}
|
||||
if (opts.url){
|
||||
this.set_url(opts.url);
|
||||
}
|
||||
@ -39,7 +34,7 @@ bricks.Svg = class extends bricks.VBox {
|
||||
if (svgText.startsWith("<svg ")){
|
||||
this.svgText = svgText;
|
||||
this.set_colored_svg(this.color);
|
||||
if (this.blink) this.start_blink();
|
||||
if (this.blinktime) this.start_blink();
|
||||
}
|
||||
});
|
||||
}
|
||||
@ -51,22 +46,17 @@ bricks.Svg = class extends bricks.VBox {
|
||||
this.color = color;
|
||||
this.set_colored_svg(color);
|
||||
}
|
||||
set_blinkcolor(color){
|
||||
this.blinkcolor = color;
|
||||
this.blinktime = this.blinktime || 0.5;
|
||||
}
|
||||
set_colored_svg(color){
|
||||
this.cur_color = color;
|
||||
var svgText = bricks.obj_fmtstr({color: color}, this.svgText);
|
||||
this.dom_element.innerHTML = svgText;
|
||||
var this.svg_text = bricks.obj_fmtstr({color: color}, this.svgText);
|
||||
this.dom_element.innerHTML = svg_text;
|
||||
}
|
||||
_blink(){
|
||||
if (this.blinktime && this.blinkcolor) {
|
||||
if (this.cur_color == this.color){
|
||||
this.set_colored_svg(this.blinkcolor);
|
||||
} else {
|
||||
this.set_colored_svg(this.color);
|
||||
}
|
||||
if (this.blinktime) {
|
||||
if (this.dom_element.innerHTML == '')
|
||||
this.dom_element.innerHTML = this.svg_text;
|
||||
else
|
||||
this.dom_element.innerHTML = ''
|
||||
this.blink_task = schedule_once(this._blink.bind(this),
|
||||
this.blinktime);
|
||||
}
|
||||
@ -77,6 +67,8 @@ bricks.Svg = class extends bricks.VBox {
|
||||
}
|
||||
}
|
||||
end_blink(){
|
||||
if (this.blink_task)
|
||||
this.blink_task.cancel();
|
||||
this.blink_task = null;
|
||||
}
|
||||
}
|
||||
|
||||
@ -17,9 +17,6 @@ bricks.VideoPlayer = class extends bricks.VBox {
|
||||
this.set_css('video-container');
|
||||
this.dom_element.innerHTML = `<video id="video" class="video-element"></video>
|
||||
<div class="controls">
|
||||
<div class="progress-container">
|
||||
<input type="range" class="progress-bar" value="0" step="0.0001" />
|
||||
</div>
|
||||
<div class="controls-bottom">
|
||||
<button class="play-pause">▶</button>
|
||||
<div class="volume-container">
|
||||
@ -51,7 +48,6 @@ bricks.VideoPlayer = class extends bricks.VBox {
|
||||
this.playPauseBtn = this.controls.querySelector('.play-pause');
|
||||
this.muteBtn = this.controls.querySelector('.mute');
|
||||
this.volumeInput = this.controls.querySelector('.volume');
|
||||
this.progressBar = this.controls.querySelector('.progress-bar');
|
||||
this.timeDisplay = this.controls.querySelector('.time');
|
||||
this.speedSelect = this.controls.querySelector('.playback-speed');
|
||||
this.audioTrackSelect = this.controls.querySelector('.audio-track-select');
|
||||
@ -151,12 +147,6 @@ bricks.VideoPlayer = class extends bricks.VBox {
|
||||
this.updateMuteUI();
|
||||
});
|
||||
|
||||
// 进度条拖动
|
||||
this.progressBar.addEventListener('input', (e) => {
|
||||
const time = e.target.value * this.video.duration;
|
||||
this.video.currentTime = time;
|
||||
});
|
||||
|
||||
// 播放速度
|
||||
this.speedSelect.addEventListener('change', (e) => {
|
||||
this.video.playbackRate = parseFloat(e.target.value);
|
||||
@ -212,9 +202,6 @@ bricks.VideoPlayer = class extends bricks.VBox {
|
||||
this.video.addEventListener('loadedmetadata', () => {
|
||||
this.updateAudioTracks();
|
||||
});
|
||||
this.video.addEventListener('seeking', () => {
|
||||
this.progressBar.value = this.video.currentTime / this.video.duration;
|
||||
});
|
||||
}
|
||||
|
||||
updateUI() {
|
||||
@ -234,7 +221,6 @@ bricks.VideoPlayer = class extends bricks.VBox {
|
||||
|
||||
updateProgress() {
|
||||
const percent = this.video.duration ? this.video.currentTime / this.video.duration : 0;
|
||||
this.progressBar.value = percent;
|
||||
this.timeDisplay.textContent = `${this.formatTime(this.video.currentTime)} / ${this.formatTime(this.video.duration || 0)}`;
|
||||
}
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user