From aa5475b741a6874fca79f899a09948b875153e89 Mon Sep 17 00:00:00 2001 From: yumoqing Date: Thu, 20 Feb 2025 21:00:23 +0800 Subject: [PATCH] bugfi --- bricks/video.js | 45 +++++++++++++++++++++++++++------------------ 1 file changed, 27 insertions(+), 18 deletions(-) diff --git a/bricks/video.js b/bricks/video.js index fdc9489..c5f7ea6 100644 --- a/bricks/video.js +++ b/bricks/video.js @@ -35,13 +35,22 @@ bricks.Video = class extends bricks.Layout { */ constructor(options){ super(options); - this.video_body = new bricks.VideoBody(options); - this.add_widget(this.video_body); + // this.video_body = new bricks.VideoBody(options); + this.set_css('video-js'); + this.set_css('vjs-big-play-centered'); + this.set_css('vjs-fluid'); + this.set_style('width', '100%'); + this.set_style('height', '100%'); + this.set_style('object-fit', 'contain'); + this.cur_url = opts.url; + this.cur_vtype = opts.type; schedule_once(this.create_player.bind(this), 0.1); - this.hidedbtn = new bricks.Button({label:'click me'}); - this.hidedbtn.bind('click', this.play.bind(this)); - this.hidedbtn.hide(); - this.add_widget(this.hidedbtn); + } + create(){ + var e; + e = document.createElement('video'); + this.dom_element = e; + e.controls = true; } destroy_resource(params, event){ @@ -131,7 +140,8 @@ bricks.Video = class extends bricks.Layout { create_player(){ if(this.url){ - this.player = videojs(this.video_body.dom_element, { + // this.player = videojs(this.video_body.dom_element, { + this.player = videojs(this.dom_element, { controls:true, autoplay:this.autoplay, muted:true, @@ -142,9 +152,8 @@ bricks.Video = class extends bricks.Layout { this.player.on('error',this.report_error.bind(this)); this.player.on('play', this.report_playok.bind(this)); this.player.on('ended', this.report_ended.bind(this)); - this._set_source(); + this.set_url(this.opts.url); this.player.ready(this.set_fullscreen.bind(this)); - console.log('=======', this.autoplay, '========'); if (this.autoplay){ this.auto_play(); } @@ -155,35 +164,35 @@ bricks.Video = class extends bricks.Layout { returnl } this.play_status = 'playend'; - this.dispatch('play_end',{src:this.video_body.cur_url,type:this.video_body.cur_vtype}); + this.dispatch('play_end',{src:this.cur_url,type:this.cur_vtype}); } report_playok(){ if (this.play_status != ''){ return; } this.play_status = 'playok'; - console.log(this.video_body.cur_url, 'play ok'); + console.log(this.cur_url, 'play ok'); if (this.autounmute && this.player.muted){ schedule_once(this.dispatch_mute.bind(this), 1.5); console.log('mute btn clicked'); } else { console.log(this.autounmute, 'player.muted=', this.player.muted); } - this.dispatch('play_ok', {src:this.video_body.cur_url,type:this.video_body.cur_vtype}); + this.dispatch('play_ok', {src:this.cur_url,type:this.cur_vtype}); } report_error(){ if (this.play_status != ''){ return; } this.play_status = 'playfailed'; - console.log(this.video_body.cur_url, 'play failed', this.err_cnt, 'times'); - this.dispatch('play_failed', {'src':this.video_body.cur_url, type:this.video_body.cur_vtype}); + console.log(this.cur_url, 'play failed', this.err_cnt, 'times'); + this.dispatch('play_failed', {'src':this.cur_url, type:this.cur_vtype}); } _set_source(){ if (this.player){ this.player.src({ - src:this.video_body.cur_url, - type:this.video_body.cur_vtype + src:this.cur_url, + type:this.cur_vtype }); this.play_status = ''; } @@ -202,8 +211,8 @@ bricks.Video = class extends bricks.Layout { vtype = 'application/x-mpegURL'; } if(this.player){ - this.video_body.cur_url = url; - this.video_body.cur_vtype = vtype; + this.cur_url = url; + this.cur_vtype = vtype; this._set_source(); this.play(); }