| | |
| | | <template> |
| | | <div ref="container" @dblclick="fullscreenSwich" style="width:100%;height:100%;background-color: #000000;margin:0 auto;"> |
| | | <div ref="container" @dblclick="fullscreenSwich" |
| | | style="width:100%;height:100%;background-color: #000000;margin:0 auto;"> |
| | | <div class="buttons-box" id="buttonsBox"> |
| | | <div class="buttons-box-left"> |
| | | <i v-if="!playing" class="iconfont icon-play jessibuca-btn" @click="playBtnClick"></i> |
| | |
| | | <span class="jessibuca-btn">{{ kBps }} kb/s</span> |
| | | <!-- <i class="iconfont icon-file-record1 jessibuca-btn"></i>--> |
| | | <!-- <i class="iconfont icon-xiangqing2 jessibuca-btn" ></i>--> |
| | | <i class="iconfont icon-camera1196054easyiconnet jessibuca-btn" @click="jessibuca.screenshot('截图','png',0.5)" |
| | | <i class="iconfont icon-camera1196054easyiconnet jessibuca-btn" @click="screenshot" |
| | | style="font-size: 1rem !important"></i> |
| | | <i class="iconfont icon-shuaxin11 jessibuca-btn" @click="playBtnClick"></i> |
| | | <i v-if="!fullscreen" class="iconfont icon-weibiaoti10 jessibuca-btn" @click="fullscreenSwich"></i> |
| | |
| | | jessibucaPlayer[this._uid] = new window.Jessibuca(Object.assign( |
| | | { |
| | | container: this.$refs.container, |
| | | videoBuffer: 0.2, // 最大缓冲时长,单位秒 |
| | | isResize: true, |
| | | decoder: "static/js/jessibuca/decoder.js", |
| | | useMSE: false, |
| | | showBandwidth: false, |
| | | isFlv: true, |
| | | // text: "WVP-PRO", |
| | | // background: "static/images/zlm-logo.png", |
| | | loadingText: "加载中", |
| | | hasAudio: typeof (this.hasAudio) == "undefined" ? true : this.hasAudio, |
| | | autoWasm: true, |
| | | background: "", |
| | | controlAutoHide: false, |
| | | debug: false, |
| | | supportDblclickFullscreen: false, // 是否支持屏幕的双击事件,触发全屏,取消全屏事件。 |
| | | decoder: "static/js/jessibuca/decoder.js", |
| | | forceNoOffscreen: true, |
| | | hasAudio: typeof (this.hasAudio) == "undefined" ? true : this.hasAudio, |
| | | hasVideo: true, |
| | | heartTimeout: 5, |
| | | heartTimeoutReplay: true, |
| | | heartTimeoutReplayTimes: 3, |
| | | hiddenAutoPause: false, |
| | | hotKey: false, |
| | | isFlv: false, |
| | | isFullResize: false, |
| | | isNotMute: this.isNotMute, |
| | | isResize: false, |
| | | keepScreenOn: false, |
| | | loadingText: "请稍等, 视频加载中......", |
| | | loadingTimeout: 10, |
| | | loadingTimeoutReplay: true, |
| | | loadingTimeoutReplayTimes: 3, |
| | | openWebglAlignment: false, |
| | | operateBtns: { |
| | | fullscreen: false, |
| | | screenshot: false, |
| | | play: false, |
| | | audio: false, |
| | | recorder: false, |
| | | record: false |
| | | }, |
| | | record: "record", |
| | | vod: this.vod, |
| | | forceNoOffscreen: this.forceNoOffscreen, |
| | | isNotMute: this.isNotMute, |
| | | recordType: "webm", |
| | | rotate: 0, |
| | | showBandwidth: false, |
| | | supportDblclickFullscreen: false, |
| | | timeout: 10, |
| | | useMSE: location.hostname !== "localhost" && location.protocol !== "https:", |
| | | useOffscreen: false, |
| | | useWCS: location.hostname === "localhost" || location.protocol === "https", |
| | | useWebFullScreen: false, |
| | | videoBuffer: 0, |
| | | wasmDecodeAudioSyncVideo: true, |
| | | wasmDecodeErrorReplay: true, |
| | | wcsUseVideoRender: true |
| | | }, |
| | | options |
| | | )); |
| | |
| | | _this.isNotMute = !msg; |
| | | }); |
| | | jessibuca.on("audioInfo", function (msg) { |
| | | // console.log("audioInfo", msg); |
| | | }); |
| | | |
| | | jessibuca.on("videoInfo", function (msg) { |
| | | // this.videoInfo = msg; |
| | | console.log("videoInfo", msg); |
| | | |
| | | console.log("audioInfo", msg); |
| | | }); |
| | | |
| | | jessibuca.on("bps", function (bps) { |
| | |
| | | this.err = ""; |
| | | this.performance = ""; |
| | | }, |
| | | screenshot: function () { |
| | | if (jessibucaPlayer[this._uid]) { |
| | | jessibucaPlayer[this._uid].screenshot(); |
| | | } |
| | | }, |
| | | mute: function () { |
| | | if (jessibucaPlayer[this._uid]) { |
| | | jessibucaPlayer[this._uid].mute(); |