Added status notification

bzr revid: nicolas.vanhoren@openerp.com-20121203170412-h1fgkwa08tq6a5aw

addons/web_im/static/src/css/im.css

@@ -57,6 +57,7 @@
     padding-bottom: 38px;
 }
 .openerp .oe_im_user {
+    position: relative;
     padding: 2px 6px;
     cursor: pointer;
     font-size: 13px;
@@ -88,6 +89,17 @@
     position: relative;
 }
 
+.openerp .oe_im_user_online {
+    display: none;
+    position: absolute;
+    top: 9.5px;
+    right: 11px;
+    width: 11px;
+    height: 11px;
+    vertical-align: middle;
+    border: 0;
+}
+
 /* conversations */
 
 .openerp .oe_im_chatview {
@@ -106,6 +118,14 @@
 }
 .openerp .oe_im_chatview .oe_im_chatview_disconnected {
     display:none;
+    position: absolute;
+    z-index: 100;
+    width: 100%;
+    background: #E8EBEF;
+    padding: 5px;
+    font-size: 11px;
+    color: #999;
+    line-height: 14px;
 }
 .openerp .oe_im_chatview .oe_im_chatview_header {
     padding: 3px 6px 2px;
@@ -214,3 +234,10 @@
     margin: 0 0 2px 30px;
     line-height: 14px;
 }
+
+.openerp .oe_im_chatview_online {
+    display: none;
+    margin-top: -4px;
+    width: 11px;
+    height: 11px;
+}

addons/web_im/static/src/js/im.js

@@ -90,7 +90,7 @@ openerp.web_im = function(instance) {
         search_changed: function(e) {
             var users = new instance.web.Model("res.users");
             var self = this;
-            return this.user_search_dm.add(users.query(["name"])
+            return this.user_search_dm.add(users.query(["name", "im_status"])
                     .filter([["name", "ilike", this.get("current_search")]])
                     .limit(USERS_LIMIT).all()).then(function(result) {
                 self.add_to_user_cache(result);
@@ -118,7 +118,7 @@ openerp.web_im = function(instance) {
             if (_.size(no_cache) === 0)
                 return $.when();
             else
-                return new instance.web.Model("res.users").call("read", [_.values(no_cache), ["name"]],
+                return new instance.web.Model("res.users").call("read", [_.values(no_cache), ["name", "im_status"]],
                         {context: new instance.web.CompoundContext()}).then(function(users) {
                     self.add_to_user_cache(users);
                 });
@@ -201,6 +201,13 @@ openerp.web_im = function(instance) {
             this.user = user;
             this.user.add_watcher();
         },
+        start: function() {
+            var change_status = function() {
+                this.$(".oe_im_user_online").toggle(this.user.get("im_status") === true);
+            };
+            this.user.on("change:im_status", this, change_status);
+            change_status.call(this);
+        },
         activate_user: function() {
             this.trigger("activate_user", this.user);
         },
@@ -289,6 +296,13 @@ openerp.web_im = function(instance) {
             this.shown = true;
         },
         start: function() {
+            var change_status = function() {
+                this.$(".oe_im_chatview_online").toggle(this.user.get("im_status") === true);
+                this.$(".oe_im_chatview_disconnected").toggle(this.user.get("im_status") === false);
+            };
+            this.user.on("change:im_status", this, change_status);
+            change_status.call(this);
+
             this.on("change:right_position", this, this.calc_pos);
             this.full_height = this.$el.height();
             this.calc_pos();

addons/web_im/static/src/xml/im.xml

@@ -24,11 +24,13 @@
                 <img t-att-src='widget.user.get("image_url")' class="oe_im_user_avatar"/>
             </span>
             <span class="oe_im_user_name"><t t-esc="widget.user.get('name')"/></span>
+            <img t-att-src="_s +'/web_im/static/src/img/green.png'" class="oe_im_user_online"/>
         </div>
     </t>
     <t t-name="Conversation">
         <div class="oe_im_chatview">
             <div class="oe_im_chatview_header">
+                <img t-att-src="_s +'/web_im/static/src/img/green.png'" class="oe_im_chatview_online"/>
                 <t t-esc="widget.user.get('name')"/>
                 <button class="oe_im_chatview_close">×</button>
             </div>