# Germany's Spinners

A CBE Programming Example

[ Start | Stop | Reset | Debug ]

Thanks to Germany for the initial code.

Get CBE at Cross-Browser.com

## The Javascript

    var
      // edit these when adding more spinners:
      ne = 4,          // number of spinner elements
      cp = new Array('e','s','w','n'), // cardinal point for each spinner
      // edit these when changing overall behavior:
      a2 = 360,        // radial distance for a spinner's slide
      tm = 8000,       // slide time
      xr = 75,         // x radius
      yr = 75,         // y radius
      ss = 20,         // spinner size
      // automatically calculated:
      bw = 2*xr+ss,    // spinnerBox width
      bh = 2*yr+ss,    // spinnerBox height
      dl = 360/ne,     // radial distance between spinner elements
      a1 = 0;          // for calculating start angle

    function windowOnload() {
      var i, e;
      for (i=0; i<ne; ++i) {
        e = document.getElementById('spinner'+i).cbe;
        e.sequence = new Array("ellipse("+xr+","+yr+",0,"+tm+","+a1+","+a2+")");
    //    e.sequence = new Array("ellipse("+xr+","+yr+",0,"+tm+","+a1+","+a2+")", "stopSequence()");
        a1 += dl; a2 += dl;
      }
      window.cbe.addEventListener("resize", init, false);
      init();
    }

    function init() {
      var i, e, m;
      cycle(false);
      with (document.getElementById('spinnerBox').cbe) {
        ele.style.border='1px solid #666';
        background('#ccf');
        resizeTo(bw,bh); //(cw,ch);
        moveTo(document.cbe.width()-width()-30, 30);
        show();
      }
      for (i=0; i<ne; ++i) {
        with (document.getElementById('spinner'+i).cbe) {
          resizeTo(ss, ss);
          moveTo(cp[i]);
          show();
        }
      }
    }

    function cycle(bStart) {
      var i, e;
      for (i=0; i<ne; ++i) {
        e = document.getElementById('spinner'+i).cbe;
        if (bStart) e.startSequence();
        else e.stopSequence();
      }
    }