thrunium 0.0.0-stage → 1.2.0-rc.2

package/dist/thrunium.js

@@ -0,0 +1,2241 @@
+/*! THRUNIUM v1.2.0-rc.2 | (c) Infobits ApS | MIT License */
+"use strict";
+(() => {
+  var __defProp = Object.defineProperty;
+  var __export = (target, all) => {
+    for (var name in all)
+      __defProp(target, name, { get: all[name], enumerable: true });
+  };
+
+  // src/namespace.ts
+  window.THRUNIUM || (window.THRUNIUM = {});
+  var T = window.THRUNIUM;
+
+  // src/env.ts
+  function pageLoad() {
+    T.pageLoaded = true;
+  }
+  function ready(fn) {
+    let fired = false;
+    const once = () => {
+      if (fired) return;
+      fired = true;
+      fn();
+    };
+    if (document.readyState === "complete") {
+      once();
+      return;
+    }
+    document.addEventListener("DOMContentLoaded", once, false);
+    window.addEventListener("load", once, false);
+  }
+  function throwError(txt) {
+    console.error(txt);
+    T.error = true;
+  }
+  function mobileAndTabletcheck() {
+    const a = navigator.userAgent || navigator.vendor || "";
+    return /(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|mobile.+firefox|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows ce|xda|xiino|android|ipad|playbook|silk/i.test(a) || /1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i.test(a.substr(0, 4));
+  }
+  function iOScheck() {
+    return /iPad|iPhone|iPod/.test(navigator.userAgent) && !("MSStream" in window);
+  }
+  function getRandom(min, max, float = false) {
+    if (float) return Math.random() * (max - min) + min;
+    return Math.floor(Math.random() * (max - min + 1)) + min;
+  }
+  function initEnv() {
+    T.container = null;
+    T.gameObject = null;
+    T.error = false;
+    T.pageLoaded = false;
+    T.fontsLoaded = false;
+    ready(pageLoad);
+    if (typeof document !== "undefined" && document.fonts && document.fonts.ready) {
+      void document.fonts.ready.then(() => {
+        T.fontsLoaded = true;
+      });
+    } else {
+      T.fontsLoaded = true;
+    }
+  }
+
+  // src/game.ts
+  var _a;
+  _a = Symbol.toStringTag;
+  var Game = class {
+    /**
+     * Creates a game: a `<canvas>` with its 2d context inside a container, the game loop and the standard events. The canvas is appended to the page and scaled to fit the window. Call `init()` and `start()` afterwards. Must be called with `new`.
+     * @param width Width of the game in pixels.
+     * @param height Height of the game in pixels.
+     * @example
+     * ```js
+     * var game = new THRUNIUM.Game(400, 400);
+     * ```
+     */
+    constructor(width, height) {
+      this[_a] = "THRUNIUM.Game";
+      /**
+       * Density of real canvas pixels per game pixel (device pixel ratio times `fitScale`). Adjusted automatically to keep the game sharp. Read-only.
+       *
+       * @category Variables
+       * @example
+       * ```js
+       * var game = new THRUNIUM.Game(400, 400);
+       * game.scale;
+       * ```
+       */
+      this.scale = 1;
+      /**
+       * How much the game is scaled to fit the browser window. Adjusted automatically when the window is resized. Read-only.
+       *
+       * @category Variables
+       * @example
+       * ```js
+       * var game = new THRUNIUM.Game(400, 400);
+       * game.fitScale;
+       * ```
+       */
+      this.fitScale = 1;
+      /**
+       * Seconds elapsed since the previous frame. Updated every game loop; multiply movement by it to keep speed independent of frame rate.
+       *
+       * @category Variables
+       * @example
+       * ```js
+       * var game = new THRUNIUM.Game(400, 400);
+       * game.states['game'] = function() {
+       * 	playerX += 100 * game.delta; // 100 pixels per second
+       * };
+       * ```
+       */
+      this.delta = 0;
+      /**
+       * Frames per second of the game loop. Updated every frame. Read-only: an overwritten value is replaced on the next frame.
+       *
+       * @category Variables
+       * @example
+       * ```js
+       * var game = new THRUNIUM.Game(400, 400);
+       * game.fps;
+       * ```
+       */
+      this.fps = 0;
+      // Before 1.2.0 this was the string (fps / 60).toFixed(2); it is now a number.
+      /**
+       * Current frames per second divided by 60, as a number with two decimals (for example `1`). Use it to correct game speed on devices that run below 60 fps. Updated every frame. Read-only.
+       *
+       * @category Variables
+       * @example
+       * ```js
+       * var game = new THRUNIUM.Game(400, 400);
+       * game.runSpeed;
+       * ```
+       */
+      this.runSpeed = 0;
+      /**
+       * Unix timestamp in milliseconds of the last time the game loop ran, or `null` before the first frame. Updated every frame. Read-only.
+       *
+       * @category Variables
+       * @example
+       * ```js
+       * var game = new THRUNIUM.Game(400, 400);
+       * game.lastRun;
+       * ```
+       */
+      this.lastRun = null;
+      /**
+       * Whether the game loop is running. `start()` sets it to `true` and `stop()` to `false`; setting it to `false` yourself ends the loop after the current frame.
+       *
+       * @category Variables
+       * @example
+       * ```js
+       * var game = new THRUNIUM.Game(400, 400);
+       * game.gameRunning = false; // the loop stops
+       * ```
+       */
+      this.gameRunning = false;
+      /**
+       * Set to `true` to draw an FPS meter in the top-left corner. Default is `false`.
+       *
+       * @category Variables
+       * @example
+       * ```js
+       * var game = new THRUNIUM.Game(400, 400);
+       * game.showFPS = true;
+       * ```
+       */
+      this.showFPS = false;
+      /**
+       * Free-form name for the game. The engine does not use it, so it is available for your own bookkeeping, for example to prefix saved data. Default is an empty string.
+       *
+       * @category Variables
+       * @example
+       * ```js
+       * var game = new THRUNIUM.Game(400, 400);
+       * game.namespace = 'my-game';
+       * ```
+       */
+      this.namespace = "";
+      /**
+       * X coordinate of the pointer in game coordinates. Updated when the mouse moves or the screen is touched or clicked. Read-only.
+       *
+       * @category Variables
+       * @example
+       * ```js
+       * var game = new THRUNIUM.Game(400, 400);
+       * game.mouseX;
+       * ```
+       */
+      this.mouseX = 0;
+      /**
+       * Y coordinate of the pointer in game coordinates. Updated when the mouse moves or the screen is touched or clicked. Read-only.
+       *
+       * @category Variables
+       * @example
+       * ```js
+       * var game = new THRUNIUM.Game(400, 400);
+       * game.mouseY;
+       * ```
+       */
+      this.mouseY = 0;
+      /**
+       * Name of the state the game loop is currently running (a key of `states`). It starts as the built-in loading screen, `"startup"`, and switches to `startState` once everything has loaded. Assign a new name to change state.
+       *
+       * @category Variables
+       * @example
+       * ```js
+       * var game = new THRUNIUM.Game(400, 400);
+       * game.state = 'game'; // run game.states['game'] each frame
+       * ```
+       */
+      this.state = "startup";
+      /**
+       * Name of the state to run after the loading screen. Used once, so set it before `init()`. Default is `null`, so you have to set it.
+       *
+       * @category Variables
+       * @example
+       * ```js
+       * var game = new THRUNIUM.Game(400, 400);
+       * game.startState = 'menu';
+       * ```
+       */
+      this.startState = null;
+      // Indexed by state name; kept as an array to match 1.0.0.
+      /**
+       * Your game states: an object of functions keyed by name. The function named by `state` is called every frame. Change `state` to switch between them.
+       *
+       * @category Variables
+       * @example
+       * ```js
+       * var game = new THRUNIUM.Game(400, 400);
+       * game.states['game'] = function() {
+       * 	// your code, run every frame
+       * };
+       * ```
+       */
+      this.states = [];
+      /**
+       * Background color drawn behind every frame. Accepts any CSS color (hex, rgb, rgba, hsl, hsla). Default is `"#fff"`.
+       *
+       * @category Variables
+       * @example
+       * ```js
+       * var game = new THRUNIUM.Game(400, 400);
+       * game.backgroundColor = '#eee';
+       * ```
+       */
+      this.backgroundColor = "#fff";
+      /**
+       * Assets to load on startup. Set it before `init()`. Each entry is either the path of an image or audio file, which is also the key the loaded asset is stored under, or an object `{ src, index, spriteMap? }` with the file path, the key to store it under, and an optional `spriteMap` of `{ width, height }` that loads an image as a `Sprite` sprite map. Supported images are jpg, jpeg, png, gif and xbm; audio is mp3, wav, ogg and aac. After `init()` the array is replaced by an object-like array keyed by each entry's index, holding the loaded element (or `Sprite` for sprite maps).
+       *
+       * @category Assets
+       * @example
+       * ```js
+       * var game = new THRUNIUM.Game(400, 400);
+       * // as a string: the path is also the key
+       * game.assets = ['images/sprite.png'];
+       * // the loading screen runs until every asset has loaded, then switches to startState
+       * game.startState = 'game';
+       * game.states['game'] = function() {
+       * 	game.drawImage(game.assets['images/sprite.png'], 0, 0);
+       * };
+       * game.init();
+       * game.start();
+       * ```
+       * @example
+       * ```js
+       * var game = new THRUNIUM.Game(400, 400);
+       * // as an object: choose the key, optionally load a sprite map
+       * game.assets = [{
+       * 	src: 'images/spritemap.png',
+       * 	index: 'tiles',
+       * 	spriteMap: { width: 40, height: 40 }
+       * }];
+       * game.startState = 'game';
+       * game.states['game'] = function() {
+       * 	// Sprite.draw(frame, x, y): frame 0 centred at (50, 50)
+       * 	game.assets['tiles'].draw(0, 50, 50);
+       * };
+       * game.init();
+       * game.start();
+       * ```
+       */
+      // Typed for strict consumers: entries going in are strings or AssetEntry, and
+      // after init() the same array is read by key, which the Record part allows.
+      this.assets = [];
+      /**
+       * Whether `loadAssets()` has run, so the entries of `assets` have been turned into loadable elements. Use `loadedAssets` to see how many have actually finished loading.
+       *
+       * @category Variables
+       * @example
+       * ```js
+       * var game = new THRUNIUM.Game(400, 400);
+       * game.assetsLoaded; // false until init()
+       * ```
+       */
+      this.assetsLoaded = false;
+      /**
+       * Number of requested assets that have finished loading.
+       *
+       * @category Variables
+       * @example
+       * ```js
+       * var game = new THRUNIUM.Game(400, 400);
+       * game.loadedAssets;
+       * ```
+       */
+      this.loadedAssets = 0;
+      /**
+       * Number of assets requested for loading. Set when `loadAssets()` runs; the loading screen is done when `loadedAssets` reaches it.
+       *
+       * @category Variables
+       * @example
+       * ```js
+       * var game = new THRUNIUM.Game(400, 400);
+       * game.assetsToLoad;
+       * ```
+       */
+      this.assetsToLoad = 0;
+      /**
+       * Font family used by `drawText`. Default is `"Arial"`.
+       *
+       * @category Variables
+       * @example
+       * ```js
+       * var game = new THRUNIUM.Game(400, 400);
+       * game.font = 'Courier New';
+       * ```
+       */
+      this.font = "Arial";
+      /**
+       * Font size used by `drawText`, as a CSS size. Default is `"30px"`.
+       *
+       * @category Variables
+       * @example
+       * ```js
+       * var game = new THRUNIUM.Game(400, 400);
+       * game.textSize = '32px';
+       * ```
+       */
+      this.textSize = "30px";
+      // User-assignable events (own properties, no-ops by default).
+      /**
+       * Called when the user clicks the game, and when a touch ends on it (`touchend` calls `click` just before its own handler). It updates `mouseX` and `mouseY` first. Assign a function to handle it. Handlers are attached by `init()`, so assign them before calling it.
+       * @param evt The mouse click, or the touch event when a touch ended.
+       *
+       * @category Events
+       * @example
+       * ```js
+       * var game = new THRUNIUM.Game(400, 400);
+       * game.click = function(e) {
+       * 	// your code here
+       * };
+       * ```
+       */
+      this.click = () => {
+      };
+      /**
+       * Called when the user presses a mouse button in the game. It updates `mouseX` and `mouseY` first. Assign a function to handle it. Handlers are attached by `init()`, so assign them before calling it.
+       * @param evt The mouse event.
+       *
+       * @category Events
+       * @example
+       * ```js
+       * var game = new THRUNIUM.Game(400, 400);
+       * game.mousedown = function(e) {
+       * 	// your code here
+       * };
+       * ```
+       */
+      this.mousedown = () => {
+      };
+      /**
+       * Called when the user releases a mouse button in the game. It updates `mouseX` and `mouseY` first. Assign a function to handle it. Handlers are attached by `init()`, so assign them before calling it.
+       * @param evt The mouse event.
+       *
+       * @category Events
+       * @example
+       * ```js
+       * var game = new THRUNIUM.Game(400, 400);
+       * game.mouseup = function(e) {
+       * 	// your code here
+       * };
+       * ```
+       */
+      this.mouseup = () => {
+      };
+      /**
+       * Called when the pointer moves over the game. It updates `mouseX` and `mouseY` first. Assign a function to handle it.
+       *
+       * @category Events
+       * @example
+       * ```js
+       * var game = new THRUNIUM.Game(400, 400);
+       * game.mousemove = function(e) {
+       * 	// your code here
+       * };
+       * ```
+       */
+      this.mousemove = () => {
+      };
+      /**
+       * Called when the user touches the game with a touchscreen. It updates `mouseX` and `mouseY` first. Assign a function to handle it. The handler is looked up when the event fires, so it can be assigned or changed at any time.
+       * @param evt The touch event.
+       *
+       * @category Events
+       * @example
+       * ```js
+       * var game = new THRUNIUM.Game(400, 400);
+       * game.touch = function(e) {
+       * 	// your code here
+       * };
+       * ```
+       */
+      this.touch = () => {
+      };
+      /**
+       * Called when the user first touches the game with a touchscreen, after `touch`. It updates `mouseX` and `mouseY` first. Assign a function to handle it. The handler is looked up when the event fires, so it can be assigned or changed at any time.
+       * @param evt The touch event.
+       *
+       * @category Events
+       * @example
+       * ```js
+       * var game = new THRUNIUM.Game(400, 400);
+       * game.touchstart = function(e) {
+       * 	// your code here
+       * };
+       * ```
+       */
+      this.touchstart = () => {
+      };
+      /**
+       * Called when the user lifts the touch from a touchscreen, after `click`. It updates `mouseX` and `mouseY` first. Assign a function to handle it. The handler is looked up when the event fires, so it can be assigned or changed at any time.
+       * @param evt The touch event.
+       *
+       * @category Events
+       * @example
+       * ```js
+       * var game = new THRUNIUM.Game(400, 400);
+       * game.touchend = function(e) {
+       * 	// your code here
+       * };
+       * ```
+       */
+      this.touchend = () => {
+      };
+      /**
+       * Called when the user presses a key. Assign a function to handle it; find key codes at keycode.info. Attached by `init()`, so assign it first.
+       * @param evt The keyboard event; `evt.key` holds the key.
+       *
+       * @category Events
+       * @example
+       * ```js
+       * var game = new THRUNIUM.Game(400, 400);
+       * game.keydown = function(e) {
+       * 	// your code here
+       * 	console.log(e.keyCode, e.key);
+       * };
+       * ```
+       */
+      this.keydown = () => {
+      };
+      /**
+       * Called when the user releases a key. Assign a function to handle it. Attached by `init()`, so assign it first.
+       * @param evt The keyboard event; `evt.key` holds the key.
+       *
+       * @category Events
+       * @example
+       * ```js
+       * var game = new THRUNIUM.Game(400, 400);
+       * game.keyup = function(e) {
+       * 	// your code here
+       * 	console.log(e.keyCode, e.key);
+       * };
+       * ```
+       */
+      this.keyup = () => {
+      };
+      /**
+       * Called when the orientation of the device changes. Usually only available on phones.
+       *
+       * @category Events
+       * @example
+       * ```js
+       * var game = new THRUNIUM.Game(400, 400);
+       * game.deviceorientation = function(e) {
+       * 	// your code here
+       * };
+       * ```
+       */
+      this.deviceorientation = () => {
+      };
+      /**
+       * Called when the device reports motion (acceleration or rotation). Usually only available on phones. Since 1.1.0 this handler is actually attached; 1.0.0 never called it.
+       *
+       * @category Events
+       * @example
+       * ```js
+       * var game = new THRUNIUM.Game(400, 400);
+       * game.devicemotion = function(e) {
+       * 	// your code here
+       * };
+       * ```
+       */
+      this.devicemotion = () => {
+      };
+      /**
+       * Called after the game has refitted itself when the window is resized. The name is misspelled on purpose and is kept for compatibility.
+       *
+       * @category Events
+       * @example
+       * ```js
+       * var game = new THRUNIUM.Game(400, 400);
+       * game.rezise = function(e) {
+       * 	// your code here
+       * };
+       * ```
+       */
+      this.rezise = () => {
+      };
+      // Arrow fields so they can be passed straight to addEventListener while
+      // always dispatching to the CURRENT user handler.
+      /**
+       * Internal listener that forwards to `deviceorientation`.
+       *
+       * @internal
+       */
+      this._deviceorientation = (evt) => {
+        this.deviceorientation(evt);
+      };
+      /**
+       * Internal listener that forwards to `devicemotion`.
+       *
+       * @internal
+       */
+      this._devicemotion = (evt) => {
+        this.devicemotion(evt);
+      };
+      /**
+       * Internal listener for mouse and touch movement.
+       *
+       * @internal
+       */
+      this._mousetouchmove = (evt) => {
+        evt.preventDefault();
+        this.getMouseCords(evt);
+        this.mousemove(evt);
+      };
+      /**
+       * Internal listener for touch start.
+       *
+       * @internal
+       */
+      this._touchstart = (evt) => {
+        evt.preventDefault();
+        this.getMouseCords(evt);
+        this.touch(evt);
+        this.touchstart(evt);
+      };
+      /**
+       * Internal listener for touch end.
+       *
+       * @internal
+       */
+      this._touchend = (evt) => {
+        evt.preventDefault();
+        this.getMouseCords(evt);
+        this.click(evt);
+        this.touchend(evt);
+      };
+      /**
+       * Internal window resize listener.
+       *
+       * @internal
+       */
+      this._resize = (evt) => {
+        var _a3, _b;
+        this.updateFitScale();
+        this.updateScale();
+        const elems = (_b = (_a3 = T.Elem) == null ? void 0 : _a3.elemsList) != null ? _b : [];
+        for (let i = 0; i < elems.length; i++) elems[i].resize();
+        this.rezise(evt);
+      };
+      // Arrow field: used as an onload handler, so it must keep `this` = the Game.
+      /**
+       * Internal onload handler that counts a loaded asset.
+       *
+       * @internal
+       */
+      this.assetLoaded = () => {
+        this.loadedAssets++;
+      };
+      // A plain `function` property on purpose: as an onload handler `this` is the
+      // image element, and the Game is reached through the captured `self`.
+      /**
+       * Internal onload handler that turns a loaded sprite-map image into a `Sprite`.
+       *
+       * @internal
+       */
+      this.initAssetSpriteMap = /* @__PURE__ */ ((self) => function() {
+        const assets = self.assets;
+        const Sprite2 = T.Sprite;
+        const sprite = new Sprite2(this);
+        assets[this.dataset.index] = sprite;
+        sprite.setSpriteMap(Number(this.dataset.spriteWidth), Number(this.dataset.spriteHeight));
+        self.loadedAssets++;
+      })(this);
+      // Arrow field so it can be handed straight to requestAnimationFrame.
+      /**
+       * One frame of the game loop.
+       *
+       * @internal
+       */
+      this.gameLoop = () => {
+        if (!this.lastRun) {
+          this.lastRun = Date.now();
+          this.requestFrame(this.gameLoop);
+          return;
+        }
+        this.delta = (Date.now() - this.lastRun) / 1e3;
+        this.lastRun = Date.now();
+        this.fps = 1 / this.delta;
+        this.runSpeed = Math.round(this.fps / 60 * 100) / 100;
+        this.ctx.clearRect(0, 0, this.width, this.height);
+        this.canvas.style.cursor = "default";
+        this.drawRect(0, 0, this.width, this.height);
+        this.setFillColor(this.backgroundColor);
+        this.fill();
+        if (this.state == "startup") this.startup();
+        else this.states[this.state]();
+        if (this.showFPS) this.drawFPS();
+        if (this.gameRunning && !T.error) this.requestFrame(this.gameLoop);
+      };
+      this.width = width;
+      this.height = height;
+      this.contruct();
+    }
+    /**
+     * Updates `mouseX` and `mouseY` (in game coordinates) from a mouse or touch event. The engine calls it for you before the mouse and touch handlers run, so you only need it to read the position of an event you handle yourself. Since 1.1.0 it uses this game instead of a global variable named `game`, and handles touch-end events that have no `touches`.
+     * @param evt The mouse or touch event to read the position from.
+     * @example
+     * ```js
+     * var game = new THRUNIUM.Game(400, 400);
+     * game.canvas.addEventListener('pointerdown', function(e) {
+     * 	game.getMouseCords(e);
+     * 	console.log(game.mouseX, game.mouseY);
+     * });
+     * ```
+     */
+    getMouseCords(evt) {
+      let point = evt;
+      if (point.clientX === void 0) {
+        const te = evt;
+        if (te.touches && te.touches[0]) point = te.touches[0];
+        else if (te.changedTouches && te.changedTouches[0]) point = te.changedTouches[0];
+      }
+      const rect = this.canvas.getBoundingClientRect();
+      const sx = this.canvas.scrollWidth / this.width;
+      const sy = this.canvas.scrollHeight / this.height;
+      this.mouseX = (point.clientX - rect.left) / sx;
+      this.mouseY = (point.clientY - rect.top) / sy;
+    }
+    /**
+     * Sizes the canvas backing store for the device pixel ratio and fit scale.
+     *
+     * @internal
+     */
+    updateScale() {
+      this.scale = window.devicePixelRatio * this.fitScale;
+      this.canvas.width = this.width * this.scale;
+      this.canvas.height = this.height * this.scale;
+      this.ctx.scale(this.scale, this.scale);
+    }
+    /**
+     * Fits the canvas and container to the window, preserving aspect ratio.
+     *
+     * @internal
+     */
+    updateFitScale() {
+      if (this.width / this.height > window.innerWidth / window.innerHeight) {
+        this.fitScale = window.innerWidth / this.width;
+      } else {
+        this.fitScale = window.innerHeight / this.height;
+      }
+      const w = this.width * this.fitScale + "px";
+      const h = this.height * this.fitScale + "px";
+      this.canvas.style.width = w;
+      this.canvas.style.height = h;
+      const container = T.container;
+      container.style.width = w;
+      container.style.height = h;
+    }
+    /**
+     * Creates the container and canvas and hooks the window resize event. The constructor calls it, so you do not need to. The name is misspelled on purpose and is kept for compatibility.
+     * @example
+     * ```js
+     * var game = new THRUNIUM.Game(400, 400);
+     * // the constructor has already called game.contruct()
+     * ```
+     */
+    contruct() {
+      document.body.style.background = "#333";
+      const container = document.createElement("div");
+      container.style.position = "relative";
+      container.style.display = "block";
+      container.style.margin = "auto";
+      T.container = container;
+      T.gameObject = this;
+      document.body.appendChild(container);
+      this.canvas = document.createElement("canvas");
+      container.appendChild(this.canvas);
+      this.ctx = this.canvas.getContext("2d");
+      this.canvas.style.display = "block";
+      this.canvas.style.margin = "auto";
+      this._resize();
+      window.addEventListener("resize", this._resize, false);
+      this.ctx.imageSmoothingEnabled = false;
+    }
+    /**
+     * Initializes the game: loads `assets`, fits the canvas to the window and attaches the event handlers as they are at this moment. Assign your handlers and `assets` before calling it, and call it before `start()`.
+     * @example
+     * ```js
+     * var game = new THRUNIUM.Game(400, 400);
+     * game.startState = 'menu';
+     * game.init();
+     * ```
+     */
+    init() {
+      if (!this.assetsLoaded) this.loadAssets();
+      this._resize();
+      this.canvas.addEventListener("click", this.click, false);
+      this.canvas.addEventListener("mousedown", this.mousedown, false);
+      this.canvas.addEventListener("mouseup", this.mouseup, false);
+      this.canvas.addEventListener("touchstart", this._touchstart, false);
+      this.canvas.addEventListener("touchend", this._touchend, false);
+      document.addEventListener("keydown", this.keydown, false);
+      document.addEventListener("keyup", this.keyup, false);
+      this.canvas.addEventListener("touchmove", this._mousetouchmove, false);
+      this.canvas.addEventListener("mousemove", this._mousetouchmove, false);
+      window.addEventListener("deviceorientation", this._deviceorientation);
+      window.addEventListener("devicemotion", this._devicemotion);
+    }
+    /**
+     * Creates an `Image` or `Audio` element for every entry of `assets` and starts loading it, then replaces `assets` with an object-like array keyed by each entry's index. `init()` calls it for you, so you rarely need it directly. Unknown entries and file types are logged to the console and skipped.
+     *
+     * @category Assets
+     * @example
+     * ```js
+     * var game = new THRUNIUM.Game(400, 400);
+     * game.assets = ['sounds/jump.wav'];
+     * game.loadAssets();
+     * game.assets['sounds/jump.wav'].play();
+     * ```
+     */
+    loadAssets() {
+      this.assetsToLoad = this.assets.length;
+      const tempAssets = [];
+      const byIndex = tempAssets;
+      for (let i = 0; i < this.assets.length; i++) {
+        const entry = this.assets[i];
+        let index;
+        let src;
+        let spriteMap = null;
+        if (typeof entry === "string") {
+          src = entry;
+          index = src;
+        } else if (typeof entry === "object" && entry !== null) {
+          const spec = entry;
+          src = spec.src;
+          index = spec.index;
+          if (spec.spriteMap !== void 0) spriteMap = spec.spriteMap;
+        } else {
+          console.error("ASSETS - Unknown entry");
+          continue;
+        }
+        const fileExtension = this.getFileExtension(src);
+        byIndex[index] = null;
+        let el;
+        if (this.isImage(fileExtension)) el = new Image();
+        else if (this.isAudio(fileExtension)) el = new Audio();
+        else {
+          console.error("ASSETS - Unknown file type: " + fileExtension + " for file " + src);
+          continue;
+        }
+        byIndex[index] = el;
+        el.dataset.index = index;
+        if (spriteMap !== null) {
+          el.dataset.spriteWidth = String(spriteMap.width);
+          el.dataset.spriteHeight = String(spriteMap.height);
+        }
+        el.onload = spriteMap !== null ? this.initAssetSpriteMap : this.assetLoaded;
+        el.src = src;
+      }
+      this.assets = tempAssets;
+      this.assetsLoaded = true;
+    }
+    /**
+     * Returns the text after the last dot of a file name, or `undefined`.
+     *
+     * @internal
+     */
+    getFileExtension(filename) {
+      return /[.]/.exec(filename) ? /[^.]+$/.exec(filename)[0] : void 0;
+    }
+    /**
+     * Whether a file extension is a supported image type.
+     *
+     * @internal
+     */
+    isImage(ext) {
+      return ["jpg", "jpeg", "png", "gif", "xbm"].includes(ext);
+    }
+    /**
+     * Whether a file extension is a supported audio type.
+     *
+     * @internal
+     */
+    isAudio(ext) {
+      return ["mp3", "wav", "ogg", "aac"].includes(ext);
+    }
+    // color
+    /**
+     * Sets the fill color used by `fill()` and `drawText`.
+     *
+     * @category Drawing
+     * @param color Any CSS color: hex, rgb, rgba, hsl, hsla or a name.
+     * @example
+     * ```js
+     * var game = new THRUNIUM.Game(400, 400);
+     * game.setFillColor('#f00');
+     * game.drawRect(10, 10, 50, 50);
+     * game.fill();
+     * ```
+     */
+    setFillColor(color) {
+      this.ctx.fillStyle = color;
+    }
+    /**
+     * Fills the current path (for example from `drawRect` or `drawCircle`) with the fill color.
+     *
+     * @category Drawing
+     * @example
+     * ```js
+     * var game = new THRUNIUM.Game(400, 400);
+     * game.setFillColor('#0a0');
+     * game.drawCircle(100, 100, 20);
+     * game.fill();
+     * ```
+     */
+    fill() {
+      this.ctx.fill();
+    }
+    /**
+     * Sets the stroke color used by `stroke()` and `drawLine`.
+     *
+     * @category Drawing
+     * @param color Any CSS color: hex, rgb, rgba, hsl, hsla or a name.
+     * @example
+     * ```js
+     * var game = new THRUNIUM.Game(400, 400);
+     * game.setStrokeColor('#00f');
+     * game.drawLine(0, 0, 100, 100);
+     * ```
+     */
+    setStrokeColor(color) {
+      this.ctx.strokeStyle = color;
+    }
+    /**
+     * Strokes the outline of the current path with the stroke color.
+     *
+     * @category Drawing
+     * @example
+     * ```js
+     * var game = new THRUNIUM.Game(400, 400);
+     * game.setStrokeColor('#000');
+     * game.drawRect(10, 10, 50, 50);
+     * game.stroke();
+     * ```
+     */
+    stroke() {
+      this.ctx.stroke();
+    }
+    // draw
+    /**
+     * Draws a line from (x1, y1) to (x2, y2) with the stroke color. When `width` is given it sets the canvas `lineWidth`; like all canvas state it then persists for later strokes until changed (since 1.1.0; 1.0.0 ignored `width`).
+     *
+     * @category Drawing
+     * @param x1 X coordinate of the start.
+     * @param y1 Y coordinate of the start.
+     * @param x2 X coordinate of the end.
+     * @param y2 Y coordinate of the end.
+     * @param width Line width in pixels. Leave out to keep the current width.
+     * @example
+     * ```js
+     * var game = new THRUNIUM.Game(400, 400);
+     * game.drawLine(100, 100, 200, 200);
+     * game.drawLine(100, 200, 200, 100, 4); // 4 pixels wide, and later lines stay 4 wide
+     * ```
+     */
+    drawLine(x1, y1, x2, y2, width) {
+      this.ctx.beginPath();
+      if (width) this.ctx.lineWidth = width;
+      this.ctx.moveTo(x1, y1);
+      this.ctx.lineTo(x2, y2);
+      this.ctx.stroke();
+      this.ctx.closePath();
+    }
+    /**
+     * Draws text at (x, y) using `font` and `textSize` and the fill color.
+     *
+     * @category Drawing
+     * @param text The text to draw.
+     * @param x X coordinate of the text.
+     * @param y Y coordinate of the text.
+     * @example
+     * ```js
+     * var game = new THRUNIUM.Game(400, 400);
+     * game.drawText('Hello World!', 100, 100);
+     * ```
+     */
+    drawText(text, x, y) {
+      this.ctx.font = this.textSize + " " + this.font;
+      this.ctx.fillText(text, x, y);
+    }
+    /**
+     * Traces a rectangle path, with rounded corners if `radius` is given. It only builds the path: call `fill()` or `stroke()` afterwards to draw it.
+     *
+     * @category Drawing
+     * @param x X coordinate of the left edge.
+     * @param y Y coordinate of the top edge.
+     * @param width Width of the rectangle.
+     * @param height Height of the rectangle.
+     * @param radius Corner radius. Leave out for square corners.
+     * @example
+     * ```js
+     * var game = new THRUNIUM.Game(400, 400);
+     * game.drawRect(100, 100, 20, 20);
+     * game.fill();
+     * ```
+     */
+    drawRect(x, y, width, height, radius) {
+      const ctx = this.ctx;
+      ctx.beginPath();
+      if (radius) {
+        ctx.moveTo(x + radius, y);
+        ctx.lineTo(x + width - radius, y);
+        ctx.quadraticCurveTo(x + width, y, x + width, y + radius);
+        ctx.lineTo(x + width, y + height - radius);
+        ctx.quadraticCurveTo(x + width, y + height, x + width - radius, y + height);
+        ctx.lineTo(x + radius, y + height);
+        ctx.quadraticCurveTo(x, y + height, x, y + height - radius);
+        ctx.lineTo(x, y + radius);
+        ctx.quadraticCurveTo(x, y, x + radius, y);
+      } else {
+        ctx.rect(x, y, width, height);
+      }
+      ctx.closePath();
+    }
+    /**
+     * Traces a circle path. It only builds the path: call `fill()` or `stroke()` afterwards to draw it.
+     *
+     * @category Drawing
+     * @param x X coordinate of the center.
+     * @param y Y coordinate of the center.
+     * @param radius Radius of the circle.
+     * @example
+     * ```js
+     * var game = new THRUNIUM.Game(400, 400);
+     * game.drawCircle(100, 100, 20);
+     * game.fill();
+     * ```
+     */
+    drawCircle(x, y, radius) {
+      this.ctx.beginPath();
+      this.ctx.arc(x, y, radius, 0, 2 * Math.PI);
+      this.ctx.closePath();
+    }
+    /**
+     * Draws an image at (x, y), scaled to `width` by `height` when both are given.
+     *
+     * @category Drawing
+     * @param img The image to draw, for example a loaded entry of `assets`.
+     * @param x X coordinate of the left edge.
+     * @param y Y coordinate of the top edge.
+     * @param width Width to draw at. Needs `height` as well; leave out for the natural size.
+     * @param height Height to draw at. Needs `width` as well; leave out for the natural size.
+     * @example
+     * ```js
+     * var game = new THRUNIUM.Game(400, 400);
+     * game.assets = ['image.png'];
+     * game.init();
+     * game.drawImage(game.assets['image.png'], 100, 100);
+     * game.drawImage(game.assets['image.png'], 100, 100, 200, 200);
+     * ```
+     */
+    drawImage(img, x, y, width = null, height = null) {
+      this.ctx.beginPath();
+      if (width !== null && height !== null) {
+        this.ctx.drawImage(img, x, y, width, height);
+      } else {
+        this.ctx.drawImage(img, x, y);
+      }
+      this.ctx.closePath();
+    }
+    // loop control
+    /**
+     * Starts the game loop. Each frame it clears the canvas, fills the background and runs the current state.
+     * @example
+     * ```js
+     * var game = new THRUNIUM.Game(400, 400);
+     * game.init();
+     * game.start();
+     * ```
+     */
+    start() {
+      this.gameRunning = true;
+      this.requestFrame(this.gameLoop);
+    }
+    /**
+     * Stops the game loop. Call `start()` to run it again.
+     * @example
+     * ```js
+     * var game = new THRUNIUM.Game(400, 400);
+     * game.stop();
+     * ```
+     */
+    stop() {
+      this.gameRunning = false;
+    }
+    /** Prefers the legacy window.requestAnimFrame alias, else requestAnimationFrame. */
+    requestFrame(cb) {
+      if (typeof window.requestAnimFrame === "function") window.requestAnimFrame(cb);
+      else requestAnimationFrame(cb);
+    }
+    /**
+     * Built-in loading screen shown while `state` is `"startup"`.
+     *
+     * @internal
+     */
+    startup() {
+      this.drawRect(0, 0, this.width, this.height);
+      this.setFillColor("#000");
+      this.fill();
+      this.ctx.font = "25px Arial";
+      this.ctx.textAlign = "center";
+      this.ctx.textBaseline = "bottom";
+      this.setFillColor("#fff");
+      this.ctx.fillText("Loading game", this.width / 2, this.height / 2 - 10);
+      this.drawRect(this.width / 2 - 100, this.height / 2, 200, 20, 10);
+      this.setStrokeColor("#fff");
+      this.stroke();
+      let loaded = 200 / this.assetsToLoad * this.loadedAssets;
+      if (loaded < 20) loaded = 20;
+      this.drawRect(this.width / 2 - 100, this.height / 2, loaded, 20, 10);
+      this.setFillColor("#fff");
+      this.fill();
+      if (this.assetsToLoad == this.loadedAssets && T.pageLoaded && T.fontsLoaded) {
+        this._resize();
+        this.state = this.startState;
+      }
+    }
+    /**
+     * Draws the FPS meter shown when `showFPS` is true.
+     *
+     * @internal
+     */
+    drawFPS() {
+      this.ctx.fillStyle = "gray";
+      this.ctx.font = "normal 16pt Arial";
+      this.ctx.textAlign = "left";
+      this.ctx.textBaseline = "top";
+      this.ctx.fillText(Math.round(this.fps) + " fps - scale: " + this.scale, 5, 5);
+    }
+  };
+
+  // src/vector.ts
+  var Vector = class {
+    /**
+     * Creates a vector. Must be called with `new`.
+     * @param x The x component.
+     * @param y The y component.
+     * @example
+     * ```js
+     * var vector = new THRUNIUM.Vector(10, 20);
+     * ```
+     */
+    constructor(x, y) {
+      this.x = x;
+      this.y = y;
+    }
+    // Makes Object.prototype.toString.call(v) give '[object THRUNIUM.Vector]'.
+    get [Symbol.toStringTag]() {
+      return "THRUNIUM.Vector";
+    }
+    // Built through T.Vector so a game that patches THRUNIUM.Vector gets its own class (1.0.0 behavior).
+    /**
+     * Returns a new vector with the same `x` and `y`. Changing the copy does not change the original.
+     *
+     * @example
+     * ```js
+     * var vector = new THRUNIUM.Vector(10, 20);
+     * var copy = vector.clone();
+     * copy.scale(2);
+     * // vector is still (10, 20), copy is (20, 40)
+     * ```
+     */
+    clone() {
+      return new T.Vector(this.x, this.y);
+    }
+    /**
+     * Returns `true` if both components equal those of `vector`. The comparison is loose (`==`), as in 1.0.0.
+     * @param vector The vector to compare with.
+     * @example
+     * ```js
+     * var a = new THRUNIUM.Vector(10, 20);
+     * var b = new THRUNIUM.Vector(10, 20);
+     * a.equal(b); // true
+     * ```
+     */
+    equal(vector) {
+      return this.x == vector.x && this.y == vector.y;
+    }
+    /**
+     * Multiplies both components by `scale`.
+     * @param scale The factor to multiply by.
+     * @example
+     * ```js
+     * var vector = new THRUNIUM.Vector(10, 20);
+     * vector.scale(2);
+     * // vector is now (20, 40)
+     * ```
+     */
+    scale(scale) {
+      this.x *= scale;
+      this.y *= scale;
+    }
+    /**
+     * Multiplies the x component by `scale`.
+     * @param scale The factor to multiply by.
+     * @example
+     * ```js
+     * var vector = new THRUNIUM.Vector(10, 20);
+     * vector.scaleX(2);
+     * // vector is now (20, 20)
+     * ```
+     */
+    scaleX(scale) {
+      this.x *= scale;
+    }
+    /**
+     * Multiplies the y component by `scale`.
+     * @param scale The factor to multiply by.
+     * @example
+     * ```js
+     * var vector = new THRUNIUM.Vector(10, 20);
+     * vector.scaleY(2);
+     * // vector is now (10, 40)
+     * ```
+     */
+    scaleY(scale) {
+      this.y *= scale;
+    }
+    /**
+     * Adds `vector` to this vector.
+     * @param vector The vector to add.
+     * @example
+     * ```js
+     * var vector = new THRUNIUM.Vector(10, 20);
+     * vector.add(new THRUNIUM.Vector(5, 2));
+     * // vector is now (15, 22)
+     * ```
+     */
+    add(vector) {
+      this.x += vector.x;
+      this.y += vector.y;
+    }
+    /**
+     * Adds the x component of `vector` to this vector's x component.
+     * @param vector The vector whose x component is added.
+     * @example
+     * ```js
+     * var vector = new THRUNIUM.Vector(10, 20);
+     * vector.addX(new THRUNIUM.Vector(5, 2));
+     * // vector is now (15, 20)
+     * ```
+     */
+    addX(vector) {
+      this.x += vector.x;
+    }
+    /**
+     * Adds the y component of `vector` to this vector's y component.
+     * @param vector The vector whose y component is added.
+     * @example
+     * ```js
+     * var vector = new THRUNIUM.Vector(10, 20);
+     * vector.addY(new THRUNIUM.Vector(5, 2));
+     * // vector is now (10, 22)
+     * ```
+     */
+    addY(vector) {
+      this.y += vector.y;
+    }
+    /**
+     * Subtracts `vector` from this vector.
+     * @param vector The vector to subtract.
+     * @example
+     * ```js
+     * var vector = new THRUNIUM.Vector(10, 20);
+     * vector.subtract(new THRUNIUM.Vector(2, 10));
+     * // vector is now (8, 10)
+     * ```
+     */
+    subtract(vector) {
+      this.x -= vector.x;
+      this.y -= vector.y;
+    }
+    /**
+     * Subtracts the x component of `vector` from this vector's x component.
+     * @param vector The vector whose x component is subtracted.
+     * @example
+     * ```js
+     * var vector = new THRUNIUM.Vector(10, 20);
+     * vector.subtractX(new THRUNIUM.Vector(2, 10));
+     * // vector is now (8, 20)
+     * ```
+     */
+    subtractX(vector) {
+      this.x -= vector.x;
+    }
+    /**
+     * Subtracts the y component of `vector` from this vector's y component.
+     * @param vector The vector whose y component is subtracted.
+     * @example
+     * ```js
+     * var vector = new THRUNIUM.Vector(10, 20);
+     * vector.subtractY(new THRUNIUM.Vector(2, 10));
+     * // vector is now (10, 10)
+     * ```
+     */
+    subtractY(vector) {
+      this.y -= vector.y;
+    }
+    /**
+     * Divides each component by the matching component of `vector`.
+     * @param vector The vector to divide by.
+     * @example
+     * ```js
+     * var vector = new THRUNIUM.Vector(10, 20);
+     * vector.divide(new THRUNIUM.Vector(2, 4));
+     * // vector is now (5, 5)
+     * ```
+     */
+    divide(vector) {
+      this.x /= vector.x;
+      this.y /= vector.y;
+    }
+    /**
+     * Divides the x component by the x component of `vector`.
+     * @param vector The vector whose x component is the divisor.
+     * @example
+     * ```js
+     * var vector = new THRUNIUM.Vector(10, 20);
+     * vector.divideX(new THRUNIUM.Vector(2, 4));
+     * // vector is now (5, 20)
+     * ```
+     */
+    divideX(vector) {
+      this.x /= vector.x;
+    }
+    /**
+     * Divides the y component by the y component of `vector`.
+     * @param vector The vector whose y component is the divisor.
+     * @example
+     * ```js
+     * var vector = new THRUNIUM.Vector(10, 20);
+     * vector.divideY(new THRUNIUM.Vector(2, 4));
+     * // vector is now (10, 5)
+     * ```
+     */
+    divideY(vector) {
+      this.y /= vector.y;
+    }
+    /**
+     * Multiplies each component by the matching component of `vector`.
+     * @param vector The vector to multiply by.
+     * @example
+     * ```js
+     * var vector = new THRUNIUM.Vector(10, 20);
+     * vector.multiply(new THRUNIUM.Vector(4, 2));
+     * // vector is now (40, 40)
+     * ```
+     */
+    multiply(vector) {
+      this.x *= vector.x;
+      this.y *= vector.y;
+    }
+    /**
+     * Multiplies the x component by the x component of `vector`.
+     * @param vector The vector whose x component is the factor.
+     * @example
+     * ```js
+     * var vector = new THRUNIUM.Vector(10, 20);
+     * vector.multiplyX(new THRUNIUM.Vector(4, 2));
+     * // vector is now (40, 20)
+     * ```
+     */
+    multiplyX(vector) {
+      this.x *= vector.x;
+    }
+    /**
+     * Multiplies the y component by the y component of `vector`.
+     * @param vector The vector whose y component is the factor.
+     * @example
+     * ```js
+     * var vector = new THRUNIUM.Vector(10, 20);
+     * vector.multiplyY(new THRUNIUM.Vector(4, 2));
+     * // vector is now (10, 40)
+     * ```
+     */
+    multiplyY(vector) {
+      this.y *= vector.y;
+    }
+    /**
+     * Flips the sign of both components, so the vector points the other way.
+     *
+     * @example
+     * ```js
+     * var vector = new THRUNIUM.Vector(10, 20);
+     * vector.invert();
+     * // vector is now (-10, -20)
+     * ```
+     */
+    invert() {
+      this.x *= -1;
+      this.y *= -1;
+    }
+    /**
+     * Flips the sign of the x component.
+     *
+     * @example
+     * ```js
+     * var vector = new THRUNIUM.Vector(10, 20);
+     * vector.invertX();
+     * // vector is now (-10, 20)
+     * ```
+     */
+    invertX() {
+      this.x *= -1;
+    }
+    /**
+     * Flips the sign of the y component.
+     *
+     * @example
+     * ```js
+     * var vector = new THRUNIUM.Vector(10, 20);
+     * vector.invertY();
+     * // vector is now (10, -20)
+     * ```
+     */
+    invertY() {
+      this.y *= -1;
+    }
+    // Bug #8 fix: 1.0.0 computed x/y and y/x, which is not normalization.
+    /**
+     * Scales the vector to length 1, keeping its direction. The zero vector stays (0, 0). Since 1.1.0 this returns a real unit vector; 1.0.0 computed something else.
+     *
+     * @example
+     * ```js
+     * var vector = new THRUNIUM.Vector(3, 4);
+     * vector.normalize();
+     * // vector is now (0.6, 0.8)
+     * ```
+     */
+    normalize() {
+      const length = Math.sqrt(this.x * this.x + this.y * this.y);
+      if (length === 0) return;
+      this.x /= length;
+      this.y /= length;
+    }
+    /**
+     * Clamps each component to the range from `-vector` to `+vector` on that axis: `x` to between `-vector.x` and `vector.x`, `y` to between `-vector.y` and `vector.y`. Useful for capping a velocity. Pass a vector with non-negative components.
+     * @param vector The largest allowed size of each component.
+     * @example
+     * ```js
+     * var vector = new THRUNIUM.Vector(10, 20);
+     * vector.limit(new THRUNIUM.Vector(10, 10));
+     * // vector is now (10, 10)
+     * ```
+     */
+    limit(vector) {
+      if (this.x > vector.x) this.x = vector.x;
+      if (this.y > vector.y) this.y = vector.y;
+      if (this.x < vector.x * -1) this.x = vector.x * -1;
+      if (this.y < vector.y * -1) this.y = vector.y * -1;
+    }
+    /**
+     * Does nothing. It is kept so games written for 1.0.0, where it was also empty, keep working. Use `limit()` to clamp a vector.
+     * @param _len Ignored.
+     * @example
+     * ```js
+     * var vector = new THRUNIUM.Vector(10, 20);
+     * vector.limitLength(5);
+     * // vector is still (10, 20)
+     * ```
+     */
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    limitLength(_len) {
+    }
+  };
+
+  // src/collider.ts
+  var Collider = {
+    /**
+     * Returns `true` if the object has the `x`, `y` and `radius` of a circle. It does not look at `pos`; call `fixPos()` first for a shape that uses one.
+     * @param circle The object to check.
+     * @example
+     * ```js
+     * THRUNIUM.Collider.isCircle({ x: 100, y: 100, radius: 50 }); // true
+     * THRUNIUM.Collider.isCircle({ x: 100, y: 100 }); // false
+     * ```
+     */
+    isCircle(circle) {
+      return circle.x !== void 0 && circle.y !== void 0 && circle.radius !== void 0;
+    },
+    /**
+     * Returns `true` if the object has the `x`, `y`, `width` and `height` of a rect. It does not look at `pos`; call `fixPos()` first for a shape that uses one.
+     * @param rect The object to check.
+     * @example
+     * ```js
+     * THRUNIUM.Collider.isRect({ x: 100, y: 100, width: 50, height: 50 }); // true
+     * THRUNIUM.Collider.isRect({ x: 100, y: 100, radius: 50 }); // false
+     * ```
+     */
+    isRect(rect) {
+      return rect.x !== void 0 && rect.y !== void 0 && rect.width !== void 0 && rect.height !== void 0;
+    },
+    /**
+     * Copies `pos.x` and `pos.y` onto the shape's own `x` and `y`, and returns the same object. A shape without a `pos` is returned unchanged. The result has the same shape you passed in, so a circle stays a circle and a rect stays a rect. The collision checks call it for you.
+     * @param object The shape to update.
+     * @example
+     * ```js
+     * var rect = { pos: new THRUNIUM.Vector(100, 100), width: 50, height: 50 };
+     * THRUNIUM.Collider.fixPos(rect);
+     * // rect.x is now 100 and rect.y is 100
+     * ```
+     */
+    fixPos(object) {
+      if (object.pos === void 0) return object;
+      if (object.pos.x === void 0 && object.pos.y === void 0) return object;
+      object.x = object.pos.x;
+      object.y = object.pos.y;
+      return object;
+    },
+    /**
+     * Returns `true` if two rects overlap. Rects whose edges just touch count as colliding. Each rect needs `x`, `y`, `width` and `height`, or `pos`, `width` and `height`.
+     * @param _a The first rect.
+     * @param _b The second rect.
+     * @example
+     * ```js
+     * var rect1 = { x: 100, y: 100, width: 50, height: 50 };
+     * var rect2 = { x: 140, y: 140, width: 50, height: 50 };
+     * if (THRUNIUM.Collider.rect(rect1, rect2)) {
+     * 	console.log('Collision!');
+     * }
+     * ```
+     * @example
+     * ```js
+     * var rect1 = { pos: new THRUNIUM.Vector(100, 100), width: 50, height: 50 };
+     * var rect2 = { pos: new THRUNIUM.Vector(140, 140), width: 50, height: 50 };
+     * if (THRUNIUM.Collider.rect(rect1, rect2)) {
+     * 	console.log('Collision!');
+     * }
+     * ```
+     */
+    rect(_a3, _b) {
+      const a = Collider.fixPos(_a3);
+      const b = Collider.fixPos(_b);
+      if (!Collider.isRect(a) || !Collider.isRect(b)) {
+        throwError("One of the objects is not defined correctly as a rect");
+        return false;
+      }
+      const [ax, ay, aw, ah] = [a.x, a.y, a.width, a.height];
+      const [bx, by, bw, bh] = [b.x, b.y, b.width, b.height];
+      if (ax + aw / 2 < bx - bw / 2) return false;
+      if (ax - aw / 2 > bx + bw / 2) return false;
+      if (ay + ah / 2 < by - bh / 2) return false;
+      if (ay - ah / 2 > by + bh / 2) return false;
+      return true;
+    },
+    /**
+     * Returns `true` if two circles overlap. Circles that just touch do not count as colliding. Each circle needs `x`, `y` and `radius`, or `pos` and `radius`.
+     * @param _a The first circle.
+     * @param _b The second circle.
+     * @example
+     * ```js
+     * var circle1 = { x: 100, y: 100, radius: 50 };
+     * var circle2 = { x: 140, y: 140, radius: 50 };
+     * if (THRUNIUM.Collider.circle(circle1, circle2)) {
+     * 	console.log('Collision!');
+     * }
+     * ```
+     * @example
+     * ```js
+     * var circle1 = { pos: new THRUNIUM.Vector(100, 100), radius: 50 };
+     * var circle2 = { pos: new THRUNIUM.Vector(140, 140), radius: 50 };
+     * if (THRUNIUM.Collider.circle(circle1, circle2)) {
+     * 	console.log('Collision!');
+     * }
+     * ```
+     */
+    circle(_a3, _b) {
+      const a = Collider.fixPos(_a3);
+      const b = Collider.fixPos(_b);
+      if (!Collider.isCircle(a) || !Collider.isCircle(b)) {
+        throwError("One of the objects is not defined correctly as a circle");
+        return false;
+      }
+      const dx = a.x - b.x;
+      const dy = a.y - b.y;
+      return Math.sqrt(dx * dx + dy * dy) < a.radius + b.radius;
+    },
+    /**
+     * Returns `true` if a circle and a rect overlap. A circle that just touches a side of the rect does not count as colliding. The circle needs `x`, `y` and `radius` (or `pos` and `radius`); the rect needs `x`, `y`, `width` and `height` (or `pos`, `width` and `height`).
+     * @param _circle The circle.
+     * @param _rect The rect.
+     * @example
+     * ```js
+     * var circle = { x: 100, y: 100, radius: 50 };
+     * var rect = { x: 140, y: 140, width: 50, height: 50 };
+     * if (THRUNIUM.Collider.circleRect(circle, rect)) {
+     * 	console.log('Collision!');
+     * }
+     * ```
+     * @example
+     * ```js
+     * var circle = { pos: new THRUNIUM.Vector(100, 100), radius: 50 };
+     * var rect = { pos: new THRUNIUM.Vector(140, 140), width: 50, height: 50 };
+     * if (THRUNIUM.Collider.circleRect(circle, rect)) {
+     * 	console.log('Collision!');
+     * }
+     * ```
+     */
+    circleRect(_circle, _rect) {
+      const circle = Collider.fixPos(_circle);
+      const rect = Collider.fixPos(_rect);
+      if (!Collider.isCircle(circle) || !Collider.isRect(rect)) {
+        throwError("One of the objects is not defined correctly as a circle or rect");
+        return false;
+      }
+      const distX = Math.abs(circle.x - rect.x);
+      const distY = Math.abs(circle.y - rect.y);
+      const halfW = rect.width / 2;
+      const halfH = rect.height / 2;
+      const r = circle.radius;
+      if (distX >= halfW + r) return false;
+      if (distY >= halfH + r) return false;
+      if (distX < halfW) return true;
+      if (distY < halfH) return true;
+      const dx = distX - halfW;
+      const dy = distY - halfH;
+      return dx * dx + dy * dy <= r * r;
+    }
+  };
+
+  // src/sprite.ts
+  var game = () => T.gameObject;
+  var _a2;
+  _a2 = Symbol.toStringTag;
+  var Sprite = class {
+    /**
+     * Creates a sprite from an image. The image must have finished loading, because its size is read here; until you call `setSpriteMap()` the whole image is one frame. Must be called with `new`, and a `THRUNIUM.Game` must exist before the sprite draws.
+     * @param image A loaded image to use as the sprite or sprite map.
+     * @example
+     * ```js
+     * var game = new THRUNIUM.Game(400, 400);
+     * var image = new Image();
+     * image.onload = function() {
+     * 	var sprite = new THRUNIUM.Sprite(image);
+     * 	sprite.draw(0, 200, 200);
+     * };
+     * image.src = 'images/hero.png';
+     * ```
+     */
+    constructor(image) {
+      this[_a2] = "THRUNIUM.Sprite";
+      /**
+       * Rotation in degrees, clockwise, around the centre of the drawn frame. Default is `0`. Set it with `setAngle()`.
+       *
+       * @example
+       * ```js
+       * var game = new THRUNIUM.Game(400, 400);
+       * game.assets = [{ src: 'images/hero.png', index: 'hero', spriteMap: { width: 32, height: 32 } }];
+       * game.startState = 'game';
+       * game.states['game'] = function() {
+       * 	game.assets['hero'].angle; // 0
+       * };
+       * game.init();
+       * game.start();
+       * ```
+       */
+      this.angle = 0;
+      /**
+       * The frame `drawAnim()` is showing, or `null` when no animation is running. `drawAnim()` updates it; set it to `null` to restart an animation from its first frame.
+       *
+       * @example
+       * ```js
+       * var game = new THRUNIUM.Game(400, 400);
+       * game.assets = [{ src: 'images/hero.png', index: 'hero', spriteMap: { width: 32, height: 32 } }];
+       * game.startState = 'game';
+       * game.states['game'] = function() {
+       * 	var hero = game.assets['hero'];
+       * 	hero.setLoop(true);
+       * 	hero.drawAnim(0, 3, 200, 200);
+       * 	hero.currentSprite; // 0, 1, 2 or 3
+       * };
+       * game.init();
+       * game.start();
+       * ```
+       */
+      this.currentSprite = null;
+      /**
+       * How long one run of an animation takes, in milliseconds, split evenly over its frames. Default is `100`. Set it with `setAnimTime()`.
+       *
+       * @example
+       * ```js
+       * var game = new THRUNIUM.Game(400, 400);
+       * game.assets = [{ src: 'images/hero.png', index: 'hero', spriteMap: { width: 32, height: 32 } }];
+       * game.startState = 'game';
+       * game.states['game'] = function() {
+       * 	game.assets['hero'].animTimeDur; // 100
+       * };
+       * game.init();
+       * game.start();
+       * ```
+       */
+      this.animTimeDur = 100;
+      /**
+       * Unix timestamp in milliseconds of when `drawAnim()` last moved to another frame. Starts at `0`.
+       *
+       * @example
+       * ```js
+       * var game = new THRUNIUM.Game(400, 400);
+       * game.assets = [{ src: 'images/hero.png', index: 'hero', spriteMap: { width: 32, height: 32 } }];
+       * game.startState = 'game';
+       * game.states['game'] = function() {
+       * 	var hero = game.assets['hero'];
+       * 	hero.drawAnim(0, 3, 200, 200);
+       * 	hero.frameTimeLast; // e.g. 1767225600000
+       * };
+       * game.init();
+       * game.start();
+       * ```
+       */
+      this.frameTimeLast = 0;
+      /**
+       * Whether `drawAnim()` starts over after the last frame. Default is `false`. Set it with `setLoop()`.
+       *
+       * @example
+       * ```js
+       * var game = new THRUNIUM.Game(400, 400);
+       * game.assets = [{ src: 'images/hero.png', index: 'hero', spriteMap: { width: 32, height: 32 } }];
+       * game.startState = 'game';
+       * game.states['game'] = function() {
+       * 	game.assets['hero'].animLoop; // false
+       * };
+       * game.init();
+       * game.start();
+       * ```
+       */
+      this.animLoop = false;
+      /**
+       * Function called when a non-looping animation finishes. Default does nothing. Set it with `setAnimCallback()`.
+       *
+       * @example
+       * ```js
+       * var game = new THRUNIUM.Game(400, 400);
+       * game.assets = [{ src: 'images/hero.png', index: 'hero', spriteMap: { width: 32, height: 32 } }];
+       * game.startState = 'game';
+       * game.states['game'] = function() {
+       * 	game.assets['hero'].animCallback(); // does nothing until you set one
+       * };
+       * game.init();
+       * game.start();
+       * ```
+       */
+      this.animCallback = () => {
+      };
+      this.image = image;
+      this.fullWidth = image.width;
+      this.fullHeight = image.height;
+      this.spriteWidth = image.width;
+      this.spriteHeight = image.height;
+    }
+    /**
+     * Sets the rotation, in degrees clockwise, that the sprite is drawn with from now on.
+     * @param angle The rotation in degrees.
+     * @example
+     * ```js
+     * var game = new THRUNIUM.Game(400, 400);
+     * game.assets = [{ src: 'images/hero.png', index: 'hero', spriteMap: { width: 32, height: 32 } }];
+     * game.startState = 'game';
+     * game.states['game'] = function() {
+     * 	var hero = game.assets['hero'];
+     * 	hero.setAngle(hero.angle + 90 * game.delta); // a quarter turn per second
+     * 	hero.draw(0, 200, 200);
+     * };
+     * game.init();
+     * game.start();
+     * ```
+     */
+    setAngle(angle) {
+      this.angle = angle;
+    }
+    /**
+     * Sets whether `drawAnim()` starts over after the last frame. Without a loop, the animation calls the `setAnimCallback()` function after its last frame, and the next `drawAnim()` call starts it again. Since 1.1.0 `drawAnim()` honours this setting; 1.0.0 ignored it.
+     * @param loop `true` to loop the animation.
+     * @example
+     * ```js
+     * var game = new THRUNIUM.Game(400, 400);
+     * game.assets = [{ src: 'images/hero.png', index: 'hero', spriteMap: { width: 32, height: 32 } }];
+     * game.startState = 'game';
+     * game.states['game'] = function() {
+     * 	var hero = game.assets['hero'];
+     * 	hero.setLoop(true);
+     * 	hero.drawAnim(0, 3, 200, 200);
+     * };
+     * game.init();
+     * game.start();
+     * ```
+     */
+    setLoop(loop) {
+      this.animLoop = loop;
+    }
+    /**
+     * Sets the function called each time a non-looping animation finishes.
+     * @param fun The function to call; it gets no arguments.
+     * @example
+     * ```js
+     * var game = new THRUNIUM.Game(400, 400);
+     * game.assets = [{ src: 'images/explosion.png', index: 'boom', spriteMap: { width: 64, height: 64 } }];
+     * game.startState = 'game';
+     * game.states['game'] = function() {
+     * 	var boom = game.assets['boom'];
+     * 	boom.setAnimCallback(function() {
+     * 		game.state = 'gameover';
+     * 	});
+     * 	boom.drawAnim(0, 7, 200, 200);
+     * };
+     * game.states['gameover'] = function() {
+     * 	game.drawText('Game over', 200, 200);
+     * };
+     * game.init();
+     * game.start();
+     * ```
+     */
+    setAnimCallback(fun) {
+      this.animCallback = fun;
+    }
+    // Bug #6: 1.0.0 assigned to `this.setAnimTime`, overwriting the method itself.
+    /**
+     * Sets how long one run of an animation takes, in milliseconds. The time is split evenly over the frames `drawAnim()` plays. Since 1.1.0 this works; in 1.0.0 it overwrote itself and had no effect.
+     * @param time Duration of the whole animation in milliseconds.
+     * @example
+     * ```js
+     * var game = new THRUNIUM.Game(400, 400);
+     * game.assets = [{ src: 'images/hero.png', index: 'hero', spriteMap: { width: 32, height: 32 } }];
+     * game.startState = 'game';
+     * game.states['game'] = function() {
+     * 	var hero = game.assets['hero'];
+     * 	hero.setAnimTime(400); // 4 frames, 100 ms each
+     * 	hero.setLoop(true);
+     * 	hero.drawAnim(0, 3, 200, 200);
+     * };
+     * game.init();
+     * game.start();
+     * ```
+     */
+    setAnimTime(time) {
+      this.animTimeDur = time;
+    }
+    /**
+     * Turns the image into a sprite map of frames of `width` x `height` pixels. Frames are numbered from 0, left to right, then row by row. A sprite-map asset has this set already.
+     * @param width Width of one frame in pixels.
+     * @param height Height of one frame in pixels.
+     * @example
+     * ```js
+     * var game = new THRUNIUM.Game(400, 400);
+     * var image = new Image();
+     * image.onload = function() {
+     * 	var tiles = new THRUNIUM.Sprite(image);
+     * 	tiles.setSpriteMap(40, 40);
+     * 	tiles.draw(2, 200, 200); // the third 40 x 40 frame
+     * };
+     * image.src = 'images/tiles.png';
+     * ```
+     */
+    setSpriteMap(width, height) {
+      this.spriteWidth = width;
+      this.spriteHeight = height;
+    }
+    /**
+     * Draws one frame centred on (`x`, `y`), rotated by `angle`. The frame is drawn at its own size unless you pass `width` and `height`.
+     * @param imgNum Number of the frame to draw, counting from 0 left to right, then row by row. Default is `0`.
+     * @param x X coordinate of the centre of the drawn frame.
+     * @param y Y coordinate of the centre of the drawn frame.
+     * @param width Width to draw the frame at. Default is the frame width.
+     * @param height Height to draw the frame at. Default is the frame height.
+     * @example
+     * ```js
+     * var game = new THRUNIUM.Game(400, 400);
+     * game.assets = [{ src: 'images/tiles.png', index: 'tiles', spriteMap: { width: 40, height: 40 } }];
+     * game.startState = 'game';
+     * game.states['game'] = function() {
+     * 	game.assets['tiles'].draw(0, 50, 50); // frame 0 at its own size
+     * 	game.assets['tiles'].draw(1, 150, 50, 80, 80); // frame 1 at double size
+     * };
+     * game.init();
+     * game.start();
+     * ```
+     */
+    draw(imgNum = 0, x, y, width, height) {
+      const xImg = imgNum * this.spriteWidth % this.fullWidth;
+      const yImg = Math.floor(imgNum * this.spriteWidth / this.fullWidth) * this.spriteHeight;
+      const w = width === void 0 ? this.spriteWidth : width;
+      const h = height === void 0 ? this.spriteHeight : height;
+      const ctx = game().ctx;
+      ctx.beginPath();
+      ctx.save();
+      ctx.translate(x, y);
+      ctx.rotate(this.angle * Math.PI / 180);
+      ctx.drawImage(this.image, xImg, yImg, this.spriteWidth, this.spriteHeight, -w / 2, -h / 2, w, h);
+      ctx.restore();
+      ctx.closePath();
+    }
+    /**
+     * Plays an animation over the frames `imgFrom` to `imgTo`: call it every frame of your game state and it draws the current frame, moving to the next one when its share of `animTimeDur` has passed. After `imgTo` it starts over when `setLoop(true)` is set; otherwise it calls the `setAnimCallback()` function, and the next call starts again from `imgFrom`. Drawing works as in `draw()`.
+     * @param imgFrom Number of the first frame of the animation.
+     * @param imgTo Number of the last frame of the animation.
+     * @param x X coordinate of the centre of the drawn frame.
+     * @param y Y coordinate of the centre of the drawn frame.
+     * @param width Width to draw the frame at. Default is the frame width.
+     * @param height Height to draw the frame at. Default is the frame height.
+     * @example
+     * ```js
+     * var game = new THRUNIUM.Game(400, 400);
+     * game.assets = [{ src: 'images/hero.png', index: 'hero', spriteMap: { width: 32, height: 32 } }];
+     * game.startState = 'game';
+     * game.states['game'] = function() {
+     * 	// frames 0 to 3, drawn at double size
+     * 	game.assets['hero'].drawAnim(0, 3, 200, 200, 64, 64);
+     * };
+     * game.init();
+     * game.start();
+     * ```
+     */
+    drawAnim(imgFrom, imgTo, x, y, width, height) {
+      var _a3;
+      if (this.currentSprite == null) this.currentSprite = imgFrom;
+      const length = this.animTimeDur / (imgTo - imgFrom + 1);
+      const now = Date.now();
+      if (now - this.frameTimeLast > length) {
+        if (this.currentSprite < imgTo) this.currentSprite++;
+        else if (this.animLoop) this.currentSprite = imgFrom;
+        else {
+          this.currentSprite = null;
+          this.animCallback();
+        }
+        this.frameTimeLast = now;
+      }
+      this.draw((_a3 = this.currentSprite) != null ? _a3 : void 0, x, y, width, height);
+    }
+  };
+
+  // src/elem.ts
+  var game2 = () => T.gameObject;
+  var ElemElem = class {
+    /**
+     * Creates an HTML element with the tag `tag` and places it on the game at (`x`, `y`). It starts with a white background, black text, the game's `font` and rounded corners, and is added to `THRUNIUM.Elem.elemsList`. Create the `THRUNIUM.Game` first, because the element is added to the game's container. Must be called with `new`.
+     * @param tag Tag name of the element to create, such as `'div'` or `'button'`.
+     * @param x X coordinate of the element's top-left corner, in game coordinates.
+     * @param y Y coordinate of the element's top-left corner, in game coordinates.
+     * @example
+     * ```js
+     * var game = new THRUNIUM.Game(400, 400);
+     * var label = new THRUNIUM.Elem.Elem('div', 20, 20);
+     * label.elem.textContent = 'Score: 0';
+     * ```
+     */
+    constructor(tag, x, y) {
+      /**
+       * The element's styles, as CSS property names in camelCase (`backgroundColor`) mapped to values. Change them with `setStyle()`, which also applies them; changing this object directly does not update the element.
+       *
+       * @example
+       * ```js
+       * var game = new THRUNIUM.Game(400, 400);
+       * var button = THRUNIUM.Elem.Button('Play', 100, 100);
+       * button.style.backgroundColor; // '#fff'
+       * ```
+       */
+      this.style = {};
+      /**
+       * The styles applied while the mouse is over the element, in the same form as `style`. It follows `style`, except for properties set with `setHoverStyle()`. Change it with `setHoverStyle()`.
+       *
+       * @example
+       * ```js
+       * var game = new THRUNIUM.Game(400, 400);
+       * var button = THRUNIUM.Elem.Button('Play', 100, 100);
+       * button.setHoverStyle('backgroundColor', '#ddd');
+       * button.hoverStyle.backgroundColor; // '#ddd'
+       * ```
+       */
+      this.hoverStyle = {};
+      /** Hover properties set explicitly via setHoverStyle; setStyle must not overwrite these. */
+      this.hoverOverrides = {};
+      this._tag = "THRUNIUM.Elem." + tag;
+      this.x = x;
+      this.y = y;
+      this.elem = document.createElement(tag);
+      this.elem.addEventListener("mouseenter", () => this.updateStyle(this.hoverStyle), false);
+      this.elem.addEventListener("mouseleave", () => this.updateStyle(this.style), false);
+      this.setStyle("display", "block");
+      this.setStyle("position", "absolute");
+      this.setStyle("color", "#000");
+      this.setStyle("backgroundColor", "#fff");
+      this.setStyle("fontFamily", game2().font);
+      this.setStyle("borderRadius", "5px");
+      this.resize();
+      elemApi.elemsList.push(this);
+      T.container.appendChild(this.elem);
+    }
+    get [Symbol.toStringTag]() {
+      return this._tag;
+    }
+    /**
+     * Moves the element so its top-left corner is at (`x`, `y`) in game coordinates.
+     * @param x The new x coordinate.
+     * @param y The new y coordinate.
+     * @example
+     * ```js
+     * var game = new THRUNIUM.Game(400, 400);
+     * var button = THRUNIUM.Elem.Button('Play', 100, 100);
+     * button.setPos(150, 200);
+     * ```
+     */
+    setPos(x, y) {
+      this.x = x;
+      this.y = y;
+      this.resize();
+    }
+    /**
+     * Re-applies the element's position and scale for the game's current `fitScale`. The game calls it for every element in `THRUNIUM.Elem.elemsList` when the window is resized, so you rarely need it. Since 1.1.0 it no longer leaks a global variable or throws in strict mode.
+     *
+     * @example
+     * ```js
+     * var game = new THRUNIUM.Game(400, 400);
+     * var button = THRUNIUM.Elem.Button('Play', 100, 100);
+     * button.resize();
+     * ```
+     */
+    resize() {
+      const fit = game2().fitScale;
+      this.setStyle("left", this.x * fit + "px");
+      this.setStyle("top", this.y * fit + "px");
+      this.setStyle("transformOrigin", "top left");
+      this.setStyle("transform", "scale(" + fit + ")");
+    }
+    /**
+     * Listens for a DOM event on the element, like the element's own `addEventListener`.
+     * @param type Name of the event, such as `'click'`.
+     * @param fun The function to call when the event happens; it gets the event.
+     * @param async Passed on as the third argument of the DOM `addEventListener` (`useCapture`). Despite its name it has nothing to do with asynchronous code; leave it out.
+     * @example
+     * ```js
+     * var game = new THRUNIUM.Game(400, 400);
+     * var button = THRUNIUM.Elem.Button('Press me!', 100, 100);
+     * button.addEventListener('click', function(e) {
+     * 	// button was clicked
+     * });
+     * ```
+     */
+    addEventListener(type, fun, async) {
+      this.elem.addEventListener(type, fun, async);
+    }
+    /**
+     * Applies a set of styles to the element without storing them in `style` or `hoverStyle`. The element uses it internally to switch between `style` and `hoverStyle`; to change a style for good, use `setStyle()`.
+     * @param styleList CSS property names in camelCase mapped to values.
+     * @example
+     * ```js
+     * var game = new THRUNIUM.Game(400, 400);
+     * var button = THRUNIUM.Elem.Button('Play', 100, 100);
+     * button.updateStyle({ color: '#f00', fontSize: '20px' });
+     * ```
+     */
+    updateStyle(styleList) {
+      for (const name in styleList) {
+        this.elem.style[name] = styleList[name];
+      }
+    }
+    /**
+     * Sets one style of the element and applies it. Unless you have set a hover style for the same property with `setHoverStyle()`, the element keeps it while hovered too.
+     * @param name CSS property name in camelCase, such as `'backgroundColor'`.
+     * @param value The CSS value, such as `'#000'`.
+     * @example
+     * ```js
+     * var game = new THRUNIUM.Game(400, 400);
+     * var button = THRUNIUM.Elem.Button('Play', 100, 100);
+     * button.setStyle('backgroundColor', '#000');
+     * button.setStyle('color', '#fff');
+     * ```
+     */
+    setStyle(name, value) {
+      this.style[name] = value;
+      if (!this.hoverOverrides[name]) this.hoverStyle[name] = value;
+      this.updateStyle(this.style);
+    }
+    /**
+     * Sets a style that applies only while the mouse is over the element; the normal style comes back when the mouse leaves. Since 1.1.0 hover styles work as described; 1.0.0 applied them the wrong way round.
+     * @param name CSS property name in camelCase, such as `'backgroundColor'`.
+     * @param value The CSS value to use while hovered.
+     * @example
+     * ```js
+     * var game = new THRUNIUM.Game(400, 400);
+     * var button = THRUNIUM.Elem.Button('Play', 100, 100);
+     * button.setHoverStyle('backgroundColor', '#ddd');
+     * ```
+     */
+    setHoverStyle(name, value) {
+      this.hoverStyle[name] = value;
+      this.hoverOverrides[name] = true;
+    }
+    /**
+     * Shows the element again after `hide()`.
+     *
+     * @example
+     * ```js
+     * var game = new THRUNIUM.Game(400, 400);
+     * var button = THRUNIUM.Elem.Button('Play', 100, 100);
+     * button.hide();
+     * button.show();
+     * ```
+     */
+    show() {
+      this.setStyle("display", "block");
+    }
+    /**
+     * Hides the element. It stays in place, so `show()` brings it back.
+     *
+     * @example
+     * ```js
+     * var game = new THRUNIUM.Game(400, 400);
+     * var button = THRUNIUM.Elem.Button('Play', 100, 100);
+     * button.addEventListener('click', function() {
+     * 	button.hide();
+     * });
+     * ```
+     */
+    hide() {
+      this.setStyle("display", "none");
+    }
+  };
+  function Button(txt, x, y) {
+    const button = new ElemElem("button", x, y);
+    button.elem.textContent = txt;
+    button.elem.style.border = "none";
+    return button;
+  }
+  function Input(x, y, options) {
+    const g = game2();
+    const input = document.createElement("input");
+    input.style.position = "absolute";
+    input.style.left = x * g.scale * g.fitScale + "px";
+    input.style.top = y * g.scale * g.fitScale + "px";
+    input.style.border = "2px solid #000";
+    input.style.borderRadius = "5px";
+    input.style.color = "#000";
+    input.style.backgroundColor = "#fff";
+    input.style.fontFamily = g.font;
+    input.style.fontSize = g.textSize;
+    input.type = options.type ? options.type : "text";
+    if (options.placeholder) input.placeholder = options.placeholder;
+    T.container.appendChild(input);
+    return input;
+  }
+  var elemApi = {
+    /**
+     * Every `Elem.Elem` created so far, including buttons, in creation order. The game uses it to reposition them when the window is resized. Inputs from `Input()` are not in it.
+     *
+     * @example
+     * ```js
+     * var game = new THRUNIUM.Game(400, 400);
+     * THRUNIUM.Elem.Button('Play', 100, 100);
+     * THRUNIUM.Elem.elemsList.length; // 1
+     * ```
+     */
+    elemsList: [],
+    Elem: ElemElem,
+    Button,
+    Input
+  };
+
+  // src/ajax.ts
+  function ajax(data) {
+    var _a3, _b, _c, _d;
+    const success = (_a3 = data.success) != null ? _a3 : ((e) => console.log(e));
+    const error = (_b = data.error) != null ? _b : (() => {
+    });
+    const contentType = (_c = data.contentType) != null ? _c : "application/x-www-form-urlencoded";
+    const xhttp = new XMLHttpRequest();
+    xhttp.withCredentials = (_d = data.withCredentials) != null ? _d : false;
+    xhttp.onreadystatechange = function() {
+      if (xhttp.readyState !== 4) return;
+      if (xhttp.status === 200) success(xhttp);
+      else error(xhttp);
+    };
+    xhttp.open(data.type, data.url, true);
+    if (contentType !== false) xhttp.setRequestHeader("Content-Type", contentType);
+    xhttp.send(data.data);
+    return xhttp;
+  }
+
+  // src/storage.ts
+  function escapeValue(value) {
+    return value.replace(/[%;\x00-\x1f\x7f]/g, encodeURIComponent).replace(/^ +| +$/g, (spaces) => spaces.replace(/ /g, "%20"));
+  }
+  function set(name, value) {
+    const date = /* @__PURE__ */ new Date();
+    date.setTime(date.getTime() + 365 * 24 * 60 * 60 * 1e3);
+    const expires = "expires=" + date.toUTCString();
+    document.cookie = name + "=" + escapeValue(String(value)) + ";" + expires + ";path=" + document.location.pathname;
+    return true;
+  }
+  function get(name) {
+    const prefix = name + "=";
+    for (let c of document.cookie.split(";")) {
+      c = c.replace(/^ +/, "");
+      if (c.indexOf(prefix) === 0) {
+        const raw = c.substring(prefix.length);
+        try {
+          return decodeURIComponent(raw);
+        } catch (e) {
+          return raw;
+        }
+      }
+    }
+    return null;
+  }
+  var storage = { set, get };
+
+  // src/storage-token.ts
+  var storage_token_exports = {};
+  __export(storage_token_exports, {
+    _options: () => _options,
+    _receiveMessage: () => _receiveMessage,
+    accessRequested: () => accessRequested,
+    loginPopup: () => loginPopup,
+    reqToken: () => reqToken,
+    reqUserToken: () => reqUserToken,
+    request: () => request,
+    setReqToken: () => setReqToken,
+    timeout: () => timeout,
+    userToken: () => userToken
+  });
+  var reqToken = null;
+  var userToken = null;
+  var timeout = null;
+  var loginPopup = null;
+  var accessRequested = false;
+  var _options = {
+    succes: (e) => console.log(e),
+    error: (e) => console.log(e)
+  };
+  function setReqToken(token) {
+    T.Storage.reqToken = token;
+  }
+  function reqUserToken(options) {
+    T.Storage._options.succes = options.succes;
+    T.Storage._options.error = options.error;
+    ajax({
+      url: "https://api.thrungames.com/request/user-token",
+      type: "post",
+      data: "requestToken=" + T.Storage.reqToken,
+      // 1.0.0 typo `succes` kept: ajax ignores it (part of why the flow is WIP).
+      succes: function(e) {
+        var _a3, _b, _c, _d;
+        const response = JSON.parse(e.response);
+        if (response.access == "0" && !T.Storage.accessRequested) {
+          window.addEventListener("message", T.Storage._receiveMessage, false);
+          window.parent.postMessage({ reqToken: T.Storage.reqToken }, document.origin);
+          T.Storage.timeout = setTimeout(function() {
+            const leftPosition = screen.width ? (screen.width - 400) / 2 : 0;
+            const topPosition = screen.height ? (screen.height - 500) / 2 : 0;
+            const settings = "height=500,width=400,top=" + topPosition + ",left=" + leftPosition + ",scrollbars=yes,resizable";
+            const url = "https://api.thrungames.com/user/access?token=" + T.Storage.reqToken;
+            T.Storage.loginPopup = window.open(url, "Approval of game", settings);
+          }, 200);
+        } else if (response.access == "1") {
+          T.Storage.userToken = window.event.data.userToken;
+          (_b = (_a3 = T.Storage._options).succes) == null ? void 0 : _b.call(_a3, { type: "userAccepted", event: e });
+        } else {
+          (_d = (_c = T.Storage._options).error) == null ? void 0 : _d.call(_c, { type: "ajaxFailed", event: e });
+        }
+      },
+      error: function(e) {
+        var _a3, _b;
+        (_b = (_a3 = T.Storage._options).error) == null ? void 0 : _b.call(_a3, { type: "ajaxFailed", event: e });
+      }
+    });
+  }
+  function _receiveMessage(e) {
+    var _a3, _b, _c;
+    const event = window.event;
+    if (event.origin !== "https://www.thrungames.com/" && event.origin !== "https://www.thrungames.com/") return;
+    clearTimeout((_a3 = T.Storage.timeout) != null ? _a3 : void 0);
+    T.Storage.accessRequested = true;
+    if (event.data.state == 1) {
+      T.Storage.reqUserToken(T.Storage._options);
+    } else {
+      (_c = (_b = T.Storage._options).error) == null ? void 0 : _c.call(_b, { type: "userRejected", event: e });
+    }
+  }
+  function request(_options2) {
+  }
+
+  // src/index.ts
+  T.version = "1.2.0-rc.2";
+  T.pageLoad = pageLoad;
+  T.ready = ready;
+  T.throwError = throwError;
+  T.mobileAndTabletcheck = mobileAndTabletcheck;
+  T.iOScheck = iOScheck;
+  T.getRandom = getRandom;
+  initEnv();
+  T.Game = Game;
+  T.Vector = Vector;
+  T.Collider = Object.assign(T.Collider || {}, Collider);
+  T.Sprite = Sprite;
+  T.Elem = Object.assign(T.Elem || {}, elemApi);
+  T.ajax = ajax;
+  T.Storage = Object.assign(T.Storage || {}, storage, storage_token_exports);
+  window.requestAnimFrame = typeof window.requestAnimationFrame === "function" ? window.requestAnimationFrame.bind(window) : (cb) => window.setTimeout(() => cb(Date.now()), 1e3 / 60);
+})();