My first app for the Bangle watch. an app to draw stuff in your wrist

bangle-sketch.js

var pen = 'circle';
var discard = null;
var kule = [255, 255, 255];
function nextPen () {
  kule[0] = Math.random();
  kule[1] = Math.random();
  kule[2] = Math.random();
  console.log('CURPEN', pen, kule);
  switch (pen) {
    case 'circle': pen = 'pixel'; break;
    case 'pixel': pen = 'crayon'; break;
    case 'crayon': pen = 'square'; break;
    case 'square': pen = 'circle'; break;
    default: pen = 'pixel'; break;
  }
  console.log('set time');
  drawUtil();

  discard = setTimeout(function () { console.log('timeout'); discard = null; }, 500);
}
function drawUtil () {
  g.clearRect(0, 0, 20, 20);
  //  g.setColor(0,0,0);
  g.setColor(kule[0], kule[1], kule[2]);

  g.fillCircle(10, 10, 10);
  g.setColor('#fff');
  g.drawCircle(10, 10, 10);

  switch (pen) {
    case 'circle':
      g.fillCircle(10, 10, 5);
      break;
    case 'square':
      g.fillRect(5, 5, 15, 15);
      break;
    case 'pixel':
      g.setPixel(10, 10);
      g.fillCircle(10, 10, 2);

      break;
    case 'crayon':
      var tap = { x: 10, y: 10, dy: 5, dx: 5 };
      g.drawLine(tap.x, tap.y, tap.x + tap.dx, tap.y + tap.dy);
      g.drawLine(tap.x + 1, tap.y + 2, tap.x + tap.dx, tap.y + tap.dy - 2);
      g.drawLine(tap.x + 2, tap.y + 2, tap.x + tap.dx, tap.y + tap.dy + 2);
      break;
  }
}
var tapTimer = null;
Bangle.on('drag', function (tap) {
  console.log('tap', tap);
  if (tap.b === 0) {
    if (tapTimer !== null) {
      clearTimeout(tapTimer);
      tapTimer = null;
    }
  }
  if (tap.x < 32 && tap.y < 32) {
    if (tap.b === 1) {
      console.log('preTAPTIMER IS NUL');
      if (tapTimer === null) {
        console.log('TAPTIMER IS NUL');
        tapTimer = setTimeout(function () {
          console.log('CLEAAAR');
          g.clear();
          drawUtil();
          tapTimer = null;
        }, 1000);
      }
      if (discard) { clearTimeout(discard); discard = null; return; }

      nextPen();
    }
    return;
  }

  g.setColor(kule[0], kule[1], kule[2]);

  switch (pen) {
    case 'pixel':
      g.setPixel(tap.x, tap.y);
      g.drawLine(tap.x, tap.y, tap.x + tap.dx, tap.y + tap.dy);
      break;
    case 'crayon':
      g.drawLine(tap.x, tap.y, tap.x + tap.dx, tap.y + tap.dy);
      g.drawLine(tap.x + 1, tap.y + 2, tap.x + tap.dx, tap.y + tap.dy - 2);
      g.drawLine(tap.x + 2, tap.y + 2, tap.x + tap.dx, tap.y + tap.dy + 2);
      break;
    case 'circle':
      var XS = (tap.dx < 0) ? 1 : 1;
      var YS = (tap.dy < 0) ? 1 : 1;
      YS *= (tap.dy / tap.dx);
      for (var X = 0; X < Math.abs(tap.dx); X += 3) {
        g.fillCircle(tap.x + 2 + (X * XS), tap.y + 2 + (X * YS), 4, 4);
      }
      break;
    case 'square':
      g.fillRect(tap.x - 10, tap.y - 10, tap.x + 10, tap.y + 10);
      break;
  }
  drawUtil();
});

g.clear();
drawUtil();