replace waterfall default button with svg

This commit is contained in:
Jakob Ketterl 2021-05-16 00:22:11 +02:00
parent 2190fd7c5a
commit 31a30532a7
3 changed files with 127 additions and 1 deletions

View File

@ -13,6 +13,7 @@
<g id="speaker" stroke="#fff"><path d="M33.5 7.15 16.74 25.201H2.65v31.7h16.041L33.5 72.848z" fill="#fff" stroke-width="2.1"/><g fill="none"><path d="M46.336 16.041A20 30 0 0 1 54.3 40a20 30 0 0 1-7.964 23.959" stroke-width="3"/><path d="M52.716 9.652A30.6 38 0 0 1 64.9 40a30.6 38 0 0 1-12.184 30.348" stroke-width="4.2"/><path d="M59.035 2.065A41.1 47.5 0 0 1 75.4 40a41.1 47.5 0 0 1-16.365 37.935" stroke-width="5.4"/></g></g> <g id="speaker" stroke="#fff"><path d="M33.5 7.15 16.74 25.201H2.65v31.7h16.041L33.5 72.848z" fill="#fff" stroke-width="2.1"/><g fill="none"><path d="M46.336 16.041A20 30 0 0 1 54.3 40a20 30 0 0 1-7.964 23.959" stroke-width="3"/><path d="M52.716 9.652A30.6 38 0 0 1 64.9 40a30.6 38 0 0 1-12.184 30.348" stroke-width="4.2"/><path d="M59.035 2.065A41.1 47.5 0 0 1 75.4 40a41.1 47.5 0 0 1-16.365 37.935" stroke-width="5.4"/></g></g>
<g id="speaker-muted"><path d="M33.5 7.15 16.74 25.201H2.65v31.7h16.041L33.5 72.848z" fill="#fff" stroke="#fff" stroke-width="2.1"/></g> <g id="speaker-muted"><path d="M33.5 7.15 16.74 25.201H2.65v31.7h16.041L33.5 72.848z" fill="#fff" stroke="#fff" stroke-width="2.1"/></g>
<g id="waterfall-auto"><path d="M33.512 72.05s3.393-64.129 8.24-64.093c4.48.034 4.392 28.286 9.98 28.198 4.775-.074 5.279-13.721 6.33-17.88 1.013-4.004 2.915-5.172 5.321-4.894 2.993.346 8.205 5.925 10.588 13.761 4.16 13.677 5.53 44.907 5.53 44.907z" fill="#ccc" stroke="#ccc"/><path d="M29.3 68.8 18.4 54 7.5 68.8zM7.5 11.2 18.4 26l10.9-14.8zM18.4 26v28" fill="#fff" stroke="#fff" stroke-width="7.5"/></g> <g id="waterfall-auto"><path d="M33.512 72.05s3.393-64.129 8.24-64.093c4.48.034 4.392 28.286 9.98 28.198 4.775-.074 5.279-13.721 6.33-17.88 1.013-4.004 2.915-5.172 5.321-4.894 2.993.346 8.205 5.925 10.588 13.761 4.16 13.677 5.53 44.907 5.53 44.907z" fill="#ccc" stroke="#ccc"/><path d="M29.3 68.8 18.4 54 7.5 68.8zM7.5 11.2 18.4 26l10.9-14.8zM18.4 26v28" fill="#fff" stroke="#fff" stroke-width="7.5"/></g>
<g id="waterfall-default"><path d="M36.356 75.295s3.187-34.502 7.74-34.482c4.207.018 4.125 15.218 9.374 15.171 4.485-.04 4.958-7.382 5.945-9.62.951-2.154 2.738-2.782 4.998-2.632 2.812.186 7.707 3.187 9.945 7.403 3.906 7.358 5.193 24.16 5.193 24.16z" fill="#ccc" stroke="#ccc" stroke-width=".711"/><path d="M18.4 25.424v29.075m-10.9 0L18.4 69.3l10.9-14.801zm10.9-43.875L7.5 25.425h21.801z" fill="#fff" stroke="#fff" stroke-width="7.5"/></g>
<g id="squelch" fill="#fff" stroke-width=".767"><path d="M33.333 24.7c-.058-14.132-5.913-21.9-16.58-21.9-10.145 0-16 7.673-16 20.963 0 10.575 3.305 15.722 11.884 18.343l5.913 1.872c5.797 1.778 7.942 4.399 7.942 9.92 0 5.71-3.246 9.172-8.521 9.172-5.913 0-9.218-4.024-9.508-11.324H0C.521 66.345 6.724 74.3 17.506 74.3c10.899 0 17.333-8.142 17.333-22.087 0-10.762-3.362-16.378-11.188-18.81l-6.609-2.06c-6.203-1.965-8-3.93-8-8.89 0-5.148 2.782-8.423 7.304-8.423 5.507 0 8.58 3.743 8.87 10.669zM75.362 62.508C78.202 56.893 80 47.534 80 38.363c0-10.014-2.203-19.653-5.913-26.11C70.435 5.887 65.681 2.8 59.653 2.8S48.87 5.888 45.218 12.252C41.45 18.71 39.305 28.35 39.305 38.55s2.203 19.84 5.913 26.298c3.652 6.364 8.406 9.452 14.435 9.452 4.405 0 7.594-1.404 10.956-4.68l4.986 7.581L80 69.621zM64.638 46.13l-4.406 7.58 4.464 6.833c-1.391 1.123-3.246 1.778-5.101 1.778C52.638 62.321 48 52.869 48 38.549c0-14.412 4.58-23.771 11.652-23.771s11.652 9.358 11.652 23.864c0 5.615-.638 10.67-1.913 14.787z"/></g> <g id="squelch" fill="#fff" stroke-width=".767"><path d="M33.333 24.7c-.058-14.132-5.913-21.9-16.58-21.9-10.145 0-16 7.673-16 20.963 0 10.575 3.305 15.722 11.884 18.343l5.913 1.872c5.797 1.778 7.942 4.399 7.942 9.92 0 5.71-3.246 9.172-8.521 9.172-5.913 0-9.218-4.024-9.508-11.324H0C.521 66.345 6.724 74.3 17.506 74.3c10.899 0 17.333-8.142 17.333-22.087 0-10.762-3.362-16.378-11.188-18.81l-6.609-2.06c-6.203-1.965-8-3.93-8-8.89 0-5.148 2.782-8.423 7.304-8.423 5.507 0 8.58 3.743 8.87 10.669zM75.362 62.508C78.202 56.893 80 47.534 80 38.363c0-10.014-2.203-19.653-5.913-26.11C70.435 5.887 65.681 2.8 59.653 2.8S48.87 5.888 45.218 12.252C41.45 18.71 39.305 28.35 39.305 38.55s2.203 19.84 5.913 26.298c3.652 6.364 8.406 9.452 14.435 9.452 4.405 0 7.594-1.404 10.956-4.68l4.986 7.581L80 69.621zM64.638 46.13l-4.406 7.58 4.464 6.833c-1.391 1.123-3.246 1.778-5.101 1.778C52.638 62.321 48 52.869 48 38.549c0-14.412 4.58-23.771 11.652-23.771s11.652 9.358 11.652 23.864c0 5.615-.638 10.67-1.913 14.787z"/></g>
</defs> </defs>
</svg> </svg>

Before

Width:  |  Height:  |  Size: 11 KiB

After

Width:  |  Height:  |  Size: 12 KiB

View File

@ -145,7 +145,9 @@
<svg viewBox="0 0 80 80"><use xlink:href="static/gfx/svg-defs.svg#squelch"></use></svg> <svg viewBox="0 0 80 80"><use xlink:href="static/gfx/svg-defs.svg#squelch"></use></svg>
</div> </div>
<input title="Squelch" class="openwebrx-squelch-slider openwebrx-panel-slider" type="range" min="-150" max="0" value="-150" step="1"> <input title="Squelch" class="openwebrx-squelch-slider openwebrx-panel-slider" type="range" min="-150" max="0" value="-150" step="1">
<div title="Set waterfall colors to default" id="openwebrx-waterfall-colors-default" class="openwebrx-button" onclick="waterfallColorsDefault()"><span class="sprite sprite-waterfall-default openwebrx-sliderbtn-img"></span></div> <div title="Set waterfall colors to default" id="openwebrx-waterfall-colors-default" class="openwebrx-button openwebrx-slider-button" onclick="waterfallColorsDefault()">
<svg viewBox="0 0 80 80"><use xlink:href="static/gfx/svg-defs.svg#waterfall-default"></use></svg>
</div>
<input title="Waterfall maximum level" id="openwebrx-waterfall-color-max" class="openwebrx-panel-slider" type="range" min="-200" max="100" value="50" step="1" onchange="updateWaterfallColors(1);" oninput="updateVolume()"> <input title="Waterfall maximum level" id="openwebrx-waterfall-color-max" class="openwebrx-panel-slider" type="range" min="-200" max="100" value="50" step="1" onchange="updateWaterfallColors(1);" oninput="updateVolume()">
</div> </div>
<div class="openwebrx-panel-line"> <div class="openwebrx-panel-line">

View File

@ -0,0 +1,123 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
width="80"
height="80"
viewBox="0 0 80 80"
version="1.1"
id="svg2431"
sodipodi:docname="openwebrx-waterfall-default.svg"
inkscape:version="1.0.2 (e86c870879, 2021-01-15, custom)">
<defs
id="defs2425" />
<sodipodi:namedview
id="base"
pagecolor="#000000"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageopacity="0"
inkscape:pageshadow="2"
inkscape:zoom="15.482556"
inkscape:cx="31.598969"
inkscape:cy="49.488518"
inkscape:document-units="px"
inkscape:current-layer="layer1"
inkscape:document-rotation="0"
showgrid="false"
units="px"
inkscape:pagecheckerboard="true"
inkscape:window-width="2560"
inkscape:window-height="1381"
inkscape:window-x="0"
inkscape:window-y="348"
inkscape:window-maximized="1" />
<metadata
id="metadata2428">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<g
inkscape:groupmode="layer"
id="layer3"
inkscape:label="original image"
style="display:inline">
<image
width="80"
height="71.287132"
preserveAspectRatio="none"
xlink:href="data:image/png;base64,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
"
id="image4964"
x="0"
y="4.3564358"
style="display:none" />
</g>
<g
inkscape:label="Layer 1"
inkscape:groupmode="layer"
id="layer1"
style="display:inline">
<path
style="display:inline;fill:#cccccc;fill-opacity:1;stroke:#cccccc;stroke-width:0.710862px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
d="m 36.355781,75.294569 c 0,0 3.187436,-34.501741 7.739164,-34.48213 4.207984,0.01818 4.125594,15.217675 9.375029,15.170794 4.484633,-0.04008 4.957615,-7.382141 5.945092,-9.619511 0.950801,-2.154242 2.738036,-2.78266 4.997592,-2.632998 2.811564,0.18622 7.706697,3.187908 9.944848,7.403527 3.906574,7.358113 5.193423,24.160318 5.193423,24.160318 z"
id="path3226"
sodipodi:nodetypes="cssssscc" />
<path
id="path4973"
style="display:inline;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:7.5;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
d="M 18.400391,25.424 V 54.499 M 7.5,54.499 18.400391,69.299781 29.300781,54.499 Z M 18.400391,10.623704 7.5,25.424485 h 21.800781 z" />
</g>
</svg>

After

Width:  |  Height:  |  Size: 5.9 KiB