Skip to content

Instantly share code, notes, and snippets.

@pelonpelon

pelonpelon/index.html

Forked from anonymous/index.html
Created October 26, 2015 23:16
Show Gist options
  • Save pelonpelon/921457442979c3560f3e to your computer and use it in GitHub Desktop.
Save pelonpelon/921457442979c3560f3e to your computer and use it in GitHub Desktop.
Download ZIP
// source http://jsbin.com
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<title>Mithril experiment</title>
<meta name="description" content="mithriljs: Mithril template">
<meta charset="utf-8">
<script>
window.log = function(){
log.history = log.history || []; // store logs to an array for reference
log.history.push(arguments);
if(this.console){
console.log( Array.prototype.slice.call(arguments) );
}
};
window.dir = function(){
log.history = log.history || []; // store logs to an array for reference
log.history.push(arguments);
if(this.console){
var args = Array.prototype.slice.call(arguments)
args.map(function(a){
console.dir(a)
})
}
};
window.ref = function(){
if(this.console){
var args = Array.prototype.slice.call(arguments)
args.map(function(a){
for(o in this){
if (this[o] === o && a.toString() === "[object Object]") { log(this[o] + " :: " + JSON.stringify(a)) }
else if(this[o] === a && Array.isArray(a)) {
log(o + " :: [" + a + "]");
}
else {
if(this[o] === a) {
log(o + " :: " + a);
}
}
}
});
}
};
$ = function(sel, ctx){return (ctx || document).querySelector(sel)}
$$ = function(sel, ctx){return (ctx || document).querySelectorAll(sel)}
</script>
<!--
<script src="https://rawgit.com/lodash/lodash/3.0.1/lodash.min.js"></script>
-->
<!--
<script src="http://cdnjs.cloudflare.com/ajax/libs/mithril/0.2.0/mithril.min.js"></script>
-->
<!--modified Mithril with redraw console.logs (extensive-->
<!--
<script src="http://output.jsbin.com/gaciwi.js"></script>
-->
<!--Mithril(next) Current-->
<!--
<script src="http://output.jsbin.com/xuxase/2.js"></script>
-->
<script src="http://output.jsbin.com/gaciwi/391.js"></script>
<style id="jsbin-css">
.app {
background-color: yellow;
}
.mycomp {
background-color: lightblue;
margin: 10px;
padding: 10px;
}
</style>
</head>
<body>
<script id="jsbin-javascript">
"use strict";
var App = {};
App.controller = function (attrs) {};
App.view = function (ctrl, attrs) {
return m("div.app", ["My App", MyComp]);
};
var MyComp = {
controller: function controller() {},
view: function view() {
return m('div.mycomp', 'My Comp');
}
};
m.mount(document.body, App);
</script>
<script id="jsbin-source-html" type="text/html"><!DOCTYPE html>
<html>
<head>
<title>Mithril experiment</title>
<meta name="description" content="mithriljs: Mithril template">
<meta charset="utf-8">
<script>
window.log = function(){
log.history = log.history || []; // store logs to an array for reference
log.history.push(arguments);
if(this.console){
console.log( Array.prototype.slice.call(arguments) );
}
};
window.dir = function(){
log.history = log.history || []; // store logs to an array for reference
log.history.push(arguments);
if(this.console){
var args = Array.prototype.slice.call(arguments)
args.map(function(a){
console.dir(a)
})
}
};
window.ref = function(){
if(this.console){
var args = Array.prototype.slice.call(arguments)
args.map(function(a){
for(o in this){
if (this[o] === o && a.toString() === "[object Object]") { log(this[o] + " :: " + JSON.stringify(a)) }
else if(this[o] === a && Array.isArray(a)) {
log(o + " :: [" + a + "]");
}
else {
if(this[o] === a) {
log(o + " :: " + a);
}
}
}
});
}
};
$ = function(sel, ctx){return (ctx || document).querySelector(sel)}
$$ = function(sel, ctx){return (ctx || document).querySelectorAll(sel)}
<\/script>
<\!--
<script src="https://rawgit.com/lodash/lodash/3.0.1/lodash.min.js"><\/script>
-->
<\!--
<script src="//cdnjs.cloudflare.com/ajax/libs/mithril/0.2.0/mithril.min.js"><\/script>
-->
<\!--modified Mithril with redraw console.logs (extensive-->
<\!--
<script src="http://output.jsbin.com/gaciwi.js"><\/script>
-->
<\!--Mithril(next) Current-->
<\!--
<script src="http://output.jsbin.com/xuxase/2.js"><\/script>
-->
<script src="http://output.jsbin.com/gaciwi/391.js"><\/script>
</head>
<body>
</body>
</html></script>
<script id="jsbin-source-css" type="text/css">.app {
background-color: yellow;
}
.mycomp {
background-color: lightblue;
margin: 10px;
padding: 10px;
}</script>
<script id="jsbin-source-javascript" type="text/javascript">var App = {}
App.controller = function (attrs) {
}
App.view = function (ctrl, attrs) {
return m("div.app", [
"My App",
MyComp
])
}
var MyComp = {
controller: function(){
},
view: function(){
return m('div.mycomp', 'My Comp')
}
}
m.mount(document.body, App)</script></body>
</html>
Raw
jsbin.untitled.css
.app {
background-color: yellow;
}
.mycomp {
background-color: lightblue;
margin: 10px;
padding: 10px;
}
Raw
jsbin.untitled.js
"use strict";
var App = {};
App.controller = function (attrs) {};
App.view = function (ctrl, attrs) {
return m("div.app", ["My App", MyComp]);
};
var MyComp = {
controller: function controller() {},
view: function view() {
return m('div.mycomp', 'My Comp');
}
};
m.mount(document.body, App);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment