Upgrade player to the latest version

This commit is contained in:
Marcin Kulik
2025-10-24 15:38:01 +02:00
parent 7fc8278676
commit c918abf42d
5 changed files with 50 additions and 5 deletions

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@@ -469,6 +469,7 @@ div.ap-control-bar span.ap-playback-button {
width: 12px; width: 12px;
height: 12px; height: 12px;
padding: 10px; padding: 10px;
margin: 0 0 0 2px;
} }
div.ap-control-bar span.ap-playback-button svg { div.ap-control-bar span.ap-playback-button svg {
height: 12px; height: 12px;
@@ -537,6 +538,7 @@ div.ap-control-bar .ap-fullscreen-button {
width: 14px; width: 14px;
height: 14px; height: 14px;
padding: 9px; padding: 9px;
margin: 0 2px 0 4px;
} }
div.ap-control-bar .ap-fullscreen-button svg { div.ap-control-bar .ap-fullscreen-button svg {
width: 14px; width: 14px;
@@ -556,7 +558,7 @@ div.ap-control-bar .ap-fullscreen-button .ap-tooltip {
div.ap-control-bar .ap-kbd-button { div.ap-control-bar .ap-kbd-button {
height: 14px; height: 14px;
padding: 9px; padding: 9px;
margin: 0 4px; margin: 0 0 0 4px;
} }
div.ap-control-bar .ap-kbd-button svg { div.ap-control-bar .ap-kbd-button svg {
width: 26px; width: 26px;
@@ -567,6 +569,19 @@ div.ap-control-bar .ap-kbd-button .ap-tooltip {
left: initial; left: initial;
transform: none; transform: none;
} }
div.ap-control-bar .ap-speaker-button {
width: 19px;
padding: 6px 9px;
margin: 0 0 0 4px;
position: relative;
}
div.ap-control-bar .ap-speaker-button svg {
width: 19px;
}
div.ap-control-bar .ap-speaker-button .ap-tooltip {
left: -50%;
transform: none;
}
div.ap-wrapper.ap-hud .ap-control-bar { div.ap-wrapper.ap-hud .ap-control-bar {
opacity: 1; opacity: 1;
} }
@@ -666,6 +681,7 @@ span.ap-marker-container:hover span.ap-marker {
} }
.ap-player .ap-overlay-start .ap-play-button div span svg { .ap-player .ap-overlay-start .ap-play-button div span svg {
height: 100%; height: 100%;
display: inline-block;
} }
.ap-player .ap-overlay-start .ap-play-button svg { .ap-player .ap-overlay-start .ap-play-button svg {
filter: drop-shadow(0px 0px 5px rgba(0, 0, 0, 0.4)); filter: drop-shadow(0px 0px 5px rgba(0, 0, 0, 0.4));
@@ -754,6 +770,36 @@ span.ap-marker-container:hover span.ap-marker {
.ap-player .ap-overlay-error span { .ap-player .ap-overlay-error span {
font-size: 8em; font-size: 8em;
} }
.ap-player .slide-enter-active {
transition: opacity 0.2s;
}
.ap-player .slide-enter-active.ap-was-playing {
transition: top 0.2s ease-out, opacity 0.2s;
}
.ap-player .slide-exit-active {
transition: top 0.2s ease-in, opacity 0.2s;
}
.ap-player .slide-enter {
top: -50%;
opacity: 0;
}
.ap-player .slide-enter-to {
top: 0%;
}
.ap-player .slide-enter,
.ap-player .slide-enter-to,
.ap-player .slide-exit,
.ap-player .slide-exit-to {
bottom: auto;
height: 100%;
}
.ap-player .slide-exit {
top: 0%;
}
.ap-player .slide-exit-to {
top: -50%;
opacity: 0;
}
@keyframes ap-loader-rotation { @keyframes ap-loader-rotation {
0% { 0% {
transform: rotate(0deg); transform: rotate(0deg);

1
assets/asciinema-player.min.js vendored Normal file

File diff suppressed because one or more lines are too long

View File

@@ -38,7 +38,7 @@
</style> </style>
</head> </head>
<body> <body>
<script src="asciinema-player-ui.min.js"></script> <script src="asciinema-player.min.js"></script>
<script> <script>
const loc = window.location; const loc = window.location;
@@ -70,7 +70,7 @@
console.debug('initializing the player', { src, opts }); console.debug('initializing the player', { src, opts });
window.player = AsciinemaPlayer.create(src, document.body, 'asciinema-player-worker.min.js', opts); window.player = AsciinemaPlayer.create(src, document.body, opts);
window.player.addEventListener('reset', () => { window.player.addEventListener('reset', () => {
const el = window.player.el.getElementsByClassName('ap-player')[0]; const el = window.player.el.getElementsByClassName('ap-player')[0];