Skip to content

Instantly share code, notes, and snippets.

@Heimdell

Heimdell/TodoList.elm

Created December 25, 2014 18:31
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save Heimdell/054b6f9bc7f70927df53 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save Heimdell/054b6f9bc7f70927df53 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
TodoList.elm
type Application =
{ style : Size
, current : Int
, list : TodoList
}
type Size =
{ elem : { width : Int, height : Int }
}
type TodoList = { tasks : [Task], last : Int }
type Task =
{ number : Int
, status : Status
, header : Header
, priority : Int
}
data Status
= Done
| Doing
| WillDo
| WontDo
type Header = String
add : Task -> TodoList -> TodoList
add task list =
let next = list.last + 1
task' = { task | number <- next }
tasks = sortBy (.priority) (task' :: list.tasks)
in { list
| last <- next
, tasks <- tasks
}
modifyAt : (Task -> Task) -> Int -> TodoList -> TodoList
modifyAt action index todos =
case breakAt index todos.tasks of
(before, it :: after) ->
{ todos
| tasks <- sortBy (.priority)
<| concat [before, [action it], after]
}
_ ->
todos
delete : Int -> TodoList -> TodoList
delete index list =
case breakAt index list.tasks of
(before, _ :: after) ->
{ list
| tasks <- concat [before, after]
}
_ ->
list
breakAt : Int -> [a] -> ([a], [a])
breakAt n xs =
case (n, xs) of
(0, xs) -> ([], xs)
(_, []) -> ([], [])
(n, x :: xs) ->
let ( ys, zs) = breakAt (n - 1) xs
in (x :: ys, zs)
viewApplication : Application -> Element
viewApplication app =
let count = length app.list.tasks
height = app.style.elem.height
width = app.style.elem.width
selected = app.current
status : Task -> Element
status task =
let square color text =
label color (solid white) height height text
in case task.status of
Done -> square green "V"
Doing -> square white "."
WillDo -> square yellow "~"
WontDo -> square red "X"
header : Task -> Element
header x =
label lightGray (solid white) (width - 2 * height) height
x.header
priority : Task -> Element
priority x =
let invert = 255 - x.priority
color = rgb 255 invert invert
in label color (solid white) height height ""
showElem task =
collage width height
[ toForm <| flow right
[ status task
, header task
, priority task
]
]
in flow down <| map showElem app.list.tasks
label : Color -> LineStyle -> Int -> Int -> String -> Element
label color outline w' h' text =
let [w, h] = map toFloat [w', h']
form = rect w h
in collage w' h'
[ filled color form
, outlined outline form
, toForm <| plainText text
]
main = viewApplication
{ style =
{ elem =
{ width = 200, height = 20 }
}
, list =
{ tasks =
[ { number = 0, status = Done, header = "Rest a bit", priority = 42 }
, { number = 1, status = WillDo, header = "Rest a bit more", priority = 43 }
, { number = 2, status = Doing, header = "Eat", priority = 70 }
, { number = 3, status = WontDo, header = "Work", priority = 2 }
]
, last = 4
}
, current = 4
}
Raw
TodoList.html
<!DOCTYPE HTML>
<html><head><meta charset="UTF-8"><title>List</title><script type="text/javascript" src="/home/kir/.cabal/share/i386-linux-ghc-7.8.2/Elm-0.12.3/elm-runtime.js"></script><script type="text/javascript">Elm.Main = Elm.Main || {};
Elm.Main.make = function (_elm) {
"use strict";
_elm.Main = _elm.Main || {};
if (_elm.Main.values)
return _elm.Main.values;
var _op = {},
_N = Elm.Native,
_U = _N.Utils.make(_elm),
_L = _N.List.make(_elm),
_A = _N.Array.make(_elm),
_E = _N.Error.make(_elm),
$moduleName = "Main",
$Basics = Elm.Basics.make(_elm),
$Color = Elm.Color.make(_elm),
$Graphics$Collage = Elm.Graphics.Collage.make(_elm),
$Graphics$Element = Elm.Graphics.Element.make(_elm),
$List = Elm.List.make(_elm),
$Text = Elm.Text.make(_elm);
var label = F5(function (color,
outline,
w$,
h$,
text) {
return function () {
var _ = A2($List.map,
$Basics.toFloat,
_L.fromArray([w$,h$]));
var h = function () {
switch (_.ctor)
{case "::": switch (_._1.ctor)
{case "::":
switch (_._1._1.ctor)
{case "[]": return _._1._0;}
break;}
break;}
_E.Case($moduleName,
"on line 113, column 18 to 38");
}();
var w = function () {
switch (_.ctor)
{case "::": switch (_._1.ctor)
{case "::":
switch (_._1._1.ctor)
{case "[]": return _._0;}
break;}
break;}
_E.Case($moduleName,
"on line 113, column 18 to 38");
}();
var form = A2($Graphics$Collage.rect,
w,
h);
return A3($Graphics$Collage.collage,
w$,
h$,
_L.fromArray([A2($Graphics$Collage.filled,
color,
form)
,A2($Graphics$Collage.outlined,
outline,
form)
,$Graphics$Collage.toForm($Text.plainText(text))]));
}();
});
var viewApplication = function (app) {
return function () {
var width = app.style.elem.width;
var height = app.style.elem.height;
var status = function (task) {
return function () {
var square = F2(function (color,
text) {
return A5(label,
color,
$Graphics$Collage.solid($Color.white),
height,
height,
text);
});
return function () {
var _v10 = task.status;
switch (_v10.ctor)
{case "Doing": return A2(square,
$Color.white,
".");
case "Done": return A2(square,
$Color.green,
"V");
case "WillDo": return A2(square,
$Color.yellow,
"~");
case "WontDo": return A2(square,
$Color.red,
"X");}
_E.Case($moduleName,
"between lines 83 and 89");
}();
}();
};
var header = function (x) {
return A5(label,
$Color.lightGray,
$Graphics$Collage.solid($Color.white),
width - 2 * height,
height,
x.header);
};
var priority = function (x) {
return function () {
var invert = 255 - x.priority;
var color = A3($Color.rgb,
255,
invert,
invert);
return A5(label,
color,
$Graphics$Collage.solid($Color.white),
height,
height,
"");
}();
};
var showElem = function (task) {
return A3($Graphics$Collage.collage,
width,
height,
_L.fromArray([$Graphics$Collage.toForm(A2($Graphics$Element.flow,
$Graphics$Element.right,
_L.fromArray([status(task)
,header(task)
,priority(task)])))]));
};
var count = $List.length(app.list.tasks);
return $Graphics$Element.flow($Graphics$Element.down)(A2($List.map,
showElem,
app.list.tasks));
}();
};
var breakAt = F2(function (n,
xs) {
return function () {
var _v11 = {ctor: "_Tuple2"
,_0: n
,_1: xs};
switch (_v11.ctor)
{case "_Tuple2":
switch (_v11._0)
{case 0: return {ctor: "_Tuple2"
,_0: _L.fromArray([])
,_1: _v11._1};}
switch (_v11._1.ctor)
{case "::": return function () {
var $ = A2(breakAt,
_v11._0 - 1,
_v11._1._1),
ys = $._0,
zs = $._1;
return {ctor: "_Tuple2"
,_0: A2($List._op["::"],
_v11._1._0,
ys)
,_1: zs};
}();
case "[]":
return {ctor: "_Tuple2"
,_0: _L.fromArray([])
,_1: _L.fromArray([])};}
break;}
_E.Case($moduleName,
"between lines 65 and 70");
}();
});
var $delete = F2(function (index,
list) {
return function () {
var _v16 = A2(breakAt,
index,
list.tasks);
switch (_v16.ctor)
{case "_Tuple2":
switch (_v16._1.ctor)
{case "::":
return _U.replace([["tasks"
,$List.concat(_L.fromArray([_v16._0
,_v16._1._1]))]],
list);}
break;}
return list;
}();
});
var modifyAt = F3(function (action,
index,
todos) {
return function () {
var _v21 = A2(breakAt,
index,
todos.tasks);
switch (_v21.ctor)
{case "_Tuple2":
switch (_v21._1.ctor)
{case "::":
return _U.replace([["tasks"
,$List.sortBy(function (_) {
return _.priority;
})($List.concat(_L.fromArray([_v21._0
,_L.fromArray([action(_v21._1._0)])
,_v21._1._1])))]],
todos);}
break;}
return todos;
}();
});
var add = F2(function (task,
list) {
return function () {
var next = list.last + 1;
var task$ = _U.replace([["number"
,next]],
task);
var tasks = A2($List.sortBy,
function (_) {
return _.priority;
},
A2($List._op["::"],
task$,
list.tasks));
return _U.replace([["last",next]
,["tasks",tasks]],
list);
}();
});
var WontDo = {ctor: "WontDo"};
var WillDo = {ctor: "WillDo"};
var Doing = {ctor: "Doing"};
var Done = {ctor: "Done"};
var main = viewApplication({_: {}
,current: 4
,list: {_: {}
,last: 4
,tasks: _L.fromArray([{_: {}
,header: "Rest a bit"
,number: 0
,priority: 42
,status: Done}
,{_: {}
,header: "Rest a bit more"
,number: 1
,priority: 43
,status: WillDo}
,{_: {}
,header: "Eat"
,number: 2
,priority: 70
,status: Doing}
,{_: {}
,header: "Work"
,number: 3
,priority: 2
,status: WontDo}])}
,style: {_: {}
,elem: {_: {}
,height: 20
,width: 200}}});
var Task = F4(function (a,
b,
c,
d) {
return {_: {}
,header: c
,number: a
,priority: d
,status: b};
});
var TodoList = F2(function (a,
b) {
return {_: {}
,last: b
,tasks: a};
});
var Size = function (a) {
return {_: {},elem: a};
};
var Application = F3(function (a,
b,
c) {
return {_: {}
,current: b
,list: c
,style: a};
});
_elm.Main.values = {_op: _op
,Done: Done
,Doing: Doing
,WillDo: WillDo
,WontDo: WontDo
,add: add
,modifyAt: modifyAt
,$delete: $delete
,breakAt: breakAt
,viewApplication: viewApplication
,label: label
,main: main};
return _elm.Main.values;
};</script></head><body><script type="text/javascript">Elm.fullscreen(Elm.Main)</script><noscript></noscript></body></html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment