diff --git a/CREDITS.md b/CREDITS.md
new file mode 100644
index 0000000..f394a63
--- /dev/null
+++ b/CREDITS.md
@@ -0,0 +1,25 @@
+# Graphics
+
+- Title screen background: [Star Nest by Pablo Roman Andrioli](https://www.shadertoy.com/view/XlfGRj) (MIT)
+
+# Music
+
+- Title screen music: [Je suis un Phoenix by BlueMillenium](http://ccmixter.org/files/Bluemillenium/61325) (CC BY-NC 3.0)
+
+# Sound effects
+
+- Door open/close sounds:
+ - [Hatch Seal.wav by Paul368 (freesound)](https://freesound.org/people/Paul368/sounds/264063/) (CC0 1.0)
+ - [SFX Door Open.wav by Paul368 (freesound)](https://freesound.org/people/Paul368/sounds/264061/) (CC0 1.0)
+- Notification/beeps:
+ - [Chord Alert Notification by graham_makes (freesound)](https://freesound.org/people/graham_makes/sounds/457518/) (CC BY 3.0)
+ - [Messenger Notification Sounds by zzwerty (freesound)](https://freesound.org/people/zzwerty/sounds/315878/) (CC BY-NC 3.0)
+ - [Radio Sign Off by dylanh.sound (freesound)](https://freesound.org/people/dylanh.sound/sounds/524205/) (CC0 1.0)
+
+# Code
+
+- [React](https://github.com/facebook/react) (MIT)
+- [PixiJS](https://github.com/pixijs/pixi.js) (MIT)
+- [howler.js](https://github.com/goldfire/howler.js) (MIT)
+- [Parcel](https://github.com/parcel-bundler/parcel) (MIT)
+- [Hotkeys](https://github.com/jaywcjlove/hotkeys) (MIT)
diff --git a/LICENSE b/LICENSE
new file mode 100644
index 0000000..48d301f
--- /dev/null
+++ b/LICENSE
@@ -0,0 +1,5 @@
+Copyright 2020 Alessandro Gatti
+
+Permission to use, copy, modify, and/or distribute this software for any purpose with or without fee is hereby granted, provided that the above copyright notice and this permission notice appear in all copies.
+
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE.
\ No newline at end of file
diff --git a/README.md b/README.md
new file mode 100644
index 0000000..872dfb8
--- /dev/null
+++ b/README.md
@@ -0,0 +1,13 @@
+# NSS Odyssey
+
+**Warning: Toy project**
+
+Co-op survival space sim, keep the NSS Odyssey alive and kicking while roaming in space.
+
+Takes heavy inspiration from Space Station 13 and FTL.
+
+## Credits
+
+See `CREDITS.md` for an exhaustive list of sources for all assets not made by me (Hamcha)
+
+See `LICENSE` for code license (TL;DR it's [ISC](https://en.wikipedia.org/wiki/ISC_license))
diff --git a/assets/images/noise/space_fine.png b/assets/images/noise/space_fine.png
new file mode 100644
index 0000000..2a69e76
Binary files /dev/null and b/assets/images/noise/space_fine.png differ
diff --git a/assets/images/noise/space_sparse.png b/assets/images/noise/space_sparse.png
new file mode 100644
index 0000000..dae9af8
Binary files /dev/null and b/assets/images/noise/space_sparse.png differ
diff --git a/package.json b/package.json
index 4875f1a..79517f0 100644
--- a/package.json
+++ b/package.json
@@ -4,11 +4,17 @@
"main": "index.js",
"license": "MIT",
"dependencies": {
+ "@inlet/react-pixi": "^5.1.4",
"@types/howler": "^2.2.1",
+ "@types/react": "^16.9.49",
+ "@types/react-dom": "^16.9.8",
+ "animejs": "^3.2.0",
"hotkeys-js": "^3.8.1",
"howler": "^2.2.0",
"parcel-bundler": "^1.12.4",
"pixi.js": "^5.3.3",
+ "react": "^16.13.1",
+ "react-dom": "^16.13.1",
"typescript": "^4.0.3"
},
"scripts": {
@@ -16,6 +22,8 @@
"clean": "rimraf ./dist"
},
"devDependencies": {
+ "glslify-bundle": "^5.1.1",
+ "glslify-deps": "^1.3.1",
"rimraf": "^3.0.2",
"sass": "^1.26.11"
}
diff --git a/src/game/MenuBackground.tsx b/src/game/MenuBackground.tsx
new file mode 100644
index 0000000..79740e1
--- /dev/null
+++ b/src/game/MenuBackground.tsx
@@ -0,0 +1,20 @@
+import * as React from "react";
+import MenuBackgroundFilter from "../graphics/filters/MenuBackground";
+import { Sprite, useApp, useTick } from "@inlet/react-pixi";
+
+export default function () {
+ const app = useApp();
+ const scale = 2;
+ const menubg = new MenuBackgroundFilter(app.renderer, scale);
+
+ useTick((delta) => {
+ menubg.update(delta);
+ menubg.render();
+ });
+
+ window.addEventListener("resize", () => {
+ menubg.rescale(scale);
+ });
+
+ return ;
+}
diff --git a/src/game/lib/hook.ts b/src/game/lib/hook.ts
new file mode 100644
index 0000000..e69de29
diff --git a/src/graphics/filters/InGameSpace.ts b/src/graphics/filters/InGameSpace.ts
new file mode 100644
index 0000000..e69de29
diff --git a/src/graphics/filters/MenuBackground.tsx b/src/graphics/filters/MenuBackground.tsx
new file mode 100644
index 0000000..5c78788
--- /dev/null
+++ b/src/graphics/filters/MenuBackground.tsx
@@ -0,0 +1,33 @@
+import * as PIXI from "pixi.js";
+import RTTShader from "../utils/RTTShader";
+
+//@ts-expect-error Frag file
+import filter_src from "./frag/MenuBackground.frag";
+
+export default class MenuBackgroundFilter extends RTTShader {
+ private elapsed: number;
+ private filter: PIXI.Filter;
+
+ constructor(renderer: PIXI.Renderer, scale: number) {
+ const filter = new PIXI.Filter(null, filter_src, {
+ iTime: 0,
+ iResolution: [renderer.width / scale, renderer.height / scale],
+ });
+ super(renderer, filter, scale);
+ this.elapsed = 0;
+ this.filter = filter;
+ }
+
+ rescale(scale: number) {
+ super.rescale(scale);
+ this.filter.uniforms.iResolution = [
+ this.renderer.width / scale,
+ this.renderer.height / scale,
+ ];
+ }
+
+ update(delta: number) {
+ this.filter.uniforms.iTime = this.elapsed;
+ this.elapsed += delta / 60;
+ }
+}
diff --git a/src/graphics/filters/frag/InGameSpace.frag b/src/graphics/filters/frag/InGameSpace.frag
new file mode 100644
index 0000000..be47c81
--- /dev/null
+++ b/src/graphics/filters/frag/InGameSpace.frag
@@ -0,0 +1,47 @@
+precision mediump float;
+
+uniform sampler2D noise_sparse;
+uniform sampler2D noise_fine;
+
+uniform vec2 iResolution;
+uniform float scroll_speed;
+uniform float warp_boost;
+uniform float warp_opacity;
+uniform float time;
+
+const float noise_sparse_scale = 0.0007;
+const float noise_fine_scale = 0.003;
+const float warp_clouds_scale = 0.0003;
+const vec2 scroll_dir = vec2(1,0);
+const vec2 blink_scroll = vec2(50.0, 0);
+const float PI = 3.1415;
+
+void main() {
+ vec2 uv=gl_FragCoord.xy/iResolution.xy;
+ float scroll = scroll_speed * time;
+ float sparse = texture2D(noise_sparse, (gl_FragCoord.xy + scroll_dir * scroll)*noise_sparse_scale).r;
+ sparse = ((sparse * sparse) - 0.2) * 1.2;
+ float fine = texture2D(noise_fine, (gl_FragCoord.xy + scroll_dir * scroll)*noise_fine_scale).r;
+ fine = fine - 0.6;
+ if (fine > 0.) {
+ fine = fine * 10.0;
+ }
+ if (fine > 0.3) {
+ float fine_blink_fade = texture2D(noise_sparse, (gl_FragCoord.xy + blink_scroll*time)*noise_sparse_scale).r;
+ fine = fine - ((fine_blink_fade * fine_blink_fade) - 0.2) * 1.2;
+ }
+ vec4 clouds = vec4(vec3(0.3, 0.5, 0.7) * sparse, 1.0);
+ vec4 stars = vec4(fine);
+
+ vec2 warp_scroll = scroll_dir * scroll;
+ vec2 warp_uv = (gl_FragCoord.xy * sin(uv.y * PI) + warp_scroll)*warp_clouds_scale;
+ vec2 warp_uv_inv = (gl_FragCoord.xy * sin((abs(uv.y-0.5)) * uv.x * PI) + warp_scroll*0.5)*warp_clouds_scale;
+ float warp_clouds_sparse = texture2D(noise_sparse, vec2(0.5,1) * warp_uv).r;
+ float warp_clouds_fine = texture2D(noise_sparse, vec2(2,1) * warp_uv_inv).r;
+
+ vec4 warp = vec4(vec3(0), 1);
+ warp += vec4(vec3(0.3,0.2,0.9)*warp_clouds_sparse, 0);
+ warp += vec4(vec3(0.5,0.0,0.5)*(warp_clouds_fine*0.5+warp_clouds_sparse)*abs(uv.y-0.5), 0);
+
+ gl_FragColor = mix(clouds + stars, warp*warp_boost, warp_opacity);
+}
\ No newline at end of file
diff --git a/src/index.ts b/src/graphics/filters/frag/MenuBackground.frag
similarity index 62%
rename from src/index.ts
rename to src/graphics/filters/frag/MenuBackground.frag
index fa6dd6a..d80e8ab 100644
--- a/src/index.ts
+++ b/src/graphics/filters/frag/MenuBackground.frag
@@ -1,26 +1,8 @@
-import { Howl } from "howler";
-import * as PIXI from "pixi.js";
-
-//@ts-expect-error It's a music file
-import title from "../assets/sounds/music/title.opus";
-
-const pixiApp = new PIXI.Application({
- width: window.innerWidth,
- height: window.innerHeight,
- resolution: window.devicePixelRatio || 1,
-});
-
-window.addEventListener("resize", function () {
- pixiApp.renderer.resize(window.innerWidth, window.innerHeight);
-});
-
-document.body.appendChild(pixiApp.view);
-
-const filter_src = `
// Star Nest by Pablo Roman Andrioli
// This content is under the MIT License.
+precision mediump float;
-uniform vec3 iResolution;
+uniform vec2 iResolution;
uniform float iTime;
#define iterations 17
@@ -56,8 +38,8 @@ void main()
dir.xz*=rot1;
dir.xy*=rot2;
vec3 from=vec3(1.,.5,0.5);
- from+=vec3(time*2.,time,-2.);
- from.xz*=rot1;
+ from+=vec3(time*2.,time,-2.);
+ from.xz*=rot1;
from.xy*=rot2;
//volumetric rendering
@@ -84,23 +66,4 @@ void main()
v=mix(vec3(length(v)),v,saturation); //color adjust
gl_FragColor = vec4(v*.01,1.);
-}
-`;
-const filter = new PIXI.Filter(null, filter_src, {
- iTime: 0,
- iResolution: [window.innerWidth, window.innerHeight],
-});
-
-pixiApp.stage.filterArea = pixiApp.renderer.screen;
-pixiApp.stage.filters = [filter];
-
-let elapsed = 0;
-pixiApp.ticker.add((delta) => {
- filter.uniforms.iTime = elapsed;
- elapsed += delta / 60;
-});
-
-var sound = new Howl({
- src: [title],
- autoplay: true,
-});
+}
\ No newline at end of file
diff --git a/src/graphics/utils/RTTShader.ts b/src/graphics/utils/RTTShader.ts
new file mode 100644
index 0000000..ede6d80
--- /dev/null
+++ b/src/graphics/utils/RTTShader.ts
@@ -0,0 +1,30 @@
+import * as PIXI from "pixi.js";
+
+export default class RTTShader {
+ readonly texture: PIXI.RenderTexture;
+ readonly container: PIXI.Container;
+ readonly renderer: PIXI.Renderer;
+
+ constructor(renderer: PIXI.Renderer, filter: PIXI.Filter, scale: number = 2) {
+ this.renderer = renderer;
+ this.texture = PIXI.RenderTexture.create({
+ width: this.renderer.width / scale,
+ height: this.renderer.height / scale,
+ });
+ this.container = new PIXI.Container();
+ this.container.filterArea = this.texture.frame;
+ this.container.filters = [filter];
+ }
+
+ rescale(scale: number) {
+ this.texture.resize(
+ this.renderer.width / scale,
+ this.renderer.height / scale
+ );
+ this.container.filterArea = this.texture.frame;
+ }
+
+ render() {
+ this.renderer.render(this.container, this.texture);
+ }
+}
diff --git a/src/index.html b/src/index.html
index 5f606e1..42dec79 100644
--- a/src/index.html
+++ b/src/index.html
@@ -4,11 +4,11 @@
NSS Odyssey
-
+
-
+