If you can read this, then that means you have OPENGL disabled, or not supported on your browser... Wait until I update the site for a flatmode so you can still browse it!
{ "textures": [ "scanlines.png", "placeholderWalls.png", "floorTexture.png", "backwall.png", "sidewalls.png" ], "materials": [ { "name": "Default", "vert": "#texture_vertex", "frag": "#texture_fragment", "info": { "type":"texture", "attribs":[ "aVertexPosition", "uvCoord" ], "uniforms":[ "uProjectionMatrix", "uModelViewMatrix" ] } }, { "name": "Stars", "vert": "#stars_vertex", "frag": "#stars_fragment", "info": { "type":"stars", "attribs":[ "aVertexPosition" ], "uniforms":[ "uProjectionMatrix", "uModelViewMatrix", "uResolution", "uTime" ] } } ], "objects": [ { "texture": 4, "material": 0, "vertices": [ -500, 500, 3, 6, 1, -500, -500, 3, 6, 0, -500, 500, 0, 0, 1, -500, -500, 0, 0, 0, 500, 500, 10, 20, 1, 500, -500, 10, 20, 0, 500, 500, 0, 0, 1, 500, -500, 0, 0, 0, -500, 500, 4, 2, 1, -500, -500, 4, 2, 0, -500, 500, 6, 0, 1, -500, -500, 6, 0, 0, -500, 500, 7, 2, 1, -500, -500, 7, 2, 0, -500, 500, 10, 0, 1, -500, -500, 10, 0, 0, -500, 500, 4, 3, 1, -500, -500, 4, 3, 0, -3000, -500, 4, 0, 0, -3000, 500, 4, 0, 1, -500, 500, 7, 3, 1, -500, -500, 7, 3, 0, -3000, -500, 7, 0, 0, -3000, 500, 7, 0, 1, -500, 500, 3, 3, 1, -500, -500, 3, 3, 0, -3000, -500, 3, 0, 0, -3000, 500, 3, 0, 1 ], "indices": [ 0, 2, 3, 0, 1, 3, 4, 5, 6, 6, 7, 5, 8, 10, 11, 8, 9, 11, 12, 14, 15, 12, 13, 15, 16, 17, 19, 19, 18, 17, 20, 21, 23, 23, 22, 21, 24, 25, 27, 27, 26, 25 ] }, { "texture":0, "material":1, "vertices": [ 499, 400, 8, 0, 1, 499, -200, 8, 0, 0, 499, 400, 4, 1, 1, 499, -200, 4, 1, 0 ], "indices": [ 0, 1, 2, 2, 3, 1 ], "starsOffset": [0.0, 0.0, 0.0, 0.0] }, { "texture": 3, "material": 0, "vertices": [ -500, -500, 10, 0, 0, -500, 500, 10, 0, 1, 500, -500, 10, 1, 0, 500, 500, 10, 1, 1 ], "indices": [ 0, 1, 2, 2, 3, 1 ] }, { "texture":2, "material":0, "vertices": [ -3000, 500, 10, -2.5, 10, 500, 500, 10, 1, 10, 500, 500, 0, 1, 0, -3000, 500, 0, -2.5, 0, -3000, -500, 10, -2.5, 10, 500, -500, 10, 1, 10, 500, -500, 0, 1, 0, -3000, -500, 0, -2.5, 0 ], "indices": [ 0, 1, 2, 2, 3, 0, 4, 5, 6, 6, 7, 4 ] } ] }
attribute vec4 aVertexPosition; attribute vec2 uvCoord; uniform mat4 uModelViewMatrix; uniform mat4 uProjectionMatrix; varying vec4 vColor; varying vec2 uv; void main(void) { gl_Position = uProjectionMatrix * uModelViewMatrix * aVertexPosition; /* uModelViewMatrix */ uv = uvCoord; }
uniform sampler2D tex; varying lowp vec2 uv; void main(void) { gl_FragColor = texture2D( tex, uv ); }
attribute vec4 aVertexPosition; uniform mat4 uModelViewMatrix; uniform mat4 uProjectionMatrix; uniform vec2 uResolution; uniform float uTime; varying float vTime; varying vec2 vResolution; void main(void) { gl_Position = uProjectionMatrix * uModelViewMatrix * aVertexPosition; vResolution = uResolution; vTime = uTime; }
precision highp float; varying vec2 vResolution; varying float vTime; //TODO: STARS BLINK OUT IF YOU ROTATE AND THEY ARE TOO SMALL //Returns true if pos is on a star, which is arranged on a grid that has starsDist between all of the stars, and then transformed using Transform(Tran) Rotation(Rot) Scale(Scale) bool isOnStar(in vec2 pos, in vec2 starsDist, in vec2 tran, in float rot, in vec2 scale) { rot = radians(mod(rot, 90.0)); scale = 1.0 / scale; mat2 rotationMatrix = mat2(cos(rot), sin(rot), -1.0 * sin(rot), cos(rot)); pos = (pos + vec2(vTime * -0.0001, vTime * 0.00002)) * scale * rotationMatrix + tran; //The modulo of the position and the star's distance, this makes the star grid. Drop the decmial vec2 starMod = vec2(floor(mod(pos.x, starsDist.x)), floor(mod(pos.y, starsDist.y))); //The threshold for a star appearing is diffent depending on the scale of the grid. (smaller scales require a larger threshold, or else if a star is too small it won't appear) vec2 threshold = ceil(vec2(1.0, 1.0) * scale); //gl_FragColor = vec4((threshold.x / starMod.x) * (threshold.y / starMod.y), 0.0, 0.0, 1.0); return bool((starMod.x < threshold.x) && (starMod.y < threshold.y)); } void main( void ) { //Scale of the starss grid //This is to make the stars scale the same way the camera scales, which is: float aspect = (vResolution.y / vResolution.x) ; vec2 scale = vec2(vResolution.y / 1920.0 / aspect * 1.1 * max(0.85, gl_FragCoord.w) + (aspect / 20.0), vResolution.y / 1920.0 / aspect * 1.1 * max(0.85, gl_FragCoord.w) + (aspect / 20.0)); vec2 screenSpace = gl_FragCoord.xy; vec2 starSpaceCoord = screenSpace; bool finalResult = isOnStar(starSpaceCoord, vec2(100.0, 100.0), vec2(0.0, 0.0), 45.0, scale); finalResult = finalResult || isOnStar(starSpaceCoord, vec2(120.0, 280.0), vec2(-120.0, -40.0), 25.0, scale * 1.0424); finalResult = finalResult || isOnStar(starSpaceCoord, vec2(310.0, 170.0), vec2(-1020.0, 0.0), 10.0, scale * 1.341); finalResult = finalResult || isOnStar(starSpaceCoord, vec2(90.0, 130.0), vec2(-80.0, -30.0), 15.0, scale * 0.931); finalResult = finalResult || isOnStar(starSpaceCoord, vec2(130.0, 90.0), vec2(-130.0, -118.443), 76.50, scale * 0.931); if(finalResult) { gl_FragColor = vec4(0.9, 0.9, 0.8, 1.0); } else { gl_FragColor = vec4(0.05, 0.0, 0.05, 1.0); } }
Delba, a purple alien cat with long fluffy hair covering the right side of her face.
Hey, I'm Delta! Welcome aboard my spaceship! It's a bit incomplete around here, but i'm working hard to add all the stuff!

Version log

v0.1.4

I added a little pixelate-y filter on the background now!!
I learned quite a bit about FrameBuffer Objects from this which is quite nice, on the other hand the code is an absolute mess once more. I hope this looks a little bit nice though.
I'm eventually gonna get to the actual! Website stuff. I'm just having too much fun with this background!
And to think I'm eventually going to have to make others too...

v0.1.3

Fixing some bugs on mobile!

v0.1.2

GOT THE STAR SHADER DOWN!!! WOOOOOOOO!!!!
I gotta make it better but I'm so happy with how it looks for now!
Anyways I also once again updated some back end shader stuff to make this work of course, and outside of that no changes!

v0.1.1

I added some textures and stuff to the background now! They aren't super great but i'm still getting a hang of this stuff.

I also updated the likes/dislikes because they were boring, and now they're awesomer! awesome-er? whatever!

I also added a SUPER TEMPORARY index page for warnings about javascript and opengl and css animation support
Anyways next update i'm gonna fix that static box down the hallway to be a proper spaceship window!
Seeya soon- 1. 2. 3. shader code goooooo!

v0.1:

Wooooo!! First version! Things are still VERY under construction here but it's all cool.
(I 100% don't know how to make a website)

end thingy