diff --git a/addons/hr_attendance/__openerp__.py b/addons/hr_attendance/__openerp__.py
index c903a87abc4..1c4f38342ca 100644
--- a/addons/hr_attendance/__openerp__.py
+++ b/addons/hr_attendance/__openerp__.py
@@ -54,5 +54,10 @@ actions(Sign in/Sign out) performed by them.
     'installable': True,
     'auto_install': False,
     'certificate': '0063495605613',
+    
+    #web
+    "js": ["static/src/js/sign_in_out.js"],
+    "css":[],
+    'qweb' : ["static/src/xml/sign_in_out.xml"],
 }
 # vim:expandtab:smartindent:tabstop=4:softtabstop=4:shiftwidth=4:
diff --git a/addons/hr_attendance/hr_attendance_view.xml b/addons/hr_attendance/hr_attendance_view.xml
index 258177bfd5e..b29ea0202c3 100644
--- a/addons/hr_attendance/hr_attendance_view.xml
+++ b/addons/hr_attendance/hr_attendance_view.xml
@@ -130,8 +130,8 @@
                 <field name="coach_id" position="after">
                     <group colspan="2">
                         <field name="state"/>
-                        <button name="attendance_action_change" states="present" string="Sign Out" type="object" icon="gtk-go-forward" context="{'type':'sign_out'}" groups="base.group_hr_user"/>
-                        <button name="attendance_action_change" states="absent" string="Sign In" type="object" icon="gtk-go-back" context="{'type':'sign_in'}" groups="base.group_hr_user"/>
+                        <button name="attendance_action_change" states="present" string="Sign Out" type="object" widget="att_button" icon="gtk-go-forward" context="{'type':'sign_out'}" groups="base.group_hr_user"/>
+                        <button name="attendance_action_change" states="absent" string="Sign In" type="object" widget="att_button" icon="gtk-go-back" context="{'type':'sign_in'}" groups="base.group_hr_user"/>
                     </group>
                 </field>
             </field>
diff --git a/addons/hr_attendance/static/src/img/emp-in-disable.png b/addons/hr_attendance/static/src/img/emp-in-disable.png
new file mode 100644
index 00000000000..1968e0de464
Binary files /dev/null and b/addons/hr_attendance/static/src/img/emp-in-disable.png differ
diff --git a/addons/hr_attendance/static/src/img/emp-in.png b/addons/hr_attendance/static/src/img/emp-in.png
new file mode 100644
index 00000000000..26e3c01556b
Binary files /dev/null and b/addons/hr_attendance/static/src/img/emp-in.png differ
diff --git a/addons/hr_attendance/static/src/img/emp-out-disable.png b/addons/hr_attendance/static/src/img/emp-out-disable.png
new file mode 100644
index 00000000000..b7099e44529
Binary files /dev/null and b/addons/hr_attendance/static/src/img/emp-out-disable.png differ
diff --git a/addons/hr_attendance/static/src/img/emp-out.png b/addons/hr_attendance/static/src/img/emp-out.png
new file mode 100644
index 00000000000..d2a6cbb5013
Binary files /dev/null and b/addons/hr_attendance/static/src/img/emp-out.png differ
diff --git a/addons/hr_attendance/static/src/img/icon.png b/addons/hr_attendance/static/src/img/icon.png
new file mode 100644
index 00000000000..297dc71c85c
Binary files /dev/null and b/addons/hr_attendance/static/src/img/icon.png differ
diff --git a/addons/hr_attendance/static/src/js/sign_in_out.js b/addons/hr_attendance/static/src/js/sign_in_out.js
new file mode 100644
index 00000000000..b1262fa01d2
--- /dev/null
+++ b/addons/hr_attendance/static/src/js/sign_in_out.js
@@ -0,0 +1,108 @@
+openerp.hr_attendance = function(openerp) {
+	
+	openerp.hr.Attrs_Button  =  openerp.web.form.WidgetButton.extend({
+		init: function(view, node) {
+        	this._super(view, node);
+		},
+    	on_click: function() {
+    		var self=this;
+    		this._super();
+    	  	var state = this.node.attrs.states
+    			if (this.string === 'Sign Out'){
+         	  		openerp.webclient.user_menu.hr_sign_out.replace(openerp.webclient.$element.find('.oe_systray').children())
+    			}
+    			if (this.string === "Sign In"){
+                    openerp.webclient.user_menu.hr_sign_in.replace(openerp.webclient.$element.find('.oe_systray').children());
+        	  	}	
+    }
+    });
+    openerp.web.form.tags.add('att_button', 'openerp.hr.Attrs_Button');
+    
+    openerp.hr_attendance.SignIn = openerp.web.Widget.extend({
+        template: 'SignInNotifier',
+        init : function(parent, event){
+    		this._super(parent)
+    		this.event = event
+    	},
+        start: function() {
+            this.$element.on('click',   this.event);
+        },
+    });
+    
+    openerp.hr_attendance.SignOut = openerp.web.Widget.extend({
+        template: 'SignOutNotifier',
+        
+        init : function(parent, event){
+			this._super(parent)
+			this.event = event
+		},
+		
+		start: function() {
+            this.$element.on('click',   this.event);
+        },
+       
+    });
+    
+    openerp.hr_attendance.SignInOut = openerp.web.Widget.extend({
+        template: "SignInOutNotifier",
+        init: function() {
+            this._super.apply(this, arguments);
+            this.dataset = new openerp.web.DataSetSearch(
+                this,
+                'hr.employee',
+                this.session.user_context,
+                [['user_id','=', this.session.uid]]);
+        },
+        
+        start: function() {
+        	var self = this;
+        	//console.log('stttarrrttttt',this.dataset)
+            return this.dataset.read_slice(['state']).done(this.do_sign_in_out);
+        },
+        
+        do_sign_in_out: function(user) {
+            if(_.isEmpty(user)) return;
+            this.$element.html("");
+            if(user[0]['state'] === 'present') {
+                this.sign_out = new openerp.hr_attendance.SignOut(this, this.on_sign_in_out);                
+                this.sign_out.appendTo(this.$element);
+            } else {
+                this.sign_in = new openerp.hr_attendance.SignIn(this, this.on_sign_in_out);
+                this.sign_in.appendTo(this.$element);
+            }
+        },
+        
+        on_sign_in_out: function(evt) {
+            var self = this;
+            new openerp.web.DataSetSearch(
+                this, 
+                'ir.actions.act_window',
+                {},
+                [['res_model', '=', 'hr.sign.in.out']])
+            .read_slice().done(function(action) {
+            	console.log('action',action);
+                action = action[0];
+                action.context = JSON.parse(action.context);
+                var action_manager = new openerp.web.ActionManager(self);
+                action_manager.do_action(action, function() { 
+                	self.dataset.read_slice(['state']).done(self.do_sign_in_out);
+                	});
+            });
+        },
+    });
+    
+    
+    openerp.web.UserMenu.include({
+        do_update: function() {
+            var self = this;
+            this._super();
+            this.update_promise.then(function() {
+            	self.hr_sign_in_out = new openerp.hr_attendance.SignInOut(self);
+            	var event = self.hr_sign_in_out.on_sign_in_out
+            	self.hr_sign_in = new openerp.hr_attendance.SignIn(self, event)
+            	self.hr_sign_out = new openerp.hr_attendance.SignOut(self, event )
+                self.hr_sign_in_out.appendTo(openerp.webclient.$element.find('.oe_systray'))
+            });
+        }
+    });
+}
diff --git a/addons/hr_attendance/static/src/xml/sign_in_out.xml b/addons/hr_attendance/static/src/xml/sign_in_out.xml
new file mode 100644
index 00000000000..e28b93dfa6c
--- /dev/null
+++ b/addons/hr_attendance/static/src/xml/sign_in_out.xml
@@ -0,0 +1,28 @@
+<template>
+    <t t-name="SignInOutNotifier">
+        <div>
+            
+        </div>
+    </t>
+    <t t-name="SignInNotifier">
+        <div class="oe_hr_sign_in" title="SignIn">
+            <a class="sign_in" href="#">
+                <img 
+                    src='/hr_attendance/static/src/img/emp-in.png'
+                    width="30"
+                    height="30"/>
+            </a>
+        </div>
+    </t>
+    
+    <t t-name="SignOutNotifier">
+        <div class="oe_hr_sign_out" title="SignOut">
+            <a class="sign_out" href="#">
+                <img 
+                    src='/hr_attendance/static/src/img/emp-out.png'
+                    width="30"
+                    height="30"/>
+            </a>
+        </div>
+    </t>
+</template>
\ No newline at end of file
diff --git a/addons/hr_attendance/wizard/hr_attendance_sign_in_out.py b/addons/hr_attendance/wizard/hr_attendance_sign_in_out.py
index 55edb1406e8..15e8783d660 100644
--- a/addons/hr_attendance/wizard/hr_attendance_sign_in_out.py
+++ b/addons/hr_attendance/wizard/hr_attendance_sign_in_out.py
@@ -69,6 +69,7 @@ class hr_sign_in_out(osv.osv_memory):
     _columns = {
         'name': fields.char('Employees name', size=32, required=True, readonly=True),
         'state': fields.char('Current state', size=32, required=True, readonly=True),
+        'date': fields.datetime('Date'),
         'emp_id': fields.many2one('hr.employee', 'Empoyee ID', readonly=True),
                 }
 
diff --git a/addons/hr_attendance/wizard/hr_attendance_sign_in_out_view.xml b/addons/hr_attendance/wizard/hr_attendance_sign_in_out_view.xml
index 5121a2d18a0..de57ede7d77 100644
--- a/addons/hr_attendance/wizard/hr_attendance_sign_in_out_view.xml
+++ b/addons/hr_attendance/wizard/hr_attendance_sign_in_out_view.xml
@@ -7,18 +7,18 @@
             <field name="type">form</field>
             <field name="arch" type="xml">
                 <form string="Sign in / Sign out">
-                    <separator colspan="4" string="Sign in / Sign out"/>
                     <label colspan="4" nolabel="1" string="If you need your staff to sign in when they arrive at work and sign out again at the end of the day, OpenERP allows you to manage this with this tool. If each employee has been linked to a system user, then they can encode their time with this action button."/>
                     <newline/>
-                    <group colspan="4" >
-                    <field name="name" />
-                    <field name="state" />
+                    <group colspan="4" col="6">
+                        <field name="date"/>
+                        <field name="name" />
+                        <field name="state" />
                     </group>
                     <separator colspan="4"/>
                     <group colspan="4" col="6">
                         <button icon="gtk-cancel" special="cancel" string="Cancel"/>
-                        <button icon="terp-gtk-jump-to-ltr" string="Sign in" name="si_check" type="object"/>
-                        <button icon="terp-gtk-jump-to-rtl" string="Sign out" name="so_check" type="object"/>
+                        <button icon="terp-gtk-jump-to-ltr" string="Sign in" widget="att_button" name="si_check" type="object" attrs="{'invisible':[('state','=','present')]}"/>
+                        <button icon="terp-gtk-jump-to-rtl" string="Sign out" widget="att_button" name="so_check" type="object" attrs="{'invisible':[('state','=','absent')]}"/>
                    </group>
                </form>
             </field>
@@ -65,7 +65,7 @@
                     <separator colspan="4" />
                     <group colspan="4" col="6">
                         <button icon="gtk-cancel" special="cancel" string="Cancel"/>
-                        <button icon="gtk-go-back" string="Sign in" name="sign_in" type="object"/>
+                        <button icon="gtk-go-back" string="Sign in" name="sign_in" widget="att_button" type="object"/>
                    </group>
                </form>
             </field>
@@ -85,7 +85,7 @@
                     <separator colspan="4" />
                     <group colspan="4" col="6">
                         <button icon="gtk-cancel" special="cancel" string="Cancel"/>
-                        <button icon="gtk-go-back" string="Sign out" name="sign_out" type="object"/>
+                        <button icon="gtk-go-back" string="Sign out" name="sign_out" widget="att_button" type="object"/>
                    </group>
                </form>
             </field>
diff --git a/addons/hr_timesheet_sheet/hr_timesheet_sheet_view.xml b/addons/hr_timesheet_sheet/hr_timesheet_sheet_view.xml
index d822f10d944..21d47fae848 100644
--- a/addons/hr_timesheet_sheet/hr_timesheet_sheet_view.xml
+++ b/addons/hr_timesheet_sheet/hr_timesheet_sheet_view.xml
@@ -91,8 +91,8 @@
                             </field>
                             <group col="4" colspan="1">
                                 <field name="state_attendance"/>
-                                <button name="sign_in" string="Sign In" type="object" icon="terp-gtk-jump-to-ltr"/>
-                                <button name="sign_out" string="Sign Out" type="object" icon="terp-gtk-jump-to-rtl"/>
+                                <button name="sign_in" string="Sign In" type="object" icon="terp-gtk-jump-to-ltr" widget="att_button"/>
+                                <button name="sign_out" string="Sign Out" type="object" icon="terp-gtk-jump-to-rtl" widget="att_button"/>
                                 <field name="total_attendance_day" widget="float_time" colspan="4"/>
                             </group>
                             <field colspan="4" context="{'date':date_current,'user_id':user_id}" domain="[('name','=',date_current)]" name="timesheet_ids" nolabel="1">