From 2eb43680c817f84ff46e2c927f005f461bf787f5 Mon Sep 17 00:00:00 2001 From: rexim Date: Tue, 8 Jun 2021 02:38:30 +0700 Subject: [PATCH 1/6] Add params to the "Hop" filter --- js/filters.js | 55 +++++++++++++++++++++++++++++++++++++++++++++------ 1 file changed, 49 insertions(+), 6 deletions(-) diff --git a/js/filters.js b/js/filters.js index f053660..b3214cb 100644 --- a/js/filters.js +++ b/js/filters.js @@ -1,8 +1,48 @@ // TODO(#58): add params to all of the filters +// TODO: human readable titles for the filter params const filters = { "Hop": { "transparent": 0x00FF00, - "duration": "0.85 * 2", + "duration": "interval * 2", + "params": { + "interval": { + "type": "float", + "init": 0.85, + "min": 0.01, + "max": 2.00, + "step": 0.01, + }, + "ground": { + "type": "float", + "init": 0.5, + "min": -1.0, + "max": 1.0, + "step": 0.01, + }, + "scale": { + "type": "float", + "init": 0.40, + "min": 0.0, + "max": 1.0, + "step": 0.01, + }, + // TODO: jump_height in the "Hop" filter does not make any sense + // If it's bigger the emote should jump higher. Right now it is the other way around. + "jump_height": { + "type": "float", + "init": 4.0, + "min": 1.0, + "max": 10.0, + "step": 0.01, + }, + "hops": { + "type": "float", + "init": 2.0, + "min": 1.0, + "max": 5.0, + "step": 1.0, + } + }, "vertex": `#version 100 precision mediump float; @@ -10,6 +50,12 @@ attribute vec2 meshPosition; uniform float time; uniform vec2 emoteSize; +uniform float interval; +uniform float ground; +uniform float scale; +uniform float jump_height; +uniform float hops; + varying vec2 uv; float sliding_from_left_to_right(float time_interval) { @@ -21,14 +67,11 @@ float flipping_directions(float time_interval) { } void main() { - float scale = 0.40; - float hops = 2.0; - float x_time_interval = 0.85; + float x_time_interval = interval; float y_time_interval = x_time_interval / (2.0 * hops); - float height = 0.5; vec2 offset = vec2( sliding_from_left_to_right(x_time_interval) * flipping_directions(x_time_interval) * (1.0 - scale), - ((sliding_from_left_to_right(y_time_interval) * flipping_directions(y_time_interval) + 1.0) / 4.0) - height); + ((sliding_from_left_to_right(y_time_interval) * flipping_directions(y_time_interval) + 1.0) / jump_height) - ground); gl_Position = vec4( meshPosition * scale + offset, From dd7ecd41eaeb7bcdeef52df74370bf9f744f73c0 Mon Sep 17 00:00:00 2001 From: rexim Date: Tue, 8 Jun 2021 02:46:33 +0700 Subject: [PATCH 2/6] Add params to the "Bounce" filter --- js/filters.js | 25 +++++++++++++++++++++---- 1 file changed, 21 insertions(+), 4 deletions(-) diff --git a/js/filters.js b/js/filters.js index b3214cb..1c54ea2 100644 --- a/js/filters.js +++ b/js/filters.js @@ -214,7 +214,23 @@ void main() { }, "Bounce": { "transparent": 0x00FF00, - "duration": "Math.PI / 5.0", + "duration": "Math.PI / period", + "params": { + "period": { + "type": "float", + "init": 5.0, + "min": 1.0, + "max": 10.0, + "step": 0.1, + }, + "scale": { + "type": "float", + "init": 0.30, + "min": 0.0, + "max": 1.0, + "step": 0.01, + } + }, "vertex": `#version 100 precision mediump float; @@ -223,12 +239,13 @@ attribute vec2 meshPosition; uniform vec2 resolution; uniform float time; +uniform float period; +uniform float scale; + varying vec2 uv; void main() { - float scale = 0.30; - float period_interval = 5.0; - vec2 offset = vec2(0.0, (2.0 * abs(sin(time * period_interval)) - 1.0) * (1.0 - scale)); + vec2 offset = vec2(0.0, (2.0 * abs(sin(time * period)) - 1.0) * (1.0 - scale)); gl_Position = vec4(meshPosition * scale + offset, 0.0, 1.0); uv = (meshPosition + 1.0) / 2.0; } From 40ac42e02b41a5d5aa93ea7e6f39e289cfeb8ab5 Mon Sep 17 00:00:00 2001 From: rexim Date: Tue, 8 Jun 2021 02:50:21 +0700 Subject: [PATCH 3/6] Additional work --- js/filters.js | 1 + 1 file changed, 1 insertion(+) diff --git a/js/filters.js b/js/filters.js index 1c54ea2..1db4bdd 100644 --- a/js/filters.js +++ b/js/filters.js @@ -4,6 +4,7 @@ const filters = { "Hop": { "transparent": 0x00FF00, "duration": "interval * 2", + // TODO: when you have too many params the UI gets really cluttered "params": { "interval": { "type": "float", From 484f3a7b9990ab7af8a8a2f29a6509c40a30c28e Mon Sep 17 00:00:00 2001 From: rexim Date: Tue, 8 Jun 2021 02:51:37 +0700 Subject: [PATCH 4/6] Add TODO(#61) --- js/filters.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/js/filters.js b/js/filters.js index 1db4bdd..e3aa7a0 100644 --- a/js/filters.js +++ b/js/filters.js @@ -1,5 +1,5 @@ // TODO(#58): add params to all of the filters -// TODO: human readable titles for the filter params +// TODO(#61): human readable titles for the filter params const filters = { "Hop": { "transparent": 0x00FF00, From f6537d1cf148a6fcd0474e8f3d548e8f6fce2395 Mon Sep 17 00:00:00 2001 From: rexim Date: Tue, 8 Jun 2021 02:51:38 +0700 Subject: [PATCH 5/6] Add TODO(#62) --- js/filters.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/js/filters.js b/js/filters.js index e3aa7a0..e60032e 100644 --- a/js/filters.js +++ b/js/filters.js @@ -4,7 +4,7 @@ const filters = { "Hop": { "transparent": 0x00FF00, "duration": "interval * 2", - // TODO: when you have too many params the UI gets really cluttered + // TODO(#62): when you have too many params the UI gets really cluttered "params": { "interval": { "type": "float", From a755207f9b64a21c9cc365b805531c20a000e4e0 Mon Sep 17 00:00:00 2001 From: rexim Date: Tue, 8 Jun 2021 02:51:38 +0700 Subject: [PATCH 6/6] Add TODO(#63) --- js/filters.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/js/filters.js b/js/filters.js index e60032e..6afcf12 100644 --- a/js/filters.js +++ b/js/filters.js @@ -27,7 +27,7 @@ const filters = { "max": 1.0, "step": 0.01, }, - // TODO: jump_height in the "Hop" filter does not make any sense + // TODO(#63): jump_height in the "Hop" filter does not make any sense // If it's bigger the emote should jump higher. Right now it is the other way around. "jump_height": { "type": "float",