Consolidates translation code

Fixes #565 - consolidates translation code.

app/assets/javascripts/app/app-init.js

@@ -1,17 +1,18 @@
 // Manages the application initialization for most pages.
 // This script is called by the homepage, search result
 // and search details pages. It is not called by
-// the about page, because that page does not have popups to manage.
+// the about page.
 require([
+  'util/translation/google-translate-manager',
   'app/popup-manager',
   'app/alert-manager'
 ],
-function (pm, alert) {
+function (googleTranslate, popups, alert) {
   'use strict';
 
-  // If box-shadow CSS is supported, initialize the popups.
-  if (Modernizr.boxshadow)
-    pm.init();
+  // If page is not translated, initialize the header popups.
+  if (!googleTranslate.isTranslated())
+    popups.init();
 
   alert.init();
 });

app/assets/javascripts/app/popup-manager.js

@@ -17,21 +17,8 @@ function (util, feedback) {
   var PADDING = 20;
 
   function init() {
-    if (!_isTranslated()) {
-      _addPopups();
-      feedback.init();
-    }
-  }
-
-  // Check if the page is currently translated using Google Translation.
-  function _isTranslated() {
-    var translate = util.getQueryParams().translate;
-    if (translate && translate !== 'en')
-      return true;
-    var googtrans = util.getCookie('googtrans');
-    if (googtrans && googtrans !== '/en/en')
-      return true;
-    return false;
+    _addPopups();
+    feedback.init();
   }
 
   // Adds hooks for triggering popups present on the page.

app/assets/javascripts/util/cookie.js.erb

@@ -0,0 +1,52 @@
+// Cookie CRUD functions, from http://www.quirksmode.org/js/cookies.html
+// ERB needed to retrieve domain name that the cookie is saved under.
+define(
+function () {
+  'use strict';
+
+  // @param name [String] The cookie's name.
+  // @param value [String] The cookie's value.
+  // @param useDomain [Boolean] Whether set under subdomains or not.
+  // @param days [Number] Number of days till the cookie expires.
+  // Can be negative.
+ function create(name, value, useDomain, days) {
+    if (days) {
+      var date = new Date();
+      date.setTime(date.getTime() + (days*24*60*60*1000));
+      var expires = '; expires=' + date.toGMTString();
+    }
+    else var expires = '';
+
+    var setting = name + '=' + value + expires + '; path=/';
+
+    // Sets the cookie under domain and subdomains (if useDomain parameter is present).
+    document.cookie = setting;
+    if (useDomain)
+      document.cookie = setting + "; domain=.<%= ENV['DOMAIN_NAME'] %>";
+  }
+
+  // @param name [String] The cookie's name to read.
+  // @return [String] The named cookie's value, or null.
+  function read(name) {
+    var nameEQ = name + "=";
+    var ca = document.cookie.split(';');
+    for(var i=0;i < ca.length;i++) {
+      var c = ca[i];
+      while (c.charAt(0)==' ') c = c.substring(1,c.length);
+      if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
+    }
+    return null;
+  }
+
+  // @param name [String] The cookie's name to remove.
+  // @param usedDomain [Boolean] Whether to clear subdomains also.
+  function erase(name, useDomain) {
+    create(name, '', !!useDomain, -1);
+  }
+
+  return {
+    create:create,
+    read:read,
+    erase:erase
+  };
+});

app/assets/javascripts/util/translation/google-translate-manager.js

@@ -1,8 +1,10 @@
 // Manages behavior of the Google Website Translator Gadget.
 define([
+  'util/util',
+  'util/cookie',
   'util/translation/layout/DropDownLayout'
 ],
-function (DropDownLayout) {
+function (util, cookie, DropDownLayout) {
   'use strict';
 
   // The layout object in use.
@@ -26,7 +28,7 @@ function (DropDownLayout) {
   function init(layoutType) {
     _layoutType = layoutType;
 
-    _deleteTranslateCookies();
+    _writeTranslateCookies();
 
     _layout = DropDownLayout.create();
     _layout.init(GOOGLE_TRANSLATE_ELEMENT_ID);
@@ -45,6 +47,18 @@ function (DropDownLayout) {
     window.GoogleTranslate = GoogleTranslate;
   }
 
+  // Checks if the 'googtrans' cookie is set to English or not,
+  // indicating whether the page has been translated using the
+  // Google Website Translator Gadget.
+  // @return [Boolean] true if Google Translation has translated the page.
+  // Returns false if the page is not translated and is in English.
+  function isTranslated() {
+    var googtrans = cookie.read('googtrans');
+    if (googtrans && decodeURIComponent(googtrans) === '/en/en')
+      return true;
+    return false;
+  }
+
   // Initialize the Google Website Translator Gadget.
   function _googleTranslateElementInit() {
     var gadgetOptions = {
@@ -69,22 +83,23 @@ function (DropDownLayout) {
       return google.translate.TranslateElement.InlineLayout.HORIZONTAL;
   }
 
-  // Removes the Google Website Translator cookies by setting their expiration
-  // date into the past.
-  function _deleteTranslateCookies() {
-    var cookies, cookie, eqPos, name;
-    cookies = document.cookie.split('; ');
-    for (var i = 0, len = cookies.length; i < len; i++) {
-      cookie = cookies[i];
-      eqPos = cookie.indexOf('=');
-      name = eqPos > -1 ? cookie.substr(0, eqPos) : cookie;
-      if (name === 'googtrans')
-        document.cookie = name + '=; expires=Thu, 01 Jan 1970 00:00:00 GMT';
+  // Overwrite/Create Google Website Translator Gadget cookies if the
+  // 'translate' URL parameter is present.
+  function _writeTranslateCookies() {
+    var translateRequested = util.getParameterByName('translate');
+    if (translateRequested) {
+      var newCookieValue = '/en/'+translateRequested;
+      var oldCookieValue = decodeURIComponent(cookie.read('googtrans'));
+      if(newCookieValue !== oldCookieValue) {
+        cookie.create('googtrans', newCookieValue, true);
+        window.location.reload();
+      }
     }
   }
 
   return {
     init:init,
+    isTranslated:isTranslated,
     InlineLayout:InlineLayout
   };
 });

app/assets/javascripts/util/util.js

@@ -175,22 +175,22 @@ function () {
     return params;
   }
 
-  // Retrieve a cookie value by name.
-  // @param [String] the name of the cookie.
-  // @return [String] the cookie value.
-  function getCookie(name) {
-    var parts = document.cookie.split(name + '=');
-    if (parts.length === 2) return parts.pop().split(';').shift();
+  // Retrieve named query parameter.
+  // (from http://stackoverflow.com/questions/901115/
+  // how-can-i-get-query-string-values-in-javascript)
+  function getParameterByName(name) {
+    name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]");
+    var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"),
+    results = regex.exec(location.search);
+    return results == null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
   }
 
-
   return {
     isEventSupported:isEventSupported,
     getWindowRect:getWindowRect,
     getOffset:getOffset,
     getStyle:getStyle,
     queryString:queryString,
-    getQueryParams:getQueryParams,
-    getCookie:getCookie
+    getParameterByName:getParameterByName
   };
 });

app/controllers/about_controller.rb

@@ -1,5 +1,4 @@
 class AboutController < ApplicationController
-  include GoogleTranslator
   respond_to :html, :json
 
   def index

app/controllers/home_controller.rb

@@ -1,5 +1,4 @@
 class HomeController < ApplicationController
-  include GoogleTranslator
   include CurrentLanguage
 
   def index

app/controllers/locations_controller.rb

@@ -1,5 +1,4 @@
 class LocationsController < ApplicationController
-  include GoogleTranslator
   include CurrentLanguage
   include Cacheable
 

spec/features/general/translate_spec.rb

@@ -2,12 +2,21 @@
 
 feature 'page translation', :js do
 
+  # Force Capybara not to use 127.0.0.1 for cookie domain.
+  # From http://stackoverflow.com/
+  # questions/6536503/capybara-with-subdomains-default-host
+  def capybara_host(host)
+    default_url_options[:host] = host
+    Capybara.app_host = "http://#{host}"
+  end
+
   background do
     # use this with poltergeist
     # page.driver.remove_cookie('googtrans')
 
     # use this with webkit
     page.driver.browser.clear_cookies
+    capybara_host "#{ENV['DOMAIN_NAME']}:4000/"
   end
 
   context 'translation cookie is set to Spanish' do
@@ -17,7 +26,9 @@
 
       # use this with webkit
       page.driver.browser.
-        set_cookie('googtrans=/en/es; path=/; domain=127.0.0.1')
+        set_cookie('googtrans=/en/es; path=/; domain=lvh.me')
+      page.driver.browser.
+        set_cookie('googtrans=/en/es; path=/; domain=.lvh.me')
 
       visit('/')
       within('#language-box') do
@@ -29,9 +40,11 @@
   end
 
   context 'homepage is translated' do
-    xit 'displays a Spanish-language contents' do
+    it 'displays a Spanish-language contents' do
       visit('/')
       find_link('Español').click
+      delay
+      expect(page.driver.cookies['googtrans']).to eq('/en/es')
       within('#language-box') do
         all_links = all('a')
         expect(all_links).not_to include 'Español'
@@ -41,24 +54,30 @@
   end
 
   context 'results page is translated' do
-    xit 'displays a Spanish-language contents' do
+    it 'displays a Spanish-language contents' do
       visit('/')
       find_link('Español').click
       find(:css, '#button-search').click
       delay # give Google Translate a chance to translate page
-      expect(page).to have_content('Mostrando')
+      expect(page).to have_content('Encontrar') # 'Encontrar' = 'Find'
     end
   end
 
   context 'page is translated between languages' do
-    xit 'displays a Spanish-, Tagalog-, and English-language contents' do
+    it 'displays a Spanish-, Tagalog-, and English-language contents' do
       visit('/')
       find_link('Español').click
+      delay
+      expect(page.driver.cookies['googtrans']).to eq('/en/es')
       expect(page).to have_content('Necesito')
       find_link('Tagalog').click
+      delay
+      expect(page.driver.cookies['googtrans']).to eq('/en/tl')
       expect(page).to have_content('Kailangan ko')
       find_link('English').click
-      expect(page).to have_content('I Need')
+      expect(page).to have_content('I need')
+      delay
+      expect(page.driver.cookies['googtrans']).to eq('/en/en')
     end
   end
 end