Media player update

And also some javascript bugs. player should work properly now.
This commit is contained in:
2024-03-03 23:15:25 +01:00
parent 716d17deca
commit d2c0354b35
10 changed files with 386 additions and 19 deletions
+48
View File
@@ -0,0 +1,48 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
width="64mm"
height="64mm"
viewBox="0 0 64 64"
version="1.1"
id="svg1"
inkscape:export-filename="pause.svg"
inkscape:export-xdpi="12.7"
inkscape:export-ydpi="12.7"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<sodipodi:namedview
id="namedview1"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:showpageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#d1d1d1"
inkscape:document-units="mm" />
<defs
id="defs1" />
<g
inkscape:label="Layer 1"
inkscape:groupmode="layer"
id="layer1">
<rect
id="rect2"
width="16"
height="48"
x="8"
y="8"
style="fill:#808080;stroke-width:0.304549" />
<rect
id="rect2-5"
width="16"
height="48"
x="40"
y="8"
style="fill:#808080;stroke-width:0.304549" />
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.2 KiB

+48
View File
@@ -0,0 +1,48 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
width="64mm"
height="64mm"
viewBox="0 0 64 64"
version="1.1"
id="svg1"
inkscape:export-filename="play.svg"
inkscape:export-xdpi="12.7"
inkscape:export-ydpi="12.7"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<sodipodi:namedview
id="namedview1"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:showpageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#d1d1d1"
inkscape:document-units="mm" />
<defs
id="defs1" />
<g
inkscape:label="Layer 1"
inkscape:groupmode="layer"
id="layer1">
<rect
id="rect2"
width="16"
height="48"
x="8"
y="8"
style="stroke-width:0.304549" />
<rect
id="rect2-5"
width="16"
height="48"
x="40"
y="8"
style="stroke-width:0.304549" />
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.2 KiB

+51
View File
@@ -0,0 +1,51 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
width="64mm"
height="64mm"
viewBox="0 0 64 64"
version="1.1"
id="svg1"
inkscape:export-filename="play.svg"
inkscape:export-xdpi="12.7"
inkscape:export-ydpi="12.7"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<sodipodi:namedview
id="namedview1"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:showpageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#d1d1d1"
inkscape:document-units="mm" />
<defs
id="defs1" />
<g
inkscape:label="Layer 1"
inkscape:groupmode="layer"
id="layer1">
<path
sodipodi:type="star"
id="path2"
inkscape:flatsided="true"
sodipodi:sides="3"
sodipodi:cx="3.9214177"
sodipodi:cy="28.775017"
sodipodi:r1="30.64756"
sodipodi:r2="15.32378"
sodipodi:arg1="0"
sodipodi:arg2="1.0471976"
inkscape:rounded="0"
inkscape:randomized="0"
d="m 34.568978,28.775017 -45.97134,26.541565 0,-53.0831308 z"
inkscape:transform-center-x="-8.0000004"
style="fill:#808080;stroke-width:0.264583"
transform="matrix(1.0441288,0,0,0.90424206,19.905535,5.9804195)" />
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.5 KiB

+48
View File
@@ -0,0 +1,48 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
width="64mm"
height="64mm"
viewBox="0 0 64 64"
version="1.1"
id="svg1"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<sodipodi:namedview
id="namedview1"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:showpageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#d1d1d1"
inkscape:document-units="mm" />
<defs
id="defs1" />
<g
inkscape:label="Layer 1"
inkscape:groupmode="layer"
id="layer1">
<path
sodipodi:type="star"
id="path2"
inkscape:flatsided="true"
sodipodi:sides="3"
sodipodi:cx="3.9214177"
sodipodi:cy="28.775017"
sodipodi:r1="30.64756"
sodipodi:r2="15.32378"
sodipodi:arg1="0"
sodipodi:arg2="1.0471976"
inkscape:rounded="0"
inkscape:randomized="0"
d="m 34.568978,28.775017 -45.97134,26.541565 0,-53.0831308 z"
inkscape:transform-center-x="-8.0000004"
style="stroke-width:0.264583"
transform="matrix(1.0441288,0,0,0.90424206,19.905535,5.9804195)" />
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.4 KiB

+41
View File
@@ -0,0 +1,41 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
width="64mm"
height="64mm"
viewBox="0 0 64 64"
version="1.1"
id="svg1"
inkscape:export-filename="stop.svg"
inkscape:export-xdpi="12.7"
inkscape:export-ydpi="12.7"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<sodipodi:namedview
id="namedview1"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:showpageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#d1d1d1"
inkscape:document-units="mm" />
<defs
id="defs1" />
<g
inkscape:label="Layer 1"
inkscape:groupmode="layer"
id="layer1">
<rect
id="rect2"
width="48"
height="49.048836"
x="8"
y="8"
style="fill:#808080;stroke-width:0.533226" />
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

+48
View File
@@ -0,0 +1,48 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
width="64mm"
height="64mm"
viewBox="0 0 64 64"
version="1.1"
id="svg1"
inkscape:export-filename="pause.svg"
inkscape:export-xdpi="12.7"
inkscape:export-ydpi="12.7"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<sodipodi:namedview
id="namedview1"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:showpageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#d1d1d1"
inkscape:document-units="mm" />
<defs
id="defs1" />
<g
inkscape:label="Layer 1"
inkscape:groupmode="layer"
id="layer1">
<rect
id="rect2"
width="48"
height="49.048836"
x="8"
y="8"
style="stroke-width:0.533226" />
<rect
id="rect2-5"
width="16"
height="48"
x="40"
y="8"
style="stroke-width:0.304549" />
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.2 KiB

+33 -1
View File
@@ -185,9 +185,41 @@ iframe {
height: 22px;
}
#media-control button {
min-width: 0;
width: 20px;
width: 32px;
height: 32px;
background-size: 50%;
background-repeat: no-repeat;
background-position: 50% 50%;
box-shadow:none;
}
#media-control:not(.waiting) button:hover {
box-shadow: inset -1px -1px #0a0a0a,inset 1px 1px #fff,inset -2px -2px grey,inset 2px 2px #dfdfdf
}
#media-control button#play {
background-image:url(img/play.svg);
}
#media-control button#pause {
background-image:url(img/pause.svg);
}
#media-control button#stop {
background-image:url(img/stop.svg);
}
#media-control.waiting button#play {
background-image:url(img/play-inactive.svg);
}
#media-control.waiting button#pause {
background-image:url(img/pause-inactive.svg);
}
#media-control.waiting button#stop {
background-image:url(img/stop-inactive.svg);
}
/* Clippy */