This commit is contained in:
yumoqing 2025-10-05 18:40:29 +08:00
parent 77dd35a6ae
commit f2c3ad98c3
2 changed files with 10 additions and 32 deletions

View File

@ -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;
}
}

View File

@ -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)}`;
}