light9 Changeset - b0ea577c12a3

Changeset - b0ea577c12a3

Parent rev.

Child rev.

[Not reviewed]

default

0 3 0

drewp@bigasterisk.com - 8 years ago 2017-06-07 04:32:10
drewp@bigasterisk.com

WIP colorpick into timeline. working on initial-paint bugs
Ignore-this: 497c157da0ff57cc6f5a66eba254e30c

3 files changed with 16 insertions and 8 deletions:

light9/web/light9-color-picker.html

light9/web/timeline/timeline-elements.html

light9/web/timeline/timeline.coffee

0 comments (0 inline, 0 general)

light9/web/light9-color-picker.html

➞

Show inline comments

 <link rel="import" href="/lib/polymer/polymer.html">
 <link rel="import" href="/lib/paper-slider/paper-slider.html">
 <dom-module id="light9-color-picker">
   <template>
@@ @@ -75,7 +76,7 @@ @@
   <script src="/lib/color/one-color.js"></script>
   <script>
    class RainbowCanvas {
        constructor(url, size) {
+       constructor(url, size, onReady) {
            this.size = size;
            var elem = document.createElement('canvas');
            elem.width = size[0];
@@ @@ -89,6 +90,7 @@ @@
            img.onload = function() {
                this.ctx.drawImage(img, 0, 0);
                this._readImage();
                if (onReady) onReady();
            }.bind(this);
            img.src = url;
+       }
@@ @@ -165,7 +167,11 @@ @@
                    large: new RainbowCanvas(
                        '/colorpick_rainbow_large.png', [400, 200]),
                    small: new RainbowCanvas(
                        '/colorpick_rainbow_small.png', [150, 30]),
                        '/colorpick_rainbow_small.png', [150, 30],
                        function() {
                            // color may have been set before our image came
                            this.readColor(this.color);
                        }.bind(this)),
                };
+           }
            this.large = window.pickerCanvases.large;
@@ @@ -184,15 +190,18 @@ @@
                return;
+           }
            console.log('pos', color)
            // setting immediate-value doesn't work
            this.sliderWriteValue = one.color(color).value() * 255;
            var colorValue = one.color(color).value() * 255;
            this.sliderWriteValue = colorValue;
            try {
                var pos = this.small.posFor(color);
            } catch(e) {
                console.log('err')
                this.moveSmallCrosshair([-999, -999]);
                return;
+           }
            console.log('go', pos)
            this.moveSmallCrosshair(pos);
        },
        _floatLarge: function() {

light9/web/timeline/timeline-elements.html

➞

Show inline comments

@@ @@ -4,6 +4,7 @@ @@
 <link rel="import" href="light9-timeline-audio.html">
 <link rel="import" href="../rdfdb-synced-graph.html">
 <link rel="import" href="../light9-music.html">
 <link rel="import" href="../light9-color-picker.html">
 <link rel="import" href="../edit-choice.html">
@@ @@ -333,9 +334,7 @@ background: rgba(126, 52, 245, 0.0784313 @@
       <table>
         <tr><th>effect:</th><td><edit-choice uri="{{effect}}" label="{{effectLabel}}"></edit-choice></td></tr>
         <tr><th>colorScale:</th><td>
           <!-- this could share with live/index.html's
           light9-live-control, but that one is currently junky -->
           <span><input type="color" value="{{colorScale::input}}"></span>
           <light9-color-picker color="{{colorScale}}"></light9-color-picker>
         </td></tr>
       </table>
     </div>

light9/web/timeline/timeline.coffee

➞

Show inline comments

@@ @@ -502,7 +502,7 @@ Polymer @@
     rightX = screenPts[Math.min(2, screenPts.length - 1)].e(1) - 5
     if screenPts.length < 3
       rightX = leftX + 120
-    w = 150
+    w = 430
     h = 80
     @inlineRect = {
       left: leftX,

0 comments (0 inline, 0 general)