mirror of https://github.com/nealey/vail.git
Make the little icon orange when rx is happening.
I am a fan of subtle notifications, so the color doesn't flash like an rx light. Closes #49
This commit is contained in:
parent
9df4c09229
commit
2b52bc5d29
Binary file not shown.
|
After Width: | Height: | Size: 4.9 KiB |
|
|
@ -0,0 +1,156 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg
|
||||
xmlns:bx="https://boxy-svg.com"
|
||||
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:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
viewBox="0 0 500 500"
|
||||
version="1.1"
|
||||
id="svg37"
|
||||
sodipodi:docname="vail-rx.svg"
|
||||
inkscape:version="1.0.2 (e86c870879, 2021-01-15)">
|
||||
<metadata
|
||||
id="metadata41">
|
||||
<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>
|
||||
<sodipodi:namedview
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1"
|
||||
objecttolerance="10"
|
||||
gridtolerance="10"
|
||||
guidetolerance="10"
|
||||
inkscape:pageopacity="0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:window-width="1295"
|
||||
inkscape:window-height="808"
|
||||
id="namedview39"
|
||||
showgrid="false"
|
||||
inkscape:zoom="1.102"
|
||||
inkscape:cx="107.57784"
|
||||
inkscape:cy="249.56755"
|
||||
inkscape:window-x="19"
|
||||
inkscape:window-y="13"
|
||||
inkscape:window-maximized="0"
|
||||
inkscape:current-layer="g11" />
|
||||
<defs
|
||||
id="defs5">
|
||||
<mask
|
||||
id="mask-0">
|
||||
<rect
|
||||
x="234.28"
|
||||
y="129.248"
|
||||
width="247.019"
|
||||
height="167.227"
|
||||
style="fill: rgb(255, 255, 255);"
|
||||
id="rect2" />
|
||||
</mask>
|
||||
</defs>
|
||||
<g
|
||||
style=""
|
||||
transform="matrix(0.95245, 0, 0, 1.139872, 6.889973, -7.454849)"
|
||||
id="g11">
|
||||
<path
|
||||
d="M 327.185 337.24 L 360.06 463.215 L 214.596 463.215 L 327.185 337.24 Z"
|
||||
style="fill:#ffa500;fill-opacity:1"
|
||||
transform="matrix(0.859836, -0.51057, 0.51057, 0.859836, -104.141418, 118.932152)"
|
||||
bx:shape="triangle 214.596 337.24 145.464 125.975 0.774 0 1@97556a29"
|
||||
id="path7" />
|
||||
<rect
|
||||
x="24.773"
|
||||
y="44.071"
|
||||
width="460.948"
|
||||
height="294.539"
|
||||
style="fill:#ffa500;fill-opacity:1"
|
||||
rx="66.036"
|
||||
ry="66.036"
|
||||
id="rect9" />
|
||||
</g>
|
||||
<path
|
||||
style="fill: rgb(216, 216, 216); stroke: rgb(0, 0, 0);"
|
||||
d="M 296.4 154.545"
|
||||
id="path13" />
|
||||
<g
|
||||
transform="matrix(1.584063, 0, 0, 1.70527, -312.019287, -153.773422)"
|
||||
style="mask: url(#mask-0);"
|
||||
mask="url(#mask-0)"
|
||||
id="g35">
|
||||
<rect
|
||||
x="43.405"
|
||||
y="231.448"
|
||||
width="284.629"
|
||||
height="38.553"
|
||||
style="fill: rgb(255, 255, 255);"
|
||||
rx="7.898"
|
||||
ry="7.898"
|
||||
id="rect15" />
|
||||
<path
|
||||
d="M 55.235 167.548 L 306.103 167.548 L 308.543 167.548 L 310.582 168.864 L 360.729 201.228 L 448.168 201.228 L 448.168 217.228 L 434.05 217.228 L 358.289 217.228 L 355.848 217.228 L 353.809 215.912 L 303.663 183.548 L 55.235 183.548 L 55.235 167.548 Z"
|
||||
style="fill: rgb(255, 255, 255);"
|
||||
id="path17" />
|
||||
<rect
|
||||
x="412.367"
|
||||
y="179.765"
|
||||
width="32.602"
|
||||
height="27.855"
|
||||
style="fill: rgb(255, 255, 255);"
|
||||
id="rect19" />
|
||||
<path
|
||||
d="M 383.813 153.485 C 388.547 139.021 466.546 139.043 472.225 153.485 C 477.511 166.926 445.092 184.036 445.092 184.036 L 412.726 184.036 C 412.726 184.036 379.124 167.804 383.813 153.485 Z"
|
||||
style="stroke-linejoin: round; fill: rgb(255, 255, 255);"
|
||||
id="path21" />
|
||||
<path
|
||||
d="M 257.196 232.936 L 280.351 232.936 L 273.245 196.76 L 264.768 196.76 L 257.196 232.936 Z"
|
||||
style="fill: rgb(255, 255, 255);"
|
||||
id="path23" />
|
||||
<rect
|
||||
x="119.534"
|
||||
y="151.839"
|
||||
width="36.544"
|
||||
height="98.388"
|
||||
style="fill: rgb(255, 255, 255);"
|
||||
rx="10.068"
|
||||
ry="10.068"
|
||||
id="rect25" />
|
||||
<rect
|
||||
x="265.233"
|
||||
y="170.764"
|
||||
width="7.081"
|
||||
height="19.702"
|
||||
style="fill: rgb(255, 255, 255);"
|
||||
id="rect27" />
|
||||
<rect
|
||||
y="201.262"
|
||||
width="16.756"
|
||||
height="33.909"
|
||||
style="fill: rgb(255, 255, 255);"
|
||||
x="61.162"
|
||||
id="rect29" />
|
||||
<rect
|
||||
x="66"
|
||||
y="163.211"
|
||||
width="7.081"
|
||||
height="31.292"
|
||||
style="fill: rgb(255, 255, 255);"
|
||||
id="rect31" />
|
||||
<rect
|
||||
y="156.105"
|
||||
width="16.756"
|
||||
height="8.523"
|
||||
style="fill: rgb(255, 255, 255);"
|
||||
x="61.162"
|
||||
id="rect33" />
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 4.5 KiB |
|
|
@ -165,8 +165,20 @@ class VailClient {
|
|||
document.querySelector("#keyer-rate").dispatchEvent(new Event("input"))
|
||||
}
|
||||
|
||||
setIconBase(base) {
|
||||
for (let e of document.querySelectorAll("link[rel=icon]")) {
|
||||
let ext = e.href.split(".")[1]
|
||||
e.href = `${base}.${ext}`
|
||||
}
|
||||
}
|
||||
|
||||
Buzz() {
|
||||
this.outputs.Buzz(false)
|
||||
|
||||
clearTimeout(this.activityTimeout)
|
||||
this.activityTimeout = setTimeout(() => this.setIconBase("assets/vail"), 2*time.Second)
|
||||
this.setIconBase("assets/vail-rx")
|
||||
|
||||
if (this.rxChart) this.rxChart.Set(1)
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue