|
11 | 11 |
|
12 | 12 | /* global tmpl */ |
13 | 13 |
|
14 | | -;(function () { |
| 14 | +/* eslint-disable strict */ |
| 15 | + |
| 16 | +;(function() { |
15 | 17 | 'use strict' |
16 | 18 |
|
17 | 19 | var templateInput = document.getElementById('template') |
|
20 | 22 | var templateDemoNode = document.getElementById('tmpl-demo') |
21 | 23 | var templateDataNode = document.getElementById('tmpl-data') |
22 | 24 |
|
23 | | - function renderError (title, error) { |
24 | | - resultNode.innerHTML = tmpl( |
25 | | - 'tmpl-error', |
26 | | - {title: title, error: error} |
27 | | - ) |
| 25 | + /** |
| 26 | + * Renders error messages |
| 27 | + * |
| 28 | + * @param {string} title Error title |
| 29 | + * @param {Error} error Error object |
| 30 | + */ |
| 31 | + function renderError(title, error) { |
| 32 | + resultNode.innerHTML = tmpl('tmpl-error', { title: title, error: error }) |
28 | 33 | } |
29 | 34 |
|
30 | | - function render (event) { |
| 35 | + /** |
| 36 | + * Renders the templating result |
| 37 | + * |
| 38 | + * @param {event} event Click event |
| 39 | + */ |
| 40 | + function render(event) { |
31 | 41 | event.preventDefault() |
32 | 42 | var data |
33 | 43 | try { |
|
37 | 47 | return |
38 | 48 | } |
39 | 49 | try { |
40 | | - resultNode.innerHTML = tmpl( |
41 | | - templateInput.value, |
42 | | - data |
43 | | - ) |
| 50 | + resultNode.innerHTML = tmpl(templateInput.value, data) |
44 | 51 | } catch (e) { |
45 | 52 | renderError('Template rendering failed', e) |
46 | 53 | } |
47 | 54 | } |
48 | 55 |
|
49 | | - function empty (node) { |
| 56 | + /** |
| 57 | + * Removes all child elements from a Node |
| 58 | + * |
| 59 | + * @param {HTMLElement} node HTML element node |
| 60 | + */ |
| 61 | + function empty(node) { |
50 | 62 | while (node.lastChild) { |
51 | 63 | node.removeChild(node.lastChild) |
52 | 64 | } |
53 | 65 | } |
54 | 66 |
|
55 | | - function init (event) { |
| 67 | + /** |
| 68 | + * Initialization function |
| 69 | + * |
| 70 | + * @param {event} [event] Initialixation event |
| 71 | + */ |
| 72 | + function init(event) { |
56 | 73 | if (event) { |
57 | 74 | event.preventDefault() |
58 | 75 | } |
59 | | - templateInput.value = templateDemoNode.innerHTML.trim() |
60 | | - dataInput.value = templateDataNode.innerHTML.trim() |
| 76 | + templateInput.value = templateDemoNode.innerHTML |
| 77 | + dataInput.value = JSON.stringify( |
| 78 | + JSON.parse(templateDataNode.innerHTML), |
| 79 | + null, |
| 80 | + 2 |
| 81 | + ) |
61 | 82 | empty(resultNode) |
62 | 83 | } |
63 | 84 |
|
64 | 85 | document.getElementById('render').addEventListener('click', render) |
65 | 86 | document.getElementById('reset').addEventListener('click', init) |
66 | 87 |
|
67 | 88 | init() |
68 | | -}()) |
| 89 | +})() |
0 commit comments