From d360cd9e67f944354ede851c3bd0980d9ea628d5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ga=C3=ABtan=20Renaudeau?= <renaudeau.gaetan@gmail.com>
Date: Wed, 23 Sep 2015 10:42:25 +0200
Subject: [PATCH] example with latest GL.Uniform syntax

---
 Examples/Simple/Colorify.js | 10 +++++++---
 Examples/Simple/index.html  |  2 +-
 Examples/Simple/index.js    | 15 +++++++++++----
 3 files changed, 19 insertions(+), 8 deletions(-)

diff --git a/Examples/Simple/Colorify.js b/Examples/Simple/Colorify.js
index 34a0418..368b90c 100644
--- a/Examples/Simple/Colorify.js
+++ b/Examples/Simple/Colorify.js
@@ -27,14 +27,18 @@ void main () {
 
 class Colorify extends React.Component {
   render () {
-    const { width, height, children: image, colorScale, legend } = this.props;
+    const { width, height, children: image, colorScale, legend, disableLinearInterpolation } = this.props;
     return <GL.View
       shader={shaders.colorify}
       width={width}
       height={height}
-      uniforms={{ image, colorScale, legend }}
+      uniforms={{ image, legend }}
       opaque={false}
-    />;
+    >
+      <GL.Uniform name="colorScale" disableLinearInterpolation={disableLinearInterpolation}>
+        {colorScale}
+      </GL.Uniform>
+    </GL.View>;
   }
 }
 
diff --git a/Examples/Simple/index.html b/Examples/Simple/index.html
index 69f0a95..bb9a71c 100644
--- a/Examples/Simple/index.html
+++ b/Examples/Simple/index.html
@@ -11,7 +11,7 @@
   #container > * {
     margin: 0px auto;
   }
-  input {
+  input[type=range], input[type=text] {
     width: 100%;
     margin: 5px 0;
   }
diff --git a/Examples/Simple/index.js b/Examples/Simple/index.js
index 8dd8d45..221a502 100644
--- a/Examples/Simple/index.js
+++ b/Examples/Simple/index.js
@@ -20,7 +20,8 @@ class Simple extends React.Component {
       progress: 0.5,
       factor: 1,
       text: "leading the pack",
-      colorScale: "Spectral"
+      colorScale: "Spectral",
+      disableLinearInterpolation: false
     };
   }
 
@@ -32,7 +33,8 @@ class Simple extends React.Component {
       text,
       progress,
       factor,
-      colorScale
+      colorScale,
+      disableLinearInterpolation
     } = this.state;
 
     return <div style={styles.container}>
@@ -76,6 +78,7 @@ class Simple extends React.Component {
             onValueChange={hue => this.setState({ hue })}
           />
         <input
+            type="text"
             onChange={e => this.setState({ text: e.target.value })}
             value={text}
           />
@@ -128,12 +131,16 @@ class Simple extends React.Component {
 
         <div style={styles.demo}>
           <h2 style={styles.demoTitle}>9. Texture from array</h2>
-          <Colorify width={256} height={190} colorScale={colorScales[colorScale]}>
+          <Colorify width={256} height={190} colorScale={colorScales[colorScale]} disableLinearInterpolation={disableLinearInterpolation}>
             http://i.imgur.com/iPKTONG.jpg
           </Colorify>
           <select style={styles.select} value={colorScale} onChange={({target:{value:colorScale}}) => this.setState({ colorScale })}>
             {Object.keys(colorScales).map(cs => <option value={cs}>{cs}</option>)}
           </select>
+          <label>
+            <input type="checkbox" onChange={({target:{checked:disableLinearInterpolation}}) => this.setState({ disableLinearInterpolation })} />
+            Disable Linear Interpolation
+          </label>
         </div>
 
       </div>
@@ -171,7 +178,7 @@ const styles = {
     fontSize: "20px"
   },
   select: {
-    marginTop: "4px",
+    margin: "4px 0",
     width: "100%"
   }
 };