I couldn't believe how tough it was to figure out a decent countdown.

With Rocky.js and CloudPebble I got to build my first Pebble WatchFace without having to learn C or whatever it’s normally built in. And OK, Pebble and CloudPebble are dead - but you can still buy the watches on Amazon and DIY a CloudPebble server (Rebble.io) if you really want to impress chicks. (WARNING: will not impress chicks.) The only WatchFace I use has been the original text watch face (and now there are a lot of them out there), but I kinda wanted to build my own (and I love the Zork calendar, so I wanted to add that too). Because Rocky.js helps port JavaScript to C, it doesn’t allow for all the regular commands I would use for JavaScript (like d.getFullYear() % 4 != 1 to get see if the year is divisible by 4), but you get the idea. This isn't the whole project, but it is enough code to get you started.

							
var rocky = require('rocky');

// -- TIME TO TEXT
function tHour(n){
  var arr = ['twelve','one','two','three','four','five','six','seven','eight','nine','ten','eleven','twelve','one','two','coffee','four','five','six','seven','eight','nine','ten','eleven'];
  return arr[n];  
}

function tMin(n){
  var arr = [' ','one','two','three','four','five','six','seven','eight','nine',
            'ten','eleven','twelve','thir\nteen','four\nteen','quarter\nafter','sixteen','seven\nteen','eigh\nteen','nine\nteen',
            'twenty','twenty one','deuce deuce','twenty three','twenty four','twenty five','twenty six','twenty seven','twenty eight','twenty nine',
            'half\npast','thirty one','thirty two','thirty three','thirty four','thirty five','thrity six','thrity seven','thrity eight','thrity nine',
            'forty','forty one','forty two','forty three','forty four','quarter\n`till','forty six','forty seven','forty eight','forty nine',
            'fiddy','fifty one','fifty\ntwo','fifty three','fifty\nfour','fifty\nfive','fifty\nsix','fifty seven','fifty eight','fifty\nnine'
            ];
  return arr[n];
}

function tColor(n){
  // https://developer.pebble.com/guides/tools-and-resources/color-picker/#55AAAA
  var arr = ['#AA00FF','#FF55FF','#FF0055','#FF0000','#FF5500','#FFAAFF',
             '#FF5555','#FFAAAA','#FFAA00','#FFAA55','#FFFF55','#FFFFAA',
             '#AAFF00','#AAFFFF','#00FFAA','#00FFFF','#55AA55','#55AAAA',
             '#00AAAA','#00AAFF','#55AAFF','#0055FF','#5555FF','#5555AA'];
  return arr[n];
}

function firstDay(m,x){ 
  // find the first DAY of the month 
  // 	m = month 
  // 	x = 1st day of the week you are looking for Monday/Tuesday/etc
  // 	v = voting year, can only vote on 2-8 cannot vote on a first
  var d = new Date();
  var arr = [];
  d.setMonth(m);
  d.setDate(1);
  var y = d.getFullYear();
  var month = d.getMonth();
// Get the first Monday? in the month
  var f = '';
// Get 1st xday ni the month  
	while (d.getDay() !== x) {
      d.setDate(d.getDate() +1 );
  }
	
// Get all the other Xdays in the month
    while (d.getMonth() === month) {
        arr.push(new Date(d.getTime()));
        d.setDate(d.getDate() + 7);
    }	
	
	// voting year check
	var vl = (y.toString().substr(2))/4;
 	var vote = (!vl.toString().indexOf("."));
	
	if( vote && m==10 && arr[0].getDate()<2){ // checking for voteing year
		f = arr[1].getDate();
	}else{
		f = arr[0].getDate();
	}
	
  return m+""+f;
}
	
function zork(){
	
  var d = new Date();
  var mm = ['Estuary','Frobuary','Arch','Oracle','Mage','Jam','Jelly','Augur','Suspendur','Ottobur','Mumberbur','Desmembur'];
  
  var mo = d.getMonth();
  var dd = d.getDate();
  var yy = d.getFullYear();	
	var mx = mo+""+dd;
  
  var holidayCheck = mo+""+dd;
  var dateReturn = "";
  
  switch (holidayCheck){
    case '01':
      dateReturn = "Entharion Day";
      break;
    case '13':
      dateReturn = "Undergroundhog's Day";
      break;
    case '129':
      dateReturn = "Antharia Leap Week";
      break;
    case '211':
      dateReturn = "St. Balhu's Day";
      break;
    case '33':
      dateReturn = "King Wurb's Birthday";
      break;
    case '34':
      dateReturn = "St. Foobus' Day";
      break;
    case '322':
      dateReturn = "Coronation Day";
      break;
    case '40':
      dateReturn = "Zero Day";
      break;
    case '41':
      dateReturn = "Mage Day";
      break;
    case '431':
      dateReturn = "St. Honko's Day";
      break;
    case '64':
      dateReturn = "Filfre Day";
      break;
    case '625':
      dateReturn = "St. Quakko's Day?";
      break;
    case '76':
      dateReturn = "St. Bovus' Day";
      break;
// -- Labor day
    case '96':
      dateReturn = "St. Wiskus' Day";
      break;
    case '931':
      dateReturn = "Halloween";
      break;
 // -- VOTE TODAY
    case '1011':
      dateReturn = "Veterinarian's Day";
      break;
    case '1014':
      dateReturn = "Curse Day";
      break;
    case '1125':
      dateReturn = "Christmas";
      break; 
    default:
       dateReturn = "Day "+dd+", "+mm[mo];
  }
 
  // find labor day
  if(mx==firstDay(8,1)){ // -- 1st monday september
      dateReturn = "Leisure Day";
  }
 
  // find voting day
  if(mx==firstDay(10,2)){ // -- 1st? tuesday november
        dateReturn = "VOTE DAY";
  }
    
  // -- return date
  return dateReturn+", "+yy;
}

// -- DRAW EVENT

rocky.on('draw', function(event) {
  // Get the CanvasRenderingContext2D object
  var ctx = event.context;
  var cth = event.context;
  var ctm = event.context;
  var ctd = event.context;
  // Clear the screen
  ctx.clearRect(0, 0, ctx.canvas.clientWidth, ctx.canvas.clientHeight);
  cth.clearRect(0, 0, ctx.canvas.clientWidth, ctx.canvas.clientHeight);
  ctm.clearRect(0, 0, ctx.canvas.clientWidth, ctx.canvas.clientHeight);
  ctd.clearRect(0, 0, ctx.canvas.clientWidth, ctx.canvas.clientHeight);
  
  // Determine the width and height of the display
  var w = ctx.canvas.unobstructedWidth;
  var h = ctx.canvas.unobstructedHeight;
  
  // Current date/time
  var d = new Date();
  var th = d.getHours();
  var tm = d.getMinutes();
  var lv = 0; // light text vertical
  var bv = 0; // bold text vertical
  var wv = 3; // horizontal space
  var lt = ''; // light text 
  var bt = ''; // bold text
    
  // make the text fancy
  // https://developer.pebble.com/docs/rockyjs/CanvasRenderingContext2D/#font
  
  if(tm == '15' || tm == '30' || tm == '45'){
    bv = 80;
    bt = tHour(th);
    lv = 0;
    lt = tMin(tm);
  }else if(tm=='0'&&th=='0'){
    bv = 60;
    bt = "mid night";
    lv = 0;
    lt = "";
  }else if(tm=='0'&&th=='12'){
    bv = 60;
    bt = "noon";
    lv = 0;
    lt = "";
  }else if(tm=='20'&&th=='16'){
    bv = 60;
    bt = "Tea Time";
    lv = 0;
    lt = "";
  }else{
    bv = 10;
    bt = tHour(th);
    lv = 50;
    lt = tMin(tm);
  }
  
  cth.fillStyle = tColor(th);
  cth.font = '42px bold Bitham';
  cth.textAlign = 'left';
  cth.fillText(bt, wv, bv, w);

  ctm.fillStyle = 'white';
  ctm.font = '42px light Bitham';
  ctm.textAlign = 'left';
  ctm.fillText(lt, wv, lv, w);
  
  ctd.fillStyle = 'gray';
  ctd.font = '14px Gothic';
  ctd.textAlign = 'center';
  ctd.fillText(zork(), w/2, h-20, w);

});

// -- TIME CHANGE EVENTS

rocky.on('minutechange',function(event){
  // Display a message in the system logs
  //console.log("Another minute with your Pebble!");

  // Request the screen to be redrawn on next pass
  rocky.requestDraw();
});