@hopeplayer/vue 1.0.17 → 1.1.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 +15 -13
- package/dist/hope-player-vue.js.map +1 -1
- package/package.json +3 -3
package/dist/hope-player-vue.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { defineComponent as h, ref as m, onMounted as f, watch as g, onBeforeUnmount as
|
|
1
|
+
import { defineComponent as h, ref as m, onMounted as f, watch as g, onBeforeUnmount as B, openBlock as b, createElementBlock as k } from "vue";
|
|
2
2
|
const O = /* @__PURE__ */ h({
|
|
3
3
|
__name: "HopePlayer",
|
|
4
4
|
props: {
|
|
@@ -14,6 +14,7 @@ const O = /* @__PURE__ */ h({
|
|
|
14
14
|
theme: {},
|
|
15
15
|
subtitles: {},
|
|
16
16
|
playbackRates: {},
|
|
17
|
+
qualityBadge: { type: Boolean },
|
|
17
18
|
autoHideDelayMs: {},
|
|
18
19
|
cursorHideDelayMs: { type: [Number, Boolean] },
|
|
19
20
|
tapToPlay: { type: [String, Boolean] },
|
|
@@ -42,6 +43,7 @@ const O = /* @__PURE__ */ h({
|
|
|
42
43
|
story: {},
|
|
43
44
|
markers: {},
|
|
44
45
|
segments: {},
|
|
46
|
+
skipSegments: {},
|
|
45
47
|
spriteThumbnails: {},
|
|
46
48
|
countdownScreen: {},
|
|
47
49
|
geoChecker: {},
|
|
@@ -54,7 +56,7 @@ const O = /* @__PURE__ */ h({
|
|
|
54
56
|
},
|
|
55
57
|
emits: ["ready", "play", "pause", "ended", "error", "qualitychange", "ratechange", "adstart", "adend", "aderror", "itemchange", "sticky", "sourcefallback"],
|
|
56
58
|
setup(p, { expose: i, emit: c }) {
|
|
57
|
-
const
|
|
59
|
+
const r = p, t = c, o = m(null);
|
|
58
60
|
let s = !1, l = [];
|
|
59
61
|
f(() => {
|
|
60
62
|
const a = o.value;
|
|
@@ -73,33 +75,33 @@ const O = /* @__PURE__ */ h({
|
|
|
73
75
|
[
|
|
74
76
|
"hp:itemchange",
|
|
75
77
|
(e) => {
|
|
76
|
-
const
|
|
77
|
-
t("itemchange",
|
|
78
|
+
const n = e.detail;
|
|
79
|
+
t("itemchange", n.index, n.source);
|
|
78
80
|
}
|
|
79
81
|
],
|
|
80
82
|
[
|
|
81
83
|
"hp:sticky",
|
|
82
84
|
(e) => {
|
|
83
|
-
const
|
|
84
|
-
t("sticky",
|
|
85
|
+
const n = e.detail;
|
|
86
|
+
t("sticky", n.sticky, n.corner);
|
|
85
87
|
}
|
|
86
88
|
],
|
|
87
89
|
["hp:sourcefallback", (e) => t("sourcefallback", e.detail)]
|
|
88
90
|
];
|
|
89
|
-
for (const [e,
|
|
91
|
+
for (const [e, n] of l) a.addEventListener(e, n);
|
|
90
92
|
import("@hopeplayer/core").then(() => {
|
|
91
|
-
s || !o.value || (o.value.options = { ...
|
|
93
|
+
s || !o.value || (o.value.options = { ...r });
|
|
92
94
|
});
|
|
93
95
|
}
|
|
94
96
|
}), g(
|
|
95
|
-
() => JSON.stringify(
|
|
97
|
+
() => JSON.stringify(r),
|
|
96
98
|
() => {
|
|
97
|
-
o.value && (o.value.options = { ...
|
|
99
|
+
o.value && (o.value.options = { ...r });
|
|
98
100
|
}
|
|
99
|
-
),
|
|
101
|
+
), B(() => {
|
|
100
102
|
s = !0;
|
|
101
103
|
const a = o.value;
|
|
102
|
-
if (a) for (const [e,
|
|
104
|
+
if (a) for (const [e, n] of l) a.removeEventListener(e, n);
|
|
103
105
|
});
|
|
104
106
|
function d() {
|
|
105
107
|
var a;
|
|
@@ -112,7 +114,7 @@ const O = /* @__PURE__ */ h({
|
|
|
112
114
|
function y() {
|
|
113
115
|
return o.value;
|
|
114
116
|
}
|
|
115
|
-
return i({ play: d, pause: u, getElement: y }), (a, e) => (
|
|
117
|
+
return i({ play: d, pause: u, getElement: y }), (a, e) => (b(), k("hope-player", {
|
|
116
118
|
ref_key: "elRef",
|
|
117
119
|
ref: o
|
|
118
120
|
}, 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, watch } 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}>();\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 ];\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 elRef.value.options = { ...props } as HopePlayerOptions;\n });\n});\n\n// Tüm prop'lar tek bir string olarak izlenir (prop başına ayrı watcher gerekmez).\nwatch(\n () => JSON.stringify(props),\n () => {\n if (elRef.value) elRef.value.options = { ...props } as HopePlayerOptions;\n }\n);\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","elRef","ref","cancelled","listeners","onMounted","el","detail","name","handler","watch","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, watch } 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}>();\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 ];\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 elRef.value.options = { ...props } as HopePlayerOptions;\n });\n});\n\n// Tüm prop'lar tek bir string olarak izlenir (prop başına ayrı watcher gerekmez).\nwatch(\n () => JSON.stringify(props),\n () => {\n if (elRef.value) elRef.value.options = { ...props } as HopePlayerOptions;\n }\n);\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","elRef","ref","cancelled","listeners","onMounted","el","detail","name","handler","watch","onBeforeUnmount","play","_a","pause","getElement","__expose","_createElementBlock"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAOA,UAAMA,IAAQC,GAERC,IAAOC,GAgBPC,IAAQC,EAAyB,IAAI;AAC3C,QAAIC,IAAY,IACZC,IAA8D,CAAA;AAElE,IAAAC,EAAU,MAAM;AACZ,YAAMC,IAAKL,EAAM;AACjB,UAAKK,GAIL;AAAA,QAAAF,IAAY;AAAA,UACR,CAAC,YAAY,MAAML,EAAK,OAAO,CAAC;AAAA,UAChC,CAAC,WAAW,MAAMA,EAAK,MAAM,CAAC;AAAA,UAC9B,CAAC,YAAY,MAAMA,EAAK,OAAO,CAAC;AAAA,UAChC,CAAC,YAAY,MAAMA,EAAK,OAAO,CAAC;AAAA,UAChC,CAAC,YAAY,CAAC,MAAMA,EAAK,SAAU,EAAuC,OAAO,OAAO,CAAC;AAAA,UACzF,CAAC,oBAAoB,CAAC,MAAMA,EAAK,iBAAkB,EAAqC,OAAO,KAAK,CAAC;AAAA,UACrG,CAAC,iBAAiB,CAAC,MAAMA,EAAK,cAAe,EAAoC,OAAO,IAAI,CAAC;AAAA,UAC7F,CAAC,cAAc,CAAC,MAAMA,EAAK,WAAY,EAAgE,OAAO,IAAI,CAAC;AAAA,UACnH,CAAC,YAAY,CAAC,MAAMA,EAAK,SAAU,EAAgE,OAAO,IAAI,CAAC;AAAA,UAC/G,CAAC,cAAc,CAAC,MAAMA,EAAK,WAAY,EAAuC,OAAO,OAAO,CAAC;AAAA,UAC7F;AAAA,YACI;AAAA,YACA,CAAC,MAAM;AACH,oBAAMQ,IAAU,EAAmE;AACnF,cAAAR,EAAK,cAAcQ,EAAO,OAAOA,EAAO,MAAM;AAAA,YAClD;AAAA,UAAA;AAAA,UAEJ;AAAA,YACI;AAAA,YACA,CAAC,MAAM;AACH,oBAAMA,IAAU,EAA8D;AAC9E,cAAAR,EAAK,UAAUQ,EAAO,QAAQA,EAAO,MAAM;AAAA,YAC/C;AAAA,UAAA;AAAA,UAEJ,CAAC,qBAAqB,CAAC,MAAMR,EAAK,kBAAmB,EAA8C,MAAM,CAAC;AAAA,QAAA;AAE9G,mBAAW,CAACS,GAAMC,CAAO,KAAKL,EAAW,CAAAE,EAAG,iBAAiBE,GAAMC,CAAO;AAG1E,eAAO,kBAAkB,EAAE,KAAK,MAAM;AAClC,UAAIN,KAAa,CAACF,EAAM,UACxBA,EAAM,MAAM,UAAU,EAAE,GAAGJ,EAAA;AAAA,QAC/B,CAAC;AAAA;AAAA,IACL,CAAC,GAGDa;AAAA,MACI,MAAM,KAAK,UAAUb,CAAK;AAAA,MAC1B,MAAM;AACF,QAAII,EAAM,UAAOA,EAAM,MAAM,UAAU,EAAE,GAAGJ,EAAA;AAAA,MAChD;AAAA,IAAA,GAGJc,EAAgB,MAAM;AAClB,MAAAR,IAAY;AACZ,YAAMG,IAAKL,EAAM;AACjB,UAAIK,EAAI,YAAW,CAACE,GAAMC,CAAO,KAAKL,EAAW,CAAAE,EAAG,oBAAoBE,GAAMC,CAAO;AAAA,IACzF,CAAC;AAED,aAASG,IAAsB;;AAC3B,eAAOC,IAAAZ,EAAM,UAAN,gBAAAY,EAAa,WAAU,QAAQ,QAAA;AAAA,IAC1C;AAEA,aAASC,IAAc;;AACnB,OAAAD,IAAAZ,EAAM,UAAN,QAAAY,EAAa;AAAA,IACjB;AAEA,aAASE,IAAkC;AACvC,aAAOd,EAAM;AAAA,IACjB;AAEA,WAAAe,EAAa,EAAE,MAAAJ,GAAM,OAAAE,GAAO,YAAAC,EAAA,CAAY,mBAIpCE,EAA2B,eAAA;AAAA,eAAV;AAAA,MAAJ,KAAIhB;AAAA,IAAA;;;"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@hopeplayer/vue",
|
|
3
|
-
"version": "1.0
|
|
3
|
+
"version": "1.1.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.0
|
|
38
|
+
"@hopeplayer/core": "^1.1.0",
|
|
39
39
|
"vue": ">=3.3"
|
|
40
40
|
},
|
|
41
41
|
"devDependencies": {
|
|
42
|
-
"@hopeplayer/core": "^1.0
|
|
42
|
+
"@hopeplayer/core": "^1.1.0",
|
|
43
43
|
"@vitejs/plugin-vue": "^6.0.0",
|
|
44
44
|
"typescript": "^5.7.0",
|
|
45
45
|
"vite": "^6.0.0",
|