diff --git a/addons/mail/static/src/css/mail.css b/addons/mail/static/src/css/mail.css index f758a706e48..e43b7d33755 100644 --- a/addons/mail/static/src/css/mail.css +++ b/addons/mail/static/src/css/mail.css @@ -28,7 +28,9 @@ /* ------------ MAIL WIDGET --------------- */ .openerp .oe_mail, .openerp .oe_mail *{ - box-sizing: border-box; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; } .openerp .oe_mail { display: block; @@ -70,8 +72,7 @@ .openerp .oe_mail .oe_msg .oe_msg_footer{ padding-left: 4px; overflow: hidden; - opacity:0.8; - -webkit-transition: opacity 0.2s linear; + margin-bottom: 4px; } .openerp .oe_mail .oe_msg .oe_msg_content{ display: block; @@ -107,6 +108,9 @@ .openerp .oe_mail .oe_msg.oe_msg_indented .oe_msg_content{ padding-top:2px; } +.openerp .oe_mail .oe_msg.oe_msg_indented .oe_msg_footer{ + margin-bottom: 0px; +} /* b) Votes (likes) */ @@ -139,6 +143,9 @@ margin-left: 8px; height: 24px; -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; } .openerp .oe_mail .oe_msg .oe_msg_icons span{ float:right; @@ -152,10 +159,16 @@ color: #FFF; text-shadow: 0px 1px #AAA,0px -1px #AAA, -1px 0px #AAA, 1px 0px #AAA, 0px 3px 3px rgba(0,0,0,0.1); -webkit-transition: all 0.2s linear; + -moz-transition: all 0.2s linear; + -o-transition: all 0.2s linear; + transition: all 0.2s linear; } .openerp .oe_mail .oe_msg:hover .oe_msg_icons a{ opacity: 1; -webkit-transition: all 0.1s linear; + -moz-transition: all 0.1s linear; + -o-transition: all 0.1s linear; + transition: all 0.1s linear; } .openerp .oe_mail .oe_msg .oe_msg_icons .oe_star:hover a{ color: #FFF6C0; @@ -195,6 +208,150 @@ width: 100%; } +/* --------------------- ATTACHMENTS --------------------- */ + +.openerp .oe_mail .oe_msg_attachment_list{ + display: none; + margin-top: 12px; + margin-bottom: 12px; +} +.openerp .oe_mail .oe_msg_composer .oe_msg_attachment_list{ + display: block; +} +.openerp .oe_mail .oe_attachment{ + display: inline-block; + width: 100px; + margin: 2px; + min-height: 80px; + position: relative; + border-radius: 3px; + text-align: center; + vertical-align: top; +} +.openerp .oe_mail .oe_attachment .oe_name{ + display: inline-block; + max-width: 100%; + padding: 1px 3px; + margin-top: 50px; + margin-bottom: 5px; + background: rgba(124, 123, 173, 0.13); + overflow: hidden; + color: #4c4c4c; + text-shadow: none; + border-radius: 3px; +} + +.openerp .oe_mail .oe_attachment.oe_preview{ + background: url( data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAJ0lEQVQYV2MsLS39z4AGLCws0IUYGIeCwrVr12J45sSJE5ieGQIKAbuZKf/EMCs7AAAAAElFTkSuQmCC ); +} +.openerp .oe_mail .oe_attachment .oe_progress_bar{ + display: none; + position: absolute; + top: 18px; + left: 16px; + right: 16px; + height: 17px; + line-height: 13px; + padding: 0px; + background: #4BBD00; + color: white; + text-align: center; + border-radius: 3px; + border: solid 1px rgba(0,0,0,0.2); + box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.34); + -webkit-animation: oe_mail_attach_loading_anim 0.75s infinite linear; + -moz-animation: oe_mail_attach_loading_anim 0.75s infinite linear; + -o-animation: oe_mail_attach_loading_anim 0.75s infinite linear; + animation: oe_mail_attach_loading_anim 0.75s infinite linear; +} +.openerp .oe_mail .oe_attachment.oe_uploading .oe_progress_bar{ + display: block; +} +@-webkit-keyframes oe_mail_attach_loading_anim{ + 0% { background: #4BBD00 } + 50% { background: #009123 } + 100% { background: #4BBD00 } +} +@-moz-keyframes oe_mail_attach_loading_anim{ + 0% { background: #4BBD00 } + 50% { background: #009123 } + 100% { background: #4BBD00 } +} +@-o-keyframes oe_mail_attach_loading_anim{ + 0% { background: #4BBD00 } + 50% { background: #009123 } + 100% { background: #4BBD00 } +} +@keyframes oe_mail_attach_loading_anim{ + 0% { background: #4BBD00 } + 50% { background: #009123 } + 100% { background: #4BBD00 } +} +.openerp .oe_mail .oe_attachment.oe_preview .oe_name{ + position: absolute; + bottom: 0px; + margin: 0px; + left: 0px; + right: 0px; + max-height: 64px; + background: rgba(0,0,0,0.8); + color: white; + border-top-left-radius: 0px; + border-top-right-radius: 0px; + opacity: 0; + -webkit-transition: opacity 0.2s linear; + -moz-transition: opacity 0.2s linear; + -o-transition: opacity 0.2s linear; + transition: opacity 0.2s linear; +} +.openerp .oe_mail .oe_attachment.oe_preview:hover .oe_name{ + opacity: 1; + -webkit-transition: opacity 0.2s linear; + -moz-transition: opacity 0.2s linear; + -o-transition: opacity 0.2s linear; + transition: opacity 0.2s linear; +} +.openerp .oe_mail .oe_attachment img{ + position: absolute; + width: 48px; + height: 48px; + top: 0px; + left: 50%; + margin-left: -24px; +} +.openerp .oe_mail .oe_attachment.oe_preview img{ + display: block; + position: relative; + margin:0px; + width: 100px; + height: 100px; + border-radius: 3px; + margin-left: -50px; +} +.openerp .oe_mail .oe_attachment .oe_delete{ + display: none; +} +.openerp .oe_mail .oe_msg_composer .oe_attachment .oe_delete{ + display: block; + position: absolute; + top: -7px; + right: 0px; + color: black; + text-shadow: 1px 0px white, -1px 0px white, 0px 1px white, 0px -1px white; + cursor: pointer; + opacity: 0; + -webkit-transition: opacity 0.2s linear; + -moz-transition: opacity 0.2s linear; + -o-transition: opacity 0.2s linear; + transition: opacity 0.2s linear; +} +.openerp .oe_mail .oe_msg_composer .oe_attachment:hover .oe_delete{ + opacity: 1; + -webkit-transition: opacity 0.2s linear; + -moz-transition: opacity 0.2s linear; + -o-transition: opacity 0.2s linear; + transition: opacity 0.2s linear; +} /* ---------------- MESSAGE QUICK COMPOSER --------------- */ .openerp .oe_mail .oe_msg_composer .oe_msg_footer{ @@ -202,37 +359,6 @@ padding-top: 2px; padding-bottom:6px; } -.openerp .oe_mail .oe_msg_attachments.oe_hidden, -.openerp .oe_mail .oe_msg_images.oe_hidden{ - margin:0px; - border: none; - display: none; -} -.openerp .oe_mail .oe_msg_attachments{ - margin-bottom: 4px; - margin-right: 0px; - font-size: 12px; - border-radius: 2px; - border: solid 1px rgba(124,123,173,0.14); -} -.openerp .oe_mail .oe_msg_attachments .oe_attachment{ - padding: 2px; - padding-left: 4px; - padding-right: 4px; -} -.openerp .oe_mail .oe_msg_attachments .oe_attachment .oe_e{ - font-size: 23px; - margin-top: -5px; -} -.openerp .oe_mail .oe_msg_attachments .oe_attachment .oe_e:hover{ - text-decoration: none; -} -.openerp .oe_mail .oe_msg_attachments .oe_attachment:nth-child(odd){ - background:white; -} -.openerp .oe_mail .oe_msg_attachments .oe_attachment:nth-child(even){ - background: #F4F5FA; -} .openerp .oe_mail .oe_msg_images { display: block; } @@ -334,9 +460,22 @@ width:100%; } .openerp .oe_followers button.oe_follower.oe_following{ + color: white; background-color: #3465A4; background-image: -webkit-linear-gradient(top, #729FCF, #3465A4); + background-image: -moz-linear-gradient(top, #729FCF, #3465A4); + background-image: -ms-linear-gradient(top, #729FCF, #3465A4); + background-image: -o-linear-gradient(top, #729FCF, #3465A4); + background-image: linear-gradient(to bottom, #729FCF, #3465A4); +} +.openerp .oe_followers button.oe_follower.oe_following:hover{ color: white; + background-color: #A21A1A; + background-image: -webkit-linear-gradient(top, #DF3F3F, #A21A1A); + background-image: -moz-linear-gradient(top, #DF3F3F, #A21A1A); + background-image: -ms-linear-gradient(top, #DF3F3F, #A21A1A); + background-image: -o-linear-gradient(top, #DF3F3F, #A21A1A); + background-image: linear-gradient(to bottom, #DF3F3F, #A21A1A); } .openerp .oe_followers button.oe_follower .oe_follow, diff --git a/addons/mail/static/src/img/mimetypes/addresses.png b/addons/mail/static/src/img/mimetypes/addresses.png new file mode 100644 index 00000000000..586f1257196 Binary files /dev/null and b/addons/mail/static/src/img/mimetypes/addresses.png differ diff --git a/addons/mail/static/src/img/mimetypes/archive.png b/addons/mail/static/src/img/mimetypes/archive.png new file mode 100644 index 00000000000..704d962d426 Binary files /dev/null and b/addons/mail/static/src/img/mimetypes/archive.png differ diff --git a/addons/mail/static/src/img/mimetypes/audio.png b/addons/mail/static/src/img/mimetypes/audio.png new file mode 100644 index 00000000000..6dd4c635fe7 Binary files /dev/null and b/addons/mail/static/src/img/mimetypes/audio.png differ diff --git a/addons/mail/static/src/img/mimetypes/binary.png b/addons/mail/static/src/img/mimetypes/binary.png new file mode 100644 index 00000000000..5708c9fc2a5 Binary files /dev/null and b/addons/mail/static/src/img/mimetypes/binary.png differ diff --git a/addons/mail/static/src/img/mimetypes/calendar.png b/addons/mail/static/src/img/mimetypes/calendar.png new file mode 100644 index 00000000000..81791af05e0 Binary files /dev/null and b/addons/mail/static/src/img/mimetypes/calendar.png differ diff --git a/addons/mail/static/src/img/mimetypes/certificate.png b/addons/mail/static/src/img/mimetypes/certificate.png new file mode 100644 index 00000000000..e48cb1de432 Binary files /dev/null and b/addons/mail/static/src/img/mimetypes/certificate.png differ diff --git a/addons/mail/static/src/img/mimetypes/disk.png b/addons/mail/static/src/img/mimetypes/disk.png new file mode 100644 index 00000000000..9c241cdf896 Binary files /dev/null and b/addons/mail/static/src/img/mimetypes/disk.png differ diff --git a/addons/mail/static/src/img/mimetypes/document.png b/addons/mail/static/src/img/mimetypes/document.png new file mode 100644 index 00000000000..fee2f1619b6 Binary files /dev/null and b/addons/mail/static/src/img/mimetypes/document.png differ diff --git a/addons/mail/static/src/img/mimetypes/font.png b/addons/mail/static/src/img/mimetypes/font.png new file mode 100644 index 00000000000..3b04787b9f9 Binary files /dev/null and b/addons/mail/static/src/img/mimetypes/font.png differ diff --git a/addons/mail/static/src/img/mimetypes/html.png b/addons/mail/static/src/img/mimetypes/html.png new file mode 100644 index 00000000000..440c5bc9972 Binary files /dev/null and b/addons/mail/static/src/img/mimetypes/html.png differ diff --git a/addons/mail/static/src/img/mimetypes/image.png b/addons/mail/static/src/img/mimetypes/image.png new file mode 100644 index 00000000000..ab2f84a1a54 Binary files /dev/null and b/addons/mail/static/src/img/mimetypes/image.png differ diff --git a/addons/mail/static/src/img/mimetypes/presentation.png b/addons/mail/static/src/img/mimetypes/presentation.png new file mode 100644 index 00000000000..8642a8e9298 Binary files /dev/null and b/addons/mail/static/src/img/mimetypes/presentation.png differ diff --git a/addons/mail/static/src/img/mimetypes/print.png b/addons/mail/static/src/img/mimetypes/print.png new file mode 100644 index 00000000000..fee2f1619b6 Binary files /dev/null and b/addons/mail/static/src/img/mimetypes/print.png differ diff --git a/addons/mail/static/src/img/mimetypes/script.png b/addons/mail/static/src/img/mimetypes/script.png new file mode 100644 index 00000000000..10c58c0bcc3 Binary files /dev/null and b/addons/mail/static/src/img/mimetypes/script.png differ diff --git a/addons/mail/static/src/img/mimetypes/spreadsheet.png b/addons/mail/static/src/img/mimetypes/spreadsheet.png new file mode 100644 index 00000000000..77a834697f1 Binary files /dev/null and b/addons/mail/static/src/img/mimetypes/spreadsheet.png differ diff --git a/addons/mail/static/src/img/mimetypes/text.png b/addons/mail/static/src/img/mimetypes/text.png new file mode 100644 index 00000000000..e65d2ec5a67 Binary files /dev/null and b/addons/mail/static/src/img/mimetypes/text.png differ diff --git a/addons/mail/static/src/img/mimetypes/unknown.png b/addons/mail/static/src/img/mimetypes/unknown.png new file mode 100644 index 00000000000..e65d2ec5a67 Binary files /dev/null and b/addons/mail/static/src/img/mimetypes/unknown.png differ diff --git a/addons/mail/static/src/img/mimetypes/vector.png b/addons/mail/static/src/img/mimetypes/vector.png new file mode 100644 index 00000000000..c4595ec1b24 Binary files /dev/null and b/addons/mail/static/src/img/mimetypes/vector.png differ diff --git a/addons/mail/static/src/img/mimetypes/video.png b/addons/mail/static/src/img/mimetypes/video.png new file mode 100644 index 00000000000..e3a87b5bde6 Binary files /dev/null and b/addons/mail/static/src/img/mimetypes/video.png differ diff --git a/addons/mail/static/src/img/mimetypes/webimage.png b/addons/mail/static/src/img/mimetypes/webimage.png new file mode 100644 index 00000000000..ab2f84a1a54 Binary files /dev/null and b/addons/mail/static/src/img/mimetypes/webimage.png differ diff --git a/addons/mail/static/src/js/mail.js b/addons/mail/static/src/js/mail.js index d5724921f41..46f8553f666 100644 --- a/addons/mail/static/src/js/mail.js +++ b/addons/mail/static/src/js/mail.js @@ -110,7 +110,8 @@ openerp.mail = function (session) { } return domain; - } + }, + }; @@ -124,6 +125,26 @@ openerp.mail = function (session) { */ mail.MessageCommon = session.web.Widget.extend({ + + /** + * ------------------------------------------------------------ + * FIXME: this comment was moved as is from the ThreadMessage Init as + * part of a refactoring. Check that it is still correct + * ------------------------------------------------------------ + * This widget handles the display of a messages in a thread. + * Displays a record and performs some formatting on the record : + * - record.date: formatting according to the user timezone + * - record.timerelative: relative time givein by timeago lib + * - record.avatar: image url + * - record.attachment_ids[].url: url of each attachmentThe + * thread view : + * - root thread + * - - sub message (parent_id = root message) + * - - - sub thread + * - - - - sub sub message (parent id = sub thread) + * - - sub message (parent_id = root message) + * - - - sub thread + */ init: function (parent, datasets, options) { this._super(parent, options); @@ -204,6 +225,66 @@ openerp.mail = function (session) { } }, + // inserts zero width space between each letter of a string so that + // the word will correctly wrap in html boxes smaller than the text + breakword: function(str){ + var out = ''; + for(var i = 0, len = str.length; i < len; i++){ + out += _.str.escapeHTML(str[i]) + '​'; + } + return out; + }, + + // returns the file type of a file based on its extension + // As it only looks at the extension it is quite approximative. + filetype: function(url){ + console.log(url); + url = url.name || url.filename || url; + var tokens = url.split('.'); + if(tokens.length <= 1){ + return 'unknown'; + } + var extension = tokens[tokens.length -1]; + if(extension.length === 0){ + return 'unknown'; + }else{ + extension = extension.toLowerCase(); + } + var filetypes = { + 'webimage': ['png','jpg','jpeg','jpe','gif'], // those have browser preview + 'image': ['tif','tiff','tga', + 'bmp','xcf','psd','ppm','pbm','pgm','pnm','mng', + 'xbm','ico','icon','exr','webp','psp','pgf','xcf', + 'jp2','jpx','dng','djvu','dds'], + 'vector': ['ai','svg','eps','vml','cdr','xar','cgm','odg','sxd'], + 'print': ['dvi','pdf','ps'], + 'document': ['doc','docx','odm','odt'], + 'presentation': ['key','keynote','odp','pps','ppt'], + 'font': ['otf','ttf','woff','eot'], + 'archive': ['zip','7z','ace','apk','bzip2','cab','deb','dmg','gzip','jar', + 'rar','tar','gz','pak','pk3','pk4','lzip','lz','rpm'], + 'certificate': ['cer','key','pfx','p12','pem','crl','der','crt','csr'], + 'audio': ['aiff','wav','mp3','ogg','flac','wma','mp2','aac', + 'm4a','ra','mid','midi'], + 'video': ['asf','avi','flv','mkv','m4v','mpeg','mpg','mpe','wmv','mp4','ogm'], + 'text': ['txt','rtf','ass'], + 'html': ['html','xhtml','xml','htm','css'], + 'disk': ['iso','nrg','img','ccd','sub','cdi','cue','mds','mdx'], + 'script': ['py','js','c','cc','cpp','cs','h','java','bat','sh', + 'd','rb','pl','as','cmd','coffee','m','r','vbs','lisp'], + 'spreadsheet': ['123','csv','ods','numbers','sxc','xls','vc','xlsx'], + 'binary': ['exe','com','bin','app'], + }; + for(filetype in filetypes){ + var ext_list = filetypes[filetype]; + for(var i = 0, len = ext_list.length; i < len; i++){ + if(extension === ext_list[i]){ + return filetype; + } + } + } + return 'unknown'; + }, /* get all child message id linked. * @return array of id @@ -282,7 +363,7 @@ openerp.mail = function (session) { display_attachments: function () { this.$(".oe_msg_attachment_list").html( session.web.qweb.render('mail.thread.message.attachments', {'widget': this}) ); // event: delete an attachment - this.$(".oe_msg_attachment_list").on('click', '.oe_mail_attachment_delete', this.on_attachment_delete); + this.$(".oe_msg_attachment_list").on('click', '.oe_delete', this.on_attachment_delete); }, /* when a user click on the upload button, send file read on_attachment_loaded @@ -591,46 +672,12 @@ openerp.mail = function (session) { return false; }, + }); - /** - * ------------------------------------------------------------ - * Thread Message Widget - * ------------------------------------------------------------ - * This widget handles the display of a messages in a thread. - * Displays a record and performs some formatting on the record : - * - record.date: formatting according to the user timezone - * - record.timerelative: relative time givein by timeago lib - * - record.avatar: image url - * - record.attachment_ids[].url: url of each attachmentThe - * thread view : - * - root thread - * - - sub message (parent_id = root message) - * - - - sub thread - * - - - - sub sub message (parent id = sub thread) - * - - sub message (parent_id = root message) - * - - - sub thread - */ mail.ThreadMessage = mail.MessageCommon.extend({ template: 'mail.thread.message', - /** - * INIT : - * @param {Object} parent parent - * @param {Array} [domain] - * @param {Object} [context] context of the thread. It should - contain at least default_model, default_res_id. Please refer to - the ComposeMessage widget for more information about it. - * @param {Object} [options] - * @param {Object} [thread] read obout mail.Thread object - * @param {Object} [message] - * @param {Number} [truncate_limit=250] number of character to - * display before having a "show more" link; note that the text - * will not be truncated if it does not have 110% of the parameter - * @param {Boolean} [show_record_name] - *... @param {boolean} [show_reply_button] display the reply button - *... @param {boolean} [show_read_unread_button] display the read/unread button - */ start: function () { this._super.apply(this, arguments); @@ -687,6 +734,11 @@ openerp.mail = function (session) { this.$el.on('click', '.oe_msg_vote', this.on_vote); // event: click on 'starred/favorite' button this.$el.on('click', '.oe_star', this.on_star); + + this.$el.on('click', '.oe_view_attachments', function(){ + console.log('toggle'); + self.$('.oe_msg_attachment_list').toggle(200); + }); }, /* Call the on_compose_message on the thread of this message. */ @@ -701,10 +753,10 @@ openerp.mail = function (session) { this.$('.oe_msg_body:first').expander({ slicePoint: this.options.truncate_limit, expandText: 'read more', - userCollapseText: 'ã', + userCollapseText: 'read less', detailClass: 'oe_msg_tail', moreClass: 'oe_mail_expand', - lessClass: 'oe_mail_reduce oe_e', + lessClass: 'oe_mail_reduce', }); }, diff --git a/addons/mail/static/src/xml/mail.xml b/addons/mail/static/src/xml/mail.xml index cdd83bd4c7d..02c29a3f1c2 100644 --- a/addons/mail/static/src/xml/mail.xml +++ b/addons/mail/static/src/xml/mail.xml @@ -70,33 +70,28 @@ Template used to display attachments in a mail.message --> - - -
- -
- ...Upload in progress... -
- - - - - - - - - [ - + + +
+ +
[
+
+
+ uploading +
- - - - - - + +
+ +
[
+
+
+ uploading +
+
- + @@ -213,18 +208,23 @@
- - -
+ +
+ +
+ • - + + • + 1 Attachment Attachments + •