| 'use strict'; |
| |
| define( |
| |
| [ |
| 'flight/lib/component' |
| ], |
| |
| function(defineComponent) { |
| |
| return defineComponent(composeBox); |
| |
| function composeBox() { |
| |
| this.defaultAttrs({ |
| newMailType: 'newMail', |
| forwardMailType: 'forward', |
| replyMailType: 'reply', |
| hintClass: 'hint', |
| selectedFolders: [], |
| selectedMailItems: [], |
| |
| //selectors |
| composeControl: '.compose', |
| newControlSelector: '#new_mail', |
| cancelSelector: '#cancel_composed', |
| sendSelector: '#send_composed', |
| toSelector: '#compose_to', |
| subjectSelector: '#compose_subject', |
| messageSelector: '#compose_message', |
| recipientSelector: '#recipient_select', |
| recipientHintSelector: '#recipient_hint', |
| selectedRecipientSelector: '#recipient_select :selected', |
| hintSelector: 'div.hint' |
| }); |
| |
| this.newMail = function() { |
| this.requestComposeBox(this.attr.newMailType); |
| }; |
| |
| this.forward = function() { |
| this.requestComposeBox(this.attr.forwardMailType, this.attr.selectedMailItems); |
| }; |
| |
| this.reply = function() { |
| this.requestComposeBox(this.attr.replyMailType, this.attr.selectedMailItems); |
| }; |
| |
| this.requestComposeBox = function(type, relatedMailId) { |
| this.trigger('uiComposeBoxRequested', {type: type, relatedMailId: relatedMailId}); |
| }; |
| |
| this.launchComposeBox = function(ev, data) { |
| var focusSelector = (data.type == this.attr.replyMailType) ? 'messageSelector' : 'toSelector'; |
| this.$node.html(data.markup).show(); |
| this.select(focusSelector).focus(); |
| }; |
| |
| this.cancel = function() { |
| this.$node.html('').hide(); |
| }; |
| |
| this.requestSend = function() { |
| var data = { |
| to_id: this.select('selectedRecipientSelector').attr('id'), |
| subject: this.select('subjectSelector').text(), |
| message: this.select('messageSelector').text(), |
| currentFolder: this.attr.selectedFolders[0] |
| }; |
| this.trigger('uiSendRequested', data); |
| this.$node.hide(); |
| }; |
| |
| this.enableSend = function() { |
| this.select('recipientHintSelector').attr('disabled', 'disabled'); |
| this.select('sendSelector').removeAttr('disabled'); |
| }; |
| |
| this.removeHint = function(ev, data) { |
| $(ev.target).html('').removeClass(this.attr.hintClass); |
| }; |
| |
| this.updateMailItemSelections = function(ev, data) { |
| this.attr.selectedMailItems = data.selectedIds; |
| } |
| |
| this.updateFolderSelections = function(ev, data) { |
| this.attr.selectedFolders = data.selectedIds; |
| } |
| |
| this.after('initialize', function() { |
| this.on(document, 'dataComposeBoxServed', this.launchComposeBox); |
| this.on(document, 'uiForwardMail', this.forward); |
| this.on(document, 'uiReplyToMail', this.reply); |
| this.on(document, 'uiMailItemSelectionChanged', this.updateMailItemSelections); |
| this.on(document, 'uiFolderSelectionChanged', this.updateFolderSelections); |
| |
| //the following bindings use delegation so that the event target is read at event time |
| this.on(document, "click", { |
| 'cancelSelector': this.cancel, |
| 'sendSelector': this.requestSend, |
| 'newControlSelector': this.newMail |
| }); |
| this.on('change', { |
| 'recipientSelector': this.enableSend |
| }); |
| this.on('keydown', { |
| 'hintSelector': this.removeHint |
| }); |
| }); |
| } |
| } |
| ); |