Merge pull request #512 from AyuntamientoMadrid/ie8

Popup < IE9

Gemfile

@@ -53,6 +53,8 @@ gem 'whenever', require: false
 gem 'ahoy_matey', '~> 1.2.1'
 gem 'groupdate'   # group temporary data
 
+gem 'browser'
+
 group :development, :test do
   # Call 'byebug' anywhere in the code to stop execution and get a debugger console
   gem 'byebug'

Gemfile.lock

@@ -406,6 +406,7 @@ DEPENDENCIES
   acts_as_votable
   ahoy_matey (~> 1.2.1)
   ancestry
+  browser
   bullet
   byebug
   cancancan

app/assets/stylesheets/participacion.scss

@@ -262,6 +262,17 @@ h6 {
   border-top: rem-calc(6) solid $brand;
 }
 
+.ie-alert-box {
+  position: absolute;
+  top: 0;
+  width: 100%;
+
+  a.close {
+    font-size: 36px;
+    top: 20%;
+  }
+}
+
 // 04. Header
 // - - - - - - - - - - - - - - - - - - - - - - - - -
 

app/views/layouts/application.html.erb

@@ -22,6 +22,23 @@
     <div class="wrapper">
       <%= render 'layouts/header' %>
 
+      <!--[if lt IE 9]>
+      <% if browser.ie? %>
+        <div data-alert class="alert-box info ie-alert-box">
+          <a href="#" class="close">&times;</a>
+          <h2><%= t("layouts.application.ie_title") %></h2>
+          <p>
+            <%= t("layouts.application.ie",
+            chrome: link_to(
+                    t("layouts.application.chrome"), "https://www.google.com/chrome/browser/desktop/", target: "_blank"),
+            firefox: link_to(
+                     t("layouts.application.firefox"), "https://www.mozilla.org/firefox", target: "_blank")
+            ).html_safe %>
+          </p>
+        </div>
+      <% end %>
+      <![endif]-->
+
       <% if notice %>
       <div class="alert-messages">
         <div class="row">

config/locales/en.yml

@@ -48,6 +48,13 @@ en:
       privacy: "Privacy Policy"
       conditions: "Terms of use"
       more_info: "More information"
+    application:
+      ie_title: "This site is not optimized for your browser"
+      ie:
+        "You are using Internet Explorer.
+        For a better experience we recommend use %{chrome} or %{firefox}."
+      chrome: "Google Chrome"
+      firefox: "Firefox"
   form:
       error: error
       errors: errors

config/locales/es.yml

@@ -48,6 +48,13 @@ es:
       privacy: "Política de privacidad"
       conditions: "Condiciones de uso"
       more_info: "Más información"
+    application:
+      ie_title: "Esta web no está optimizada para tu navegador"
+      ie:
+        "Hemos detectado que estás navegando desde Internet Explorer.
+        Para una mejor experiencia te recomendamos utilizar %{chrome} o %{firefox}."
+      chrome: "Google Chrome"
+      firefox: "Firefox"
   form:
       error: error
       errors: errores