Add user settings with locale switcher

app/assets/javascripts/user/app/controllers/settings_controller.js.coffee

@@ -0,0 +1,2 @@
+App.SettingsController = Ember.Controller.extend
+  locales: ['nl', 'en']

app/assets/javascripts/user/app/router.js.coffee

@@ -12,4 +12,5 @@ App.Router.map ->
   @resource 'join_requests'
   @resource 'lists', ->
     @resource 'list', path: ':list_id'
+  @route 'settings'
   @route 'error'

app/assets/javascripts/user/app/templates/application.emblem

@@ -50,6 +50,10 @@ aside.side-menu
     li
       =link-to 'join_requests'
         span= t 'models.plural.join_request'
+    li
+      =link-to 'settings'
+        span.settings-icon
+        span= t 'settings.title'
     li.hide
       a{action "openDebugger"}
         span.fa.fa-wrench.fa-lg

app/assets/javascripts/user/app/templates/settings.emblem

@@ -0,0 +1,6 @@
+.row: h3=t 'settings.title'
+.display-row
+  .display-label=t 'settings.language'
+  .display-field
+    each locale in locales
+      App.SettingsLocaleView locale=locale

app/assets/javascripts/user/app/templates/settings/locale.emblem

@@ -0,0 +1 @@
+= view.localeFlag

app/assets/javascripts/user/app/views/settings_locale_view.js.coffee

@@ -0,0 +1,11 @@
+App.SettingsLocaleView = Ember.View.extend
+  templateName: 'settings/locale'
+  classNames: 'settings-locale'
+  classNameBindings: ['current']
+  current: (-> @get('locale') is $locale ).property('controller.locale')
+  localeFlag: (->
+    new Ember.Handlebars.SafeString "<img src=\"#{$assets_path}user/flags/flag-#{@get('locale')}.png\">"
+  ).property('locale')
+  click: ->
+    setLocale @get('locale')
+    @set 'controller.locale', @get('locale')

app/assets/javascripts/user/flat/application.js.coffee.erb

@@ -18,7 +18,6 @@
 #  )(jQuery)
 
 @Qstorage = localStorage
-
 $.extend($translations.en, <%= I18n.t('user', locale: :en).to_json %>);
 $.extend($translations.nl, <%= I18n.t('user', locale: :nl).to_json %>);
 setLocale()

app/assets/stylesheets/user/foundation/_qconstants.css.sass

@@ -5,4 +5,4 @@ $green: #7BB459 //Heineken
 //$wood: image-url('textures/wood001-vertical.jpg')
 $wood: image-url('theme1/wall-bg.jpg')
 $background-brown: #57351f
-$active-link-color: #ff0
+$current-color: #ff0

app/assets/stylesheets/user/foundation/components/_menu_main.css.sass

@@ -52,8 +52,8 @@ header.top-menu
     margin-top: 10px
     color: #999
     &.active
-      color: $active-link-color
-      border-color: $active-link-color
+      color: $current-color
+      border-color: $current-color
       &.callout
         color: #f70
         border-color: #f70

app/assets/stylesheets/user/foundation/components/_menu_side.css.sass

@@ -26,8 +26,12 @@ aside.side-menu
     margin-right: 18px
     @extend .fa
     @extend .fa-list
+  .settings-icon
+    margin-right: 18px
+    @extend .fa
+    @extend .fa-gears
   a.active
-    color: $active-link-color
+    color: $current-color
 
 .toggle-side-menu
   position: absolute

app/assets/stylesheets/user/foundation/components/_settings.css.sass

@@ -0,0 +1,5 @@
+.settings-locale
+  display: inline-block
+  margin-right: 8px
+  &.current
+    border: 1px solid $current-color

config/locales/user.en.yml

@@ -100,3 +100,6 @@ en:
           message: Cannot find %{model} with id %{id}
         general:
           message: Cannot find resource
+    settings:
+      title: Settings
+      language: Language

config/locales/user.nl.yml

@@ -99,3 +99,7 @@ nl:
           message: '%{model} met id %{id} kan niet worden gevonden'
         general:
           message: Data niet beschikbaar
+
+    settings:
+      title: Settings
+      language: Taal