sketch2d.html

<!-- vim: sw=2 ts=2 expandtab smartindent ft=javascript
-->
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <title>WebGL Demo</title>
    <style> document, body { margin: 0px; padding: 0px; overflow: hidden; } </style>
  </head>

  <body>
    <canvas id="glcanvas"></canvas>
    <script>"use strict";

/* hmm ... */
const data = ({
  "data": {
    "buildings": [
      {
        "floors": [
          {
            "properties": [
              {
                "name": "level",
                "currentValue": 0
              },
              {
                "name": "elevation",
                "currentValue": 0.2
              }
            ],
            "zones": [
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": -13.722212067356743,
                            "y": 9.31238339646834
                          },
                          {
                            "x": -13.722212067356743,
                            "y": 3.228020242667658
                          },
                          {
                            "x": -9.8043553293682,
                            "y": 3.228020242667657
                          },
                          {
                            "x": -9.804355329368198,
                            "y": 9.312383396468338
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": 20.230819703178778,
                            "y": 0.9308204749999978
                          },
                          {
                            "x": 20.230819703178778,
                            "y": -2.254998976584052
                          },
                          {
                            "x": 24.080820419658732,
                            "y": -2.254998976584053
                          },
                          {
                            "x": 24.080820419658732,
                            "y": 0.9308204749999971
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": 26.43850742460041,
                            "y": 20.43082036998993
                          },
                          {
                            "x": 26.43850742460041,
                            "y": 16.46234191887851
                          },
                          {
                            "x": 31.380820015000005,
                            "y": 16.46234191887851
                          },
                          {
                            "x": 31.380820015000005,
                            "y": 20.43082036998993
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": -14.530409114690318,
                            "y": -23.669179524999993
                          },
                          {
                            "x": -14.530409114690318,
                            "y": -25.580821823398182
                          },
                          {
                            "x": -12.617252502718811,
                            "y": -25.580821823398182
                          },
                          {
                            "x": -12.61725250271881,
                            "y": -23.669179524999993
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": 1.6308200149999985,
                            "y": -14.300043253772847
                          },
                          {
                            "x": 1.6308200149999978,
                            "y": -18.169179525
                          },
                          {
                            "x": 7.969587419303936,
                            "y": -18.169179525
                          },
                          {
                            "x": 7.969587419303937,
                            "y": -14.300043253772847
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": -10.194442546706224,
                            "y": -0.33128932555137136
                          },
                          {
                            "x": -10.194442546706224,
                            "y": -2.008238527154632
                          },
                          {
                            "x": -7.350424036793773,
                            "y": -2.008238527154632
                          },
                          {
                            "x": -7.350424036793773,
                            "y": -0.3312893255513718
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": 20.230820015000006,
                            "y": 9.827044306516585
                          },
                          {
                            "x": 20.230820015000006,
                            "y": 7.280820474999998
                          },
                          {
                            "x": 21.5606578264749,
                            "y": 7.280820474999998
                          },
                          {
                            "x": 21.5606578264749,
                            "y": 9.827044306516585
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": 26.43850737027264,
                            "y": 16.462341918878515
                          },
                          {
                            "x": 26.43850737027264,
                            "y": 13.330820474999998
                          },
                          {
                            "x": 31.380820015000005,
                            "y": 13.330820474999996
                          },
                          {
                            "x": 31.380820015000005,
                            "y": 16.46234191887851
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": 8.10472456976838,
                            "y": -10.656542343513385
                          },
                          {
                            "x": 8.10472456976838,
                            "y": -13.819179524999997
                          },
                          {
                            "x": 10.957823638074718,
                            "y": -13.819179524999997
                          },
                          {
                            "x": 10.957823638074721,
                            "y": -10.656542343513387
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": -17.819179840305026,
                            "y": -19.88090498918516
                          },
                          {
                            "x": -17.819179840305026,
                            "y": -24.41918030894043
                          },
                          {
                            "x": -14.530408762027875,
                            "y": -24.41918030894043
                          },
                          {
                            "x": -14.530408762027875,
                            "y": -19.88090498918516
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": -2.0749381491084944,
                            "y": -14.301343718814866
                          },
                          {
                            "x": 7.8808200149999985,
                            "y": -14.301343410291496
                          },
                          {
                            "x": 7.880819927536717,
                            "y": -11.47898573871391
                          },
                          {
                            "x": -2.0749382365717777,
                            "y": -11.478986047237278
                          },
                          {
                            "x": -2.0749381491084944,
                            "y": -14.301343718814866
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": 30.988507083856792,
                            "y": 1.38081974667299
                          },
                          {
                            "x": 31.050665107697498,
                            "y": 2.8878070644102336
                          },
                          {
                            "x": 30.98850701933848,
                            "y": 4.330820574511256
                          },
                          {
                            "x": 26.438507019338562,
                            "y": 4.330820474999997
                          },
                          {
                            "x": 26.43850708385685,
                            "y": 1.3808204749999966
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": 26.438507096796595,
                            "y": 13.330820474999998
                          },
                          {
                            "x": 26.438507096796595,
                            "y": 7.430820474999997
                          },
                          {
                            "x": 31.380820015000005,
                            "y": 7.430820474999996
                          },
                          {
                            "x": 31.380820015000005,
                            "y": 13.330820474999996
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": -1.9654354967971213,
                            "y": 13.435940015661801
                          },
                          {
                            "x": -1.4359354563054967,
                            "y": 13.969334181871975
                          },
                          {
                            "x": -3.0972449313531842,
                            "y": 15.618515012920394
                          },
                          {
                            "x": -3.5936402573759696,
                            "y": 15.616696369264757
                          },
                          {
                            "x": -3.5936406646094157,
                            "y": 16.24637525388368
                          },
                          {
                            "x": -4.8,
                            "y": 16.1
                          },
                          {
                            "x": -6.002221662001448,
                            "y": 15.66555246724458
                          },
                          {
                            "x": -7.007991873553095,
                            "y": 15.155584470497127
                          },
                          {
                            "x": -7.899312328662112,
                            "y": 14.523671002869227
                          },
                          {
                            "x": -8.699678764285954,
                            "y": 13.737470343219934
                          },
                          {
                            "x": -9.319179984999998,
                            "y": 12.844705232962381
                          },
                          {
                            "x": -9.81877519533853,
                            "y": 11.832173252286358
                          },
                          {
                            "x": -10.130422302500511,
                            "y": 10.776822819987332
                          },
                          {
                            "x": -10.272080078451584,
                            "y": 9.686057943932898
                          },
                          {
                            "x": -10.272079967248617,
                            "y": 9.380820475000002
                          },
                          {
                            "x": -9.161397652265988,
                            "y": 9.380820879639602
                          },
                          {
                            "x": -6.404155996191754,
                            "y": 6.6235812325804275
                          },
                          {
                            "x": -0.77427026399942,
                            "y": 12.253471066891791
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": 8.104724766996297,
                            "y": -7.480699142151905
                          },
                          {
                            "x": 8.104724766996297,
                            "y": -10.656542343513385
                          },
                          {
                            "x": 10.957823638074721,
                            "y": -10.656542343513387
                          },
                          {
                            "x": 10.957823638074721,
                            "y": -7.480699142151907
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": 25.65266279982259,
                            "y": 23.930820475
                          },
                          {
                            "x": 25.65266279982259,
                            "y": 20.366861417925772
                          },
                          {
                            "x": 30.230820015000006,
                            "y": 20.366861417925772
                          },
                          {
                            "x": 30.230820015000006,
                            "y": 23.930820475
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": -24.319179984999995,
                            "y": 8.10477808015696
                          },
                          {
                            "x": -24.319179984999995,
                            "y": 3.1154730191313686
                          },
                          {
                            "x": -17.31702389948519,
                            "y": 3.1154730191313673
                          },
                          {
                            "x": -17.31702389948519,
                            "y": 8.10477808015696
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": -14.530408482367516,
                            "y": -21.76917952499999
                          },
                          {
                            "x": -14.530408482367516,
                            "y": -23.669179524999993
                          },
                          {
                            "x": -12.61725250271881,
                            "y": -23.669179524999993
                          },
                          {
                            "x": -12.61725250271881,
                            "y": -21.76917952499999
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": 7.88081971275054,
                            "y": -6.519179098711215
                          },
                          {
                            "x": -1.9691800781762032,
                            "y": -6.519179525268944
                          },
                          {
                            "x": -1.9691799781492336,
                            "y": -8.828985636511643
                          },
                          {
                            "x": 0.015537748716213627,
                            "y": -8.828985982454602
                          },
                          {
                            "x": 0.015537751377883524,
                            "y": -11.478985982454601
                          },
                          {
                            "x": 7.880819927536717,
                            "y": -11.47898573871391
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": -10.194442945866108,
                            "y": -15.64973345826445
                          },
                          {
                            "x": -10.194442945866108,
                            "y": -17.604574548429962
                          },
                          {
                            "x": -8.12833412059119,
                            "y": -17.60457454842997
                          },
                          {
                            "x": -8.12833412059119,
                            "y": -15.649733458264453
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": -1.6191792247032637,
                            "y": -18.220943398857656
                          },
                          {
                            "x": -1.6191788526726878,
                            "y": -14.297920523330687
                          },
                          {
                            "x": -3.9691790955396393,
                            "y": -14.297920300473983
                          },
                          {
                            "x": -3.969179408916972,
                            "y": -17.60245092400873
                          },
                          {
                            "x": -10.194444007854084,
                            "y": -17.602450333650502
                          },
                          {
                            "x": -10.19444236978306,
                            "y": -0.3291656158510928
                          },
                          {
                            "x": -7.350423460710728,
                            "y": -0.32916588555688575
                          },
                          {
                            "x": -3.4135576179372804,
                            "y": 3.6076992105299497
                          },
                          {
                            "x": -6.476451045588396,
                            "y": 6.670593219105611
                          },
                          {
                            "x": -9.804354609734373,
                            "y": 3.342690286147279
                          },
                          {
                            "x": -17.317023775204756,
                            "y": 3.3426909985934783
                          },
                          {
                            "x": -17.317023796551126,
                            "y": 3.1175957950930138
                          },
                          {
                            "x": -24.318775386600585,
                            "y": 3.1175964590875402
                          },
                          {
                            "x": -24.318775785591317,
                            "y": -1.089718326621542
                          },
                          {
                            "x": -24.318775633001195,
                            "y": -2.9191651582364915
                          },
                          {
                            "x": -25.46917780059198,
                            "y": -2.9191651564870846
                          },
                          {
                            "x": -25.469178919417114,
                            "y": -14.717056483364283
                          },
                          {
                            "x": -24.319178919417123,
                            "y": -14.717056592421814
                          },
                          {
                            "x": -24.319179408916956,
                            "y": -19.878780148838118
                          },
                          {
                            "x": -12.617251386097612,
                            "y": -19.87878125856278
                          },
                          {
                            "x": -12.617251926635472,
                            "y": -25.5786952692672
                          },
                          {
                            "x": -1.619179922458351,
                            "y": -25.578696312243345
                          },
                          {
                            "x": -1.6191794092581704,
                            "y": -20.167055219416252
                          },
                          {
                            "x": 7.50836696417869,
                            "y": -20.167056085005513
                          },
                          {
                            "x": 7.508367148733599,
                            "y": -18.220944264446917
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": -8.12833412059119,
                            "y": -15.649733458264453
                          },
                          {
                            "x": -8.12833412059119,
                            "y": -17.60457406721719
                          },
                          {
                            "x": -6.0691799850000026,
                            "y": -17.60457406721719
                          },
                          {
                            "x": -6.0691799850000026,
                            "y": -15.649733458264453
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": 13.980820015000004,
                            "y": 20.366861716747596
                          },
                          {
                            "x": 13.980820015000003,
                            "y": 16.593736721722905
                          },
                          {
                            "x": 17.230820015000006,
                            "y": 16.593736721722905
                          },
                          {
                            "x": 17.230820015000006,
                            "y": 20.366861716747596
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": 20.480820066526707,
                            "y": -22.06159237786438
                          },
                          {
                            "x": 20.480820066526707,
                            "y": -24.419178685543883
                          },
                          {
                            "x": 22.818829874358627,
                            "y": -24.419178685543883
                          },
                          {
                            "x": 22.818829874358627,
                            "y": -22.06159237786438
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": 27.073208417136268,
                            "y": -19.718467939003435
                          },
                          {
                            "x": 27.575423575819965,
                            "y": -18.751042949634982
                          },
                          {
                            "x": 27.860893245114916,
                            "y": -17.709607304744583
                          },
                          {
                            "x": 27.903185047982575,
                            "y": -17.091089688161752
                          },
                          {
                            "x": 25.49638765227567,
                            "y": -14.654294525198043
                          },
                          {
                            "x": 22.980621468286284,
                            "y": -17.017367631618445
                          },
                          {
                            "x": 26.39768422388228,
                            "y": -20.585816928591107
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": 25.65266322776545,
                            "y": 30.080820694092342
                          },
                          {
                            "x": 25.65266322776545,
                            "y": 23.930820471407067
                          },
                          {
                            "x": 30.230820512190302,
                            "y": 23.930820471407067
                          },
                          {
                            "x": 30.230820512190302,
                            "y": 30.080820694092342
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": 26.72025268376282,
                            "y": -14.719179492573824
                          },
                          {
                            "x": 26.720252188337845,
                            "y": -15.819179525000001
                          },
                          {
                            "x": 27.947673166964044,
                            "y": -17.04660160925395
                          },
                          {
                            "x": 30.230822166608654,
                            "y": -17.046602637553043
                          },
                          {
                            "x": 30.2308232148475,
                            "y": -14.719181073686794
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": 20.230820015000006,
                            "y": 7.280820474999998
                          },
                          {
                            "x": 20.230820015000006,
                            "y": 4.080820474999998
                          },
                          {
                            "x": 24.080820419658732,
                            "y": 4.080820474999997
                          },
                          {
                            "x": 24.080820419658732,
                            "y": 7.280820474999997
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": -17.31702389948519,
                            "y": 8.104777982727754
                          },
                          {
                            "x": -17.31702389948519,
                            "y": 3.3405670741426827
                          },
                          {
                            "x": -13.722212067356743,
                            "y": 3.3405670741426823
                          },
                          {
                            "x": -13.722212067356743,
                            "y": 8.104777982727752
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": 17.344866784469968,
                            "y": 8.00219999008621
                          },
                          {
                            "x": 7.550260699770938,
                            "y": 8.002200405615952
                          },
                          {
                            "x": 7.550260674652896,
                            "y": 7.410133678957448
                          },
                          {
                            "x": 0.45150517137983753,
                            "y": 7.410133980117494
                          },
                          {
                            "x": -3.5591856270070874,
                            "y": 3.399443522032405
                          },
                          {
                            "x": -1.9654359902026899,
                            "y": 1.8056937500004369
                          },
                          {
                            "x": -1.9654362358747868,
                            "y": -3.9851346428955576
                          },
                          {
                            "x": 7.550260191216096,
                            "y": -3.985135046592738
                          },
                          {
                            "x": 8.00622256661401,
                            "y": -4.4410974606784634
                          },
                          {
                            "x": 10.33593823517584,
                            "y": -2.111381989789957
                          },
                          {
                            "x": 9.69168187671213,
                            "y": -1.467125576661935
                          },
                          {
                            "x": 9.69168194459107,
                            "y": 0.13287442333806304
                          },
                          {
                            "x": 11.191681944591066,
                            "y": 0.13287435970155867
                          },
                          {
                            "x": 11.191682103682329,
                            "y": 3.8828743597015545
                          },
                          {
                            "x": 9.69168210368233,
                            "y": 3.8828744233380594
                          },
                          {
                            "x": 9.691682171561268,
                            "y": 5.482874423338059
                          },
                          {
                            "x": 10.130820015000001,
                            "y": 5.922012229516529
                          },
                          {
                            "x": 17.344866696219363,
                            "y": 5.922011923465365
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": -3.138926602375369,
                            "y": 15.659892380526088
                          },
                          {
                            "x": -1.4359354563054967,
                            "y": 13.969334181871975
                          },
                          {
                            "x": -1.9654354967971213,
                            "y": 13.435940015661801
                          },
                          {
                            "x": -0.7830614569298028,
                            "y": 12.26219807837314
                          },
                          {
                            "x": 2.6107387195046012,
                            "y": 15.680957430520492
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": 26.438507096796595,
                            "y": 7.430820474999997
                          },
                          {
                            "x": 24.130820015000005,
                            "y": 7.430820602089889
                          },
                          {
                            "x": 24.130819481441854,
                            "y": -2.2574813524500423
                          },
                          {
                            "x": 16.491078010401505,
                            "y": -2.257480931711054
                          },
                          {
                            "x": 16.491077853196636,
                            "y": -5.1119930947573975
                          },
                          {
                            "x": 13.32935613080177,
                            "y": -5.111992920633757
                          },
                          {
                            "x": 10.339706853726053,
                            "y": -2.122343314263623
                          },
                          {
                            "x": 7.969587365997445,
                            "y": -4.49246254093585
                          },
                          {
                            "x": 10.95923664307316,
                            "y": -7.482112147305985
                          },
                          {
                            "x": 10.959236294075556,
                            "y": -13.819179689647155
                          },
                          {
                            "x": 8.10472488309667,
                            "y": -13.819179532442329
                          },
                          {
                            "x": 8.104724640563923,
                            "y": -18.223067737284286
                          },
                          {
                            "x": 7.508366572650554,
                            "y": -18.223067704441405
                          },
                          {
                            "x": 7.508366504688918,
                            "y": -25.580821728215955
                          },
                          {
                            "x": 20.480820015,
                            "y": -25.580821848039086
                          },
                          {
                            "x": 20.498021226685598,
                            "y": -19.497957285937417
                          },
                          {
                            "x": 25.463221709886966,
                            "y": -14.536777977299478
                          },
                          {
                            "x": 26.72025268544761,
                            "y": -14.536777988910343
                          },
                          {
                            "x": 26.72025268376282,
                            "y": -14.719179492573824
                          },
                          {
                            "x": 31.38081972698438,
                            "y": -14.719179535622274
                          },
                          {
                            "x": 31.38081984752386,
                            "y": -1.6691795356222765
                          },
                          {
                            "x": 26.43850659563765,
                            "y": -1.6691794899714059
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": 21.5606578264749,
                            "y": 9.827044411767831
                          },
                          {
                            "x": 21.5606578264749,
                            "y": 7.280820474999998
                          },
                          {
                            "x": 24.080820015000004,
                            "y": 7.280820474999997
                          },
                          {
                            "x": 24.080820015000004,
                            "y": 9.82704441176783
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": 13.329356288006645,
                            "y": -2.2574807575874156
                          },
                          {
                            "x": 13.329356288006641,
                            "y": -5.1119929206337655
                          },
                          {
                            "x": 16.49107785319665,
                            "y": -5.1119929206337655
                          },
                          {
                            "x": 16.49107785319665,
                            "y": -2.2574807575874156
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": 17.344867132345634,
                            "y": 5.922012122265355
                          },
                          {
                            "x": 10.130820015000001,
                            "y": 5.922012229516529
                          },
                          {
                            "x": 9.738086175712585,
                            "y": 5.404788583197969
                          },
                          {
                            "x": 9.738086153086295,
                            "y": 3.8828743813121545
                          },
                          {
                            "x": 11.230820042875614,
                            "y": 3.8828743591196915
                          },
                          {
                            "x": 11.230820015,
                            "y": 2.0078740862429965
                          },
                          {
                            "x": 17.344867074154177,
                            "y": 2.007873995345512
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": 10.775336492401802,
                            "y": 20.36686141494738
                          },
                          {
                            "x": 10.775336492401802,
                            "y": 16.593736721722905
                          },
                          {
                            "x": 13.980820015000003,
                            "y": 16.593736721722905
                          },
                          {
                            "x": 13.980820015000004,
                            "y": 20.36686141494738
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": -0.7742703485467605,
                            "y": -6.519179524999999
                          },
                          {
                            "x": -0.7742700782044185,
                            "y": -3.9691795249999986
                          },
                          {
                            "x": -1.97043014397187,
                            "y": -3.9691793981871717
                          },
                          {
                            "x": -1.97043041431421,
                            "y": -6.519179398187171
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": 20.230819703178778,
                            "y": -2.254998976584052
                          },
                          {
                            "x": 20.230819694593315,
                            "y": 7.930820474999998
                          },
                          {
                            "x": 17.344867130652442,
                            "y": 7.9308204725674765
                          },
                          {
                            "x": 17.344867139237905,
                            "y": -2.2549989790165736
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": 6.222606484053446,
                            "y": 20.36686183566371
                          },
                          {
                            "x": 6.222606484053445,
                            "y": 16.593736721722905
                          },
                          {
                            "x": 10.775336492401802,
                            "y": 16.593736721722905
                          },
                          {
                            "x": 10.775336492401802,
                            "y": 20.36686183566371
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": -3.969179972656203,
                            "y": -14.297920303147329
                          },
                          {
                            "x": -2.0749381491084944,
                            "y": -14.301343718814866
                          },
                          {
                            "x": -2.0749382365717777,
                            "y": -11.478986047237278
                          },
                          {
                            "x": 0.015537751377883524,
                            "y": -11.478985982454601
                          },
                          {
                            "x": 0.015537748716213627,
                            "y": -8.828985982454602
                          },
                          {
                            "x": -1.9691799781492192,
                            "y": -8.82898598444806
                          },
                          {
                            "x": -1.9691799849999998,
                            "y": -2.0082385251458263
                          },
                          {
                            "x": -3.969179985,
                            "y": -2.008238527154633
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": -6.0691799850000026,
                            "y": -15.649733458264453
                          },
                          {
                            "x": -6.0691799850000026,
                            "y": -17.604574221182446
                          },
                          {
                            "x": -3.9691799850000025,
                            "y": -17.604574221182446
                          },
                          {
                            "x": -3.9691799850000016,
                            "y": -15.649733458264453
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": -5.729599861462886,
                            "y": -1.978328110478602
                          },
                          {
                            "x": -2.00102467813754,
                            "y": -2.008238527154633
                          },
                          {
                            "x": -1.9704295317394263,
                            "y": 1.8056937502122847
                          },
                          {
                            "x": -3.548917524910568,
                            "y": 3.409711623257689
                          },
                          {
                            "x": -7.350424036793773,
                            "y": -0.3312893255513718
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": -21.01918019083857,
                            "y": -19.88090436711858
                          },
                          {
                            "x": -21.01918019083857,
                            "y": -24.419179901689233
                          },
                          {
                            "x": -17.81918019083857,
                            "y": -24.419179901689233
                          },
                          {
                            "x": -17.81918019083857,
                            "y": -19.88090436711858
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": 8.10472416928564,
                            "y": -5.511437322813723
                          },
                          {
                            "x": 8.104724644138523,
                            "y": -7.469179490344521
                          },
                          {
                            "x": 10.932950030057585,
                            "y": -7.4691788043548115
                          },
                          {
                            "x": 8.975207387673901,
                            "y": -5.5114371116769
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": -0.7742700082479623,
                            "y": -3.9851342529719997
                          },
                          {
                            "x": -0.7742703485467605,
                            "y": -6.519179524999999
                          },
                          {
                            "x": 7.969588983790824,
                            "y": -6.519180699219276
                          },
                          {
                            "x": 7.969589255960292,
                            "y": -4.4924625409361045
                          },
                          {
                            "x": 7.462262210344801,
                            "y": -3.985135359061954
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": -2.2191799849999945,
                            "y": 30.080820475
                          },
                          {
                            "x": -2.2191799849999954,
                            "y": 23.130820475
                          },
                          {
                            "x": 2.7308200150000044,
                            "y": 23.130820475
                          },
                          {
                            "x": 2.7308200150000057,
                            "y": 30.080820475
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": 30.98850701933848,
                            "y": 4.330820574511256
                          },
                          {
                            "x": 30.716001455325948,
                            "y": 5.8241477841614735
                          },
                          {
                            "x": 30.234786079775738,
                            "y": 7.430787555359966
                          },
                          {
                            "x": 26.50556687914686,
                            "y": 7.430134643697966
                          },
                          {
                            "x": 26.506109644423407,
                            "y": 4.330035796421698
                          },
                          {
                            "x": 27.313639201081877,
                            "y": 4.330177178688759
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": -14.530408482367516,
                            "y": -19.880904587928832
                          },
                          {
                            "x": -14.530408482367516,
                            "y": -21.76917952499999
                          },
                          {
                            "x": -12.617252791336268,
                            "y": -21.76917952499999
                          },
                          {
                            "x": -12.617252791336268,
                            "y": -19.880904587928832
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": 17.230820015000006,
                            "y": 20.366861374060676
                          },
                          {
                            "x": 17.230820015000006,
                            "y": 16.593736721722905
                          },
                          {
                            "x": 21.930820015000005,
                            "y": 16.5937367217229
                          },
                          {
                            "x": 21.930820015000005,
                            "y": 20.366861374060676
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": -10.194442546706224,
                            "y": -2.008238527154632
                          },
                          {
                            "x": -10.194442546706227,
                            "y": -15.64973345826445
                          },
                          {
                            "x": -3.9691799850000016,
                            "y": -15.649733458264453
                          },
                          {
                            "x": -3.969179985,
                            "y": -2.008238527154633
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": 7.508366566995607,
                            "y": -20.1655807900538
                          },
                          {
                            "x": -1.6191799850000026,
                            "y": -20.165580612082273
                          },
                          {
                            "x": -1.619180067937884,
                            "y": -24.41917874204272
                          },
                          {
                            "x": 0.015537764827032789,
                            "y": -24.869179525
                          },
                          {
                            "x": 1.4808200149999966,
                            "y": -25.119179525
                          },
                          {
                            "x": 2.9423315957368015,
                            "y": -25.228863683520192
                          },
                          {
                            "x": 4.437116454614268,
                            "y": -25.13218605526333
                          },
                          {
                            "x": 5.930820014999997,
                            "y": -24.869179413023602
                          },
                          {
                            "x": 7.508366484057723,
                            "y": -24.419178920014254
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": 21.930820015000005,
                            "y": 16.5937367217229
                          },
                          {
                            "x": 6.180820015000003,
                            "y": 16.593736831473326
                          },
                          {
                            "x": 6.180819951150217,
                            "y": 7.430819215183175
                          },
                          {
                            "x": 7.580819951150216,
                            "y": 7.4308192054275795
                          },
                          {
                            "x": 7.580819955049718,
                            "y": 7.990426262420276
                          },
                          {
                            "x": 20.230820002201924,
                            "y": 7.990426174271458
                          },
                          {
                            "x": 20.230820015000006,
                            "y": 9.82704442103452
                          },
                          {
                            "x": 21.93081996784779,
                            "y": 9.827044409188431
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": -9.120364301164877,
                            "y": 9.312382960063005
                          },
                          {
                            "x": -9.804354763045177,
                            "y": 9.31238302492762
                          },
                          {
                            "x": -9.804355329368235,
                            "y": 3.3405667026020036
                          },
                          {
                            "x": -6.4764516216714405,
                            "y": 6.668469779111125
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": 11.191682071096324,
                            "y": 2.007874410497634
                          },
                          {
                            "x": 11.191681944591064,
                            "y": 0.1328743409177091
                          },
                          {
                            "x": 9.738086097335078,
                            "y": 0.13287443899104984
                          },
                          {
                            "x": 9.738085992514785,
                            "y": -1.4207214671210022
                          },
                          {
                            "x": 10.48654348667029,
                            "y": -2.169179062272574
                          },
                          {
                            "x": 17.344866792330595,
                            "y": -2.1691795250000023
                          },
                          {
                            "x": 17.344867074154177,
                            "y": 2.007873995345512
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": -3.419179984999996,
                            "y": 19.530820475000002
                          },
                          {
                            "x": -3.4191799849999973,
                            "y": 15.680820475000003
                          },
                          {
                            "x": 2.5733569707303894,
                            "y": 15.680820475
                          },
                          {
                            "x": 2.5733569707303907,
                            "y": 19.530820475000002
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": -2.2191799849999954,
                            "y": 23.130820475
                          },
                          {
                            "x": -2.2191799849999962,
                            "y": 19.530820475000002
                          },
                          {
                            "x": 2.5733569707303907,
                            "y": 19.530820475000002
                          },
                          {
                            "x": 2.573356970730391,
                            "y": 23.130820475
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": 26.43850607023306,
                            "y": 20.366863439933592
                          },
                          {
                            "x": 25.649782785068208,
                            "y": 20.36686337734302
                          },
                          {
                            "x": 25.649782014199335,
                            "y": 30.08082268659184
                          },
                          {
                            "x": 20.480815597869775,
                            "y": 30.08082227639913
                          },
                          {
                            "x": 20.480815506609442,
                            "y": 31.230822276399124
                          },
                          {
                            "x": 7.508366413428601,
                            "y": 31.230821246947002
                          },
                          {
                            "x": 7.508366504688927,
                            "y": 30.08082124694701
                          },
                          {
                            "x": 2.730819463470182,
                            "y": 30.08082086781614
                          },
                          {
                            "x": 2.730820014999973,
                            "y": 23.13082086781637
                          },
                          {
                            "x": 2.6530812175115677,
                            "y": 23.13082086164727
                          },
                          {
                            "x": 2.653081808720086,
                            "y": 15.680820475
                          },
                          {
                            "x": -6.417859796691,
                            "y": 6.609877429906202
                          },
                          {
                            "x": -3.4039894743886334,
                            "y": 3.5960075859462695
                          },
                          {
                            "x": 0.4308207421402767,
                            "y": 7.430818411112101
                          },
                          {
                            "x": 6.180820742140259,
                            "y": 7.43081886741396
                          },
                          {
                            "x": 6.180819715576708,
                            "y": 20.366861832347656
                          },
                          {
                            "x": 21.93081971557659,
                            "y": 20.366863082217954
                          },
                          {
                            "x": 21.93082055900938,
                            "y": 9.738507199080825
                          },
                          {
                            "x": 24.13081983186924,
                            "y": 9.738507373665826
                          },
                          {
                            "x": 24.130820015000005,
                            "y": 7.430820291869235
                          },
                          {
                            "x": 26.438507096796595,
                            "y": 7.430820474999997
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": 13.32935613080177,
                            "y": -5.111992920633757
                          },
                          {
                            "x": 13.329356568974365,
                            "y": -2.2191795250000013
                          },
                          {
                            "x": 11.379356568974387,
                            "y": -2.2191792296347495
                          },
                          {
                            "x": 11.379356426167044,
                            "y": -3.1619926252685264
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": 30.23082216660866,
                            "y": -1.6691800970144495
                          },
                          {
                            "x": 30.23082216660866,
                            "y": -1.6691800970144495
                          },
                          {
                            "x": 30.680820015000005,
                            "y": -0.14417911091203678
                          },
                          {
                            "x": 30.988507083856792,
                            "y": 1.38081974667299
                          },
                          {
                            "x": 26.43850708385685,
                            "y": 1.3808204749999966
                          },
                          {
                            "x": 26.43850659563765,
                            "y": -1.6691794899714059
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": 20.480820066526707,
                            "y": -22.06159237786438
                          },
                          {
                            "x": 22.880820014999998,
                            "y": -22.061591890616402
                          },
                          {
                            "x": 23.538192323263257,
                            "y": -22.02054457214392
                          },
                          {
                            "x": 24.57438450958552,
                            "y": -21.75153313908847
                          },
                          {
                            "x": 25.560759764571724,
                            "y": -21.253363818464283
                          },
                          {
                            "x": 26.39768422388228,
                            "y": -20.585816928591107
                          },
                          {
                            "x": 22.972020890438376,
                            "y": -17.02797875072693
                          },
                          {
                            "x": 20.498021226685598,
                            "y": -19.497957285937417
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": 20.230819666100253,
                            "y": 4.080820474999998
                          },
                          {
                            "x": 20.230819666100253,
                            "y": 0.9308204749999978
                          },
                          {
                            "x": 24.080820419658732,
                            "y": 0.9308204749999971
                          },
                          {
                            "x": 24.080820419658732,
                            "y": 4.080820474999997
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": -1.5997441765127287,
                            "y": -14.300043721563473
                          },
                          {
                            "x": -1.5997441765127296,
                            "y": -18.223067202835782
                          },
                          {
                            "x": 1.6308200149999978,
                            "y": -18.223067202835782
                          },
                          {
                            "x": 1.6308200149999985,
                            "y": -14.300043721563473
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "surfaces": [
                  {
                    "shapes": [
                      {
                        "vertices": [
                          {
                            "x": -24.319180236030203,
                            "y": -19.880904336450026
                          },
                          {
                            "x": -24.319180236030203,
                            "y": -24.419179524999993
                          },
                          {
                            "x": -21.019179985000005,
                            "y": -24.419179524999993
                          },
                          {
                            "x": -21.019179985000005,
                            "y": -19.880904336450026
                          }
                        ]
                      }
                    ]
                  }
                ]
              }
            ]
          },
          {
            "properties": [
              {
                "name": "elevation",
                "currentValue": 3.35
              }
            ],
            "zones": []
          }
        ]
      }
    ]
  }
}).data.buildings[0];

const ACTIVE_FLOOR = data.floors.findIndex(x => x.properties.some(p => p.name == "level" && p.currentValue == 0));

/* getting the bounds lets us center the camera on the building, no matter where it is. */
const bounds = {
  x: { min: Infinity, max: -Infinity },
  y: { min: Infinity, max: -Infinity },
};
for (const floor of data.floors) {
  for (const zone of data.floors[ACTIVE_FLOOR].zones) {
    zone.surfaces.sort((a, b) => Date.parse(a.lastModified) - Date.parse(b.lastModified));

    for (const surface of zone.surfaces) {
      for (const shape of surface.shapes) {
        for (const vtx of shape.vertices) {
          bounds.x.min = Math.min(bounds.x.min, vtx.x);
          bounds.x.max = Math.max(bounds.x.max, vtx.x);

          bounds.y.min = Math.min(bounds.y.min, vtx.y);
          bounds.y.max = Math.max(bounds.y.max, vtx.y);
        }
      }
    }
  }
}

let input = {
  zoom:   Math.sqrt((bounds.x.min - bounds.x.max)*(bounds.x.min - bounds.x.max) +
                    (bounds.y.min - bounds.y.max)*(bounds.y.min - bounds.y.max))*1.2,
  scroll: 0,

  pitch:  Math.PI*0.70,
  yaw:   -Math.PI*0.22,
  eye: [0, 0, 0, 1],

  cam_pivot_x: (bounds.x.min + bounds.x.max) * 0.5,
  cam_pivot_y: (bounds.y.min + bounds.y.max) * 0.5,
  cam_pivot_z: 0,

  dampedEvent: { button: 0, movementX: 0, movementY: 0 },

  lmb_down: false,
  rmb_down: false,
  mouse_x:  0,
  mouse_y:  0,
}

{
    const opts = { passive: false };

    window.addEventListener('wheel', e => {
        e.preventDefault();

        if (input.mouse_down) return;
        input.scroll += e.deltaY;
    }, opts);
    window.addEventListener('mousedown', ev => {
        ev.preventDefault();

        input.dampedEvent.button = ev.button ? 2 : 0;

        if (ev.button == 0) input.lmb_down = true;
        if (ev.button == 2) input.rmb_down = true;
    }, opts);
    window.addEventListener('mousemove', ev => {
        ev.preventDefault();

        if (input.lmb_down || input.rmb_down) {
            input.dampedEvent.movementX += ev.movementX;
            input.dampedEvent.movementY += ev.movementY;
        }

        input.mouse_x = ev.offsetX*window.devicePixelRatio;
        input.mouse_y = ev.offsetY*window.devicePixelRatio;
    }, opts);
    window.addEventListener("contextmenu", ev => {
        ev.preventDefault();
    }, opts);
    window.addEventListener('mouseup', ev => {
        ev.preventDefault();

        if (ev.button == 0) input.lmb_down = false;
        if (ev.button == 2) input.rmb_down = false;
    }, opts);
}

/* touch */
{
    const opts = { passive: false };

    let touch_x = 0;
    let touch_y = 0;
    window.addEventListener("touchstart", ev => {
        ev.preventDefault();

        touch_x = ev.changedTouches[0].clientX;
        touch_y = ev.changedTouches[0].clientY;

        input.lmb_down = true;
    }, opts);

    window.addEventListener("touchmove", ev => {
        ev.preventDefault();
        input.dampedEvent.button = 0;

        input.dampedEvent.movementX += ev.changedTouches[0].clientX - touch_x;
        input.dampedEvent.movementY += ev.changedTouches[0].clientY - touch_y;

        touch_x = ev.changedTouches[0].clientX;
        touch_y = ev.changedTouches[0].clientY;
    }, opts);

    window.addEventListener("touchend", ev => {
        ev.preventDefault();

        input.lmb_down = false;
    }, opts);
}

const canvas = document.getElementById("glcanvas");
const ctx = canvas.getContext('2d');
(window.onresize = () => {
   canvas.width = window.innerWidth*window.devicePixelRatio,
   canvas.height = window.innerHeight*window.devicePixelRatio
   canvas.style.width = window.innerWidth + 'px';
   canvas.style.height = window.innerHeight + 'px';
 })();

let last_timestamp;
requestAnimationFrame(function render(timestamp) {
  requestAnimationFrame(render);

  timestamp *= 0.001;
  last_timestamp ??= timestamp;
  const deltaTime = timestamp - last_timestamp;
  last_timestamp = timestamp;

  {
    const ev = input.dampedEvent;

    /* based on the assumption that if you're zoomed in more,
     * you're doing finer-detailed work and want more precise movements. */
    const zoom_fudge = Math.sqrt(input.zoom/10.0)*2.0;

    if (ev.button == 0) {
      input.pitch -= ev.movementX * 0.0005 * zoom_fudge;
      input.yaw   -= ev.movementY * 0.0005 * zoom_fudge;
      input.yaw = Math.max(-Math.PI*0.5 + 0.01, Math.min(Math.PI*0.5 - 0.01, input.yaw));
    }
    if (ev.button == 2) {
      const unit = [0, -ev.movementX*0.00075*zoom_fudge, ev.movementY*0.00075*zoom_fudge, 1];
      {
        const view    = mat4_create();
        const scratch = mat4_create();

        mat4_from_z_rotation(scratch, input.pitch);
        mat4_mul(view, view, scratch);

        mat4_from_y_rotation(scratch, input.yaw);
        mat4_mul(view, view, scratch);

        mat4_transform_vec4(unit, unit, view);
      }

      input.cam_pivot_x += unit[0];
      input.cam_pivot_y += unit[1];
      input.cam_pivot_z += unit[2];
    }

    ev.movementX *= Math.pow(1 - 0.17, 60*deltaTime);
    ev.movementY *= Math.pow(1 - 0.17, 60*deltaTime);

    {
      const t = Math.cbrt(Math.abs(input.scroll)) * Math.sign(input.scroll);

      input.zoom += 0.005*t*input.zoom;
      input.scroll *= Math.pow(1 - 0.5, 60*deltaTime);
      input.zoom = Math.min(200, input.zoom);
    }
  }

  const mvp = mat4_create();
  const scratch = mat4_create();
  {
    {
      const FIELD_OF_VIEW = 50 / 180 * Math.PI;
      const ar = window.innerWidth / window.innerHeight;
      const projection = mat4_perspective(mat4_create(), FIELD_OF_VIEW, ar, 0.01, 100.0);

      const view = mat4_create();
      {
        const eye = input.eye = [input.zoom, 0, 0, 1];
        {
          mat4_from_z_rotation(scratch, input.pitch);
          mat4_mul(view, view, scratch);

          mat4_from_y_rotation(scratch, input.yaw);
          mat4_mul(view, view, scratch);

          mat4_transform_vec4(eye, eye, view);
        }

        eye[0] += input.cam_pivot_x;
        eye[1] += input.cam_pivot_y;
        eye[2] += input.cam_pivot_z;
        mat4_target_to(
          view,
          eye,
          [input.cam_pivot_x, input.cam_pivot_y, input.cam_pivot_z],
          [                0,                 0,                 1]
        );
        mat4_invert(view, view);
      }

      mat4_mul(mvp, projection, view);
    }
  }

  ctx.globalAlpha = 1.0;
  ctx.fillStyle = "rgb(30 40 50)";
  ctx.fillRect(0, 0, canvas.width, canvas.height);
  ctx.globalAlpha = 1.0;

  const p = [0, 0, 0, 1];
  const transform_p = (x, y, height) => {
    p[0] = x;
    p[1] = y;
    p[2] = height;
    p[3] = 1;
    mat4_transform_vec4(p, p, mvp);
    const w = p[3];
    p[0] = (0 + (p[0]/w*0.5 + 0.5))*canvas.width;
    p[1] = (1 - (p[1]/w*0.5 + 0.5))*canvas.height;
  }

  if (0) {
    ctx.beginPath();

    transform_p(bounds.x.min, bounds.y.min, 0); ctx.moveTo(p[0], p[1]);
    transform_p(bounds.x.max, bounds.y.min, 0); ctx.lineTo(p[0], p[1]);
    transform_p(bounds.x.max, bounds.y.max, 0); ctx.lineTo(p[0], p[1]);
    transform_p(bounds.x.min, bounds.y.max, 0); ctx.lineTo(p[0], p[1]);
    transform_p(bounds.x.min, bounds.y.min, 0); ctx.lineTo(p[0], p[1]);

    {
      ctx.globalAlpha = 0.5;
      {
        ctx.lineWidth = 0.15 * 40;
        ctx.strokeStyle = 'teal';
        ctx.stroke();
        ctx.closePath();
      }
      ctx.globalAlpha = 1.0;
    }

    ctx.fillStyle = "chartreuse";
    transform_p(input.cam_pivot_x, input.cam_pivot_y, 0);
    ctx.fillRect(p[0] - 10, p[1] - 10, 20, 20);

    ctx.fillStyle = "teal";
    transform_p(0, 0, 0);
    ctx.fillRect(p[0] - 10, p[1] - 10, 20, 20);
  }

  function wallPass(wallback) {
    for (const zone of data.floors[ACTIVE_FLOOR].zones) {
      for (const surface of zone.surfaces) {
        for (const shape of surface.shapes) {
          if (shape.vertices.length == 0) continue;

          for (let i = 0; i < shape.vertices.length; i++) {
            const from = shape.vertices[(i+0) % shape.vertices.length];
            const   to = shape.vertices[(i+1) % shape.vertices.length];
            wallback(from.x, from.y, to.x, to.y);
          }

        }
      }
    }
  }

  function shapePass(shape_callback) {
    for (const zone of data.floors[ACTIVE_FLOOR].zones) {
      for (const surface of zone.surfaces) {
        for (const shape of surface.shapes) {
          if (shape.vertices.length == 0) continue;

          shape_callback(shape.vertices);
        }
      }
    }
  }

  const HEIGHT = 4;

  {

    ctx.globalAlpha = 1.0;
    ctx.fillStyle = "rgb(15 20 25)";

    const shadow_p = (x, y) => {
      let dir_x = -1.0;
      let dir_y = -1.0 + 0.1*(Math.cos((timestamp * 0.6) % Math.PI*2));
      let dir_z = -1.2 + 0.4*(Math.cos((timestamp * 0.1) % Math.PI*2));
      const dir_len = Math.sqrt(dir_x*dir_x + dir_y*dir_y + dir_z*dir_z);
      dir_x /= dir_len;
      dir_y /= dir_len;
      dir_z /= dir_len;
      ray_hit_plane(
          p,

          x, y, HEIGHT,
          -dir_x, -dir_y, -dir_z,

          0, 0, 0,
          0, 0, 1
      )
      transform_p(p[0], p[1], p[2]);
    }

    /* shadows */
    wallPass((from_x, from_y, to_x, to_y) => {
      ctx.beginPath();
      transform_p(from_x, from_y,      0); ctx.moveTo(p[0], p[1]);
         shadow_p(from_x, from_y        ); ctx.lineTo(p[0], p[1]);
         shadow_p(  to_x,   to_y        ); ctx.lineTo(p[0], p[1]);
      transform_p(  to_x,   to_y,      0); ctx.lineTo(p[0], p[1]);
      ctx.closePath();
      ctx.fill();
    });
    shapePass((vertices) => {
      ctx.beginPath();

      for (let i = 0; i < vertices.length; i++) {
        const vtx = vertices[i];
        transform_p(vtx.x, vtx.y, 0);

        if (i == 0) ctx.moveTo(p[0], p[1]);
        else        ctx.lineTo(p[0], p[1]);
      }

      ctx.closePath();
      ctx.fillStyle = "black";
      ctx.fill();
    });

    ctx.globalAlpha = 0.12;
    ctx.fillStyle = "orange";

    /* walls */
    wallPass((from_x, from_y, to_x, to_y) => {
      ctx.beginPath();
      transform_p(from_x, from_y,      0); ctx.moveTo(p[0], p[1]);
      transform_p(from_x, from_y, HEIGHT); ctx.lineTo(p[0], p[1]);
      transform_p(  to_x,   to_y, HEIGHT); ctx.lineTo(p[0], p[1]);
      transform_p(  to_x,   to_y,      0); ctx.lineTo(p[0], p[1]);
      ctx.closePath();
      ctx.fill();
    });

    /* floors */
    shapePass((vertices) => {
      ctx.beginPath();

      for (let i = 0; i < vertices.length; i++) {
        const vtx = vertices[i];
        transform_p(vtx.x, vtx.y, 0);

        if (i == 0) ctx.moveTo(p[0], p[1]);
        else        ctx.lineTo(p[0], p[1]);
      }

      ctx.closePath();
      ctx.fillStyle = "black";
      ctx.fill();
      ctx.fillStyle = "orange";
      ctx.globalAlpha = 0.1;
      ctx.fill();
    });
  }

  {
    ctx.globalAlpha = 0.5;
    ctx.lineWidth = 0.15 * 40;
    ctx.strokeStyle = 'orange';

    /* floor and ceiling outlines */
    for (const height of [0, HEIGHT]) {
      wallPass((from_x, from_y, to_x, to_y) => {
        ctx.beginPath();

        transform_p(from_x, from_y, height); ctx.moveTo(p[0], p[1]);
        transform_p(  to_x,   to_y, height); ctx.lineTo(p[0], p[1]);

        ctx.closePath();
        ctx.stroke();
      });
    }

    /* vertical lines between floor and ceiling */
    shapePass((vertices) => {
      for (const vtx of vertices) {
        ctx.beginPath();
        transform_p(vtx.x, vtx.y,      0); ctx.moveTo(p[0], p[1]);
        transform_p(vtx.x, vtx.y, HEIGHT); ctx.lineTo(p[0], p[1]);
        ctx.closePath();
        ctx.stroke();
      }
    });

    ctx.globalAlpha = 1.0;
  }

})

function mat4_create() {
    let out = new Float32Array(16);
    out[0] = 1;
    out[5] = 1;
    out[10] = 1;
    out[15] = 1;
    return out;
}

function mat4_from_scaling(out, x, y=x, z=x) {
    out[0] = x;
    out[1] = 0;
    out[2] = 0;
    out[3] = 0;
    out[4] = 0;
    out[5] = y;
    out[6] = 0;
    out[7] = 0;
    out[8] = 0;
    out[9] = 0;
    out[10] = z;
    out[11] = 0;
    out[12] = 0;
    out[13] = 0;
    out[14] = 0;
    out[15] = 1;
    return out;
}

function mat4_from_translation(out, v) {
    out[0] = 1;
    out[1] = 0;
    out[2] = 0;
    out[3] = 0;
    out[4] = 0;
    out[5] = 1;
    out[6] = 0;
    out[7] = 0;
    out[8] = 0;
    out[9] = 0;
    out[10] = 1;
    out[11] = 0;
    out[12] = v[0];
    out[13] = v[1];
    out[14] = v[2];
    out[15] = 1;
    return out;
}

function mat4_transform_vec4(out, a, m) {
    let x = a[0], y = a[1], z = a[2], w = a[3];
    out[0] = m[0] * x + m[4] * y + m[8] * z + m[12] * w;
    out[1] = m[1] * x + m[5] * y + m[9] * z + m[13] * w;
    out[2] = m[2] * x + m[6] * y + m[10] * z + m[14] * w;
    out[3] = m[3] * x + m[7] * y + m[11] * z + m[15] * w;
    return out;
}

function mat4_mul(out, a, b) {
    let a00 = a[0], a01 = a[1], a02 = a[2], a03 = a[3];
    let a10 = a[4], a11 = a[5], a12 = a[6], a13 = a[7];
    let a20 = a[8], a21 = a[9], a22 = a[10], a23 = a[11];
    let a30 = a[12], a31 = a[13], a32 = a[14], a33 = a[15];
    /* Cache only the current line of the second matrix */
    let b0 = b[0], b1 = b[1], b2 = b[2], b3 = b[3];
    out[0] = b0 * a00 + b1 * a10 + b2 * a20 + b3 * a30;
    out[1] = b0 * a01 + b1 * a11 + b2 * a21 + b3 * a31;
    out[2] = b0 * a02 + b1 * a12 + b2 * a22 + b3 * a32;
    out[3] = b0 * a03 + b1 * a13 + b2 * a23 + b3 * a33;
    b0 = b[4];
    b1 = b[5];
    b2 = b[6];
    b3 = b[7];
    out[4] = b0 * a00 + b1 * a10 + b2 * a20 + b3 * a30;
    out[5] = b0 * a01 + b1 * a11 + b2 * a21 + b3 * a31;
    out[6] = b0 * a02 + b1 * a12 + b2 * a22 + b3 * a32;
    out[7] = b0 * a03 + b1 * a13 + b2 * a23 + b3 * a33;
    b0 = b[8];
    b1 = b[9];
    b2 = b[10];
    b3 = b[11];
    out[8] = b0 * a00 + b1 * a10 + b2 * a20 + b3 * a30;
    out[9] = b0 * a01 + b1 * a11 + b2 * a21 + b3 * a31;
    out[10] = b0 * a02 + b1 * a12 + b2 * a22 + b3 * a32;
    out[11] = b0 * a03 + b1 * a13 + b2 * a23 + b3 * a33;
    b0 = b[12];
    b1 = b[13];
    b2 = b[14];
    b3 = b[15];
    out[12] = b0 * a00 + b1 * a10 + b2 * a20 + b3 * a30;
    out[13] = b0 * a01 + b1 * a11 + b2 * a21 + b3 * a31;
    out[14] = b0 * a02 + b1 * a12 + b2 * a22 + b3 * a32;
    out[15] = b0 * a03 + b1 * a13 + b2 * a23 + b3 * a33;
    return out;
}

function mat4_target_to(out, eye, target, up=VEC3_UP) {
    let eyex = eye[0], eyey = eye[1], eyez = eye[2],
         upx =  up[0],  upy =  up[1],  upz =  up[2];
    let z0 = eyex - target[0],
        z1 = eyey - target[1],
        z2 = eyez - target[2];
    let len = z0 * z0 + z1 * z1 + z2 * z2;
    if (len > 0) {
        len = 1 / Math.sqrt(len);
        z0 *= len;
        z1 *= len;
        z2 *= len;
    }
    let x0 = upy * z2 - upz * z1,
        x1 = upz * z0 - upx * z2,
        x2 = upx * z1 - upy * z0;
    len = x0 * x0 + x1 * x1 + x2 * x2;
    if (len > 0) {
        len = 1 / Math.sqrt(len);
        x0 *= len;
        x1 *= len;
        x2 *= len;
    }
    out[0] = x0;
    out[1] = x1;
    out[2] = x2;
    out[3] = 0;
    out[4] = z1 * x2 - z2 * x1;
    out[5] = z2 * x0 - z0 * x2;
    out[6] = z0 * x1 - z1 * x0;
    out[7] = 0;
    out[8] = z0;
    out[9] = z1;
    out[10] = z2;
    out[11] = 0;
    out[12] = eyex;
    out[13] = eyey;
    out[14] = eyez;
    out[15] = 1;
    return out;
}

function mat4_perspective(out, fovy, aspect, near, far) {
    let f = 1.0 / Math.tan(fovy / 2),
        nf;
    out[0] = f / aspect;
    out[1] = 0;
    out[2] = 0;
    out[3] = 0;
    out[4] = 0;
    out[5] = f;
    out[6] = 0;
    out[7] = 0;
    out[8] = 0;
    out[9] = 0;
    out[11] = -1;
    out[12] = 0;
    out[13] = 0;
    out[15] = 0;
    if (far != null && far !== Infinity) {
        nf = 1 / (near - far);
        out[10] = (far + near) * nf;
        out[14] = 2 * far * near * nf;
    } else {
        out[10] = -1;
        out[14] = -2 * near;
    }
    return out;
}

function mat4_from_x_rotation(out, rad) {
    let s = Math.sin(rad);
    let c = Math.cos(rad);
    /* Perform axis-specific matrix multiplication */
    out[0] = 1;
    out[1] = 0;
    out[2] = 0;
    out[3] = 0;
    out[4] = 0;
    out[5] = c;
    out[6] = s;
    out[7] = 0;
    out[8] = 0;
    out[9] = -s;
    out[10] = c;
    out[11] = 0;
    out[12] = 0;
    out[13] = 0;
    out[14] = 0;
    out[15] = 1;
    return out;
}

function mat4_from_y_rotation(out, rad) {
    let s = Math.sin(rad);
    let c = Math.cos(rad);
    /* Perform axis-specific matrix multiplication */
    out[0] = c;
    out[1] = 0;
    out[2] = -s;
    out[3] = 0;
    out[4] = 0;
    out[5] = 1;
    out[6] = 0;
    out[7] = 0;
    out[8] = s;
    out[9] = 0;
    out[10] = c;
    out[11] = 0;
    out[12] = 0;
    out[13] = 0;
    out[14] = 0;
    out[15] = 1;
    return out;
}

function mat4_from_z_rotation(out, rad) {
    let s = Math.sin(rad);
    let c = Math.cos(rad);
    /* Perform axis-specific matrix multiplication */
    out[0] = c;
    out[1] = s;
    out[2] = 0;
    out[3] = 0;
    out[4] = -s;
    out[5] = c;
    out[6] = 0;
    out[7] = 0;
    out[8] = 0;
    out[9] = 0;
    out[10] = 1;
    out[11] = 0;
    out[12] = 0;
    out[13] = 0;
    out[14] = 0;
    out[15] = 1;
    return out;
}

function mat4_invert(out, a) {
    let a00 = a[0], a01 = a[1], a02 = a[2], a03 = a[3];
    let a10 = a[4], a11 = a[5], a12 = a[6], a13 = a[7];
    let a20 = a[8], a21 = a[9], a22 = a[10], a23 = a[11];
    let a30 = a[12], a31 = a[13], a32 = a[14], a33 = a[15];
    let b00 = a00 * a11 - a01 * a10;
    let b01 = a00 * a12 - a02 * a10;
    let b02 = a00 * a13 - a03 * a10;
    let b03 = a01 * a12 - a02 * a11;
    let b04 = a01 * a13 - a03 * a11;
    let b05 = a02 * a13 - a03 * a12;
    let b06 = a20 * a31 - a21 * a30;
    let b07 = a20 * a32 - a22 * a30;
    let b08 = a20 * a33 - a23 * a30;
    let b09 = a21 * a32 - a22 * a31;
    let b10 = a21 * a33 - a23 * a31;
    let b11 = a22 * a33 - a23 * a32;
    /* Calculate the determinant */
    let det = b00 * b11 - b01 * b10 + b02 * b09 + b03 * b08 - b04 * b07 + b05 * b06;
    if (!det) {
        return null;
    }
    det = 1.0 / det;
    out[0] = (a11 * b11 - a12 * b10 + a13 * b09) * det;
    out[1] = (a02 * b10 - a01 * b11 - a03 * b09) * det;
    out[2] = (a31 * b05 - a32 * b04 + a33 * b03) * det;
    out[3] = (a22 * b04 - a21 * b05 - a23 * b03) * det;
    out[4] = (a12 * b08 - a10 * b11 - a13 * b07) * det;
    out[5] = (a00 * b11 - a02 * b08 + a03 * b07) * det;
    out[6] = (a32 * b02 - a30 * b05 - a33 * b01) * det;
    out[7] = (a20 * b05 - a22 * b02 + a23 * b01) * det;
    out[8] = (a10 * b10 - a11 * b08 + a13 * b06) * det;
    out[9] = (a01 * b08 - a00 * b10 - a03 * b06) * det;
    out[10] = (a30 * b04 - a31 * b02 + a33 * b00) * det;
    out[11] = (a21 * b02 - a20 * b04 - a23 * b00) * det;
    out[12] = (a11 * b07 - a10 * b09 - a12 * b06) * det;
    out[13] = (a00 * b09 - a01 * b07 + a02 * b06) * det;
    out[14] = (a31 * b01 - a30 * b03 - a32 * b00) * det;
    out[15] = (a20 * b03 - a21 * b01 + a22 * b00) * det;
    return out;
}

function ray_hit_plane(
    out,

    ray_origin_x, ray_origin_y, ray_origin_z,
    ray_vector_x, ray_vector_y, ray_vector_z,

    plane_origin_x, plane_origin_y, plane_origin_z,
    plane_vector_x, plane_vector_y, plane_vector_z
) {
    const delta_x = plane_origin_x - ray_origin_x;
    const delta_y = plane_origin_y - ray_origin_y;
    const delta_z = plane_origin_z - ray_origin_z;

    const ldot = delta_x*plane_vector_x +
                 delta_y*plane_vector_y +
                 delta_z*plane_vector_z ;

    const rdot = ray_vector_x*plane_vector_x +
                 ray_vector_y*plane_vector_y +
                 ray_vector_z*plane_vector_z ;

    const d = ldot / rdot;
    out[0] = ray_origin_x + ray_vector_x * d;
    out[1] = ray_origin_y + ray_vector_y * d;
    out[2] = ray_origin_z + ray_vector_z * d;

    return out;
}

function lerp(v0, v1, t) { return (1 - t) * v0 + t * v1; }
function inv_lerp(min, max, p) { return (p - min) / (max - min); }
    </script>
  </body>
</html>