Change language in settings menu;

client/lib/tapi18n.coffee

@@ -3,3 +3,7 @@
 		return TAPi18n.__ key, replaces
 	else
 		return TAPi18n.__ key, { postProcess: 'sprintf', sprintf: replaces }
+
+@isRtl = (language) ->
+	# https://en.wikipedia.org/wiki/Right-to-left#cite_note-2
+	return language.split('-').shift().toLowerCase() in ['ar', 'dv', 'fa', 'he', 'ku', 'ps', 'sd', 'ug', 'ur', 'yi']

client/views/app/layout.coffee

@@ -4,5 +4,7 @@ Template.appLayout.helpers
 
 Template.appLayout.rendered = ->
 	$('html').addClass("noscroll").removeClass "scroll"
+
 	# RTL Support - Need config option on the UI
-	# $('html').addClass("rtl")
+	if isRtl localStorage.getItem "userLanguage"
+		$('html').addClass "rtl"

client/views/app/sideNav/createChannelFlex.html

@@ -35,8 +35,8 @@ <h4>{{_ "chatRooms.Create_new_channel" }}</h4>
 				</div>
 			{{/if}}
 			<div class="input-submit">
-				<button class="button clean primary save-channel">{{_ "chatRooms.Save" }}</button>
-				<button class="button clean cancel-channel">{{_ "chatRooms.Cancel" }}</button>
+				<button class="button clean primary save-channel">{{_ "general.Save" }}</button>
+				<button class="button clean cancel-channel">{{_ "general.Cancel" }}</button>
 			</div>
 		</div>
 	</div>

client/views/app/sideNav/privateGroupsFlex.html

@@ -29,8 +29,8 @@ <h4>Create a new private group</h4>
 				</div>
 			{{/if}}
 			<div class="input-submit">
-				<button class="button clean primary save-pvt-group">{{_ "chatRooms.Save" }}</button>
-				<button class="button clean cancel-pvt-group">{{_ "chatRooms.Cancel" }}</button>
+				<button class="button clean primary save-pvt-group">{{_ "general.Save" }}</button>
+				<button class="button clean cancel-pvt-group">{{_ "general.Cancel" }}</button>
 			</div>
 		</div>
 	</div>

client/views/app/sideNav/userSettingsFlex.coffee

@@ -0,0 +1,26 @@
+Template.userSettingsFlex.helpers
+	languages: ->
+		languages = TAPi18n.getLanguages()
+		result = []
+		for key, language of languages
+			result.push _.extend(language, { key: key })
+		return _.sortBy(result, 'key')
+
+	userLanguage: (key) ->
+		return localStorage.getItem('userLanguage')?.split('-').shift().toLowerCase() is key
+
+Template.userSettingsFlex.events
+	'mouseenter header': ->
+		SideNav.overArrow()
+
+	'mouseleave header': ->
+		SideNav.leaveArrow()
+
+	'click header': ->
+		SideNav.closeFlex()
+
+	'click footer .save': ->
+		selectedLanguage = $('#language').val()
+		if localStorage.getItem('userLanguage') isnt selectedLanguage
+			localStorage.setItem 'userLanguage', selectedLanguage
+			Meteor._reload.reload()

client/views/app/sideNav/userSettingsFlex.html

@@ -0,0 +1,24 @@
+<template name="userSettingsFlex">
+	<header>
+		<div>
+			<h4>{{_ "userStatus.Settings"}}</h4>
+		</div>
+	</header>
+	<div class="content">
+		<div class="wrapper">
+			<div class="input-line">
+				<label for="language">{{_ "general.Language"}}</label>
+				<select id="language" class="required" dir="auto">
+					{{#each languages}}
+					<option value="{{key}}" selected="{{userLanguage key}}">{{name}}</option>
+					{{/each}}
+				</select>
+			</div>
+		</div>
+	</div>
+	<footer>
+		<div>
+			<button class="button clean save">{{_ "general.Save"}}</button>
+		</div>
+	</footer>
+</template>

client/views/app/sideNav/userStatus.coffee

@@ -32,5 +32,9 @@ Template.userStatus.events
 	'click #avatar': (event) ->
 		Meteor.call('resetAvatar')
 
+	'click #settings': (event) ->
+		SideNav.setFlex "userSettingsFlex"
+		SideNav.openFlex()
+
 Template.userStatus.rendered = ->
 	AccountBox.init()

client/views/app/sideNav/userStatus.html

@@ -19,7 +19,7 @@ <h4>{{username}}</h4>
 				<a href="" data-status="busy" class="status busy"><span>{{_ "userStatus.Busy"}}</span></a>
 				<a href="" data-status="offline" class="status offline"><span>{{_ "userStatus.Invisible"}}</span></a>
 				<a href="" id="avatar"><i class="icon-camera"></i><span>{{_ "userStatus.Change_avatar"}}</span></a>
-				<a href=""><i class="icon-sliders"></i><span>{{_ "userStatus.Settings"}}</span><span class="soon">{{_ "userStatus.coming_soon"}}</span></a>
+				<a href="" id="settings"><i class="icon-sliders"></i><span>{{_ "userStatus.Settings"}}</span></a>
 				<a href=""><i class="icon-lock"></i><span>{{_ "userStatus.Privacy"}}</span><span class="soon">{{_ "userStatus.coming_soon"}}</span></a>
 				<a href="" id="logout"><i class="icon-logout"></i><span>{{_ "userStatus.Logout"}}</span></a>
 			</nav>

i18n/en.i18n.json

@@ -28,8 +28,6 @@
     "Name" : "Name",
     "Members" : "Members",
     "Selected_users" : "Selected members",
-    "Save" : "Save",
-    "Cancel" : "Cancel",
     "No_channels_yet" : "You aren't part of any channel yet.",
     "No_direct_messages_yet" : "You haven't started any conversations yet.",
     "No_groups_yet" : "You have no private groups yet.",
@@ -72,12 +70,14 @@
     "Contact" : "Contact",
     "Conversation" : "Conversation",
     "History" : "History",
+    "Language" : "Language",
     "Load_more" : "Load more",
     "Login" : "Login",
     "Name" : "Name",
     "Please_wait" : "Please wait",
     "Remove" : "Remove",
     "Reset_password" : "Reset password",
+    "Save" : "Save",
     "Search" : "Search",
     "Send_confirmation_email" : "Send confirmation email",
     "Submit" : "Submit",