diff options
author | Steffen Lindner <mail@steffen-lindner.de> | 2016-03-17 17:57:53 +0300 |
---|---|---|
committer | Steffen Lindner <mail@steffen-lindner.de> | 2016-03-17 17:57:53 +0300 |
commit | 40d8f630c070c3347319788ab6216feaa632b3c8 (patch) | |
tree | 09f2b462121c4fbc67e0ec36ae1f9132c8050434 | |
parent | fecdd4d3a59dccd443afd3ccb3a0cb9b692ab71b (diff) | |
parent | c1d2c659b0ae78e45517930f63d324be7326597f (diff) |
Merge pull request #1301 from owncloud/reply-button-placementv0.4.0
fix placement of reply button, ref #900
-rwxr-xr-x | css/mail.css | 22 | ||||
-rw-r--r-- | js/communication.js | 8 | ||||
-rw-r--r-- | js/templates/composer.html | 5 | ||||
-rw-r--r-- | js/views/composer.js | 60 | ||||
-rw-r--r-- | js/views/message.js | 11 |
5 files changed, 85 insertions, 21 deletions
diff --git a/css/mail.css b/css/mail.css index e91e27838..310d6e0f1 100755 --- a/css/mail.css +++ b/css/mail.css @@ -421,9 +421,25 @@ textarea.message-body { textarea.reply { height: 100px; } -input.submit-message { - float: right; - margin-right: 0; +input.submit-message, +.submit-message-wrapper { + position: fixed; + bottom: 10px; + right: 15px; +} +.submit-message-wrapper { + position: fixed; + height: 36px; + width: 60px; +} + +.submit-message-wrapper-inside { + position: absolute; + left: 0; + right: 0; + top: 0; + bottom: 0; + z-index: 100; } #reply-msg { float: left; diff --git a/js/communication.js b/js/communication.js index d4dc2014c..ad3cf58bb 100644 --- a/js/communication.js +++ b/js/communication.js @@ -161,7 +161,6 @@ define(function(require) { }, complete: function() { }, - accountId: null, draftUID: null }; _.defaults(options, defaultOptions); @@ -187,7 +186,7 @@ define(function(require) { subject: message.subject, body: message.body, attachments: message.attachments, - folderId: options.folderId, + folderId: options.folder ? options.folder.get('id') : null, messageId: options.messageId, draftUID: options.draftUID } @@ -209,8 +208,7 @@ define(function(require) { }, complete: function() { }, - accountId: null, - folderId: null, + folder: null, messageId: null, draftUID: null }; @@ -273,7 +271,7 @@ define(function(require) { subject: message.subject, body: message.body, attachments: message.attachments, - folderId: options.folderId, + folderId: options.folder ? options.folder.get('id') : null, messageId: options.messageId, uid: options.draftUID } diff --git a/js/templates/composer.html b/js/templates/composer.html index 2b8544fcb..221c08d37 100644 --- a/js/templates/composer.html +++ b/js/templates/composer.html @@ -46,7 +46,10 @@ {{#if isReply}} reply{{/if}}" placeholder="{{ t 'Message …' }}">{{message}}</textarea> </div> - <input class="submit-message send primary" type="submit" value="{{submitButtonTitle}}" disabled> + <div class='submit-message-wrapper'> + <input class="submit-message send primary" type="submit" value="{{submitButtonTitle}}" disabled> + <div class='submit-message-wrapper-inside' ></div> + </div> <div class="new-message-attachments"> </div> </div> diff --git a/js/views/composer.js b/js/views/composer.js index ad48f5419..7f41ab1cd 100644 --- a/js/views/composer.js +++ b/js/views/composer.js @@ -5,7 +5,7 @@ * later. See the COPYING file. * * @author Christoph Wurst <christoph@winzerhof-wurst.at> - * @copyright Christoph Wurst 2015 + * @copyright Christoph Wurst 2016 */ define(function(require) { @@ -37,6 +37,7 @@ define(function(require) { autosized: false, events: { 'click .submit-message': 'submitMessage', + 'click .submit-message-wrapper-inside': 'submitMessageWrapperInside', 'keypress .message-body': 'handleKeyPress', 'input .to': 'onInputChanged', 'paste .to': 'onInputChanged', @@ -246,6 +247,43 @@ define(function(require) { return message; }, + submitMessageWrapperInside: function(e) { + // http://stackoverflow.com/questions/487073/check-if-element-is-visible-after-scrolling + if (this._isVisible()) { + this.$('.submit-message').click(); + } else { + $('#mail-message').animate({ + scrollTop: this.$el.offset().top + }, 1000); + this.$('.submit-message-wrapper-inside').hide(); + // This function is needed because $('.message-body').focus does not focus the first line + this._setCaretToPos(this.$('.message-body')[0], 0); + } + }, + _setSelectionRange: function(input, selectionStart, selectionEnd) { + if (input.setSelectionRange) { + input.focus(); + input.setSelectionRange(selectionStart, selectionEnd); + } else if (input.createTextRange) { + var range = input.createTextRange(); + range.collapse(true); + range.moveEnd('character', selectionEnd); + range.moveStart('character', selectionStart); + range.select(); + } + }, + _setCaretToPos: function(input, pos) { + this._setSelectionRange(input, pos, pos); + }, + _isVisible: function() { + var $elem = this.$el; + var $window = $(window); + var docViewTop = $window.scrollTop(); + var docViewBottom = docViewTop + $window.height(); + var elemTop = $elem.offset().top; + + return elemTop <= docViewBottom; + }, submitMessage: function() { clearTimeout(this.draftTimer); // @@ -276,7 +314,8 @@ define(function(require) { // if available get account from drop-down list if (this.$('.mail-account').length > 0) { - this.account = this.accounts.get(this.$('.mail-account').find(':selected').val()); + this.account = this.accounts.get(this.$('.mail-account'). + find(':selected').val()); } // send the mail @@ -303,7 +342,8 @@ define(function(require) { if (_this.draftUID !== null) { // the sent message was a draft if (!_.isUndefined(Radio.ui.request('messagesview:collection'))) { - Radio.ui.request('messagesview:collection').remove({id: _this.draftUID}); + Radio.ui.request('messagesview:collection'). + remove({id: _this.draftUID}); } _this.draftUID = null; } @@ -327,7 +367,8 @@ define(function(require) { cc.prop('disabled', false); bcc.prop('disabled', false); subject.prop('disabled', false); - _this.$('.new-message-attachments-action').css('display', 'inline-block'); + _this.$('.new-message-attachments-action'). + css('display', 'inline-block'); _this.$('#mail_new_attachment').prop('disabled', false); newMessageBody.prop('disabled', false); newMessageSend.prop('disabled', false); @@ -337,7 +378,7 @@ define(function(require) { if (this.isReply()) { options.messageId = this.messageId; - options.folderId = this.folderId; + options.folder = this.account.get('folders').get(this.folderId); } this.submitCallback(this.account, this.getMessage(), options); @@ -354,14 +395,14 @@ define(function(require) { // if available get account from drop-down list if (this.$('.mail-account').length > 0) { - this.account = this.accounts.get(this.$('.mail-account').find(':selected').val()); + this.account = this.accounts.get(this.$('.mail-account'). + find(':selected').val()); } // send the mail var _this = this; this.draftCallback(this.account, this.getMessage(), { - account: this.account, - folderId: this.folderId, + folder: this.account.get('folders').get(this.folderId), messageId: this.messageId, draftUID: this.draftUID, success: function(data) { @@ -411,7 +452,8 @@ define(function(require) { function extractLast(term) { return split(term).pop(); } - if (!$(this).data('autocomplete')) { // If the autocomplete wasn't called yet: + if (!$(this). + data('autocomplete')) { // If the autocomplete wasn't called yet: // don't navigate away from the field on tab when selecting an item $(this).bind('keydown', function(event) { if (event.keyCode === $.ui.keyCode.TAB && diff --git a/js/views/message.js b/js/views/message.js index 5ac5c7cc0..b785268f8 100644 --- a/js/views/message.js +++ b/js/views/message.js @@ -7,7 +7,7 @@ * later. See the COPYING file. * * @author Christoph Wurst <christoph@winzerhof-wurst.at> - * @copyright Christoph Wurst 2015 + * @copyright Christoph Wurst 2016 */ define(function(require) { @@ -136,14 +136,19 @@ define(function(require) { }); }); + // TODO: add folder/account reference to message + var account = require('state').accounts.get(this.message.get('accountId')); + var folderId = this.message.get('folderId'); + // setup reply composer view + this.replyComposer.show(new ComposerView({ //el: this.$('#reply-composer'), type: 'reply', onSubmit: require('communication').sendMessage, onDraft: require('communication').saveDraft, - accountId: this.message.get('accountId'), - folderId: this.message.get('folderId'), + account: account, + folderId: folderId, messageId: this.message.get('messageId') })); this.replyComposer.currentView.render({ |