diff --git a/docs/_config.yml b/docs/_config.yml
index e69de29..40a0a0c 100644
--- a/docs/_config.yml
+++ b/docs/_config.yml
@@ -0,0 +1,3 @@
+sass:
+ sass_dir: _sass
+ style: compressed
\ No newline at end of file
diff --git a/docs/_sass/ui/fade-animation.scss b/docs/_sass/ui/fade-animation.scss
new file mode 100644
index 0000000..38bf53e
--- /dev/null
+++ b/docs/_sass/ui/fade-animation.scss
@@ -0,0 +1,45 @@
+@keyframes fadein {
+ from { opacity: 0; }
+ to { opacity: 1; }
+}
+
+/* Firefox < 16 */
+@-moz-keyframes fadein {
+ from { opacity: 0; }
+ to { opacity: 1; }
+}
+
+/* Safari, Chrome and Opera > 12.1 */
+@-webkit-keyframes fadein {
+ from { opacity: 0; }
+ to { opacity: 1; }
+}
+
+/* Internet Explorer */
+@-ms-keyframes fadein {
+ from { opacity: 0; }
+ to { opacity: 1; }
+}
+
+@keyframes fadeout {
+ from { opacity: 1; }
+ to { opacity: 0; }
+}
+
+/* Firefox < 16 */
+@-moz-keyframes fadeout {
+ from { opacity: 1; }
+ to { opacity: 0; }
+}
+
+/* Safari, Chrome and Opera > 12.1 */
+@-webkit-keyframes fadeout {
+ from { opacity: 1; }
+ to { opacity: 0; }
+}
+
+/* Internet Explorer */
+@-ms-keyframes fadeout {
+ from { opacity: 1; }
+ to { opacity: 0; }
+}
diff --git a/docs/_sass/ui/page-loader.scss b/docs/_sass/ui/page-loader.scss
new file mode 100644
index 0000000..5a5fa5f
--- /dev/null
+++ b/docs/_sass/ui/page-loader.scss
@@ -0,0 +1,39 @@
+@keyframes spinner-border {
+ to {
+ transform: rotate(360deg);
+ }
+}
+
+.preloader {
+ position: absolute;
+ height: 99.9vh;
+ width: 99.9vw;
+ overflow: hidden;
+ background-color: #242424;
+ color: white;
+}
+
+.disappear {
+ animation-name: fadeout;
+ animation-duration: 1s;
+}
+
+.appear {
+ animation-name: fadein;
+ animation-duration: 1s;
+}
+
+.preloader .spinner-border {
+ width: 80px;
+ height: 80px;
+ margin: auto;
+ position: absolute;
+ left: calc(50% - 40px);
+ top: calc(50% - 40px);
+ display: inline-block;
+ vertical-align: text-bottom;
+ border: 8px solid #ff4136;
+ border-right-color: transparent;
+ border-radius: 50%;
+ animation: spinner-border .75s linear infinite;
+}
diff --git a/docs/assets/css/main.scss b/docs/assets/css/main.scss
new file mode 100644
index 0000000..2366274
--- /dev/null
+++ b/docs/assets/css/main.scss
@@ -0,0 +1,24 @@
+---
+---
+
+@import "ui/fade-animation.scss";
+@import "ui/page-loader.scss";
+
+html {
+ box-sizing: border-box;
+}
+
+body{
+ padding: 0;
+ margin:0;
+}
+
+*,
+*:before,
+*:after {
+ box-sizing: inherit;
+}
+
+.hidden {
+ display: none !important;
+}
diff --git a/docs/assets/js/constants.js b/docs/assets/js/constants.js
new file mode 100644
index 0000000..5ed3701
--- /dev/null
+++ b/docs/assets/js/constants.js
@@ -0,0 +1,5 @@
+var constants = {
+ testOrganizer: {
+ EXAMPLE_DELETE_ME_LATER : 1277336
+ }
+};
\ No newline at end of file
diff --git a/docs/scripts/game.js b/docs/assets/js/game.js
similarity index 100%
rename from docs/scripts/game.js
rename to docs/assets/js/game.js
diff --git a/docs/assets/js/index.js b/docs/assets/js/index.js
new file mode 100644
index 0000000..b85d54e
--- /dev/null
+++ b/docs/assets/js/index.js
@@ -0,0 +1,68 @@
+// Handle starting the pre-load animation
+var page_preloader = new Preloader();
+page_preloader.show(true);
+
+images = [
+ ""
+];
+
+audio = [
+ ""
+];
+
+var globalStates = {
+ titleScreen:0,
+ starting:1,
+ playing:2,
+ paused:3,
+ end:4
+};
+var globalState = globalStates.titleScreen;
+
+function update() {
+ switch(globalState) {
+ // title screen
+ case globalStates.titleScreen:
+
+ break;
+ // starting
+ case globalStates.starting:
+
+ break;
+ // playing
+ case globalStates.playing:
+
+ break;
+ // paused
+ case globalStates.paused:
+
+ break;
+ // end
+ case globalStates.end:
+
+ break;
+ }
+}
+
+function input() {
+
+}
+
+function draw() {
+
+}
+
+function absoluteDraw() {
+
+}
+
+function onAssetsLoaded() {
+
+
+}
+
+setup(60);
+
+// Hide the preloader
+// This should actually run after all assets have been downloaded
+page_preloader.hide(false);
\ No newline at end of file
diff --git a/docs/assets/js/preloader/preloader.js b/docs/assets/js/preloader/preloader.js
new file mode 100644
index 0000000..c1c9557
--- /dev/null
+++ b/docs/assets/js/preloader/preloader.js
@@ -0,0 +1,65 @@
+let preloaderCount = 0;
+
+/**
+ * A fullscreen loading animation utility
+ */
+class Preloader {
+
+ constructor() {
+
+ // Add a preloader element to the page
+ document.body.innerHTML += ``;
+ preloaderCount += 1;
+
+ // Get the element context for controlling
+ this.element = document.getElementById(`preloader${preloaderCount - 1}`);
+
+ console.log(`[Preloader] Created preloader ${preloaderCount - 1}`);
+
+ }
+
+ /**
+ * Show the preloader
+ *
+ * @param {Boolean} now Show without a fade-in
+ */
+ show(now) {
+
+ // Wipe the modifier classes
+ this.element.classList.remove("hidden");
+ this.element.classList.remove("appear");
+ this.element.classList.remove("disappear");
+
+ // If we don't need the loader right now, give it a fadein property
+ if (!now) {
+ this.element.classList.add("appear");
+ }
+
+ console.log("[Preloader] Showing preloader");
+ }
+
+ /**
+ * Hide the preloader
+ *
+ * @param {Boolean} now Hide without a fade-out
+ */
+ hide(now) {
+
+ // Wipe the modifier classes
+ this.element.classList.remove("appear");
+
+ // Make the animation fade out
+ this.element.classList.add("disappear");
+
+ // If we are hiding now, just hide, otherwise time the hide
+ if (now) {
+ this.element.classList.add("hidden");
+ } else {
+ setTimeout(() => {
+ this.element.classList.add("hidden");
+ }, 1000);
+ }
+
+ console.log("[Preloader] Hiding preloader");
+ }
+}
\ No newline at end of file
diff --git a/docs/assets/js/utils.js b/docs/assets/js/utils.js
new file mode 100644
index 0000000..c134261
--- /dev/null
+++ b/docs/assets/js/utils.js
@@ -0,0 +1,41 @@
+// clamps a value between min and max
+function clamp(value, min, max) {
+ return Math.min(max, Math.max(min, value));
+}
+
+// linear interpolation towards somewhere
+function lerp(start, end, amt) { return (1 - amt) * start + amt * end; }
+
+// returns a new value with friction applied
+function friction(value, amount) {
+ if (value > 0) { value -= amount; }
+ if (value < 0) { value += amount; }
+ if (Math.abs(value) < amount * 2) { value = 0; }
+ return value;
+}
+
+var tau = Math.PI * 2;
+var pi = Math.PI;
+// returns a new angle that gets closer to the target angle
+function turn(cur, target, speed) {
+ if (target < 0) { target = tau + target; }
+ if ((cur % tau) > target) {
+ if ((cur % tau) - target > pi) {
+ cur += speed;
+ } else {
+ cur -= speed;
+ }
+ } else {
+ if (target - (cur % tau) > pi) {
+ cur -= speed;
+ } else {
+ cur += speed;
+ }
+ }
+ if (Math.abs(cur - target) < speed * 1.1) {
+ cur = target;
+ }
+ if (cur > tau) { cur = cur - tau; }
+ if (cur < 0) { cur = tau + cur; }
+ return cur;
+}
\ No newline at end of file
diff --git a/docs/index.html b/docs/index.html
index cd14837..ebac9fb 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -16,10 +16,14 @@
border-radius: 10px;
}
+
-
-
+
+
+
+
+