urbek.ipynb

{
 "cells": [
  {
   "cell_type": "code",
   "execution_count": 1,
   "id": "32f1954e",
   "metadata": {
    "hideCode": false,
    "hidePrompt": false
   },
   "outputs": [],
   "source": [
    "import os\n",
    "import re\n",
    "import json\n",
    "import UnityPy\n",
    "from collections import defaultdict\n",
    "from datetime import datetime"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 2,
   "id": "8594af62",
   "metadata": {
    "hideCode": false,
    "hidePrompt": false,
    "scrolled": true
   },
   "outputs": [
    {
     "data": {
      "text/plain": [
       "'2023-11-10'"
      ]
     },
     "execution_count": 2,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "# game data folder location\n",
    "urbek_data = r\"C:\\Steam\\steamapps\\common\\Urbek\\Urbek_Data\\resources.assets\"\n",
    "modified_date = datetime.fromtimestamp(os.path.getmtime(fr\"{urbek_data}\")).strftime('%Y-%m-%d')\n",
    "modified_date"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 3,
   "id": "30c87bfb",
   "metadata": {
    "hideCode": false,
    "hidePrompt": false
   },
   "outputs": [],
   "source": [
    "# utils\n",
    "gray = lambda x: f'<span class=\"gray\">{x}</span>'\n",
    "gray_self = lambda x, codeName: str(x).replace(f\"'{codeName}'\", gray(f\"'{codeName}'\"))\n",
    "plus_minus = lambda x: f'<span class=\"plus\">+{x}</span>' if x > 0 else f'<span class=\"minus\">{x}</span>' if x < 0 else '0'\n",
    "more_less = lambda biggerThan, x: str(x) if biggerThan else f'<span class=\"less\">{\"\" if str(x)[0] == \"0\" else \"≤\"}{x}</span>'\n",
    "extracted = lambda x: f'<span class=\"extracted\">{x}</span>'\n",
    "tr = lambda arr: ''.join(f'<tr class=\"{cls}\">{i}</tr>' for i, cls in arr)\n",
    "th = lambda arr: ''.join(f'<th>{i}</th>' for i in arr)\n",
    "td = lambda arr: ''.join(f'<td>{i}</td>' for i in arr)\n",
    "apos = lambda x: str(x).replace(\"'\", \"‛\")\n",
    "translate = lambda x, lang='en': f'<span class=\"translate\" title=\\'{apos(json.dumps(x, indent=2, ensure_ascii=False))}\\'>{x.get(lang, \"?\")}</span>'\n",
    "option = lambda arr: ''.join(f\"<option>{i}</option>\" for i in arr)"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 4,
   "id": "e06a5d35",
   "metadata": {
    "hideCode": false,
    "hidePrompt": false
   },
   "outputs": [
    {
     "data": {
      "text/plain": [
       "['en', 'es', 'fr', 'zh-CN', 'pl', 'de', 'pt', 'ru', 'ja', 'it', 'ko']"
      ]
     },
     "execution_count": 4,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "# load data file from game installation\n",
    "env = UnityPy.load(urbek_data)\n",
    "\n",
    "rules = {}\n",
    "translations = {}\n",
    "for obj in env.objects:\n",
    "    if obj.type.name != \"TextAsset\": continue\n",
    "    data = obj.read()\n",
    "    # download json files for browsing:\n",
    "    os.makedirs(\"./data\", exist_ok=True)\n",
    "    if data.name == \"gameValues\":\n",
    "        for item in json.loads(data.text):\n",
    "            del item[\"INFO\"]\n",
    "            translations[item[\"id\"]] = item\n",
    "    elif re.match(r\"reglasBioma_\\d$\", data.name) and \\\n",
    "       re.search(r\"localVariables\", data.text):\n",
    "        rules[data.name] = json.loads(data.text)\n",
    "    else:\n",
    "        continue\n",
    "    with open(f\"./data/{data.name}.json\", \"wb\") as f:\n",
    "        f.write(data.script)\n",
    "del env, obj, data\n",
    "\n",
    "# explore list of languages\n",
    "languages = [i for i in translations[\"resources_comida\"].keys() if i not in ['id', 'INFO']]\n",
    "languages"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 5,
   "id": "5b9cde8f",
   "metadata": {
    "hideCode": false,
    "hidePrompt": false
   },
   "outputs": [
    {
     "data": {
      "text/plain": [
       "{'reglasBioma_0': 'Temperate',\n",
       " 'reglasBioma_1': 'Desert',\n",
       " 'reglasBioma_2': 'Archipelago',\n",
       " 'reglasBioma_3': 'Forest',\n",
       " 'reglasBioma_4': 'Ruins',\n",
       " 'reglasBioma_5': 'Snow',\n",
       " 'reglasBioma_6': 'Temperate'}"
      ]
     },
     "execution_count": 5,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "labels = dict((k, v)\n",
    "              for k, v in translations.items()\n",
    "              if not re.search(r\"text|desc|name|effect|t_|nr_\", k))\n",
    "\n",
    "# explore list of (non-empty) biomes\n",
    "biomes = dict(sorted([(k, re.sub(r\"<b>|</b>[\\s\\S]*\", \"\", v[\"description\"])) for k, v in rules.items()]))\n",
    "biomes"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 6,
   "id": "91f175cf",
   "metadata": {
    "hideCode": false,
    "hidePrompt": false
   },
   "outputs": [],
   "source": [
    "biomes[\"reglasBioma_5\"] = \"Mountains DLC\"\n",
    "biomes[\"reglasBioma_6\"] = \"War DLC\"\n",
    "\n",
    "columns_resources = {}\n",
    "columns_lv = {}\n",
    "for biome, biome_label in biomes.items():\n",
    "    data = rules[biome]\n",
    "    columns_resources |= {item.split(',')[0]: 1 for item in data[\"resources\"]}\n",
    "    columns_lv |= {item.split(',')[0]: 1 for item in data[\"localVariables\"]}\n",
    "columns_resources = columns_resources.keys()\n",
    "columns_lv = columns_lv.keys()\n",
    "\n",
    "buildings = []\n",
    "order_map = {}\n",
    "index = 0\n",
    "prev_population = 0\n",
    "for biome, biome_label in biomes.items():\n",
    "    data = rules[biome]\n",
    "    updatesFromDict = defaultdict(list)\n",
    "    for building in data[\"construs\"]:\n",
    "        if up := building.get('updates'):\n",
    "            for u in up:\n",
    "                updatesFromDict[u].append(building['codeName'])\n",
    "\n",
    "    for building in data[\"construs\"]:\n",
    "        category = building.get('category')\n",
    "        if category == 'camino' and not building.get('cost'): continue\n",
    "        \n",
    "        category = translate(labels.get(f'bg_{category}', {\"id\": category})) if category else \"\"\n",
    "        codeName = building['codeName']\n",
    "        region_nr = building.get('region')\n",
    "        region = translate(labels[f'reg_{region_nr}']) if region_nr else \"\"\n",
    "        \n",
    "        label_all = labels.get(f'b_{codeName}', {})\n",
    "        label = label_all.get('en', '???')\n",
    "        distanceToRoad = building.get('distanceToRoad', '')\n",
    "        if distanceToRoad == 3:\n",
    "            distanceToRoad = gray(distanceToRoad)\n",
    "        \n",
    "        updates = gray_self(building.get('updates', ''), codeName)\n",
    "        updatesFrom = gray_self(updatesFromDict.get(codeName, ''), codeName)\n",
    "        buildingsNeeded = [more_less(x['biggerThan'], f\"{x['q']} {x['building']} ⊙{x['radio'] if x['radio'] else '∞'}\")\n",
    "                           for x in building.get('buildingsNeeded')\n",
    "                          ] if building.get('buildingsNeeded') else ''\n",
    "        unblock = [f\"{x['q']} {x.get('gloVar', x.get('nBuildings', '?'))}\"\n",
    "                   for x in building.get('unblock')\n",
    "                  ] if building.get('unblock') else ''\n",
    "        unblock_population = [x['q']\n",
    "                              for x in building.get('unblock') if x.get('gloVar') == 'poblacion'\n",
    "                             ] if building.get('unblock') else [0]\n",
    "        cost = [f\"{x['q']} {x.get('rec')}\"\n",
    "                for x in building.get('cost')\n",
    "               ] if building.get('cost') else ''\n",
    "        minModels = min([re.sub(r\"^[^,]*,|,E?$\", \"\", x) for x in building.get('models') if x\n",
    "                        ]) if building.get('models') else ''\n",
    "        if minModels == '1,1':\n",
    "            minModels = gray(minModels)\n",
    "        byBuilding = '🏠' if building.get('byBuilding') else ''\n",
    "\n",
    "        lvn = [next((more_less(\n",
    "            x['biggerThan'],\n",
    "            f\"{gray(x['q']) if x['q'] == 1 else x['q']}\"\n",
    "            f\"{'□ ' + str(x['threshold']).rjust(2) if 'threshold' in x else ''}\"\n",
    "            f\" ⊙{x['radio']}\"\n",
    "            ) for x in building.get('localVariablesNeeded', []) if x['localVariable'] == col), \"\")\n",
    "              for col in columns_lv]\n",
    "        lv = [next((plus_minus(x['q'])\n",
    "                     for x in building.get('localVariables', [])\n",
    "                     if x['locVar'] == col), \"\")\n",
    "              for col in columns_lv]\n",
    "        rn = [next((more_less(x['biggerThan'], f\"{x['q']} ⊙{x['radio']}\")\n",
    "                    for x in building.get('resourcesNeeded', [])\n",
    "                    if x['resource'] == col), \"\")\n",
    "              for col in columns_resources]\n",
    "        rx = [next((extracted(f\"-{x['q']} ⊙{x['distance']}\")\n",
    "                    for x in ([building.get('resourceExtraction')] if building.get('resourceExtraction') else [])\n",
    "                    if x['resource'] == col), \"\")\n",
    "              for col in columns_resources]\n",
    "        r = [next((plus_minus(x['q'])\n",
    "                   for x in building.get('produces', [])\n",
    "                   if x['rec'] == col), \"\")\n",
    "             for col in columns_resources]\n",
    "\n",
    "        lvnlv = [f\"{a}{' '+b.rjust(3) if b else ''}\" for a, b in zip(lvn, lv)]\n",
    "        rnrxr = [f\"{a}{' '+b.rjust(3) if b else ''}{' '+c.rjust(3) if c else ''}\" for a, b, c in zip(rn, rx, r)]\n",
    "        \n",
    "        if any([updates, unblock, *rn, *rx, *r, *lvn, *lv]):\n",
    "            if len(unblock_population):\n",
    "                unblock_population = unblock_population[0]\n",
    "                prev_population = unblock_population   \n",
    "            else:\n",
    "                unblock_population = prev_population\n",
    "            if codeName not in order_map:\n",
    "                order_map[codeName] = 1000 * unblock_population + index\n",
    "                index += 1\n",
    "            buildings.append([biome_label,\n",
    "                              translate(label_all),\n",
    "                              distanceToRoad,\n",
    "                              minModels,\n",
    "                              byBuilding,\n",
    "                              *lvnlv,\n",
    "                              *rnrxr,\n",
    "                              codeName,\n",
    "                              region,\n",
    "                              buildingsNeeded,\n",
    "                              unblock,\n",
    "                              cost,\n",
    "                              updatesFrom,\n",
    "                              updates,\n",
    "                              category,\n",
    "                              order_map[codeName],\n",
    "                             ])\n",
    "\n",
    "buildings.sort(key=lambda i: i[-1])\n",
    "# visualize buildings\n",
    "columns = [\"Biome\", \"Building name\", \"distanceToRoad\", \"smallest size\", \"byBuilding\",\n",
    "           *[f\"{translate(labels[f'lv_{c}'])}  ({gray(c)})\" for c in columns_lv],\n",
    "           *[f\"{translate(labels[f'resources_{c}'])}  ({gray(c)})\" for c in columns_resources],\n",
    "           \"codeName\", \"region\", \"buildingsNeeded\", \"unblock\", \"cost\", \"updatesFrom\", \"updates\", \"category\",\n",
    "          ]\n",
    "\n",
    "search = [\n",
    "    f'<select>{option([\"\", *biomes.values()])}</select>',\n",
    "    '<input>', '', '',\n",
    "    *['<input type=\"checkbox\">'] * (len(columns_lv) + len(columns_resources) + 1),\n",
    "    '<input>', '<input type=\"checkbox\">', *['<input>'] * 6,\n",
    "]"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 7,
   "id": "a177fb25-e2eb-4fbd-8b83-6b56704da053",
   "metadata": {},
   "outputs": [],
   "source": [
    "html = \"\"\"\n",
    "<!DOCTYPE html>\n",
    "<html>\n",
    "<head>\n",
    "  <meta charset=\"utf-8\">\n",
    "  <title>Urberk buildings</title>\n",
    "  <meta name=\"viewport\"\n",
    "        content=\"width=device-width, height=device-height, initial-scale=1.0, minimum-scale=1.0\">\n",
    "  <style>\n",
    "  * {\n",
    "      box-sizing: border-box;\n",
    "  }\n",
    "  body {\n",
    "      margin: 0 0 60px;\n",
    "      color: white;\n",
    "      font: .9rem sans-serif;\n",
    "      background: #252525;\n",
    "      width: fit-content;\n",
    "  }\n",
    "  .intro {\n",
    "      position: sticky;\n",
    "      left: 0;\n",
    "      width: 100vw;\n",
    "  }\n",
    "  table {\n",
    "      position: relative;\n",
    "      border-collapse: collapse;\n",
    "  }\n",
    "  @media (min-height: 600px) {\n",
    "      thead {\n",
    "          position: sticky;\n",
    "          top: 0;\n",
    "          z-index: 1;\n",
    "      }\n",
    "  }\n",
    "  thead tr {\n",
    "      background: black;\n",
    "  }\n",
    "  thead tr:first-child {\n",
    "      height: 225px;\n",
    "  }\n",
    "  thead th {\n",
    "      white-space: pre;\n",
    "      vertical-align: bottom;\n",
    "      text-align: left;\n",
    "      padding: 5px 5px 0;\n",
    "  }\n",
    "  thead td {\n",
    "      padding: 0 5px 5px;\n",
    "  }\n",
    "  thead input,\n",
    "  thead select {\n",
    "      width: 100%;\n",
    "      padding: 0;\n",
    "  }\n",
    "  thead tr th:nth-child(n+3):not(:nth-last-child(-n+8)) {\n",
    "      transform-origin: bottom left;\n",
    "      transform: translateX(20px) rotate(-60deg);\n",
    "      max-width: 20px;\n",
    "  }\n",
    "  tbody tr {display: none;}\n",
    "  tr {background: #333}\n",
    "  tr.even {background: #222}\n",
    "  tr:hover {background: black}\n",
    "  tr.T td:nth-child(2) {color: yellowgreen}\n",
    "  tr.D td:nth-child(2) {color: goldenrod}\n",
    "  tr.A td:nth-child(2) {color: dodgerblue}\n",
    "  tr.F td:nth-child(2) {color: forestgreen}\n",
    "  tr.R td:nth-child(2) {color: rosybrown}\n",
    "  tr.M td:nth-child(2) {color: white; text-shadow: 0 0 2px #fffa}\n",
    "  tr.W td:nth-child(2) {color: red}\n",
    "  td {\n",
    "      white-space: pre;\n",
    "      border-left: 1px dotted #444;\n",
    "      padding: 5px;\n",
    "  }\n",
    "  @media (min-width: 600px) {\n",
    "      th:nth-child(1),\n",
    "      td:nth-child(1),\n",
    "      th:nth-child(2),\n",
    "      td:nth-child(2) {\n",
    "          position: sticky;\n",
    "          left: 14px;\n",
    "          background: inherit;\n",
    "      }\n",
    "      th:nth-child(1) {\n",
    "          left: -60px;\n",
    "          z-index: 1;\n",
    "          min-width: 105px;\n",
    "      }\n",
    "      th:nth-child(2) {\n",
    "          z-index: 1;\n",
    "      }\n",
    "      td:nth-child(1) {\n",
    "          left: 0;\n",
    "          font-family: monospace;\n",
    "      }\n",
    "  }\n",
    "  tbody td:nth-child(n+3) {\n",
    "      text-align: right;\n",
    "      font-family: monospace;\n",
    "  }\n",
    "  tbody td:nth-last-child(-n+8) {\n",
    "      text-align: left;\n",
    "      max-width: 250px;\n",
    "      overflow: hidden;\n",
    "      white-space: nowrap;\n",
    "      text-overflow: ellipsis;\n",
    "      line-height: 1.2;\n",
    "  }\n",
    "  tbody td:nth-last-child(-n+6):not(:last-child):hover {\n",
    "      position: absolute;\n",
    "      white-space: pre-wrap;\n",
    "      background: black;\n",
    "  }\n",
    "  h1 { margin: 15px 14px; }\n",
    "  p, dt { margin-left: 15px; }\n",
    "  dd { font-family: monospace; }\n",
    "  a { color: goldenrod; transition: text-decoration-color 200ms; }\n",
    "  a:hover { text-decoration-color: orange; }\n",
    "  .gray { color: #999; font-weight: normal; }\n",
    "  .less { color: goldenrod; }\n",
    "  .plus { color: #7f7; }\n",
    "  .minus { color: #f66; }\n",
    "  .extracted { color: #d6f; }\n",
    "  </style>\n",
    "</head>\"\"\" + f\"\"\"\n",
    "<body>\n",
    "  <div class=\"intro\">\n",
    "    <h1>\n",
    "      List of buildings from\n",
    "      <a href=\"https://store.steampowered.com/app/1411740/Urbek_City_Builder/\">\n",
    "        Urbek&nbsp;City&nbsp;Builder\n",
    "      </a>\n",
    "    </h1>\n",
    "    <p>This is a fan-made page. Game data extracted with UnityPy, from <i>reglasBioma_*</i>\n",
    "      TextAsset files inside <i>resources.assets</i> ({modified_date}).\n",
    "    <br>© Copyright of game by Estudios Kremlinois (developer) and RockGame S.A. (publisher).\n",
    "    <br>© Copyright of this tool (but not game data) by Peter Hozák under MIT License,\n",
    "      <a href=\"https://github.com/Aprillion/urbek\">https://github.com/Aprillion/urbek</a>.\n",
    "\n",
    "    <p><b>How to read the table:</b>\n",
    "    <dl>\n",
    "      <dt>Village house needs 15 squares with 6 residents or more (on each square) within radius 3\n",
    "          (7x7 area with house in the centre), and produces 8 residents:\n",
    "          <dd>15□  6 ⊙3 <span class=\"plus\">+8</span>\n",
    "      <dt>Villa needs 25 residents or less within radius 4, and produces 6 residents per square\n",
    "          (24 in total):\n",
    "          <dd><span class=\"less\">≤25 ⊙4 <span class=\"plus\">+6</span></span>:\n",
    "      <dt>Minimarket consumes 200 Food:\n",
    "          <dd><span class=\"minus\">-200</span>\n",
    "      <dt>Lumbercamp extracts 10 natural resources from trees within radius 5, and produces 15 wood:\n",
    "          <dd><span class=\"extracted\">-10 ⊙5</span> <span class=\"plus\">+15</span>\n",
    "      <dt>Rebel house needs that no other Rebel houses and no Police stations are within radius 5:\n",
    "          <dd>['<span class=\"less\">0 rebelde ⊙5</span>', '<span class=\"less\">0 pacos ⊙5</span>']\n",
    "    </dl>\n",
    "    <br>\n",
    "    <p>Use <b>SHIFT+scroll</b> for horizontal scrolling on desktop.\n",
    "      On mobile, you can tap a row to highlight it before scrolling (and/or rotate screen).\n",
    "    <p>\n",
    "      <label>Select game language: <select id=\"lang\" data-prev=\"en\" autocomplete=\"off\">{option(languages)}</select></label>\n",
    "      <a href=\"#?\"><i>Reset all filters</i></a>\n",
    "  </div>\n",
    "  <table>\n",
    "    <thead>\n",
    "      <tr>{th(columns)}</tr>\n",
    "      <tr>{td(search)}</tr>\n",
    "    </thead>\n",
    "    {tr((td(b[:-1]), b[0][0]) for b in buildings)}\n",
    "  </table>\"\"\" + \"\"\"\n",
    "  <script>\n",
    "    const inputEls = [...document.querySelectorAll('thead input, thead select')]\n",
    "    const filterFieldEntries = [...document.querySelector('thead tr:nth-child(2)').children]\n",
    "      .map((td, i) => ([`c${i}`, td.children[0]]))\n",
    "      .filter(([_, el]) => el)\n",
    "    const filterFields = Object.fromEntries(filterFieldEntries)\n",
    "    let rows\n",
    "    \n",
    "    if (!location.hash) location.hash = '?c0=Temperate,'\n",
    "    else if (!location.hash.match(',$')) location.hash += ','\n",
    "    updateFromHash(location.hash.slice(2))\n",
    "    window.addEventListener(\"hashchange\", () => updateFromHash(location.hash.slice(2)))\n",
    "    document.addEventListener(\"change\", handleChange)\n",
    "    \n",
    "    function handleChange(ev) {\n",
    "      const el = ev.target\n",
    "      if (el.id) {\n",
    "        const v = ev.target.value\n",
    "        location.hash = v === 'en' ? '?' : `?${el.id}=${v},`\n",
    "        return\n",
    "      }\n",
    "      const column = Array.prototype.indexOf.call(el.parentNode.parentNode.children, el.parentNode)\n",
    "      let hash = location.hash.slice(2)\n",
    "      if (el.checked) {\n",
    "        hash += `c${column},`\n",
    "      } else {\n",
    "        hash = hash.replace(`c${column}`, 'x').replace(/x(?:=.+?)?,/, '')\n",
    "        if (el.value) {\n",
    "          hash += `c${column}=${el.value},`\n",
    "        }\n",
    "      }\n",
    "      location.hash = `?${hash}`\n",
    "    }\n",
    "    function updateFromHash(hash) {\n",
    "      hash = decodeURIComponent(hash)\n",
    "      document.title = `Urbek buildings ${hash}`\n",
    "      const filterEntries = hash.split(',').slice(0, -1).map((kv) => kv.split('='))\n",
    "      const filter = Object.fromEntries(filterEntries)\n",
    "      // console.warn(filter)\n",
    "      if (filter.lang) {\n",
    "        updateLanguage(filter.lang)\n",
    "      } else {\n",
    "        updateLanguage('en')\n",
    "      }\n",
    "      for (const el of inputEls) {\n",
    "        el.checked = false\n",
    "        el.value = ''\n",
    "      }\n",
    "      const filterEntriesInTable = filterEntries.filter(([k]) => k in filterFields)\n",
    "      for (const [k, v] of filterEntriesInTable) {\n",
    "        if (filterFields[k].type === 'checkbox') filterFields[k].checked = true\n",
    "        else if (v) filterFields[k].value = v\n",
    "      }\n",
    "      \n",
    "      updateTable(filterEntriesInTable.map(([k, v]) => [k, new RegExp(v || '.', 'i')]))\n",
    "    }\n",
    "    \n",
    "    function updateLanguage(lang) {\n",
    "      let el = document.getElementById('lang')\n",
    "      if (el.dataset.prev === lang) return\n",
    "      \n",
    "      el.value = lang\n",
    "      el.dataset.prev = lang\n",
    "      for (el of document.querySelectorAll(\".translate\")) {\n",
    "        try {\n",
    "          const text = JSON.parse(el.getAttribute(\"title\"))[lang]\n",
    "          el.innerText = text\n",
    "        } catch (e) {\n",
    "          console.error(el, e)\n",
    "        }\n",
    "      }\n",
    "      updateRows()\n",
    "    }\n",
    "    \n",
    "    function updateTable(filterEntriesInTable) {\n",
    "      if (!rows) updateRows()\n",
    "      for (const row of rows) {\n",
    "        row.match = filterEntriesInTable.every(([k, v]) => row.texts[k].match(v))\n",
    "        row.tr.style.display = row.match ? 'table-row' : 'none'\n",
    "      }\n",
    "      setTimeout(() => {\n",
    "        let even = false\n",
    "        let prev = null\n",
    "        for (const row of rows) {\n",
    "          if (!row.match) continue\n",
    "          if (prev !== row.texts.c1) {\n",
    "            even = !even\n",
    "            prev = row.texts.c1\n",
    "          }\n",
    "          if (even) row.tr.classList.add('even')\n",
    "          else row.tr.classList.remove('even')\n",
    "        }\n",
    "      })\n",
    "    }\n",
    "    \n",
    "    function updateRows() {\n",
    "      rows = [...document.querySelectorAll('tbody tr')]\n",
    "        .map(tr => ({\n",
    "          tr,\n",
    "          texts: Object.fromEntries(\n",
    "            [...tr.children].map((td, i) => ([`c${i}`, td.innerText]))\n",
    "          )\n",
    "        }))\n",
    "    }\n",
    "  </script>\n",
    "</body>\n",
    "</html>\n",
    "\"\"\"\n",
    "fname = 'docs/index.html'\n",
    "with open(fname, 'wb') as f:\n",
    "    f.write(html.encode(\"utf-8\"))"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 8,
   "id": "53ade7d8",
   "metadata": {},
   "outputs": [],
   "source": [
    "# use `npx live-server docs` for live preview of the output"
   ]
  }
 ],
 "metadata": {
  "celltoolbar": "Hide code",
  "hide_code_all_hidden": true,
  "kernelspec": {
   "display_name": "Python 3 (ipykernel)",
   "language": "python",
   "name": "python3"
  },
  "language_info": {
   "codemirror_mode": {
    "name": "ipython",
    "version": 3
   },
   "file_extension": ".py",
   "mimetype": "text/x-python",
   "name": "python",
   "nbconvert_exporter": "python",
   "pygments_lexer": "ipython3",
   "version": "3.10.11"
  }
 },
 "nbformat": 4,
 "nbformat_minor": 5
}