Mercurial > templog

comparison web/views/set.tpl @ 183:177f616893e6

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
param editor roughly working
author Matt Johnston <matt@ucc.asn.au>
date Tue, 04 Feb 2014 23:39:06 +0800
parents e731c0d30b09
children cbe14244a372
comparison
equal deleted inserted replaced
182:e731c0d30b09 183:177f616893e6
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> 2 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
3 <head> 3 <head>
4 <script src="jquery-2.1.0.js"></script> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
5 <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=8,minimum-scale=0.1">
6 <script src="jquery-2.1.0.min.js"></script>
5 <script> 7 <script>
6 %include riot.min.js 8 %include riot.min.js
7 </script> 9 </script>
8 10
9 <style type="text/css"> 11 <style type="text/css">
58 </head> 60 </head>
59 61
60 <body> 62 <body>
61 63
62 <section id="paramlist"> 64 <section id="paramlist">
65 </section>
66
67 <div id="jsontest">
63 </div> 68 </div>
69
70 <input type="button" id="savebutton" value="Save"/>
64 71
65 </body> 72 </body>
66 73
67 <script type="html/num_input"> 74 <script type="html/num_input">
68 <div id="{id}"> 75 <div id="{id}">
69 <span class="existing">{title} <span id="existing_{name}">{oldvalue}</span>{unit}</span> 76 <span class="existing">{title} <span id="existing_{name}">{oldvalue}</span>{unit}</span>
70 <br/> 77 <br/>
71 <input type="text" id="input" name="input_{name}" /> 78 <input type="text" class="input" name="input_{name}" />
72 <!-- 79 <input type="button" class="button_down" value="-"/>
73 <input type="button" class="button_down" id="down" name="down_{name}" value="-" "/> 80 <input type="button" class="button_up" value="+"/>
74 <input type="button" class="button_up" id="up" name="up_{name}" value="+" "/>
75 -->
76 </div> 81 </div>
77 </script> 82 </script>
78 83
79 <script type="html/yesno_button"> 84 <script type="html/yesno_button">
80 <div id="{id}"> 85 <div id="{id}">
81 <span class="existing">{title} <span id="existing_{name}">{oldvalue}</span></span> 86 <span class="existing">{title} <span id="existing_{name}">{oldvalue}</span></span>
82 <br/> 87 <br/>
83 <input type="button" class="button_no" id="no_{name}" name="no_{name}" value="No"/> 88 <input type="button" class="button_no" value="No"/>
84 <input type="button" class="button_yes" id="yes_{name}" name="yes_{name}" value="Yes"/> 89 <input type="button" class="button_yes" value="Yes"/>
85 </div> 90 </div>
86 </script> 91 </script>
87 92
88 <script> 93 <script>
89 94
92 97
93 self.params = params; 98 self.params = params;
94 99
95 $.each(self.params, function(idx, param) { 100 $.each(self.params, function(idx, param) {
96 param.id = "param_id_" + idx; 101 param.id = "param_id_" + idx;
102 param.oldvalue = param.value;
97 }); 103 });
98 104
99 self.edit = function(param) { 105 self.edit = function(param) {
100 params[param.name] = param; 106 params[param.name] = param;
101 self.trigger("edit", param); 107 self.trigger("edit", param);
102 } 108 }
103 109
104 self.adjust = function(param, updown) { 110 self.adjust = function(param, updown) {
105 // XXX increment 111 // XXX increment
112 param.value += (param.amount*updown);
106 self.trigger("edit", param); 113 self.trigger("edit", param);
107 } 114 }
108 115
116 self.save = function() {
117 var j = JSON.stringify(self.params);
118 self.trigger("saved", j)
119 }
109 } 120 }
110 121
111 (function() { 'use strict'; 122 (function() { 'use strict';
112 123
113 var params = {{!inline_data}}; 124 var params = {{!inline_data}};
117 128
118 var number_template = $("[type='html/num_input']").html(); 129 var number_template = $("[type='html/num_input']").html();
119 var button_template = $("[type='html/yesno_button']").html(); 130 var button_template = $("[type='html/yesno_button']").html();
120 131
121 setter.on("add", add); 132 setter.on("add", add);
133
122 setter.on("edit", function(param) 134 setter.on("edit", function(param)
123 { 135 {
124 var el = $("#" + param.id); 136 var el = $("#" + param.id);
125 if (param.kind === "number") 137 if (param.kind === "number")
126 { 138 {
127 $(".input", el).text(param.value).value(param.value); 139 set_text_state(el, param.value);
128 } 140 }
129 else if (param.kind === "yesno") 141 else if (param.kind === "yesno")
130 { 142 {
131 set_state(el, param.value); 143 set_button_state(el, param.value);
132 } 144 }
133 }) 145 });
146
147 setter.on("saved", function(j) {
148 $("#jsontest").text(j);
149 });
150
151
134 152
135 $.route(function(hash) { 153 $.route(function(hash) {
136 154
137 // clear list and add new ones 155 // clear list and add new ones
138 root.empty() && $.each(setter.params, function (idx, p) { 156 root.empty() && $.each(setter.params, function (idx, p) {
139 add(p); 157 add(p);
158
159 $("#savebutton").click(function() {
160 setter.save();
161 })
140 }) 162 })
141 }) 163 })
142 164
143 function set_state(el, value) 165 function set_text_state(el, value)
166 {
167 var input = $(".input", el);
168 input.text(value).val(value)
169 }
170
171 function set_button_state(el, value)
144 { 172 {
145 var button_yes = $(".button_yes", el); 173 var button_yes = $(".button_yes", el);
146 var button_no = $(".button_no", el); 174 var button_no = $(".button_no", el);
147 if (value) 175 if (value)
148 { 176 {
160 { 188 {
161 if (param.kind === "number") 189 if (param.kind === "number")
162 { 190 {
163 var el = $($.render(number_template, param)).appendTo(root); 191 var el = $($.render(number_template, param)).appendTo(root);
164 var input = $(".input", el); 192 var input = $(".input", el);
193
194 input.keyup(function(e) {
195 if (e.which == 13)
196 {
197 param.value = Number(this.value);
198 setter.edit(param);
199 }
200 });
201
202 $(".button_up", el).click(function() {
203 setter.adjust(param, 1);
204 });
205 $(".button_down", el).click(function() {
206 setter.adjust(param, -1);
207 });
208
209 set_text_state(el, param.value);
165 } 210 }
166 else if (param.kind === "yesno") 211 else if (param.kind === "yesno")
167 { 212 {
168 var el = $($.render(button_template, param)).appendTo(root); 213 var el = $($.render(button_template, param)).appendTo(root);
169 var button_yes = $(".button_yes", el); 214 var button_yes = $(".button_yes", el);
177 button_no.click(function() { 222 button_no.click(function() {
178 param.value = false; 223 param.value = false;
179 setter.edit(param); 224 setter.edit(param);
180 }) 225 })
181 226
182 set_state(el, param.value); 227 set_button_state(el, param.value);
183 } 228 }
184 } 229 }
185 230
186 })() 231 })()
187 232