From e70c58f27d021cb5965080d6c051690bb5c11d62 Mon Sep 17 00:00:00 2001
From: Daniel Berteaud <daniel@firewall-services.com>
Date: Wed, 18 Feb 2015 18:36:13 +0100
Subject: [PATCH] Fix buttons state handling

---
 public/js/vroom.js             | 18 ++++++++----------
 templates/default/join.html.ep |  7 +++----
 2 files changed, 11 insertions(+), 14 deletions(-)

diff --git a/public/js/vroom.js b/public/js/vroom.js
index 569415f..ad59c95 100644
--- a/public/js/vroom.js
+++ b/public/js/vroom.js
@@ -607,7 +607,7 @@ function initVroom(room) {
 
   // Hide screen sharing btn if not supported, disable it on mobile
   if (!webrtc.capabilities.supportScreenSharing || !$.browser.desktop){
-    $('#shareScreenLabel').remove();
+    $('.btn-share-screen').remove();
   }
 
   // Return the number of peers in the room
@@ -1697,8 +1697,8 @@ function initVroom(room) {
   });
 
   // ScreenSharing
-  $('#shareScreenButton').change(function() {
-    var action = ($(this).is(":checked")) ? 'share':'unshare';
+  $('.btn-share-screen').click(function() {
+    var action = ($(this).hasClass('btn-danger')) ? 'unshare':'share';
     function cantShare(err){
       $.notify(err, 'error');
       return;
@@ -1730,12 +1730,12 @@ function initVroom(room) {
           else{
             cantShare(locale.CANT_SHARE_SCREEN);
           }
-          $('#shareScreenLabel').removeClass('active');
+          $('.btn-share-screen').removeClass('active');
           return;
         }
         // Screen sharing worked, warn that everyone can see it
         else{
-          $("#shareScreenLabel").addClass('btn-danger');
+          $('.btn-share-screen').addClass('btn-danger').button('toggle');
           peers.local.screenShared = true;
           $.notify(locale.EVERYONE_CAN_SEE_YOUR_SCREEN, 'info');
         }
@@ -1744,7 +1744,7 @@ function initVroom(room) {
     else{
       peers.local.screenShared = false;
       webrtc.stopScreenShare();
-      $('#shareScreenLabel').removeClass('btn-danger');
+      $('.btn-share-screen').removeClass('btn-danger').button('toggle');
       $.notify(locale.SCREEN_UNSHARED, 'info');
     }
   });
@@ -1760,8 +1760,7 @@ function initVroom(room) {
       unmuteMic();
       $.notify(locale.MIC_UNMUTED, 'info');
     }
-    $('.btn-mute-mic').toggleClass('btn-danger');
-    $('.btn-mute-mic').button('toggle');
+    $('.btn-mute-mic').toggleClass('btn-danger').button('toggle');
   });
 
   // Disable suspend webcam button if no webcam
@@ -1780,8 +1779,7 @@ function initVroom(room) {
       resumeCam();
       $.notify(locale.CAM_RESUMED, 'info');
     }
-    $('.btn-suspend-cam').toggleClass('btn-danger');
-    $('.btn-suspend-cam').button('toggle');
+    $('.btn-suspend-cam').toggleClass('btn-danger').button('toggle');
   });
 
   // Handle auth to become room owner
diff --git a/templates/default/join.html.ep b/templates/default/join.html.ep
index 43df020..34e740f 100644
--- a/templates/default/join.html.ep
+++ b/templates/default/join.html.ep
@@ -69,7 +69,7 @@
           </div>
         </div>
         <% } %>
-        <div class="btn-group navbar-form navbar-btn-group navbar-left hidden-xs" data-toggle="buttons">
+        <div class="btn-group navbar-form navbar-btn-group navbar-left hidden-xs">
           <button class="btn btn-default btn-mute-mic help" data-toggle="tooltip" data-placement="bottom" title="<%=l 'MUTE_MIC' %>">
             <span class="glyphicon glyphicon-volume-off">
             </span>
@@ -78,11 +78,10 @@
             <span class="glyphicon glyphicon-facetime-video">
             </span>
           </button>
-          <label class="btn btn-default help" id="shareScreenLabel" data-toggle="tooltip" data-placement="bottom" title="<%=l 'SHARE_YOUR_SCREEN' %>">
-            <input type="checkbox" id="shareScreenButton">
+          <button class="btn btn-default help btn-share-screen" data-toggle="tooltip" data-placement="bottom" title="<%=l 'SHARE_YOUR_SCREEN' %>">
             <span class="glyphicon glyphicon-expand">
             </span>
-          </label>
+          </button>
         </div>
         <div class="btn-group navbar-form navbar-btn-group navbar-left hidden-xs aloneEl" data-toggle="buttons">
           <label class="btn btn-default help" id="pauseMohLabel" data-toggle="tooltip" data-placement="bottom" title="<%=l 'PAUSE_MOH' %>">