@hyperframes/player 0.6.118 → 0.6.120
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/hyperframes-player.cjs +1 -1
- package/dist/hyperframes-player.cjs.map +1 -1
- package/dist/hyperframes-player.d.cts +1 -0
- package/dist/hyperframes-player.d.ts +1 -0
- package/dist/hyperframes-player.global.js +1 -1
- package/dist/hyperframes-player.global.js.map +1 -1
- package/dist/hyperframes-player.js +1 -1
- package/dist/hyperframes-player.js.map +1 -1
- package/dist/slideshow/hyperframes-slideshow.cjs +96 -30
- package/dist/slideshow/hyperframes-slideshow.cjs.map +1 -1
- package/dist/slideshow/hyperframes-slideshow.d.cts +29 -0
- package/dist/slideshow/hyperframes-slideshow.d.ts +29 -0
- package/dist/slideshow/hyperframes-slideshow.global.js +96 -30
- package/dist/slideshow/hyperframes-slideshow.global.js.map +1 -1
- package/dist/slideshow/hyperframes-slideshow.js +96 -30
- package/dist/slideshow/hyperframes-slideshow.js.map +1 -1
- package/package.json +2 -2
|
@@ -1,25 +1,29 @@
|
|
|
1
|
-
"use strict";var
|
|
1
|
+
"use strict";var S=Object.defineProperty;var K=Object.getOwnPropertyDescriptor;var z=Object.getOwnPropertyNames;var G=Object.prototype.hasOwnProperty;var j=(n,e)=>{for(var t in e)S(n,t,{get:e[t],enumerable:!0})},W=(n,e,t,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let r of z(e))!G.call(n,r)&&r!==t&&S(n,r,{get:()=>e[r],enumerable:!(i=K(e,r))||i.enumerable});return n};var Y=n=>W(S({},"__esModule",{value:!0}),n);var Se={};j(Se,{HyperframesSlideshow:()=>b,dropInvalidSlides:()=>H});module.exports=Y(Se);var X="application/hyperframes-slideshow+json";function V(n="i"){let e=X.replace(/[.*+?^${}()|[\]\\]/g,"\\$&");return new RegExp(`<script[^>]*type=["']${e}["'][^>]*>([\\s\\S]*?)<\\/script>`,n)}function I(n){let t=V("i").exec(n);if(!t||t[1]===void 0)return null;let i=t[1].trim();if(i.length===0)return null;let r=JSON.parse(i);if(!Q(r))throw new Error("slideshow island is not a valid SlideshowManifest");return r}function P(n){if(typeof n!="object"||n===null)return!1;let e=n;return!(typeof e.sceneId!="string"||e.fragments!==void 0&&!(Array.isArray(e.fragments)&&e.fragments.every(t=>typeof t=="number"))||e.hotspots!==void 0&&!Array.isArray(e.hotspots))}function J(n){if(typeof n!="object"||n===null)return!1;let e=n;return typeof e.id=="string"&&typeof e.label=="string"&&Array.isArray(e.slides)&&e.slides.every(P)}function Q(n){if(typeof n!="object"||n===null||Array.isArray(n))return!1;let e=n;return!(!Array.isArray(e.slides)||!e.slides.every(P)||e.slideSequences!==void 0&&(!Array.isArray(e.slideSequences)||!e.slideSequences.every(J)))}function Z(n,e){return`slide "${n}" sets ${e==="startTime"?"endTime":"startTime"} but ${e} cannot be resolved (no scene "${n}")`}function ee(n,e,t){let{startTime:i,endTime:r,sceneId:s}=n;if(i!==void 0&&r!==void 0)return{start:i,end:r};if(i===void 0&&r===void 0)return e?{start:e.start,end:e.start+e.duration}:(t.push(`slide references unresolved sceneId "${s}"`),{start:0,end:0});if(!e){let a=i===void 0?"startTime":"endTime";t.push(Z(s,a));let d=i??r??0;return{start:d,end:d}}return{start:i??e.start,end:r??e.start+e.duration}}function te(n,e,t,i,r){for(let s of e)(s<t||s>i)&&r.push(`slide "${n}" fragment ${s} is outside range [${t}, ${i}]`)}function E(n,e,t){let i=e.get(n.sceneId),{start:r,end:s}=ee(n,i,t);n.startTime!==void 0&&n.endTime!==void 0&&s<=r&&t.push(`slide "${n.sceneId}" has endTime (${s}) <= startTime (${r})`);let a=[...new Set(n.fragments??[])].sort((d,o)=>d-o);return te(n.sceneId,a,r,s,t),{...n,start:r,end:s,fragments:a,hotspots:n.hotspots??[]}}function $(n,e){let t=[],i=new Map(e.map(o=>[o.id,o])),r={};for(let o of n.slideSequences??[])Object.prototype.hasOwnProperty.call(r,o.id)&&t.push(`duplicate slideSequence id "${o.id}" \u2014 only the last definition is kept`),r[o.id]={id:o.id,label:o.label,slides:o.slides.map(l=>E(l,i,t))};let s=n.slides.map(o=>E(o,i,t)),a=[...s,...Object.values(r).flatMap(o=>o.slides)];for(let o of a)for(let l of o.hotspots){let u=r[l.target];u?u.slides.length===0&&t.push(`hotspot "${l.id}" targets empty sequence "${l.target}"`):t.push(`hotspot "${l.id}" targets unknown sequence "${l.target}"`)}let d=[...s].sort((o,l)=>o.start-l.start);for(let o=1;o<d.length;o++){let l=d[o-1],u=d[o];l!==void 0&&u!==void 0&&u.start<l.end&&t.push(`main-line slides "${l.sceneId}" and "${u.sceneId}" overlap`)}return{resolved:{slides:s,sequences:r},errors:t}}var f="main",v=class{constructor(e,t){this.player=e;this.show=t;this.enterSlide(0)}player;show;stack=[{sequenceId:f,slideIndex:0,fragmentIndex:-1}];changeCbs=new Set;dispose(){}slidesOf(e){return e===f?this.show.slides:this.show.sequences[e]?.slides??[]}get frame(){return this.stack[this.stack.length-1]}get currentSlide(){return this.slidesOf(this.frame.sequenceId)[this.frame.slideIndex]}get nextSlide(){return this.slidesOf(this.frame.sequenceId)[this.frame.slideIndex+1]??null}get position(){return{...this.frame}}get counter(){return{index:this.frame.slideIndex+1,total:this.slidesOf(this.frame.sequenceId).length}}get canPrev(){return this.frame.slideIndex>0||this.stack.length>1}get canNext(){let e=this.slidesOf(this.frame.sequenceId);return this.frame.slideIndex+1<e.length||this.stack.length>1}get breadcrumb(){return this.stack.map(e=>e.sequenceId===f?{id:f,label:"Main deck"}:{id:e.sequenceId,label:this.show.sequences[e.sequenceId]?.label??e.sequenceId})}onChange(e){return this.changeCbs.add(e),()=>this.changeCbs.delete(e)}emitChange(){for(let e of this.changeCbs)e()}stopSlideMedia(){this.player.stopMedia?.()}enterSlide(e){e!==this.frame.slideIndex&&this.stopSlideMedia(),this.frame.slideIndex=e;let t=this.currentSlide;if(!t){this.frame.fragmentIndex=-1;return}t.fragments.length>0?(this.frame.fragmentIndex=0,this.playTo(t.fragments[0]??t.end)):(this.frame.fragmentIndex=-1,this.playTo(this.restFrame(t))),this.emitChange()}restFrame(e){return e.start+(e.end-e.start)*.5}resumeSlide(e,t){this.frame.slideIndex=e,this.frame.fragmentIndex=t;let i=this.currentSlide;if(!i)return;let r=t>=0&&t<i.fragments.length?i.fragments[t]??i.start:i.fragments.length>0?i.start:this.restFrame(i);this.playTo(r),this.emitChange()}playTo(e){this.player.seek(e)}next(){let e=this.currentSlide;if(!e)return;if(this.frame.fragmentIndex+1<e.fragments.length){this.frame.fragmentIndex+=1;let r=e.fragments[this.frame.fragmentIndex]??e.end;this.playTo(r),this.emitChange();return}let i=this.slidesOf(this.frame.sequenceId);this.frame.slideIndex+1<i.length?this.enterSlide(this.frame.slideIndex+1):this.stack.length>1&&this.back()}prev(){if(this.frame.slideIndex>0){this.enterSlide(this.frame.slideIndex-1);return}this.stack.length>1&&this.back()}goToSlide(e){let t=this.slidesOf(this.frame.sequenceId);e>=0&&e<t.length&&this.enterSlide(e)}enterBranch(e){let t=this.show.sequences[e];!t||t.slides.length===0||(this.stopSlideMedia(),this.stack.push({sequenceId:e,slideIndex:0,fragmentIndex:-1}),this.enterSlide(0))}back(){this.stack.length<=1||(this.stopSlideMedia(),this.stack.pop(),this.resumeSlide(this.frame.slideIndex,this.frame.fragmentIndex))}backToMain(){this.stack.length<=1||(this.stopSlideMedia(),this.stack=[this.stack[0]],this.resumeSlide(this.frame.slideIndex,this.frame.fragmentIndex))}syncTo(e,t,i){this.isValidSyncTarget(e,t)&&(this.isCrossSlide(e,t)&&this.stopSlideMedia(),this.rerootStackTo(e)&&this.resumeSlide(t,i))}isValidSyncTarget(e,t){if(!this.stack[0])return!1;let i=e===f?this.show.slides:this.show.sequences[e]?.slides??null;return i?t>=0&&t<i.length:!1}isCrossSlide(e,t){return this.frame.sequenceId!==e||this.frame.slideIndex!==t}rerootStackTo(e){if(this.frame.sequenceId===e)return!0;let t=this.stack[0];if(!t)return!1;if(this.stack=[t],e===f)return!0;let i=this.show.sequences[e];return!i||i.slides.length===0?!1:(this.stack.push({sequenceId:e,slideIndex:0,fragmentIndex:-1}),!0)}};var C="Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif",ne=new Set(["play","pause","seeking","seeked","ratechange","volumechange","ended","timeupdate"]),ie=["currentTime","volume","playbackRate"],re=["paused","ended","muted"];function R(n){return!(typeof n!="object"||n===null)}function se(n){if(!R(n))return!1;let e=n;return e.type==="goto"&&typeof e.sequenceId=="string"&&typeof e.slideIndex=="number"&&typeof e.fragmentIndex=="number"}function oe(n){return ne.has(n)}function ae(n){return n==="presenter"||n==="audience"}function le(n){return ie.every(e=>typeof n[e]=="number")}function de(n){return re.every(e=>typeof n[e]=="boolean")}function ue(n){if(!R(n))return!1;let e=n;return e.type==="media"&&ae(e.sender)&&typeof e.key=="string"&&oe(e.action)&&le(e)&&de(e)}function ce(){return`hf-slideshow:${typeof location<"u"?location.pathname:""}`}var m=class{constructor(e,t,i=()=>{}){this.mode=e;this.onGoto=t;this.onMedia=i;try{this.channel=new BroadcastChannel(ce())}catch{return}this.channel.onmessage=r=>{if(se(r.data)){e==="audience"&&this.onGoto(r.data);return}ue(r.data)&&r.data.sender!==e&&this.onMedia(r.data)}}mode;onGoto;onMedia;channel=null;postPosition(e){if(this.mode!=="presenter"||!this.channel)return;let t={type:"goto",...e};this.channel.postMessage(t)}postMedia(e){this.channel&&this.channel.postMessage({type:"media",sender:this.mode,...e})}destroy(){this.channel&&(this.channel.onmessage=null,this.channel.close(),this.channel=null)}};function A(n){let e=s=>s.replace(/&/g,"&").replace(/</g,"<").replace(/>/g,">"),t=s=>e(s).replace(/"/g,"""),i=e(n.notes),r=n.hotspots.length?`<div style="display:flex;flex-direction:column;gap:6px;">
|
|
2
2
|
<div style="font-size:12px;text-transform:uppercase;letter-spacing:.12em;opacity:.55;">Branches</div>
|
|
3
|
-
${n.hotspots.map(
|
|
3
|
+
${n.hotspots.map(s=>`<button data-hotspot-id="${t(s.id)}" data-hotspot-target="${t(s.target)}" type="button" title="${t(s.label)}" style="text-align:left;background:rgba(244,183,64,0.14);color:#f4b740;border:1px solid rgba(244,183,64,0.4);border-radius:8px;padding:8px 12px;font-size:15px;cursor:pointer;pointer-events:auto;font-family:inherit;">↳ ${e(s.label)}</button>`).join("")}
|
|
4
4
|
</div>`:"";return`
|
|
5
5
|
<div data-hf-presenter style="position:absolute;left:0;right:0;bottom:0;height:32%;display:flex;background:#11151f;color:#fff;border-top:2px solid rgba(255,255,255,0.12);box-sizing:border-box;font-family:sans-serif;pointer-events:auto;">
|
|
6
|
-
<textarea data-hf-presenter-notes data-hf-presenter-notes-key="${t(n.notesStorageKey??"")}" aria-label="Speaker notes" placeholder="No notes for this slide" spellcheck="true" style="flex:1;min-width:0;padding:24px 36px;overflow:auto;font:inherit;font-size:21px;line-height:1.55;color:#fff;background:transparent;border:0;outline:none;resize:none;white-space:pre-wrap;pointer-events:auto;">${
|
|
6
|
+
<textarea data-hf-presenter-notes data-hf-presenter-notes-key="${t(n.notesStorageKey??"")}" aria-label="Speaker notes" placeholder="No notes for this slide" spellcheck="true" style="flex:1;min-width:0;padding:24px 36px;overflow:auto;font:inherit;font-size:21px;line-height:1.55;color:#fff;background:transparent;border:0;outline:none;resize:none;white-space:pre-wrap;pointer-events:auto;">${i}</textarea>
|
|
7
7
|
<div style="width:380px;flex-shrink:0;border-left:1px solid rgba(255,255,255,0.12);padding:24px 28px;display:flex;flex-direction:column;gap:10px;">
|
|
8
8
|
<div style="font-size:12px;text-transform:uppercase;letter-spacing:.12em;opacity:.55;">Up next</div>
|
|
9
9
|
<div data-hf-presenter-next style="font-size:17px;opacity:.9;line-height:1.4;">${e(n.nextText)}</div>
|
|
10
|
-
${
|
|
10
|
+
${r}
|
|
11
11
|
<div style="display:flex;gap:34px;margin-top:auto;">
|
|
12
|
-
<div><div style="font-size:11px;text-transform:uppercase;letter-spacing:.1em;opacity:.5;margin-bottom:3px;">Slide</div><div data-hf-presenter-counter style="font-size:23px;font-variant-numeric:tabular-nums;">${e(n.counterText)}</div></div>
|
|
13
|
-
<div><div style="font-size:11px;text-transform:uppercase;letter-spacing:.1em;opacity:.5;margin-bottom:3px;">Elapsed</div><div data-hf-presenter-elapsed style="font-size:23px;font-variant-numeric:tabular-nums;">${e(n.elapsedText)}</div></div>
|
|
12
|
+
<div><div style="font-size:11px;text-transform:uppercase;letter-spacing:.1em;opacity:.5;margin-bottom:3px;">Slide</div><div data-hf-presenter-counter style="font-family:${C};font-size:23px;font-weight:600;font-variant-numeric:tabular-nums;letter-spacing:0;">${e(n.counterText)}</div></div>
|
|
13
|
+
<div><div style="font-size:11px;text-transform:uppercase;letter-spacing:.1em;opacity:.5;margin-bottom:3px;">Elapsed</div><div data-hf-presenter-elapsed style="font-family:${C};font-size:23px;font-weight:600;font-variant-numeric:tabular-nums;letter-spacing:0;">${e(n.elapsedText)}</div></div>
|
|
14
14
|
</div>
|
|
15
15
|
</div>
|
|
16
|
-
</div>`.trim()}function
|
|
16
|
+
</div>`.trim()}function w(n){let e=Math.floor(n/60),t=Math.floor(n%60);return`${String(e).padStart(2,"0")}:${String(t).padStart(2,"0")}`}function he(n){return typeof n.seek=="function"&&typeof n.play=="function"&&typeof n.pause=="function"}var pe="hf-slideshow:presenter-notes:v1:",L=!1;function fe(){if(L)return;L=!0;let n=document.createElement("style");n.textContent=`
|
|
17
17
|
@keyframes hf-hotspot-pulse {
|
|
18
18
|
0%, 100% { box-shadow: 0 0 0 0 rgba(255,255,255,0.35), 0 4px 16px rgba(0,0,0,0.35); }
|
|
19
19
|
50% { box-shadow: 0 0 0 8px rgba(255,255,255,0), 0 4px 20px rgba(0,0,0,0.45); }
|
|
20
20
|
}
|
|
21
|
+
@keyframes hf-nav-spin {
|
|
22
|
+
to { transform: rotate(360deg); }
|
|
23
|
+
}
|
|
21
24
|
@media (prefers-reduced-motion: reduce) {
|
|
22
|
-
.hf-hotspot-pill
|
|
25
|
+
.hf-hotspot-pill,
|
|
26
|
+
.hf-nav-spinner { animation: none !important; }
|
|
23
27
|
}
|
|
24
28
|
/* Nav-button hover (replaces inline onmouseover/onmouseout \u2014 CSP-safe).
|
|
25
29
|
!important beats the inline base color set on each button. */
|
|
@@ -27,57 +31,119 @@
|
|
|
27
31
|
background: rgba(255,255,255,0.12) !important;
|
|
28
32
|
color: #fff !important;
|
|
29
33
|
}
|
|
34
|
+
[data-hf-nav-cluster] button[data-hf-tooltip] {
|
|
35
|
+
position: relative;
|
|
36
|
+
}
|
|
37
|
+
[data-hf-nav-cluster] button[data-hf-tooltip]::before,
|
|
38
|
+
[data-hf-nav-cluster] button[data-hf-tooltip]::after {
|
|
39
|
+
position: absolute;
|
|
40
|
+
left: 50%;
|
|
41
|
+
opacity: 0;
|
|
42
|
+
pointer-events: none;
|
|
43
|
+
transform: translateX(-50%) translateY(3px);
|
|
44
|
+
transition: opacity 0.12s ease, transform 0.12s ease;
|
|
45
|
+
z-index: 20;
|
|
46
|
+
}
|
|
47
|
+
[data-hf-nav-cluster] button[data-hf-tooltip]::before {
|
|
48
|
+
content: "";
|
|
49
|
+
bottom: calc(100% + 4px);
|
|
50
|
+
border: 5px solid transparent;
|
|
51
|
+
border-top-color: rgba(12,12,14,0.95);
|
|
52
|
+
}
|
|
53
|
+
[data-hf-nav-cluster] button[data-hf-tooltip]::after {
|
|
54
|
+
content: attr(data-hf-tooltip);
|
|
55
|
+
bottom: calc(100% + 14px);
|
|
56
|
+
padding: 6px 8px;
|
|
57
|
+
border-radius: 6px;
|
|
58
|
+
background: rgba(12,12,14,0.95);
|
|
59
|
+
color: #fff;
|
|
60
|
+
box-shadow: 0 6px 20px rgba(0,0,0,0.35);
|
|
61
|
+
font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
|
|
62
|
+
font-size: 12px;
|
|
63
|
+
font-weight: 600;
|
|
64
|
+
letter-spacing: 0;
|
|
65
|
+
line-height: 1;
|
|
66
|
+
white-space: nowrap;
|
|
67
|
+
}
|
|
68
|
+
[data-hf-nav-cluster] button[data-hf-tooltip]:hover::before,
|
|
69
|
+
[data-hf-nav-cluster] button[data-hf-tooltip]:hover::after,
|
|
70
|
+
[data-hf-nav-cluster] button[data-hf-tooltip]:focus-visible::before,
|
|
71
|
+
[data-hf-nav-cluster] button[data-hf-tooltip]:focus-visible::after {
|
|
72
|
+
opacity: 1;
|
|
73
|
+
transform: translateX(-50%) translateY(0);
|
|
74
|
+
}
|
|
30
75
|
/* When muted, the speaker button stays dimmed on hover so the mute-state
|
|
31
76
|
affordance isn't erased (higher specificity than the rule above). */
|
|
32
77
|
[data-hf-muted] [data-hf-mute]:hover {
|
|
33
78
|
color: rgba(255,255,255,0.6) !important;
|
|
34
79
|
}
|
|
35
|
-
`,document.head.appendChild(n)}var q='<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M8 3H5a2 2 0 0 0-2 2v3M21 8V5a2 2 0 0 0-2-2h-3M3 16v3a2 2 0 0 0 2 2h3M16 21h3a2 2 0 0 0 2-2v-3"/></svg>',C='<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M8 3v3a2 2 0 0 1-2 2H3M21 8h-3a2 2 0 0 1-2-2V3M3 16h3a2 2 0 0 1 2 2v3M16 21v-3a2 2 0 0 1 2-2h3"/></svg>',v=class extends HTMLElement{controller=null;offChange=null;chrome=null;touchStartX=0;touchStartY=0;channel=null;presenterStartMs=null;presenterInterval=null;disconnected=!1;initTimer=null;initInFlight=!1;initGeneration=0;_muted=!1;get muted(){return this._muted}resolveMode(){let e=this.getAttribute("mode");if(e)return e;try{return new URLSearchParams(location.search).get("mode")}catch{return null}}static get observedAttributes(){return["sound","mode"]}attributeChangedCallback(){this.controller&&this.render()}connectedCallback(){this.disconnected=!1,this.initInFlight=!1,this.initGeneration+=1,this.tabIndex=0,window.addEventListener("keydown",this.onKey),this.addEventListener("touchstart",this.onTouchStart,{passive:!0}),this.addEventListener("touchend",this.onTouchEnd),window.addEventListener("message",this.onMessage),document.addEventListener("fullscreenchange",this.onFsChange),this.initChannel(),this.initTimer=setTimeout(()=>{this.initTimer=null,this.isConnected&&!this.disconnected&&this.init()},0)}disconnectedCallback(){this.disconnected=!0,this.initGeneration+=1,this.initTimer!==null&&(clearTimeout(this.initTimer),this.initTimer=null),window.removeEventListener("keydown",this.onKey),this.removeEventListener("touchstart",this.onTouchStart),this.removeEventListener("touchend",this.onTouchEnd),window.removeEventListener("message",this.onMessage),document.removeEventListener("fullscreenchange",this.onFsChange),this.offChange?.(),this.offChange=null,this.controller?.dispose?.(),this.controller=null,this.chrome=null,this.channel?.destroy(),this.channel=null,this.presenterInterval!==null&&(clearInterval(this.presenterInterval),this.presenterInterval=null)}__setControllerForTest(e){this.bindController(e)}present(){let e=location.search?"&":"?";window.open(location.href+e+"mode=audience","_blank","noopener,noreferrer"),this.setAttribute("data-hf-presenting","true"),this.presenterStartMs=Date.now(),this.presenterInterval===null&&(this.presenterInterval=setInterval(()=>this.updateElapsed(),1e3)),this.render()}updateElapsed(){if(this.presenterStartMs===null)return;let e=this.chrome?.querySelector("[data-hf-presenter-elapsed]");e&&(e.textContent=S(Math.floor((Date.now()-this.presenterStartMs)/1e3)))}initChannel(){this.resolveMode()==="audience"?this.channel=new m("audience",t=>{this.controller&&this.controller.syncTo?.(t.sequenceId,t.slideIndex,t.fragmentIndex)}):this.channel=new m("presenter",()=>{})}async init(){if(this.initInFlight)return;this.initInFlight=!0;let e=this.initGeneration;try{let t=this.querySelector("hyperframes-player");if(!t||!(t instanceof HTMLElement)||!W(t)||(await te(t),e!==this.initGeneration))return;let r=this.innerHTML,s;try{s=I(r)}catch{return}if(!s)return;let i=await ne(t,2500,()=>e!==this.initGeneration);if(e!==this.initGeneration)return;let{resolved:l,errors:a}=E(s,i);a.length>0&&console.warn("[hyperframes-slideshow] manifest errors:",a);let o=L(l);o.slides.length===0&&s.slides.length>0&&console.error("[hyperframes-slideshow] no main-line slides resolved \u2014 the scene timeline may not have loaded in time, or sceneIds/timing are invalid:",a);let d={seek:u=>t.seek(u),play:()=>t.play(),pause:()=>t.pause(),stopMedia:()=>{t.stopMedia?.(),this.stopDocumentMedia()},get currentTime(){return t.currentTime},onTimeUpdate:u=>{let h=c=>{let b=c.detail;u(b.currentTime)};return t.addEventListener("timeupdate",h),()=>t.removeEventListener("timeupdate",h)}};this.bindController(new g(d,o)),i.length===0&&s.slides.length>0&&t.addEventListener("scenes",()=>{e===this.initGeneration&&this.init()},{once:!0})}finally{this.initInFlight=!1}}bindController(e){this.offChange?.(),this.controller?.dispose?.(),this.controller=e,this.offChange=e.onChange(()=>{this.resolveMode()!=="audience"&&this.channel&&this.channel.postPosition(e.position),this.render()}),this.resolveMode()!=="audience"&&this.channel&&this.channel.postPosition(e.position),this.render()}onKey=e=>{if(!this.controller)return;let t=e.target;if(t instanceof HTMLInputElement||t instanceof HTMLTextAreaElement||t instanceof HTMLSelectElement||t instanceof HTMLElement&&t.isContentEditable)return;let r=document.activeElement,s=r===this||this.contains(r),i=document.querySelectorAll("hyperframes-slideshow").length>1,l=s||!i&&(r===document.body||r===null);if(e.key==="ArrowRight"){if(!l)return;this.controller.next(),e.preventDefault()}else if(e.key==="ArrowLeft"){if(!l)return;this.controller.prev(),e.preventDefault()}else if(e.key===" "){if(!s)return;this.controller.next(),e.preventDefault()}else if(e.key==="Backspace"){if(!s)return;this.controller.prev(),e.preventDefault()}else if((e.key==="f"||e.key==="F")&&!e.metaKey&&!e.ctrlKey&&!e.altKey){if(!s)return;this.toggleFullscreen(),e.preventDefault()}};onMessage=e=>{if(this.resolveMode()==="audience")return;let t=e.data;!t||!this.controller||(t.type==="next"?this.controller.next():t.type==="prev"?this.controller.prev():t.type==="goto"&&typeof t.slideIndex=="number"?this.controller.goToSlide?.(t.slideIndex):t.type==="back"&&this.controller.back?.())};onTouchStart=e=>{let t=e.touches[0];t&&(this.touchStartX=t.clientX,this.touchStartY=t.clientY)};onTouchEnd=e=>{if(!this.controller)return;let t=e.changedTouches[0];if(!t)return;let r=t.clientX-this.touchStartX,s=t.clientY-this.touchStartY;Math.abs(r)<=40||Math.abs(r)<=Math.abs(s)||(r<0?this.controller.next():this.controller.prev())};render(){if(!this.controller)return;if(this.resolveMode()==="audience"){let{counter:s}=this.controller;this.paintChrome(this.buildNavCluster(s,"28px","fs-only"));return}if(this.getAttribute("data-hf-presenting")==="true"){this.renderPresenter();return}let{counter:e,currentSlide:t}=this.controller;if(!t)return;let r=t.hotspots.map(s=>{let i=s.region?`left:${s.region.x}%;top:${s.region.y}%;`:"right:5%;bottom:18%;";return`<button
|
|
80
|
+
`,document.head.appendChild(n)}var q='<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M8 3H5a2 2 0 0 0-2 2v3M21 8V5a2 2 0 0 0-2-2h-3M3 16v3a2 2 0 0 0 2 2h3M16 21h3a2 2 0 0 0 2-2v-3"/></svg>',N='<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M8 3v3a2 2 0 0 1-2 2H3M21 8h-3a2 2 0 0 1-2-2V3M3 16h3a2 2 0 0 1 2 2v3M16 21v-3a2 2 0 0 1 2-2h3"/></svg>',me='<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect x="3" y="4" width="18" height="13" rx="2"/><path d="M8 21h8"/><path d="M12 17v4"/><path d="M10 8.5v4l4-2-4-2z"/></svg>',ge="Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif",b=class extends HTMLElement{controller=null;offChange=null;chrome=null;touchStartX=0;touchStartY=0;channel=null;presenterStartMs=null;presenterInterval=null;presenterPositionTimers=[];disconnected=!1;initTimer=null;initInFlight=!1;initGeneration=0;_muted=!1;mediaWireInterval=null;applyingRemoteMedia=!1;lastMediaTimeBroadcastMs=0;audienceMutedPlaybackKeys=new Set;blockedAudienceMedia=new Map;audienceMediaUnlockButton=null;get muted(){return this._muted}resolveMode(){let e=this.getAttribute("mode");if(e)return e;try{return new URLSearchParams(location.search).get("mode")}catch{return null}}static get observedAttributes(){return["sound","mode"]}attributeChangedCallback(){this.controller&&this.render()}connectedCallback(){this.disconnected=!1,this.initInFlight=!1,this.initGeneration+=1,this.tabIndex=0,window.addEventListener("keydown",this.onKey),this.addEventListener("touchstart",this.onTouchStart,{passive:!0}),this.addEventListener("touchend",this.onTouchEnd),window.addEventListener("message",this.onMessage),document.addEventListener("fullscreenchange",this.onFsChange),this.initChannel(),this.initTimer=setTimeout(()=>{this.initTimer=null,this.isConnected&&!this.disconnected&&this.init()},0)}disconnectedCallback(){this.disconnected=!0,this.initGeneration+=1,this.initTimer!==null&&(clearTimeout(this.initTimer),this.initTimer=null),window.removeEventListener("keydown",this.onKey),this.removeEventListener("touchstart",this.onTouchStart),this.removeEventListener("touchend",this.onTouchEnd),window.removeEventListener("message",this.onMessage),document.removeEventListener("fullscreenchange",this.onFsChange),this.offChange?.(),this.offChange=null,this.controller?.dispose?.(),this.controller=null,this.chrome=null,this.channel?.destroy(),this.channel=null,this.mediaWireInterval!==null&&(clearInterval(this.mediaWireInterval),this.mediaWireInterval=null),this.audienceMediaUnlockButton?.remove(),this.audienceMediaUnlockButton=null,this.audienceMutedPlaybackKeys.clear(),this.blockedAudienceMedia.clear(),this.presenterInterval!==null&&(clearInterval(this.presenterInterval),this.presenterInterval=null),this.clearPresenterPositionTimers()}__setControllerForTest(e){this.bindController(e)}present(){if(this.resolveMode()==="audience"||this.getAttribute("data-hf-presenting")==="true")return;let e=location.search?"&":"?";window.open(location.href+e+"mode=audience","_blank","noopener,noreferrer"),this.setAttribute("data-hf-presenting","true"),this.postCurrentPresenterPositionBurst(),this.presenterStartMs=Date.now(),this.presenterInterval===null&&(this.presenterInterval=setInterval(()=>this.updateElapsed(),1e3)),this.render()}updateElapsed(){if(this.presenterStartMs===null)return;let e=this.chrome?.querySelector("[data-hf-presenter-elapsed]");e&&(e.textContent=w(Math.floor((Date.now()-this.presenterStartMs)/1e3)))}initChannel(){this.resolveMode()==="audience"?this.channel=new m("audience",t=>{this.controller&&this.controller.syncTo?.(t.sequenceId,t.slideIndex,t.fragmentIndex)},this.onRemoteMedia):this.channel=new m("presenter",()=>{},this.onRemoteMedia)}async init(){if(this.initInFlight)return;this.initInFlight=!0;let e=this.initGeneration;try{let t=this.querySelector("hyperframes-player");if(!t||!(t instanceof HTMLElement))return;let i=this.innerHTML,r;try{r=I(i)}catch{return}if(!r||(this.renderInitialChrome(r),!he(t))||(await xe(t),e!==this.initGeneration))return;let s=await Me(t,2500,()=>e!==this.initGeneration);if(e!==this.initGeneration)return;let{resolved:a,errors:d}=$(r,s);d.length>0&&console.warn("[hyperframes-slideshow] manifest errors:",d);let o=H(a);o.slides.length===0&&r.slides.length>0&&console.error("[hyperframes-slideshow] no main-line slides resolved \u2014 the scene timeline may not have loaded in time, or sceneIds/timing are invalid:",d);let l={seek:u=>t.seek(u),play:()=>t.play(),pause:()=>t.pause(),stopMedia:()=>{t.stopMedia?.(),this.stopDocumentMedia()},get currentTime(){return t.currentTime},onTimeUpdate:u=>{let p=c=>{let y=c.detail;u(y.currentTime)};return t.addEventListener("timeupdate",p),()=>t.removeEventListener("timeupdate",p)}};this.bindController(new v(l,o)),s.length===0&&r.slides.length>0&&t.addEventListener("scenes",()=>{e===this.initGeneration&&this.init()},{once:!0})}finally{this.initInFlight=!1}}renderInitialChrome(e){if(this.controller||e.slides.length===0)return;let t={index:1,total:e.slides.length};if(this.resolveMode()==="audience"){this.paintChrome(this.buildNavCluster(t,"28px","fs-only"));return}this.paintChrome(this.buildNavCluster(t,"28px","full",{canPrev:!1,canNext:e.slides.length>1,loading:e.slides.length>1}))}bindController(e){this.offChange?.(),this.controller?.dispose?.(),this.controller=e,this.startMediaSync(),this.offChange=e.onChange(()=>{this.resolveMode()!=="audience"&&this.channel&&this.channel.postPosition(e.position),this.render()}),this.resolveMode()!=="audience"&&this.channel&&this.channel.postPosition(e.position),this.render()}postCurrentPresenterPosition(){this.resolveMode()==="audience"||!this.channel||!this.controller||this.channel.postPosition(this.controller.position)}postCurrentPresenterPositionBurst(){this.clearPresenterPositionTimers(),this.postCurrentPresenterPosition();for(let e of[250,750,1500,3e3,5e3]){let t=setTimeout(()=>{this.presenterPositionTimers=this.presenterPositionTimers.filter(i=>i!==t),this.postCurrentPresenterPosition()},e);this.presenterPositionTimers.push(t)}}clearPresenterPositionTimers(){for(let e of this.presenterPositionTimers)clearTimeout(e);this.presenterPositionTimers=[]}startMediaSync(){this.wireSlideshowMedia(),this.mediaWireInterval===null&&(this.mediaWireInterval=setInterval(()=>this.wireSlideshowMedia(),1e3))}mediaPlayerElements(){return Array.from(this.querySelectorAll("hyperframes-player")).filter(e=>e instanceof HTMLElement)}playerFrameDocument(e){let t=e.iframeElement;if(!(t instanceof HTMLIFrameElement))return null;try{return t.contentDocument}catch{return null}}mediaKey(e,t,i,r){let s=e.id?`player-id:${e.id}`:`player:${t}`,a=i.id?`id:${i.id}`:`${i.tagName.toLowerCase()}:${r}`;return`${s}|${a}`}mediaEntries(){let e=[];return this.mediaPlayerElements().forEach((t,i)=>{let r=this.playerFrameDocument(t);r&&Array.from(r.querySelectorAll("video,audio")).filter(be).forEach((s,a)=>{e.push({key:this.mediaKey(t,i,s,a),el:s})})}),e}wireSlideshowMedia(){let e=["play","pause","seeking","seeked","ratechange","volumechange","ended","timeupdate"];for(let{key:t,el:i}of this.mediaEntries())if(i.dataset.hfSlideshowMediaSync!=="1"){i.dataset.hfSlideshowMediaSync="1";for(let r of e)i.addEventListener(r,()=>this.publishMediaState(i,t,r))}}publishMediaState(e,t,i){if(!(this.applyingRemoteMedia||this.resolveMode()==="audience"||!this.channel)){if(i==="timeupdate"){let r=performance.now();if(r-this.lastMediaTimeBroadcastMs<450&&!e.paused)return;this.lastMediaTimeBroadcastMs=r}this.channel.postMedia({key:t,action:i,currentTime:g(e.currentTime,0),paused:e.paused,ended:e.ended,muted:e.muted,volume:g(e.volume,1),playbackRate:g(e.playbackRate,1)})}}onRemoteMedia=e=>{if(this.resolveMode()!=="audience")return;if(this.blockedAudienceMedia.has(e.key)&&e.action==="timeupdate"){this.blockedAudienceMedia.set(e.key,e),this.showAudienceMediaUnlock();return}this.wireSlideshowMedia();let t=this.mediaEntries().find(i=>i.key===e.key);if(t){this.applyingRemoteMedia=!0;try{this.applyRemoteMedia(t.el,e)}finally{setTimeout(()=>{this.applyingRemoteMedia=!1},300)}}};applyRemoteMedia(e,t){if(t.action==="pause"||t.action==="ended"){this.audienceMutedPlaybackKeys.delete(t.key),this.blockedAudienceMedia.delete(t.key),this.syncRemoteMediaState(e,t,!0),e.pause(),this.hideAudienceMediaUnlockIfClear();return}if(t.action==="play"||t.action==="timeupdate"&&t.paused===!1&&e.paused){this.playAudienceMediaMuted(e,t);return}this.syncRemoteMediaState(e,t,!0)}syncRemoteMediaState(e,t,i){e.playbackRate=g(t.playbackRate,1),e.volume=Math.max(0,Math.min(1,g(t.volume,1))),e.muted=this.audienceMutedPlaybackKeys.has(t.key)?!0:t.muted,i&&Number.isFinite(t.currentTime)&&Math.abs((e.currentTime||0)-t.currentTime)>.35&&(e.currentTime=Math.max(0,t.currentTime))}playAudienceMediaMuted(e,t){this.audienceMutedPlaybackKeys.add(t.key),this.syncRemoteMediaState(e,t,!0),e.muted=!0;try{e.play().then(()=>{this.blockedAudienceMedia.delete(t.key),this.hideAudienceMediaUnlockIfClear()}).catch(()=>{this.blockedAudienceMedia.set(t.key,t),this.showAudienceMediaUnlock()})}catch{this.blockedAudienceMedia.set(t.key,t),this.showAudienceMediaUnlock()}}retryBlockedAudienceMedia=()=>{this.wireSlideshowMedia();let e=new Map(this.mediaEntries().map(t=>[t.key,t.el]));for(let[t,i]of this.blockedAudienceMedia){let r=e.get(t);r&&this.playAudienceMediaMuted(r,i)}};showAudienceMediaUnlock(){if(this.resolveMode()!=="audience"||this.audienceMediaUnlockButton)return;let e=document.createElement("button");e.type="button",e.textContent="Play audience media muted",e.style.cssText="position:fixed;left:50%;bottom:96px;transform:translateX(-50%);z-index:100000;border:0;border-radius:999px;padding:12px 18px;background:#fff;color:#111827;box-shadow:0 10px 32px rgba(0,0,0,.28);font:700 14px/1 system-ui,sans-serif;cursor:pointer;pointer-events:auto;",e.addEventListener("click",this.retryBlockedAudienceMedia),this.appendChild(e),this.audienceMediaUnlockButton=e}hideAudienceMediaUnlockIfClear(){this.blockedAudienceMedia.size>0||!this.audienceMediaUnlockButton||(this.audienceMediaUnlockButton.remove(),this.audienceMediaUnlockButton=null)}onKey=e=>{if(!this.controller)return;let t=e.target;if(t instanceof HTMLInputElement||t instanceof HTMLTextAreaElement||t instanceof HTMLSelectElement||t instanceof HTMLElement&&t.isContentEditable)return;let i=document.activeElement,r=i===this||this.contains(i),s=document.querySelectorAll("hyperframes-slideshow").length>1,a=r||!s&&(i===document.body||i===null);if(e.key==="ArrowRight"){if(!a)return;this.controller.next(),e.preventDefault()}else if(e.key==="ArrowLeft"){if(!a)return;this.controller.prev(),e.preventDefault()}else if(e.key===" "){if(!r)return;this.controller.next(),e.preventDefault()}else if(e.key==="Backspace"){if(!r)return;this.controller.prev(),e.preventDefault()}else if((e.key==="f"||e.key==="F")&&!e.metaKey&&!e.ctrlKey&&!e.altKey){if(!r)return;this.toggleFullscreen(),e.preventDefault()}else if((e.key==="p"||e.key==="P")&&!e.metaKey&&!e.ctrlKey&&!e.altKey){if(!a||!this.shouldShowPresentControl())return;this.present(),e.preventDefault()}};onMessage=e=>{if(this.resolveMode()==="audience")return;let t=e.data;!t||!this.controller||(t.type==="next"?this.controller.next():t.type==="prev"?this.controller.prev():t.type==="goto"&&typeof t.slideIndex=="number"?this.controller.goToSlide?.(t.slideIndex):t.type==="back"&&this.controller.back?.())};onTouchStart=e=>{let t=e.touches[0];t&&(this.touchStartX=t.clientX,this.touchStartY=t.clientY)};onTouchEnd=e=>{if(!this.controller)return;let t=e.changedTouches[0];if(!t)return;let i=t.clientX-this.touchStartX,r=t.clientY-this.touchStartY;Math.abs(i)<=40||Math.abs(i)<=Math.abs(r)||(i<0?this.controller.next():this.controller.prev())};render(){if(!this.controller)return;if(this.resolveMode()==="audience"){let{counter:r}=this.controller;this.paintChrome(this.buildNavCluster(r,"28px","fs-only"));return}if(this.getAttribute("data-hf-presenting")==="true"){this.renderPresenter();return}let{counter:e,currentSlide:t}=this.controller;if(!t)return;let i=t.hotspots.map(r=>{let s=r.region?`left:${r.region.x}%;top:${r.region.y}%;`:"right:5%;bottom:18%;";return`<button
|
|
36
81
|
class="hf-hotspot-pill"
|
|
37
|
-
data-hotspot-id="${
|
|
38
|
-
data-hotspot-target="${
|
|
82
|
+
data-hotspot-id="${h(r.id)}"
|
|
83
|
+
data-hotspot-target="${h(r.target)}"
|
|
39
84
|
type="button"
|
|
40
|
-
style="position:absolute;${
|
|
41
|
-
aria-label="${
|
|
42
|
-
><span aria-hidden="true" style="font-size:14px;line-height:1;">\u2295</span>${
|
|
85
|
+
style="position:absolute;${s}display:inline-flex;align-items:center;gap:6px;padding:8px 14px;background:var(--hf-slideshow-accent,rgba(255,255,255,0.92));color:#111;border:none;border-radius:999px;font-size:13px;font-weight:600;letter-spacing:0.01em;cursor:pointer;pointer-events:auto;box-shadow:0 4px 16px rgba(0,0,0,0.35);animation:hf-hotspot-pulse 1.8s ease-in-out infinite;white-space:nowrap;"
|
|
86
|
+
aria-label="${h(r.label)}"
|
|
87
|
+
><span aria-hidden="true" style="font-size:14px;line-height:1;">\u2295</span>${h(r.label)}</button>`}).join("");this.paintChrome(i+this.buildNavCluster(e,"28px"))}paintChrome(e){fe(),this.chrome||(this.chrome=document.createElement("div"),this.chrome.setAttribute("data-hf-chrome",""),this.appendChild(this.chrome)),this.chrome.style.cssText="position:absolute;inset:0;pointer-events:none;z-index:10;",this.chrome.innerHTML=e,this.wireChromeButtons()}buildNavCluster(e,t,i="full",r={}){let s=this.controller,a=r.canPrev??s?.canPrev??!0,d=r.canNext??s?.canNext??!0,o=r.loading===!0&&d,l=this.hasAttribute("sound"),u="display:flex;align-items:center;justify-content:center;width:34px;height:34px;background:transparent;border:none;border-radius:999px;color:rgba(255,255,255,0.85);font-size:16px;cursor:pointer;transition:background 0.15s,color 0.15s;padding:0;",y=l?`<button
|
|
43
88
|
data-hf-mute
|
|
44
89
|
type="button"
|
|
45
90
|
aria-label="${this._muted?"Unmute":"Mute"}"
|
|
91
|
+
title="${this._muted?"Unmute":"Mute"}"
|
|
92
|
+
data-hf-tooltip="${this._muted?"Unmute":"Mute"}"
|
|
46
93
|
aria-pressed="${this._muted?"true":"false"}"
|
|
47
|
-
style="${
|
|
48
|
-
>${this._muted?'<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><polygon points="11 5 6 9 2 9 2 15 6 15 11 19 11 5"/><line x1="23" y1="9" x2="17" y2="15"/><line x1="17" y1="9" x2="23" y2="15"/></svg>':'<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><polygon points="11 5 6 9 2 9 2 15 6 15 11 19 11 5"/><path d="M15.54 8.46a5 5 0 0 1 0 7.07"/><path d="M19.07 4.93a10 10 0 0 1 0 14.14"/></svg>'}</button>`:"",
|
|
94
|
+
style="${u}${this._muted?"color:rgba(255,255,255,0.45);":""}"
|
|
95
|
+
>${this._muted?'<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><polygon points="11 5 6 9 2 9 2 15 6 15 11 19 11 5"/><line x1="23" y1="9" x2="17" y2="15"/><line x1="17" y1="9" x2="23" y2="15"/></svg>':'<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><polygon points="11 5 6 9 2 9 2 15 6 15 11 19 11 5"/><path d="M15.54 8.46a5 5 0 0 1 0 7.07"/><path d="M19.07 4.93a10 10 0 0 1 0 14.14"/></svg>'}</button>`:"",F=a?`<button
|
|
49
96
|
data-hf-prev
|
|
50
97
|
type="button"
|
|
51
98
|
aria-label="Previous slide"
|
|
52
|
-
|
|
99
|
+
title="Previous slide"
|
|
100
|
+
data-hf-tooltip="Previous slide"
|
|
101
|
+
style="${u}" >‹</button>`:"",B=o?`<span
|
|
102
|
+
data-hf-nav-loading
|
|
103
|
+
role="status"
|
|
104
|
+
aria-label="Loading slides"
|
|
105
|
+
title="Loading slides"
|
|
106
|
+
style="${u}cursor:progress;color:rgba(255,255,255,0.72);"
|
|
107
|
+
><span class="hf-nav-spinner" aria-hidden="true" style="width:14px;height:14px;border:2px solid rgba(255,255,255,0.32);border-top-color:rgba(255,255,255,0.92);border-radius:999px;animation:hf-nav-spin 0.8s linear infinite;"></span></span>`:"",_=o?B:d?`<button
|
|
53
108
|
data-hf-next
|
|
54
109
|
type="button"
|
|
55
110
|
aria-label="Next slide"
|
|
56
|
-
|
|
111
|
+
title="Next slide"
|
|
112
|
+
data-hf-tooltip="Next slide"
|
|
113
|
+
style="${u}" >›</button>`:"",D=this.shouldShowPresentControl()?`<button
|
|
114
|
+
data-hf-present
|
|
115
|
+
type="button"
|
|
116
|
+
aria-label="Present"
|
|
117
|
+
title="Present"
|
|
118
|
+
data-hf-tooltip="Present"
|
|
119
|
+
style="${u}" >${me}</button>`:"",x=document.fullscreenElement===this,M=x?"Exit full screen":"Full screen",T=`<button
|
|
57
120
|
data-hf-fullscreen
|
|
58
121
|
type="button"
|
|
59
|
-
aria-label="${
|
|
60
|
-
|
|
61
|
-
|
|
122
|
+
aria-label="${M}"
|
|
123
|
+
title="${M}"
|
|
124
|
+
data-hf-tooltip="${M}"
|
|
125
|
+
aria-pressed="${x?"true":"false"}"
|
|
126
|
+
style="${u}" >${x?N:q}</button>`;if(i==="fs-only")return`
|
|
62
127
|
<div
|
|
63
128
|
data-hf-nav-cluster
|
|
64
129
|
style="position:absolute;bottom:${t};right:32px;display:inline-flex;align-items:center;background:rgba(20,20,22,0.55);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,0.12);border-radius:999px;box-shadow:0 4px 24px rgba(0,0,0,0.45);padding:4px;pointer-events:auto;"
|
|
65
|
-
>${
|
|
130
|
+
>${T}</div>`;let U=a?"4px":"10px",O=d?"4px":"10px";return`
|
|
66
131
|
<div
|
|
67
132
|
data-hf-nav-cluster
|
|
68
133
|
style="position:absolute;bottom:${t};right:32px;display:inline-flex;align-items:center;gap:2px;background:rgba(20,20,22,0.55);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,0.12);border-radius:999px;box-shadow:0 4px 24px rgba(0,0,0,0.45);padding:4px;pointer-events:auto;"
|
|
69
134
|
>
|
|
70
|
-
${
|
|
71
|
-
${
|
|
72
|
-
${
|
|
135
|
+
${y}
|
|
136
|
+
${l?'<span aria-hidden="true" style="width:1px;height:20px;background:rgba(255,255,255,0.12);margin:0 2px;flex-shrink:0;"></span>':""}
|
|
137
|
+
${F}
|
|
73
138
|
<span
|
|
74
139
|
data-hf-counter
|
|
75
140
|
aria-label="Slide ${e.index} of ${e.total}"
|
|
76
|
-
style="min-width:46px;text-align:center;color:rgba(255,255,255,0.9);font-size:13px;font-weight:
|
|
141
|
+
style="min-width:46px;text-align:center;color:rgba(255,255,255,0.9);font-family:${ge};font-size:13px;font-weight:600;font-variant-numeric:tabular-nums;letter-spacing:0;padding:0 ${O} 0 ${U};user-select:none;"
|
|
77
142
|
>${e.index} / ${e.total}</span>
|
|
78
|
-
${
|
|
143
|
+
${_}
|
|
79
144
|
<span aria-hidden="true" style="width:1px;height:20px;background:rgba(255,255,255,0.12);margin:0 2px;flex-shrink:0;"></span>
|
|
80
|
-
${
|
|
81
|
-
|
|
82
|
-
|
|
145
|
+
${D}
|
|
146
|
+
${T}
|
|
147
|
+
</div>`}wireChromeButtons(){let e=this.chrome;e&&(this.wireChromeClick(e,"[data-hf-mute]",()=>this.toggleMute()),this.wireChromeClick(e,"[data-hf-prev]",()=>this.controller?.prev()),this.wireChromeClick(e,"[data-hf-next]",()=>this.controller?.next()),this.wireChromeClick(e,"[data-hf-present]",()=>this.present()),this.wireChromeClick(e,"[data-hf-fullscreen]",()=>this.toggleFullscreen()),this.wirePresenterNotes(e),this.wireHotspots(e))}wireChromeClick(e,t,i){let r=e.querySelector(t);r&&r.addEventListener("click",i)}wirePresenterNotes(e){let t=e.querySelector("[data-hf-presenter-notes]");if(t instanceof HTMLTextAreaElement){let i=t.getAttribute("data-hf-presenter-notes-key");t.addEventListener("input",()=>this.writePresenterNotes(i,t.value))}}wireHotspots(e){for(let t of e.querySelectorAll("[data-hotspot-id]")){let i=t.getAttribute("data-hotspot-target")??"";t.addEventListener("click",()=>this.controller?.enterBranch?.(i))}}onFsChange=()=>{let e=this.chrome?.querySelector("[data-hf-fullscreen]");if(!e)return;let t=document.fullscreenElement===this;e.innerHTML=t?N:q;let i=t?"Exit full screen":"Full screen";e.setAttribute("aria-label",i),e.setAttribute("title",i),e.setAttribute("data-hf-tooltip",i),e.setAttribute("aria-pressed",t?"true":"false")};toggleFullscreen(){document.fullscreenElement===this?document.exitFullscreen().catch(()=>{}):this.requestFullscreen().catch(()=>{})}shouldShowPresentControl(){return this.resolveMode()!=="audience"&&this.getAttribute("data-hf-presenting")!=="true"}toggleMute(){this._muted=!this._muted,this._muted?this.setAttribute("data-hf-muted",""):this.removeAttribute("data-hf-muted"),this.applyGlobalMute(this._muted),this.dispatchEvent(new CustomEvent("hf-sound",{detail:{muted:this._muted},bubbles:!0,composed:!0})),this.render()}applyGlobalMute(e){for(let i of this.querySelectorAll("hyperframes-player")){if(!(i instanceof HTMLElement))continue;let r=i;"muted"in r?r.muted=e:e?r.setAttribute("muted",""):r.removeAttribute("muted")}let t=this.ownerDocument;for(let i of t.querySelectorAll("video, audio"))i instanceof HTMLMediaElement&&(i.muted=e||i.defaultMuted)}stopDocumentMedia(){let e=this.ownerDocument;for(let t of e.querySelectorAll("video, audio"))t instanceof HTMLMediaElement&&t.pause()}presenterNotesDeckKey(){let e=this.getAttribute("notes-storage-key")?.trim();if(e)return e;let t=this.querySelector("hyperframes-player")?.getAttribute("src")??"",i=t;try{let a=typeof location<"u"?location.href:"http://localhost/";i=new URL(t,a).href}catch{}let r=typeof location<"u"?`${location.origin}${location.pathname}`:"",s=this.ownerDocument.title;return`${r}|${s}|${i}`}presenterNotesStorageKey(e){let t=this.controller?.position;return t?`${pe}${JSON.stringify([this.presenterNotesDeckKey(),t.sequenceId,t.slideIndex,e.sceneId??""])}`:null}readPresenterNotes(e){if(!e||typeof window>"u")return null;try{return window.localStorage.getItem(e)}catch{return null}}writePresenterNotes(e,t){if(e&&!(typeof window>"u"))try{window.localStorage.setItem(e,t)}catch{}}renderPresenter(){if(!this.controller)return;let{counter:e,currentSlide:t,nextSlide:i}=this.controller;if(!t)return;let r=this.presenterStartMs!==null?Math.floor((Date.now()-this.presenterStartMs)/1e3):0,s=this.querySelector("hyperframes-player");s instanceof HTMLElement&&(s.style.top="0",s.style.bottom="32%",s.style.height="auto");let a=this.presenterNotesStorageKey(t),d=this.readPresenterNotes(a)??t.notes??"";this.paintChrome(A({notes:d,notesStorageKey:a,nextText:ve(i),counterText:`${e.index} / ${e.total}`,elapsedText:w(r),hotspots:t.hotspots})+this.buildNavCluster(e,"calc(32% + 18px)"))}};function ve(n){if(n===null)return"End of sequence";let e=n.notes!=null?n.notes.split(`
|
|
148
|
+
`)[0]??"":"";return e.length>0?`${h(n.sceneId)}: ${h(e)}`:h(n.sceneId)}function be(n){let e=n.ownerDocument.defaultView;return!e||typeof e.HTMLMediaElement!="function"?!1:n instanceof e.HTMLMediaElement}function g(n,e){return Number.isFinite(n)?n:e}function k(n){return"scenes"in n&&Array.isArray(n.scenes)?n.scenes:[]}var ye=5e3;function xe(n){return n.ready===!0?Promise.resolve():new Promise(e=>{let t=null,i=()=>{t!==null&&(clearTimeout(t),t=null),e()};n.addEventListener("ready",i,{once:!0}),t=setTimeout(()=>{n.removeEventListener("ready",i),e()},ye)})}function Me(n,e,t=()=>!1){let i=k(n);if(i.length>0)return Promise.resolve(i);let r=Math.ceil(e/100);return new Promise(s=>{let a=!1,d=null,o=0,l=c=>{a||(a=!0,d!==null&&clearTimeout(d),n.removeEventListener("scenes",u),s(c))},u=()=>{if(t())return l([]);let c=k(n);c.length>0&&l(c)},p=()=>{if(a)return;if(t())return l([]);let c=k(n);if(c.length>0)return l(c);if(o+=1,o>=r)return l([]);d=setTimeout(p,100)};n.addEventListener("scenes",u),d=setTimeout(p,100)})}function H(n){let e=r=>r.end>r.start,t=n.slides.filter(e),i={};for(let[r,s]of Object.entries(n.sequences))i[r]={...s,slides:s.slides.filter(e)};return{slides:t,sequences:i}}function h(n){return n.replace(/&/g,"&").replace(/</g,"<").replace(/>/g,">").replace(/"/g,""")}customElements.get("hyperframes-slideshow")||customElements.define("hyperframes-slideshow",b);0&&(module.exports={HyperframesSlideshow,dropInvalidSlides});
|
|
83
149
|
//# sourceMappingURL=hyperframes-slideshow.cjs.map
|