cleanup karax project for public consumption
This commit is contained in:
parent
b22567d9e0
commit
b9aa077513
17 changed files with 577 additions and 20 deletions
171
scrollapp.nim
171
scrollapp.nim
|
|
@ -1,171 +0,0 @@
|
|||
|
||||
import vdom, karax, karaxdsl, jdict, jstrutils
|
||||
|
||||
type
|
||||
Filter = enum
|
||||
all, active, completed
|
||||
|
||||
const
|
||||
WindowSize = 50 # overestimating it does not harm
|
||||
|
||||
var
|
||||
entries: seq[(cstring, bool)]
|
||||
visibleA = 0
|
||||
visibleB = 10_000
|
||||
selectedEntry = -1
|
||||
filter: Filter
|
||||
|
||||
proc onTodoEnter(ev: Event; n: VNode) =
|
||||
entries.add((n.value, false))
|
||||
n.value = ""
|
||||
|
||||
proc removeHandler(ev: Event; n: VNode) =
|
||||
entries[n.key] = (cstring(nil), false)
|
||||
|
||||
proc editHandler(ev: Event; n: VNode) =
|
||||
selectedEntry = n.key
|
||||
|
||||
proc focusLost(ev: Event; n: VNode) = selectedEntry = -1
|
||||
|
||||
proc editEntry(ev: Event; n: VNode) =
|
||||
entries[n.key][0] = n.value
|
||||
selectedEntry = -1
|
||||
|
||||
proc toggleEntry(ev: Event; n: VNode) =
|
||||
let id = n.key
|
||||
entries[id][1] = not entries[id][1]
|
||||
|
||||
proc onAllDone(ev: Event; n: VNode) =
|
||||
entries = @[]
|
||||
selectedEntry = -1
|
||||
|
||||
proc clearCompleted(ev: Event, n: VNode) =
|
||||
for i in 0..<entries.len:
|
||||
if entries[i][1]: entries[i][0] = nil
|
||||
|
||||
proc toClass(completed: bool): cstring =
|
||||
(if completed: cstring"completed" else: cstring(nil))
|
||||
|
||||
proc toChecked(checked: bool): cstring =
|
||||
(if checked: cstring"checked" else: cstring(nil))
|
||||
|
||||
proc selected(v: Filter): cstring =
|
||||
(if filter == v: cstring"selected" else: cstring(nil))
|
||||
|
||||
when false:
|
||||
proc entry(id: int, d: cstring; completed, selected: bool): proc (): VNode =
|
||||
var lastid: type(id)
|
||||
var lastd: type(d)
|
||||
var lastCompleted: type(completed)
|
||||
var lastSelected: type(selected)
|
||||
proc inner(): VNode =
|
||||
if lastid != id or lastd != d or lastCompleted != completed or lastSelected != selected:
|
||||
result = logic(id, d, completed, selected)
|
||||
lastid = id
|
||||
lastd = d
|
||||
lastCompleted = completed
|
||||
lastSelected = selected
|
||||
|
||||
result = inner
|
||||
|
||||
proc lazyEntry(args: seq[VNode]): VNode =
|
||||
let id = args[0].intValue
|
||||
let d = args[1].text
|
||||
let completed = args[2].intValue != 0
|
||||
let selected = args[3].intValue != 0
|
||||
result = buildHtml(tr):
|
||||
li(class=toClass(completed), key = id):
|
||||
if not selected:
|
||||
tdiv(class = "view"):
|
||||
input(class = "toggle", `type` = "checkbox", checked = toChecked(completed),
|
||||
onclick=toggleEntry, key = id)
|
||||
label(onDblClick=editHandler, key = id):
|
||||
text d
|
||||
button(class = "destroy", key = id, onclick = removeHandler)
|
||||
else:
|
||||
input(class = "edit", name = "title", key = id,
|
||||
onfocusLost = focusLost,
|
||||
onenter = editEntry, value = d, setFocus)
|
||||
|
||||
proc createEntry(id: int; d: cstring; completed, selected: bool): VNode =
|
||||
result = thunk(lazyEntry, id, d, completed, selected)
|
||||
|
||||
proc myscroll(ev: Event; n: VNode) =
|
||||
kout cstring"scrolling event here"
|
||||
|
||||
proc createDom(): VNode =
|
||||
result = buildHtml(tdiv(class="todomvc-wrapper")):
|
||||
section(class = "todoapp"):
|
||||
header(class = "header"):
|
||||
h1:
|
||||
text "todos"
|
||||
input(class = "new-todo", placeholder="What needs to be done?", name = "newTodo",
|
||||
onenter = onTodoEnter, setFocus)
|
||||
section(class = "main"):
|
||||
input(class = "toggle-all", `type` = "checkbox", name = "toggle")
|
||||
label(`for` = "toggle-all", onclick = onAllDone):
|
||||
text "Mark all as complete"
|
||||
tdiv(onscroll = myscroll, style = "overflow: visible; width: 0px; display: block; max-height: 1em"):
|
||||
for i in 0..4:
|
||||
tdiv:
|
||||
text entries[i][0]
|
||||
|
||||
var entriesCount = 0
|
||||
var completedCount = 0
|
||||
ul(class = "todo-list"):
|
||||
for i in visibleA..visibleB:
|
||||
let d = entries[i]
|
||||
if d[0] != nil:
|
||||
let b = case filter
|
||||
of all: true
|
||||
of active: not d[1]
|
||||
of completed: d[1]
|
||||
if b:
|
||||
createEntry(i, d[0], d[1], i == selectedEntry)
|
||||
inc completedCount, ord(d[1])
|
||||
inc entriesCount
|
||||
footer(class = "footer"):
|
||||
span(class = "todo-count"):
|
||||
strong:
|
||||
text(&entriesCount)
|
||||
text cstring" item" & &(if entriesCount != 1: "s left" else: " left")
|
||||
ul(class = "filters"):
|
||||
li:
|
||||
anchor(class = selected(all), href = "#/"):
|
||||
text "All"
|
||||
li:
|
||||
anchor(class = selected(active), href = "#/active"):
|
||||
text "Active"
|
||||
li:
|
||||
anchor(class = selected(completed), href = "#/completed"):
|
||||
text "Completed"
|
||||
button(class = "clear-completed", onclick = clearCompleted):
|
||||
text "Clear completed (" & &completedCount & ")"
|
||||
|
||||
|
||||
when false:
|
||||
setOnscroll(proc(a, b: VKey; diff: int) =
|
||||
const
|
||||
overshoot1 = 50
|
||||
overshoot2 = 5
|
||||
if diff > 0:
|
||||
# scroll downwards:
|
||||
visibleA = max(a-overshoot2, 0)
|
||||
visibleB = min(b+diff+overshoot1, entries.len-1)
|
||||
elif diff < 0:
|
||||
# scroll upwards:
|
||||
visibleA = max(a+diff-overshoot1, 0)
|
||||
visibleB = min(b+overshoot2, entries.len-1)
|
||||
)
|
||||
|
||||
setOnHashChange(proc(hash: cstring) =
|
||||
if hash == cstring"#/": filter = all
|
||||
elif hash == cstring"#/completed": filter = completed
|
||||
elif hash == cstring"#/active": filter = active
|
||||
)
|
||||
setRenderer createDom
|
||||
|
||||
proc onload(session: cstring) {.exportc.} =
|
||||
for i in 0..visibleB:
|
||||
entries.add((cstring"Entry " & &i, false))
|
||||
init()
|
||||
Loading…
Add table
Add a link
Reference in a new issue