bangle-rounding.js

Bangle.setLCDMode("120x120");

var vs2 = function(x,y,x2,y2,p) { // vertices for for chk like shapes ('beveled') corners
 // 4 'beveled corners' = 8 corners defined by 0 and p insetting combinations for x, y
 return [x,y+p, x+p,y, x2-p,y, x2,y+p, x2,y2-p, x2-p,y2, x+p,y2, x,y2-p]; };
function onInit() {
  `prep display`
  g.clear(); setTimeout(()=>{
  g.setColor(0);
  g.fillRect(0,0,127,63); // canvas (color 0)
  `beveled squares and rectangles drawn and filled with polygon (color 0)`
  g.setColor("#FFFFFF");
  g.fillRect(8,8,40,53); // frame filled (color 1)
  g.setColor(0);
  g.drawPoly(vs2(10,10,18,18,1),1); // 9x 9 draw beveled [1] for x and y
  g.drawPoly(vs2(21,10,38,18,1),1); // 9x19 draw beveled [1] for x and y
  g.fillPoly(vs2(10,21,18,29,1),1); // 9x 9 fill beveled [1] for x and y
  g.fillPoly(vs2(21,21,38,29,1),1); // 9x19 fill beveled [1] for x and y
  g.drawPoly(vs2(10,32,18,40,2),1); // 9x 9 draw beveled [2] for x and y
  g.drawPoly(vs2(21,32,38,40,2),1); // 9x19 draw beveled [2] for x and y
  g.fillPoly(vs2(10,43,18,51,2),1); // 9x 9 fill beveled [2] for x and y
  g.fillPoly(vs2(21,43,38,51,2),1); // 9x19 fill beveled [2] for x and y
  `beveled squares w/ borders done with overlaying filled polygon`
  g.setColor("#FFFFFF"); 
  g.fillRect(45,8,57,53); // frame filled (color 1)
  g.setColor(0);
  g.fillPoly(vs2(47,21,55,29,1),1); // underlaying beveled [1] square separate (color 0)
  g.fillPoly(vs2(47,43,55,51,1),2); // underlaying beveled [2] rectangle separate (color 0)
  g.setColor("#FFFFFF");
  g.drawRect(62,8,74,53); // frame hallow (0 from canvas)
  g.setColor("#FFFFFF");
  g.fillPoly(vs2(65,22,71,28,1),1); // overlaying beveled [1] square separate (color 1)
  g.fillPoly(vs2(65,44,71,50,1),2); // overlaying beveled [2] rectangle separate (color 1)
  g.setColor("#FFFFFF"); 
  g.fillRect(79,8,91,53); // frame filled (color 1)
  g.setColor(0);
  g.fillPoly(vs2(81,21,89,29,1),1); // underlaying beveled [1] square combined (color 0)
  g.fillPoly(vs2(81,43,89,51,1),2); // underlaying beveled [2] rectangle combined (color 0)
  g.setColor("#FFFFFF");
  g.fillPoly(vs2(82,22,88,28,1),1); // overlaying beveled [1] square combined (color 1)
  g.fillPoly(vs2(82,44,88,50,1),2); // overlaying beveled [2] rectangle combined (color 1)
  g.flip();
  },999);
}
setTimeout(onInit,999); // for dev'n, remove for upload before save()