-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
101 lines (89 loc) · 3.6 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>mimi-testing battle field</title>
<script type="text/javascript" src="src/mimi.js"></script>
<script type="text/javascript" src="src/mimi.cherry.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/mustache.js/2.1.2/mustache.min.js"></script>
</head>
<body>
<h1>The content below changes</h1>
<div id="container"></div>
<div id="foo" class="test">Foo container</div>
<script>
var app = MimiJS({mode: 'hash'});
app.factory("ProductView",['$mi', '$http', function(mi, $http) {
console.log("ProductView", $http);
$http.get('url: //www.google.com', function() {
console.log('onload')
}, function() {
console.log('on error')
})
return {
render: function(id, data) {
var output = Mustache.render("<ul> {{#stooges}} <li><button class='button'>{{name}}</button></li>{{/stooges}}</ul> ", data);
document.getElementById(id).innerHTML = output;
}
}
}]).factory("ProductService", function() {
console.log(this)
return {
get: function() {
return {
"stooges": [
{ "name": "Moe" },
{ "name": "Larry" },
{ "name": "Curly" }
]
};
}
}
});
app.controller("HomeController", function(){
console.log("this is home controller");
}).controller("DefaultController", function() {
console.log("this is default controller");
}).controller("ProductController", ["$mi", "$observer", "ProductService", "ProductView", "$http", function(mi, observer, service, view, $http) {
console.log('$http', $http);
console.log("ProductController - mi", mi)
var data = service.get();
view.render("container", data);
$("#container").hide();
}])
app.routes("home/", "HomeController")
// .routes("/products\/(.*)/", "ProductController")
.routes("products/:id/", "ProductController")
.routes(function() {
var data = { "stooges": [
{ "name": "Moe" },
{ "name": "Larry" },
{ "name": "Curly" },
{ "name": "Moe" },
{ "name": "Larry" },
{ "name": "Curly" }
]};
var output = Mustache.render("<ul> {{#stooges}} <li><a href='#/products/12'>{{name}}</a></li>{{/stooges}}</ul> ", data);
document.getElementById("container").innerHTML = output;
console.log("default routing", this)
});
var res = app.resolve(["HomeController", "DefaultController"], function() {
console.log("this", this.DefaultController);
})("test");
console.log("foo", $("#foo").addClass("bar").addClass("barbar").hasClass("barbar"))
console.log("foo", $("#foo").toggleClass("barbar").hasClass("barbar"))
console.log("foo", $("#foo").toggleClass("barbar").hasClass("barbar"))
console.log("foo", $("#foo").toggleClass("barbar").hasClass("barbar"))
var d = document.createElement("div");
var p = document.createElement("p");
p.appendChild(document.createTextNode("11111"));
p.setAttribute("class", "foobar-child");
d.appendChild(p);
d.setAttribute("class", "foobar");
document.body.appendChild(d);
$(".foobar-child").remove();
// var b = $("#foo");
// console.log("b", b.hasClass("test"))
</script>
</body>
</html>