Playing
This commit is contained in:
parent
dbf42744fd
commit
e58fda731c
3 changed files with 26 additions and 44 deletions
|
@ -1290,12 +1290,6 @@ var PS = {};
|
|||
|
||||
exports.abs = Math.abs;
|
||||
|
||||
exports.atan2 = function (y) {
|
||||
return function (x) {
|
||||
return Math.atan2(y, x);
|
||||
};
|
||||
};
|
||||
|
||||
exports.cos = Math.cos;
|
||||
|
||||
exports.pow = function (n) {
|
||||
|
@ -1312,9 +1306,7 @@ var PS = {};
|
|||
|
||||
exports.round = Math.round;
|
||||
|
||||
exports.sin = Math.sin;
|
||||
|
||||
exports.sqrt = Math.sqrt;
|
||||
exports.sin = Math.sin;
|
||||
|
||||
exports.pi = Math.PI;
|
||||
})(PS["Math"] = PS["Math"] || {});
|
||||
|
@ -1325,12 +1317,10 @@ var PS = {};
|
|||
var exports = $PS["Math"];
|
||||
var $foreign = $PS["Math"];
|
||||
exports["abs"] = $foreign.abs;
|
||||
exports["atan2"] = $foreign.atan2;
|
||||
exports["cos"] = $foreign.cos;
|
||||
exports["pow"] = $foreign.pow;
|
||||
exports["round"] = $foreign.round;
|
||||
exports["sin"] = $foreign.sin;
|
||||
exports["sqrt"] = $foreign.sqrt;
|
||||
exports["remainder"] = $foreign.remainder;
|
||||
exports["pi"] = $foreign.pi;
|
||||
})(PS);
|
||||
|
@ -2381,22 +2371,10 @@ var PS = {};
|
|||
b: b
|
||||
};
|
||||
};
|
||||
var toLCh = function (col) {
|
||||
var rec = toLab(col);
|
||||
var rad2deg = 180.0 / $$Math.pi;
|
||||
var c = $$Math.sqrt(rec.a * rec.a + rec.b * rec.b);
|
||||
var h = modPos($$Math.atan2(rec.b)(rec.a) * rad2deg)(360.0);
|
||||
return {
|
||||
l: rec.l,
|
||||
c: c,
|
||||
h: h
|
||||
};
|
||||
};
|
||||
exports["lab"] = lab;
|
||||
exports["lch"] = lch;
|
||||
exports["fromHexString"] = fromHexString;
|
||||
exports["toLab"] = toLab;
|
||||
exports["toLCh"] = toLCh;
|
||||
exports["toHexString"] = toHexString;
|
||||
exports["cssStringHSLA"] = cssStringHSLA;
|
||||
})(PS);
|
||||
|
@ -10683,12 +10661,10 @@ var PS = {};
|
|||
var Data_Array = $PS["Data.Array"];
|
||||
var Data_Functor = $PS["Data.Functor"];
|
||||
var Data_Semigroup = $PS["Data.Semigroup"];
|
||||
var colorLabels = [ "magenta", "red", "orange", "yellow", "green", "cyan", "blue", "violet" ];
|
||||
var colorLabels = [ "yellow", "orange", "red", "magenta", "violet", "blue", "cyan", "green" ];
|
||||
var genColors = function (accentColor) {
|
||||
var l = (Color.toLCh(accentColor)).l;
|
||||
var c = (Color.toLCh(accentColor)).c;
|
||||
var colors = Data_Functor.map(Data_Functor.functorArray)(Color.lch(l)(c))([ 1.0, 18.0, 45.0, 68.0, 175.0, 205.0, 237.0, 331.0 ]);
|
||||
return Data_Array.zip(colorLabels)(colors);
|
||||
var accents = [ Color.lab(60.0)(10.0)(65.0), Color.lab(50.0)(50.0)(55.0), Color.lab(50.0)(65.0)(45.0), Color.lab(50.0)(65.0)(-5.0), Color.lab(50.0)(15.0)(-45.0), Color.lab(55.0)(-10.0)(-45.0), Color.lab(60.0)(-35.0)(-5.0), Color.lab(60.0)(-20.0)(65.0) ];
|
||||
return Data_Array.zip(colorLabels)(accents);
|
||||
};
|
||||
var baseLabels = [ "base03", "base02", "base01", "base00", "base0", "base1", "base2", "base3" ];
|
||||
var genBase = function (adark) {
|
||||
|
@ -10771,8 +10747,7 @@ var PS = {};
|
|||
return new AccentChanged(value0);
|
||||
};
|
||||
return AccentChanged;
|
||||
})();
|
||||
var solyellow = Color.lab(60.0)(10.0)(65.0);
|
||||
})();
|
||||
var solbase3 = Color.lab(97.0)(0.0)(10.0);
|
||||
var solbase03 = Color.lab(15.0)(-12.0)(-12.0);
|
||||
var render = function (state) {
|
||||
|
@ -10803,7 +10778,7 @@ var PS = {};
|
|||
return {
|
||||
dark: solbase03,
|
||||
light: solbase3,
|
||||
accent: solyellow
|
||||
accent: Color.lch(50.0)(100.0)(0.0)
|
||||
};
|
||||
};
|
||||
var handleAction = function (v) {
|
||||
|
|
|
@ -5,7 +5,7 @@ import Prelude
|
|||
import CSS as CSS
|
||||
import CSS.Size (px)
|
||||
import CSS.TextAlign (center, textAlign)
|
||||
import Color (Color, lab, toHexString, fromHexString)
|
||||
import Color (Color, lab, lch, toHexString, fromHexString)
|
||||
import DOM.HTML.Indexed.InputType (InputType(InputColor))
|
||||
import Data.Maybe (fromMaybe,Maybe(..))
|
||||
import Data.Tuple (Tuple(..))
|
||||
|
@ -43,7 +43,7 @@ solyellow = lab 60.0 10.0 65.0
|
|||
initialState :: forall i. i -> State
|
||||
initialState _ = { dark: solbase03
|
||||
, light: solbase3
|
||||
, accent: solyellow
|
||||
, accent: lch 50.0 100.0 0.0
|
||||
}
|
||||
|
||||
render :: forall m. State -> H.ComponentHTML Action () m
|
||||
|
|
|
@ -6,7 +6,7 @@ import Prelude
|
|||
import Data.Array (zip)
|
||||
import Data.Tuple (Tuple)
|
||||
|
||||
import Color (Color,lab,lch,toLCh,toLab)
|
||||
import Color (Color,rgb,lab,lch,toLCh,toLab)
|
||||
|
||||
-- | given the *a *b of the darkest and lightest colors
|
||||
-- generate all the CIE of the solarized needed colors
|
||||
|
@ -24,10 +24,17 @@ genBase adark bdark alight blight =
|
|||
|
||||
genColors :: Color -> Array (Tuple String Color)
|
||||
genColors accentColor =
|
||||
zip colorLabels colors
|
||||
where c = (toLCh accentColor).c
|
||||
l = (toLCh accentColor).l
|
||||
colors = map (lch l c) [1.0, 18.0, 45.0, 68.0, 175.0, 205.0, 237.0, 331.0]
|
||||
zip colorLabels accents
|
||||
where
|
||||
accents = [ lab 60.0 10.0 65.0
|
||||
, lab 50.0 50.0 55.0
|
||||
, lab 50.0 65.0 45.0
|
||||
, lab 50.0 65.0 (-5.0)
|
||||
, lab 50.0 15.0 (-45.0)
|
||||
, lab 55.0 (-10.0) (-45.0)
|
||||
, lab 60.0 (-35.0) (-5.0)
|
||||
, lab 60.0 (-20.0) 65.0
|
||||
]
|
||||
|
||||
-- | Generate a solarized-like palette given 3 colors
|
||||
-- base03, base3 and a color like yellow
|
||||
|
@ -69,14 +76,14 @@ baseLabels = [ "base03"
|
|||
, "base3"
|
||||
]
|
||||
colorLabels :: Array String
|
||||
colorLabels = [ "magenta"
|
||||
, "red"
|
||||
colorLabels = [ "yellow"
|
||||
, "orange"
|
||||
, "yellow"
|
||||
, "green"
|
||||
, "cyan"
|
||||
, "blue"
|
||||
, "red"
|
||||
, "magenta"
|
||||
, "violet"
|
||||
, "blue"
|
||||
, "cyan"
|
||||
, "green"
|
||||
]
|
||||
--
|
||||
-- paletteLabels :: [Text]
|
||||
|
|
Loading…
Reference in a new issue