@hopeplayer/vue 1.5.0 → 1.6.0
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/dist/hope-player-vue.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { defineComponent as k, getCurrentInstance as O, ref as j, onMounted as v, watch as S, onUpdated as R, onBeforeUnmount as w, openBlock as
|
|
1
|
+
import { defineComponent as k, getCurrentInstance as O, ref as j, onMounted as v, watch as S, onUpdated as R, onBeforeUnmount as w, openBlock as P, createElementBlock as _, camelize as q } from "vue";
|
|
2
2
|
const E = /* @__PURE__ */ k({
|
|
3
3
|
__name: "HopePlayer",
|
|
4
4
|
props: {
|
|
@@ -19,6 +19,8 @@ const E = /* @__PURE__ */ k({
|
|
|
19
19
|
qualityLimit: {},
|
|
20
20
|
liveSeekBar: { type: Boolean },
|
|
21
21
|
pipButton: { type: Boolean },
|
|
22
|
+
documentPip: { type: [Boolean, Object] },
|
|
23
|
+
interactive: {},
|
|
22
24
|
fullscreenButton: { type: Boolean },
|
|
23
25
|
autoHideDelayMs: {},
|
|
24
26
|
cursorHideDelayMs: { type: [Number, Boolean] },
|
|
@@ -52,6 +54,8 @@ const E = /* @__PURE__ */ k({
|
|
|
52
54
|
story: {},
|
|
53
55
|
markers: {},
|
|
54
56
|
segments: {},
|
|
57
|
+
transcript: { type: [Boolean, Object] },
|
|
58
|
+
heatmap: {},
|
|
55
59
|
skipSegments: {},
|
|
56
60
|
accessibility: { type: [Boolean, Object] },
|
|
57
61
|
history: { type: [Boolean, Object] },
|
|
@@ -70,7 +74,7 @@ const E = /* @__PURE__ */ k({
|
|
|
70
74
|
setup(d, { expose: u, emit: m }) {
|
|
71
75
|
const i = d, a = m, r = O();
|
|
72
76
|
function h() {
|
|
73
|
-
const t = (r == null ? void 0 : r.vnode.props) ?? {}, e = new Set(Object.keys(t).map(
|
|
77
|
+
const t = (r == null ? void 0 : r.vnode.props) ?? {}, e = new Set(Object.keys(t).map(q));
|
|
74
78
|
return Object.fromEntries(Object.entries(i).filter(([o, g]) => e.has(o) && g !== void 0));
|
|
75
79
|
}
|
|
76
80
|
const n = j(null);
|
|
@@ -123,18 +127,18 @@ const E = /* @__PURE__ */ k({
|
|
|
123
127
|
const t = n.value;
|
|
124
128
|
if (t) for (const [e, o] of l) t.removeEventListener(e, o);
|
|
125
129
|
});
|
|
126
|
-
function
|
|
130
|
+
function B() {
|
|
127
131
|
var t;
|
|
128
132
|
return ((t = n.value) == null ? void 0 : t.play()) ?? Promise.resolve();
|
|
129
133
|
}
|
|
130
|
-
function
|
|
134
|
+
function f() {
|
|
131
135
|
var t;
|
|
132
136
|
(t = n.value) == null || t.pause();
|
|
133
137
|
}
|
|
134
138
|
function b() {
|
|
135
139
|
return n.value;
|
|
136
140
|
}
|
|
137
|
-
return u({ play:
|
|
141
|
+
return u({ play: B, pause: f, getElement: b }), (t, e) => (P(), _("hope-player", {
|
|
138
142
|
ref_key: "elRef",
|
|
139
143
|
ref: n
|
|
140
144
|
}, null, 512));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"hope-player-vue.js","sources":["../src/HopePlayer.vue"],"sourcesContent":["<script setup lang=\"ts\">\n// <hope-player> için ince Vue sarmalayıcı: prop'ları `.options`'a yazar, `hp:*` event'lerini emit'lere çevirir.\n// class/style Vue'nun fallthrough attribute'larıyla köke geçer. Core `onMounted` içinde dinamik import edilir —\n// statik import `HTMLElement` olmayan SSR'da (Nuxt) çöker.\nimport { ref, onMounted, onBeforeUnmount, onUpdated, watch, getCurrentInstance, camelize } from 'vue';\nimport type { HopePlayerElement as HopePlayerEl, HopePlayerEventMap, HopePlayerOptions, StickyCorner } from '@hopeplayer/core';\n\nconst props = defineProps<HopePlayerOptions>();\n\nconst emit = defineEmits<{\n ready: [];\n play: [];\n pause: [];\n ended: [];\n error: [message: string];\n qualitychange: [label: string];\n ratechange: [rate: number];\n adstart: [type: 'preroll' | 'midroll' | 'postroll'];\n adend: [type: 'preroll' | 'midroll' | 'postroll'];\n aderror: [message: string];\n itemchange: [index: number, source: 'playlist' | 'story'];\n sticky: [sticky: boolean, corner: StickyCorner | undefined];\n sourcefallback: [detail: HopePlayerEventMap['hp:sourcefallback']['detail']];\n analytics: [detail: HopePlayerEventMap['hp:analytics']['detail']];\n}>();\n\nconst instance = getCurrentInstance();\n\n/**\n * Yalnızca gerçekten verilen prop'lar `.options`'a geçer. Vue, `boolean` tipli bir prop verilmediğinde onu `undefined`\n * değil `false` yapar (boolean casting) — `{ ...props }` doğrudan yazılsaydı varsayılanı açık / 'auto' olan seçenekler\n * kapanırdı: `tapToPlay: false` (videoya tıklamak oynatmıyordu), `cursorHideDelayMs: false` (imleç hiç gizlenmiyordu),\n * `qualityBadge: false`.\n */\nfunction passedOptions(): HopePlayerOptions {\n const raw = instance?.vnode.props ?? {};\n const passed = new Set(Object.keys(raw).map(camelize));\n return Object.fromEntries(Object.entries(props).filter(([key, value]) => passed.has(key) && value !== undefined)) as HopePlayerOptions;\n}\n\nconst elRef = ref<HopePlayerEl | null>(null);\nlet cancelled = false;\nlet listeners: Array<[keyof HopePlayerEventMap, EventListener]> = [];\n\nonMounted(() => {\n const el = elRef.value;\n if (!el) return;\n\n // Dinleyiciler import'u beklemeden eklenir: core yüklenince customElements.define() elementi senkron upgrade\n // edip hp:ready'yi .then()'den ÖNCE dispatch ediyor — beklenirse @ready kaçırılır.\n listeners = [\n ['hp:ready', () => emit('ready')],\n ['hp:play', () => emit('play')],\n ['hp:pause', () => emit('pause')],\n ['hp:ended', () => emit('ended')],\n ['hp:error', (e) => emit('error', (e as CustomEvent<{ message: string }>).detail.message)],\n ['hp:qualitychange', (e) => emit('qualitychange', (e as CustomEvent<{ label: string }>).detail.label)],\n ['hp:ratechange', (e) => emit('ratechange', (e as CustomEvent<{ rate: number }>).detail.rate)],\n ['hp:adstart', (e) => emit('adstart', (e as CustomEvent<{ type: 'preroll' | 'midroll' | 'postroll' }>).detail.type)],\n ['hp:adend', (e) => emit('adend', (e as CustomEvent<{ type: 'preroll' | 'midroll' | 'postroll' }>).detail.type)],\n ['hp:aderror', (e) => emit('aderror', (e as CustomEvent<{ message: string }>).detail.message)],\n [\n 'hp:itemchange',\n (e) => {\n const detail = (e as CustomEvent<{ index: number; source: 'playlist' | 'story' }>).detail;\n emit('itemchange', detail.index, detail.source);\n },\n ],\n [\n 'hp:sticky',\n (e) => {\n const detail = (e as CustomEvent<{ sticky: boolean; corner?: StickyCorner }>).detail;\n emit('sticky', detail.sticky, detail.corner);\n },\n ],\n ['hp:sourcefallback', (e) => emit('sourcefallback', (e as HopePlayerEventMap['hp:sourcefallback']).detail)],\n ['hp:analytics', (e) => emit('analytics', (e as HopePlayerEventMap['hp:analytics']).detail)],\n ];\n for (const [name, handler] of listeners) el.addEventListener(name, handler);\n\n // .options için import'u bekle: element upgrade olmadan yazmak prototip accessor'ını kalıcı olarak maskeler.\n import('@hopeplayer/core').then(() => {\n if (cancelled || !elRef.value) return;\n coreReady = true;\n sync();\n });\n});\n\nlet coreReady = false;\nlet lastOptions = '';\n\n/** Verilen prop'lar değiştiyse `.options`'a yazar (aynıysa yazmaz — player gereksiz yere yeniden kurulmasın). */\nfunction sync(): void {\n if (!coreReady || !elRef.value) return;\n const options = passedOptions();\n const json = JSON.stringify(options);\n if (json === lastOptions) return;\n lastOptions = json;\n elRef.value.options = options;\n}\n\n// Değer değişimi: tüm prop'lar tek bir string olarak izlenir (prop başına ayrı watcher gerekmez).\nwatch(() => JSON.stringify(props), sync);\n// Prop'un verilip verilmemesi: boolean casting yüzünden değer aynı kalabilir (yokken de false) — Vue yine de bileşeni\n// günceller (verilen prop'ların listesi değişti), o an tekrar bakılır.\nonUpdated(sync);\n\nonBeforeUnmount(() => {\n cancelled = true;\n const el = elRef.value;\n if (el) for (const [name, handler] of listeners) el.removeEventListener(name, handler);\n});\n\nfunction play(): Promise<void> {\n return elRef.value?.play() ?? Promise.resolve();\n}\n\nfunction pause(): void {\n elRef.value?.pause();\n}\n\nfunction getElement(): HopePlayerEl | null {\n return elRef.value;\n}\n\ndefineExpose({ play, pause, getElement });\n</script>\n\n<template>\n <hope-player ref=\"elRef\" />\n</template>\n"],"names":["props","__props","emit","__emit","instance","getCurrentInstance","passedOptions","raw","passed","camelize","key","value","elRef","ref","cancelled","listeners","onMounted","el","detail","name","handler","coreReady","sync","lastOptions","options","json","watch","onUpdated","onBeforeUnmount","play","_a","pause","getElement","__expose","_createElementBlock"],"mappings":"
|
|
1
|
+
{"version":3,"file":"hope-player-vue.js","sources":["../src/HopePlayer.vue"],"sourcesContent":["<script setup lang=\"ts\">\n// <hope-player> için ince Vue sarmalayıcı: prop'ları `.options`'a yazar, `hp:*` event'lerini emit'lere çevirir.\n// class/style Vue'nun fallthrough attribute'larıyla köke geçer. Core `onMounted` içinde dinamik import edilir —\n// statik import `HTMLElement` olmayan SSR'da (Nuxt) çöker.\nimport { ref, onMounted, onBeforeUnmount, onUpdated, watch, getCurrentInstance, camelize } from 'vue';\nimport type { HopePlayerElement as HopePlayerEl, HopePlayerEventMap, HopePlayerOptions, StickyCorner } from '@hopeplayer/core';\n\nconst props = defineProps<HopePlayerOptions>();\n\nconst emit = defineEmits<{\n ready: [];\n play: [];\n pause: [];\n ended: [];\n error: [message: string];\n qualitychange: [label: string];\n ratechange: [rate: number];\n adstart: [type: 'preroll' | 'midroll' | 'postroll'];\n adend: [type: 'preroll' | 'midroll' | 'postroll'];\n aderror: [message: string];\n itemchange: [index: number, source: 'playlist' | 'story'];\n sticky: [sticky: boolean, corner: StickyCorner | undefined];\n sourcefallback: [detail: HopePlayerEventMap['hp:sourcefallback']['detail']];\n analytics: [detail: HopePlayerEventMap['hp:analytics']['detail']];\n}>();\n\nconst instance = getCurrentInstance();\n\n/**\n * Yalnızca gerçekten verilen prop'lar `.options`'a geçer. Vue, `boolean` tipli bir prop verilmediğinde onu `undefined`\n * değil `false` yapar (boolean casting) — `{ ...props }` doğrudan yazılsaydı varsayılanı açık / 'auto' olan seçenekler\n * kapanırdı: `tapToPlay: false` (videoya tıklamak oynatmıyordu), `cursorHideDelayMs: false` (imleç hiç gizlenmiyordu),\n * `qualityBadge: false`.\n */\nfunction passedOptions(): HopePlayerOptions {\n const raw = instance?.vnode.props ?? {};\n const passed = new Set(Object.keys(raw).map(camelize));\n return Object.fromEntries(Object.entries(props).filter(([key, value]) => passed.has(key) && value !== undefined)) as HopePlayerOptions;\n}\n\nconst elRef = ref<HopePlayerEl | null>(null);\nlet cancelled = false;\nlet listeners: Array<[keyof HopePlayerEventMap, EventListener]> = [];\n\nonMounted(() => {\n const el = elRef.value;\n if (!el) return;\n\n // Dinleyiciler import'u beklemeden eklenir: core yüklenince customElements.define() elementi senkron upgrade\n // edip hp:ready'yi .then()'den ÖNCE dispatch ediyor — beklenirse @ready kaçırılır.\n listeners = [\n ['hp:ready', () => emit('ready')],\n ['hp:play', () => emit('play')],\n ['hp:pause', () => emit('pause')],\n ['hp:ended', () => emit('ended')],\n ['hp:error', (e) => emit('error', (e as CustomEvent<{ message: string }>).detail.message)],\n ['hp:qualitychange', (e) => emit('qualitychange', (e as CustomEvent<{ label: string }>).detail.label)],\n ['hp:ratechange', (e) => emit('ratechange', (e as CustomEvent<{ rate: number }>).detail.rate)],\n ['hp:adstart', (e) => emit('adstart', (e as CustomEvent<{ type: 'preroll' | 'midroll' | 'postroll' }>).detail.type)],\n ['hp:adend', (e) => emit('adend', (e as CustomEvent<{ type: 'preroll' | 'midroll' | 'postroll' }>).detail.type)],\n ['hp:aderror', (e) => emit('aderror', (e as CustomEvent<{ message: string }>).detail.message)],\n [\n 'hp:itemchange',\n (e) => {\n const detail = (e as CustomEvent<{ index: number; source: 'playlist' | 'story' }>).detail;\n emit('itemchange', detail.index, detail.source);\n },\n ],\n [\n 'hp:sticky',\n (e) => {\n const detail = (e as CustomEvent<{ sticky: boolean; corner?: StickyCorner }>).detail;\n emit('sticky', detail.sticky, detail.corner);\n },\n ],\n ['hp:sourcefallback', (e) => emit('sourcefallback', (e as HopePlayerEventMap['hp:sourcefallback']).detail)],\n ['hp:analytics', (e) => emit('analytics', (e as HopePlayerEventMap['hp:analytics']).detail)],\n ];\n for (const [name, handler] of listeners) el.addEventListener(name, handler);\n\n // .options için import'u bekle: element upgrade olmadan yazmak prototip accessor'ını kalıcı olarak maskeler.\n import('@hopeplayer/core').then(() => {\n if (cancelled || !elRef.value) return;\n coreReady = true;\n sync();\n });\n});\n\nlet coreReady = false;\nlet lastOptions = '';\n\n/** Verilen prop'lar değiştiyse `.options`'a yazar (aynıysa yazmaz — player gereksiz yere yeniden kurulmasın). */\nfunction sync(): void {\n if (!coreReady || !elRef.value) return;\n const options = passedOptions();\n const json = JSON.stringify(options);\n if (json === lastOptions) return;\n lastOptions = json;\n elRef.value.options = options;\n}\n\n// Değer değişimi: tüm prop'lar tek bir string olarak izlenir (prop başına ayrı watcher gerekmez).\nwatch(() => JSON.stringify(props), sync);\n// Prop'un verilip verilmemesi: boolean casting yüzünden değer aynı kalabilir (yokken de false) — Vue yine de bileşeni\n// günceller (verilen prop'ların listesi değişti), o an tekrar bakılır.\nonUpdated(sync);\n\nonBeforeUnmount(() => {\n cancelled = true;\n const el = elRef.value;\n if (el) for (const [name, handler] of listeners) el.removeEventListener(name, handler);\n});\n\nfunction play(): Promise<void> {\n return elRef.value?.play() ?? Promise.resolve();\n}\n\nfunction pause(): void {\n elRef.value?.pause();\n}\n\nfunction getElement(): HopePlayerEl | null {\n return elRef.value;\n}\n\ndefineExpose({ play, pause, getElement });\n</script>\n\n<template>\n <hope-player ref=\"elRef\" />\n</template>\n"],"names":["props","__props","emit","__emit","instance","getCurrentInstance","passedOptions","raw","passed","camelize","key","value","elRef","ref","cancelled","listeners","onMounted","el","detail","name","handler","coreReady","sync","lastOptions","options","json","watch","onUpdated","onBeforeUnmount","play","_a","pause","getElement","__expose","_createElementBlock"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@hopeplayer/vue",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.6.0",
|
|
4
4
|
"description": "Thin Vue 3 wrapper around <hope-player> (@hopeplayer/core) — prop/event bridge only, no state duplication",
|
|
5
5
|
"keywords": ["vue", "vue3", "nuxt", "vue-component", "video-player", "video", "player", "html5-video", "hls", "m3u8", "web-component", "custom-element", "ima", "vast", "vmap", "prebid", "ads", "monetization", "chromecast", "airplay", "subtitles", "shadow-dom", "hopeplayer"],
|
|
6
6
|
"repository": {
|
|
@@ -35,11 +35,11 @@
|
|
|
35
35
|
"typecheck": "vue-tsc -p tsconfig.json --noEmit"
|
|
36
36
|
},
|
|
37
37
|
"peerDependencies": {
|
|
38
|
-
"@hopeplayer/core": "^1.
|
|
38
|
+
"@hopeplayer/core": "^1.6.0",
|
|
39
39
|
"vue": ">=3.3"
|
|
40
40
|
},
|
|
41
41
|
"devDependencies": {
|
|
42
|
-
"@hopeplayer/core": "^1.
|
|
42
|
+
"@hopeplayer/core": "^1.6.0",
|
|
43
43
|
"@vitejs/plugin-vue": "^6.0.0",
|
|
44
44
|
"typescript": "^5.7.0",
|
|
45
45
|
"vite": "^6.0.0",
|