initial commit; implemented button recognition
This commit is contained in:
krippix
commit
575e7ca11e
5
.gitignore
vendored
Normal file
5
.gitignore
vendored
Normal file
|
|
@ -0,0 +1,5 @@
|
||||||
|
docker-compose.yml
|
||||||
|
nginx.conf
|
||||||
|
dockerfile
|
||||||
|
*.pem
|
||||||
|
*.key
|
||||||
26
html/assets/css/base.css
Normal file
26
html/assets/css/base.css
Normal file
|
|
@ -0,0 +1,26 @@
|
||||||
|
body {
|
||||||
|
margin: 0;
|
||||||
|
background-color: #d3d3d3;
|
||||||
|
}
|
||||||
|
h1 {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
img {
|
||||||
|
height: auto;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
#titlebar {
|
||||||
|
font-family: 'arial';
|
||||||
|
color: white;
|
||||||
|
padding: 20px;
|
||||||
|
margin: 0px;
|
||||||
|
background-color: #333;
|
||||||
|
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
|
||||||
|
}
|
||||||
|
.container {
|
||||||
|
max-width: 1920px;
|
||||||
|
background-color: white;
|
||||||
|
display: flex;
|
||||||
|
margin: 10px auto;
|
||||||
|
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
|
||||||
|
}
|
||||||
20
html/assets/css/reset.css
Normal file
20
html/assets/css/reset.css
Normal file
|
|
@ -0,0 +1,20 @@
|
||||||
|
html, body, div, span, applet, object, iframe,
|
||||||
|
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
|
||||||
|
a, abbr, acronym, address, big, cite, code,
|
||||||
|
del, dfn, em, img, ins, kbd, q, s, samp,
|
||||||
|
small, strike, strong, sub, sup, tt, var,
|
||||||
|
b, u, i, center,
|
||||||
|
dl, dt, dd, ol, ul, li,
|
||||||
|
fieldset, form, label, legend,
|
||||||
|
table, caption, tbody, tfoot, thead, tr, th, td,
|
||||||
|
article, aside, canvas, details, embed,
|
||||||
|
figure, figcaption, footer, header, hgroup,
|
||||||
|
menu, nav, output, ruby, section, summary,
|
||||||
|
time, mark, audio, video {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
border: 0;
|
||||||
|
font-size: 100%;
|
||||||
|
font: inherit;
|
||||||
|
vertical-align: baseline;
|
||||||
|
}
|
||||||
937
html/assets/img/piano-keyboard.svg
Normal file
937
html/assets/img/piano-keyboard.svg
Normal file
|
|
@ -0,0 +1,937 @@
|
||||||
|
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||||
|
<!-- Created with Inkscape (http://www.inkscape.org/) -->
|
||||||
|
<svg
|
||||||
|
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||||
|
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
xmlns:cc="http://creativecommons.org/ns#"
|
||||||
|
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||||
|
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||||
|
xmlns:svg="http://www.w3.org/2000/svg"
|
||||||
|
xmlns:ns1="http://sozi.baierouge.fr"
|
||||||
|
xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||||
|
id="svg4254"
|
||||||
|
sodipodi:docname="piano-keyboard.svg"
|
||||||
|
viewBox="0 0 4346.4 524.22"
|
||||||
|
version="1.1"
|
||||||
|
inkscape:version="0.48.0 r9654"
|
||||||
|
>
|
||||||
|
<title
|
||||||
|
id="title5312"
|
||||||
|
>Standard 88-key Piano Keyboard</title
|
||||||
|
>
|
||||||
|
<sodipodi:namedview
|
||||||
|
id="base"
|
||||||
|
fit-margin-left="0"
|
||||||
|
inkscape:zoom="0.22627417"
|
||||||
|
borderopacity="1.0"
|
||||||
|
inkscape:current-layer="layer1"
|
||||||
|
inkscape:cx="4904.2815"
|
||||||
|
inkscape:cy="180.26814"
|
||||||
|
fit-margin-right="0"
|
||||||
|
inkscape:window-maximized="0"
|
||||||
|
showgrid="false"
|
||||||
|
width="0mm"
|
||||||
|
inkscape:guide-bbox="true"
|
||||||
|
units="mm"
|
||||||
|
showguides="true"
|
||||||
|
bordercolor="#666666"
|
||||||
|
inkscape:window-x="123"
|
||||||
|
inkscape:window-y="180"
|
||||||
|
fit-margin-bottom="0"
|
||||||
|
inkscape:window-width="2435"
|
||||||
|
inkscape:pageopacity="0.0"
|
||||||
|
inkscape:pageshadow="2"
|
||||||
|
pagecolor="#ffffff"
|
||||||
|
inkscape:document-units="px"
|
||||||
|
inkscape:window-height="757"
|
||||||
|
fit-margin-top="0"
|
||||||
|
/>
|
||||||
|
<g
|
||||||
|
id="layer1"
|
||||||
|
inkscape:label="Layer 1"
|
||||||
|
inkscape:groupmode="layer"
|
||||||
|
transform="translate(-.15625 -526.12)"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
id="4"
|
||||||
|
style="stroke:#000000;stroke-width:1.065px;fill:#ffffff"
|
||||||
|
d="m168.15 527.93h45.723v345.34h34.427v172.13l-6.4717 3.7365h-67.223l-6.8627-3.9623z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="5"
|
||||||
|
style="stroke:#000000;stroke-width:1.065px;fill:#000000"
|
||||||
|
d="m221.54 531.97v334.34h42.601v-334.15z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="6"
|
||||||
|
style="stroke:#000000;stroke-width:1.065px;fill:#ffffff"
|
||||||
|
d="m269.66 527.41v345.75h-18.257v171.92l7.5613 4.3655h65.849l6.9048-3.9864v-172.49h-17.745v-345.56z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="7"
|
||||||
|
style="stroke:#000000;stroke-width:1.065px;fill:#000000"
|
||||||
|
d="m321.25 531.42v334.34h42.601v-334.15z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="8"
|
||||||
|
style="stroke:#000000;stroke-width:1.065px;fill:#ffffff"
|
||||||
|
d="m369.87 527.41v345.59h-34.427v172.13l7.7444 4.4711h65.412l7.4137-4.2801v-517.91z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="9"
|
||||||
|
style="stroke:#000000;stroke-width:1.065px;fill:#ffffff"
|
||||||
|
d="m419.63 527.41v517.32l8.3497 4.8207h65.345l6.8121-3.9331v-172.35h-37.339v-345.86z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="10"
|
||||||
|
style="stroke:#000000;stroke-width:1.065px;fill:#000000"
|
||||||
|
d="m467.99 531.42v334.34h42.601v-334.15z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4307-7-4-6"
|
||||||
|
style="stroke:#000000;stroke-width:1.065px;fill:#000000"
|
||||||
|
d="m563.74 531.42v334.34h42.601v-334.15z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4307-7-08-1"
|
||||||
|
style="stroke:#000000;stroke-width:1.065px;fill:#000000"
|
||||||
|
d="m659.49 531.42v334.34h42.601v-334.15z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4907-8"
|
||||||
|
style="stroke:#000000;stroke-width:1.065px;fill:#ffffff"
|
||||||
|
d="m515.65 527.41v345.46h-11.834v172.4l6.8212 3.9382h66.201l6.6943-3.8651v-172.48h-24.983v-345.46z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4909-2"
|
||||||
|
style="stroke:#000000;stroke-width:1.065px;fill:#ffffff"
|
||||||
|
d="m611.53 527.41v345.59h-23.534v172l7.8723 4.5451h65.688l7.0848-4.0904v-172.72h-14.212v-345.32z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4911-0"
|
||||||
|
style="stroke:#000000;stroke-width:1.065px;fill:#ffffff"
|
||||||
|
d="m707.15 527.41v345.59h-36.175v172.4l7.4845 4.3211h65.807l7.2323-4.1755v-518.14z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4307-7-08-1-1"
|
||||||
|
style="stroke:#000000;stroke-width:1.065px;fill:#000000"
|
||||||
|
d="m72.189 531.24v334.34h42.601v-334.15z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4909-2-4"
|
||||||
|
style="stroke:#000000;stroke-width:1.065px;fill:#ffffff"
|
||||||
|
d="m0.74026 527.29-0.041536 517.52 7.8723 4.5451h65.688l7.0848-4.0903 0.47067-172.66h-14.212v-345.32z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
sodipodi:nodetypes="ccccccccc"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4911-0-3"
|
||||||
|
style="stroke:#000000;stroke-width:1.065px;fill:#ffffff"
|
||||||
|
d="m119.85 527.23v345.59h-36.175v172.4l7.4845 4.3211h65.807l7.2323-4.1756v-518.14z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4305-5-4"
|
||||||
|
style="stroke:#000000;stroke-width:1.065px;fill:#ffffff"
|
||||||
|
d="m755.1 527.72h45.723v345.34h34.427v172.13l-6.4717 3.7362h-67.223l-6.8626-3.962z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4307-4-9"
|
||||||
|
style="stroke:#000000;stroke-width:1.065px;fill:#000000"
|
||||||
|
d="m808.49 531.77v334.34h42.601v-334.15z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4819-5-7"
|
||||||
|
style="stroke:#000000;stroke-width:1.065px;fill:#ffffff"
|
||||||
|
d="m856.61 527.21v345.75h-18.257v171.92l7.5614 4.3655h65.849l6.9047-3.9864v-172.49h-17.745v-345.56z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4307-7-6-4"
|
||||||
|
style="stroke:#000000;stroke-width:1.065px;fill:#000000"
|
||||||
|
d="m908.19 531.22v334.34h42.601v-334.15z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4841-0-8"
|
||||||
|
style="stroke:#000000;stroke-width:1.065px;fill:#ffffff"
|
||||||
|
d="m956.82 527.21v345.59h-34.427v172.13l7.7444 4.4714h65.412l7.4137-4.2803v-517.91z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4873-1-8"
|
||||||
|
style="stroke:#000000;stroke-width:1.065px;fill:#ffffff"
|
||||||
|
d="m1006.6 527.21v517.32l8.3498 4.8208h65.345l6.8118-3.9328v-172.35h-37.339v-345.86z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4307-7-0-2-2"
|
||||||
|
style="stroke:#000000;stroke-width:1.065px;fill:#000000"
|
||||||
|
d="m1054.9 531.22v334.34h42.601v-334.15z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4307-7-4-6-1"
|
||||||
|
style="stroke:#000000;stroke-width:1.065px;fill:#000000"
|
||||||
|
d="m1150.7 531.22v334.34h42.601v-334.15z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4307-7-08-1-4"
|
||||||
|
style="stroke:#000000;stroke-width:1.065px;fill:#000000"
|
||||||
|
d="m1246.4 531.22v334.34h42.601v-334.15z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4907-8-8"
|
||||||
|
style="stroke:#000000;stroke-width:1.065px;fill:#ffffff"
|
||||||
|
d="m1102.6 527.21v345.46h-11.834v172.4l6.8212 3.9381h66.201l6.6943-3.865v-172.48h-24.983v-345.46z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4909-2-0"
|
||||||
|
style="stroke:#000000;stroke-width:1.065px;fill:#ffffff"
|
||||||
|
d="m1198.5 527.21v345.59h-23.534v172l7.8722 4.545h65.688l7.0848-4.0902v-172.72h-14.212v-345.32z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4911-0-9"
|
||||||
|
style="stroke:#000000;stroke-width:1.065px;fill:#ffffff"
|
||||||
|
d="m1294.1 527.21v345.59h-36.175v172.4l7.4847 4.3212h65.806l7.2325-4.1758v-518.14z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4305-5-7"
|
||||||
|
style="stroke:#000000;stroke-width:1.065px;fill:#ffffff"
|
||||||
|
d="m1341.4 528.03h45.723v345.34h34.427v172.13l-6.4717 3.7364h-67.223l-6.8629-3.9622z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4307-4-7"
|
||||||
|
style="stroke:#000000;stroke-width:1.065px;fill:#000000"
|
||||||
|
d="m1394.8 532.08v334.34h42.601v-334.15z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4819-5-0"
|
||||||
|
style="stroke:#000000;stroke-width:1.065px;fill:#ffffff"
|
||||||
|
d="m1442.9 527.51v345.75h-18.258v171.92l7.5616 4.3655h65.849l6.9049-3.9865v-172.49h-17.745v-345.56z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4307-7-6-0"
|
||||||
|
style="stroke:#000000;stroke-width:1.065px;fill:#000000"
|
||||||
|
d="m1494.5 531.52v334.34h42.601v-334.15z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4841-0-7"
|
||||||
|
style="stroke:#000000;stroke-width:1.065px;fill:#ffffff"
|
||||||
|
d="m1543.1 527.51v345.59h-34.426v172.13l7.7442 4.4712h65.412l7.4137-4.2803v-517.91z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4873-1-81"
|
||||||
|
style="stroke:#000000;stroke-width:1.065px;fill:#ffffff"
|
||||||
|
d="m1592.8 527.51v517.32l8.3493 4.8206h65.345l6.8124-3.9331v-172.35h-37.339v-345.86z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4307-7-0-2-5"
|
||||||
|
style="stroke:#000000;stroke-width:1.065px;fill:#000000"
|
||||||
|
d="m1641.2 531.52v334.34h42.601v-334.15z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4307-7-4-6-3"
|
||||||
|
style="stroke:#000000;stroke-width:1.065px;fill:#000000"
|
||||||
|
d="m1737 531.52v334.34h42.601v-334.15z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4307-7-08-1-7"
|
||||||
|
style="stroke:#000000;stroke-width:1.065px;fill:#000000"
|
||||||
|
d="m1832.7 531.52v334.34h42.601v-334.15z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4907-8-5"
|
||||||
|
style="stroke:#000000;stroke-width:1.065px;fill:#ffffff"
|
||||||
|
d="m1688.9 527.51v345.46h-11.834v172.4l6.8211 3.9382h66.201l6.6944-3.8648v-172.48h-24.984v-345.46z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4909-2-06"
|
||||||
|
style="stroke:#000000;stroke-width:1.065px;fill:#ffffff"
|
||||||
|
d="m1784.7 527.51v345.59h-23.534v172l7.8724 4.5451h65.688l7.0848-4.0905v-172.72h-14.212v-345.32z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4911-0-2"
|
||||||
|
style="stroke:#000000;stroke-width:1.065px;fill:#ffffff"
|
||||||
|
d="m1880.4 527.51v345.59h-36.175v172.4l7.4846 4.3208h65.806l7.2325-4.1751v-518.14z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4305-5-4-9"
|
||||||
|
style="stroke:#000000;stroke-width:1.065px;fill:#ffffff"
|
||||||
|
d="m1928.3 527.82h45.723v345.34h34.427v172.13l-6.4717 3.7364h-67.223l-6.8628-3.9621z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4307-4-9-3"
|
||||||
|
style="stroke:#000000;stroke-width:1.065px;fill:#000000"
|
||||||
|
d="m1981.7 531.87v334.34h42.601v-334.15z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4819-5-7-6"
|
||||||
|
style="stroke:#000000;stroke-width:1.065px;fill:#ffffff"
|
||||||
|
d="m2029.8 527.31v345.75h-18.258v171.92l7.5614 4.3655h65.849l6.9046-3.9865v-172.49h-17.745v-345.56z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4307-7-6-4-6"
|
||||||
|
style="stroke:#000000;stroke-width:1.065px;fill:#000000"
|
||||||
|
d="m2081.4 531.32v334.34h42.601v-334.15z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4841-0-8-1"
|
||||||
|
style="stroke:#000000;stroke-width:1.065px;fill:#ffffff"
|
||||||
|
d="m2130 527.31v345.59h-34.427v172.13l7.7442 4.471h65.412l7.4136-4.2801v-517.91z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4873-1-8-1"
|
||||||
|
style="stroke:#000000;stroke-width:1.065px;fill:#ffffff"
|
||||||
|
d="m2179.8 527.31v517.32l8.3498 4.8209h65.345l6.8121-3.9332v-172.35h-37.339v-345.86z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4307-7-0-2-2-7"
|
||||||
|
style="stroke:#000000;stroke-width:1.065px;fill:#000000"
|
||||||
|
d="m2228.1 531.32v334.34h42.6v-334.15z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4307-7-4-6-1-1"
|
||||||
|
style="stroke:#000000;stroke-width:1.0606px;fill:#000000"
|
||||||
|
d="m2323.9 531.3v332.94h42.422v-332.75z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4307-7-08-1-4-8"
|
||||||
|
style="stroke:#000000;stroke-width:1.0606px;fill:#000000"
|
||||||
|
d="m2419.2 531.3v332.94h42.422v-332.75z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4907-8-8-9"
|
||||||
|
style="stroke:#000000;stroke-width:1.065px;fill:#ffffff"
|
||||||
|
d="m2275.8 527.31v345.46h-11.834v172.4l6.8211 3.9382h66.201l6.6943-3.8647v-172.48h-24.983v-345.46z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4909-2-0-1"
|
||||||
|
style="stroke:#000000;stroke-width:1.0606px;fill:#ffffff"
|
||||||
|
d="m2371.5 527.3v344.14h-23.435v171.28l7.8393 4.5263h65.413l7.055-4.0736v-172h-14.153v-343.87z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4911-0-9-1"
|
||||||
|
style="stroke:#000000;stroke-width:1.0606px;fill:#ffffff"
|
||||||
|
d="m2466.7 527.3v344.14h-36.024v171.68l7.453 4.3029h65.531l7.2019-4.158v-515.97z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4305-5-0"
|
||||||
|
style="stroke:#000000;stroke-width:1.0606px;fill:#ffffff"
|
||||||
|
d="m2513.5 527.36h45.531v343.9h34.282v171.41l-6.4444 3.7209h-66.941l-6.8338-3.9457z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4307-4-95"
|
||||||
|
style="stroke:#000000;stroke-width:1.0606px;fill:#000000"
|
||||||
|
d="m2566.6 531.39v332.94h42.422v-332.75z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4819-5-3"
|
||||||
|
style="stroke:#000000;stroke-width:1.0606px;fill:#ffffff"
|
||||||
|
d="m2614.5 526.85v344.3h-18.181v171.2l7.5299 4.3472h65.573l6.8759-3.9694v-171.77h-17.671v-344.11z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4307-7-6-5"
|
||||||
|
style="stroke:#000000;stroke-width:1.0606px;fill:#000000"
|
||||||
|
d="m2665.9 530.85v332.94h42.422v-332.75z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4841-0-9"
|
||||||
|
style="stroke:#000000;stroke-width:1.0606px;fill:#ffffff"
|
||||||
|
d="m2714.3 526.85v344.14h-34.282v171.41l7.7118 4.4527h65.138l7.3825-4.2625v-515.75z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4873-1-6"
|
||||||
|
style="stroke:#000000;stroke-width:1.0606px;fill:#ffffff"
|
||||||
|
d="m2763.9 526.85v515.15l8.3147 4.8005h65.071l6.7834-3.9166v-171.63h-37.182v-344.41z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4307-7-0-2-8"
|
||||||
|
style="stroke:#000000;stroke-width:1.0606px;fill:#000000"
|
||||||
|
d="m2812 530.85v332.94h42.422v-332.75z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4307-7-4-6-8"
|
||||||
|
style="stroke:#000000;stroke-width:1.0606px;fill:#000000"
|
||||||
|
d="m2907.4 530.85v332.94h42.422v-332.75z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4307-7-08-1-0"
|
||||||
|
style="stroke:#000000;stroke-width:1.0606px;fill:#000000"
|
||||||
|
d="m3002.7 530.85v332.94h42.422v-332.75z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4907-8-1"
|
||||||
|
style="stroke:#000000;stroke-width:1.0606px;fill:#ffffff"
|
||||||
|
d="m2859.5 526.85v344.01h-11.785v171.68l6.7926 3.9216h65.924l6.6663-3.8489v-171.75h-24.879v-344.01z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4909-2-6"
|
||||||
|
style="stroke:#000000;stroke-width:1.0606px;fill:#ffffff"
|
||||||
|
d="m2955 526.85v344.14h-23.435v171.28l7.8392 4.5263h65.413l7.055-4.0734v-172h-14.153v-343.87z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4911-0-8"
|
||||||
|
style="stroke:#000000;stroke-width:1.0606px;fill:#ffffff"
|
||||||
|
d="m3050.2 526.85v344.14h-36.023v171.68l7.4531 4.3034h65.531l7.202-4.1584v-515.97z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4305-5-4-5"
|
||||||
|
style="stroke:#000000;stroke-width:1.0606px;fill:#ffffff"
|
||||||
|
d="m3097.9 527.16h45.532v343.9h34.282v171.41l-6.4448 3.7209h-66.941l-6.8339-3.9459z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4307-4-9-0"
|
||||||
|
style="stroke:#000000;stroke-width:1.0606px;fill:#000000"
|
||||||
|
d="m3151.1 531.19v332.94h42.422v-332.75z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4819-5-7-62"
|
||||||
|
style="stroke:#000000;stroke-width:1.0606px;fill:#ffffff"
|
||||||
|
d="m3199 526.65v344.3h-18.181v171.2l7.5297 4.3471h65.573l6.876-3.9695v-171.77h-17.671v-344.11z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4307-7-6-4-8"
|
||||||
|
style="stroke:#000000;stroke-width:1.0606px;fill:#000000"
|
||||||
|
d="m3250.4 530.64v332.94h42.422v-332.75z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4841-0-8-9"
|
||||||
|
style="stroke:#000000;stroke-width:1.0606px;fill:#ffffff"
|
||||||
|
d="m3298.8 526.65v344.14h-34.282v171.41l7.712 4.4526h65.138l7.3825-4.2625v-515.75z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4873-1-8-8"
|
||||||
|
style="stroke:#000000;stroke-width:1.0606px;fill:#ffffff"
|
||||||
|
d="m3348.4 526.65v515.15l8.3145 4.8005h65.071l6.7834-3.9167v-171.63h-37.182v-344.41z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4307-7-0-2-2-4"
|
||||||
|
style="stroke:#000000;stroke-width:1.0606px;fill:#000000"
|
||||||
|
d="m3396.5 530.64v332.94h42.422v-332.75z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4307-7-4-6-1-8"
|
||||||
|
style="stroke:#000000;stroke-width:1.0606px;fill:#000000"
|
||||||
|
d="m3491.9 530.64v332.94h42.422v-332.75z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4307-7-08-1-4-2"
|
||||||
|
style="stroke:#000000;stroke-width:1.0606px;fill:#000000"
|
||||||
|
d="m3587.2 530.64v332.94h42.422v-332.75z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4907-8-8-0"
|
||||||
|
style="stroke:#000000;stroke-width:1.0606px;fill:#ffffff"
|
||||||
|
d="m3444 526.65v344.01h-11.785v171.68l6.7927 3.9214h65.924l6.6662-3.8486v-171.75h-24.879v-344.01z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4909-2-0-4"
|
||||||
|
style="stroke:#000000;stroke-width:1.0606px;fill:#ffffff"
|
||||||
|
d="m3539.5 526.65v344.14h-23.435v171.28l7.8392 4.5262h65.413l7.0552-4.0734v-172h-14.153v-343.87z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4911-0-9-0"
|
||||||
|
style="stroke:#000000;stroke-width:1.0606px;fill:#ffffff"
|
||||||
|
d="m3634.7 526.65v344.14h-36.023v171.68l7.4532 4.3031h65.531l7.2024-4.1583v-515.97z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4305-5-7-7"
|
||||||
|
style="stroke:#000000;stroke-width:1.0606px;fill:#ffffff"
|
||||||
|
d="m3681.7 527.46h45.531v343.9h34.283v171.41l-6.4447 3.7207h-66.941l-6.834-3.9455z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4307-4-7-5"
|
||||||
|
style="stroke:#000000;stroke-width:1.0606px;fill:#000000"
|
||||||
|
d="m3734.9 531.5v332.94h42.422v-332.75z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4819-5-0-7"
|
||||||
|
style="stroke:#000000;stroke-width:1.0606px;fill:#ffffff"
|
||||||
|
d="m3782.8 526.95v344.3h-18.181v171.2l7.5298 4.3473h65.573l6.8758-3.9695v-171.77h-17.671v-344.11z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4307-7-6-0-2"
|
||||||
|
style="stroke:#000000;stroke-width:1.0606px;fill:#000000"
|
||||||
|
d="m3834.2 530.95v332.94h42.422v-332.75z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4841-0-7-6"
|
||||||
|
style="stroke:#000000;stroke-width:1.0606px;fill:#ffffff"
|
||||||
|
d="m3882.6 526.95v344.14h-34.282v171.41l7.712 4.4524h65.138l7.3827-4.2623v-515.75z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4873-1-81-9"
|
||||||
|
style="stroke:#000000;stroke-width:1.0606px;fill:#ffffff"
|
||||||
|
d="m3932.2 526.95v515.15l8.3146 4.8004h65.072l6.7832-3.9167v-171.63h-37.182v-344.41z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4307-7-0-2-5-3"
|
||||||
|
style="stroke:#000000;stroke-width:1.0606px;fill:#000000"
|
||||||
|
d="m3980.3 530.95v332.94h42.422v-332.75z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4307-7-4-6-3-3"
|
||||||
|
style="stroke:#000000;stroke-width:1.0606px;fill:#000000"
|
||||||
|
d="m4075.7 530.95v332.94h42.422v-332.75z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4307-7-08-1-7-2"
|
||||||
|
style="stroke:#000000;stroke-width:1.0606px;fill:#000000"
|
||||||
|
d="m4171 530.95v332.94h42.422v-332.75z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4907-8-5-8"
|
||||||
|
style="stroke:#000000;stroke-width:1.0606px;fill:#ffffff"
|
||||||
|
d="m4027.8 526.95v344.01h-11.785v171.68l6.7923 3.9218h65.924l6.6661-3.8488v-171.75h-24.878v-344.01z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4909-2-06-2"
|
||||||
|
style="stroke:#000000;stroke-width:1.0606px;fill:#ffffff"
|
||||||
|
d="m4123.3 526.95v344.14h-23.435v171.28l7.8395 4.526h65.413l7.0548-4.0734v-172h-14.153v-343.87z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4911-0-2-1"
|
||||||
|
style="stroke:#000000;stroke-width:1.0606px;fill:#ffffff"
|
||||||
|
d="m4218.5 526.95v344.14h-36.023v171.68l7.4529 4.3028h65.531l7.2021-4.1579v-515.97z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
id="path4305-5-4-9-6"
|
||||||
|
style="stroke:#000000;stroke-width:1.0606px;fill:#ffffff"
|
||||||
|
d="m4266.2 527.26h79.814v515.31l-6.4447 3.7205h-66.941l-6.8341-3.9456z"
|
||||||
|
inkscape:export-ydpi="170.04636"
|
||||||
|
sodipodi:nodetypes="ccccccc"
|
||||||
|
inkscape:export-filename="/files1/data/projects/EducationalGames/musicmaster/graphics/piano-keyboard.png"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
inkscape:export-xdpi="170.04636"
|
||||||
|
/>
|
||||||
|
</g
|
||||||
|
>
|
||||||
|
<metadata
|
||||||
|
>
|
||||||
|
<rdf:RDF
|
||||||
|
>
|
||||||
|
<cc:Work
|
||||||
|
>
|
||||||
|
<dc:format
|
||||||
|
>image/svg+xml</dc:format
|
||||||
|
>
|
||||||
|
<dc:type
|
||||||
|
rdf:resource="http://purl.org/dc/dcmitype/StillImage"
|
||||||
|
/>
|
||||||
|
<cc:license
|
||||||
|
rdf:resource="http://creativecommons.org/licenses/publicdomain/"
|
||||||
|
/>
|
||||||
|
<dc:publisher
|
||||||
|
>
|
||||||
|
<cc:Agent
|
||||||
|
rdf:about="http://openclipart.org/"
|
||||||
|
>
|
||||||
|
<dc:title
|
||||||
|
>Openclipart</dc:title
|
||||||
|
>
|
||||||
|
</cc:Agent
|
||||||
|
>
|
||||||
|
</dc:publisher
|
||||||
|
>
|
||||||
|
<dc:title
|
||||||
|
>Standard 88-key Piano Keyboard</dc:title
|
||||||
|
>
|
||||||
|
<dc:date
|
||||||
|
>2011-02-14T04:42:21</dc:date
|
||||||
|
>
|
||||||
|
<dc:description
|
||||||
|
>Standard 88-key piano keyboard. Distance between octaves is approximately 165 mm, per http://en.wikipedia.org/wiki/Musical_keyboard. Relative key dimensions similar to some commercial electric pianos.</dc:description
|
||||||
|
>
|
||||||
|
<dc:source
|
||||||
|
>https://openclipart.org/detail/118225/standard-88-key-piano-keyboard-by-markroth8</dc:source
|
||||||
|
>
|
||||||
|
<dc:creator
|
||||||
|
>
|
||||||
|
<cc:Agent
|
||||||
|
>
|
||||||
|
<dc:title
|
||||||
|
>markroth8</dc:title
|
||||||
|
>
|
||||||
|
</cc:Agent
|
||||||
|
>
|
||||||
|
</dc:creator
|
||||||
|
>
|
||||||
|
<dc:subject
|
||||||
|
>
|
||||||
|
<rdf:Bag
|
||||||
|
>
|
||||||
|
<rdf:li
|
||||||
|
>keyboard</rdf:li
|
||||||
|
>
|
||||||
|
<rdf:li
|
||||||
|
>piano</rdf:li
|
||||||
|
>
|
||||||
|
</rdf:Bag
|
||||||
|
>
|
||||||
|
</dc:subject
|
||||||
|
>
|
||||||
|
</cc:Work
|
||||||
|
>
|
||||||
|
<cc:License
|
||||||
|
rdf:about="http://creativecommons.org/licenses/publicdomain/"
|
||||||
|
>
|
||||||
|
<cc:permits
|
||||||
|
rdf:resource="http://creativecommons.org/ns#Reproduction"
|
||||||
|
/>
|
||||||
|
<cc:permits
|
||||||
|
rdf:resource="http://creativecommons.org/ns#Distribution"
|
||||||
|
/>
|
||||||
|
<cc:permits
|
||||||
|
rdf:resource="http://creativecommons.org/ns#DerivativeWorks"
|
||||||
|
/>
|
||||||
|
</cc:License
|
||||||
|
>
|
||||||
|
</rdf:RDF
|
||||||
|
>
|
||||||
|
</metadata
|
||||||
|
>
|
||||||
|
</svg
|
||||||
|
>
|
||||||
|
After Width: | Height: | Size: 40 KiB |
67
html/assets/scripts/midi.js
Normal file
67
html/assets/scripts/midi.js
Normal file
|
|
@ -0,0 +1,67 @@
|
||||||
|
// prepare svg object for later use
|
||||||
|
var keyboard = document.getElementById("piano");
|
||||||
|
var svgDoc; // loaded keyboard svg
|
||||||
|
var keysB = [2,5,7,10,12,14,17,19,22,24,26,29,31,34,36,38,41,43,46,48,50,53,55,58,60,62,65,67,70,72,74,77,79,82,84,86]
|
||||||
|
|
||||||
|
window.addEventListener("load", function() {
|
||||||
|
svgDoc = keyboard.contentDocument;
|
||||||
|
console.log("image loaded");
|
||||||
|
}, false)
|
||||||
|
|
||||||
|
// press or unpress keyboard button
|
||||||
|
function setKeyState(note, state) {
|
||||||
|
let key = svgDoc.getElementById(String(note));
|
||||||
|
console.log(key);
|
||||||
|
if (state) {
|
||||||
|
key.style.fill = "red";
|
||||||
|
} else if (keysB.includes(note)) {
|
||||||
|
key.style.fill = "black";
|
||||||
|
} else {
|
||||||
|
key.style.fill = "white";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// Check if browser supports MIDI
|
||||||
|
if (navigator.requestMIDIAccess) {
|
||||||
|
console.log('This browser supports WebMIDI!');
|
||||||
|
} else {
|
||||||
|
console.log('WebMIDI is not supported in this browser.');
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// Attempt to establish a connection to the MIDI device
|
||||||
|
navigator.requestMIDIAccess()
|
||||||
|
.then(onMIDISuccess, onMIDIFailure);
|
||||||
|
|
||||||
|
function onMIDISuccess(midiAccess) {
|
||||||
|
console.log(midiAccess);
|
||||||
|
|
||||||
|
for (var input of midiAccess.inputs.values()) {
|
||||||
|
input.onmidimessage = getMIDIMessage;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function onMIDIFailure() {
|
||||||
|
console.log('Could not access your MIDI devices.');
|
||||||
|
}
|
||||||
|
|
||||||
|
function getMIDIMessage(midiMessage) {
|
||||||
|
var command = midiMessage.data[0];
|
||||||
|
var note = midiMessage.data[1] - 20; // sorry midi standard
|
||||||
|
var velocity = (midiMessage.data.length > 2) ? midiMessage.data[2] : 0;
|
||||||
|
|
||||||
|
if (command == 144){
|
||||||
|
console.log(note);
|
||||||
|
if (velocity == 0) {
|
||||||
|
setKeyState(note, false);
|
||||||
|
} else {
|
||||||
|
setKeyState(note, true);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
if (command == 144 && velocity != 0) {
|
||||||
|
|
||||||
|
} else if (command == 144 && velocity == 0)
|
||||||
|
console.log(command,note,velocity);
|
||||||
|
}
|
||||||
10
html/index.html
Normal file
10
html/index.html
Normal file
|
|
@ -0,0 +1,10 @@
|
||||||
|
<head>
|
||||||
|
<title>MidiTrainer</title>
|
||||||
|
<link rel="stylesheet" href="assets/css/reset.css">
|
||||||
|
<link rel="stylesheet" href="assets/css/base.css">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div class="container">
|
||||||
|
<object id="piano" data="assets/img/piano-keyboard.svg" type="image/svg+xml" width="100%" height="300"type="image/svg+xml"></object>
|
||||||
|
<script src="assets/scripts/midi.js"></script>
|
||||||
|
</body>
|
||||||
Loading…
Reference in a new issue