@yimou6/common-ui 1.6.2 → 1.6.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/cdn/index.cdn.js +1 -1
- package/cdn/index.cdn.js.map +1 -1
- package/cdn/index.cdn.mjs +5 -5
- package/cdn/index.cdn.mjs.map +1 -1
- package/es/components/live-player/src/ysPlayer.vue2.mjs +10 -1
- package/es/components/live-player/src/ysPlayer.vue2.mjs.map +1 -1
- package/lib/components/live-player/src/ysPlayer.vue2.js +10 -1
- package/lib/components/live-player/src/ysPlayer.vue2.js.map +1 -1
- package/package.json +1 -1
|
@@ -75,7 +75,16 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
75
75
|
calculatedHeight = height.value;
|
|
76
76
|
calculatedWidth = calculatedHeight * ratio;
|
|
77
77
|
}
|
|
78
|
-
|
|
78
|
+
props.debug && console.log("playerInstance", playerInstance);
|
|
79
|
+
if (playerInstance.resize) {
|
|
80
|
+
playerInstance.resize(calculatedWidth, calculatedHeight);
|
|
81
|
+
} else {
|
|
82
|
+
const dom = document.getElementById(id);
|
|
83
|
+
if (dom) {
|
|
84
|
+
dom.style.width = `${calculatedWidth}px`;
|
|
85
|
+
dom.style.height = `${calculatedHeight}px`;
|
|
86
|
+
}
|
|
87
|
+
}
|
|
79
88
|
}
|
|
80
89
|
}
|
|
81
90
|
__name(resize, "resize");
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ysPlayer.vue2.mjs","sources":["../../../../../../../packages/components/live-player/src/ysPlayer.vue"],"sourcesContent":["<script setup lang=\"ts\">\n import { useElementSize } from '@vueuse/core';\n import EZUIKit from 'ezuikit-js';\n import { nextTick, onMounted, shallowRef, watch } from 'vue';\n import { uuid } from './live-player';\n // 萤石云播放器\n defineOptions({\n name: 'YsPlayer',\n });\n\n // 传值方式\n // 1、传url、accessToken\n // 2、传deviceSerial、channel、accessToken\n const props = defineProps<{\n // 播放地址\n // 高清：ezopen://open.ys7.com/${设备序列号}/${通道号}.hd.live\n // 流畅：ezopen://open.ys7.com/${设备序列号}/${通道号}.live\n url?: string;\n // 设备序列号\n deviceSerial?: string;\n // 通道号\n channel?: number;\n // 清晰度,默认为空，也表示高清\n // hd：高清；sd：流畅\n quality?: 'hd' | 'sd' | '';\n accessToken: string;\n debug?: boolean;\n }>();\n\n // 播放器模板ID\n // 可在萤石云控制台查看、修改、获取\n // 位置：云直播-轻应用-特致珈默认模板\n const PLAYER_TEMPLATE = '5f295a9341a74d439b5d69374c90d501';\n const id = uuid();\n let playerInstance: any = null;\n let errorMsg = '';\n const ysRef = shallowRef();\n const { width, height } = useElementSize(ysRef);\n let ratio = 16 / 9;\n\n onMounted(() => play());\n\n defineExpose({ play, destroy, resize });\n\n // 防抖函数\n function debounce(func: Function, wait: number) {\n let timeout: ReturnType<typeof setTimeout> | null = null;\n return function (this: any, ...args: any[]) {\n if (timeout) clearTimeout(timeout);\n timeout = setTimeout(() => func.apply(this, args), wait);\n };\n }\n\n // 加上防抖的 resize 函数\n const debouncedResize = debounce(resize, 300);\n\n watch(\n () => [width.value, height.value, ratio],\n () => debouncedResize(),\n );\n\n function play(options?: Record<string, any>) {\n props.debug && console.log('play', options);\n if (!props.accessToken) {\n errorMsg = `params 'accessToken' is not fount`;\n } else {\n const url = formatterUrl();\n if (url) {\n createPlayerDom();\n nextTick(() => createPlayer(options));\n }\n }\n }\n function destroy() {\n if (playerInstance) {\n playerInstance.destroy();\n playerInstance = null;\n removePlayerDom();\n }\n }\n function resize() {\n // 根据播放器宽高比，设置播放器高度\n if (width.value > 0 && height.value > 0) {\n let calculatedWidth = width.value;\n let calculatedHeight = calculatedWidth / ratio;\n if (calculatedHeight > height.value) {\n calculatedHeight = height.value;\n calculatedWidth = calculatedHeight * ratio;\n }\n playerInstance
|
|
1
|
+
{"version":3,"file":"ysPlayer.vue2.mjs","sources":["../../../../../../../packages/components/live-player/src/ysPlayer.vue"],"sourcesContent":["<script setup lang=\"ts\">\n import { useElementSize } from '@vueuse/core';\n import EZUIKit from 'ezuikit-js';\n import { nextTick, onMounted, shallowRef, watch } from 'vue';\n import { uuid } from './live-player';\n // 萤石云播放器\n defineOptions({\n name: 'YsPlayer',\n });\n\n // 传值方式\n // 1、传url、accessToken\n // 2、传deviceSerial、channel、accessToken\n const props = defineProps<{\n // 播放地址\n // 高清：ezopen://open.ys7.com/${设备序列号}/${通道号}.hd.live\n // 流畅：ezopen://open.ys7.com/${设备序列号}/${通道号}.live\n url?: string;\n // 设备序列号\n deviceSerial?: string;\n // 通道号\n channel?: number;\n // 清晰度,默认为空，也表示高清\n // hd：高清；sd：流畅\n quality?: 'hd' | 'sd' | '';\n accessToken: string;\n debug?: boolean;\n }>();\n\n // 播放器模板ID\n // 可在萤石云控制台查看、修改、获取\n // 位置：云直播-轻应用-特致珈默认模板\n const PLAYER_TEMPLATE = '5f295a9341a74d439b5d69374c90d501';\n const id = uuid();\n let playerInstance: any = null;\n let errorMsg = '';\n const ysRef = shallowRef();\n const { width, height } = useElementSize(ysRef);\n let ratio = 16 / 9;\n\n onMounted(() => play());\n\n defineExpose({ play, destroy, resize });\n\n // 防抖函数\n function debounce(func: Function, wait: number) {\n let timeout: ReturnType<typeof setTimeout> | null = null;\n return function (this: any, ...args: any[]) {\n if (timeout) clearTimeout(timeout);\n timeout = setTimeout(() => func.apply(this, args), wait);\n };\n }\n\n // 加上防抖的 resize 函数\n const debouncedResize = debounce(resize, 300);\n\n watch(\n () => [width.value, height.value, ratio],\n () => debouncedResize(),\n );\n\n function play(options?: Record<string, any>) {\n props.debug && console.log('play', options);\n if (!props.accessToken) {\n errorMsg = `params 'accessToken' is not fount`;\n } else {\n const url = formatterUrl();\n if (url) {\n createPlayerDom();\n nextTick(() => createPlayer(options));\n }\n }\n }\n function destroy() {\n if (playerInstance) {\n playerInstance.destroy();\n playerInstance = null;\n removePlayerDom();\n }\n }\n function resize() {\n // 根据播放器宽高比，设置播放器高度\n if (width.value > 0 && height.value > 0) {\n let calculatedWidth = width.value;\n let calculatedHeight = calculatedWidth / ratio;\n if (calculatedHeight > height.value) {\n calculatedHeight = height.value;\n calculatedWidth = calculatedHeight * ratio;\n }\n props.debug && console.log('playerInstance', playerInstance);\n if (playerInstance.resize) {\n playerInstance.resize(calculatedWidth, calculatedHeight);\n } else {\n const dom = document.getElementById(id);\n if (dom) {\n dom.style.width = `${calculatedWidth}px`;\n dom.style.height = `${calculatedHeight}px`;\n }\n }\n }\n }\n\n /**\n * 创建萤石云播放器实例，播放萤石云直播流\n */\n function createPlayer(options?: Record<string, any>) {\n playerInstance = new EZUIKit.EZUIKitPlayer({\n id,\n url: formatterUrl(),\n accessToken: props.accessToken,\n template: PLAYER_TEMPLATE,\n width: width.value,\n height: height.value,\n audio: 1,\n // @ts-ignore\n loggerOptions: {\n name: 'YSPLAYER',\n level: 'ERROR',\n showTime: true,\n },\n ...options,\n });\n\n playerInstance.eventEmitter.on('destroy', (args: any) => {\n props.debug && console.log('destroy', args);\n });\n playerInstance.eventEmitter.on('init', (args: any) => {\n props.debug && console.log('init', args);\n });\n playerInstance.eventEmitter.on('play', (args: any) => {\n props.debug && console.log('play', args);\n });\n playerInstance.eventEmitter.on('videoInfo', (args: any) => {\n const { width: w, height: h } = args;\n // 计算播放器宽高比\n if (w && h) {\n ratio = w / h;\n }\n });\n }\n\n function formatterUrl(): string {\n if (props.url) {\n return props.url;\n } else {\n if (props.deviceSerial && props.channel) {\n const quality = props.quality === '' || props.quality === 'hd' ? 'hd.' : '';\n return `ezopen://open.ys7.com/${props.deviceSerial}/${props.channel}.${quality}live`;\n } else {\n errorMsg = `params 'deviceSerial' or 'channel' is not fount`;\n return '';\n }\n }\n }\n\n // 移除播放器DOM\n function removePlayerDom() {\n const dom = document.getElementById(id);\n dom && dom.remove();\n }\n // 创建播放器DOM\n function createPlayerDom() {\n if (!errorMsg) {\n removePlayerDom();\n const dom = document.createElement('div');\n dom.id = id;\n dom.style.width = '100%';\n dom.style.height = '100%';\n ysRef.value?.appendChild(dom);\n }\n }\n</script>\n\n<template>\n <div ref=\"ysRef\" class=\"i-player-bg i-player-container\">\n <div v-if=\"errorMsg\" class=\"i-player__error\">{{ errorMsg }}</div>\n </div>\n</template>\n"],"names":[],"mappings":"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"}
|
|
@@ -79,7 +79,16 @@ var _sfc_main = /* @__PURE__ */ vue.defineComponent({
|
|
|
79
79
|
calculatedHeight = height.value;
|
|
80
80
|
calculatedWidth = calculatedHeight * ratio;
|
|
81
81
|
}
|
|
82
|
-
|
|
82
|
+
props.debug && console.log("playerInstance", playerInstance);
|
|
83
|
+
if (playerInstance.resize) {
|
|
84
|
+
playerInstance.resize(calculatedWidth, calculatedHeight);
|
|
85
|
+
} else {
|
|
86
|
+
const dom = document.getElementById(id);
|
|
87
|
+
if (dom) {
|
|
88
|
+
dom.style.width = `${calculatedWidth}px`;
|
|
89
|
+
dom.style.height = `${calculatedHeight}px`;
|
|
90
|
+
}
|
|
91
|
+
}
|
|
83
92
|
}
|
|
84
93
|
}
|
|
85
94
|
__name(resize, "resize");
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ysPlayer.vue2.js","sources":["../../../../../../../packages/components/live-player/src/ysPlayer.vue"],"sourcesContent":["<script setup lang=\"ts\">\n import { useElementSize } from '@vueuse/core';\n import EZUIKit from 'ezuikit-js';\n import { nextTick, onMounted, shallowRef, watch } from 'vue';\n import { uuid } from './live-player';\n // 萤石云播放器\n defineOptions({\n name: 'YsPlayer',\n });\n\n // 传值方式\n // 1、传url、accessToken\n // 2、传deviceSerial、channel、accessToken\n const props = defineProps<{\n // 播放地址\n // 高清：ezopen://open.ys7.com/${设备序列号}/${通道号}.hd.live\n // 流畅：ezopen://open.ys7.com/${设备序列号}/${通道号}.live\n url?: string;\n // 设备序列号\n deviceSerial?: string;\n // 通道号\n channel?: number;\n // 清晰度,默认为空，也表示高清\n // hd：高清；sd：流畅\n quality?: 'hd' | 'sd' | '';\n accessToken: string;\n debug?: boolean;\n }>();\n\n // 播放器模板ID\n // 可在萤石云控制台查看、修改、获取\n // 位置：云直播-轻应用-特致珈默认模板\n const PLAYER_TEMPLATE = '5f295a9341a74d439b5d69374c90d501';\n const id = uuid();\n let playerInstance: any = null;\n let errorMsg = '';\n const ysRef = shallowRef();\n const { width, height } = useElementSize(ysRef);\n let ratio = 16 / 9;\n\n onMounted(() => play());\n\n defineExpose({ play, destroy, resize });\n\n // 防抖函数\n function debounce(func: Function, wait: number) {\n let timeout: ReturnType<typeof setTimeout> | null = null;\n return function (this: any, ...args: any[]) {\n if (timeout) clearTimeout(timeout);\n timeout = setTimeout(() => func.apply(this, args), wait);\n };\n }\n\n // 加上防抖的 resize 函数\n const debouncedResize = debounce(resize, 300);\n\n watch(\n () => [width.value, height.value, ratio],\n () => debouncedResize(),\n );\n\n function play(options?: Record<string, any>) {\n props.debug && console.log('play', options);\n if (!props.accessToken) {\n errorMsg = `params 'accessToken' is not fount`;\n } else {\n const url = formatterUrl();\n if (url) {\n createPlayerDom();\n nextTick(() => createPlayer(options));\n }\n }\n }\n function destroy() {\n if (playerInstance) {\n playerInstance.destroy();\n playerInstance = null;\n removePlayerDom();\n }\n }\n function resize() {\n // 根据播放器宽高比，设置播放器高度\n if (width.value > 0 && height.value > 0) {\n let calculatedWidth = width.value;\n let calculatedHeight = calculatedWidth / ratio;\n if (calculatedHeight > height.value) {\n calculatedHeight = height.value;\n calculatedWidth = calculatedHeight * ratio;\n }\n playerInstance
|
|
1
|
+
{"version":3,"file":"ysPlayer.vue2.js","sources":["../../../../../../../packages/components/live-player/src/ysPlayer.vue"],"sourcesContent":["<script setup lang=\"ts\">\n import { useElementSize } from '@vueuse/core';\n import EZUIKit from 'ezuikit-js';\n import { nextTick, onMounted, shallowRef, watch } from 'vue';\n import { uuid } from './live-player';\n // 萤石云播放器\n defineOptions({\n name: 'YsPlayer',\n });\n\n // 传值方式\n // 1、传url、accessToken\n // 2、传deviceSerial、channel、accessToken\n const props = defineProps<{\n // 播放地址\n // 高清：ezopen://open.ys7.com/${设备序列号}/${通道号}.hd.live\n // 流畅：ezopen://open.ys7.com/${设备序列号}/${通道号}.live\n url?: string;\n // 设备序列号\n deviceSerial?: string;\n // 通道号\n channel?: number;\n // 清晰度,默认为空，也表示高清\n // hd：高清；sd：流畅\n quality?: 'hd' | 'sd' | '';\n accessToken: string;\n debug?: boolean;\n }>();\n\n // 播放器模板ID\n // 可在萤石云控制台查看、修改、获取\n // 位置：云直播-轻应用-特致珈默认模板\n const PLAYER_TEMPLATE = '5f295a9341a74d439b5d69374c90d501';\n const id = uuid();\n let playerInstance: any = null;\n let errorMsg = '';\n const ysRef = shallowRef();\n const { width, height } = useElementSize(ysRef);\n let ratio = 16 / 9;\n\n onMounted(() => play());\n\n defineExpose({ play, destroy, resize });\n\n // 防抖函数\n function debounce(func: Function, wait: number) {\n let timeout: ReturnType<typeof setTimeout> | null = null;\n return function (this: any, ...args: any[]) {\n if (timeout) clearTimeout(timeout);\n timeout = setTimeout(() => func.apply(this, args), wait);\n };\n }\n\n // 加上防抖的 resize 函数\n const debouncedResize = debounce(resize, 300);\n\n watch(\n () => [width.value, height.value, ratio],\n () => debouncedResize(),\n );\n\n function play(options?: Record<string, any>) {\n props.debug && console.log('play', options);\n if (!props.accessToken) {\n errorMsg = `params 'accessToken' is not fount`;\n } else {\n const url = formatterUrl();\n if (url) {\n createPlayerDom();\n nextTick(() => createPlayer(options));\n }\n }\n }\n function destroy() {\n if (playerInstance) {\n playerInstance.destroy();\n playerInstance = null;\n removePlayerDom();\n }\n }\n function resize() {\n // 根据播放器宽高比，设置播放器高度\n if (width.value > 0 && height.value > 0) {\n let calculatedWidth = width.value;\n let calculatedHeight = calculatedWidth / ratio;\n if (calculatedHeight > height.value) {\n calculatedHeight = height.value;\n calculatedWidth = calculatedHeight * ratio;\n }\n props.debug && console.log('playerInstance', playerInstance);\n if (playerInstance.resize) {\n playerInstance.resize(calculatedWidth, calculatedHeight);\n } else {\n const dom = document.getElementById(id);\n if (dom) {\n dom.style.width = `${calculatedWidth}px`;\n dom.style.height = `${calculatedHeight}px`;\n }\n }\n }\n }\n\n /**\n * 创建萤石云播放器实例，播放萤石云直播流\n */\n function createPlayer(options?: Record<string, any>) {\n playerInstance = new EZUIKit.EZUIKitPlayer({\n id,\n url: formatterUrl(),\n accessToken: props.accessToken,\n template: PLAYER_TEMPLATE,\n width: width.value,\n height: height.value,\n audio: 1,\n // @ts-ignore\n loggerOptions: {\n name: 'YSPLAYER',\n level: 'ERROR',\n showTime: true,\n },\n ...options,\n });\n\n playerInstance.eventEmitter.on('destroy', (args: any) => {\n props.debug && console.log('destroy', args);\n });\n playerInstance.eventEmitter.on('init', (args: any) => {\n props.debug && console.log('init', args);\n });\n playerInstance.eventEmitter.on('play', (args: any) => {\n props.debug && console.log('play', args);\n });\n playerInstance.eventEmitter.on('videoInfo', (args: any) => {\n const { width: w, height: h } = args;\n // 计算播放器宽高比\n if (w && h) {\n ratio = w / h;\n }\n });\n }\n\n function formatterUrl(): string {\n if (props.url) {\n return props.url;\n } else {\n if (props.deviceSerial && props.channel) {\n const quality = props.quality === '' || props.quality === 'hd' ? 'hd.' : '';\n return `ezopen://open.ys7.com/${props.deviceSerial}/${props.channel}.${quality}live`;\n } else {\n errorMsg = `params 'deviceSerial' or 'channel' is not fount`;\n return '';\n }\n }\n }\n\n // 移除播放器DOM\n function removePlayerDom() {\n const dom = document.getElementById(id);\n dom && dom.remove();\n }\n // 创建播放器DOM\n function createPlayerDom() {\n if (!errorMsg) {\n removePlayerDom();\n const dom = document.createElement('div');\n dom.id = id;\n dom.style.width = '100%';\n dom.style.height = '100%';\n ysRef.value?.appendChild(dom);\n }\n }\n</script>\n\n<template>\n <div ref=\"ysRef\" class=\"i-player-bg i-player-container\">\n <div v-if=\"errorMsg\" class=\"i-player__error\">{{ errorMsg }}</div>\n </div>\n</template>\n"],"names":["uuid","shallowRef","useElementSize","onMounted","watch","nextTick"],"mappings":"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"}
|