diff options
-rw-r--r-- | apps/comments/js/commentstabview.js | 59 | ||||
-rw-r--r-- | apps/comments/js/merged.json | 1 | ||||
-rw-r--r-- | apps/comments/js/templates.js | 87 | ||||
-rw-r--r-- | apps/comments/js/templates/comment.handlebars | 15 | ||||
-rw-r--r-- | apps/comments/js/templates/edit_comment.handlebars | 16 | ||||
-rw-r--r-- | apps/comments/js/templates/view.handlebars | 6 | ||||
-rwxr-xr-x | build/compile-handlebars-templates.sh | 4 | ||||
-rw-r--r-- | tests/karma.config.js | 1 |
8 files changed, 133 insertions, 56 deletions
diff --git a/apps/comments/js/commentstabview.js b/apps/comments/js/commentstabview.js index 28382c8b67e..35e73d3f4a6 100644 --- a/apps/comments/js/commentstabview.js +++ b/apps/comments/js/commentstabview.js @@ -11,49 +11,6 @@ /* global Handlebars, escapeHTML */ (function(OC, OCA) { - var TEMPLATE = - '<ul class="comments">' + - '</ul>' + - '<div class="emptycontent hidden"><div class="icon-comment"></div>' + - '<p>{{emptyResultLabel}}</p></div>' + - '<input type="button" class="showMore hidden" value="{{moreLabel}}"' + - ' name="show-more" id="show-more" />' + - '<div class="loading hidden" style="height: 50px"></div>'; - - var EDIT_COMMENT_TEMPLATE = - '<{{tag}} class="newCommentRow comment" data-id="{{id}}">' + - ' <div class="authorRow">' + - ' <div class="avatar currentUser" data-username="{{actorId}}"></div>' + - ' <div class="author currentUser">{{actorDisplayName}}</div>' + - '{{#if isEditMode}}' + - ' <div class="action-container">' + - ' <a href="#" class="action cancel icon icon-close has-tooltip" title="{{cancelText}}"></a>' + - ' </div>' + - '{{/if}}' + - ' </div>' + - ' <form class="newCommentForm">' + - ' <div contentEditable="true" class="message" data-placeholder="{{newMessagePlaceholder}}">{{message}}</div>' + - ' <input class="submit icon-confirm has-tooltip" type="submit" value="" title="{{submitText}}"/>' + - ' <div class="submitLoading icon-loading-small hidden"></div>'+ - ' </form>' + - '</{{tag}}>'; - - var COMMENT_TEMPLATE = - '<li class="comment{{#if isUnread}} unread{{/if}}{{#if isLong}} collapsed{{/if}}" data-id="{{id}}">' + - ' <div class="authorRow">' + - ' <div class="avatar{{#if isUserAuthor}} currentUser{{/if}}" {{#if actorId}}data-username="{{actorId}}"{{/if}}> </div>' + - ' <div class="author{{#if isUserAuthor}} currentUser{{/if}}">{{actorDisplayName}}</div>' + - '{{#if isUserAuthor}}' + - ' <a href="#" class="action more icon icon-more has-tooltip"></a>' + - ' <div class="deleteLoading icon-loading-small hidden"></div>' + - '{{/if}}' + - ' <div class="date has-tooltip live-relative-timestamp" data-timestamp="{{timestamp}}" title="{{altDate}}">{{date}}</div>' + - ' </div>' + - ' <div class="message">{{{formattedMessage}}}</div>' + - '{{#if isLong}}' + - ' <div class="message-overlay"></div>' + - '{{/if}}' + - '</li>'; /** * @memberof OCA.Comments @@ -93,22 +50,16 @@ }, template: function(params) { - if (!this._template) { - this._template = Handlebars.compile(TEMPLATE); - } var currentUser = OC.getCurrentUser(); - return this._template(_.extend({ + return OCA.Comments.Templates['view'](_.extend({ actorId: currentUser.uid, actorDisplayName: currentUser.displayName }, params)); }, editCommentTemplate: function(params) { - if (!this._editCommentTemplate) { - this._editCommentTemplate = Handlebars.compile(EDIT_COMMENT_TEMPLATE); - } var currentUser = OC.getCurrentUser(); - return this._editCommentTemplate(_.extend({ + return OCA.Comments.Templates['edit_comment'](_.extend({ actorId: currentUser.uid, actorDisplayName: currentUser.displayName, newMessagePlaceholder: t('comments', 'New comment …'), @@ -119,10 +70,6 @@ }, commentTemplate: function(params) { - if (!this._commentTemplate) { - this._commentTemplate = Handlebars.compile(COMMENT_TEMPLATE); - } - params = _.extend({ editTooltip: t('comments', 'Edit comment'), isUserAuthor: OC.getCurrentUser().uid === params.actorId, @@ -135,7 +82,7 @@ params.actorDisplayName = t('comments', '[Deleted user]'); } - return this._commentTemplate(params); + return OCA.Comments.Templates['comment'](params); }, getLabel: function() { diff --git a/apps/comments/js/merged.json b/apps/comments/js/merged.json index d5b2b882334..8f40b5621a6 100644 --- a/apps/comments/js/merged.json +++ b/apps/comments/js/merged.json @@ -1,5 +1,6 @@ [ "app.js", + "templates.js", "commentmodel.js", "commentcollection.js", "commentsummarymodel.js", diff --git a/apps/comments/js/templates.js b/apps/comments/js/templates.js new file mode 100644 index 00000000000..90ded7fe4e5 --- /dev/null +++ b/apps/comments/js/templates.js @@ -0,0 +1,87 @@ +(function() { + var template = Handlebars.template, templates = OCA.Comments.Templates = OCA.Comments.Templates || {}; +templates['comment'] = template({"1":function(container,depth0,helpers,partials,data) { + return " unread"; +},"3":function(container,depth0,helpers,partials,data) { + return " collapsed"; +},"5":function(container,depth0,helpers,partials,data) { + return " currentUser"; +},"7":function(container,depth0,helpers,partials,data) { + var helper; + + return "data-username=\"" + + container.escapeExpression(((helper = (helper = helpers.actorId || (depth0 != null ? depth0.actorId : depth0)) != null ? helper : helpers.helperMissing),(typeof helper === "function" ? helper.call(depth0 != null ? depth0 : (container.nullContext || {}),{"name":"actorId","hash":{},"data":data}) : helper))) + + "\""; +},"9":function(container,depth0,helpers,partials,data) { + return " <a href=\"#\" class=\"action more icon icon-more has-tooltip\"></a>\n <div class=\"deleteLoading icon-loading-small hidden\"></div>\n"; +},"11":function(container,depth0,helpers,partials,data) { + return " <div class=\"message-overlay\"></div>\n"; +},"compiler":[7,">= 4.0.0"],"main":function(container,depth0,helpers,partials,data) { + var stack1, helper, alias1=depth0 != null ? depth0 : (container.nullContext || {}), alias2=helpers.helperMissing, alias3="function", alias4=container.escapeExpression; + + return "<li class=\"comment" + + ((stack1 = helpers["if"].call(alias1,(depth0 != null ? depth0.isUnread : depth0),{"name":"if","hash":{},"fn":container.program(1, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "") + + ((stack1 = helpers["if"].call(alias1,(depth0 != null ? depth0.isLong : depth0),{"name":"if","hash":{},"fn":container.program(3, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "") + + "\" data-id=\"" + + alias4(((helper = (helper = helpers.id || (depth0 != null ? depth0.id : depth0)) != null ? helper : alias2),(typeof helper === alias3 ? helper.call(alias1,{"name":"id","hash":{},"data":data}) : helper))) + + "\">\n <div class=\"authorRow\">\n <div class=\"avatar" + + ((stack1 = helpers["if"].call(alias1,(depth0 != null ? depth0.isUserAuthor : depth0),{"name":"if","hash":{},"fn":container.program(5, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "") + + "\" " + + ((stack1 = helpers["if"].call(alias1,(depth0 != null ? depth0.actorId : depth0),{"name":"if","hash":{},"fn":container.program(7, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "") + + "> </div>\n <div class=\"author" + + ((stack1 = helpers["if"].call(alias1,(depth0 != null ? depth0.isUserAuthor : depth0),{"name":"if","hash":{},"fn":container.program(5, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "") + + "\">" + + alias4(((helper = (helper = helpers.actorDisplayName || (depth0 != null ? depth0.actorDisplayName : depth0)) != null ? helper : alias2),(typeof helper === alias3 ? helper.call(alias1,{"name":"actorDisplayName","hash":{},"data":data}) : helper))) + + "</div>\n" + + ((stack1 = helpers["if"].call(alias1,(depth0 != null ? depth0.isUserAuthor : depth0),{"name":"if","hash":{},"fn":container.program(9, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "") + + " <div class=\"date has-tooltip live-relative-timestamp\" data-timestamp=\"" + + alias4(((helper = (helper = helpers.timestamp || (depth0 != null ? depth0.timestamp : depth0)) != null ? helper : alias2),(typeof helper === alias3 ? helper.call(alias1,{"name":"timestamp","hash":{},"data":data}) : helper))) + + "\" title=\"" + + alias4(((helper = (helper = helpers.altDate || (depth0 != null ? depth0.altDate : depth0)) != null ? helper : alias2),(typeof helper === alias3 ? helper.call(alias1,{"name":"altDate","hash":{},"data":data}) : helper))) + + "\">" + + alias4(((helper = (helper = helpers.date || (depth0 != null ? depth0.date : depth0)) != null ? helper : alias2),(typeof helper === alias3 ? helper.call(alias1,{"name":"date","hash":{},"data":data}) : helper))) + + "</div>\n </div>\n <div class=\"message\">" + + ((stack1 = ((helper = (helper = helpers.formattedMessage || (depth0 != null ? depth0.formattedMessage : depth0)) != null ? helper : alias2),(typeof helper === alias3 ? helper.call(alias1,{"name":"formattedMessage","hash":{},"data":data}) : helper))) != null ? stack1 : "") + + "</div>\n" + + ((stack1 = helpers["if"].call(alias1,(depth0 != null ? depth0.isLong : depth0),{"name":"if","hash":{},"fn":container.program(11, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "") + + "</li>\n"; +},"useData":true}); +templates['edit_comment'] = template({"1":function(container,depth0,helpers,partials,data) { + var helper; + + return " <div class=\"action-container\">\n <a href=\"#\" class=\"action cancel icon icon-close has-tooltip\" title=\"" + + container.escapeExpression(((helper = (helper = helpers.cancelText || (depth0 != null ? depth0.cancelText : depth0)) != null ? helper : helpers.helperMissing),(typeof helper === "function" ? helper.call(depth0 != null ? depth0 : (container.nullContext || {}),{"name":"cancelText","hash":{},"data":data}) : helper))) + + "\"></a>\n </div>\n"; +},"compiler":[7,">= 4.0.0"],"main":function(container,depth0,helpers,partials,data) { + var stack1, helper, alias1=depth0 != null ? depth0 : (container.nullContext || {}), alias2=helpers.helperMissing, alias3="function", alias4=container.escapeExpression; + + return "<" + + alias4(((helper = (helper = helpers.tag || (depth0 != null ? depth0.tag : depth0)) != null ? helper : alias2),(typeof helper === alias3 ? helper.call(alias1,{"name":"tag","hash":{},"data":data}) : helper))) + + " class=\"newCommentRow comment\" data-id=\"" + + alias4(((helper = (helper = helpers.id || (depth0 != null ? depth0.id : depth0)) != null ? helper : alias2),(typeof helper === alias3 ? helper.call(alias1,{"name":"id","hash":{},"data":data}) : helper))) + + "\">\n <div class=\"authorRow\">\n <div class=\"avatar currentUser\" data-username=\"" + + alias4(((helper = (helper = helpers.actorId || (depth0 != null ? depth0.actorId : depth0)) != null ? helper : alias2),(typeof helper === alias3 ? helper.call(alias1,{"name":"actorId","hash":{},"data":data}) : helper))) + + "\"></div>\n <div class=\"author currentUser\">" + + alias4(((helper = (helper = helpers.actorDisplayName || (depth0 != null ? depth0.actorDisplayName : depth0)) != null ? helper : alias2),(typeof helper === alias3 ? helper.call(alias1,{"name":"actorDisplayName","hash":{},"data":data}) : helper))) + + "</div>\n" + + ((stack1 = helpers["if"].call(alias1,(depth0 != null ? depth0.isEditMode : depth0),{"name":"if","hash":{},"fn":container.program(1, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "") + + " </div>\n <form class=\"newCommentForm\">\n <div contentEditable=\"true\" class=\"message\" data-placeholder=\"" + + alias4(((helper = (helper = helpers.newMessagePlaceholder || (depth0 != null ? depth0.newMessagePlaceholder : depth0)) != null ? helper : alias2),(typeof helper === alias3 ? helper.call(alias1,{"name":"newMessagePlaceholder","hash":{},"data":data}) : helper))) + + "\">" + + alias4(((helper = (helper = helpers.message || (depth0 != null ? depth0.message : depth0)) != null ? helper : alias2),(typeof helper === alias3 ? helper.call(alias1,{"name":"message","hash":{},"data":data}) : helper))) + + "</div>\n <input class=\"submit icon-confirm has-tooltip\" type=\"submit\" value=\"\" title=\"" + + alias4(((helper = (helper = helpers.submitText || (depth0 != null ? depth0.submitText : depth0)) != null ? helper : alias2),(typeof helper === alias3 ? helper.call(alias1,{"name":"submitText","hash":{},"data":data}) : helper))) + + "\"/>\n <div class=\"submitLoading icon-loading-small hidden\"></div>'+\n </form>\n'</" + + alias4(((helper = (helper = helpers.tag || (depth0 != null ? depth0.tag : depth0)) != null ? helper : alias2),(typeof helper === alias3 ? helper.call(alias1,{"name":"tag","hash":{},"data":data}) : helper))) + + ">\n"; +},"useData":true}); +templates['view'] = template({"compiler":[7,">= 4.0.0"],"main":function(container,depth0,helpers,partials,data) { + var helper, alias1=depth0 != null ? depth0 : (container.nullContext || {}), alias2=helpers.helperMissing, alias3="function", alias4=container.escapeExpression; + + return "<ul class=\"comments\">\n</ul>\n<div class=\"emptycontent hidden\"><div class=\"icon-comment\"></div>\n <p>" + + alias4(((helper = (helper = helpers.emptyResultLabel || (depth0 != null ? depth0.emptyResultLabel : depth0)) != null ? helper : alias2),(typeof helper === alias3 ? helper.call(alias1,{"name":"emptyResultLabel","hash":{},"data":data}) : helper))) + + "</p></div>\n<input type=\"button\" class=\"showMore hidden\" value=\"" + + alias4(((helper = (helper = helpers.moreLabel || (depth0 != null ? depth0.moreLabel : depth0)) != null ? helper : alias2),(typeof helper === alias3 ? helper.call(alias1,{"name":"moreLabel","hash":{},"data":data}) : helper))) + + "\" name=\"show-more\" id=\"show-more\" />\n<div class=\"loading hidden\" style=\"height: 50px\"></div>'\n"; +},"useData":true}); +})();
\ No newline at end of file diff --git a/apps/comments/js/templates/comment.handlebars b/apps/comments/js/templates/comment.handlebars new file mode 100644 index 00000000000..c1a1091a4e0 --- /dev/null +++ b/apps/comments/js/templates/comment.handlebars @@ -0,0 +1,15 @@ +<li class="comment{{#if isUnread}} unread{{/if}}{{#if isLong}} collapsed{{/if}}" data-id="{{id}}"> + <div class="authorRow"> + <div class="avatar{{#if isUserAuthor}} currentUser{{/if}}" {{#if actorId}}data-username="{{actorId}}"{{/if}}> </div> + <div class="author{{#if isUserAuthor}} currentUser{{/if}}">{{actorDisplayName}}</div> + {{#if isUserAuthor}} + <a href="#" class="action more icon icon-more has-tooltip"></a> + <div class="deleteLoading icon-loading-small hidden"></div> + {{/if}} + <div class="date has-tooltip live-relative-timestamp" data-timestamp="{{timestamp}}" title="{{altDate}}">{{date}}</div> + </div> + <div class="message">{{{formattedMessage}}}</div> + {{#if isLong}} + <div class="message-overlay"></div> + {{/if}} +</li> diff --git a/apps/comments/js/templates/edit_comment.handlebars b/apps/comments/js/templates/edit_comment.handlebars new file mode 100644 index 00000000000..05f89ec598a --- /dev/null +++ b/apps/comments/js/templates/edit_comment.handlebars @@ -0,0 +1,16 @@ +<{{tag}} class="newCommentRow comment" data-id="{{id}}"> + <div class="authorRow"> + <div class="avatar currentUser" data-username="{{actorId}}"></div> + <div class="author currentUser">{{actorDisplayName}}</div> + {{#if isEditMode}} + <div class="action-container"> + <a href="#" class="action cancel icon icon-close has-tooltip" title="{{cancelText}}"></a> + </div> + {{/if}} + </div> + <form class="newCommentForm"> + <div contentEditable="true" class="message" data-placeholder="{{newMessagePlaceholder}}">{{message}}</div> + <input class="submit icon-confirm has-tooltip" type="submit" value="" title="{{submitText}}"/> + <div class="submitLoading icon-loading-small hidden"></div>'+ + </form> +'</{{tag}}> diff --git a/apps/comments/js/templates/view.handlebars b/apps/comments/js/templates/view.handlebars new file mode 100644 index 00000000000..5f52a42861d --- /dev/null +++ b/apps/comments/js/templates/view.handlebars @@ -0,0 +1,6 @@ +<ul class="comments"> +</ul> +<div class="emptycontent hidden"><div class="icon-comment"></div> + <p>{{emptyResultLabel}}</p></div> +<input type="button" class="showMore hidden" value="{{moreLabel}}" name="show-more" id="show-more" /> +<div class="loading hidden" style="height: 50px"></div>' diff --git a/build/compile-handlebars-templates.sh b/build/compile-handlebars-templates.sh index 585406c4e8f..8dc0e0397aa 100755 --- a/build/compile-handlebars-templates.sh +++ b/build/compile-handlebars-templates.sh @@ -13,6 +13,10 @@ handlebars -n OC.ContactsMenu.Templates core/js/contactsmenu -f core/js/contacts # Files app handlebars -n OCA.Files.Templates apps/files/js/templates -f apps/files/js/templates.js +# Comments app +handlebars -n OCA.Comments.Templates apps/comments/js/templates -f apps/comments/js/templates.js + + if [[ $(git diff --name-only) ]]; then echo "Please submit your compiled handlebars templates" echo diff --git a/tests/karma.config.js b/tests/karma.config.js index 0fd9b7b8019..93b7b4113f2 100644 --- a/tests/karma.config.js +++ b/tests/karma.config.js @@ -87,6 +87,7 @@ module.exports = function(config) { srcFiles: [ // need to enforce loading order... 'apps/comments/js/app.js', + 'apps/comments/js/templates.js', 'apps/comments/js/vendor/Caret.js/dist/jquery.caret.min.js', 'apps/comments/js/vendor/At.js/dist/js/jquery.atwho.min.js', 'apps/comments/js/commentmodel.js', |