Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse files

Shader cleanup

  • Loading branch information...
commit c447fa4fe0d97c7dde29b5707e26acd96146d86b 1 parent 52e8257
@njx authored
View
BIN  below-flat.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
BIN  below.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
8 shader.fs
@@ -18,9 +18,6 @@ precision mediump float;
// Uniforms passed in from CSS
-uniform vec4 backColor;
-uniform float useColoredBack;
-
// Varyings
varying float v_lighting;
@@ -29,9 +26,6 @@ varying float v_lighting;
void main()
{
- if (!gl_FrontFacing && useColoredBack >= 0.5)
- css_MixColor = v_lighting * backColor;
- else
- css_MixColor = vec4(v_lighting);
+ css_MixColor = vec4(v_lighting);
css_MixColor.a = 1.0;
}
View
8 shader.vs
@@ -30,13 +30,8 @@ uniform vec2 u_textureSize;
// Uniforms passed-in from CSS
uniform mat4 transform;
-
-uniform float direction;
-
uniform float mapDepth;
-
uniform float t;
-uniform float shadow;
// Varyings
@@ -52,10 +47,9 @@ void main()
{
vec4 pos = a_position;
float ramp = step(0.5, 1.0 - a_meshCoord.y) * a_meshCoord.y + step(0.5, a_meshCoord.y) * (1.0 - a_meshCoord.y);
- float zOffset = ramp * -50.0;
float adjT = t * 0.999; // don't get to the end to avoid overlap
- pos.z = zOffset * mapDepth * adjT - mapDepth * adjT / 2.0;
+ pos.z = ramp * -50.0 * mapDepth * adjT;
pos.y = (pos.y + 0.5) * (1.0 - adjT) - 0.5;
v_lighting = 1.0 - (ramp * adjT * 0.5);
View
20 styles.css
@@ -28,14 +28,14 @@
}
.doFold {
- -webkit-animation-duration: 0.4s;
+ -webkit-animation-duration: 0.3s;
-webkit-animation-name: fold;
-webkit-animation-fill-mode: forwards;
-webkit-animation-timing-function: ease-in;
}
.doUnfold {
- -webkit-animation-duration: 0.4s;
+ -webkit-animation-duration: 0.3s;
-webkit-animation-name: unfold;
-webkit-animation-fill-mode: forwards;
-webkit-animation-timing-function: ease-in;
@@ -43,31 +43,31 @@
@-webkit-keyframes fold {
from {
- -webkit-filter: custom(url(shader.vs) mix(url(shader.fs) multiply source-atop), 2 2 border-box, transform perspective(1000) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg), t 0, mapDepth 5, useColoredBack 1, backColor 1 1 1 1, direction 0, shadow 0);
+ -webkit-filter: custom(url(shader.vs) mix(url(shader.fs) multiply source-atop), 2 2 border-box, transform perspective(1000) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg), t 0, mapDepth 5);
}
to {
- -webkit-filter: custom(url(shader.vs) mix(url(shader.fs) multiply source-atop), 2 2 border-box, transform perspective(1000) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg), t 1, mapDepth 5, useColoredBack 1, backColor 1 1 1 1, direction 0, shadow 0);
+ -webkit-filter: custom(url(shader.vs) mix(url(shader.fs) multiply source-atop), 2 2 border-box, transform perspective(1000) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg), t 1, mapDepth 5);
}
}
@-webkit-keyframes unfold {
from {
- -webkit-filter: custom(url(shader.vs) mix(url(shader.fs) multiply source-atop), 2 2 border-box, transform perspective(1000) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg), t 1, mapDepth 5, useColoredBack 1, backColor 1 1 1 1, direction 0, shadow 0);
+ -webkit-filter: custom(url(shader.vs) mix(url(shader.fs) multiply source-atop), 2 2 border-box, transform perspective(1000) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg), t 1, mapDepth 5);
}
to {
- -webkit-filter: custom(url(shader.vs) mix(url(shader.fs) multiply source-atop), 2 2 border-box, transform perspective(1000) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg), t 0, mapDepth 5, useColoredBack 1, backColor 1 1 1 1, direction 0, shadow 0);
+ -webkit-filter: custom(url(shader.vs) mix(url(shader.fs) multiply source-atop), 2 2 border-box, transform perspective(1000) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg), t 0, mapDepth 5);
}
}
.doBelowFold {
- -webkit-animation-duration: 0.4s;
+ -webkit-animation-duration: 0.3s;
-webkit-animation-name: slideUp;
-webkit-animation-fill-mode: forwards;
-webkit-animation-timing-function: ease-in;
}
.doBelowUnfold {
- -webkit-animation-duration: 0.4s;
+ -webkit-animation-duration: 0.3s;
-webkit-animation-name: slideDown;
-webkit-animation-fill-mode: forwards;
-webkit-animation-timing-function: ease-in;
@@ -105,14 +105,14 @@
}
.collapse {
- -webkit-animation-duration: 0.4s;
+ -webkit-animation-duration: 0.3s;
-webkit-animation-name: collapse;
-webkit-animation-fill-mode: forwards;
-webkit-animation-timing-function: ease-in;
}
.expand {
- -webkit-animation-duration: 0.4s;
+ -webkit-animation-duration: 0.3s;
-webkit-animation-name: expand;
-webkit-animation-fill-mode: forwards;
-webkit-animation-timing-function: ease-in;
Please sign in to comment.
Something went wrong with that request. Please try again.