-
Notifications
You must be signed in to change notification settings - Fork 0
/
viewmodel-demo.html
122 lines (105 loc) · 4.31 KB
/
viewmodel-demo.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
122
<head>
<title>viewmodel-demo</title>
</head>
<body>
{{>myForm shared="pages"}}
</body>
<template name="myForm">
{{>textInput shared="pages" ss="title" val=(b "value: formData.title") style="width:40%;background:red;float:left"}}
{{>textInput shared="pages" ss="url" val=(b "value: formData.url") style="width:40%;background:red;float:left"}}
{{>checkInput shared="pages" ss="active" val=(b "check: formData.active") style="width:20%;background:red;float:left"}}
{{>textareaInput shared="pages" ss="body" val=(b "value: formData.body") style="background:red;"}}
{{> dynamicCompsForm shared="pages"}}
<button {{b "click: submit"}}>submit</button>
</template>
<template name="dynamicCompsForm">
{{#each formData.layout}}
<hr />
<b>{{this.item}}</b>
<button type="button" {{b "click: delete(this._id)"}}>Del</button>
{{>Template.dynamic template=this.item data=this}}
<hr />
{{/each}}
<div class="">
<button type="button" {{b "click: add('hero')"}}>Add Hero</button>
<button type="button" {{b "click: add('billboard')"}}>Add Billboard</button>
</div>
</template>
<template name="textInput">
<div class="{{class}}" style="{{style}}">
<div style="padding:5px">
<label>{{ssLabel ss}}</label>
<!-- <input {{b "value: ssDefaultValue(val(field))"}} type="text" style="width: 100%;box-sizing: border-box;"> -->
<input {{val}} type="text" style="width: 100%;box-sizing: border-box;">
</div>
</div>
</template>
<template name="checkInput">
<div class="{{class}}" style="{{style}}">
<div style="padding:5px">
<label for="check-{{ss}}">{{ssLabel ss}}</label><br />
<input {{val}} {{name}} type="checkbox" id="check-{{ss}}" />
</div>
</div>
</template>
<template name="textareaInput">
<div class="{{class}}" style="{{style}}">
<div style="padding:5px">
<label>{{ssLabel ss}}</label>
<textarea {{val}} style="width: 100%;box-sizing: border-box;" cols="40"></textarea>
</div>
</div>
</template>
<template name="hero">
<div>
{{>textInput shared="pages" ss="layout.$.hero.title" val=(b "value: this.hero.title") style=""}}
{{>textInput shared="pages" ss="layout.$.hero.alignment" val=(b "value: this.hero.alignment") style=""}}
</div>
</template>
<template name="billboard">
<div>
{{>textInput shared="pages" ss="layout.$.billboard.title" val=(b "value: this.billboard.title") style=""}}
{{>textInput shared="pages" ss="layout.$.billboard.background" val=(b "value: this.billboard.background") style=""}}
</div>
</template>
<!-- <template name="demoVM">
<input {{b "value: val()"}} type="text" style="width: 100%;box-sizing: border-box;"> -->
<!-- {{#basicForm shared="pages"}}
{{>textInput field="title" shared="pages" style="width:50%;background:red;float:left"}}
{{>textInput field="test.test2" shared="pages" style="width:50%;background:red;float:left"}}
{{>textareaInput field="body" shared="pages" style="width:100%;background:red;display:inline-block"}}
-->
<!-- {{#dynamicForm field="layout" shared="pages"}} -->
<!-- <button {{b "click: add('hero','layout.$.hero')"}}>Add Hero</button> -->
<!-- <button {{b "click: add('billboard','layout.$.billboard')"}}>Add Billboard</button> -->
<!-- {{/dynamicForm}} -->
<!-- {{/basicForm}} -->
<!-- </template> -->
<template name="basicForm">
<form id="hellojames">
<div id="name">
{{> UI.contentBlock data=this context=this}}
</div>
<button {{b "click: submit"}}>submit</button>
</form>
</template>
<template name="dynamicForm">
<button {{b "click: add('hero','layout.$.hero')"}}>Add Hero</button>
<button {{b "click: add('billboard','layout.$.billboard')"}}>Add Billboard</button>
<!-- {{> UI.contentBlock data=child context=child}} -->
<ul>
{{#each collection}}
{{> arrayItem}}
{{/each}}
</ul>
</template>
<template name="arrayItem">
<li>
<hr />
{{_id}}
<button {{b "click: delete"}}>Del</button>
<button {{b "click: save(item)"}}>Save</button>
{{>Template.dynamic template=item data=(getData(this)) }}
<hr />
</li>
</template>