Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Player #135

Merged
merged 31 commits into from
Dec 19, 2024
Merged
Changes from 1 commit
Commits
Show all changes
31 commits
Select commit Hold shift + click to select a range
39c10a7
player
matvp91 Dec 3, 2024
a68b72c
Merge branch 'main' of github.com:matvp91/mixwave into feature/player…
matvp91 Dec 5, 2024
01c553c
Multiple video elements
matvp91 Dec 5, 2024
ca3e053
New player
matvp91 Dec 6, 2024
98e094b
Fixture for media-chrome
matvp91 Dec 6, 2024
45dde29
Prettier
matvp91 Dec 6, 2024
d69fdf1
Rendition menu
matvp91 Dec 6, 2024
c464967
Added mapping for audio and quality
matvp91 Dec 6, 2024
df5fe0d
Added expiry
matvp91 Dec 7, 2024
cbebc18
Removed unused log
matvp91 Dec 7, 2024
f6a7e6a
Added temp code
matvp91 Dec 9, 2024
fa5d6ac
Added textTracks support
matvp91 Dec 9, 2024
c99d615
Ignore error
matvp91 Dec 9, 2024
0e92824
Interstitial demo asset
matvp91 Dec 9, 2024
621f243
Fix tags
matvp91 Dec 10, 2024
8ef5324
Seeking
matvp91 Dec 10, 2024
61b32ae
Added support for multiple load calls
matvp91 Dec 10, 2024
bfd4a8d
Added interstitial asset
matvp91 Dec 10, 2024
c8f7c6d
Hide seekbar
matvp91 Dec 10, 2024
03ab89c
Merge branch 'main' of github.com:matvp91/mixwave into feature/player…
matvp91 Dec 10, 2024
a0f4ae7
Added object dump
matvp91 Dec 10, 2024
73fc260
Added context viewer
matvp91 Dec 11, 2024
f2cf130
Added json viewer
matvp91 Dec 11, 2024
da06384
Support for text files
matvp91 Dec 11, 2024
158412f
Merge branch 'main' of github.com:matvp91/mixwave into feature/player…
matvp91 Dec 14, 2024
197018c
Added interstitial instead of solely asset
matvp91 Dec 14, 2024
b58975a
Added player controls
matvp91 Dec 17, 2024
930d5fb
Added controls to bottom
matvp91 Dec 17, 2024
62a4146
Show cuepoints
matvp91 Dec 17, 2024
bb23744
Added player view
matvp91 Dec 17, 2024
b18b0b1
Added more player
matvp91 Dec 19, 2024
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
Added temp code
matvp91 committed Dec 9, 2024
commit f6a7e6a5467886fdc6e80d35db04c068f118eb70
2 changes: 2 additions & 0 deletions fixtures/media-chrome/index.html
Original file line number Diff line number Diff line change
@@ -39,6 +39,7 @@
<media-loading-indicator slot="centered-chrome" no-auto-hide></media-loading-indicator>
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
<media-loading-indicator slot="centered-chrome" no-auto-hide></media-loading-indicator>
<media-loading-indicator slot="centered-chrome" noautohide></media-loading-indicator>

I was wondering where you got this markup? seems to have the old way of kebab cased attributes.
the new attributes in Media Chrome are all without dashes in them.

<media-rendition-menu hidden anchor="auto"></media-rendition-menu>
<media-audio-track-menu hidden anchor="auto"></media-audio-track-menu>
<media-captions-menu hidden anchor="auto"></media-captions-menu>
<media-control-bar>
<media-play-button></media-play-button>
<media-seek-forward-button></media-seek-forward-button>
@@ -48,6 +49,7 @@
<media-time-display show-duration></media-time-display>
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
<media-time-display show-duration></media-time-display>
<media-time-display showduration></media-time-display>

<media-rendition-menu-button></media-rendition-menu-button>
<media-audio-track-menu-button></media-audio-track-menu-button>
<media-captions-menu-button></media-captions-menu-button>
<media-fullscreen-button></media-fullscreen-button>
</media-control-bar>
</media-controller>
5 changes: 0 additions & 5 deletions fixtures/media-chrome/superstreamer-video-element.js
Original file line number Diff line number Diff line change
@@ -99,11 +99,6 @@ class SuperstreamerVideoElement extends MediaTracksMixin(
}

this.#player.load(this.src);

// TODO: Remove this.
Object.assign(window, {
player: this.#player,
});
}

get currentTime() {
3 changes: 0 additions & 3 deletions packages/player/package.json
Original file line number Diff line number Diff line change
@@ -21,9 +21,6 @@
"lint": "tsc && eslint",
"typedoc": "typedoc --tsconfig tsconfig.typedoc.json"
},
"peerDependencies": {
"react": "^18.3.1"
},
"dependencies": {
"hls.js": "^1.6.0-beta.1",
"tseep": "^1.3.1",
16 changes: 0 additions & 16 deletions packages/player/src/helpers.ts
Original file line number Diff line number Diff line change
@@ -10,22 +10,6 @@ export function getLangCode(key?: string) {
return `${value[0].toUpperCase()}${value.slice(1)}`;
}

interface CustomListAsset {
type?: "ad" | "bumper";
}

export function formatListAsset(
values?: Record<string, string>,
): CustomListAsset {
const data: CustomListAsset = {};
if (values) {
if ("SPRS-TYPE" in values) {
data.type = values["SPRS-TYPE"] as unknown as CustomListAsset["type"];
}
}
return data;
}

// Inspired by iso-language-codes.
// See https://github.com/pubcore/iso-language-codes/blob/master/src/data.ts
const langCodes: Record<string, string> = {
20 changes: 8 additions & 12 deletions packages/player/src/hls-player.ts
Original file line number Diff line number Diff line change
@@ -2,7 +2,7 @@ import Hls from "hls.js";
import { assert } from "shared/assert";
import { EventEmitter } from "tseep";
import { EventManager } from "./event-manager";
import { formatListAsset, getLangCode } from "./helpers";
import { getLangCode } from "./helpers";
import { getState, State } from "./state";
import type {
AudioTrack,
@@ -271,13 +271,15 @@ export class HlsPlayer {
this.setActiveMedia_(media);
}

const listResponseAsset =
data.event.assetListResponse?.ASSETS[data.assetListIndex];
const assetData = formatListAsset(listResponseAsset);
const listResponseAsset = data.event.assetListResponse?.ASSETS[
data.assetListIndex
] as {
"SPRS-KIND"?: "ad" | "bumper";
};

this.state_?.setAsset({
player: data.player,
type: assetData.type,
type: listResponseAsset["SPRS-KIND"],
});
});

@@ -317,13 +319,7 @@ export class HlsPlayer {
listen(Hls.Events.INTERSTITIALS_UPDATED, (_, data) => {
const cuepoints: number[] = [];
data.schedule.forEach((item) => {
const tags = item.event?.dateRange.attr.enumeratedStringList(
"X-SPRS-TYPES",
{ ad: false, bumper: false },
);
if (tags?.ad) {
cuepoints.push(item.start);
}
// TODO: Make each item with a proper timeline tag.
});
this.state_?.setCuepoints(cuepoints);
});