diff options
author | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-07 19:33:14 +0000 |
---|---|---|
committer | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-07 19:33:14 +0000 |
commit | 36d22d82aa202bb199967e9512281e9a53db42c9 (patch) | |
tree | 105e8c98ddea1c1e4784a60a5a6410fa416be2de /third_party/webkit/PerformanceTests/Speedometer/resources/todomvc/vanilla-examples/es2015-babel-webpack/src/template.js | |
parent | Initial commit. (diff) | |
download | firefox-esr-36d22d82aa202bb199967e9512281e9a53db42c9.tar.xz firefox-esr-36d22d82aa202bb199967e9512281e9a53db42c9.zip |
Adding upstream version 115.7.0esr.upstream/115.7.0esrupstream
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'third_party/webkit/PerformanceTests/Speedometer/resources/todomvc/vanilla-examples/es2015-babel-webpack/src/template.js')
-rw-r--r-- | third_party/webkit/PerformanceTests/Speedometer/resources/todomvc/vanilla-examples/es2015-babel-webpack/src/template.js | 110 |
1 files changed, 110 insertions, 0 deletions
diff --git a/third_party/webkit/PerformanceTests/Speedometer/resources/todomvc/vanilla-examples/es2015-babel-webpack/src/template.js b/third_party/webkit/PerformanceTests/Speedometer/resources/todomvc/vanilla-examples/es2015-babel-webpack/src/template.js new file mode 100644 index 0000000000..60c4f6fc84 --- /dev/null +++ b/third_party/webkit/PerformanceTests/Speedometer/resources/todomvc/vanilla-examples/es2015-babel-webpack/src/template.js @@ -0,0 +1,110 @@ +export default Template + +var htmlEscapes = { + '&': '&', + '<': '<', + '>': '>', + '"': '"', + '\'': ''', + '`': '`' +} + +var escapeHtmlChar = function(chr) { + return htmlEscapes[chr] +} + +var reUnescapedHtml = /[&<>"'`]/g +var reHasUnescapedHtml = new RegExp(reUnescapedHtml.source) + +var escape = function(string) { + if (string && reHasUnescapedHtml.test(string)) { + return string.replace(reUnescapedHtml, escapeHtmlChar) + } else { + return string + } +} + +/** +* Sets up defaults for all the Template methods such as a default template +* +* @constructor +*/ +function Template() { + this.defaultTemplate = ` + <li data-id="{{id}}" class="{{completed}}"> + <div class="view"> + <input class="toggle" type="checkbox" {{checked}} /> + <label>{{title}}</label> + <button class="destroy"></button> + </div> + </li> + ` +} + +/** + * Creates an <li> HTML string and returns it for placement in your app. + * + * NOTE: In real life you should be using a templating engine such as Mustache + * or Handlebars, however, this is a vanilla JS example. + * + * @param {object} data The object containing keys you want to find in the + * template to replace. + * @returns {string} HTML String of an <li> element + * + * @example + * view.show({ + * id: 1, + * title: "Hello World", + * completed: 0, + * }); + */ +Template.prototype.show = function(data) { + var i, l + var view = '' + + for (i = 0, l = data.length; i < l; i++) { + var template = this.defaultTemplate + var completed = '' + var checked = '' + + if (data[i].completed) { + completed = 'completed' + checked = 'checked' + } + + template = template.replace('{{id}}', data[i].id) + template = template.replace('{{title}}', escape(data[i].title)) + template = template.replace('{{completed}}', completed) + template = template.replace('{{checked}}', checked) + + view = view + template + } + + return view +} + +/** + * Displays a counter of how many to dos are left to complete + * + * @param {number} activeTodos The number of active todos. + * @returns {string} String containing the count + */ +Template.prototype.itemCounter = function(activeTodos) { + var plural = activeTodos === 1 ? '' : 's' + + return '<strong>' + activeTodos + '</strong> item' + plural + ' left' +} + +/** + * Updates the text within the "Clear completed" button + * + * @param {[type]} completedTodos The number of completed todos. + * @returns {string} String containing the count + */ +Template.prototype.clearCompletedButton = function(completedTodos) { + if (completedTodos > 0) { + return 'Clear completed' + } else { + return '' + } +} |