@codercms/web-player 0.0.1

package/dist/ui/ProgressBar.svelte

@@ -0,0 +1,283 @@
+<script>import { PlayerEvents } from "../core/VideoPlayer";
+import { LoaderEvents } from "../core/LoaderInterface";
+import { onMount } from "svelte";
+import {
+  getValueByMousePos,
+  getValueForDragEvent,
+  normalizePointerPos,
+  draggableAction
+} from "./utils/slider";
+import { toDuration } from "./utils/duration";
+export let player;
+let selfEl;
+let currentTime = 0;
+let duration = 0;
+let buffered = [];
+let currentTImeOffset = 0;
+let isDragging = false;
+let draggingTime;
+let relCurrentTime = 0;
+$:
+  if (!isDragging && currentTime > 0 && duration > 0) {
+    currentTImeOffset = currentTime / duration;
+    relCurrentTime = currentTime;
+  }
+$:
+  if (isDragging && duration > 0) {
+    currentTImeOffset = draggingTime / duration;
+    relCurrentTime = draggingTime;
+  }
+let tooltipVisible = false;
+$:
+  relTooltipVisible = tooltipVisible || isDragging;
+let tooltipEl;
+let tooltipTime = 0;
+let tooltipDurationText = "";
+let tooltipWidth = 0;
+onMount(() => {
+  currentTime = player.currentTime;
+  duration = player.duration;
+  buffered = player.buffered;
+  player.subscribe(PlayerEvents.PlaybackDurationChange, (newDuration) => {
+    duration = newDuration;
+  });
+  player.subscribe(PlayerEvents.PlaybackTimeUpdate, (newCurrentTime) => {
+    currentTime = newCurrentTime;
+  });
+  player.subscribe(PlayerEvents.PlaybackBufferingProgress, (newBuffered) => {
+    buffered = newBuffered;
+  });
+  player.subscribe(LoaderEvents.Loading, () => {
+    currentTime = 0;
+    duration = 0;
+    currentTImeOffset = 0;
+    buffered = [];
+  });
+});
+const seekToPosition = (e) => {
+  if (duration === 0) {
+    return;
+  }
+  const clickPos = normalizePointerPos(e);
+  let clickValue = getValueByMousePos(clickPos, duration, selfEl);
+  player.seekTo(clickValue);
+};
+const handleDragStart = (e) => {
+  if (duration === 0) {
+    e.preventDefault();
+    return;
+  }
+  isDragging = true;
+};
+const handleDragging = (e) => {
+  draggingTime = getValueForDragEvent(selfEl, e.detail.pos, 0, duration, {
+    step: 0.1,
+    precision: 1
+  });
+  tooltipTime = draggingTime;
+  tooltipDurationText = toDuration(draggingTime);
+  tooltipWidth = tooltipEl.clientWidth;
+};
+const resetDragging = () => {
+  isDragging = false;
+  draggingTime = 0;
+};
+const handleDragEnd = (e) => {
+  player.seekTo(draggingTime);
+  currentTime = draggingTime;
+  resetDragging();
+};
+const handleDragCancel = (e) => {
+  resetDragging();
+};
+const handleTooltipPointerMove = (e) => {
+  if (duration <= 0 || !isFinite(duration)) {
+    return;
+  }
+  const pointerPos = normalizePointerPos(e);
+  const time = getValueByMousePos(pointerPos, duration, selfEl);
+  tooltipTime = time;
+  tooltipDurationText = toDuration(time);
+  tooltipWidth = tooltipEl.clientWidth;
+  tooltipVisible = true;
+};
+const handlePointerLeave = () => {
+  tooltipVisible = false;
+};
+</script>
+
+<div
+	class="progress-bar"
+	role="progressbar"
+	tabindex="0"
+	bind:this={selfEl}
+	use:draggableAction
+	on:s-dragstart={handleDragStart}
+	on:s-dragend={handleDragEnd}
+	on:s-dragcancel={handleDragCancel}
+	on:s-dragging={handleDragging}
+	on:mousemove={handleTooltipPointerMove}
+	on:mouseleave={handlePointerLeave}
+	on:touchmove={handleTooltipPointerMove}
+	on:touchend={handlePointerLeave}
+>
+	<div class="full-width-bar" />
+
+	<div style="overflow-x: clip;">
+		<div
+			class="tooltip-container"
+			style:opacity={relTooltipVisible ? `1` : `0`}
+			style:--offset="{(tooltipTime / duration) * 100}%"
+			style:--ch-length="{tooltipWidth / 2}px"
+		>
+			<div class="tooltip" bind:this={tooltipEl}>
+				<span class="tooltip-time">{tooltipDurationText}</span>
+			</div>
+		</div>
+	</div>
+
+	<div class="buffered-parts">
+		{#if duration > 0}
+			{#each buffered as range (range.start)}
+				<!-- Cut buffered part start to prevent overlap with current time line -->
+				{@const startCut = range.start < relCurrentTime ? relCurrentTime : range.start}
+				<!-- Prevent buffered part overlap with current time line -->
+				{@const isVisible = range.end > relCurrentTime}
+
+				<div
+					class="buffered-part"
+					style:visibility={isVisible ? 'visible' : 'hidden'}
+					style:--buf-part-start={isVisible ? `${(startCut / duration) * 100}%` : `0`}
+					style:--buf-part-offset={isVisible ? (range.end - startCut) / duration : 0}
+				/>
+			{/each}
+		{/if}
+	</div>
+
+	<div class="current-time-line-container">
+		<div class="current-time-line" style:--current-time-offest={currentTImeOffset} />
+	</div>
+</div>
+
+<style>
+	:root {
+		--defaultScaleBarsY: 1.45;
+	}
+
+	.progress-bar {
+		position: relative;
+		width: 100%;
+		height: var(--player-progress-bar-height, 10px);
+	}
+
+	.progress-bar .full-width-bar {
+		position: absolute;
+		left: 0;
+		top: 0;
+		width: 100%;
+		height: 100%;
+
+		/*background-color: rgba(121, 117, 117, 0.9);*/
+		background-color: hsla(0, 0%, 100%, 0.3);
+
+		transform-origin: bottom center;
+		transform: scaleY(var(--scaleBarsY, 1));
+		transition: transform 0.3s ease;
+	}
+
+	.progress-bar:hover > .current-time-line-container {
+		--scaleBarsY: var(--player-progress-bar-scale-on-hover, var(--defaultScaleBarsY));
+	}
+	.progress-bar:hover > .buffered-parts {
+		--scaleBarsY: var(--player-progress-bar-scale-on-hover, var(--defaultScaleBarsY));
+	}
+	.progress-bar:hover > .full-width-bar {
+		--scaleBarsY: var(--player-progress-bar-scale-on-hover, var(--defaultScaleBarsY));
+	}
+
+	.buffered-parts {
+		position: absolute;
+		top: 0;
+		bottom: 0;
+		width: 100%;
+
+		transform-origin: bottom center;
+		transform: scaleY(var(--scaleBarsY, 1));
+		transition: transform 0.3s ease;
+	}
+
+	.buffered-parts .buffered-part {
+		position: absolute;
+		top: 0;
+		/*bottom: 0;*/
+		left: var(--buf-part-start, 0);
+		height: 100%;
+		width: 100%;
+
+		transform-origin: left center;
+		transform: scaleX(calc(100% * var(--buf-part-offset, 0)));
+
+		z-index: 10; /* Place the buffered parts behind the current time line */
+		/*background-color: rgba(0, 0, 255, 0.3); !* Adjust the color and opacity as needed *!*/
+		background-color: hsla(0, 0%, 100%, 0.4);
+	}
+
+	.current-time-line-container {
+		position: absolute;
+		left: 0;
+		top: 0;
+		width: 100%;
+		height: 100%;
+
+		transform-origin: bottom center;
+		transform: scaleY(var(--scaleBarsY, 1));
+		transition: transform 0.3s ease;
+
+		z-index: 20;
+	}
+
+	.current-time-line-container .current-time-line {
+		width: 100%;
+		height: 100%;
+
+		transform-origin: left center;
+		/*transform: scaleX(calc(100% * var(--current-time-offest, 0)));*/
+		transform: scale3d(calc(100% * var(--current-time-offest, 0)), 1, 1);
+
+		background-color: rgba(255, 85, 0, 0.8);
+	}
+
+	.tooltip-container {
+		width: 100%;
+		opacity: 0;
+		transition: opacity 0.2s ease-in-out;
+		transform: translate3d(
+			min(
+				/* minimum offset from left */ max(var(--offset), var(--ch-length)),
+				/* maximum offset to right */ calc(100% - var(--ch-length))
+			),
+			0,
+			0
+		);
+
+		z-index: 20;
+	}
+
+	.tooltip-container .tooltip {
+		position: absolute;
+		top: -30px;
+		left: 0;
+
+		transform: translate(-50%, 0);
+	}
+
+	.tooltip-container .tooltip span.tooltip-time {
+		background-color: rgba(73, 71, 71, 0.7);
+		color: white;
+		padding: 4px 8px;
+		border-radius: 4px;
+		white-space: nowrap;
+		font-size: 14px;
+		user-select: none;
+	}
+</style>

package/dist/ui/ProgressBar.svelte.d.ts

@@ -0,0 +1,17 @@
+import { SvelteComponent } from "svelte";
+import type { VideoPlayer } from '../core/VideoPlayer';
+declare const __propDef: {
+    props: {
+        player: VideoPlayer;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+};
+export type ProgressBarProps = typeof __propDef.props;
+export type ProgressBarEvents = typeof __propDef.events;
+export type ProgressBarSlots = typeof __propDef.slots;
+export default class ProgressBar extends SvelteComponent<ProgressBarProps, ProgressBarEvents, ProgressBarSlots> {
+}
+export {};

package/dist/ui/utils/duration.d.ts

@@ -0,0 +1 @@
+export declare function toDuration(sec_num: number): string;

package/dist/ui/utils/duration.js

@@ -0,0 +1,23 @@
+export function toDuration(sec_num) {
+    const hours = Math.floor(sec_num / 3600);
+    const minutes = Math.floor((sec_num - hours * 3600) / 60);
+    const seconds = Math.floor(sec_num - hours * 3600 - minutes * 60);
+    let minutesTxt, secondsTxt;
+    const hoursTxt = `${hours}`;
+    if (minutes < 10) {
+        minutesTxt = `0${minutes}`;
+    }
+    else {
+        minutesTxt = String(minutes);
+    }
+    if (seconds < 10) {
+        secondsTxt = `0${seconds}`;
+    }
+    else {
+        secondsTxt = String(seconds);
+    }
+    if (hours < 1) {
+        return `${minutesTxt}:${secondsTxt}`;
+    }
+    return `${hoursTxt}:${minutesTxt}:${secondsTxt}`;
+}

package/dist/ui/utils/duration.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"duration.js","sourceRoot":"","sources":["duration.ts"],"names":[],"mappings":"AAAA,MAAM,UAAU,UAAU,CAAC,OAAe;IACzC,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,GAAG,IAAI,CAAC,CAAC;IACzC,MAAM,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,OAAO,GAAG,KAAK,GAAG,IAAI,CAAC,GAAG,EAAE,CAAC,CAAC;IAC1D,MAAM,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,GAAG,KAAK,GAAG,IAAI,GAAG,OAAO,GAAG,EAAE,CAAC,CAAC;IAElE,IAAI,UAAU,EAAE,UAAkB,CAAC;IAEnC,MAAM,QAAQ,GAAG,GAAG,KAAK,EAAE,CAAC;IAE5B,IAAI,OAAO,GAAG,EAAE,EAAE;QACjB,UAAU,GAAG,IAAI,OAAO,EAAE,CAAC;KAC3B;SAAM;QACN,UAAU,GAAG,MAAM,CAAC,OAAO,CAAC,CAAC;KAC7B;IAED,IAAI,OAAO,GAAG,EAAE,EAAE;QACjB,UAAU,GAAG,IAAI,OAAO,EAAE,CAAC;KAC3B;SAAM;QACN,UAAU,GAAG,MAAM,CAAC,OAAO,CAAC,CAAC;KAC7B;IAED,IAAI,KAAK,GAAG,CAAC,EAAE;QACd,OAAO,GAAG,UAAU,IAAI,UAAU,EAAE,CAAC;KACrC;IAED,OAAO,GAAG,QAAQ,IAAI,UAAU,IAAI,UAAU,EAAE,CAAC;AAClD,CAAC"}

package/dist/ui/utils/slider.d.ts

@@ -0,0 +1,25 @@
+import type { Action } from 'svelte/action';
+import type { Element } from 'svelte/types/compiler/interfaces';
+export type MousePos = {
+    clientX: number;
+    clientY: number;
+};
+export declare function normalizePointerPos(e: MouseEvent | TouchEvent): MousePos;
+export declare function getWidthByValue(max: number, value: number, slider: Element): number;
+export declare function getValueByWidth(max: number, width: number): number;
+export declare function getValueByMousePos(pos: MousePos, max: number, slider: HTMLElement): number;
+export declare function getValueForDragEvent(slider: HTMLElement, dragPosition: MousePos, min: number, max: number, step?: AlignStep): number;
+export type AlignStep = {
+    step: number;
+    precision: number;
+};
+export type DraggingEventParams = {
+    pos: MousePos;
+    ev: MouseEvent | TouchEvent;
+};
+export declare const draggableAction: Action<HTMLElement, unknown, {
+    'on:s-dragstart': (e: CustomEvent<never>) => void;
+    'on:s-dragend': (e: CustomEvent<never>) => void;
+    'on:s-dragcancel': (e: CustomEvent<never>) => void;
+    'on:s-dragging': (e: CustomEvent<DraggingEventParams>) => void;
+}>;

package/dist/ui/utils/slider.js

@@ -0,0 +1,132 @@
+export function normalizePointerPos(e) {
+    if ('touches' in e) {
+        const touch = e.touches[0];
+        return {
+            clientX: touch.clientX,
+            clientY: touch.clientY
+        };
+    }
+    if ('clientX' in e) {
+        return {
+            clientX: e.clientX,
+            clientY: e.clientY
+        };
+    }
+    throw new Error('Slider::normalizePointerPos unknown event passed');
+}
+export function getWidthByValue(max, value, slider) {
+    if (max <= 0 || !isFinite(max)) {
+        return 0;
+    }
+    if (value <= 0 || !isFinite(value)) {
+        return 0;
+    }
+    if (!slider) {
+        return 0;
+    }
+    const rect = slider.getBoundingClientRect();
+    const coeff = max / value;
+    return rect.width / coeff;
+}
+export function getValueByWidth(max, width) {
+    if (max <= 0 || !isFinite(max) || width <= 0 || !isFinite(width)) {
+        return 0;
+    }
+    return max / width;
+}
+export function getValueByMousePos(pos, max, slider) {
+    if (max <= 0 || !isFinite(max)) {
+        return 0;
+    }
+    if (!slider) {
+        return 0;
+    }
+    const rect = slider.getBoundingClientRect();
+    const relativeOffset = pos.clientX - rect.left;
+    const coeff = relativeOffset / rect.width;
+    return max * coeff;
+}
+export function getValueForDragEvent(slider, dragPosition, min, max, step) {
+    let clickValue = getValueByMousePos(dragPosition, max, slider);
+    if (clickValue > max) {
+        clickValue = max;
+    }
+    else if (clickValue < min) {
+        clickValue = min;
+    }
+    if (step) {
+        clickValue = alignValueToStep(clickValue, min, step);
+    }
+    return clickValue;
+}
+const fixFloat = (v, precision) => parseFloat(v.toFixed(precision));
+const alignValueToStep = (val, minValue, step) => {
+    // find the middle-point between steps
+    // and see if the value is closer to the
+    // next step, or previous step
+    let remainder = (val - minValue) % step.step;
+    let aligned = val - remainder;
+    if (Math.abs(remainder) * 2 >= step.step) {
+        aligned += remainder > 0 ? step.step : -step.step;
+    }
+    // make sure the value is within acceptable limits
+    // aligned = clampValue(aligned);
+    // make sure the returned value is set to the precision desired
+    // this is also because javascript often returns weird floats
+    // when dealing with odd numbers and percentages
+    return fixFloat(aligned, step.precision);
+};
+export const draggableAction = (node) => {
+    let isDragging = false;
+    const handleKeys = (e) => {
+        switch (e.key) {
+            case 'Esc':
+            case 'Escape':
+                resetDragging();
+                node.dispatchEvent(new CustomEvent('s-dragcancel'));
+        }
+    };
+    const startDrag = (e) => {
+        const ev = new CustomEvent('s-dragstart', { cancelable: true });
+        node.dispatchEvent(ev);
+        // Dragging was cancelled by component
+        if (ev.defaultPrevented) {
+            return;
+        }
+        isDragging = true;
+        handleDrag(e);
+        window.addEventListener('mousemove', handleDrag);
+        window.addEventListener('mouseup', endDrag);
+        window.addEventListener('touchmove', handleDrag, { passive: false });
+        window.addEventListener('touchend', endDrag);
+        window.addEventListener('keydown', handleKeys);
+    };
+    // Handle mouse move or touch move events for dragging
+    const handleDrag = (e) => {
+        if (!isDragging) {
+            return;
+        }
+        const dragPosition = normalizePointerPos(e);
+        node.dispatchEvent(new CustomEvent('s-dragging', { detail: { pos: dragPosition, ev: e } }));
+    };
+    const endDrag = () => {
+        node.dispatchEvent(new CustomEvent('s-dragend'));
+        resetDragging();
+    };
+    const resetDragging = () => {
+        isDragging = false;
+        // If not dragging, remove the event listeners to avoid unnecessary processing
+        window.removeEventListener('mousemove', handleDrag);
+        window.removeEventListener('mouseup', endDrag);
+        window.removeEventListener('touchmove', handleDrag);
+        window.removeEventListener('touchend', endDrag);
+        window.removeEventListener('keydown', handleKeys);
+    };
+    node.addEventListener('mousedown', startDrag);
+    return {
+        destroy: () => {
+            node.removeEventListener('mousedown', startDrag);
+            resetDragging();
+        }
+    };
+};

package/dist/ui/utils/slider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"slider.js","sourceRoot":"","sources":["slider.ts"],"names":[],"mappings":"AAQA,MAAM,UAAU,mBAAmB,CAAC,CAA0B;IAC7D,IAAI,SAAS,IAAI,CAAC,EAAE;QACnB,MAAM,KAAK,GAAG,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;QAE3B,OAAO;YACN,OAAO,EAAE,KAAK,CAAC,OAAO;YACtB,OAAO,EAAE,KAAK,CAAC,OAAO;SACtB,CAAC;KACF;IAED,IAAI,SAAS,IAAI,CAAC,EAAE;QACnB,OAAO;YACN,OAAO,EAAE,CAAC,CAAC,OAAO;YAClB,OAAO,EAAE,CAAC,CAAC,OAAO;SAClB,CAAC;KACF;IAED,MAAM,IAAI,KAAK,CAAC,kDAAkD,CAAC,CAAC;AACrE,CAAC;AAED,MAAM,UAAU,eAAe,CAAC,GAAW,EAAE,KAAa,EAAE,MAAe;IAC1E,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE;QAC/B,OAAO,CAAC,CAAC;KACT;IAED,IAAI,KAAK,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAE;QACnC,OAAO,CAAC,CAAC;KACT;IAED,IAAI,CAAC,MAAM,EAAE;QACZ,OAAO,CAAC,CAAC;KACT;IAED,MAAM,IAAI,GAAG,MAAM,CAAC,qBAAqB,EAAE,CAAC;IAC5C,MAAM,KAAK,GAAG,GAAG,GAAG,KAAK,CAAC;IAE1B,OAAO,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;AAC3B,CAAC;AAED,MAAM,UAAU,eAAe,CAAC,GAAW,EAAE,KAAa;IACzD,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,IAAI,KAAK,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAE;QACjE,OAAO,CAAC,CAAC;KACT;IAED,OAAO,GAAG,GAAG,KAAK,CAAC;AACpB,CAAC;AAED,MAAM,UAAU,kBAAkB,CAAC,GAAa,EAAE,GAAW,EAAE,MAAmB;IACjF,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE;QAC/B,OAAO,CAAC,CAAC;KACT;IAED,IAAI,CAAC,MAAM,EAAE;QACZ,OAAO,CAAC,CAAC;KACT;IAED,MAAM,IAAI,GAAG,MAAM,CAAC,qBAAqB,EAAE,CAAC;IAC5C,MAAM,cAAc,GAAG,GAAG,CAAC,OAAO,GAAG,IAAI,CAAC,IAAI,CAAC;IAC/C,MAAM,KAAK,GAAG,cAAc,GAAG,IAAI,CAAC,KAAK,CAAC;IAE1C,OAAO,GAAG,GAAG,KAAK,CAAC;AACpB,CAAC;AAED,MAAM,UAAU,oBAAoB,CACnC,MAAmB,EACnB,YAAsB,EACtB,GAAW,EACX,GAAW,EACX,IAAgB;IAEhB,IAAI,UAAU,GAAG,kBAAkB,CAAC,YAAY,EAAE,GAAG,EAAE,MAAM,CAAC,CAAC;IAE/D,IAAI,UAAU,GAAG,GAAG,EAAE;QACrB,UAAU,GAAG,GAAG,CAAC;KACjB;SAAM,IAAI,UAAU,GAAG,GAAG,EAAE;QAC5B,UAAU,GAAG,GAAG,CAAC;KACjB;IAED,IAAI,IAAI,EAAE;QACT,UAAU,GAAG,gBAAgB,CAAC,UAAU,EAAE,GAAG,EAAE,IAAI,CAAC,CAAC;KACrD;IAED,OAAO,UAAU,CAAC;AACnB,CAAC;AAED,MAAM,QAAQ,GAAG,CAAC,CAAS,EAAE,SAAiB,EAAE,EAAE,CAAC,UAAU,CAAC,CAAC,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC,CAAC;AAOpF,MAAM,gBAAgB,GAAG,CAAC,GAAW,EAAE,QAAgB,EAAE,IAAe,EAAU,EAAE;IACnF,sCAAsC;IACtC,wCAAwC;IACxC,8BAA8B;IAC9B,IAAI,SAAS,GAAG,CAAC,GAAG,GAAG,QAAQ,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC;IAC7C,IAAI,OAAO,GAAG,GAAG,GAAG,SAAS,CAAC;IAC9B,IAAI,IAAI,CAAC,GAAG,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,IAAI,CAAC,IAAI,EAAE;QACzC,OAAO,IAAI,SAAS,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC;KAClD;IAED,kDAAkD;IAClD,iCAAiC;IAEjC,+DAA+D;IAC/D,6DAA6D;IAC7D,gDAAgD;IAChD,OAAO,QAAQ,CAAC,OAAO,EAAE,IAAI,CAAC,SAAS,CAAC,CAAC;AAC1C,CAAC,CAAC;AAOF,MAAM,CAAC,MAAM,eAAe,GASxB,CAAC,IAAiB,EAAE,EAAE;IACzB,IAAI,UAAU,GAAG,KAAK,CAAC;IAEvB,MAAM,UAAU,GAAG,CAAC,CAAgB,EAAE,EAAE;QACvC,QAAQ,CAAC,CAAC,GAAG,EAAE;YACd,KAAK,KAAK,CAAC;YACX,KAAK,QAAQ;gBACZ,aAAa,EAAE,CAAC;gBAChB,IAAI,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,cAAc,CAAC,CAAC,CAAC;SACrD;IACF,CAAC,CAAC;IAEF,MAAM,SAAS,GAAG,CAAC,CAA0B,EAAE,EAAE;QAChD,MAAM,EAAE,GAAG,IAAI,WAAW,CAAC,aAAa,EAAE,EAAE,UAAU,EAAE,IAAI,EAAE,CAAC,CAAC;QAChE,IAAI,CAAC,aAAa,CAAC,EAAE,CAAC,CAAC;QAEvB,sCAAsC;QACtC,IAAI,EAAE,CAAC,gBAAgB,EAAE;YACxB,OAAO;SACP;QAED,UAAU,GAAG,IAAI,CAAC;QAClB,UAAU,CAAC,CAAC,CAAC,CAAC;QAEd,MAAM,CAAC,gBAAgB,CAAC,WAAW,EAAE,UAAU,CAAC,CAAC;QACjD,MAAM,CAAC,gBAAgB,CAAC,SAAS,EAAE,OAAO,CAAC,CAAC;QAC5C,MAAM,CAAC,gBAAgB,CAAC,WAAW,EAAE,UAAU,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC,CAAC;QACrE,MAAM,CAAC,gBAAgB,CAAC,UAAU,EAAE,OAAO,CAAC,CAAC;QAC7C,MAAM,CAAC,gBAAgB,CAAC,SAAS,EAAE,UAAU,CAAC,CAAC;IAChD,CAAC,CAAC;IAEF,sDAAsD;IACtD,MAAM,UAAU,GAAG,CAAC,CAA0B,EAAE,EAAE;QACjD,IAAI,CAAC,UAAU,EAAE;YAChB,OAAO;SACP;QAED,MAAM,YAAY,GAAG,mBAAmB,CAAC,CAAC,CAAC,CAAC;QAE5C,IAAI,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,YAAY,EAAE,EAAE,MAAM,EAAE,EAAE,GAAG,EAAE,YAAY,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC;IAC7F,CAAC,CAAC;IAEF,MAAM,OAAO,GAAG,GAAG,EAAE;QACpB,IAAI,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,WAAW,CAAC,CAAC,CAAC;QAEjD,aAAa,EAAE,CAAC;IACjB,CAAC,CAAC;IAEF,MAAM,aAAa,GAAG,GAAG,EAAE;QAC1B,UAAU,GAAG,KAAK,CAAC;QAEnB,8EAA8E;QAC9E,MAAM,CAAC,mBAAmB,CAAC,WAAW,EAAE,UAAU,CAAC,CAAC;QACpD,MAAM,CAAC,mBAAmB,CAAC,SAAS,EAAE,OAAO,CAAC,CAAC;QAC/C,MAAM,CAAC,mBAAmB,CAAC,WAAW,EAAE,UAAU,CAAC,CAAC;QACpD,MAAM,CAAC,mBAAmB,CAAC,UAAU,EAAE,OAAO,CAAC,CAAC;QAChD,MAAM,CAAC,mBAAmB,CAAC,SAAS,EAAE,UAAU,CAAC,CAAC;IACnD,CAAC,CAAC;IAEF,IAAI,CAAC,gBAAgB,CAAC,WAAW,EAAE,SAAS,CAAC,CAAC;IAE9C,OAAO;QACN,OAAO,EAAE,GAAG,EAAE;YACb,IAAI,CAAC,mBAAmB,CAAC,WAAW,EAAE,SAAS,CAAC,CAAC;YAEjD,aAAa,EAAE,CAAC;QACjB,CAAC;KACD,CAAC;AACH,CAAC,CAAC"}

package/package.json

@@ -0,0 +1,54 @@
+{
+	"name": "@codercms/web-player",
+	"version": "0.0.1",
+	"scripts": {
+		"dev": "vite dev",
+		"build": "vite build && npm run package",
+		"preview": "vite preview",
+		"package": "svelte-kit sync && svelte-package && publint",
+		"prepublishOnly": "npm run package",
+		"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
+		"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
+		"test": "vitest",
+		"lint": "prettier --plugin-search-dir . --check . && eslint .",
+		"format": "prettier --plugin-search-dir . --write ."
+	},
+	"exports": {
+		".": {
+			"types": "./dist/index.d.ts",
+			"svelte": "./dist/index.js"
+		}
+	},
+	"files": [
+		"dist",
+		"!dist/**/*.test.*",
+		"!dist/**/*.spec.*"
+	],
+	"peerDependencies": {
+		"svelte": "^4.0.0"
+	},
+	"devDependencies": {
+		"@sveltejs/adapter-auto": "^2.0.0",
+		"@sveltejs/kit": "^1.20.4",
+		"@sveltejs/package": "^2.0.0",
+		"@typescript-eslint/eslint-plugin": "^6.0.0",
+		"@typescript-eslint/parser": "^6.0.0",
+		"eslint": "^8.28.0",
+		"eslint-config-prettier": "^8.5.0",
+		"eslint-plugin-svelte": "^2.30.0",
+		"eventemitter3": "^5.0.1",
+		"hls.js": "^1.4.12",
+		"prettier": "^2.8.0",
+		"prettier-plugin-svelte": "^2.10.1",
+		"publint": "^0.1.9",
+		"svelte": "^4.0.5",
+		"svelte-check": "^3.4.3",
+		"tslib": "^2.4.1",
+		"typescript": "^5.0.0",
+		"vite": "^4.4.2",
+		"vitest": "^0.34.0"
+	},
+	"svelte": "./dist/index.js",
+	"types": "./dist/index.d.ts",
+	"type": "module"
+}