reworked event handling again; added scrollapp example
This commit is contained in:
parent
5bc7d4e336
commit
686ad23f2f
12 changed files with 273 additions and 225 deletions
15
examples/scrollapp/scrollapp.html
Normal file
15
examples/scrollapp/scrollapp.html
Normal file
|
|
@ -0,0 +1,15 @@
|
|||
<!DOCTYPE html>
|
||||
|
||||
<html>
|
||||
<head>
|
||||
<title>Todo app</title>
|
||||
</head>
|
||||
|
||||
<body id="body">
|
||||
|
||||
<div id="ROOT" />
|
||||
|
||||
<script type="text/javascript" src="nimcache/scrollapp.js"></script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
24
examples/scrollapp/scrollapp.nim
Normal file
24
examples/scrollapp/scrollapp.nim
Normal file
|
|
@ -0,0 +1,24 @@
|
|||
## Example that shows how to accomplish an "infinitely scrolling" app.
|
||||
|
||||
include karaxprelude
|
||||
import jstrutils, dom
|
||||
|
||||
var entries: seq[cstring] = @[]
|
||||
for i in 1..500:
|
||||
entries.add(cstring("Entry ") & &i)
|
||||
|
||||
proc scrollEvent(ev: Event; n: VNode) =
|
||||
let d = n.dom
|
||||
if d != nil and inViewport(d.lastChild):
|
||||
# "load" more data:
|
||||
for i in 1..50:
|
||||
entries.add(cstring("Loaded Entry ") & &i)
|
||||
|
||||
proc createDom(): VNode =
|
||||
result = buildHtml():
|
||||
tdiv(onscroll=scrollEvent, style="height: 400px; overflow: scroll"):
|
||||
for x in entries:
|
||||
tdiv:
|
||||
text x
|
||||
|
||||
setRenderer createDom
|
||||
1
examples/scrollapp/scrollapp.nims
Normal file
1
examples/scrollapp/scrollapp.nims
Normal file
|
|
@ -0,0 +1 @@
|
|||
--path: "../../src"
|
||||
Loading…
Add table
Add a link
Reference in a new issue