From abf29519bfaed406e48ffa2eb202dd013e2d5321 Mon Sep 17 00:00:00 2001 From: Noah Gordon Date: Fri, 28 Jun 2019 11:13:38 +0200 Subject: [PATCH] More modifiers on wave clock, remove random colors --- elm.js | 75 ++++++++++++++++++++++++++++++++++------ src/Model.elm | 3 ++ src/WaveClock/Model.elm | 10 +++--- src/WaveClock/Update.elm | 31 ++++++++--------- 4 files changed, 89 insertions(+), 30 deletions(-) diff --git a/elm.js b/elm.js index fc2567a..98cde38 100644 --- a/elm.js +++ b/elm.js @@ -8466,11 +8466,9 @@ var author$project$WaveClock$Model$init = function (flags) { return { angNoise: angNoise, angle: (-elm$core$Basics$pi) / 2, - colorChange: -1, - colorVal: 254, lastTick: flags.time, lines: _List_Nil, - modifiers: {angNoise: 1, delay: 0, radNoise: 1, radius: 1, step: 1}, + modifiers: {angNoise: 1, delay: 0, hue: 0, lightness: 0.5, radNoise: 1, radius: 1, saturation: 0, step: 1}, radNoise: radiusNoise, seed: seed4, time: elm$time$Time$millisToPosix(flags.time), @@ -8481,8 +8479,11 @@ var author$project$WaveClock$Model$init = function (flags) { }; var author$project$WaveClock$Update$AngNoise = {$: 'AngNoise'}; var author$project$WaveClock$Update$Delay = {$: 'Delay'}; +var author$project$WaveClock$Update$Hue = {$: 'Hue'}; +var author$project$WaveClock$Update$Lightness = {$: 'Lightness'}; var author$project$WaveClock$Update$RadNoise = {$: 'RadNoise'}; var author$project$WaveClock$Update$Radius = {$: 'Radius'}; +var author$project$WaveClock$Update$Saturation = {$: 'Saturation'}; var author$project$WaveClock$Update$Step = {$: 'Step'}; var elm$core$Debug$log = _Debug_log; var author$project$WaveClock$Update$modify = F3( @@ -8523,7 +8524,7 @@ var author$project$WaveClock$Update$modify = F3( modifiers, {step: val * 2}) }); - default: + case 'Delay': return _Utils_update( model, { @@ -8531,14 +8532,38 @@ var author$project$WaveClock$Update$modify = F3( modifiers, {delay: val}) }); + case 'Hue': + return _Utils_update( + model, + { + modifiers: _Utils_update( + modifiers, + {hue: val}) + }); + case 'Saturation': + return _Utils_update( + model, + { + modifiers: _Utils_update( + modifiers, + {saturation: val}) + }); + default: + return _Utils_update( + model, + { + modifiers: _Utils_update( + modifiers, + {lightness: val}) + }); } }); var author$project$WaveClock$Update$tick = F2( function (time, model) { var timeInt = elm$time$Time$posixToMillis(time); - if (_Utils_cmp( + if ((model.modifiers.delay === 1) || (_Utils_cmp( timeInt - elm$core$Basics$round(model.modifiers.delay * 1000), - model.lastTick) < 0) { + model.lastTick) < 0)) { return model; } else { var radNoise = model.angNoise + 5.0e-3; @@ -8547,7 +8572,6 @@ var author$project$WaveClock$Update$tick = F2( _Utils_Tuple3(radNoise * model.modifiers.radNoise, 0, 0), model.seed) * 550) * model.modifiers.radius) + 1; var imageWidth = model.window.width - 200; - var colorVal = model.colorVal + model.colorChange; var baseAngleStep = 6 * model.modifiers.step; var baseAngle = (model.angle + (A2( author$project$Perlin$noise, @@ -8576,15 +8600,13 @@ var author$project$WaveClock$Update$tick = F2( { angNoise: angNoise, angle: angle, - colorChange: (colorVal > 254) ? (-1) : ((colorVal < 0) ? 1 : model.colorChange), - colorVal: colorVal, lastTick: timeInt, lines: _Utils_ap( model.lines, _List_fromArray( [ { - color: A4(avh4$elm_color$Color$rgba, colorVal / 255, colorVal / 255, colorVal / 255, 60 / 255), + color: A4(avh4$elm_color$Color$hsla, model.modifiers.hue, model.modifiers.saturation, model.modifiers.lightness, 60 / 255), x1: centerX + (radius * elm$core$Basics$cos(rad)), x2: centerX + (radius * elm$core$Basics$cos(oppRad)), y1: centerY + (radius * elm$core$Basics$sin(rad)), @@ -8836,6 +8858,39 @@ var author$project$Model$init = function (flags) { }, function ($) { return $.delay; + })), + _Utils_Tuple3( + author$project$WaveClock$Update$Hue, + 'hue', + A2( + elm$core$Basics$composeR, + function ($) { + return $.modifiers; + }, + function ($) { + return $.hue; + })), + _Utils_Tuple3( + author$project$WaveClock$Update$Saturation, + 'saturation', + A2( + elm$core$Basics$composeR, + function ($) { + return $.modifiers; + }, + function ($) { + return $.saturation; + })), + _Utils_Tuple3( + author$project$WaveClock$Update$Lightness, + 'lightness', + A2( + elm$core$Basics$composeR, + function ($) { + return $.modifiers; + }, + function ($) { + return $.lightness; })) ]), name: 'Wave Clock Redux', diff --git a/src/Model.elm b/src/Model.elm index c54e4fa..f0bbbca 100644 --- a/src/Model.elm +++ b/src/Model.elm @@ -139,6 +139,9 @@ init flags = , ( Radius, "rad", .modifiers >> .radius >> (\n -> n / 2) ) , ( Step, "step", .modifiers >> .step >> (\n -> n / 2) ) , ( Delay, "delay", .modifiers >> .delay ) + , ( Hue, "hue", .modifiers >> .hue ) + , ( Saturation, "saturation", .modifiers >> .saturation ) + , ( Lightness, "lightness", .modifiers >> .lightness ) ] , model = WaveClock.Model.init flags , tick = WaveClock.Update.tick diff --git a/src/WaveClock/Model.elm b/src/WaveClock/Model.elm index be4ba38..f8aa7b2 100644 --- a/src/WaveClock/Model.elm +++ b/src/WaveClock/Model.elm @@ -14,8 +14,6 @@ type alias Model = , xNoise : Float , yNoise : Float , angle : Float - , colorChange : Float - , colorVal : Float , lines : List Line , modifiers : { radNoise : Float @@ -23,6 +21,9 @@ type alias Model = , radius : Float , step : Float , delay : Float + , hue : Float + , saturation : Float + , lightness : Float } , lastTick : Int } @@ -67,8 +68,6 @@ init flags = , xNoise = xNoise , yNoise = yNoise , angle = -pi / 2 - , colorVal = 254 - , colorChange = -1 , lines = [] , modifiers = { angNoise = 1 @@ -76,6 +75,9 @@ init flags = , radius = 1 , step = 1 , delay = 0 + , hue = 0 + , saturation = 0 + , lightness = 0.5 } , lastTick = flags.time } diff --git a/src/WaveClock/Update.elm b/src/WaveClock/Update.elm index 590c9e5..b8beb87 100644 --- a/src/WaveClock/Update.elm +++ b/src/WaveClock/Update.elm @@ -1,6 +1,6 @@ module WaveClock.Update exposing (Modifier(..), modify, tick) -import Color exposing (rgba) +import Color exposing (hsla) import Perlin exposing (noise) import Time exposing (Posix) import WaveClock.Model exposing (Model) @@ -12,6 +12,9 @@ type Modifier | Radius | Step | Delay + | Hue + | Saturation + | Lightness tick : Posix -> Model -> Model @@ -20,7 +23,7 @@ tick time model = timeInt = Time.posixToMillis time in - if timeInt - (round <| model.modifiers.delay * 1000) < model.lastTick then + if model.modifiers.delay == 1 || timeInt - (round <| model.modifiers.delay * 1000) < model.lastTick then model else @@ -70,9 +73,6 @@ tick time model = oppRad = rad + pi - - colorVal = - model.colorVal + model.colorChange in { model | angle = angle @@ -80,23 +80,13 @@ tick time model = , radNoise = radNoise , xNoise = xNoise , yNoise = yNoise - , colorVal = colorVal - , colorChange = - if colorVal > 254 then - -1 - - else if colorVal < 0 then - 1 - - else - model.colorChange , lines = model.lines ++ [ { x1 = centerX + (radius * cos rad) , y1 = centerY + (radius * sin rad) , x2 = centerX + (radius * cos oppRad) , y2 = centerY + (radius * sin oppRad) - , color = rgba (colorVal / 255) (colorVal / 255) (colorVal / 255) (60 / 255) + , color = hsla model.modifiers.hue model.modifiers.saturation model.modifiers.lightness (60 / 255) } ] , lastTick = timeInt @@ -124,3 +114,12 @@ modify model mod val = Delay -> { model | modifiers = { modifiers | delay = val } } + + Hue -> + { model | modifiers = { modifiers | hue = val } } + + Saturation -> + { model | modifiers = { modifiers | saturation = val } } + + Lightness -> + { model | modifiers = { modifiers | lightness = val } }