User:Poccil/f1.html

&lt;html&gt; &lt;head&gt; &lt;title&gt;Klunky Schematic Drawing&lt;/title&gt; &lt;script src=&quot;svg.js&quot;&gt;&lt;/script&gt; &lt;style&gt; .labelselected{ position:absolute; border:black 1px solid; background-color:transparent; font-size:12px; font-family:Helvetica,Arial,sans-serif; } .label{ position:absolute; background-color:transparent; font-size:12px; font-family:Helvetica,Arial,sans-serif; } &lt;/style&gt; &lt;script&gt; &lt;!--

var img=[] var obname var IMGWIDTH=21 var IMGHEIGHT=15 var IMGSIZE=40 var imgdims=IMGWIDTH*IMGHEIGHT var k=0 for (var i=0; i&lt;IMGHEIGHT; i++) { for (var j=0; j&lt;IMGWIDTH; j++) { img[k++]=&quot;0&quot; } }

function basename(x){ if(x.lastIndexOf(&quot;/&quot;)&gt;=0){ x=x.substr(x.lastIndexOf(&quot;/&quot;)+1) } if(x.lastIndexOf(&quot;.&quot;)&gt;=0){ x=x.substr(0,x.lastIndexOf(&quot;.&quot;)) } return x }

function get(ob) { document.images[0].src = ob.src; } function put(ob) { ob.src = document.images[0].src; } function row4(s) { a = s.split(&#x27;,&#x27;); for (i=0; i&lt;a.length; i++) { document.images[46+i].src = a[i] + &quot;.jpg&quot;; } } function rs { s = &quot;r24,r13,r24v,r13v,r124,r123,r234,r134,&quot;; s = s + &quot;bridge3,bridge4,bridge1,bridge2,r45a,r45b,0&quot;; row4(s); } function cs { s = &quot;c24,c13,c24v,c13v,cp24,cp31,cp42,cp13,&quot; s = s + &quot;0,0,0,0,0,0,0&quot;; row4(s); } function lsa { s = &quot;l24,l234,l34,l32,l24i,l234i,l34i,&quot; s = s + &quot;l32i,0,0,0,0,0,0,0&quot; row4(s); } function lsb { s = &quot;l13,l134,l14,l43,l31i,l134i,l41i,&quot; s = s + &quot;l43i,0,0,0,0,0,0,0&quot; row4(s); } function lsc { s = &quot;l42,l124,l12,l41,l42i,l124i,l12i,&quot; s = s + &quot;l14i,0,0,0,0,0,0,0&quot; row4(s); } function lsd { s = &quot;l31,l123,l23,l21,l13i,l123i,l23i,&quot; s = s + &quot;l21i,0,0,0,0,0,0,0&quot; row4(s); } function ts { s = &quot;pri24,sec24,sec124,&quot; s = s + &quot;pri24i,sec24i,sec124i,&quot; s = s + &quot;pri24a,pri24b,pri24c,sec24a,sec24b,sec24c,0,0,0&quot; row4(s); } function tsa { s = &quot;pri24,pri24a,pri24b,&quot; s = s + &quot;pri24c,pri24i,t34i,&quot; s = s + &quot;t24bi,t32i,0,0,0,0,0,0,0&quot; row4(s); } function ds { s = &quot;d13,d24,d31,d42,d45a,d45b,d45c,d45d,&quot;; s += &quot;bridge3,bridge4,bridge1,bridge2,0,0,0&quot;; row4(s); } function zeners { s = &quot;zener13,zener24,zener31,zener42,0,0,0,0,&quot;; s += &quot;0,0,0,0,0,0,0&quot;; row4(s); } function leds { s = &quot;led13,led24,led31,led42,optoa,optob,0,0,&quot;; s += &quot;0,0,0,0,0,0,0&quot;; row4(s); } function npns { s = &quot;npn234,npn341,npn412,npn123,npn214,npn143,npn432,npn321,&quot;; s += &quot;0,0,0,0,0,0,0&quot;; row4(s); } function pnps { s = &quot;pnp234,pnp341,pnp412,pnp123,pnp214,pnp143,pnp432,pnp321,&quot;; s += &quot;0,0,0,0,0,0,0&quot;; row4(s); } function mfets { s = &quot;emfetn1,emfetn2,emfetn3,emfetn4,0,0,0,0,&quot;; s += &quot;0,0,0,0,0,0,0&quot;; row4(s); } function amps { s = &quot;spdtc,amp,opamp,ampn,opampn,0,0,0,&quot;; s += &quot;0,0,0,0,0,0,0&quot;; row4(s); } function tubes { s = &quot;triode,tubebase,tetrode,pentode,pentoder,triodef,tetrodef,pentodef,&quot;; s += &quot;cathode1,cathode3,cathode4,filament,diodeff,ddiodeff,0&quot;; row4(s); } function tubesflipped { s = &quot;ftriode,ftubebase,ftetrode,fpentode,fpentoder,ftriodef,ftetrodef,fpentodef,&quot;; s += &quot;fcathode1,fcathode3,fcathode4,filament,diodeff,ddiodeff,0&quot;; row4(s); } function moretubes { s = &quot;triodeff,tetrodeff,pentodeff,fpentodeff,&quot;; s += &quot;ftetrodeff,ftriodeff,tubeff,triodefff,tetrodefff,pentodefff,&quot; s += &quot;ftriodefff,ftetrodefff,fpentodefff,tubefff,0&quot;; row4(s); } function gates { s = &quot;gater24,nand,nor,not,&quot;; s += &quot;xor,and,or,diagonal123,diagonal134,0,&quot; s += &quot;0,0,0,4,f4&quot;; row4(s); } function boxes { s = &quot;box1,box2,box3,box4,box12,box23,box34,box14,&quot;; s = s + &quot;box123,box234,box134,box124,box13,box24,box1234&quot;; row4(s); } function bus { s = &quot;bus12,bus23,bus34,bus14,bus124,busf124,&quot; s += &quot;busf234,bus234,&quot; s += &quot;busf134,bus134,bus123,busf123,0,0,bus223&quot; row4(s) } function busbus { s = &quot;bus112,bus1124,busf1124,bus114,&quot; s += &quot;bus233,bus2334,busf2334,bus334,&quot; s += &quot;bus344,busf1344,bus1344,bus144,bus122,busf1223,bus1223&quot; row4(s) } function misc { s = &quot;label,left,right,bubble1,bubble2,bubble3,bubble4,0,&quot;; s = s + &quot;copper,vpad,hpad,rv,rh,mhg2,0&quot;; row4(s); } function pcb { s = &quot;pcbpad,pcb13,pcb24,pcb12,pcb23,pcb34,pcb14,&quot; s += &quot;pcb123,pcb234,pcb134,pcb124,&quot; s += &quot;pcbich,pcbicv,0,0&quot; row4(s); } function left { for (i=0; i&lt;imgdims-1; i++) { document.images[&quot;canv&quot;+i].src = document.images[&quot;canv&quot;+(i+1)].src; }   document.images[&quot;canv&quot;+i].src = &quot;0.jpg&quot;; MoveAllLabels(-IMGSIZE,0) } function right { for (i=imgdims-1; i&gt;0; i--) { document.images[&quot;canv&quot;+i].src = document.images[&quot;canv&quot;+(i-1)].src; }   document.images[&quot;canv&quot;+i].src = &quot;0.jpg&quot;; MoveAllLabels(IMGSIZE,0) } function up { for (i=0; i&lt;imgdims-IMGWIDTH; i++) { document.images[&quot;canv&quot;+i].src = document.images[&quot;canv&quot;+(i+IMGWIDTH)].src; }   for (j=0; j&lt;IMGWIDTH; j++) { document.images[&quot;canv&quot;+(i++)].src = &quot;0.jpg&quot;; }   MoveAllLabels(0,-IMGSIZE) } function down { for (i=imgdims-1; i&gt;=IMGWIDTH; i--) { document.images[&quot;canv&quot;+i].src = document.images[&quot;canv&quot;+(i-IMGWIDTH)].src; }   for (i=0; i&lt;IMGWIDTH; i++) { document.images[&quot;canv&quot;+i].src = &quot;0.jpg&quot;; }   MoveAllLabels(0,IMGSIZE) }

function TextDims(o) { var dims=[0,0] if (document.layers){ dims[0] = o.document.width; dims[1] = o.document.height; } else if (document.all||document.getElementById) { dims[0] = o.clientWidth; dims[1] = o.clientHeight; } return dims } function CanvasDims{ var canvas=document.getElementById(&quot;canvas&quot;) return [canvas.offsetLeft,canvas.offsetTop, canvas.offsetLeft+canvas.offsetWidth, canvas.offsetTop+canvas.offsetHeight] }

function htmlescape(x){ return x.replace(/\&amp;/g,&quot;&amp;amp;&quot;) .replace(/\&lt;/g,&quot;&amp;lt;&quot;) .replace(/\&gt;/g,&quot;&amp;gt;&quot;) .replace(/\&quot;/g,&quot;&amp;quot;&quot;) .replace(/\&#x27;/g,&quot;&amp;#x27;&quot;) }

function display { var framesdoc=document var displaywindow = window.open(&quot;&quot;,&quot;Display&quot;,&quot;resizable=yes,status=yes,scrollbars=yes&quot;); with (displaywindow.document) { var ox=0,oy=0 var canvas=document.getElementById(&quot;canvas&quot;) open(&quot;text/html&quot;); writeln(&quot;&lt;html&gt;&lt;head&gt;&lt;title&gt;Klunky Schematic Generated&lt;/title&gt;&quot;); writeln(&quot;&lt;/head&gt;&lt;body&gt;&lt;pre&gt;&quot;); k = 0; var xmin=0,ymin=0,xmax=0,ymax=0,first=1 for (var i=0; i&lt;IMGHEIGHT; i++) { for (var j=0; j&lt;IMGWIDTH; j++) { var bn=basename(framesdoc.images[&quot;canv&quot;+(k++)].src) if(svg[&quot;_&quot;+bn]){ if(first){ xmin=j*40 xmax=j*40+40 ymin=i*40 ymax=i*40+40 first=0 } else { xmin=Math.min(xmin,j*40) ymin=Math.min(ymin,i*40) xmax=Math.max(xmax,j*40+40) ymax=Math.max(ymax,i*40+40) }      }      }    }    for(var i=0;i&lt;maxlabel;i++){ var lab=document.getElementById(&quot;label&quot;+i) if(lab&amp;&amp;lab.innerText){ var dims=TextDims(lab) var x=((lab.style.pixelLeft-canvas.offsetLeft)*40/37) var y=((lab.style.pixelTop+dims[1]-canvas.offsetTop)*40/37) var x2=(x+dims[0]*40/37) var y2=(y+dims[1]*40/37) if(first){ xmin=Math.min(x,x2) xmax=Math.max(x,x2) ymin=Math.min(y,y2) ymax=Math.max(y,y2) first=0 } else { xmin=Math.min(xmin,Math.min(x,x2)) xmax=Math.max(xmax,Math.max(x,x2)) ymin=Math.min(ymin,Math.min(y,y2)) ymax=Math.max(ymax,Math.max(y,y2)) }    }    }    writeln(&quot;&amp;lt;svg xmlns:svg=&#x27;http://www.w3.org/2000/svg&#x27;  xmlns=&#x27;http://www.w3.org/2000/svg&#x27; &quot;                +&quot;width=&#x27;&quot;+(xmax-xmin+40)+&quot;&#x27; height=&#x27;&quot;+(ymax-ymin+40)+&quot;&#x27;&amp;gt;&quot;) k=0 for (var i=0; i&lt;IMGHEIGHT; i++) { for (var j=0; j&lt;IMGWIDTH; j++) { var bn=basename(framesdoc.images[&quot;canv&quot;+k++].src) //     writeln(&quot;[&quot;+bn+&quot;,&quot;+framesdoc.images[&quot;canv&quot;+m].src+&quot;]&quot;) if(svg[&quot;_&quot;+bn]){ var s=svg[&quot;_&quot;+bn] writeln(&#x27;&amp;lt;g transform=&quot;translate(&#x27;+(j*40+20-xmin)+&#x27;,&#x27;+(i*40+20-ymin)+&#x27;)&quot;&amp;gt;&#x27;); for(var m=0;m&lt;s.length;m++){ var fill=(s[m][4])?&quot;fill:black;&quot;:&quot;fill:none;&quot; var stroke=(s[m][5])?&quot;stroke:black;stroke-width:1;&quot;:&quot;stroke:none;&quot; if(s[m][0]==&quot;path&quot;){ writeln(&#x27;&amp;lt;path d=&quot;&#x27;+s[m][1]+&#x27;&quot; style=&quot;&#x27;+fill+stroke+&#x27;&quot; /&amp;gt;&#x27;) }        if(s[m][0]==&quot;circle&quot;){ writeln(&#x27;&amp;lt;circle cx=&quot;&#x27;+s[m][1]+&#x27;&quot; cy=&quot;&#x27;+s[m][2]+&#x27;&quot; r=&quot;&#x27;+s[m][3]+&#x27;&quot; style=&quot;&#x27;+fill+stroke+&#x27;&quot; /&amp;gt;&#x27;) }       }        writeln(&quot;&amp;lt;/g&amp;gt;&quot;); }     }    }    for(var i=0;i&lt;maxlabel;i++){ var lab=document.getElementById(&quot;label&quot;+i) var px=12*40/37 if(lab&amp;&amp;lab.innerText&amp;&amp;typeof lab.innerText!=&quot;undefined&quot;){ var dims=TextDims(lab) var x=((lab.style.pixelLeft-canvas.offsetLeft)*40/37)+20-xmin var y=((lab.style.pixelTop+dims[1]-canvas.offsetTop)*40/37)+20-ymin writeln(&#x27;&amp;lt;text style=&quot;font-family:Helvetica,Arial,sans-serif;font-size:&#x27;+px+&#x27;px;&quot; &#x27;              +&#x27;x=&quot;&#x27;+x+&#x27;&quot; y=&quot;&#x27;+y+&#x27;&quot;&amp;gt;&#x27;+htmlescape(htmlescape(lab.innerText))+&#x27;&amp;lt;/text&amp;gt;&#x27;) }   }    writeln(&quot;&amp;lt;/svg&amp;gt;&quot;); writeln(&quot;&lt;/pre&gt;&quot;); writeln(&quot;&lt;/body&gt;&quot;); writeln(&quot;&lt;/html&gt;&quot;); close; } displaywindow.focus } // Sets cookie values. Expiration date is optional // function setCookie(name, value, expire) { document.cookie = name + &quot;=&quot; + escape(value) + ((expire == null) ? &quot;&quot; : (&quot;; expires=&quot; + expire.toGMTString)) } function getCookie(Name) { var search = Name + &quot;=&quot; if (document.cookie.length &gt; 0) { // if there are any cookies offset = document.cookie.indexOf(search) if (offset != -1) { // if cookie exists offset += search.length // set index of beginning of value end = document.cookie.indexOf(&quot;;&quot;, offset) // set index of end of cookie value if (end == -1) end = document.cookie.length return unescape(document.cookie.substring(offset, end)) } }  return(&quot;&quot;); }

function getschem{ var displaywindow=window.open(&quot;&quot;,&quot;Schematic&quot;,&quot;resizable=yes,status=yes,scrollbars=yes&quot;); var sch=schem var d=displaywindow.document d.open(&quot;text/html&quot;); d.writeln(&quot;&lt;html&gt;&lt;head&gt;&lt;title&gt;Klunky Schematic Generated&lt;/title&gt;&quot;); d.writeln(&quot;&lt;/head&gt;&lt;body&gt;&lt;pre&gt;&quot;); d.writeln(sch[0]) d.writeln(sch[1]) d.writeln(&quot;&lt;/pre&gt;&lt;/body&gt;&lt;/html&gt;&quot;) d.close }

function loadsch(w,v){ v=v.replace(/\s+$/,&quot;&quot;).replace(/^\s+/,&quot;&quot;) v=v.split(&quot;\n&quot;) if(v.length==0||v.length&gt;2){ alert(&quot;Failed to load schematic.&quot;) return } v[0]=v[0].replace(/\s+$/,&quot;&quot;).replace(/^\s+/,&quot;&quot;) if(v.length==2)v[1]=v[1].replace(/\s+$/,&quot;&quot;).replace(/^\s+/,&quot;&quot;) else v[1]=&quot;&quot; recallschem(v[0],v[1]) w.close }

function loadschem{ var displaywindow=window.open(&quot;&quot;,&quot;LoadSchem&quot;,&quot;resizable=yes,status=yes,scrollbars=yes,width=400,height=300&quot;); var sch=schem var d=displaywindow.document d.open(&quot;text/html&quot;); d.writeln(&quot;&lt;html&gt;&lt;head&gt;&lt;title&gt;Load Schematic&lt;/title&gt;&quot;); d.writeln(&quot;&lt;/head&gt;&lt;body&gt;&lt;form&gt;&quot;) d.writeln(&quot;Enter schematic data to load (similar to data in \&quot;schematic\&quot; link):&lt;br/&gt;&quot;) d.writeln(&quot;&lt;textarea name=&#x27;sch&#x27; cols=&#x27;40&#x27; rows=&#x27;9&#x27;&gt;&lt;/textarea&gt;&lt;br/&gt;&quot;); d.writeln(&quot;&lt;input type=&#x27;button&#x27; value=&#x27;Load&#x27; onclick=&#x27;opener.loadsch(self,this.form.sch.value)&#x27;/&gt;&quot;); d.writeln(&quot;&lt;/form&gt;&lt;/body&gt;&lt;/html&gt;&quot;) d.close }

var savename=&quot;f1save&quot;; var savedays = 30;

function save{ var ret=schem var today = new Date var expires = new Date expires.setTime(today.getTime + 60*60*24*savedays) setCookie(&quot;f1save&quot;,ret[0],expires) setCookie(&quot;f1savelabel&quot;,ret[1],expires) }

function schem { var ret=[] k = 0; s1 = &quot;&quot;; for (i=0; i&lt;IMGWIDTH; i++) { for (j=0; j&lt;IMGHEIGHT; j++) { s2 = document.images[&quot;canv&quot;+k++].src + &quot;,&quot;; l = s2.lastIndexOf(&#x27;/&#x27;); if (l &gt; 0) { s2 = s2.substring(l+1,s2.length); }       if (s2 == &quot;0.jpg,&quot;) { s2 = &quot;,&quot;; }       s1 += s2      } }   ret[0]=s1 s1=&quot;&quot; var canvas=document.getElementById(&quot;canvas&quot;) for(var i=0;i&lt;maxlabel;i++){ var lab=document.getElementById(&quot;label&quot;+i) if(lab&amp;&amp;lab.innerText){ var dims=TextDims(lab) var x=lab.style.pixelLeft-canvas.offsetLeft var y=lab.style.pixelTop-canvas.offsetTop if(s1!=&quot;&quot;)s1+=&quot;&#x27;&quot; s1+=x+&quot;&#x27;&quot;+y+&quot;&#x27;&quot;+htmlescape(lab.innerText) }   }    ret[1]=s1 return ret } var recallname=&quot;f1save&quot;; function recall { recallschem(getCookie(&quot;f1save&quot;),getCookie(&quot;f1savelabel&quot;)) }

function clear{ var k=0 for (i=0; i&lt;IMGWIDTH; i++) { for (j=0; j&lt;IMGHEIGHT; j++) { document.images[&quot;canv&quot;+(k++)].src = &quot;0.jpg&quot;; } } for(var i=0;i&lt;maxlabel;i++){ var lab=document.getElementById(&quot;label&quot;+i) if(lab) lab.innerHTML=&quot;&quot; } maxlabel=0 }

function recallschem(a,b){ s1 = a;   if (s1.length &gt; 0) { k = 0; s2 = s1.split(&quot;,&quot;); for (i=0; i&lt;IMGWIDTH; i++) { for (j=0; j&lt;IMGHEIGHT; j++) { s1 = s2[k]; if (s1 == &quot;&quot;) { s1 = &quot;0.jpg&quot;; }         document.images[&quot;canv&quot;+(k++)].src = s1; }     }    }    s1 = b;    var canvas=document.getElementById(&quot;canvas&quot;) s2=s1.split(&quot;&#x27;&quot;) maxlabel=0 for(var i=0;i&lt;s2.length;i+=3){ var x=parseFloat(s2[i])+canvas.offsetLeft var y=parseFloat(s2[i+1])+canvas.offsetTop SetLabel2(maxlabel,s2[i+2],x,y) maxlabel++ } }

var maxlabel=0

function getPageX(o) {var x=0; if(document.layers) x=o.pageX;else {while(eval(o)){x+=o.offsetLeft; o=o.offsetParent; } } return x; }; function getPageY(o) { var y=0; if(document.layers) y=o.pageY; else { while(eval(o)) { y+=o.offsetTop; o=o.offsetParent; } } return y; };

function getScrollX(o,d){ if(!d)d=document; return getPageX(o)-d.body.scrollLeft; } function getScrollY(o,d){ if(!d)d=document; return getPageX(o)-d.body.scrollTop; }

function SelectLabel{ var e=event.srcElement if(e==GetSelectedLabel){ var labeltext=prompt(&quot;Enter new text for the label&quot;,e.innerText) if(labeltext!=null){ e.innerHTML=htmlescape(labeltext) } } for(var i=0;i&lt;maxlabel;i++){ var lbl=document.getElementById(&quot;label&quot;+i) if(lbl&amp;&amp;lbl.id==e.id){ lbl.className=&quot;labelselected&quot; } else if(lbl){ lbl.className=&quot;label&quot; } } }

function GetSelectedLabel{ for(var i=0;i&lt;maxlabel;i++){ var lbl=document.getElementById(&quot;label&quot;+i) if(lbl&amp;&amp;lbl.className==&quot;labelselected&quot;){ return lbl } } return null }

function MoveLabel(o,x,y){ dims=TextDims(o) x-=dims[0]/2 y-=dims[1]/2 if(typeof o.style.pixelLeft!=&quot;undefined&quot;)o.style.pixelLeft=x; else o.style.left=x if(typeof o.style.pixelTop!=&quot;undefined&quot;)o.style.pixelTop=y; else o.style.top=y o.style.zIndex=3 }

function MoveAllLabels(ox,oy){ var dims=CanvasDims for(var i=0;i&lt;maxlabel;i++){ var o=document.getElementById(&quot;label&quot;+i) if(o){ o.style.pixelLeft+=ox; o.style.pixelTop+=oy; if(o.style.pixelLeft&lt;dims[0]||o.style.pixelTop&lt;dims[1]   ||o.style.pixelLeft&gt;dims[2]||o.style.pixelTop&gt;dims[3]){ o.innerHTML=&quot;&quot; //moved too far } } } }

function DeleteLabel{ var label=GetSelectedLabel if(label){ label.innerHTML=&quot;&quot; } }

function SetLabel2(i,name,x,y){ var o=document.getElementById(&quot;label&quot;+i) if(!o){ var lab=document.getElementById(&quot;labels&quot;) lab.innerHTML+=&#x27;&lt;div id=&quot;label&#x27;+i+&#x27;&quot;&gt;&lt;/div&gt;&#x27; o=document.getElementById(&quot;label&quot;+i) o.className=&quot;label&quot; } o.innerHTML=name if(typeof o.style.pixelLeft!=&quot;undefined&quot;)o.style.pixelLeft=x; else o.style.left=x if(typeof o.style.pixelTop!=&quot;undefined&quot;)o.style.pixelTop=y; else o.style.top=y o.style.zIndex=3 document.onclick=SelectLabel }

function SetLabel(i,name,x,y){ var o=document.getElementById(&quot;label&quot;+i) if(!o){ var lab=document.getElementById(&quot;labels&quot;) lab.innerHTML+=&#x27;&lt;div id=&quot;label&#x27;+i+&#x27;&quot;&gt;&lt;/div&gt;&#x27; o=document.getElementById(&quot;label&quot;+i) o.className=&quot;label&quot; } o.innerHTML=htmlescape(name) MoveLabel(o,x,y) document.onclick=SelectLabel maxlabel=Math.max(i+1,maxlabel) }

function AddLabel{ var i var lbl=GetSelectedLabel var xrel=event.clientX+document.body.scrollLeft var yrel=event.clientY+document.body.scrollTop if(!lbl){ for(i=0;i&lt;maxlabel;i++){ var lab=document.getElementById(&quot;labels&quot;) if(lab==null)break } var labelname=prompt(&quot;Enter text of the label&quot;,&quot;Label&quot;) if(labelname){ SetLabel(i,labelname,xrel,yrel) } } else { MoveLabel(lbl,xrel,yrel) lbl.className=&quot;label&quot; } }

function SetSrc(o){ var bn=basename(document.images[0].src) if(bn==&quot;label&quot;||GetSelectedLabel){ AddLabel } else { o.src=document.images[0].src } }

// --&gt; &lt;/script&gt; &lt;/head&gt; &lt;body&gt; &lt;nobr&gt; &lt;a href=&quot;../klunky/home.html&quot; target=&quot;_top&quot;&gt; Home&lt;/a&gt;&lt;br&gt; Instructions: click on the symbol you want then click where you want it.&lt;br/&gt; Current symbol is &lt;img src=&quot;r24.jpg&quot; width=&quot;37&quot; height=&quot;37&quot;&gt; &lt;table border&gt; &lt;tr&gt; &lt;td&gt;&lt;img src=&quot;0.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;12.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;23.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;13.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;123.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;234.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;term1.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;term2.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;r24.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;r124.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;c24.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;c24v.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;l24.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;a1.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;b24.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;tr&gt; &lt;td&gt;&lt;img src=&quot;1234.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;34.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;14.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;24.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;134.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;124.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;term3.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;term4.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;r13.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;r234.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;c13.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;c13v.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;l13.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;g1.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;g2.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;tr&gt; &lt;td&gt;&lt;img src=&quot;spst.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;spdta.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;spdtb.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;spdtc.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;spdtd.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;d13.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;d24.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;d31.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;d42.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;npn.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;pnp.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;jfetn.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;jfetp.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;xtal13.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;xtal24.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;tr&gt; &lt;td&gt;&lt;img src=&quot;0.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;0.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;0.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;0.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;0.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;0.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;0.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;0.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;0.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;0.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;0.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;0.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;0.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;0.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;img src=&quot;0.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;/table&gt; &lt;table border=&quot;1&quot;&gt;&lt;tr&gt; &lt;td&gt;&lt;img src=&quot;label.jpg&quot; onmouseover=&quot;status=this.src&quot; onclick=&quot;get(this)&quot;&gt; &lt;td&gt;&lt;nobr&gt;To add a label, click &quot;Label&quot; and click the spot on the canvas &lt;br/&gt; to place the label. To move a label, select the label and click &lt;br/&gt; anywhere else on the canvas. To change a label&#x27;s text, select &lt;br/&gt; the label and click it again.&lt;/nobr&gt;&lt;/td&gt; &lt;/tr&gt;&lt;/table&gt; &lt;/nobr&gt; &lt;nobr&gt; &lt;a href=&quot;javascript:rs&quot;&gt;R&#x27;s&lt;/a&gt; &lt;a href=&quot;javascript:cs&quot;&gt;C&#x27;s&lt;/a&gt; &lt;a href=&quot;javascript:lsa&quot;&gt;L&#x27;s &gt;&lt;/a&gt; &lt;a href=&quot;javascript:lsb&quot;&gt;L&#x27;s ^&lt;/a&gt; &lt;a href=&quot;javascript:lsc&quot;&gt;L&#x27;s &lt;&lt;/a&gt; &lt;a href=&quot;javascript:lsd&quot;&gt;L&#x27;s v&lt;/a&gt; &lt;a href=&quot;javascript:ts&quot;&gt;T&#x27;s&lt;/a&gt; &lt;a href=&quot;javascript:tsa&quot;&gt;T&#x27;s &gt;&lt;/a&gt; &lt;a href=&quot;javascript:ds&quot;&gt;D&#x27;s&lt;/a&gt; &lt;a href=&quot;javascript:zeners&quot;&gt;zeners&#x27;s&lt;/a&gt; &lt;a href=&quot;javascript:leds&quot;&gt;LED&#x27;s&lt;/a&gt; &lt;a href=&quot;javascript:npns&quot;&gt;NPN&#x27;s&lt;/a&gt; &lt;a href=&quot;javascript:pnps&quot;&gt;PNP&#x27;s&lt;/a&gt; &lt;br/&gt; &lt;a href=&quot;javascript:mfets&quot;&gt;MOSFET&#x27;s&lt;/a&gt; &lt;a href=&quot;javascript:amps&quot;&gt;Amps&lt;/a&gt; &lt;a href=&quot;javascript:tubes&quot;&gt;Tubes&lt;/a&gt; &lt;a href=&quot;javascript:tubesflipped&quot;&gt;flip Tubes&lt;/a&gt; &lt;a href=&quot;javascript:moretubes&quot;&gt;more Tubes&lt;/a&gt; &lt;a href=&quot;javascript:gates&quot;&gt;Gates&lt;/a&gt; &lt;a href=&quot;javascript:boxes&quot;&gt;boxes&lt;/a&gt; &lt;a href=&quot;javascript:bus&quot;&gt;bus&lt;/a&gt; &lt;a href=&quot;javascript:busbus&quot;&gt;busbus&lt;/a&gt; &lt;a href=&quot;javascript:misc&quot;&gt;misc.&lt;/a&gt; &lt;a href=&quot;javascript:pcb&quot;&gt;pcb&lt;/a&gt; &lt;br/&gt; &lt;a href=&quot;javascript:left&quot; title=&quot;Move schematic to the left&quot;&gt;left&lt;/a&gt; &lt;a href=&quot;javascript:right&quot; title=&quot;Move schematic to the right&quot;&gt;right&lt;/a&gt; &lt;a href=&quot;javascript:up&quot; title=&quot;Move schematic up&quot;&gt;up&lt;/a&gt; &lt;a href=&quot;javascript:down&quot; title=&quot;Move schematic down&quot;&gt;down&lt;/a&gt; &lt;a href=&quot;javascript:clear&quot; title=&quot;Clear the canvas&quot;&gt;clear&lt;/a&gt; &lt;a href=&quot;javascript:display&quot; title=&quot;Generate SVG for this schematic&quot;&gt;generate SVG&lt;/a&gt; &lt;a href=&quot;javascript:save&quot; title=&quot;Save schematic to browser&#x27;s cookie&quot;&gt;save&lt;/a&gt; &lt;a href=&quot;javascript:recall&quot; title=&quot;Load schematic from browser&#x27;s cookie&quot;&gt;recall&lt;/a&gt; &lt;a href=&quot;javascript:getschem&quot; title=&quot;Get data for this schematic&quot;&gt;schematic&lt;/a&gt; &lt;a href=&quot;javascript:loadschem&quot; title=&quot;Load schematic from data&quot;&gt;load&lt;/a&gt; &lt;br/&gt; Originally written by &lt;a href=&quot;mailto:wd9eyb@arrl.net&quot;&gt;wd9eyb@arrl.net&lt;/a&gt;; new version by Peter O. &lt;hr /&gt; &lt;/nobr&gt; &lt;script&gt; &lt;!-- function writecanvas(cx,cy){ document.write(&#x27;&lt;table id=&quot;canvas&quot; border=&quot;0&quot; cellpadding=&quot;0&quot; cellspacing=&quot;0&quot;&gt;&#x27;) for(var i=0;i&lt;cy;i++){ document.write(&#x27;&lt;tr&gt;&#x27;) for(var j=0;j&lt;cx;j++){ document.write(&#x27;&lt;td&gt;&lt;img src=&quot;0.jpg&quot; name=&quot;canv&#x27;+(i*cx+j)+&#x27;&quot; onclick=&quot;SetSrc(this)&quot; width=&quot;37&quot; height=&quot;37&quot;&gt;&lt;/td&gt;&#x27;) }   document.write(&#x27;&lt;/tr&gt;&#x27;) } document.write(&#x27;&lt;/table&gt;&#x27;) } writecanvas(IMGWIDTH,IMGHEIGHT) // --&gt; &lt;/script&gt; &lt;div id=&quot;labels&quot;&gt;&lt;/div&gt; &lt;hr /&gt; &lt;/body&gt; &lt;/html&gt;