Improving Language Selector

bordoni · bordoni · commit 4c28185bdd7e · 2016-07-02T14:11:40.000-03:00
Moving the `onchange` function closer to the Element, on the `_includes/languages.html`
Places all the methods on a "strict" env inside of a scope
When you are in another language that is not English, that language will be selected by default.
diff --git a/_includes/footer.html b/_includes/footer.html
@@ -47,12 +47,6 @@
 					}
 				}
 			};
-
-			document.getElementById('languages').onchange = function(ev) {
-			    if (ev.currentTarget && ev.currentTarget.value) {
-			      location.href = ev.currentTarget.value;
-			    }
-			};
 		</script>
 	</body>
 </html>
diff --git a/_includes/languages.html b/_includes/languages.html
@@ -4,3 +4,30 @@
   <option value="{{ lang.path }}">{{ lang.label }}</option>
 {% endfor %}
 </select>
+
+<script type="text/javascript">
+( function(){
+	if ( '/' === window.location.pathname ) {
+		return;
+	}
+
+	var langs = document.getElementById( 'languages' ),
+		opts = langs.getElementsByTagName( 'option' ),
+		count = opts.length;
+
+	for ( var i = 0; i < count; i++ ){
+		if ( opts[ i ].value !== window.location.pathname ) {
+			continue;
+		}
+
+		opts[ i ].setAttribute( 'selected', 'selected' );
+	}
+
+	// Only apply this after we set the Selected option
+	langs.onchange = function( ev ) {
+		if ( ev.currentTarget && ev.currentTarget.value ) {
+			location.href = ev.currentTarget.value;
+		}
+	};
+} )();
+</script>

Original file line number	Diff line number	Diff line change
`@@ -47,12 +47,6 @@`
`47`	`47`	`}`
`48`	`48`	`}`
`49`	`49`	`};`
`50`		`-`
`51`		`- document.getElementById('languages').onchange = function(ev) {`
`52`		`- if (ev.currentTarget && ev.currentTarget.value) {`
`53`		`- location.href = ev.currentTarget.value;`
`54`		`- }`
`55`		`- };`
`56`	`50`	`</script>`
`57`	`51`	`</body>`
`58`	`52`	`</html>`