[MERGE] with trunk-openchatter-fva (no fixing js<->DOM)

bzr revid: chm@openerp.com-20121017111633-82tmz011tgu34f9q
This commit is contained in:
Christophe Matthieu 2012-10-17 13:16:33 +02:00
commit 97f51c1adf
3 changed files with 106 additions and 502 deletions

View File

@ -1,439 +1,64 @@
/* ------------------------------------------------------------ */
/* Reset because of ugly display of end of August
/* ------------------------------------------------------------ */
.openerp .oe_mail_wall ul, .openerp .oe_mail_wall li {
list-style-type: none;
padding: 0;
margin: 0;
.openerp .oe_mail, .openerp .oe_mail *{
box-sizing: border-box;
}
.openerp .oe_chatter ul, .openerp .oe_chatter li {
list-style-type: none;
padding: 0;
margin: 0;
}
/* ------------------------------------------------------------ */
/* Wall
/* ------------------------------------------------------------ */
.openerp div.oe_mail_wall {
overflow: auto;
padding: 0;
background: white;
}
.openerp div.oe_mail_wall div.oe_mail_wall_aside {
margin-left: 565px;
margin: 8px;
}
.openerp div.oe_mail_wall ul.oe_mail_wall_threads {
float: left;
.openerp .oe_mail {
position: relative;
width: 560px;
margin: 8px;
list-style-type: none;
}
/* ------------------------------------------------------------ */
/* Followers
/* ------------------------------------------------------------ */
.openerp div.oe_mail_recthread_aside h4 {
display: inline-block;
}
.openerp div.oe_mail_recthread_aside button {
position: relative;
}
.openerp div.oe_mail_recthread_aside label,
.openerp div.oe_mail_recthread_aside input {
cursor:pointer;
}
/* Specific display of threads in the wall */
/* ------------------------------------------------------------ */
.openerp ul.oe_mail_wall_threads .oe_msg_content textarea.oe_mail_compose_textarea {
width: 434px;
height: 30px;
padding: 4px;
}
.openerp li.oe_mail_wall_thread:first .oe_msg_notification {
border-top: 0;
}
.openerp div.oe_thread_placeholder img {
width: 28px;
height: 28px;
}
.openerp div.oe_thread_placeholder div.oe_msg_content {
width: 440px;
}
/* ------------------------------------------------------------ */
/* RecordThread
/* ------------------------------------------------------------ */
.openerp .oe_form div.oe_chatter {
overflow: auto;
}
.openerp .oe_mail_record_wall {
margin: auto;
width: 560px;
}
.openerp .oe_mail_record_wall > .oe_mail_wall_threads {
float: left;
}
.openerp div.oe_mail_recthread_aside {
float: right;
width: 250px;
}
.openerp div.oe_mail_recthread_actions {
margin-bottom: 8px;
}
.openerp div.oe_mail_recthread_actions button {
width: 120px;
}
.openerp .oe_mail_recthread_aside .oe_follower.oe_follow {
color: white;
background-color: #8a89ba;
background-image: -webkit-gradient(linear, left top, left bottom, from(#8a89ba), to(#807fb4));
background-image: -webkit-linear-gradient(top, #8a89ba, #807fb4);
background-image: -moz-linear-gradient(top, #8a89ba, #807fb4);
background-image: -ms-linear-gradient(top, #8a89ba, #807fb4);
background-image: -o-linear-gradient(top, #8a89ba, #807fb4);
background-image: linear-gradient(to bottom, #8a89ba, #807fb4);
}
.openerp .oe_mail_recthread_aside .oe_follower.oe_following {
color: white;
background-color: #dc5f59;
background-image: -webkit-gradient(linear, left top, left bottom, from(#dc5f59), to(#b33630));
background-image: -webkit-linear-gradient(top, #dc5f59, #b33630);
background-image: -moz-linear-gradient(top, #dc5f59, #b33630);
background-image: -ms-linear-gradient(top, #dc5f59, #b33630);
background-image: -o-linear-gradient(top, #dc5f59, #b33630);
background-image: linear-gradient(to bottom, #dc5f59, #b33630);
}
.openerp .oe_mail_recthread_aside .oe_follower span {
display:none;
}
.openerp .oe_mail_recthread_aside .oe_following span.oe_following,
.openerp .oe_mail_recthread_aside .oe_notfollow span.oe_follow {
display:block;
}
.openerp div.oe_mail_recthread_followers {
margin-bottom: 8px;
}
/* ------------------------------------------------------------ */
/* subtypes
/* ------------------------------------------------------------ */
.openerp .oe_mouse_subtypes {
display:inline-block;
position: relative;
z-index: 5;
}
.openerp .oe_mouse_subtypes .oe_recthread_subtypes {
background: #fff;
padding: 2px;
border: 1px solid #aaaaaa;
border-top: 0px;
position: absolute;
z-index: 2;
}
.openerp .oe_mouse_subtypes.oe_mouseout .oe_recthread_subtypes {
display: none;
}
.openerp .oe_mouse_subtypes.oe_mouseover .oe_recthread_subtypes {
display: block;
}
/* ------------------------------------------------------------ */
/* Thread
/* ------------------------------------------------------------ */
.openerp div.oe_mail_thread_action {
white-space: normal;
padding: 8px;
z-index:5;
background: #fff;
}
.openerp div.oe_mail_thread_action:after {
content: "";
display: block;
clear: both;
}
/* default textarea (oe_mail_compose_textarea), and body textarea for compose form view */
.openerp .oe_msg_content textarea.oe_mail_compose_textarea:focus,
.openerp .oe_msg_content div.oe_mail_compose_message_body textarea:focus {
outline: 0;
border-color: rgba(82, 168, 236, 0.8);
-moz-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1), 0 0 8px rgba(82, 168, 236, 0.6);
-webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1), 0 0 8px rgba(82, 168, 236, 0.6);
-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1), 0 0 8px rgba(82, 168, 236, 0.6);
}
.openerp .oe_mail_vote_count,
.openerp .oe_msg_vote{
vertical-align: bottom;
}
.openerp button.oe_mail_starbox{
background: #ff0000;
}
.openerp button.oe_mail_starbox.oe_stared{
background: #00FF00;
}
.openerp div.oe_mail_thread_display {
white-space: normal;
}
.openerp div.oe_thread_placeholder {
margin-left: 66px;
}
.openerp li.oe_mail_thread_msg {
width: 560px;
}
.openerp div.oe_thread_placeholder li.oe_mail_thread_msg:last-child {
margin-bottom: 8px;
}
.openerp div.oe_mail_thread_more {
display: none;
border-bottom: 1px solid #D2D9E7;
}
.openerp li.oe_mail_thread_msg:after {
content: "";
display: block;
clear: both;
}
.openerp li.oe_mail_thread_msg.oe_mail_read,
.openerp li.oe_mail_thread_msg.oe_mail_read div {
border-left: #F0F0F0;
}
.openerp li.oe_mail_thread_msg.oe_mail_read li.oe_mail_thread_msg.oe_mail_unread,
.openerp li.oe_mail_thread_msg.oe_mail_read li.oe_mail_thread_msg.oe_mail_unread div {
background-color: #F6F6F6;
}
.openerp li.oe_mail_thread_msg.oe_mail_unread>div>ul>li.oe_unread,
.openerp li.oe_mail_thread_msg.oe_mail_read>div>ul>li.oe_read {
display: none;
}
.openerp li.oe_mail_thread_msg > div:after {
content: "";
display: block;
clear: both;
}
.openerp div.oe_mail_msg {
padding: 0;
margin: 0 0 4px 0;
}
.openerp .oe_msg_notification,
.openerp .oe_msg_expandable,
.openerp .oe_msg_comment,
.openerp .oe_msg_email {
padding: 8px;
background: white;
position: relative;
}
.openerp .oe_msg_notification:after,
.openerp .oe_msg_comment:after,
.openerp .oe_msg_email:after {
content: "";
display: block;
clear: both;
}
.openerp div.oe_msg_content {
float: left;
position: relative;
width: 486px;
}
.openerp div.oe_msg_content > li {
float: left;
margin-right: 3px;
}
.openerp .oe_msg_content:after {
content: "";
display: block;
clear: both;
}
.openerp .oe_chatter a {
cursor: pointer;
}
.openerp img.oe_mail_icon {
width: 50px;
height: 50px;
}
.openerp img.oe_mail_thumbnail {
width: 28px;
height: 28px;
margin: 4px;
}
.openerp img.oe_mail_frame {
text-align: center;
overflow: hidden;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
-o-border-radius: 3px;
-ms-border-radius: 3px;
margin: 20px;
background: #EEE;
border: solid 1px #ccc;
border-radius: 3px;
-moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
-webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
-o-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
clip: rect(5px, 40px, 45px, 0px);
padding: 8px;
}
.openerp .oe_mail_invisible {
display: none;
.openerp .oe_mail .oe_thread{
margin-left: 8px;
}
/* ------------------------------------------------------------ */
/* Messages layout
/* ------------------------------------------------------------ */
.openerp .oe_mail_msg .oe_msg_title {
margin: 0;
font-size: 1.3em;
font-weight: bold;
.openerp .oe_mail .oe_thread.oe_root_thread{
margin-left: 0px;
}
.openerp .oe_mail_msg .oe_msg_title a:link,
.openerp .oe_mail_msg .oe_msg_title a:visited {
color: #4C4C4C;
text-decoration: none;
}
.openerp .oe_mail_msg .oe_msg_body {
margin-bottom: .5em;
text-align: justify;
}
.openerp .oe_mail_msg .oe_msg_body pre {
font-family: "Lucida Grande", Helvetica, Verdana, Arial, sans-serif;
margin: 0px;
white-space: pre-wrap;
display: inline;
}
/* Read more/less link */
.openerp .oe_mail_msg span.oe_mail_reduce {
position: absolute;
right: 0;
}
/* Dropdown menu */
.openerp .oe_mail ul.oe_mail_thread_display ul.oe_mail_thread_display {
.openerp .oe_mail .oe_msg{
position: relative;
border-left: 1px #DDD dashed;
background: blue;
margin-bottom: 4px;
min-height: 100px;
}
.openerp .oe_mail ul.oe_header {
.openerp .oe_mail .oe_msg .oe_msg_left{
position: absolute;
right: 3px;
top: -6px;
z-index: 10;
left:0; top: 0; bottom: 0; width: 75px;
background: red;
overflow: hidden;
}
.openerp .oe_mail ul.oe_header a {
.openerp .oe_mail .oe_msg .oe_msg_center{
position: relative;
display: block;
margin-left: 75px;
margin-right: 32px;
background: gray;
}
.openerp .oe_mail .oe_msg .oe_msg_right{
position: absolute;
right:0; top:0; bottom: 0; width: 32px;
background: fuchsia;
overflow: hidden;
}
.openerp .oe_mail .oe_msg .oe_msg_footer{
height: 32px;
background: purple;
overflow: hidden;
}
.openerp .oe_mail .oe_msg .oe_msg_content{
display: block;
background: yellow;
}
.openerp .oe_mail .oe_msg .oe_msg_icons a{
text-decoration: none;
display: block;
text-align: center;
}
.openerp .oe_mail ul.oe_header>li {
display: inline-block;
height: 20px;
text-align: right;
}
/* Message footer */
.openerp .oe_mail_msg .oe_msg_footer {
color: #888;
}
.openerp .oe_mail_msg .oe_msg_footer li {
float: left;
margin-right: 3px;
}
.openerp .oe_mail_msg .oe_msg_footer li:after {
content: " · ";
}
.openerp .oe_mail_msg .oe_msg_footer li:last-child:after {
content: "";
}
/* Attachments list */
.openerp .oe_msg_content ul.oe_msg_attachments {
.openerp .oe_mail .oe_msg .oe_msg_content textarea{
width: 100%;
margin: .5em 0 0 0;
padding: .5em 0;
list-style-position: inside;
height: 100%;
margin: 0px;
padding: 0px;
resize: vertical;
}
.openerp .oe_msg_content ul.oe_msg_attachments.oe_hidden {
display: none;
}
.openerp .oe_msg_content ul.oe_msg_attachments li {
float: none;
height: 20px;
line-height: 20px;
margin: 0;
padding: 0;
list-style-type: square;
}
.openerp .oe_msg_content ul.oe_msg_attachments .oe_upload_in_process {
float: right;
width: 200px;
height: 16px;
}
.openerp .oe_msg_content ul.oe_msg_attachments .oe_upload_in_process div {
float: left;
width: 38px;
height: 16px;
margin-right: 2px;
background: #66FF66;
}
.openerp .oe_msg_content ul.oe_msg_attachments .oe_upload_in_process span {
color: #aaaaaa;
position: absolute;
}
/* ------------------------------------------------------------ */
/* Topbar button
/* ------------------------------------------------------------ */
.openerp .oe_topbar .oe_topbar_compose_full_email {
float: right;
margin: 3px 25px 0 0;
}

View File

@ -639,7 +639,7 @@ openerp.mail = function(session) {
}
);
/*insert thread in parent message*/
self.thread.appendTo(self.$el.find('div.oe_thread_placeholder'));
self.thread.replace(self.$('.oe_thread_placeholder'));
},
animated_destroy: function(options) {
@ -1140,7 +1140,6 @@ openerp.mail = function(session) {
_(thread.get_childs( nb_thread_level )).each(function (val, key) { thread_messages.push(val.parent_message); });
}
// check older and newer message for insert
var parent_newer = false;
var parent_older = false;
@ -1377,7 +1376,6 @@ openerp.mail = function(session) {
bind_events: function(){
var self=this;
this.$("button.oe_write_full:first").click(function(){ self.thread.ComposeMessage.on_compose_fullmail(); });
this.$("button.oe_write_onwall:first").click(function(){ self.thread.ComposeMessage.$el.toggle(); });
}
});

View File

@ -1,6 +1,12 @@
<?xml version="1.0" encoding="UTF-8"?>
<template>
<!-- this template contains the mail widget and is used to namespace the css -->
<t t-name="mail">
<div class="oe_mail">
</div>
</t>
<!--
mail.compose_message template
This template holds the composition form to write a note or send
@ -9,24 +15,22 @@
for main thread composition form in document form view.
-->
<t t-name="mail.compose_message">
<div class="oe_mail_compose_textarea">
<img class="oe_mail_icon oe_mail_frame oe_left" alt="User img"/>
<div class="oe_msg_content">
<!-- contains the composition form -->
<!-- default content: old basic textarea -->
<div class="oe_mail_post_header">
<t t-call="mail.thread.list_recipients"/>
<a class="oe_cancel oe_e">X</a>
</div>
<textarea class="field_text" placeholder="Add your comment here..."/>
<div class="oe_mail_post_footer">
<div class="oe_mail_compose_attachment_list"/>
<button class="oe_full">Full mail message</button>
<button class="oe_post">Post message</button>
<div class="oe_msg oe_msg_composer">
<div class="oe_msg_left">
<img class="oe_msg_icon" alt="User img"/>
</div>
<div class="oe_msg_center">
<div class="oe_msg_content">
<textarea class="field_text" placeholder="Add your comment here..."/>
</div><div class="oe_msg_footer">
<div class="oe_msg_attachment_list"/>
<button class="oe_post">Post</button>
<t t-call="mail.compose_message.add_attachment"/>
<t t-call="mail.thread.list_recipients"/>
<!--<a class="oe_cancel oe_e">X</a>-->
<button class="oe_full oe_right">Full</button>
</div>
</div>
<div class="oe_clear"/>
</div>
</t>
@ -164,89 +168,66 @@
</ul>
</div>
<!--
thread template
This template holds a thread of comments. It begins with an actions
container, holding the composition form. Then come the various
messages. Then comes the 'more' button.
-->
<div t-name="mail.thread" class="oe_mail oe_mail_thread oe_semantic_html_override">
<div class="oe_mail_thread_action">
<!-- contains the composition box (form + image) -->
</div>
<ul class="oe_mail_thread_display">
<!-- contains the threads -->
</ul>
<div t-name="mail.thread" t-attf-class="oe_thread #{widget.root?'oe_root_thread':''} ">
</div>
<!-- default layout -->
<li t-name="mail.thread.message" t-attf-class="oe_mail oe_mail_thread_msg #{widget.datasets.to_read ?'oe_mail_unread':'oe_mail_read'}">
<div t-attf-class="oe_msg_#{widget.datasets.type} oe_semantic_html_override">
<t t-name="mail.thread.message">
<div t-attf-class="oe_msg oe_msg_#{widget.type} oe_msg#{widget.unread?'unread':'read'}">
<!-- message actions (read/unread, reply, delete...) -->
<ul class="oe_header">
<li class="placeholder-mail-vote"><t t-call="mail.thread.message.vote"/></li>
<li class="placeholder-mail-star"><t t-call="mail.thread.message.star"/></li>
<li t-if="widget.datasets.show_read_unread" title="Read" class="oe_read"><a class="oe_read oe_e">W</a></li>
<li t-if="widget.datasets.show_read_unread" title="Set back to unread" class="oe_unread"><a class="oe_unread oe_e">h</a></li>
<li title="Quick reply" t-if="widget.datasets.show_reply"><a class="oe_reply oe_e">)</a></li>
<t t-if="(widget.datasets.is_author and widget.options.message.show_dd_delete) or widget.datasets.type == 'email'">
<li>
<span class="oe_dropdown_toggle">
<a class="oe_e" title="More options">í</a>
<ul class="oe_dropdown_menu">
<li t-if="widget.datasets.is_author and widget.options.message.show_dd_delete"><a class="oe_msg_delete">Delete</a></li>
<li t-if="widget.datasets.type == 'email'"><a class="oe_msg_details" t-attf-href="#model=mail.message&amp;id=#{widget.datasets.id}" >Details</a></li>
</ul>
</span>
</li>
</t>
</ul>
<div class='oe_msg_right'>
<div class="oe_msg_icons">
<span class="placeholder-mail-vote"><t t-call="mail.thread.message.vote"/></span>
<span class="placeholder-mail-star"><t t-call="mail.thread.message.star"/></span>
<a t-if="widget.datasets.show_read_unread" title="Read" class="oe_read oe_e">W</a>
<a t-if="widget.datasets.show_read_unread" title="Set back to unread" class="oe_unread oe_e">h</a>
<a t-if="widget.datasets.show_reply" title="Reply" class="oe_reply oe_e">)</a>
</div>
</div>
<a t-attf-href="#model=res.partner&amp;id=#{widget.datasets.author_id[0]}" t-att-title="widget.datasets.author_id[1]">
<img class="oe_mail_icon oe_mail_frame oe_left" t-att-src="widget.datasets.avatar"/>
</a>
<div class='oe_msg_left'>
<a t-attf-href="#model=res.partner&amp;id=#{widget.datasets.author_id[0]}" t-att-title="widget.datasets.author_id[1]">
<img class="oe_msg_icon" t-att-src="widget.datasets.avatar"/>
</a>
</div>
<div class="oe_msg_content">
<div class="oe_msg_center">
<!-- message itself -->
<div class="oe_mail_msg">
<h1 t-if="widget.datasets.subject" class="oe_msg_title">
<t t-raw="widget.datasets.subject"/>
</h1>
<ul class="oe_msg_footer">
<li t-if="widget.datasets.author_id"><a t-attf-href="#model=res.partner&amp;id=#{widget.datasets.author_id[0]}"><t t-raw="widget.datasets.author_id[1]"/></a></li>
<li><span t-att-title="widget.datasets.date"><t t-raw="widget.datasets.timerelative"/></span></li>
<li t-if="widget.datasets.attachment_ids.length > 0">
<a class="oe_msg_view_attachments">
<t t-if="widget.datasets.attachment_ids.length == 1">1 Attachment</t>
<t t-if="widget.datasets.attachment_ids.length > 1"><t t-raw="widget.datasets.attachment_ids.length"/> Attachments</t>
</a>
</li>
</ul>
<div class="oe_clear"/>
<div class="oe_msg_body">
<t t-if="widget.options.message.show_record_name and widget.datasets.record_name and (!widget.datasets.subject) and !widget.options.thread.thread_level and !widget.options.thread.display_on_thread[0] and widget.datasets.model!='res.partner'">
<a class="oe_mail_action_model" t-attf-href="#model=#{widget.datasets.model}&amp;id=#{widget.res_id}"><t t-raw="widget.datasets.record_name"/></a>
<a class="oe_mail_action_model" t-attf-href="#model=#{widget.datasets.model}&amp;id=#{widget.datasets.res_id}"><t t-raw="widget.datasets.record_name"/></a>
</t>
<t t-raw="widget.datasets.body"/>
</div>
<t t-if="widget.datasets.attachment_ids.length > 0">
<div class="oe_clear"></div>
<t t-call="mail.thread.message.attachments"/>
</t>
</div>
<div class="oe_msg_footer">
<a t-if="widget.datasets.author_id" t-attf-href="#model=res.partner&amp;id=#{widget.datasets.author_id[0]}"><t t-raw="widget.datasets.author_id[1]"/></a>
<span t-att-title="widget.datasets.date"><t t-raw="widget.datasets.timerelative"/></span>
<a t-if="widget.datasets.attachment_ids.length > 0" class="oe_mail_msg_view_attachments">
<t t-if="widget.datasets.attachment_ids.length == 1">1 Attachment</t>
<t t-if="widget.datasets.attachment_ids.length > 1"><t t-raw="widget.datasets.attachment_ids.length"/> Attachments</t>
</a>
<t t-call="mail.thread.message.vote"/>
</div>
</div>
</div>
<div class="oe_thread_placeholder"></div>
</li>
</t>
<!-- expandable message layout -->
<li t-name="mail.thread.expandable" class="oe_mail oe_mail_thread_msg oe_mail_unread">
<div t-attf-class="oe_msg_#{widget.datasets.type} oe_semantic_html_override">
<t t-name="mail.thread.expandable">
<div t-attf-class="oe_msg oe_msg_#{widget.datasets.type} oe_msg_unread">
<div class="oe_msg_content oe_msg_more_message">
<a class="oe_mail_fetch_more">Load more messages <span t-if="widget.datasets.nb_messages>0">(<t t-raw="widget.datasets.nb_messages"/> messages not display)</span>...</a>
<a class="oe_msg_fetch_more">Load more messages <span t-if="widget.datasets.nb_messages>0">(<t t-raw="widget.datasets.nb_messages"/> messages not display)</span>...</a>
</div>
</div>
</li>
</t>
<!--
mail.compose_message.button_top_bar
@ -271,13 +252,13 @@
<t t-esc="widget.datasets.vote_user_ids.length"/> people
</t>
<t t-if='widget.datasets.vote_user_ids.length > 0'>
agree
concur
</t>
</span>
<button t-attf-class="oe_msg_vote oe_tag">
<span>
<t t-if="!widget.has_voted">Agree</t>
<t t-if="widget.has_voted">Undo</t>
<t t-if="!widget.datasets.has_voted">Concur</t>
<t t-if="widget.datasets.has_voted">Respectfully disagree</t>
</span>
</button>
</span>