Skip to content

Commit

Permalink
part definition for media-control-bar in old and new themes
Browse files Browse the repository at this point in the history
  • Loading branch information
@AdamJaggard
AdamJaggard committed Sep 19, 2023
1 parent c663dc7 commit 9668699
Show file tree
Hide file tree
Showing 3 changed files with 32 additions and 32 deletions.
2 changes: 1 addition & 1 deletion packages/mux-player/src/template.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@ export const content = (props: MuxTemplateProps) => html`
defaultshowremainingtime="${props.defaultShowRemainingTime ?? false}"
hideduration="${props.hideDuration ?? false}"
title="${props.title ?? false}"
exportparts="top, center, bottom, layer, media-layer, poster-layer, vertical-layer, centered-layer, gesture-layer, controller, poster, live, play, button, seek-backward, seek-forward, mute, captions, airplay, pip, fullscreen, cast, playback-rate, volume, range, time, display"
exportparts="top, center, bottom, layer, media-layer, poster-layer, vertical-layer, centered-layer, gesture-layer, controller, poster, live, play, button, seek-backward, seek-forward, mute, captions, airplay, pip, fullscreen, cast, playback-rate, volume, range, time, display, control-bar"
>
<mux-video
slot="media"
Expand Down
16 changes: 8 additions & 8 deletions packages/mux-player/src/themes/2023/2023.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -883,10 +883,10 @@

<template if="streamtype == 'on-demand'">
<template if="breakpointsm">
<media-control-bar slot="top-chrome">{{>TitleDisplay}} </media-control-bar>
<media-control-bar part="control-bar top" slot="top-chrome">{{>TitleDisplay}} </media-control-bar>
</template>
{{>TimeRange}}
<media-control-bar part="bottom">
<media-control-bar part="control-bar bottom">
<template if="breakpointsm">
{{>PlayButton}} {{>SeekBackwardButton}} {{>SeekForwardButton}} {{>TimeDisplay}}
</template>
Expand All @@ -901,12 +901,12 @@
</template>

<template if="streamtype == 'live'">
<media-control-bar slot="top-chrome">
<media-control-bar part="control-bar top" slot="top-chrome">
{{>LiveButton}}
<template if="breakpointsm"> {{>TitleDisplay}} </template>
</media-control-bar>
<template if="targetlivewindow > 0">{{>TimeRange}}</template>
<media-control-bar part="bottom">
<media-control-bar part="control-bar bottom">
<template if="breakpointsm">
{{>PlayButton}}
<template if="targetlivewindow > 0"> {{>SeekBackwardButton}} {{>SeekForwardButton}} </template>
Expand All @@ -923,9 +923,9 @@
<template if="audio">
<template if="streamtype == 'on-demand'">
<template if="title">
<media-control-bar>{{>TitleDisplay}}</media-control-bar>
<media-control-bar part="control-bar top">{{>TitleDisplay}}</media-control-bar>
</template>
<media-control-bar part="bottom">
<media-control-bar part="control-bar bottom">
{{>PlayButton}}
<template if="breakpointsm"> {{>SeekBackwardButton}} {{>SeekForwardButton}} </template>
{{>MuteButton}}
Expand All @@ -939,9 +939,9 @@

<template if="streamtype == 'live'">
<template if="title">
<media-control-bar>{{>TitleDisplay}}</media-control-bar>
<media-control-bar part="control-bar top">{{>TitleDisplay}}</media-control-bar>
</template>
<media-control-bar part="bottom">
<media-control-bar part="control-bar bottom">
<template if="breakpointsm">
{{>PlayButton}} {{>LiveButton section="bottom"}} {{>MuteButton}} {{>VolumeRange}}
<template if="targetlivewindow > 0"> {{>SeekBackwardButton}} {{>SeekForwardButton}} </template>
Expand Down
46 changes: 23 additions & 23 deletions packages/mux-player/src/themes/classic/classic.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -489,9 +489,9 @@

<template if="streamtype == 'on-demand'">
<template if="title">
<media-control-bar>{{>TitleDisplay}}</media-control-bar>
<media-control-bar part="control-bar top">{{>TitleDisplay}}</media-control-bar>
</template>
<media-control-bar>
<media-control-bar part="control-bar bottom">
{{>PlayButton}}
{{>SeekBackwardButton}}
{{>SeekForwardButton}}
Expand All @@ -510,9 +510,9 @@

<template if="targetlivewindow > 0">
<template if="title">
<media-control-bar>{{>TitleDisplay}}</media-control-bar>
<media-control-bar part="control-bar top">{{>TitleDisplay}}</media-control-bar>
</template>
<media-control-bar>
<media-control-bar part="control-bar bottom">
{{>PlayButton}}
{{>LiveButton section="bottom"}}
{{>SeekBackwardButton}}
Expand All @@ -530,9 +530,9 @@

<template if="!targetlivewindow">
<template if="title">
<media-control-bar>{{>TitleDisplay}}</media-control-bar>
<media-control-bar part="control-bar top">{{>TitleDisplay}}</media-control-bar>
</template>
<media-control-bar>
<media-control-bar part="control-bar bottom">
{{>PlayButton}}
{{>LiveButton section="bottom"}}
{{>MuteButton}}
Expand All @@ -553,7 +553,7 @@

<template if="!breakpointsm">
{{>TimeRange}}
<media-control-bar>
<media-control-bar part="control-bar bottom">
{{>PlayButton}}
{{>MuteButton}}
<div class="spacer"></div>
Expand All @@ -564,7 +564,7 @@

<template if="breakpointsm">
<template if="!breakpointmd">
<media-control-bar slot="top-chrome">
<media-control-bar part="control-bar top" slot="top-chrome">
{{>TitleDisplay}}
</media-control-bar>
<div slot="centered-chrome" class="center-controls">
Expand All @@ -573,7 +573,7 @@
{{>SeekForwardButton section="center"}}
</div>
{{>TimeRange}}
<media-control-bar>
<media-control-bar part="control-bar bottom">
{{>PlayButton}}
{{>TimeDisplay}}
{{>MuteButton}}
Expand All @@ -592,14 +592,14 @@
</template>

<template if="breakpointmd">
<media-control-bar slot="top-chrome">
<media-control-bar part="control-bar top" slot="top-chrome">
{{>TitleDisplay}}
</media-control-bar>
<div slot="centered-chrome" class="center-controls">
{{>PlayButton section="center"}}
</div>
{{>TimeRange}}
<media-control-bar>
<media-control-bar part="control-bar bottom">
{{>PlayButton}}
{{>SeekBackwardButton}}
{{>SeekForwardButton}}
Expand All @@ -625,10 +625,10 @@
<template if="!targetlivewindow">

<template if="!breakpointsm">
<media-control-bar slot="top-chrome">
<media-control-bar part="control-bar top" slot="top-chrome">
{{>LiveButton}}
</media-control-bar>
<media-control-bar>
<media-control-bar part="control-bar bottom">
{{>PlayButton}}
{{>MuteButton}}
<div class="spacer"></div>
Expand All @@ -639,14 +639,14 @@

<template if="breakpointsm">
<template if="!breakpointmd">
<media-control-bar slot="top-chrome">
<media-control-bar part="control-bar top" slot="top-chrome">
{{>LiveButton}}
{{>TitleDisplay}}
</media-control-bar>
<div slot="centered-chrome" class="center-controls">
{{>PlayButton section="center"}}
</div>
<media-control-bar>
<media-control-bar part="control-bar bottom">
{{>PlayButton}}
{{>MuteButton}}
{{>VolumeRange}}
Expand All @@ -663,14 +663,14 @@
</template>

<template if="breakpointmd">
<media-control-bar slot="top-chrome">
<media-control-bar part="control-bar top" slot="top-chrome">
{{>LiveButton}}
{{>TitleDisplay}}
</media-control-bar>
<div slot="centered-chrome" class="center-controls">
{{>PlayButton section="center"}}
</div>
<media-control-bar>
<media-control-bar part="control-bar bottom">
{{>PlayButton}}
{{>MuteButton}}
{{>VolumeRange}}
Expand All @@ -689,11 +689,11 @@
<template if="targetlivewindow > 0">

<template if="!breakpointsm">
<media-control-bar slot="top-chrome">
<media-control-bar part="control-bar top" slot="top-chrome">
{{>LiveButton}}
</media-control-bar>
{{>TimeRange}}
<media-control-bar>
<media-control-bar part="control-bar bottom">
{{>PlayButton}}
{{>MuteButton}}
<div class="spacer"></div>
Expand All @@ -704,7 +704,7 @@

<template if="breakpointsm">
<template if="!breakpointmd">
<media-control-bar slot="top-chrome">
<media-control-bar part="control-bar top" slot="top-chrome">
{{>LiveButton}}
{{>TitleDisplay}}
</media-control-bar>
Expand All @@ -714,7 +714,7 @@
{{>SeekForwardButton section="center"}}
</div>
{{>TimeRange}}
<media-control-bar>
<media-control-bar part="control-bar bottom">
{{>PlayButton}}
{{>MuteButton}}
{{>VolumeRange}}
Expand All @@ -731,15 +731,15 @@
</template>

<template if="breakpointmd">
<media-control-bar slot="top-chrome">
<media-control-bar part="control-bar top" slot="top-chrome">
{{>LiveButton}}
{{>TitleDisplay}}
</media-control-bar>
<div slot="centered-chrome" class="center-controls">
{{>PlayButton section="center"}}
</div>
{{>TimeRange}}
<media-control-bar>
<media-control-bar part="control-bar bottom">
{{>PlayButton}}
{{>SeekBackwardButton}}
{{>SeekForwardButton}}
Expand Down

0 comments on commit 9668699

Please sign in to comment.