<html>
<head>
<title>Klunky Schematic Drawing</title>
<script src="svg.js"></script>
<style>
.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;
}
</style>
<script>
<!--


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<IMGHEIGHT; i++) {
for (var j=0; j<IMGWIDTH; j++) {
 img[k++]="0"
}
}

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


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

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

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

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

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

var savename="f1save";
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("f1save",ret[0],expires)
 setCookie("f1savelabel",ret[1],expires)
}

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

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

function recallschem(a,b){
    s1 = a;
    if (s1.length > 0) {
      k = 0;
      s2 = s1.split(",");
      for (i=0; i<IMGWIDTH; i++) {
        for (j=0; j<IMGHEIGHT; j++) {
          s1 = s2[k];
          if (s1 == "") {
            s1 = "0.jpg";
          }
          document.images["canv"+(k++)].src = s1;
        }
      }
    }
    s1 = b;
    var canvas=document.getElementById("canvas")
    s2=s1.split("'")
    maxlabel=0
    for(var i=0;i<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("Enter new text for the label",e.innerText)
  if(labeltext!=null){
   e.innerHTML=htmlescape(labeltext)
  }
 }
 for(var i=0;i<maxlabel;i++){
  var lbl=document.getElementById("label"+i)
  if(lbl&&lbl.id==e.id){
   lbl.className="labelselected"
  } else if(lbl){
   lbl.className="label"
  }
 }
}

function GetSelectedLabel(){
 for(var i=0;i<maxlabel;i++){
  var lbl=document.getElementById("label"+i)
  if(lbl&&lbl.className=="labelselected"){
   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!="undefined")o.style.pixelLeft=x; else o.style.left=x
 if(typeof o.style.pixelTop!="undefined")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<maxlabel;i++){
  var o=document.getElementById("label"+i)
  if(o){
   o.style.pixelLeft+=ox;
   o.style.pixelTop+=oy;
   if(o.style.pixelLeft<dims[0]||o.style.pixelTop<dims[1]
    ||o.style.pixelLeft>dims[2]||o.style.pixelTop>dims[3]){
    o.innerHTML=""
    //moved too far
   }
  }
 }
}

function DeleteLabel(){
 var label=GetSelectedLabel()
 if(label){
  label.innerHTML=""
 }
}

function SetLabel2(i,name,x,y){
 var o=document.getElementById("label"+i)
 if(!o){
  var lab=document.getElementById("labels")
  lab.innerHTML+='<div id="label'+i+'"></div>' 
  o=document.getElementById("label"+i)
  o.className="label"
 }
 o.innerHTML=name
 if(typeof o.style.pixelLeft!="undefined")o.style.pixelLeft=x; else o.style.left=x
 if(typeof o.style.pixelTop!="undefined")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("label"+i)
 if(!o){
  var lab=document.getElementById("labels")
  lab.innerHTML+='<div id="label'+i+'"></div>' 
  o=document.getElementById("label"+i)
  o.className="label"
 }
 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<maxlabel;i++){
   var lab=document.getElementById("labels")
   if(lab==null)break
  }
  var labelname=prompt("Enter text of the label","Label")
  if(labelname){
   SetLabel(i,labelname,xrel,yrel)
  }
 } else {
  MoveLabel(lbl,xrel,yrel)
  lbl.className="label"  
 }
}

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

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