Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Moves Google Translate initialization to application.js so it’s applied to all routes. - Refactors Google Translate Manager to remove polling code and to integrate Google supplied initialization scripts. - Refactors language translation link settings: - Strips whitespace around language code setting so any amount of spacing can be introduced into the settings and the app won’t silently not configure the language code URL properly. - Adds ability to remove all language links and the app won’t break. Ties into #483. - Edits language links code comments to be consistent with other settings in the settings file and adds a space after the colon in the settings to be consistent with Ruby style guide key/value styling. - Refactors area above and below search box on homepage so that when language links are absent the height of the utility area doesn’t collapse. Also, renames bottom utility area to be more generic. - Adds translation services section to customization readme. - Moves google translate manager JS to `util` directory. - Moves drop-down layout handling code to its own module. - Capitalizes modules that include creation method for creating a new instance. - Adds error handling so if Google script changes container HTML an error will be thrown. - Fixes #287 Google Translate cookie wasn’t being set on inside pages. This commit adds the Google Translate cookie concern to inside pages in addition to the homepage.
- Loading branch information
1 parent
a89bbf9
commit 304e225
Showing
20 changed files
with
268 additions
and
160 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,15 +1,11 @@ | ||
| // Manages initialization of scripts for the About page. | ||
| require([ | ||
| 'app/google-translate-manager', | ||
| 'app/feedback-form-manager', | ||
| 'application' | ||
| ], | ||
| function (gt, feedback) { | ||
| 'use strict'; | ||
|
|
||
| // Initialize the Google Translate manager. | ||
| gt.init(); | ||
|
|
||
| // Initialize the feedback form. | ||
| feedback.init(); | ||
| }); |
File renamed without changes.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
90 changes: 90 additions & 0 deletions
90
app/assets/javascripts/util/translation/google-translate-manager.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,90 @@ | ||
| // Manages behavior of the Google Website Translator Gadget. | ||
| define([ | ||
| 'util/translation/layout/DropDownLayout' | ||
| ], | ||
| function (DropDownLayout) { | ||
| 'use strict'; | ||
|
|
||
| // The layout object in use. | ||
| var _layout; | ||
|
|
||
| // The current layout that is set. Determined by the | ||
| // 'layout' setting in the Google Translate provided script | ||
| // in the footer. | ||
| var _layoutType; | ||
|
|
||
| // Same 'constants' as google.translate.TranslateElement.InlineLayout | ||
| // for tracking which layout is in use. | ||
| var VERTICAL = 0; | ||
| var HORIZONTAL = 1; | ||
| var InlineLayout = { VERTICAL:VERTICAL, HORIZONTAL:HORIZONTAL }; | ||
|
|
||
| // The id of the element on the page that will contain | ||
| // the Google Website Translator Gadget. | ||
| var GOOGLE_TRANSLATE_ELEMENT_ID = 'google-translate-container'; | ||
|
|
||
| function init(layoutType) { | ||
| _layoutType = layoutType; | ||
|
|
||
| _deleteTranslateCookies(); | ||
|
|
||
| _layout = DropDownLayout.create(); | ||
| _layout.init(GOOGLE_TRANSLATE_ELEMENT_ID); | ||
|
|
||
| // Add Google Translate script call by appending script element. | ||
| var scriptElm = document.createElement('script'); | ||
| var scriptUrl = '//translate.google.com/translate_a/element.js?cb='; | ||
| var scriptCallback = 'GoogleTranslate.googleTranslateElementInit'; | ||
| scriptElm.setAttribute('src', scriptUrl+scriptCallback); | ||
| document.body.appendChild(scriptElm); | ||
|
|
||
| // Add the callback function for the Google Translate script. | ||
| var GoogleTranslate = { | ||
| googleTranslateElementInit:_googleTranslateElementInit | ||
| }; | ||
| window.GoogleTranslate = GoogleTranslate; | ||
| } | ||
|
|
||
| // Initialize the Google Website Translator Gadget. | ||
| function _googleTranslateElementInit() { | ||
| var opts = { | ||
| pageLanguage: 'en', | ||
| layout: _getGoogleLayout(), | ||
| autoDisplay: false | ||
| }; | ||
|
|
||
| new google.translate.TranslateElement( opts, GOOGLE_TRANSLATE_ELEMENT_ID ); | ||
|
|
||
| // Activate hooks to manipulate Google Website Translator Gadget through | ||
| // the URL 'translate' parameter. | ||
| _layout.activate(); | ||
| } | ||
|
|
||
| // @return [Object] Return the inline Google Website Translator Gadget | ||
| // layouts supplied by Google. | ||
| function _getGoogleLayout() { | ||
| if (_layoutType === VERTICAL) | ||
| return google.translate.TranslateElement.InlineLayout.VERTICAL; | ||
| else if (_layoutType === HORIZONTAL) | ||
| 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'; | ||
| } | ||
| } | ||
|
|
||
| return { | ||
| init:init, | ||
| InlineLayout:InlineLayout | ||
| }; | ||
| }); |
64 changes: 64 additions & 0 deletions
64
app/assets/javascripts/util/translation/layout/DropDownLayout.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,64 @@ | ||
| // Manages behavior of posting changes to the URL for | ||
| // inlinelayout.VERTICAL and inlinelayout.HORIZONTAL | ||
| // Google Translate Widget layouts. | ||
| define([ | ||
| 'util/util' | ||
| ], | ||
| function (util) { | ||
| 'use strict'; | ||
|
|
||
| function create() { | ||
| return new DropDownLayout(); | ||
| } | ||
|
|
||
| function DropDownLayout() { | ||
|
|
||
| // The HTML element that contain the language options. | ||
| var _languages; | ||
|
|
||
| // The ID of the Google Translate widget HTML container. | ||
| var _googleTranslateElmID; | ||
|
|
||
| function init(id) { | ||
| _googleTranslateElmID = id; | ||
| } | ||
|
|
||
| function activate() { | ||
| _languages = _getGoogleLayoutElement(); | ||
| _hookDropDown(); | ||
| } | ||
|
|
||
| // @return [Object] The HTML element that contains the Google Translate | ||
| // languages. | ||
| function _getGoogleLayoutElement() { | ||
| var query = '#'+_googleTranslateElmID + ' select'; | ||
| var elm = document.querySelector(query); | ||
| if (!elm) | ||
| throw new Error('Google Translate Widget HTML container not found!'); | ||
| return elm | ||
| } | ||
|
|
||
| // Hook in a change event to the language drop-down menu so the page reloads | ||
| // and is appended a translate query string when the drop-down menu changes. | ||
| function _hookDropDown() { | ||
| _languages.addEventListener('change', _languageDropDownChanged, false); | ||
| } | ||
|
|
||
| // Update the URL with the selected language. | ||
| function _languageDropDownChanged() { | ||
| var options = { | ||
| 'translate': _languages.options[_languages.selectedIndex].value | ||
| }; | ||
| document.location.search = util.queryString(options); | ||
| } | ||
|
|
||
| return { | ||
| init:init, | ||
| activate:activate | ||
| }; | ||
| } | ||
|
|
||
| return { | ||
| create:create | ||
| }; | ||
| }); |
Oops, something went wrong.