alex/restaurant-search
1
Fork 0
Code Releases Activity

Templating work

Browse Source
This commit is contained in:
Alex Yatskov 2015-03-02 15:42:02 +09:00
parent df9e311f2b
commit f9e44e044f
2 changed files with 66 additions and 34 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

44
client/profile.html
View File

@ -25,37 +25,37 @@
<th class="text-right">Rating</th> <th class="text-right">Rating</th>
</tr> </tr>
</thead> </thead>
<tbody id="categories"> <tbody id="categories"></tbody>
<script id="template" type="text/x-handlers-template"> <script id="template" type="text/x-handlers-template">
{{#each categories}} {{#each categories}}
<tr> <tr>
<td class="text-left">{{description}}</td> <td class="text-left">{{description}}</td>
<td class="text-right"> <td class="text-right">
<label class="radio-inline"> <label class="radio-inline">
<input type="radio" name="category_{{id}}" value="1" {{checkMatch 1}}> Agree <input type="radio" name="category_{{@key}}" categoryId="{{@key}}" value="1" {{checkMatch 1}}> Agree
</label> </label>
<label class="radio-inline"> <label class="radio-inline">
<input type="radio" name="category_{{id}}" value="0" {{checkMatch 0}}> Neither <input type="radio" name="category_{{@key}}" categoryId="{{@key}}" value="0" {{checkMatch 0}}> Neither
</label> </label>
<label class="radio-inline"> <label class="radio-inline">
<input type="radio" name="category_{{id}}" value="-1" {{checkMatch -1}}> Disagree <input type="radio" name="category_{{@key}}" categoryId="{{@key}}" value="-1" {{checkMatch -1}}> Disagree
</label> </label>
</td> </td>
</tr> </tr>
{{/each}} {{/each}}
</script> </script>
</tbody>
</table> </table>
<!-- category adder --> <!-- category adder -->
<div class="input-group"> <div class="input-group">
<input type="text" class="form-control" placeholder="New category description"> <input type="text" class="form-control" id="newCategory" placeholder="New category description">
<span class="input-group-btn"> <span class="input-group-btn">
<button class="btn btn-primary"><span class="glyphicon glyphicon-plus"></span></button> <button class="btn btn-primary" id="addCategory"><span class="glyphicon glyphicon-plus"></span></button>
</span> </span>
</div> </div>
</div> </div>
<script src="bower_components/jquery/dist/jquery.js"></script> <script src="bower_components/jquery/dist/jquery.js"></script>
<script src="bower_components/handlebars/handlebars.js"></script> <script src="bower_components/handlebars/handlebars.js"></script>
<script src="bower_components/underscore/underscore.js"></script> <script src="bower_components/underscore/underscore.js"></script>

56
client/scripts/profile.js
View File

@ -20,29 +20,61 @@
* CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. * CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*/ */
(function(hscd) { (function(categories) {
'use strict'; 'use strict';
function displayCategories(categories) { function guid() {
function s4() {
return Math.floor((1 + Math.random()) * 0x10000).toString(16).substring(1);
}
return s4() + s4() + '-' + s4() + '-' + s4() + '-' + s4() + '-' + s4() + s4() + s4();
}
function transmitCategories() {
console.log(categories);
}
function displayCategories() {
var template = Handlebars.compile($('#template').html()); var template = Handlebars.compile($('#template').html());
$('#categories').empty(); $('#categories').empty();
$('#categories').append(template({categories: categories})); $('#categories').append(template({categories: categories}));
$('#categories input:radio').change(function() {
categories[$(this).attr('categoryId')].value = parseInt(this.value);
transmitCategories();
});
}
function addCategory(description) {
description = description.trim();
if (!description) {
return;
}
categories[guid()] = {description: description, value: 0};
transmitCategories();
displayCategories();
} }
function onReady() { function onReady() {
Handlebars.registerHelper('checkMatch', function(value, options) { Handlebars.registerHelper('checkMatch', function(value, options) {
return new Handlebars.SafeString( return new Handlebars.SafeString(value == this.value ? 'checked' : '');
value == this.value ? 'checked' : ''
);
}); });
var categories = [ categories = {
{description: 'Description1', id: 0, value: -1}, 0: {description: 'Description1', value: -1},
{description: 'Description2', id: 1, value: 0}, 1: {description: 'Description2', value: 0},
{description: 'Description3', id: 2, value: 1}, 2: {description: 'Description3', value: 1},
]; };
displayCategories(categories); $('#addCategory').click(function() {
addCategory($('#newCategory').val());
});
displayCategories();
} }
$(document).on({ $(document).on({
@ -50,4 +82,4 @@
ajaxStop: function() { $('#spinner').hide(); }, ajaxStop: function() { $('#spinner').hide(); },
ready: onReady() ready: onReady()
}); });
})(); })(window.categories = window.categories || {});