forked from gtzilla/fastFrag
-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathcomplex_example.html
121 lines (101 loc) · 4.42 KB
/
complex_example.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
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" manifest="cache-manifest">
<!--
http://unlicense.org/
author: gregory tomlinson
-->
<!-- MIME TYPE Guidlines and references: http://hixie.ch/advocacy/xhtml -->
<head>
<title>fastFrag Sample 'Complex'</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="" />
<meta name="description" content="display an ordered list loaded from an external file" />
</head>
<body>
<div id="container">
<div id="top">
</div> <!-- end #top -->
<div id="middle">
</div> <!-- END #middle -->
<div id="bottom">
</div> <!-- end #bottom -->
</div> <!-- end #container -->
<script type="text/javascript" src="tests/js/quotes.js"></script>
<script type="text/javascript" src="js/fastFrag.js"></script>
<script type="text/javascript" charset="utf-8">
var results, structure, structure_items = [],
// via external file, js/quotes.js
quotes = simpson_quotes;
// add for comparison
function escaper( string ) {
return (string && string.replace(/&/mgi, "&").replace(/"/mgi, """).replace(/'/mgi, "'")
.replace(/>/mgi, ">").replace(/</mgi, "<") ) || "";
}
var quote, pos, name, text;
for( var i=0; i<quotes.length; i++) {
quote = quotes[i];
pos = quote.indexOf(":"); name = quote.substring(0,pos); text = quote.substring(pos) || "";
structure_items.push({
type : "li",
content : [{
type : "b",
content : name
}, {
'text' : text
}]
});
}
structure = [{
type : "h1",
content : "Hello fastFrag"
},{
type :"p",
content : "Welcome to the more complex example of fastFrag"
},{
css : "contentsContainer",
content : [{
type : "h3",
content : "A List of Simpsons quotes"
},{
type : "ul",
content : structure_items
},{
content : {
type : "a",
css : "simpsonslink",
content : "The Complete List",
attr : {
href : "http://blogzarro.com/2007/07/100-greatest-simpsons-quotes/",
target : 'new'
}
}
}]
},{
id : "footer",
content : [{
type : "form",
content : [{
type : "input",
id : "value_1",
attr : {
type : "checkbox",
name : "value_1",
value : "yes",
checked : true
}
},{
type : "label",
content : "Fast?",
attr : {
'for' : 'value_1'
}
}]
}]
}]
results = fastFrag.create(structure);
// in chrome or safari, middle.appendChild() works, not in FF
var middle = document.querySelector('#middle')
middle.appendChild(results);
</script>
</body>
</html>