diff options
| -rw-r--r-- | Makefile | 3 | ||||
| -rwxr-xr-x | compile-handlebars-templates.sh | 2 | ||||
| -rw-r--r-- | css/publicshareauth.scss | 14 | ||||
| -rw-r--r-- | js/views/callbutton.js | 93 | ||||
| -rw-r--r-- | js/views/callinfoview.js | 42 | ||||
| -rw-r--r-- | js/views/chatview.js | 61 | ||||
| -rw-r--r-- | js/views/richobjectstringparser.js (renamed from js/richobjectstringparser.js) | 36 | ||||
| -rw-r--r-- | js/views/templates.js | 158 | ||||
| -rw-r--r-- | js/views/templates/callbutton.handlebars | 9 | ||||
| -rw-r--r-- | js/views/templates/chatview.handlebars | 6 | ||||
| -rw-r--r-- | js/views/templates/chatview_add_comment.handlebars | 19 | ||||
| -rw-r--r-- | js/views/templates/chatview_comment.handlebars | 10 | ||||
| -rw-r--r-- | js/views/templates/richobjectstringparser_filepreview.handlebars | 4 | ||||
| -rw-r--r-- | js/views/templates/richobjectstringparser_unknown.handlebars | 1 | ||||
| -rw-r--r-- | js/views/templates/richobjectstringparser_unknownlink.handlebars | 1 | ||||
| -rw-r--r-- | js/views/templates/richobjectstringparser_userlocal.handlebars | 9 | ||||
| -rw-r--r-- | lib/PublicShareAuth/TemplateLoader.php | 4 | ||||
| -rw-r--r-- | templates/index-public.php | 4 | ||||
| -rw-r--r-- | templates/index.php | 4 |
19 files changed, 371 insertions, 109 deletions
@@ -42,6 +42,8 @@ appstore: clean install-deps --exclude=bower.json \ --exclude=.bowerrc \ --exclude=/build \ + --exclude=check-handlebars-templates.sh \ + --exclude=compile-handlebars-templates.sh \ --exclude=docs \ --exclude=.drone.yml \ --exclude=.eslintignore \ @@ -52,6 +54,7 @@ appstore: clean install-deps --exclude=.gitignore \ --exclude=.jscsrc \ --exclude=.jshintignore \ + --exclude=js/views/templates \ --exclude=js/tests \ --exclude=karma.conf.js \ --exclude=l10n/no-php \ diff --git a/compile-handlebars-templates.sh b/compile-handlebars-templates.sh index 663a5bd83..8111f8555 100755 --- a/compile-handlebars-templates.sh +++ b/compile-handlebars-templates.sh @@ -4,3 +4,5 @@ export PATH=./node_modules/.bin/:$PATH handlebars -n OCA.VideoCalls.Admin.Templates js/admin/templates/ -f js/admin/templates.js + +handlebars -n OCA.Talk.Views.Templates js/views/templates/ -f js/views/templates.js diff --git a/css/publicshareauth.scss b/css/publicshareauth.scss index ef16ef88c..f077f3fc1 100644 --- a/css/publicshareauth.scss +++ b/css/publicshareauth.scss @@ -201,6 +201,20 @@ input#request-password-button:disabled ~ .icon { padding-right: 15px; } +#talk-sidebar #commentsTabView .comments .wrapper-background, +#talk-sidebar #commentsTabView .comments .wrapper { + /* Padding is not respected in the comment wrapper due to its absolute + * positioning, so it must be set through its position. */ + left: 15px; + right: 15px; +} + +#talk-sidebar #commentsTabView .comments .wrapper { + /* Reset the rules set for ".wrapper" elements by "guest.scss" in server, as + * they affect too the virtual list wrapper when they should not. */ + width: auto; + margin-top: 0; +} /* Unset conflicting rules from guest.css for the sidebar */ diff --git a/js/views/callbutton.js b/js/views/callbutton.js new file mode 100644 index 000000000..f62bf1037 --- /dev/null +++ b/js/views/callbutton.js @@ -0,0 +1,93 @@ +/* global Marionette */ + +/** + * + * @copyright Copyright (c) 2018, Daniel Calviño Sánchez (danxuliu@gmail.com) + * + * @license GNU AGPL version 3 or any later version + * + * This program is free software: you can redistribute it and/or modify + * it under the terms of the GNU Affero General Public License as + * published by the Free Software Foundation, either version 3 of the + * License, or (at your option) any later version. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU Affero General Public License for more details. + * + * You should have received a copy of the GNU Affero General Public License + * along with this program. If not, see <http://www.gnu.org/licenses/>. + * + */ + +(function(OCA, Marionette) { + + 'use strict'; + + OCA.SpreedMe = OCA.SpreedMe || {}; + OCA.Talk = OCA.Talk || {}; + OCA.SpreedMe.Views = OCA.SpreedMe.Views || {}; + OCA.Talk.Views = OCA.Talk.Views || {}; + + var CallButton = Marionette.View.extend({ + + className: 'call-button', + + template: function(context) { + // OCA.Talk.Views.Templates may not have been initialized when this + // view is initialized, so the template can not be directly + // assigned. + return OCA.Talk.Views.Templates['callbutton'](context); + }, + + templateContext: function() { + return { + isInCall: (this.model.get('participantFlags') & OCA.SpreedMe.app.FLAG_IN_CALL) !== 0, + hasCall: this.model.get('hasCall'), + leaveCallText: t('spreed', 'Leave call'), + joinCallText: t('spreed', 'Join call'), + startCallText: t('spreed', 'Start call'), + }; + }, + + ui: { + 'joinCallButton': 'button.join-call', + 'leaveCallButton': 'button.leave-call', + }, + + events: { + 'click @ui.joinCallButton': 'joinCall', + 'click @ui.leaveCallButton': 'leaveCall', + }, + + modelEvents: { + 'change:hasCall': function() { + this.render(); + }, + 'change:participantFlags': function() { + this.render(); + }, + }, + + /** + * @param {OCA.SpreedMe.Models.Room} options.model + * @param {OCA.Talk.Connection} options.connection + */ + initialize: function(options) { + this._connection = options.connection; + }, + + joinCall: function() { + this._connection.joinCall(this.model.get('token')); + }, + + leaveCall: function() { + this._connection.leaveCurrentCall(); + }, + + }); + + OCA.SpreedMe.Views.CallButton = CallButton; + +})(OCA, Marionette); diff --git a/js/views/callinfoview.js b/js/views/callinfoview.js index 06cc9a687..e0d79da09 100644 --- a/js/views/callinfoview.js +++ b/js/views/callinfoview.js @@ -31,17 +31,7 @@ var TEMPLATE = '<div class="room-name"></div>' + '<div class="call-controls-container">' + - ' <div class="call-button">' + - ' {{#if isInCall}}' + - ' <button class="leave-call primary">' + t('spreed', 'Leave call') + '</button>' + - ' {{else}}' + - ' {{#if hasCall}}' + - ' <button class="join-call call-ongoing primary">' + t('spreed', 'Join call') + '</button>' + - ' {{else}}' + - ' <button class="join-call primary">' + t('spreed', 'Start call') + '</button>' + - ' {{/if}}' + - ' {{/if}}' + - ' </div>' + + ' <div class="call-button"></div>' + '{{#if canModerate}}' + ' <div class="share-link-options">' + ' {{#if canFullModerate}}' + @@ -88,7 +78,6 @@ var canModerate = this._canModerate(); return $.extend(this.model.toJSON(), { isGuest: this.model.get('participantType') === 4, - isInCall: (this.model.get('participantFlags') & OCA.SpreedMe.app.FLAG_IN_CALL) !== 0, canModerate: canModerate, canFullModerate: this._canFullModerate(), isPublic: this.model.get('type') === 3, @@ -103,8 +92,7 @@ 'clipboardButton': '.clipboard-button', 'linkCheckbox': '.link-checkbox', - 'joinCallButton': 'button.join-call', - 'leaveCallButton': 'button.leave-call', + 'callButton': 'div.call-button', 'passwordButton': '.password-button .button', 'passwordForm': '.password-form', @@ -118,6 +106,7 @@ regions: { 'roomName': '@ui.roomName', + 'callButton': '@ui.callButton', }, events: { @@ -127,20 +116,12 @@ 'click @ui.passwordButton': 'showPasswordInput', 'click @ui.passwordConfirm': 'confirmPassword', 'submit @ui.passwordForm': 'confirmPassword', - 'click @ui.joinCallButton': 'joinCall', - 'click @ui.leaveCallButton': 'leaveCall', }, modelEvents: { 'change:hasPassword': function() { this.renderWhenInactive(); }, - 'change:hasCall': function() { - this.renderWhenInactive(); - }, - 'change:participantFlags': function() { - this.renderWhenInactive(); - }, 'change:participantType': function() { this._updateNameEditability(); @@ -182,6 +163,11 @@ buttonTitle: t('spreed', 'Rename') }); + this._callButton = new OCA.SpreedMe.Views.CallButton({ + model: this.model, + connection: OCA.SpreedMe.app.connection, + }); + this._updateNameEditability(); }, @@ -205,6 +191,7 @@ // rendered, as the element of the region does not exist yet at that // time and without that option the call would fail otherwise. this.getRegion('roomName').reset({ preventDestroy: true, allowMissingEl: true }); + this.getRegion('callButton').reset({ preventDestroy: true, allowMissingEl: true }); }, onRender: function() { @@ -213,9 +200,10 @@ this.renderTimeout = undefined; } - // Attach the child view again (or for the first time) after the + // Attach the child views again (or for the first time) after the // template has been rendered. this.showChildView('roomName', this._nameEditableTextLabel, { replaceElement: true } ); + this.showChildView('callButton', this._callButton, { replaceElement: true } ); var roomURL = OC.generateUrl('/call/' + this.model.get('token')), completeURL = window.location.protocol + '//' + window.location.host + roomURL; @@ -293,14 +281,6 @@ }); }, - joinCall: function() { - OCA.SpreedMe.app.connection.joinCall(this.model.get('token')); - }, - - leaveCall: function() { - OCA.SpreedMe.app.connection.leaveCurrentCall(); - }, - /** * Password */ diff --git a/js/views/chatview.js b/js/views/chatview.js index eccf5f858..bf2e6750e 100644 --- a/js/views/chatview.js +++ b/js/views/chatview.js @@ -1,4 +1,4 @@ -/* global autosize, Handlebars, Marionette, moment, OC, OCA, OCP */ +/* global autosize, Marionette, moment, OC, OCA, OCP */ /** * @@ -21,51 +21,13 @@ * */ -(function(OCA, OC, OCP, Marionette, Handlebars, autosize, moment) { +(function(OCA, OC, OCP, Marionette, autosize, moment) { 'use strict'; OCA.SpreedMe = OCA.SpreedMe || {}; + OCA.Talk = OCA.Talk || {}; OCA.SpreedMe.Views = OCA.SpreedMe.Views || {}; - - var TEMPLATE = - '<ul class="comments">' + - '</ul>' + - '<div class="emptycontent"><div class="icon-comment"></div>' + - '<p>{{emptyResultLabel}}</p></div>' + - '<div class="loading hidden" style="height: 50px"></div>'; - - var ADD_COMMENT_TEMPLATE = - '<div class="newCommentRow comment">' + - ' <div class="authorRow currentUser">' + - ' <div class="avatar" data-user-id="{{actorId}}"></div>' + - ' {{#if actorId}}' + - ' <div class="author">{{actorDisplayName}}</div>' + - ' {{else}}' + - ' <div class="guest-name"></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>'+ - ' {{#if actorId}}' + - ' <button class="share icon-add has-tooltip" title="{{shareText}}"></button>' + - ' <div class="shareLoading icon-loading-small hidden"></div>'+ - ' {{/if}}' + - ' </form>' + - '</div>'; - - var COMMENT_TEMPLATE = - '<li class="comment{{#if isNotSystemMessage}}{{else}} systemMessage{{/if}}" data-id="{{id}}">' + - ' <div class="authorRow{{#if isUserAuthor}} currentUser{{/if}}{{#if isGuest}} guestUser{{/if}}">' + - ' {{#if isNotSystemMessage}}' + - ' <div class="avatar" data-user-id="{{#if isGuest}}{{else}}{{actorId}}{{/if}}" data-user-display-name="{{actorDisplayName}}"> </div>' + - ' <div class="author">{{actorDisplayName}}</div>' + - ' {{/if}}' + - ' <div class="date has-tooltip{{#if relativeDate}} live-relative-timestamp{{/if}}" data-timestamp="{{timestamp}}" title="{{altDate}}">{{date}}</div>' + - ' </div>' + - ' <div class="message">{{{formattedMessage}}}</div>' + - '</li>'; + OCA.Talk.Views = OCA.Talk.Views || {}; var ChatView = Marionette.View.extend({ @@ -201,14 +163,19 @@ document.execCommand('insertText', false, text); }, - template: Handlebars.compile(TEMPLATE), + template: function(context) { + // OCA.Talk.Views.Templates may not have been initialized when + // this view is initialized, so the template can not be directly + // assigned. + return OCA.Talk.Views.Templates['chatview'](context); + }, templateContext: { emptyResultLabel: t('spreed', 'No messages yet, start the conversation!') }, addCommentTemplate: function(params) { if (!this._addCommentTemplate) { - this._addCommentTemplate = Handlebars.compile(ADD_COMMENT_TEMPLATE); + this._addCommentTemplate = OCA.Talk.Views.Templates['chatview_add_comment']; } return this._addCommentTemplate(_.extend({ @@ -222,7 +189,7 @@ commentTemplate: function(params) { if (!this._commentTemplate) { - this._commentTemplate = Handlebars.compile(COMMENT_TEMPLATE); + this._commentTemplate = OCA.Talk.Views.Templates['chatview_comment']; } params = _.extend({ @@ -371,7 +338,7 @@ var formattedMessage = escapeHTML(commentModel.get('message')).replace(/\n/g, '<br/>'); formattedMessage = OCP.Comments.plainToRich(formattedMessage); - formattedMessage = OCA.SpreedMe.RichObjectStringParser.parseMessage( + formattedMessage = OCA.SpreedMe.Views.RichObjectStringParser.parseMessage( formattedMessage, commentModel.get('messageParameters')); var data = _.extend({}, commentModel.attributes, { @@ -756,4 +723,4 @@ OCA.SpreedMe.Views.ChatView = ChatView; -})(OCA, OC, OCP, Marionette, Handlebars, autosize, moment); +})(OCA, OC, OCP, Marionette, autosize, moment); diff --git a/js/richobjectstringparser.js b/js/views/richobjectstringparser.js index 83a0360f8..02f7a25d1 100644 --- a/js/richobjectstringparser.js +++ b/js/views/richobjectstringparser.js @@ -1,4 +1,4 @@ -/* global OC, OCA, Handlebars */ +/* global OC, OCA */ /** * @copyright (c) 2016 Joas Schilling <coding@schilljs.com> @@ -9,29 +9,9 @@ * later. See the COPYING file. */ -(function(OC, OCA, Handlebars) { +(function(OC, OCA) { - OCA.SpreedMe.RichObjectStringParser = { - - _userLocalTemplate: '' + - '<span class="atwho-inserted" contenteditable="false">' + - '<span class="mention-user avatar-name-wrapper {{#if isCurrentUser}}currentUser{{/if}}">' + - '<span class="avatar" ' + - 'data-user-id="{{id}}" ' + - 'data-user-display-name="{{name}}">' + - '</span>' + - '<strong>{{name}}</strong>' + - '</span>' + - '</span>', - - _filePreviewTemplate: '' + - '<a href="{{link}}" class="filePreviewContainer" target="_blank" rel="noopener noreferrer">' + - '<span class="filePreview" data-file-id="{{id}}"></span>' + - '<strong>{{name}}</strong>' + - '</a>', - - _unknownTemplate: '<strong>{{name}}</strong>', - _unknownLinkTemplate: '<a href="{{link}}" class="external" target="_blank" rel="noopener noreferrer"><strong>{{name}}</strong></a>', + OCA.SpreedMe.Views.RichObjectStringParser = { /** * @param {string} subject @@ |