[Maposmatic-dev] [PATCH 6/6] Improve the language selector

[Thomas Petazzoni]

Instead of removing languages that do not match the current country
code, we instead order the languages in the following way :

 1. All languages that match the current country code

 2. A separator

 3. All languages that do not match the current country code

This allows to have a sane choice selected by default, to highlight
the choices that are probably the most pertinent ones, and still give
the user the opportunity to make a completely different choice. This
is especially important for bounding box renderings, since the guessed
country code may not be correct (in particular for bounding boxes
crossing country boundaries).

Signed-off-by: Thomas Petazzoni <address@hidden>
---
 www/media/map_rendering_form.js |   35 ++++++++++++++++++++---------------
 1 files changed, 20 insertions(+), 15 deletions(-)

diff --git a/www/media/map_rendering_form.js b/www/media/map_rendering_form.js
index 6ef4e9e..210e88a 100644
--- a/www/media/map_rendering_form.js
+++ b/www/media/map_rendering_form.js
@@ -181,23 +181,28 @@ function setSelectedCountryCallback(geoResults)
  * when the area is given by bounding box. */
 function prepareLanguagePanel()
 {
-  var seen = false;
-
-  $('#id_map_language').html(savedLanguageList);
-
-  $('#id_map_language').children('option').each(function() {
-    if (! ($(this).val().match('.._' + selectedCountry.toUpperCase() + '\..*') 
!= null
-           || $(this).val() == 'C'))
-    {
-      $(this).remove();
-    }
-    else {
-      if (! seen) {
-        $(this).attr("selected", "selected");
-        seen = true;
-      }
+  var langlist = $('#id_map_language');
+
+  langlist.html(savedLanguageList);
+
+  /* The goal is to build a list of languages in which we have first
+   * the languages matching the current country code, then an empty
+   * disabled entry used as a separator and finally all other
+   * languages. To do so, we use prependTo(), which adds elements at
+   * the beginning of the list. So we start by prepending the
+   * separator, then the "no localization" special language, and
+   * finally the languages matching the current country code.
+   */
+  $('<option disabled="disabled"></option>').prependTo(langlist);
+  $('option[value=C]', langlist).prependTo(langlist);
+
+  langlist.children('option').each(function() {
+    if ($(this).val().match('.._' + selectedCountry.toUpperCase() + '\..*') != 
null) {
+      $(this).prependTo(langlist);
     }
   });
+
+  $('option:first', langlist).attr("selected", "selected");
 }
 
 function prepareSummaryPanel()
-- 
1.7.0.4