From 2c2bc8614c8ea0ce386369eb4924da1e6aa052d1 Mon Sep 17 00:00:00 2001
From: husq <931347610@qq.com>
Date: Wed, 27 Sep 2023 09:35:57 +0800
Subject: [PATCH] 添加环境配置区分
---
src/components/Jessibuca/Jessibuca.vue | 54 ++++++++++++++++++++++++++++--------------------------
1 files changed, 28 insertions(+), 26 deletions(-)
diff --git a/src/components/Jessibuca/Jessibuca.vue b/src/components/Jessibuca/Jessibuca.vue
index fd69ac0..2a98fc4 100644
--- a/src/components/Jessibuca/Jessibuca.vue
+++ b/src/components/Jessibuca/Jessibuca.vue
@@ -1,33 +1,32 @@
<template>
- <div>
- <div class="root">
- <div class="container-shell">
- <div class="container-shell-title">jessibuca demo player</div>
- <div id="container" ref="container"></div>
- <div class="input">
- <div>输入URL：</div>
- <input type="input" autocomplete="on" :value="playUrl" />
- <button v-if="!playing" @click="play">播放</button>
- <button v-else @click="pause">停止</button>
- </div>
- <div class="input" v-if="loaded">
- <button @click="destroy">销毁</button>
- </div>
- </div>
- </div>
- </div>
+ <div id="container" ref="container" :style="{width,height}"></div>
</template>
<script setup lang="ts">
-import { onMounted, onUnmounted, ref } from 'vue'
-import Jessibuca from '../../../types/jessibuca'
-let jessibuca :null | Jessibuca = null
+import { onMounted, onUnmounted, ref, defineProps, defineEmits } from 'vue'
+import Jessibuca from '../../../public/jessibuca/jessibuca'
+const props = defineProps({
+ videoUrl: {
+ type: String,
+ required: true
+ },
+ width: {
+ type: String,
+ default: '300px'
+ },
+ height: {
+ type: String,
+ default: '200px'
+ }
+})
+const emits = defineEmits(['timeout'])
+let jessibuca: null | Jessibuca = null
const container = ref(null)
const buffer = ref(null)
const showBandwidth = ref(false)
-const showOperateBtns = ref(false)
+const showOperateBtns = ref(true)
const forceNoOffscreen = ref(false)
-const playUrl = ref('http://flv.bdplay.nodemedia.cn/live/bbb.flv')
+// const playUrl = ref()
const playing = ref(false)
const quieting = ref(true)
const loaded = ref(false)
@@ -39,6 +38,7 @@
text: '',
// background: "bg.jpg",
loadingText: '加载中',
+ controlAutoHide: true,
// hasAudio:false,
debug: true,
showBandwidth: showBandwidth.value, // 显示网速
@@ -103,11 +103,12 @@
})
jessibuca.on('error', function (error: any) {
- console.log('error', error)
+ console.error('error', error)
})
jessibuca.on('timeout', function () {
console.log('timeout')
+ emits('timeout')
})
jessibuca.on('start', function () {
@@ -150,13 +151,14 @@
}
onMounted(() => {
createJessibuca()
+ play()
})
onUnmounted(() => {
jessibuca && jessibuca.destroy()
})
const play = () => {
- if (playUrl.value) {
- jessibuca?.play(playUrl.value)
+ if (props.videoUrl) {
+ jessibuca?.play(props.videoUrl)
}
}
const pause = () => {
@@ -174,4 +176,4 @@
}
</script>
-<style scoped></style>
+<style scoped lang="scss"></style>
--
Gitblit v1.9.3