Subversion Repositories wimsdev

Rev

Go to most recent revision | Details | Last modification | View Log | RSS feed

Rev Author Line No. Line
20 reyssat 1
/* ASCIIsvg.js
2
==============
3
JavaScript routines to dynamically generate Scalable Vector Graphics
4
using a mathematical xy-coordinate system (y increases upwards) and
5
very intuitive JavaScript commands (no programming experience required).
6
ASCIIsvg.js is good for learning math and illustrating online math texts.
7
Works with Internet Explorer+Adobe SVGviewer and SVG enabled Mozilla/Firefox.
8
 
9
Ver 1.2.7 Oct 13, 2005 (c) Peter Jipsen http://www.chapman.edu/~jipsen
10
Latest version at http://www.chapman.edu/~jipsen/svg/ASCIIsvg.js
11
If you use it on a webpage, please send the URL to jipsen@chapman.edu
12
 
13
This program is free software; you can redistribute it and/or modify
14
it under the terms of the GNU General Public License as published by
15
the Free Software Foundation; either version 2 of the License, or (at
16
your option) any later version.
17
 
18
This program is distributed in the hope that it will be useful,
19
but WITHOUT ANY WARRANTY; without even the implied warranty of
20
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
21
General Public License (at http://www.gnu.org/copyleft/gpl.html)
22
for more details.*/
23
 
24
var checkIfSVGavailable = true;
25
var notifyIfNoSVG = true;
26
var alertIfNoSVG = false;
27
var xunitlength = 20;  // pixels
28
var yunitlength = 20;  // pixels
29
var origin = [0,0];   // in pixels (default is bottom left corner)
30
var defaultwidth = 300; defaultheight = 200; defaultborder = 0;
31
var border = defaultborder;
32
var strokewidth, strokedasharray, stroke, fill;
33
var fontstyle, fontfamily, fontsize, fontweight, fontstroke, fontfill;
34
var markerstrokewidth = "1";
35
var markerstroke = "black";
36
var markerfill = "yellow";
37
var marker = "none";
38
var arrowfill = stroke;
39
var dotradius = 4;
40
var ticklength = 4;
41
var axesstroke = "black";
42
var gridstroke = "grey";
43
var pointerpos = null;
44
var coordinates = null;
45
var above = "above";
46
var below = "below";
47
var left = "left";
48
var right = "right";
49
var aboveleft = "aboveleft";
50
var aboveright = "aboveright";
51
var belowleft = "belowleft";
52
var belowright = "belowright";
53
var cpi = "\u03C0", ctheta = "\u03B8";
54
var pi = Math.PI, ln = Math.log, e = Math.E;
55
var arcsin = Math.asin, arccos = Math.acos, arctan = Math.atan;
56
var sec = function(x) { return 1/Math.cos(x) };
57
var csc = function(x) { return 1/Math.sin(x) };
58
var cot = function(x) { return 1/Math.tan(x) };
59
var xmin, xmax, ymin, ymax, xscl, yscl,
60
    xgrid, ygrid, xtick, ytick, initialized;
61
var isIE = document.createElementNS==null;
62
var picture, svgpicture, doc, width, height, a, b, c, d, i, n, p, t, x, y;
63
var arcsec = function(x) { return arccos(1/x) };
64
var arccsc = function(x) { return arcsin(1/x) };
65
var arccot = function(x) { return arctan(1/x) };
66
var sinh = function(x) { return (Math.exp(x)-Math.exp(-x))/2 };
67
var cosh = function(x) { return (Math.exp(x)+Math.exp(-x))/2 };
68
var tanh =
69
  function(x) { return (Math.exp(x)-Math.exp(-x))/(Math.exp(x)+Math.exp(-x)) };
70
var sech = function(x) { return 1/cosh(x) };
71
var csch = function(x) { return 1/sinh(x) };
72
var coth = function(x) { return 1/tanh(x) };
73
var arcsinh = function(x) { return ln(x+Math.sqrt(x*x+1)) };
74
var arccosh = function(x) { return ln(x+Math.sqrt(x*x-1)) };
75
var arctanh = function(x) { return ln((1+x)/(1-x))/2 };
76
var sech = function(x) { return 1/cosh(x) };
77
var csch = function(x) { return 1/sinh(x) };
78
var coth = function(x) { return 1/tanh(x) };
79
var arcsech = function(x) { return arccosh(1/x) };
80
var arccsch = function(x) { return arcsinh(1/x) };
81
var arccoth = function(x) { return arctanh(1/x) };
82
var sign = function(x) { return (x==0?0:(x<0?-1:1)) };
83
 
84
function factorial(x,n) {
85
  if (n==null) n=1;
86
  for (var i=x-n; i>0; i-=n) x*=i;
87
  return (x<0?NaN:(x==0?1:x));
88
}
89
 
90
function C(x,k) {
91
  var res=1;
92
  for (var i=0; i<k; i++) res*=(x-i)/(k-i);
93
  return res;
94
}
95
 
96
function chop(x,n) {
97
  if (n==null) n=0;
98
  return Math.floor(x*Math.pow(10,n))/Math.pow(10,n);
99
}
100
 
101
function ran(a,b,n) {
102
  if (n==null) n=0;
103
  return chop((b+Math.pow(10,-n)-a)*Math.random()+a,n);
104
}
105
 
106
function myCreateElementXHTML(t) {
107
  if (isIE) return document.createElement(t);
108
  else return document.createElementNS("http://www.w3.org/1999/xhtml",t);
109
}
110
 
111
function isSVGavailable() {
112
  var nd = myCreateElementXHTML("center");
113
  nd.appendChild(document.createTextNode("To view the "));
114
  var an = myCreateElementXHTML("a");
115
  an.appendChild(document.createTextNode("ASCIIsvg"));
116
  an.setAttribute("href","http://www.chapman.edu/~jipsen/asciisvg.html");
117
  nd.appendChild(an);
118
  nd.appendChild(document.createTextNode(" images use Internet Explorer 6+"));
119
  an = myCreateElementXHTML("a");
120
  an.appendChild(document.createTextNode("Adobe SVGviewer 3.02"));
121
  an.setAttribute("href","http://www.adobe.com/svg");
122
  nd.appendChild(an);
123
  nd.appendChild(document.createTextNode(" or "));
124
  an = myCreateElementXHTML("a");
125
  an.appendChild(document.createTextNode("SVG enabled Mozilla/Firefox"));
126
  an.setAttribute("href",
127
    "http://www.chapman.edu/~jipsen/svg/svgenabledmozillafirefox.html");
128
  nd.appendChild(an);
129
  if (navigator.appName.slice(0,8)=="Netscape")
130
    if (window['SVGElement']) return null;
131
    else return nd;
132
  else if (navigator.appName.slice(0,9)=="Microsoft")
133
    try {
134
      var oSVG=eval("new ActiveXObject('Adobe.SVGCtl.3');");
135
        return null;
136
    } catch (e) {
137
        return nd;
138
    }
139
  else return nd;
140
}
141
 
142
 
143
function less(x,y) { return x < y }  // used for scripts in XML files
144
                                     // since IE does not handle CDATA well
145
function setText(st,id) {
146
  var node = document.getElementById(id);
147
  if (node!=null)
148
    if (node.childNodes.length!=0) node.childNodes[0].nodeValue = st;
149
    else node.appendChild(document.createTextNode(st));
150
}
151
 
152
function myCreateElementSVG(t) {
153
  if (isIE) return doc.createElement(t);
154
  else return doc.createElementNS("http://www.w3.org/2000/svg",t);
155
}
156
 
157
function getX() {
158
  return (doc.getElementById("pointerpos").getAttribute("cx")-origin[0])/xunitlength;
159
}
160
 
161
function getY() {
162
  return (height-origin[1]-doc.getElementById("pointerpos").getAttribute("cy"))/yunitlength;
163
}
164
 
165
function mousemove_listener(evt) {
166
  if (svgpicture.getAttribute("xbase")!=null)
167
    pointerpos.cx.baseVal.value = evt.clientX-svgpicture.getAttribute("xbase");
168
  if (svgpicture.getAttribute("ybase")!=null)
169
    pointerpos.cy.baseVal.value = evt.clientY-svgpicture.getAttribute("ybase");
170
}
171
 
172
function top_listener(evt) {
173
  svgpicture.setAttribute("ybase",evt.clientY);
174
}
175
 
176
function bottom_listener(evt) {
177
  svgpicture.setAttribute("ybase",evt.clientY-height+1);
178
}
179
 
180
function left_listener(evt) {
181
  svgpicture.setAttribute("xbase",evt.clientX);
182
}
183
 
184
function right_listener(evt) {
185
  svgpicture.setAttribute("xbase",evt.clientX-width+1);
186
}
187
 
188
function drawPictures() { // main routine; called after webpage has loaded
189
  var src, id, dsvg, onmov, nd, node, ht, index;
190
  var pictures = document.getElementsByTagName("textarea");
191
  for (index = 0; index<pictures.length; index++)
192
    if (pictures[index].className=="ASCIIsvg"){
193
      pictures[index].style.display="none";  // hide the textarea
194
    }
195
  pictures = document.getElementsByTagName("embed");
196
  var len = pictures.length;
197
 if (checkIfSVGavailable) {
198
  nd = isSVGavailable();
199
  if (nd != null && notifyIfNoSVG && len>0)
200
    if (alertIfNoSVG)
201
      alert("To view the SVG pictures in Internet Explorer\n\
202
download the free Adobe SVGviewer from www.adobe.com/svg or\n\
203
use Firefox 1.5 preview (called Deerpark)");
204
    else {
205
    var ASbody = document.getElementsByTagName("body")[0];
206
    ASbody.insertBefore(nd,ASbody.childNodes[0]);
207
  }
208
 }
209
 if (nd == null) {
210
  for (index = 0; index < len; index++) {
211
    xmin = null; xmax = null; ymin = null; ymax = null;
212
    xscl = null; xgrid = null; yscl = null; ygrid = null;
213
    initialized = false;
214
    picture = (isIE ? pictures[index] : pictures[0]);
215
    src = picture.getAttribute("script");
216
    if (src==null) src = "";
217
    ht = picture.getAttribute("height");
218
    if (ht==null) ht ="";
219
   if (ht!="") defaultborder = 25;
220
   if (ht=="" || src=="")
221
    if (document.getElementById("picture"+(index+1)+"input")==null) {
222
      if (isIE && src.indexOf("nobutton()")==-1)
223
        picture.parentNode.insertBefore(myCreateElementXHTML("br"),picture);
224
      node = myCreateElementXHTML("textarea");
225
      node.setAttribute("rows","10");
226
      node.setAttribute("cols","60");
227
//      node.setAttribute("style","display:block");
228
      if (isIE) src = src.replace(/([^\r])\n/g,"$1\r").slice(1);
229
      node.appendChild(document.createTextNode(src));
230
      if (src.indexOf("showcode()")==-1) node.style.display = "none";
231
      node.setAttribute("id","picture"+(index+1)+"input");
232
      picture.parentNode.insertBefore(node,picture);
233
 
234
      if (src.indexOf("nobutton()")==-1) {
235
        picture.parentNode.insertBefore(myCreateElementXHTML("br"),picture);
236
 
237
        node = myCreateElementXHTML("button");
238
        if (isIE) node.onclick = function() { showHideCode(this) };
239
        else node.setAttribute("onclick","showHideCode(this)");
240
        node.appendChild(document.createTextNode("Show/Hide"));
241
        picture.parentNode.insertBefore(node,picture);
242
 
243
        node = myCreateElementXHTML("button");
244
        if (isIE) node.onclick = ASfn[index];
245
        else node.setAttribute("onclick","updatePicture("+index+")");
246
        node.appendChild(document.createTextNode("Update"));
247
        if (src.indexOf("showCode()")==-1) node.style.display = "none";
248
        picture.parentNode.insertBefore(node,picture);
249
 
250
/*      node = myCreateElementXHTML("span");
251
//      node.setAttribute("id","AScoord"+index);
252
        node.appendChild(document.createTextNode("(x,y)"));
253
        picture.parentNode.insertBefore(node,picture);
254
*/
255
        picture.parentNode.insertBefore(myCreateElementXHTML("br"),picture);
256
      }
257
      if (isIE) picture.onmousemove = ASupdateCoords[index];
258
      else picture.setAttribute("onmousemove","updateCoords"+index+"()");
259
    } else src = document.getElementById("picture"+(index+1)+"input").value;
260
    src = src.replace(/plot\(\x20*([^\"f\[][^\n\r]+?)\,/g,"plot\(\"$1\",");
261
    src = src.replace(/plot\(\x20*([^\"f\[][^\n\r]+)\)/g,"plot(\"$1\")");
262
    src = src.replace(/([0-9])([a-zA-Z])/g,"$1*$2");
263
    src = src.replace(/\)([\(0-9a-zA-Z])/g,"\)*$1");
264
//    eval(src.replace(/\s\s/g,";")); //for XML version
265
    id = picture.getAttribute("id");
266
    dsvg = picture.getAttribute("src");
267
    onmov = picture.getAttribute("onmousemove");
268
    if (id == null || id == "") {
269
      id = "picture"+(index+1);
270
      picture.setAttribute("id",id);
271
    }
272
    try {
273
      with (Math) eval(src);
274
    } catch(err) {alert(err+"\n"+src)}
275
    if (isIE) src = src.replace(/([^\r])\n/g,"$1\r");
276
    setText("<embed width=\""+width+"\" height=\""+height+"\" src=\""+
277
            dsvg+"\" "+(onmov!=null?"onmousemove=\""+onmov+"\"":"")+
278
            (isIE?"\r":"\n")+"script=\'"+src+"\'>",id+"script");
279
//    setText(src.replace(/\s\s/g,"\r"),id+"script"); //for XML version
280
  }
281
 }
282
}
283
 
284
function switchTo(id) {
285
//alert(id);
286
  picture = document.getElementById(id);
287
  width = picture.getAttribute("width")-0;
288
  height = picture.getAttribute("height")-0;
289
  strokewidth = "1" // pixel
290
  stroke = "black"; // default line color
291
  fill = "none";    // default fill color
292
  marker = "none";
293
  if ((picture.nodeName == "EMBED" || picture.nodeName == "embed") && isIE) {
294
    svgpicture = picture.getSVGDocument().getElementById("root");
295
    doc = picture.getSVGDocument();
296
  } else {
297
    picture.setAttribute("onmousemove","updateCoords"+(id.slice(id.length-1)-1)+"()");
298
//alert(picture.getAttribute("onmousemove")+"***");
299
    svgpicture = picture;
300
    doc = document;
301
  }
302
  xunitlength = svgpicture.getAttribute("xunitlength")-0;
303
  yunitlength = svgpicture.getAttribute("yunitlength")-0;
304
  xmin = svgpicture.getAttribute("xmin")-0;
305
  xmax = svgpicture.getAttribute("xmax")-0;
306
  ymin = svgpicture.getAttribute("ymin")-0;
307
  ymax = svgpicture.getAttribute("ymax")-0;
308
  origin = [svgpicture.getAttribute("ox")-0,svgpicture.getAttribute("oy")-0];
309
}
310
 
311
function updatePicture(obj) {
312
//alert(typeof obj)
313
  var src = document.getElementById((typeof obj=="string"?
314
              obj:"picture"+(obj+1)+"input")).value;
315
  xmin = null; xmax = null; ymin = null; ymax = null;
316
  xscl = null; xgrid = null; yscl = null; ygrid = null;
317
  initialized = false;
318
  switchTo((typeof obj=="string"?obj.slice(0,8):"picture"+(obj+1)));
319
  src = src.replace(/plot\(\x20*([^\"f\[][^\n\r]+?)\,/g,"plot\(\"$1\",");
320
  src = src.replace(/plot\(\x20*([^\"f\[][^\n\r]+)\)/g,"plot(\"$1\")");
321
  src = src.replace(/([0-9])([a-zA-Z])/g,"$1*$2");
322
  src = src.replace(/\)([\(0-9a-zA-Z])/g,"\)*$1");
323
//alert(src);
324
  try {
325
    with (Math) eval(src);
326
  } catch(err) {alert(err+"\n"+src)}
327
}
328
 
329
function showHideCode(obj) {
330
  var node = obj.nextSibling;
331
  while (node != null && node.nodeName != "BUTTON" &&
332
    node.nodeName != "button") node = node.nextSibling;
333
  if (node.style.display == "none") node.style.display = "";
334
  else node.style.display = "none";
335
  while (node != null && node.nodeName != "TEXTAREA" &&
336
    node.nodeName != "textarea") node = node.previousSibling;
337
  if (node.style.display == "none") node.style.display = "";
338
  else node.style.display = "none";
339
//  updatePicture(node.getAttribute("id"));
340
}
341
 
342
function hideCode() { //do nothing
343
}
344
 
345
function showcode() { //do nothing
346
}
347
 
348
function nobutton() { //do nothing
349
}
350
 
351
function setBorder(x) { border = x }
352
 
353
function initPicture(x_min,x_max,y_min,y_max) {
354
 if (!initialized) {
355
  strokewidth = "1"; // pixel
356
  strokedasharray = null;
357
  stroke = "black"; // default line color
358
  fill = "none";    // default fill color
359
  fontstyle = "italic"; // default shape for text labels
360
  fontfamily = "times"; // default font
361
  fontsize = "16";      // default size
362
  fontweight = "normal";
363
  fontstroke = "none";  // default font outline color
364
  fontfill = "none";    // default font color
365
  marker = "none";
366
  initialized = true;
367
  if (x_min!=null) xmin = x_min;
368
  if (x_max!=null) xmax = x_max;
369
  if (y_min!=null) ymin = y_min;
370
  if (y_max!=null) ymax = y_max;
371
  if (xmin==null) xmin = -5;
372
  if (xmax==null) xmax = 5;
373
 if (typeof xmin != "number" || typeof xmax != "number" || xmin >= xmax)
374
   alert("Picture requires at least two numbers: xmin < xmax");
375
 else if (y_max != null && (typeof y_min != "number" ||
376
          typeof y_max != "number" || y_min >= y_max))
377
   alert("initPicture(xmin,xmax,ymin,ymax) requires numbers ymin < ymax");
378
 else {
379
  if (width==null) width = picture.getAttribute("width");
380
  else picture.setAttribute("width",width);
381
  if (width==null || width=="") width=defaultwidth;
382
  if (height==null) height = picture.getAttribute("height");
383
  else picture.setAttribute("height",height);
384
  if (height==null || height=="") height=defaultheight;
385
  xunitlength = (width-2*border)/(xmax-xmin);
386
  yunitlength = xunitlength;
387
//alert(xmin+" "+xmax+" "+ymin+" "+ymax)
388
  if (ymin==null) {
389
    origin = [-xmin*xunitlength+border,height/2];
390
    ymin = -(height-2*border)/(2*yunitlength);
391
    ymax = -ymin;
392
  } else {
393
    if (ymax!=null) yunitlength = (height-2*border)/(ymax-ymin);
394
    else ymax = (height-2*border)/yunitlength + ymin;
395
    origin = [-xmin*xunitlength+border,-ymin*yunitlength+border];
396
  }
397
//  if (true ||picture.nodeName == "EMBED" || picture.nodeName == "embed") {
398
    if (isIE) {
399
      svgpicture = picture.getSVGDocument().getElementById("root");
400
      while (svgpicture.childNodes.length()>5)
401
        svgpicture.removeChild(svgpicture.lastChild);
402
      svgpicture.setAttribute("width",width);
403
      svgpicture.setAttribute("height",height);
404
      doc = picture.getSVGDocument();
405
    } else {
406
      var qnode = document.createElementNS("http://www.w3.org/2000/svg","svg");
407
      qnode.setAttribute("id",picture.getAttribute("id"));
408
      qnode.setAttribute("style","display:inline");
409
      qnode.setAttribute("width",picture.getAttribute("width"));
410
      qnode.setAttribute("height",picture.getAttribute("height"));
411
      if (picture.parentNode!=null)
412
        picture.parentNode.replaceChild(qnode,picture);
413
      else
414
        svgpicture.parentNode.replaceChild(qnode,svgpicture);
415
      svgpicture = qnode;
416
      doc = document;
417
      pointerpos = doc.getElementById("pointerpos");
418
      if (pointerpos==null) {
419
        pointerpos = myCreateElementSVG("circle");
420
        pointerpos.setAttribute("id","pointerpos");
421
        pointerpos.setAttribute("cx",0);
422
        pointerpos.setAttribute("cy",0);
423
        pointerpos.setAttribute("r",0.5);
424
        pointerpos.setAttribute("fill","red");
425
        svgpicture.appendChild(pointerpos);
426
      }
427
    }
428
//  } else {
429
//    svgpicture = picture;
430
//    doc = document;
431
//  }
432
  svgpicture.setAttribute("xunitlength",xunitlength);
433
  svgpicture.setAttribute("yunitlength",yunitlength);
434
  svgpicture.setAttribute("xmin",xmin);
435
  svgpicture.setAttribute("xmax",xmax);
436
  svgpicture.setAttribute("ymin",ymin);
437
  svgpicture.setAttribute("ymax",ymax);
438
  svgpicture.setAttribute("ox",origin[0]);
439
  svgpicture.setAttribute("oy",origin[1]);
440
  var node = myCreateElementSVG("rect");
441
  node.setAttribute("x","0");
442
  node.setAttribute("y","0");
443
  node.setAttribute("width",width);
444
  node.setAttribute("height",height);
445
  node.setAttribute("style","stroke-width:1;fill:white");
446
  svgpicture.appendChild(node);
447
  if (!isIE && picture.getAttribute("onmousemove")!=null) {
448
    svgpicture.addEventListener("mousemove", mousemove_listener, true);
449
    var st = picture.getAttribute("onmousemove");
450
    svgpicture.addEventListener("mousemove", eval(st.slice(0,st.indexOf("("))), true);
451
    node = myCreateElementSVG("polyline");
452
    node.setAttribute("points","0,0 "+width+",0");
453
    node.setAttribute("style","stroke:white; stroke-width:3");
454
    node.addEventListener("mousemove", top_listener, true);
455
    svgpicture.appendChild(node);
456
    node = myCreateElementSVG("polyline");
457
    node.setAttribute("points","0,"+height+" "+width+","+height);
458
    node.setAttribute("style","stroke:white; stroke-width:3");
459
    node.addEventListener("mousemove", bottom_listener, true);
460
    svgpicture.appendChild(node);
461
    node = myCreateElementSVG("polyline");
462
    node.setAttribute("points","0,0 0,"+height);
463
    node.setAttribute("style","stroke:white; stroke-width:3");
464
    node.addEventListener("mousemove", left_listener, true);
465
    svgpicture.appendChild(node);
466
    node = myCreateElementSVG("polyline");
467
    node.setAttribute("points",(width-1)+",0 "+(width-1)+","+height);
468
    node.setAttribute("style","stroke:white; stroke-width:3");
469
    node.addEventListener("mousemove", right_listener, true);
470
    svgpicture.appendChild(node);
471
  }
472
  border = defaultborder;
473
 }
474
 }
475
}
476
 
477
function line(p,q,id) { // segment connecting points p,q (coordinates in units)
478
  var node;
479
  if (id!=null) node = doc.getElementById(id);
480
  if (node==null) {
481
    node = myCreateElementSVG("path");
482
    node.setAttribute("id", id);
483
    svgpicture.appendChild(node);
484
  }
485
  node.setAttribute("d","M"+(p[0]*xunitlength+origin[0])+","+
486
    (height-p[1]*yunitlength-origin[1])+" "+
487
    (q[0]*xunitlength+origin[0])+","+(height-q[1]*yunitlength-origin[1]));
488
  node.setAttribute("stroke-width", strokewidth);
489
  if (strokedasharray!=null)
490
    node.setAttribute("stroke-dasharray", strokedasharray);
491
  node.setAttribute("stroke", stroke);
492
  node.setAttribute("fill", fill);
493
  if (marker=="dot" || marker=="arrowdot") {
494
    ASdot(p,4,markerstroke,markerfill);
495
    if (marker=="arrowdot") arrowhead(p,q);
496
    ASdot(q,4,markerstroke,markerfill);
497
  } else if (marker=="arrow") arrowhead(p,q);
498
}
499
 
500
function path(plist,id,c) {
501
  if (c==null) c="";
502
  var node, st, i;
503
  if (id!=null) node = doc.getElementById(id);
504
  if (node==null) {
505
    node = myCreateElementSVG("path");
506
    node.setAttribute("id", id);
507
    svgpicture.appendChild(node);
508
  }
509
  if (typeof plist == "string") st = plist;
510
  else {
511
    st = "M";
512
    st += (plist[0][0]*xunitlength+origin[0])+","+
513
          (height-plist[0][1]*yunitlength-origin[1])+" "+c;
514
    for (i=1; i<plist.length; i++)
515
      st += (plist[i][0]*xunitlength+origin[0])+","+
516
            (height-plist[i][1]*yunitlength-origin[1])+" ";
517
  }
518
  node.setAttribute("d", st);
519
  node.setAttribute("stroke-width", strokewidth);
520
  if (strokedasharray!=null)
521
    node.setAttribute("stroke-dasharray", strokedasharray);
522
  node.setAttribute("stroke", stroke);
523
  node.setAttribute("fill", fill);
524
  if (marker=="dot" || marker=="arrowdot")
525
    for (i=0; i<plist.length; i++)
526
      if (c!="C" && c!="T" || i!=1 && i!=2)
527
        ASdot(plist[i],4,markerstroke,markerfill);
528
}
529
 
530
function curve(plist,id) {
531
  path(plist,id,"T");
532
}
533
 
534
function circle(center,radius,id) { // coordinates in units
535
  var node;
536
  if (id!=null) node = doc.getElementById(id);
537
  if (node==null) {
538
    node = myCreateElementSVG("circle");
539
    node.setAttribute("id", id);
540
    svgpicture.appendChild(node);
541
  }
542
  node.setAttribute("cx",center[0]*xunitlength+origin[0]);
543
  node.setAttribute("cy",height-center[1]*yunitlength-origin[1]);
544
  node.setAttribute("r",radius*xunitlength);
545
  node.setAttribute("stroke-width", strokewidth);
546
  node.setAttribute("stroke", stroke);
547
  node.setAttribute("fill", fill);
548
}
549
 
550
function loop(p,d,id) {
551
// d is a direction vector e.g. [1,0] means loop starts in that direction
552
  if (d==null) d=[1,0];
553
  path([p,[p[0]+d[0],p[1]+d[1]],[p[0]-d[1],p[1]+d[0]],p],id,"C");
554
  if (marker=="arrow" || marker=="arrowdot")
555
    arrowhead([p[0]+Math.cos(1.4)*d[0]-Math.sin(1.4)*d[1],
556
               p[1]+Math.sin(1.4)*d[0]+Math.cos(1.4)*d[1]],p);
557
}
558
 
559
function arc(start,end,radius,id) { // coordinates in units
560
  var node, v;
561
//alert([fill, stroke, origin, xunitlength, yunitlength, height])
562
  if (id!=null) node = doc.getElementById(id);
563
  if (radius==null) {
564
    v=[end[0]-start[0],end[1]-start[1]];
565
    radius = Math.sqrt(v[0]*v[0]+v[1]*v[1]);
566
  }
567
  if (node==null) {
568
    node = myCreateElementSVG("path");
569
    node.setAttribute("id", id);
570
    svgpicture.appendChild(node);
571
  }
572
  node.setAttribute("d","M"+(start[0]*xunitlength+origin[0])+","+
573
    (height-start[1]*yunitlength-origin[1])+" A"+radius*xunitlength+","+
574
     radius*yunitlength+" 0 0,0 "+(end[0]*xunitlength+origin[0])+","+
575
    (height-end[1]*yunitlength-origin[1]));
576
  node.setAttribute("stroke-width", strokewidth);
577
  node.setAttribute("stroke", stroke);
578
  node.setAttribute("fill", fill);
579
  if (marker=="arrow" || marker=="arrowdot") {
580
    u = [(end[1]-start[1])/4,(start[0]-end[0])/4];
581
    v = [(end[0]-start[0])/2,(end[1]-start[1])/2];
582
//alert([u,v])
583
    v = [start[0]+v[0]+u[0],start[1]+v[1]+u[1]];
584
  } else v=[start[0],start[1]];
585
  if (marker=="dot" || marker=="arrowdot") {
586
    ASdot(start,4,markerstroke,markerfill);
587
    if (marker=="arrowdot") arrowhead(v,end);
588
    ASdot(end,4,markerstroke,markerfill);
589
  } else if (marker=="arrow") arrowhead(v,end);
590
}
591
 
592
function ellipse(center,rx,ry,id) { // coordinates in units
593
  var node;
594
  if (id!=null) node = doc.getElementById(id);
595
  if (node==null) {
596
    node = myCreateElementSVG("ellipse");
597
    node.setAttribute("id", id);
598
    svgpicture.appendChild(node);
599
  }
600
  node.setAttribute("cx",center[0]*xunitlength+origin[0]);
601
  node.setAttribute("cy",height-center[1]*yunitlength-origin[1]);
602
  node.setAttribute("rx",rx*xunitlength);
603
  node.setAttribute("ry",ry*yunitlength);
604
  node.setAttribute("stroke-width", strokewidth);
605
  node.setAttribute("stroke", stroke);
606
  node.setAttribute("fill", fill);
607
}
608
 
609
function rect(p,q,id,rx,ry) { // opposite corners in units, rounded by radii
610
  var node;
611
  if (id!=null) node = doc.getElementById(id);
612
  if (node==null) {
613
    node = myCreateElementSVG("rect");
614
    node.setAttribute("id", id);
615
    svgpicture.appendChild(node);
616
  }
617
  node.setAttribute("x",p[0]*xunitlength+origin[0]);
618
  node.setAttribute("y",height-q[1]*yunitlength-origin[1]);
619
  node.setAttribute("width",(q[0]-p[0])*xunitlength);
620
  node.setAttribute("height",(q[1]-p[1])*yunitlength);
621
  if (rx!=null) node.setAttribute("rx",rx*xunitlength);
622
  if (ry!=null) node.setAttribute("ry",ry*yunitlength);
623
  node.setAttribute("stroke-width", strokewidth);
624
  node.setAttribute("stroke", stroke);
625
  node.setAttribute("fill", fill);
626
}
627
 
628
function text(p,st,pos,id,fontsty) {
629
  var textanchor = "middle";
630
  var dx = 0; var dy = fontsize/3;
631
  if (pos!=null) {
632
    if (pos.slice(0,5)=="above") dy = -fontsize/2;
633
    if (pos.slice(0,5)=="below") dy = fontsize-0;
634
    if (pos.slice(0,5)=="right" || pos.slice(5,10)=="right") {
635
      textanchor = "start";
636
      dx = fontsize/2;
637
    }
638
    if (pos.slice(0,4)=="left" || pos.slice(5,9)=="left") {
639
      textanchor = "end";
640
      dx = -fontsize/2;
641
    }
642
  }
643
  var node;
644
  if (id!=null) node = doc.getElementById(id);
645
  if (node==null) {
646
    node = myCreateElementSVG("text");
647
    node.setAttribute("id", id);
648
    svgpicture.appendChild(node);
649
    node.appendChild(doc.createTextNode(st));
650
  }
651
  node.lastChild.nodeValue = st;
652
  node.setAttribute("x",p[0]*xunitlength+origin[0]+dx);
653
  node.setAttribute("y",height-p[1]*yunitlength-origin[1]+dy);
654
  node.setAttribute("font-style",(fontsty!=null?fontsty:fontstyle));
655
  node.setAttribute("font-family",fontfamily);
656
  node.setAttribute("font-size",fontsize);
657
  node.setAttribute("font-weight",fontweight);
658
  node.setAttribute("text-anchor",textanchor);
659
  if (fontstroke!="none") node.setAttribute("stroke",fontstroke);
660
  if (fontfill!="none") node.setAttribute("fill",fontfill);
661
  return p;
662
}
663
 
664
function ASdot(center,radius,s,f) { // coordinates in units, radius in pixel
665
  if (s==null) s = stroke; if (f==null) f = fill;
666
  var node = myCreateElementSVG("circle");
667
  node.setAttribute("cx",center[0]*xunitlength+origin[0]);
668
  node.setAttribute("cy",height-center[1]*yunitlength-origin[1]);
669
  node.setAttribute("r",radius);
670
  node.setAttribute("stroke-width", strokewidth);
671
  node.setAttribute("stroke", s);
672
  node.setAttribute("fill", f);
673
  svgpicture.appendChild(node);
674
}
675
 
676
function dot(center, typ, label, pos, id) {
677
  var node;
678
  var cx = center[0]*xunitlength+origin[0];
679
  var cy = height-center[1]*yunitlength-origin[1];
680
  if (id!=null) node = doc.getElementById(id);
681
  if (typ=="+" || typ=="-" || typ=="|") {
682
    if (node==null) {
683
      node = myCreateElementSVG("path");
684
      node.setAttribute("id", id);
685
      svgpicture.appendChild(node);
686
    }
687
    if (typ=="+") {
688
      node.setAttribute("d",
689
        " M "+(cx-ticklength)+" "+cy+" L "+(cx+ticklength)+" "+cy+
690
        " M "+cx+" "+(cy-ticklength)+" L "+cx+" "+(cy+ticklength));
691
      node.setAttribute("stroke-width", .5);
692
      node.setAttribute("stroke", axesstroke);
693
    } else {
694
      if (typ=="-") node.setAttribute("d",
695
        " M "+(cx-ticklength)+" "+cy+" L "+(cx+ticklength)+" "+cy);
696
      else node.setAttribute("d",
697
        " M "+cx+" "+(cy-ticklength)+" L "+cx+" "+(cy+ticklength));
698
      node.setAttribute("stroke-width", strokewidth);
699
      node.setAttribute("stroke", stroke);
700
    }
701
  } else {
702
    if (node==null) {
703
      node = myCreateElementSVG("circle");
704
      node.setAttribute("id", id);
705
      svgpicture.appendChild(node);
706
    }
707
    node.setAttribute("cx",cx);
708
    node.setAttribute("cy",cy);
709
    node.setAttribute("r",dotradius);
710
    node.setAttribute("stroke-width", strokewidth);
711
    node.setAttribute("stroke", stroke);
712
    node.setAttribute("fill", (typ=="open"?"white":stroke));
713
  }
714
  if (label!=null)
715
    text(center,label,(pos==null?"below":pos),(id==null?id:id+"label"))
716
}
717
 
718
function arrowhead(p,q) { // draw arrowhead at q (in units)
719
  var up;
720
  var v = [p[0]*xunitlength+origin[0],height-p[1]*yunitlength-origin[1]];
721
  var w = [q[0]*xunitlength+origin[0],height-q[1]*yunitlength-origin[1]];
722
  var u = [w[0]-v[0],w[1]-v[1]];
723
  var d = Math.sqrt(u[0]*u[0]+u[1]*u[1]);
724
  if (d > 0.00000001) {
725
    u = [u[0]/d, u[1]/d];
726
    up = [-u[1],u[0]];
727
    var node = myCreateElementSVG("path");
728
    node.setAttribute("d","M "+(w[0]-15*u[0]-4*up[0])+" "+
729
      (w[1]-15*u[1]-4*up[1])+" L "+(w[0]-3*u[0])+" "+(w[1]-3*u[1])+" L "+
730
      (w[0]-15*u[0]+4*up[0])+" "+(w[1]-15*u[1]+4*up[1])+" z");
731
    node.setAttribute("stroke-width", markerstrokewidth);
732
    node.setAttribute("stroke", stroke); /*was markerstroke*/
733
    node.setAttribute("fill", stroke); /*was arrowfill*/
734
    svgpicture.appendChild(node);    
735
  }
736
}
737
 
738
function chopZ(st) {
739
  var k = st.indexOf(".");
740
  if (k==-1) return st;
741
  for (var i=st.length-1; i>k && st.charAt(i)=="0"; i--);
742
  if (i==k) i--;
743
  return st.slice(0,i+1);
744
}
745
 
746
function grid(dx,dy) { // for backward compatibility
747
  axes(dx,dy,null,dx,dy)
748
}
749
 
750
function noaxes() {
751
  if (!initialized) initPicture();
752
}
753
 
754
function axes(dx,dy,labels,gdx,gdy) {
755
//xscl=x is equivalent to xtick=x; xgrid=x; labels=true;
756
  var x, y, ldx, ldy, lx, ly, lxp, lyp, pnode, st;
757
  if (!initialized) initPicture();
758
  if (typeof dx=="string") { labels = dx; dx = null; }
759
  if (typeof dy=="string") { gdx = dy; dy = null; }
760
  if (xscl!=null) {dx = xscl; gdx = xscl; labels = dx}
761
  if (yscl!=null) {dy = yscl; gdy = yscl}
762
  if (xtick!=null) {dx = xtick}
763
  if (ytick!=null) {dy = ytick}
764
//alert(null)
765
  dx = (dx==null?xunitlength:dx*xunitlength);
766
  dy = (dy==null?dx:dy*yunitlength);
767
  fontsize = Math.min(dx/2,dy/2,16);//alert(fontsize)
768
  ticklength = fontsize/4;
769
  if (xgrid!=null) gdx = xgrid;
770
  if (ygrid!=null) gdy = ygrid;
771
  if (gdx!=null) {
772
    gdx = (typeof gdx=="string"?dx:gdx*xunitlength);
773
    gdy = (gdy==null?dy:gdy*yunitlength);
774
    pnode = myCreateElementSVG("path");
775
    st="";
776
    for (x = origin[0]; x<width; x = x+gdx)
777
      st += " M"+x+",0"+" "+x+","+height;
778
    for (x = origin[0]-gdx; x>0; x = x-gdx)
779
      st += " M"+x+",0"+" "+x+","+height;
780
    for (y = height-origin[1]; y<height; y = y+gdy)
781
      st += " M0,"+y+" "+width+","+y;
782
    for (y = height-origin[1]-gdy; y>0; y = y-gdy)
783
      st += " M0,"+y+" "+width+","+y;
784
    pnode.setAttribute("d",st);
785
    pnode.setAttribute("stroke-width", .5);
786
    pnode.setAttribute("stroke", gridstroke);
787
    pnode.setAttribute("fill", fill);
788
    svgpicture.appendChild(pnode);
789
  }
790
  pnode = myCreateElementSVG("path");
791
  st="M0,"+(height-origin[1])+" "+width+","+
792
    (height-origin[1])+" M"+origin[0]+",0 "+origin[0]+","+height;
793
  for (x = origin[0]+dx; x<width; x = x+dx)
794
    st += " M"+x+","+(height-origin[1]+ticklength)+" "+x+","+
795
           (height-origin[1]-ticklength);
796
  for (x = origin[0]-dx; x>0; x = x-dx)
797
    st += " M"+x+","+(height-origin[1]+ticklength)+" "+x+","+
798
           (height-origin[1]-ticklength);
799
  for (y = height-origin[1]+dy; y<height; y = y+dy)
800
    st += " M"+(origin[0]+ticklength)+","+y+" "+(origin[0]-ticklength)+","+y;
801
  for (y = height-origin[1]-dy; y>0; y = y-dy)
802
    st += " M"+(origin[0]+ticklength)+","+y+" "+(origin[0]-ticklength)+","+y;
803
  if (labels!=null) with (Math) {
804
    ldx = dx/xunitlength;
805
    ldy = dy/yunitlength;
806
    lx = (xmin>0 || xmax<0?xmin:0);
807
    ly = (ymin>0 || ymax<0?ymin:0);
808
    lxp = (ly==0?"below":"above");
809
    lyp = (lx==0?"left":"right");
810
    var ddx = floor(1.1-log(ldx)/log(10))+1;
811
    var ddy = floor(1.1-log(ldy)/log(10))+1;
812
    for (x = ldx; x<=xmax; x = x+ldx)
813
      text([x,ly],chopZ(x.toFixed(ddx)),lxp);
814
    for (x = -ldx; xmin<=x; x = x-ldx)
815
      text([x,ly],chopZ(x.toFixed(ddx)),lxp);
816
    for (y = ldy; y<=ymax; y = y+ldy)
817
      text([lx,y],chopZ(y.toFixed(ddy)),lyp);
818
    for (y = -ldy; ymin<=y; y = y-ldy)
819
      text([lx,y],chopZ(y.toFixed(ddy)),lyp);
820
  }
821
  pnode.setAttribute("d",st);
822
  pnode.setAttribute("stroke-width", .5);
823
  pnode.setAttribute("stroke", axesstroke);
824
  pnode.setAttribute("fill", fill);
825
  svgpicture.appendChild(pnode);
826
}
827
 
828
function mathjs(st) {
829
  //translate a math formula to js function notation
830
  // a^b --> pow(a,b)
831
  // na --> n*a
832
  // (...)d --> (...)*d
833
  // n! --> factorial(n)
834
  // sin^-1 --> arcsin etc.
835
  //while ^ in string, find term on left and right
836
  //slice and concat new formula string
837
  st = st.replace(/\s/g,"");
838
  if (st.indexOf("^-1")!=-1) {
839
    st = st.replace(/sin\^-1/g,"arcsin");
840
    st = st.replace(/cos\^-1/g,"arccos");
841
    st = st.replace(/tan\^-1/g,"arctan");
842
    st = st.replace(/sec\^-1/g,"arcsec");
843
    st = st.replace(/csc\^-1/g,"arccsc");
844
    st = st.replace(/cot\^-1/g,"arccot");
845
    st = st.replace(/sinh\^-1/g,"arcsinh");
846
    st = st.replace(/cosh\^-1/g,"arccosh");
847
    st = st.replace(/tanh\^-1/g,"arctanh");
848
    st = st.replace(/sech\^-1/g,"arcsech");
849
    st = st.replace(/csch\^-1/g,"arccsch");
850
    st = st.replace(/coth\^-1/g,"arccoth");
851
  }
852
  st = st.replace(/^e$/g,"(E)");
853
  st = st.replace(/^e([^a-zA-Z])/g,"(E)$1");
854
  st = st.replace(/([^a-zA-Z])e([^a-zA-Z])/g,"$1(E)$2");
855
  st = st.replace(/([0-9])([\(a-zA-Z])/g,"$1*$2");
856
  st = st.replace(/\)([\(0-9a-zA-Z])/g,"\)*$1");
857
  var i,j,k, ch, nested;
858
  while ((i=st.indexOf("^"))!=-1) {
859
    //find left argument
860
    if (i==0) return "Error: missing argument";
861
    j = i-1;
862
    ch = st.charAt(j);
863
    if (ch>="0" && ch<="9") {// look for (decimal) number
864
      j--;
865
      while (j>=0 && (ch=st.charAt(j))>="0" && ch<="9") j--;
866
      if (ch==".") {
867
        j--;
868
        while (j>=0 && (ch=st.charAt(j))>="0" && ch<="9") j--;
869
      }
870
    } else if (ch==")") {// look for matching opening bracket and function name
871
      nested = 1;
872
      j--;
873
      while (j>=0 && nested>0) {
874
        ch = st.charAt(j);
875
        if (ch=="(") nested--;
876
        else if (ch==")") nested++;
877
        j--;
878
      }
879
      while (j>=0 && (ch=st.charAt(j))>="a" && ch<="z" || ch>="A" && ch<="Z")
880
        j--;
881
    } else if (ch>="a" && ch<="z" || ch>="A" && ch<="Z") {// look for variable
882
      j--;
883
      while (j>=0 && (ch=st.charAt(j))>="a" && ch<="z" || ch>="A" && ch<="Z")
884
        j--;
885
    } else {
886
      return "Error: incorrect syntax in "+st+" at position "+j;
887
    }
888
    //find right argument
889
    if (i==st.length-1) return "Error: missing argument";
890
    k = i+1;
891
    ch = st.charAt(k);
892
    if (ch>="0" && ch<="9" || ch=="-") {// look for signed (decimal) number
893
      k++;
894
      while (k<st.length && (ch=st.charAt(k))>="0" && ch<="9") k++;
895
      if (ch==".") {
896
        k++;
897
        while (k<st.length && (ch=st.charAt(k))>="0" && ch<="9") k++;
898
      }
899
    } else if (ch=="(") {// look for matching closing bracket and function name
900
      nested = 1;
901
      k++;
902
      while (k<st.length && nested>0) {
903
        ch = st.charAt(k);
904
        if (ch=="(") nested++;
905
        else if (ch==")") nested--;
906
        k++;
907
      }
908
    } else if (ch>="a" && ch<="z" || ch>="A" && ch<="Z") {// look for variable
909
      k++;
910
      while (k<st.length && (ch=st.charAt(k))>="a" && ch<="z" ||
911
               ch>="A" && ch<="Z") k++;
912
    } else {
913
      return "Error: incorrect syntax in "+st+" at position "+k;
914
    }
915
    st = st.slice(0,j+1)+"pow("+st.slice(j+1,i)+","+st.slice(i+1,k)+")"+
916
           st.slice(k);
917
  }
918
  while ((i=st.indexOf("!"))!=-1) {
919
    //find left argument
920
    if (i==0) return "Error: missing argument";
921
    j = i-1;
922
    ch = st.charAt(j);
923
    if (ch>="0" && ch<="9") {// look for (decimal) number
924
      j--;
925
      while (j>=0 && (ch=st.charAt(j))>="0" && ch<="9") j--;
926
      if (ch==".") {
927
        j--;
928
        while (j>=0 && (ch=st.charAt(j))>="0" && ch<="9") j--;
929
      }
930
    } else if (ch==")") {// look for matching opening bracket and function name
931
      nested = 1;
932
      j--;
933
      while (j>=0 && nested>0) {
934
        ch = st.charAt(j);
935
        if (ch=="(") nested--;
936
        else if (ch==")") nested++;
937
        j--;
938
      }
939
      while (j>=0 && (ch=st.charAt(j))>="a" && ch<="z" || ch>="A" && ch<="Z")
940
        j--;
941
    } else if (ch>="a" && ch<="z" || ch>="A" && ch<="Z") {// look for variable
942
      j--;
943
      while (j>=0 && (ch=st.charAt(j))>="a" && ch<="z" || ch>="A" && ch<="Z")
944
        j--;
945
    } else {
946
      return "Error: incorrect syntax in "+st+" at position "+j;
947
    }
948
    st = st.slice(0,j+1)+"factorial("+st.slice(j+1,i)+")"+st.slice(i+1);
949
  }
950
  return st;
951
}
952
 
953
function plot(fun,x_min,x_max,points,id) {
954
  var pth = [];
955
  var f = function(x) { return x }, g = fun;
956
  var name = null;
957
  if (typeof fun=="string")
958
    eval("g = function(x){ with(Math) return "+mathjs(fun)+" }");
959
  else if (typeof fun=="object") {
960
    eval("f = function(t){ with(Math) return "+mathjs(fun[0])+" }");
961
    eval("g = function(t){ with(Math) return "+mathjs(fun[1])+" }");
962
  }
963
  if (typeof x_min=="string") { name = x_min; x_min = xmin }
964
  else name = id;
965
  var min = (x_min==null?xmin:x_min);
966
  var max = (x_max==null?xmax:x_max);
967
  var inc = max-min-0.000001*(max-min);
968
  inc = (points==null?inc/200:inc/points);
969
  var gt;
970
//alert(typeof g(min))
971
  for (var t = min; t <= max; t += inc) {
972
    gt = g(t);
973
    if (!(isNaN(gt)||Math.abs(gt)=="Infinity")) pth[pth.length] = [f(t), gt];
974
  }
975
  path(pth,name)
976
  return p;
977
}
978
 
979
function slopefield(fun,dx,dy) {
980
  var g = fun;
981
  if (typeof fun=="string")
982
    eval("g = function(x,y){ with(Math) return "+mathjs(fun)+" }");
983
  var gxy,x,y,u,v,dz;
984
  if (dx==null) dx=1;
985
  if (dy==null) dy=1;
986
  dz = Math.sqrt(dx*dx+dy*dy)/6;
987
  var x_min = Math.ceil(xmin/dx);
988
  var y_min = Math.ceil(ymin/dy);
989
  for (x = x_min; x <= xmax; x += dx)
990
    for (y = y_min; y <= ymax; y += dy) {
991
      gxy = g(x,y);
992
      if (!isNaN(gxy)) {
993
        if (Math.abs(gxy)=="Infinity") {u = 0; v = dz;}
994
        else {u = dz/Math.sqrt(1+gxy*gxy); v = gxy*u;}
995
        line([x-u,y-v],[x+u,y+v]);
996
      }
997
    }
998
}
999
 
1000
function updateCoords(ind) {
1001
  switchTo("picture"+(ind+1));
1002
  var gx=getX(), gy=getY();
1003
  if ((xmax-gx)*xunitlength > 6*fontsize || (gy-ymin)*yunitlength > 2*fontsize)
1004
    text([xmax,ymin],"("+gx.toFixed(2)+", "+gy.toFixed(2)+")",
1005
         "aboveleft","AScoord"+ind,"");
1006
  else text([xmax,ymin]," ","aboveleft","AScoord"+ind,"");
1007
}
1008
 
1009
function updateCoords0() {updateCoords(0)}
1010
function updateCoords1() {updateCoords(1)}
1011
function updateCoords2() {updateCoords(2)}
1012
function updateCoords3() {updateCoords(3)}
1013
function updateCoords4() {updateCoords(4)}
1014
function updateCoords5() {updateCoords(5)}
1015
function updateCoords6() {updateCoords(6)}
1016
function updateCoords7() {updateCoords(7)}
1017
function updateCoords8() {updateCoords(8)}
1018
function updateCoords9() {updateCoords(9)}
1019
ASfn = [function() {updatePicture(0)},
1020
  function() {updatePicture(1)},
1021
  function() {updatePicture(2)},
1022
  function() {updatePicture(3)},
1023
  function() {updatePicture(4)},
1024
  function() {updatePicture(5)},
1025
  function() {updatePicture(6)},
1026
  function() {updatePicture(7)},
1027
  function() {updatePicture(8)},
1028
  function() {updatePicture(9)}];
1029
ASupdateCoords = [function() {updateCoords(0)},
1030
  function() {updateCoords(1)},
1031
  function() {updateCoords(2)},
1032
  function() {updateCoords(3)},
1033
  function() {updateCoords(4)},
1034
  function() {updateCoords(5)},
1035
  function() {updateCoords(6)},
1036
  function() {updateCoords(7)},
1037
  function() {updateCoords(8)},
1038
  function() {updateCoords(9)}];
1039
 
1040
// GO1.1 Generic onload by Brothercake 
1041
// http://www.brothercake.com/
1042
//onload function
1043
function generic()
1044
{
1045
  drawPictures();
1046
};
1047
//setup onload function
1048
if(typeof window.addEventListener != 'undefined')
1049
{
1050
  //.. gecko, safari, konqueror and standard
1051
  window.addEventListener('load', generic, false);
1052
}
1053
else if(typeof document.addEventListener != 'undefined')
1054
{
1055
  //.. opera 7
1056
  document.addEventListener('load', generic, false);
1057
}
1058
else if(typeof window.attachEvent != 'undefined')
1059
{
1060
  //.. win/ie
1061
  window.attachEvent('onload', generic);
1062
}
1063
//** remove this condition to degrade older browsers
1064
else
1065
{
1066
  //.. mac/ie5 and anything else that gets this far
1067
  //if there's an existing onload function
1068
  if(typeof window.onload == 'function')
1069
  {
1070
    //store it
1071
    var existing = onload;
1072
    //add new onload handler
1073
    window.onload = function()
1074
    {
1075
      //call existing onload function
1076
      existing();
1077
      //call generic onload function
1078
      generic();
1079
    };
1080
  }
1081
  else
1082
  {
1083
    //setup onload function
1084
    window.onload = generic;
1085
  }
1086
}