XSpinner/XSpinner.js

   1 /* Copyright 2011 The Dominion of Awesome
   2  * See COPYING for licensing information */
   3 enyo.kind({
   4         name: "XSpinner",
   5         kind: "Hack",
   6         style: "background-color: black; color: #00FF00; font-family: Courier, sans-serif; font-size: 12px",
   7         pack: "center",
   8         align: "center",
   9         components: [
  10                 {style: "border: 2px solid green; padding: 4px", components: [
  11                         {name: "terminal", nodeTag: "pre", style: "margin: 0"},
  12                         {nodeTag: "pre", style: "margin: 0",
  13 content: "SESSION 1      80x24                                           CAPS NUM SCR <span style=\"color: black; background-color: #00FF00\" id=\"spinner_blinker\">RAVE</blink>"}
  14                 ]}
  15         ],
  16         create: function() {
  17                 this.inherited(arguments);
  18                 this.w = 80;
  19                 this.h = 24;
  20                 this.delay = 20;
  21                 this.rate = 360.0 / 1000.0;
  22                 this.cw = this.w / 2;
  23                 this.ch = this.h / 2;
  24         },
  25         rendered: function() {
  26                 this.terminal = this.$.terminal.hasNode();
  27                 this.blinker = document.getElementById('spinner_blinker');
  28                 this.blink_active = true;
  29                 this.spinner();
  30         },
  31         start: function() {
  32                 if (!this.timer) {
  33                         this.timer = setInterval(this.spinner.bind(this), this.delay);
  34                         this.blinkerTimer = setInterval(this.blink.bind(this), 500);
  35                 }
  36         },
  37         stop: function() {
  38                 clearInterval(this.timer);
  39                 clearInterval(this.blinkerTimer);
  40                 this.timer = null;
  41                 this.blinkerTimer = null;
  42         },
  43         spinner: function() {
  44                 // Get date
  45                 var ms = (new Date()).getMilliseconds();
  46                 var r = ms * this.rate;
  47                 var a = Math.tan((r / 180.0) * Math.PI);
  48                 var b = Math.tan(((r+90) / 180.0) * Math.PI);
  49
  50                 var t = '';
  51                 for (var j=0; j < this.h; j++) {
  52                         for (var i=0; i < this.w; i++) {
  53                                 if ((r > 90 && r <= 180) || (r > 270 && r < 360) || r == 0) {
  54                                         if ((j-this.ch) * 2 > a * (i-this.cw) && (j-this.ch) * 2 < b * (i-this.cw) ||
  55                                             (j-this.ch) * 2 < a * (i-this.cw) && (j-this.ch) * 2 > b * (i-this.cw) ) {
  56                                                 t += '*';
  57                                         } else {
  58                                                 t += ' ';
  59                                         }
  60                                 } else {
  61                                         if ((j-this.ch) * 2 > a * (i-this.cw) && (j-this.ch) * 2 > b * (i-this.cw) ||
  62                                             (j-this.ch) * 2 < a * (i-this.cw) && (j-this.ch) * 2 < b * (i-this.cw) ) {
  63                                                 t += '*';
  64                                         } else {
  65                                                 t += ' ';
  66                                         }
  67                                 }
  68                         }
  69                         t += "\n";
  70                 }
  71                 this.terminal.innerHTML = t;
  72         },
  73         blink: function() {
  74                 if (this.blink_active)
  75                         this.blinker.style.color = '#00FF00';
  76                 else
  77                         this.blinker.style.color = 'black';
  78                 this.blink_active = !this.blink_active;
  79         }
  80 });