View xkcd comics with ease! With a reload button too!

xkcdcomicviewer.js

// Variables used by Scriptable.
// These must be at the very top of the file. Do not edit.
// icon-color: teal; icon-glyph: list-alt;
function resolveAfter2Seconds() {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
		resolve('resolved')
    }, 2000);
  });
}

	


function getRandomInt(min, max) {
min = Math.ceil(min);
max = Math.floor(max);
return Math.floor(Math.random() * (max - min + 1)) + min;
};

function sleep(milliseconds) {
  const date = Date.now();
  let currentDate = null;
  do {
    currentDate = Date.now();
  } while (currentDate - date < milliseconds);
}



const req = new Request('https://www.xkcd.com/info.0.json');
const out = await req.loadJSON();
const max = out['num'];
	

	
async function load() {	

	const number = getRandomInt(0, max);
	const imgreq = new Request('http://www.xkcd.com/' + number + '/info.0.json');
	
	const imgres = await imgreq.loadJSON();
	console.log(imgres)
	
	const img1 = imgres['img'];
	
	const imgf = new Request(img1);
	const img = await imgf.loadImage();
	
	
	
	
	const ui = new UITable();
	ui.removeAllRows();
	let rw = new UITableRow();
	ui.addRow(rw);
	rw.backgroundColor = new Color('#FFFFFF', 100);
	
	console.log(imgres['title']);
	let text = rw.addText(imgres['title'] + ' - xkcd comic viewer - Posted on: ' + imgres['month'] + '/' + imgres['day'] + '/' + imgres["year"]);
	text.titleColor = new Color('#828282', 100);
	
	
	let btn = rw.addButton('🔄 Reload');
	btn.rightAligned();
	
	btn.onTap = () => {
		btn.titleColor = new Color('#0a84ff', 50)
		sleep(300)
		btn.titleColor = new Color('#0a84ff', 100)
		load()
	}
	
	// comic here
	
	const comicrw = new UITableRow()
	ui.addRow(comicrw)
	
	comicrw.height = 700
	
	const holygrail = comicrw.addImage(img)
	
	holygrail.centerAligned()
	
	
	
	ui.present(true);

}

load()