LIBRARY/HMIclone.svg

<svg id=svgHMI><defs><g id=PIDG><ellipse id="pidEllipse" fill="gold" stroke="#800000" stroke-width="4" cx="0" cy="0" rx="152" ry="64"/> <foreignObject class="noselect" id=foAdjust width=300 height=100 x=-120 y=-50 pointer-events="none" ><table cellpadding=0><tr><td align=center colspan=5>Tune Controller:<input type="checkbox" id=adjustControllerCheck /></td></tr><tr align=center><td>SP:<input disabled style="margin-right: 0px;margin-left: 0px;" type="radio" name=tuneRadio id=tuneSPClick /></td><td>P:<input style="margin-right: 0px;margin-left: 0px;"disabled type="radio" name=tuneRadio id=tunePClick/></td><td>I:<input disabled title="turn off Integral" id=turnOffIntegralCheck type="checkbox" checked style="margin-right: 0px;margin-left: 0px;" /><input style="margin-right: 0px;margin-left: 0px;" disabled type="radio" name=tuneRadio id=tuneIClick/></td><td>D:<input disabled title="turn off Derivative" id=turnOffDerivativeCheck type="checkbox" checked style="margin-right: 0px;margin-left: 0px;" /><input style="margin-right: 0px;margin-left: 0px;" disabled type="radio" name=tuneRadio id=tuneDClick/></td><td>CO:<input disabled type="radio" style="margin-right: 0px;margin-left: 0px;" name=tuneRadioid=tuneCOClick/></td></tr><tr align=center><td><input type="text" style=width:40px id=tuneSPValue value=100.0 /></td><td ><input type="text" style=width:40px id=tunePValue value=0.5 /></td><td><input type="text" style=width:40px id=tuneIValue value=0.05 /></td><td><input type="text" style=width:40px id=tuneDValue value=3 /></td><td><input type="text" style=width:40px id=tuneCOValue value=0 /></td></tr><tr><td align=center colspan=5><TABLE><TR><TD><button disabled style=padding:0;width:30px;height:30px><img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAIAAACRXR/mAAAACXBIWXMAABJ0AAASdAHeZh94AAAEXElEQVR4nM2ZW2gcVRjHT5KZvaQz23lw14Umbujig5bMRKglIWWX0sb6IG0JghKSiAi2EYsiKfYhSGtWvBViNguKCQgiqagI2ZZgagnONEF68TIbwb5s6gRix13B052TvWTSxIfZ7mU6e8vu7OTPPnxzzpzZH9/3zZxzvtOwtbUFdp4ajQbQFlbleJbjIIR8KJTbyNA0RVFej2fbj23YRhAFQZj+bvqHhTkhsmKy4ngzhltx3Io3mZruy/fluCwnNuSEvB6XXY7Hnj14tO/5PpfLpSMWy3Eff3bhtvgn6STMhLmcISmUkkTUQrSeHz5Xvv/KxRIE4aXTL0dBhHQSZT5aJUlEduAYHx1jGKY2WG+MvHk1dHXbQCq4I/SRcd8nVWFBCE8M9lbjJE2yZrTrx+/nKIoqdE+xDwSEsKf3aG2ZAACkk4gTa13PdPM8X+iegt5SmOLEWm2ZMpJEFAujhVlW8yXVxtKbKUNWKJraQTx1ZkhvJvAgmv2vDT7cpYE1Ewwu/bOkN5Mi0kncQcv+iQlVuzqIEML27o493c46MGW0uiiqkkztLX8gYHPXw0+5srmJt31nc1vysCCEkxen6hO+XJFO4lb4liAI2liGuEoR6SQ+8l/IXObl1hMH9u3uII2gAgCAyG/R5Zthxc56i+f5lCVpEBIAADSSjSzHpe1M69z8FStlMQgJAABIJ/HNzLeKncW6duOaZbeRWGbC/MfykmJnse7c/Qu34gYhpbUSXVGM7Fo+vrlGgOYiY/5l/2urcO37sFBbrEiviTCpsUom1uDAwDsjI1Vidb7aWaTXvMvEcpzX40kHkeU4YxNLkYlMe2uH7hPTWAxNJ++ljEUBAKwjWTHSuUVRVAImis+GHMe96/PpjLWuvFXZlG9YLxFQ1BabXbmsK1YKpZTlTRal1dEqJ2Rd/7WkHrHZFSOLRT/ebmx6yQnZvWevYmexDnsPJ2DCICQAAEjeSx3qPKTYeQubvU+7HU/ZDaICkdvRX4O/KLugvDTv7jiYQobF8cmWfZmdWR7W8OtvSSIyAglIIjpzajhzmYfFMEwL0Vp3JAAAsANHbplJ/a0aHx2rv8MkEZ0fPpfbosZiGKbL3VVPMklE7Y+2qypyGjWI+hQgMkyb4tbPVxZVZQiNCYeiqKmxz2PhejgsFkZfT06XWxphGOarT7/8+/e7ujJJInrv7KhmzbLg9Oz1eHynfauLok55Jomov6d/cGBAs7dEkZLn+ef6jtvcRG2LlLEwCrzvP37sWKF7SixmGIZZmGXtwFErnymltsvTM0WYSmMBAFwu10/B+ZM9J6sMqCSi1UXxhQMv3py/XrIGXsFxAYTQHwhMXpyqNKbKicF+9/4PRz4o8zij4sMVCGHw0qWJLwLRZASzYJgZw60YZsYwC9aEN21ubMrJjY0HPzkp222O3p4TQ68MFSl31wArl4/lOD4UCoVCEMLcLoqiaJpmaNrr8VREUwMsXbVD94n/AyR35wdcDvWLAAAAAElFTkSuQmCC" alt="" width=25 height=25 /></button></TD><TD><select disabled id=incrementSelect title="Increment value"><option value="">.01</option><option value="">.10</option><option value="">.50</option> <option selected value="">1.0</option> <option value="">5.0</option> <option value="">10</option></select></TD><TD><button disabled style=padding:0;width:30px;height:30px><img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAIAAACRXR/mAAAACXBIWXMAABJ0AAASdAHeZh94AAAFR0lEQVR4nM2ZXWzTVhSAT+rYjtM0sepuizqQ+REI7SdmL9NUpnR0FO2pMMo2FVakDbFNYkhj8MCmCgT0bQKmUmk/VSVAgiJtmkaQGApQWq9MGw8bydY9dCrCZBLZINN1VsWxHTd7SJe4TurYTls4iiLnXt+Tz+fce3zuua58Pg+PntQ9bIDK4q5l8CjPI4Ri8bi+cRnLsizbGg7Xotll14mCIJz7eig6diXx912cwgkvQVA4ThFuAtNUTckoiqSqkqpkFKahaXP7pm1bu1iWXUCsUZ4/9vmxieSEP+j3+EgrQ7JTcjqZbvY1H9p/yJb9LGEJgvDWnrdTkAoE/dZV60VMphlgThw9znHc/GB90PPh9fiwYyAD3PpQ26e9x2vCQght2dFZi5EqkpFTnug3l2maNrltzgCBENq45ZX5ZQKAQNAv+7ItG1+MxWK2sQpMsi87v0xFMjzo7ti22YSsghMXlKko5t6sgNW1a/vvf40vKFORjAFmOHKtvMvoxAuRyOIwAUAg6E9Bqu/kyfKuWdZCCHHrnmPXLV0EpqIINxL8pRHDm2CWtfr6++mVAbt6V9Gr+S/5wmf3a7vtDqdXBg70fmxoLGEhhAaHBh24j8RKLyImwNgdHgj6f5n8WRCEyljOTAUARG1YAOAP+j/pO1YZ63zkvANTaapmsJamanaVeHzkZf5yBaxYLJbzqHbVAYCSUfRYTXSTklEc6HE3YBciESNWdPgKRVNOsCTVXVfKJb0eryI5eTx/0H9l9KoR6/ubY96AEyy1DKK8xYp4fOT47fHiz5kHvXPvDr3a6sQyZKGGXiWj3L/9oJC1El4CwzGLahP3E0as7LQEYIYlTv7b6G90aeDKuXDNReXrAQBcAPWwbHYkXFa/HAAgC5CFPMoDls9jkHfnActrjTmTvyB9hBGr6sTqXN95sKfH/J6CXI1G5+oKv2OWN3vqyVGeL+TWdQAwyvPOJtb8CtlQWtGP6D6xDgC4UCgjSg+bBOSp0upxAwBN0xKSzEP89VvDyY/uERhJYiSJkfpY1RoO6zdbR3p7i9e56ZysyYomy5osa3I1LLm4ema056tFZq0x91vq15nrsgChxzrz3enittZWgMhOyawBa+njSyQpg1O4lfEYjlEBigpQAHD/9gNDL07hj61osoiilyZ/6TU/M+WfWfWss+lFeImqLVZEldTlT64wYr3c2iYhR1hlBi5vsSIZUXrphVYj1qaOjmnJSaGL8BK56VLszmQzzqwlIemNzteNWADQsrYlO1VlsZQLhmP6JZYSU9bnuF7WLFmj35mVsPa9vzedTDvQqOixUMqBBjGZ3vfePn1LCYvjuGZfswOlBms50MAAYygzzdqQCYLQsWeT3dQZ+8e9fm3bjIb0nT/QhK3hYjLdt7/PDAsAdu199+bkT4uzfS0wPfXE00MDZw3tRqzFKUAUmdRk7ofoWHkZwphB0DQ9cOILNCkuNBMAoElxaOBsxdJIhcSG47jIuW8Tt/5cUCYxmT564MhcNcvK+RbHcYf3HBZuJERHIcMKU1d7147u7rluMCtSxmKxjm2b6ZWB+S1SoknxzGenzQvPZtkpx3H8pREGmPmyWaHUxl8aqVoMr5I0syw7HLm2s31njQ4Vk2nhRqLz+a03h3+0cnpg9bgAIdTX3z84NGjXpwWvbWjZcLCnx/pxhr3DFYRQ5OLFU1+dEh7cxT1unHS7KRwncdzjxnBMy2m5bE7Nqur/34yHefPV7Tu6u83L3bVi6fli8fgoz8fjcYSQvoum6VAoxIVCreGwXZpasRZaHtF94n8WVXML5FmhBgAAAABJRU5ErkJggg==" alt="" width=25 height=25 /></button></TD></TR></TABLE></td></tr></table></foreignObject></g><g id=pilotLightG><circle id=pilotLight cx="0" cy="0" r="1" fill="url(#greenGradient)" /><line style="visibility:hidden" name=lineOff x1=-.5 y1=-.5 x2=.5 y2=.5 stroke='black' stroke-width=.1 /><line style="visibility:hidden" name=lineDisabled x1=.5 y1=-.5 x2=-.5 y2=.5 stroke='black' stroke-width=.1 /><circle style="visibility:hidden" name=circleDefective cx=0 cy=0 r=.7 stroke='crimson' stroke-width=.2 fill="none" /><line style="visibility:hidden" name=lineDefective x1=-.5 y1=-.5 x2=.5 y2=.5 stroke='crimson' stroke-width=.08 /></g><g id=statusStickG ><rect x="-25" y="-130" rx="8" ry="8" stroke="black" stroke-width="2" fill="ghostwhite" width="50" height="260"></rect><line x1="0" y1="130" x2="0" y2="190" stroke="black" stroke-width="2"></line><g id="onStatusG" opacity="0.25"><circle id="pilotLightON" cx="0" cy="0" r="1" fill="url(#greenGradient)"></circle></g><g id="alarmStatusG" opacity="0.25"><circle id="pilotLightALARM" cx="0" cy="0" r="1" fill="url(#redGradient)"></circle><line name="lineAlarm" x1="-.5" y1="-.5" x2=".5" y2=".5" stroke="black" stroke-width=".1"></line></g><g id="intermittentStatusG" opacity="0.25"><circle id="pilotLightINTERMITTENT" cx="0" cy="0" r="1" fill="url(#violetGradient)"></circle></g><g id="defectiveStatusG" opacity="0.25"><circle id="pilotLightDEFECTIVE" cx="0" cy="0" r="1" fill="url(#aquaGradient)"></circle><circle name="circleDefective" cx="0" cy="0" r=".7" stroke="crimson" stroke-width=".2" fill="none"></circle><line name="lineDefective" x1="-.5" y1="-.5" x2=".5" y2=".5" stroke="crimson" stroke-width=".08"></line></g><g id="normalOffStatus" opacity="0.25"><circle id="pilotLightOFF" cx="0" cy="0" r="1" fill="url(#greyGradient)"></circle><line name="lineDisabled1" x1="-.5" y1="-.5" x2=".5" y2=".5" stroke="black" stroke-width=".1"></line><line name="lineDisabled2" x1=".5" y1="-.5" x2="-.5" y2=".5" stroke="black" stroke-width=".1"></line></g><rect x=-25 y=-150 stroke="none" fill="white" width=50 height=300 opacity=0 /></g><g id="digitalReadoutG" ><foreignObject id=digitalReadoutFO overflow="visible" x=-100 y=-40 width="200" height="80" ><div id=digitalReadoutContainerDiv style="font-family:arial;border:1px black solid;font-size:16px;overflow:hidden;width: 200px; height:80px;padding:10px;background:gainsboro;border-radius:8px;width:100%;text-align:center" ><div id=digitalReadoutTitleDiv>Digital Readout Title</div><div id=digitalReadoutValue style="font-size:14px;border:6px white inset;width:180px;background:black;color:lime;font-weight:bold; font-size:30px;" >00000.00</div><div id=digitalReadoutUnit>Units Of Measurement</div></div></foreignObject><rect id="digitalReadoutCoverRect" x="-100" y="-40" width="200" height="80" stroke="none" fill="white" fill-opacity="0" ></g><g id="offOnButtonG" ><g><defs id="onOffButtonDefs"><filter id="onOffButtonDropShadow" height="40"><feGaussianBlur in="SourceAlpha" stdDeviation="10"/><feOffset dx="6" dy="10" result="offsetblur"/><feMerge><feMergeNode/><feMergeNode in="SourceGraphic"/></feMerge></filter><linearGradient id="linearGradientOnOffButton"><stop style="stop-color:#000000;stop-opacity:0" offset="0" /><stop style="stop-color:#000000;stop-opacity:0.5" offset="1" /></linearGradient><linearGradient id="linearGradientOnOffButton2"><stop style="stop-color:#ffffff;stop-opacity:1" offset="0" /><stop style="stop-color:#ffffff;stop-opacity:0" offset="1" /></linearGradient><linearGradient x1="120" y1="10" x2="120" y2="50" id="linearGradientOnOffButtonHighlight" xlink:href="#linearGradientOnOffButton2" gradientUnits="userSpaceOnUse" /><radialGradient cx="120" cy="170" r="100" fx="120" fy="170" id="radialGradientOnOffButton" xlink:href="#linearGradientOnOffButton" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0,-0.72727275,2,0,-220,170)" /></defs><rect id="offOnRect" fill="red" width="220" height="80" ry="40" x="10" y="10" id="ButtonBase" style="stroke:none" filter="url(#onOffButtonDropShadow)" /><rect width="220" height="80" ry="40" x="10" y="10" id="ButtonGlow" pointer-events="none" style="fill:url(#radialGradientOnOffButton);stroke:none" /><text x="120" y="66" id="buttonTextBG" pointer-events="none" xml:space="preserve" style="font-size:40px;text-align:center;text-anchor:middle;fill:#000000;stroke:none;font-family:Sans">OFF</text><text x="120" y="64.5" id="buttonText" pointer-events="none" xml:space="preserve" style="font-size:40px;text-align:center;text-anchor:middle;fill:#ffffff;stroke:none;font-family:Sans">OFF</text><path d="m 50,15 140,0 c 11.08,0 22.51667,10.914008 20,20 C 208.16563,41.622482 201.08,40 190,40 L 50.00005,40 C 38.92005,40 31.834332,41.622512 30,35 27.483323,25.914009 38.92,15 50,15 z" id="ButtonHighlight" pointer-events="none" style="fill:url(#linearGradientOnOffButtonHighlight)" /></g><rect fill=white opacity=0 x=0 y=0 width=220 height=80 /></g>

<g id="circuitBreakerG"> <defs> <filter id="dropShadowCB" height="40"> <feGaussianBlur in="SourceAlpha" stdDeviation="10"/> <!-- stdDeviation is how much to blur --> <feOffset dx="6" dy="10" result="offsetblur"/> <!-- how much to offset --> <feMerge><feMergeNode/> <!-- this contains the offset blurred image --><feMergeNode in="SourceGraphic"/> <!-- this contains the element that the filter is applied to --> </feMerge></filter> <radialGradient id="radialGradientGreenCB" gradientUnits="userSpaceOnUse" cx="5" cy="100" r="10%"><stop stop-color="#FFFFFF" offset="0"/><stop stop-color="green" offset="1"/></radialGradient><radialGradient id="radialGradientRedCB" gradientUnits="userSpaceOnUse" cx="5" cy="100" r="10%"><stop stop-color="#FFFFFF" offset="0"/><stop stop-color="red" offset="1"/></radialGradient> </defs><line id=disconnectLine x1=0 y1=-190 x2=-14 y2=-110 stroke="black" stroke-width="6" /><line id=disc2CBLine x1="0" y1="-120" x2=0 y2=0 stroke='black' stroke-width="8" /> <circle r="10" fill="black" stroke="black" stroke-width="1" cx=0 cy=-190 /> <circle r="5" fill="black" stroke="black" stroke-width="1" cx=-45 cy=-130 /> <circle r="10" fill="black" stroke="black" stroke-width="1" cx=0 cy=-120 /><rect id="baseCB"width="100"height="200"fill="url(#radialGradientGreenCB)"filter="url(#dropShadowCB)"stroke="black"stroke-width="3"rx="6"ry="6"x="-50"y="-50"/> <circle pointer-events="none" r="10" fill="black" stroke="black" stroke-width="1" cx=0 cy=-40 /> <circle pointer-events="none"r="5" fill="black" stroke="black" stroke-width="1" cx=-40 cy=10 /> <circle pointer-events="none" r="10" fill="black" stroke="black" stroke-width="1" cx=0 cy=30 /> <line pointer-events="none" id=lockoutCBline x1=0 y1=-40 x2=-14 y2=35 stroke="black" stroke-width="6" /><line pointer-events="none" x1=0 y1=30 x2=0 y2=85 stroke="black" stroke-width="4" /><line pointer-events="none" x1=-20 y1=85 x2=20 y2=85 stroke="black" stroke-width="4" /><line pointer-events="none"x1=-20 y1=115 x2=20 y2=115 stroke="black" stroke-width="4" /><line pointer-events="none" id=tripLine x1=-20 y1=85 x2=20 y2=115 stroke="black" stroke-width="4" /><line pointer-events="none"x1=0 y1=115 x2=0 y2=150 stroke="black" stroke-width="4" />
    <radialGradient id="redStatusGradient" cx="50%" cy="50%" r="75%"><stop offset="0%" stop-color="rgb(255,0,0)" stop-opacity="1"/><stop offset="100%" stop-color="rgb(0,0,0)" stop-opacity="1"/></radialGradient>
    <radialGradient id="greenStatusGradient" cx="50%" cy="50%" r="75%"><stop offset="0%" stop-color="rgb(0,191,0)" stop-opacity="1"/><stop offset="100%" stop-color="rgb(0,0,0)" stop-opacity="1"/></radialGradient>


    <g  id="pilotLightDisconnectStatus"  myStatus="ON" opacity="1.0" transform="translate(25,-150)scale(15)">
        <circle id="pilotLight" cx="0" cy="0" r="1" fill="url(#greenStatusGradient)"/>
        <line style="visibility:hidden" name="lineOff" x1="-.5" y1="-.5" x2=".5" y2=".5" stroke="black" stroke-width=".1"/>
    <line style="visibility:hidden" name="lineDisabled" x1=".5" y1="-.5" x2="-.5" y2=".5" stroke="black" stroke-width=".1"/>
    <circle style="visibility:hidden" name="circleDefective" cx="0" cy="0" r=".7" stroke="crimson" stroke-width=".2" fill="none"/>
    <line style="visibility:hidden" name="lineDefective" x1="-.5" y1="-.5" x2=".5" y2=".5" stroke="crimson" stroke-width=".08"/>
    </g>

    <g  id="pilotLighLockoutStatus"  myStatus="ON" opacity="1.0" transform="translate(25,0)scale(15)" >
        <circle id="pilotLight" cx="0" cy="0" r="1" fill="url(#greenStatusGradient)"/>
        <line style="visibility:hidden" name="lineOff" x1="-.5" y1="-.5" x2=".5" y2=".5" stroke="black" stroke-width=".1"/>
    <line style="visibility:hidden" name="lineDisabled" x1=".5" y1="-.5" x2="-.5" y2=".5" stroke="black" stroke-width=".1"/>
    <circle style="visibility:hidden" name="circleDefective" cx="0" cy="0" r=".7" stroke="crimson" stroke-width=".2" fill="none"/>
    <line style="visibility:hidden" name="lineDefective" x1="-.5" y1="-.5" x2=".5" y2=".5" stroke="crimson" stroke-width=".08"/>
    </g>

<rect x=-50 y=-50 width="100" height="200" stroke="none" fill=white opacity=0 /> </g>




 <g id="SubstationDigitalG"><foreignObject id=substationDigitalObjclass="noselect" width="220" height="220" ><div style="overflow:hidden;width: 220px; height:220px;padding:0px;background:grey;border-radius:20px;" ><TABLE cellpadding=0 cellspacing=0 style='border:1px solid black;padding:5px;border-radius:20px;background:silver'><TR><TD><table style=border-radius:10px;height:200px;background:gainsboro;><tr><td colspan=2 align=center style='font-weight:bold;font-size:20px;color:blue;font-family:arial'>AMPS</td> </tr><tr><td style='font-weight:bold;font-size:20px;color:blue;font-family:arial'>A</td><td><input onfocus=blur() id=valueA type="text" style='width:80px;background:black;color:lime;font-weight:bold; font-size:30px;font-family:times new roman;' value="8888" /></td></tr><tr><td style='font-weight:bold;font-size:20px;color:blue;font-family:arial'>B</td><td><input onfocus=blur() id=valueB type="text" style='width:80px;background:black;color:lime;font-weight:bold; font-size:30px;font-family:times new roman;' value="8888" /></td></tr><tr><td style='font-weight:bold;font-size:25px;color:blue;font-family:arial'>C</td><td><input onfocus=blur() id=valueC type="text" style='width:80px;background:black;color:lime;font-weight:bold; font-size:30px;font-family:times new roman;' value="8888" /></td></tr><tr><td style='font-weight:bold;font-size:25px;color:blue;font-family:arial'>N</td><td><input onfocus=blur() id=valueN type="text" style='width:80px;background:black;color:lime;font-weight:bold; font-size:30px;font-family:times new roman;' value="8888" /></td></tr></table></TD><TD><table style=border-radius:10px;height:200px;background:gainsboro;><tr><td align=center style='font-weight:bold;font-size:20px;font-family:arial'>MW<br><input onfocus=blur() id=valueMW type="text" style='width:80px;background:black;color:violet;font-weight:bold; font-size:30px;font-family:times new roman;' value="888.8" /></td></tr><tr><td align=center style='font-weight:bold;font-size:20px;font-family:arial'>MVAR<br><input onfocus=blur() id=valueMVAR type="text" style='width:80px;background:black;color:violet;font-weight:bold; font-size:30px;font-family:times new roman;' value="888.8" /></td></tr><tr><td align=center style='font-weight:bold;font-size:20px;font-family:arial'>MVA<br><input onfocus=blur() id=valueMVA type="text" style='width:80px;background:black;color:violet;font-weight:bold; font-size:30px;font-family:times new roman;' value="888.8" /></td></tr></table></TD></TR><TR><TD COLSPAN=2 ALIGN=CENTER></TD></TR></TABLE></div></foreignObject> </g><foreignObject id=vfdFO width=400 height=60 transform="translate(290,400)" > <table cellspacing=5><tr><td><input type="text" style='border:6px inset purple;background:black;color:lime;font-family:times new roman;font-weight:bold;font-size:33px;width:80px' value="81" /></td><td><input type="text" style='border:6px inset blue;background:black;color:lime;font-family:times new roman;font-weight:bold;font-size:33px;width:80px' value="46" /></td><td><input type="text" style='border:6px inset red;background:black;color:lime;font-family:times new roman;font-weight:bold;font-size:33px;width:80px' value="201" /></td></tr><tr align=center style='font-weight:bold;font-size:25px'><td style='color:purple'>CI</td><td style='color:blue'>HZ</td><td style='color:red'>VAC</td></tr> </table> </foreignObject><g id=statusPanelG ><!--used at VFD--><rect x="-25" y="-130" rx="8" ry="8" stroke="black" stroke-width="2" fill="ghostwhite" width="50" height="260"></rect><g id="onStatusG" transform="translate(0,100)scale(22)" opacity=".25"><circle id="pilotLightON" cx="0" cy="0" r="1" fill="url(#greenGradient)"></circle></g><g id="alarmStatusG" transform="translate(0,50)scale(22)" opacity=".25"><circle id="pilotLightALARM" cx="0" cy="0" r="1" fill="url(#redGradient)"></circle><line name="lineAlarm" x1="-.5" y1="-.5" x2=".5" y2=".5" stroke="black" stroke-width=".1"></line></g><g id="intermittentStatusG" transform="translate(0,0)scale(22)" opacity="1"><circle id="pilotLightINTERMITTENT" cx="0" cy="0" r="1" fill="url(#violetGradient)"></circle></g><g id="defectiveStatusG" transform="translate(0,-50)scale(22)" opacity=".25"><circle id="pilotLightDEFECTIVE" cx="0" cy="0" r="1" fill="url(#aquaGradient)"></circle><circle name="circleDefective" cx="0" cy="0" r=".7" stroke="crimson" stroke-width=".2" fill="none"></circle><line name="lineDefective" x1="-.5" y1="-.5" x2=".5" y2=".5" stroke="crimson" stroke-width=".08"></line></g><g id="normalOffStatus" transform="translate(0,-100)scale(22)" opacity=".25"><circle id="pilotLightOFF" cx="0" cy="0" r="1" fill="url(#greyGradient)"></circle><line name="lineDisabled1" x1="-.5" y1="-.5" x2=".5" y2=".5" stroke="black" stroke-width=".1"></line><line name="lineDisabled2" x1=".5" y1="-.5" x2="-.5" y2=".5" stroke="black" stroke-width=".1"></line></g><rect x=-25 y=-150 stroke="none" fill="white" width=50 height=300 opacity=0 /></g></defs>


<g id="AutoManualG">
    <foreignObject style='padding:5px;'  id="AutoManualFO" width="220" height="150">
   <div id="AutoManualDiv" class='noselect' style='padding:0px;border-radius:10px;background:skyblue;width:200px;border:3px solid blue'>
    <table style="width:100%" >
    <tr><td><input id="signalInValue"  style='border:inset 3px;font-size:110%;text-align:center;font-weight:bold;color:lime;background:black;width:100px' value="50%" type="text" /> <button style="border-radius:5px;background:lime;border:4px inset;width:80px"  id="autoButton">Auto</button></td></tr>
    <tr>
        <td>
     <svg  id="autoManualSVG" width="190" height="40"><g class="slider" transform="translate(15 20)"><line class="track" x1="0" x2="160"/><line class="track-inset" x1="0" x2="160"/><g class="ticks-automanual" transform="translate(0,18)"><text x="0" text-anchor="middle">0%</text><text x="32" text-anchor="middle">20%</text><text x="64" text-anchor="middle">40%</text><text x="96" text-anchor="middle">60%</text><text x="128" text-anchor="middle">80%</text><text x="160" text-anchor="middle">100%</text></g><circle id="dragHandle" cx="75" class="handle" fill="white" r="9"/><line class="track-overlay" x1="0" x2="160" /></g></svg>
        </td>
    </tr>
    <tr><td align=right><button style='border-radius:5px;background:darkorange;border:4px outset;width:80px'  id="manualButton">Manual</button> <input id="signalOutValue" style='border:inset 3px;font-size:110%;text-align:center;font-weight:bold;color:lime;background:black;width:100px' value="50%" type="text" /></td></tr>
    </table>
  </div>
    </foreignObject>
    <rect x='0' y='0' stroke="none" fill="white" width='200' height='150' opacity='0' />
</g>

 </svg>