From 4a25904b1e2033cd28a5190e0f3c6f5dee5679af Mon Sep 17 00:00:00 2001 From: ntr Date: Sun, 30 Dec 2018 22:28:23 +1100 Subject: [PATCH] stars --- client/src/scenes/background.js | 120 ++++++++++++++++++++------------ 1 file changed, 75 insertions(+), 45 deletions(-) diff --git a/client/src/scenes/background.js b/client/src/scenes/background.js index b3c5680b..1f986493 100644 --- a/client/src/scenes/background.js +++ b/client/src/scenes/background.js @@ -1,53 +1,83 @@ const Phaser = require('phaser'); +const STARS = ` +//--- hatsuyuki --- +// by Catzpaw 2016 +#ifdef GL_ES +precision mediump float; +#endif + +#extension GL_OES_standard_derivatives : enable + +uniform float time; +uniform vec2 resolution; + float hash(float x){ + return fract(sin(x*133.3)*12.13); + } + void main(void){ + vec2 uv=(gl_FragCoord.xy*2.-resolution.xy)/min(resolution.x,resolution.y); + vec3 c=vec3(.2,.2,.2); + float a=4.4; + float si=sin(a),co=cos(a); + uv*=mat2(co,-si,si,co); + uv*=length(uv+vec2(0,1.9))*.5+1.; + float v=1.-sin(hash(floor(uv.x*200.))*2.); + float b=clamp(abs(sin(5.*time*v+uv.y*(5./(2.+v))))-.95,0.,1.)*20.; + c*=v*b; + gl_FragColor = vec4(c,2); +} +`; + +const PLASMA = ` +precision mediump float; + +uniform sampler2D uMainSampler; +uniform vec2 uResolution; +uniform float uTime; + +varying vec2 outTexCoord; +varying vec4 outTint; + +#define MAX_ITER 4 + +void main( void ) +{ + vec2 v_texCoord = gl_FragCoord.xy / uResolution; + + vec2 p = v_texCoord * 8.0 - vec2(20.0); + vec2 i = p; + float c = 1.0; + float inten = .05; + + for (int n = 0; n < MAX_ITER; n++) + { + float t = uTime * (1.0 - (3.0 / float(n+1))); + + i = p + vec2(cos(t - i.x) + sin(t + i.y), + sin(t - i.y) + cos(t + i.x)); + + c += 1.0/length(vec2(p.x / (sin(i.x+t)/inten), + p.y / (cos(i.y+t)/inten))); + } + + c /= float(MAX_ITER); + c = 1.5 - sqrt(c); + + vec4 texColor = vec4(0.01, 0.01, 0.01, 1.0); + + texColor.rgb *= (1.0 / (1.0 - (c + 0.05))); + + gl_FragColor = texColor; +} +`; + const CustomPipeline = new Phaser.Class({ Extends: Phaser.Renderer.WebGL.Pipelines.TextureTintPipeline, initialize: function CustomPipeline (game) { Phaser.Renderer.WebGL.Pipelines.TextureTintPipeline.call(this, { game, renderer: game.renderer, - fragShader: ` - precision mediump float; - - uniform sampler2D uMainSampler; - uniform vec2 uResolution; - uniform float uTime; - - varying vec2 outTexCoord; - varying vec4 outTint; - - #define MAX_ITER 4 - - void main( void ) - { - vec2 v_texCoord = gl_FragCoord.xy / uResolution; - - vec2 p = v_texCoord * 8.0 - vec2(20.0); - vec2 i = p; - float c = 1.0; - float inten = .05; - - for (int n = 0; n < MAX_ITER; n++) - { - float t = uTime * (1.0 - (3.0 / float(n+1))); - - i = p + vec2(cos(t - i.x) + sin(t + i.y), - sin(t - i.y) + cos(t + i.x)); - - c += 1.0/length(vec2(p.x / (sin(i.x+t)/inten), - p.y / (cos(i.y+t)/inten))); - } - - c /= float(MAX_ITER); - c = 1.5 - sqrt(c); - - vec4 texColor = vec4(0.01, 0.01, 0.01, 1.0); - - texColor.rgb *= (1.0 / (1.0 - (c + 0.05))); - - gl_FragColor = texColor; - } - `, + fragShader: STARS, }); }, }); @@ -56,13 +86,13 @@ const CustomPipeline = new Phaser.Class({ class Background extends Phaser.Scene { constructor() { super({ key: 'Background', active: true }); - this.bgTime = 0.0; + this.bgTime = 10.0; } create() { const game = this.game; this.customPipeline = game.renderer.addPipeline('Custom', new CustomPipeline(game)); - this.customPipeline.setFloat2('uResolution', 1600, 1000); + this.customPipeline.setFloat2('resolution', 1600, 1000); const sprite = this.add.sprite(0, 0); sprite.setPipeline('Custom'); @@ -71,7 +101,7 @@ class Background extends Phaser.Scene { } update() { - this.customPipeline.setFloat1('uTime', this.bgTime); + this.customPipeline.setFloat1('time', this.bgTime); this.bgTime += 0.005; } }