vndb/mithril-vndb
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

init state, fix examples

Browse source
This commit is contained in:
Leo Horie 2016-05-15 11:14:38 -04:00
parent 5265697cb2
commit 5ec06e7c08
9 changed files with 137 additions and 20 deletions
Download patch file Download diff file Expand all files Collapse all files

34
examples/editor-bundle/index.html Normal file
View file

@ -0,0 +1,34 @@
<!doctype html>
<html>
<head>
<title>Markdown Editor</title>
<style>
html,body {height:100%;margin:0;}
h1,h2,h3,h4,h5,h6,p {margin:0 0 10px;}
#editor {display:flex;height:100%;}
.editor-input,.editor-preview {box-sizing:border-box;height:100%;margin:0;padding:10px;width:50%;}
.editor-input {border:0;border-right:1px solid #ccc;outline:none;resize:none;}
</style>
</head>
<body>
<div id="editor"></div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/marked/0.3.2/marked.min.js"></script>
<script src="../../module/module.js"></script>
<script src="../../mithril.js"></script>
<script>
var m = require("../../mithril")
var Editor = {
data: "# Markdown Editor\n\nType on the left panel and see the result on the right panel",
view: function(vnode) {
return [
m("textarea.editor-input", {oninput: function(e) {vnode.state.data = e.target.value}}, vnode.state.data),
m(".editor-preview", m.trust(marked(vnode.state.data))),
]
}
}
m.mount(document.getElementById("editor"), Editor)
</script>
</body>
</html>

43
examples/editor/index.html Normal file
View file

@ -0,0 +1,43 @@
<!doctype html>
<html>
<head>
<title>Markdown Editor</title>
<style>
html,body {height:100%;margin:0;}
h1,h2,h3,h4,h5,h6,p {margin:0 0 10px;}
#editor {display:flex;height:100%;}
.editor-input,.editor-preview {box-sizing:border-box;height:100%;margin:0;padding:10px;width:50%;}
.editor-input {border:0;border-right:1px solid #ccc;outline:none;resize:none;}
</style>
</head>
<body>
<div id="editor"></div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/marked/0.3.2/marked.min.js"></script>
<script src="../../module/module.js"></script>
<script src="../../render/node.js"></script>
<script src="../../render/hyperscript.js"></script>
<script src="../../render/render.js"></script>
<script src="../../render/trust.js"></script>
<script>
var m = require("../../render/hyperscript")
var renderer = require("../../render/render")(window)
renderer.setEventCallback(run)
var trust = require("../../render/trust")
var Editor = {
data: "# Markdown Editor\n\nType on the left panel and see the result on the right panel",
view: function(vnode) {
return [
m("textarea.editor-input", {oninput: function(e) {vnode.state.data = e.target.value}}, vnode.state.data),
m(".editor-preview", trust(marked(vnode.state.data))),
]
}
}
function run() {
renderer.render(document.getElementById("editor"), m(Editor))
}
run()
</script>
</body>
</html>

8
examples/threaditjs/app.js
View file

@ -3,8 +3,8 @@ T.time("Setup");
var request = require("../../request/request")(window, Promise).ajax
var m = require("../../render/hyperscript")
var trust = require("../../render/trust")
var render = require("../../render/render")(window, run).render
var router = require("../../router/router")(window, "#")
var renderer = require("../../render/render")(window)
var router = require("../../router/router")(window)
//API calls
var api = {
@ -178,16 +178,18 @@ var Reply = {
}
//router
renderer.setEventCallback(run)
function run() {
replayRoute()
}
var root = document.getElementById("app")
router.setPrefix("#")
var replayRoute = router.defineRoutes({
"/thread/:id" : Thread,
"/" : Home
}, function(view, args) {
render(root, [m(view, args)])
renderer.render(root, [m(view, args)])
}, function() {
router.setPath("/")
})

8
examples/todomvc/todomvc.js
View file

@ -1,6 +1,6 @@
var m = require("../../render/hyperscript")
var render = require("../../render/render")(window, run).render
var router = require("../../router/router")(window, "#")
var renderer = require("../../render/render")(window)
var router = require("../../router/router")(window)
//model
var todos = loadData()
@ -124,14 +124,16 @@ function view() {
var root = document.getElementById("todoapp")
var raf
renderer.setEventCallback(run)
function run() {
cancelAnimationFrame(raf)
raf = requestAnimationFrame(function() {
saveData()
render(root, view())
renderer.render(root, view())
})
}
router.setPrefix("#")
router.defineRoutes({
"/": "all",
"/active": "active",