Scriptable.app widget for displaying the quota of vaccinations in Germany.

vaccinations.js

// Variables used by Scriptable.
// These must be at the very top of the file. Do not edit.
// icon-color: green; icon-glyph: sun;

///////////////////////////////////////////////////////////////////////
// vaccinations.js
// Origin:
// https://gist.github.com/HendrikRunte/4efed5a7f68f73c6c4553742991a58de
// Take it and have fun.
// Hendrik Runte, Jan 16, 2020, 20:48.
//
///////////////////////////////////////////////////////////////////////
// Uses the api.corona-zahlen.org.
// See https://api.corona-zahlen.org/docs/
// Germany only.
///////////////////////////////////////////////////////////////////////
// Helps adding icons from SF Symbols.
function addSymbol({
  symbolName = 'applelogo',
  stack,
  color = Color.orange(),
  size = 20,
}) {
  const icon = stack.addImage(SFSymbol.named(symbolName).image);
  icon.tintColor = color;
  icon.imageSize = new Size(size, size);
}

function displayLoadingIndicator() {
  const listWidget = new ListWidget();

  const gradient = new LinearGradient();
  gradient.locations = [0, 1];
  gradient.colors = [new Color('#000618'), new Color('#121A34')];
  listWidget.backgroundGradient = gradient;

  const iconStack = listWidget.addStack();
  addSymbol({
    symbolName: 'text.bubble',
    stack: iconStack,
    color: Color.orange(),
    size: 32,
  });

  listWidget.addSpacer(10);

  const header = listWidget.addText('Das Widget');
  header.font = Font.lightRoundedSystemFont(FONTSETTINGS.medium);
  header.textColor = Color.orange();

  listWidget.addSpacer(2);

  const footer = listWidget.addText('wird geladen …');
  footer.font = Font.lightRoundedSystemFont(FONTSETTINGS.medium);
  footer.textColor = Color.orange();

  return listWidget;
}

async function retrieveVaccinationStats() {
  const API = 'https://api.corona-zahlen.org/vaccinations';
  try {
    return await new Request(API).loadJSON();
  } catch (e) {
    console.error(e);
  }
}

async function displayVaccinationsWidget(vaccinations) {
  const listWidget = new ListWidget();

  const gradient = new LinearGradient();
  gradient.locations = [0, 1];
  gradient.colors = [new Color('#00095A'), new Color('#001899')];
  listWidget.backgroundGradient = gradient;

  const headingLabel = listWidget.addText(`IMPFDOSEN`);
  headingLabel.font = Font.lightRoundedSystemFont(FONTSETTINGS.small);
  headingLabel.textColor = Color.white();
  headingLabel.leftAlignText();

  if (vaccinations) {
    const quota = Number(
      parseFloat(vaccinations?.data?.quote * 100).toFixed(2)
    );
    const vaccinationsLabel = listWidget.addText(`${quota}%`);
    vaccinationsLabel.font = Font.thinRoundedSystemFont(FONTSETTINGS.big);
    vaccinationsLabel.textColor = Color.orange();
    vaccinationsLabel.leftAlignText();
  }

  const footer = listWidget.addText('Quote');
  footer.font = Font.lightRoundedSystemFont(FONTSETTINGS.small);
  footer.textColor = Color.orange();

  const footer2 = listWidget.addText('Deutschland');
  footer2.font = Font.lightRoundedSystemFont(FONTSETTINGS.small);
  footer2.textColor = Color.orange();

  listWidget.addSpacer(6);

  let df = new DateFormatter();
  df.dateFormat = 'd.M.yyyy';

  const footer3 = listWidget.addText(
    `Stand: ${df.string(new Date(vaccinations.meta.lastUpdate))}`
  );
  footer3.font = Font.lightRoundedSystemFont(FONTSETTINGS.small);
  footer3.textColor = Color.white();

  return listWidget;
}

let widget = {};

const FONTSETTINGS = {
  big: 42,
  medium: 18,
  small: 12,
};

const vaccinations = await retrieveVaccinationStats();

if (vaccinations !== null) {
  widget = await displayVaccinationsWidget(vaccinations);
} else {
  widget = await displayLoadingIndicator();
}

if (!config.runsInWidget) {
  await widget.presentSmall();
}

Script.setWidget(widget);
Script.complete();