From 20734ca70539d4c320127952794be3a77c0d4cc2 Mon Sep 17 00:00:00 2001
From: Daniel Berteaud <daniel@firewall-services.com>
Date: Fri, 2 May 2014 23:04:54 +0200
Subject: [PATCH] Alert if browser is not supported

Add a modal dialog uf the browser doesn't support WebRTC or dataChannels
---
 lib/Vroom/I18N/en.pm           |  4 ++++
 lib/Vroom/I18N/fr.pm           |  5 +++++
 public/js/vroom.js             |  5 +++++
 templates/default/join.html.ep | 36 ++++++++++++++++++++++++++++++++++++
 4 files changed, 50 insertions(+)

diff --git a/lib/Vroom/I18N/en.pm b/lib/Vroom/I18N/en.pm
index 16dafdb..676ca24 100644
--- a/lib/Vroom/I18N/en.pm
+++ b/lib/Vroom/I18N/en.pm
@@ -57,6 +57,10 @@ our %Lexicon = (
   "ERROR_MAIL_INVALID"                   => "Please enter a valid email address",
   "CANT_SEND_TO_s"                       => "Couldn't send message to %s",
   "SCREEN_s"                             => "%s's screen",
+  "BROWSER_NOT_SUPPORTED"                => "Browser not supported",
+  "NO_WEBRTC_SUPPORT"                    => "Sorry, but the video conference will not workd because your web browser doesn't have the " .
+                                            "required functionnalities. We recommand you download one of the following browsers " .
+                                            "which support the latest web technologies required to use VROOM",
   "HOME"                                 => "Home",
   "HELP"                                 => "Help",
   "ABOUT"                                => "About",
diff --git a/lib/Vroom/I18N/fr.pm b/lib/Vroom/I18N/fr.pm
index f4f6f57..59de38c 100644
--- a/lib/Vroom/I18N/fr.pm
+++ b/lib/Vroom/I18N/fr.pm
@@ -63,6 +63,11 @@ our %Lexicon = (
     "ERROR_MAIL_INVALID"                        => "Veuillez saisir une adresse email valide",
     "CANT_SEND_TO_s"                            => "Le message n'a pas pu être envoyé à %s",
     "SCREEN_s"                                  => "Écran de %s",
+    "BROWSER_NOT_SUPPORTED"                     => "Navigateur non supporté",
+    "NO_WEBRTC_SUPPORT"                         => "Désolé, la vidéo conférence ne fonctionnera pas car votre navigateur " .
+                                                   "ne dispose pas des fonctions nécessaires. Nous recommandons de télécharger " .
+                                                   "un des navigateurs suivants, qui supportent les dernières technologies nécessaires " .
+                                                   "à l'utilisation de VROOM",
     "HOME"                                      => "Accueil",
     "HELP"                                      => "Aide",
     "ABOUT"                                     => "À propos",
diff --git a/public/js/vroom.js b/public/js/vroom.js
index 2a7d250..5ac30ac 100644
--- a/public/js/vroom.js
+++ b/public/js/vroom.js
@@ -70,6 +70,11 @@ function initVroom(room) {
     $("#shareScreenLabel").addClass('disabled');
   }
 
+  // If browser doesn't support webRTC or dataChannels
+  if (!webrtc.capabilities.support || !webrtc.capabilities.dataChannel){
+    $('#noWebrtcSupport').modal('show');
+  }
+
   // Escape entities
   function stringEscape(string){
     string = string.replace(/[\u00A0-\u99999<>\&]/gim, function(i) {
diff --git a/templates/default/join.html.ep b/templates/default/join.html.ep
index 795a936..1001c89 100644
--- a/templates/default/join.html.ep
+++ b/templates/default/join.html.ep
@@ -81,6 +81,42 @@
         </div>
       </div>
     </div>
+    <div class="modal fade" role="dialog" id="noWebrtcSupport" aria-labelledby="noWebrtcSupport" aria-hidden="true">
+      <div class="modal-dialog modal-lg">
+        <div class="modal-content">
+          <div class="modal-header">
+            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
+            <h4 class="modal-title" id="noWebrtcSupportTitle"><%=l 'BROWSER_NOT_SUPPORTED' %></h4>
+          </div>
+          <div class="modal-content modal-body">
+            <p><%=l 'NO_WEBRTC_SUPPORT' %></p>
+            <div class="row">
+              <div class="col-sm-4">
+                <a href="http://www.mozilla.org/firefox/" target="_blank">
+                  <center>
+                    <img src="/img/firefox.png" alt="Mozilla Firefox"/>
+                  </center>
+                </a>
+              </div>
+              <div class="col-sm-4">
+                <a href="http://www.google.com/chrome/" target="_blank">
+                  <center>
+                    <img src="/img/chrome.png" alt="Google Chrome"/>
+                  </center>
+                </a>
+              </div>
+              <div class="col-sm-4">
+                <a href="http://www.opera.com" target="_blank">
+                  <center>
+                    <img src="/img/opera.png" alt="Opera"/>
+                  </center>
+                </a>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
     <div class="frame">
       <div id="chatMenu" class="nav-collapse collapse">
         <div id="chatHistory" class="form-control">