Sync Services, Dont Disturb, Lock and new services

- Sync configuration using Firebase.
- Don't DIsturb mode.
- Lock Rambox mode.
- Added new services (Dasher, DingTalk, FlowDock, Mattermost, Voxer,
Yahoo! Messenger).
- Fixed some bugs.

TODO.md

@@ -2,9 +2,5 @@
 
 - Change theme.
 - Deeplink to add new service.
-- Auto Updater
 - Dock Menu (http://electron.atom.io/docs/tutorial/desktop-environment-integration/#custom-dock-menu-os-x)
-- Auth0
-- Group services (Personal, Work, etc)
 - Crush Reporter.
-- Add Voxer, Yahoo! Messenger and Dasher.

app.js

@@ -1,3 +1,18 @@
+// Initialize Firebase
+var firebase = require('firebase/app');
+require('firebase/database');
+require('firebase/auth');
+var config = {
+	apiKey: "AIzaSyAXedcpudidIUVhvn0jjrMHHWXv7YzWAR0",
+	authDomain: "rambox-d1326.firebaseapp.com",
+	databaseURL: "https://rambox-d1326.firebaseio.com",
+	storageBucket: "rambox-d1326.appspot.com"
+};
+var fireRef = firebase.initializeApp(config); // Firebase Ref
+var FirebaseTokenGenerator = require('firebase-token-generator');
+var auth0, lock; // Auth0 vars
+
+// Sencha App
 Ext.setGlyphFontFamily('FontAwesome');
 Ext.application({
 	 name: 'Rambox'
@@ -6,3 +21,17 @@ Ext.application({
 
 	,autoCreateViewport: 'Rambox.view.main.Main'
 });
+
+// Syncronize with Firebase
+function sync() {
+	// Is not logged, Skip
+	if ( !localStorage.getItem('id_token') ) return;
+
+	var services = [];
+	Ext.getStore('Services').each(function(service) {
+		services.push(service.data);
+	});
+	fireRef.database().ref('users/' + Ext.decode(localStorage.getItem('profile')).user_id).set({
+		services: services
+	});
+}

app/Application.js

@@ -14,6 +14,9 @@ Ext.define('Rambox.Application', {
 	}
 
 	,launch: function () {
+		lock = new Auth0Lock('y9am0DVawe2tvlA3ucD7OufpJHZZMjsO', 'rambox.auth0.com');
+		auth0 = new Auth0({ domain : 'rambox.auth0.com', clientID: 'y9am0DVawe2tvlA3ucD7OufpJHZZMjsO'})
+
 		// Add shortcuts to switch services using CTRL + Number
 		var map = new Ext.util.KeyMap({
 			 target: document

app/store/Services.js

@@ -53,5 +53,14 @@ Ext.define('Rambox.store.Services', {
 				Ext.cq1('app-main').add(servicesRight);
 			}
 		}
+		,add: function(store, records, index) {
+			sync();
+		}
+		,update: function(store, record, operation, data) {
+			if ( operation === 'edit' ) sync();
+		}
+		,remove: function(store, records, index, isMove) {
+			sync();
+		}
 	}
 });

app/store/ServicesList.js

@@ -10,7 +10,12 @@ Ext.define('Rambox.store.ServicesList', {
 
 	,proxy: {
 		 type: 'memory'
-    }
+	}
+
+	,sorters: [{
+		 property: 'name'
+		,direction: 'ASC'
+	}]
 
 	,autoLoad: true
 	,autoSync: true
@@ -215,6 +220,48 @@ Ext.define('Rambox.store.ServicesList', {
 			,name: 'BearyChat'
 			,url: 'https://___.bearychat.com/'
 			,type: 'messaging'
+		},
+		{
+			 id: 'yahoomessenger'
+			,logo: 'yahoomessenger.png'
+			,name: 'Yahoo! Messenger'
+			,url: 'https://messenger.yahoo.com/'
+			,type: 'messaging'
+		},
+		{
+			 id: 'voxer'
+			,logo: 'voxer.png'
+			,name: 'Voxer'
+			,url: 'https://web.voxer.com/'
+			,type: 'messaging'
+		},
+		{
+			 id: 'dasher'
+			,logo: 'dasher.png'
+			,name: 'Dasher'
+			,url: 'https://dasher.im/'
+			,type: 'messaging'
+		},
+		{
+			 id: 'flowdock'
+			,logo: 'flowdock.png'
+			,name: 'Flowdock'
+			,url: 'https://www.flowdock.com/login'
+			,type: 'messaging'
+		},
+		{
+			 id: 'mattermost'
+			,logo: 'mattermost.png'
+			,name: 'Mattermost'
+			,url: '___'
+			,type: 'messaging'
+		},
+		{
+			 id: 'dingtalk'
+			,logo: 'dingtalk.png'
+			,name: 'DingTalk'
+			,url: 'https://im.dingtalk.com/'
+			,type: 'messaging'
 		}
 	]
 });

app/ux/WebView.js

@@ -34,7 +34,7 @@ Ext.define('Rambox.ux.WebView',{
 					 tag: 'webview'
 					,src: me.src
 					,style: 'width:100%;height:100%;'
-					,partition: 'persist:' + me.type + '_' + me.id.replace('tab_', '')
+					,partition: 'persist:' + me.type + '_' + me.id.replace('tab_', '') + (localStorage.getItem('id_token') ? '_' + Ext.decode(localStorage.getItem('profile')).user_id : '')
 					,plugins: 'true'
 					,allowtransparency: 'on'
 					,autosize: 'on'
@@ -108,9 +108,10 @@ Ext.define('Rambox.ux.WebView',{
 		});
 
 		webview.addEventListener("page-title-updated", function(e) {
-			var count = e.title.match(/\(([^)]+)\)/);
-				count = count ? parseInt(count[1]) : 0;
-				count = Ext.isNaN(count) ? 0 : count; // Some services have special characters. Example: (•)
+			var count = e.title.match(/\(([^)]+)\)/); // Get text between (...)
+				count = count ? count[1] : '0';
+				count = count.match(/\d+/g); // Some services have special characters. Example: (•)
+				count = count ? parseInt(count[0]) : 0;
 
 			switch ( me.type ) {
 				case 'messenger':

app/view/main/Main.js

@@ -135,6 +135,14 @@ Ext.define('Rambox.view.main.Main', {
 					,margin: '0 0 0 5'
 					,flex: 1
 					,header: { height: 50 }
+					,tools: [
+						{
+							 xtype: 'button'
+							,glyph: 'xf1f8@FontAwesome'
+							,tooltip: 'Remove all Services'
+							,handler: 'removeAllServices'
+						}
+					]
 					,columns: [
 						{
 							 xtype: 'templatecolumn'
@@ -190,6 +198,73 @@ Ext.define('Rambox.view.main.Main', {
 					}
 				}
 			]
+			,tbar: {
+				 xtype: 'toolbar'
+				,height: 42
+				,ui: 'main'
+				,enableOverflow: true
+				,overflowHandler: 'menu'
+				,items: [
+					{
+						 glyph: 'xf1f7@FontAwesome'
+						,text: 'Don\'t Disturb: OFF'
+						,tooltip: 'Lock this app if you will be away for a period of time.'
+						,enableToggle: true
+						,handler: 'dontDisturb'
+						,reference: 'disturbBtn'
+					}
+					,{
+						 glyph: 'xf023@FontAwesome'
+						,text: 'Lock Rambox'
+						,tooltip: 'Lock this app if you will be away for a period of time.'
+						,handler: 'lockRambox'
+					}
+					,'->'
+					,{
+						 xtype: 'image'
+						,id: 'avatar'
+						,bind: {
+							 src: '{avatar}'
+							,hidden: '{!avatar}'
+						}
+						,width: 30
+						,height: 30
+						,style: 'border-radius: 50%;border:2px solid #d8d8d8;'
+					}
+					,{
+						 id: 'usernameBtn'
+						,bind: {
+							 text: '{username}'
+							,hidden: '{!username}'
+						}
+						,menu: [
+							{
+								 text: 'Logout'
+								,glyph: 'xf08b@FontAwesome'
+								,handler: 'logout'
+							}
+						]
+					}
+					,{
+						 xtype: 'label'
+						,id: 'explanationLabel'
+						,html: 'Login to save your configuration (no credentials stored) to sync with all your computers. <b>All current services will be removed.</b>'
+						,bind: {
+							hidden: '{username}'
+						}
+					}
+					,{
+						 text: 'Login'
+						,icon: 'resources/auth0.png'
+						,id: 'loginBtn'
+						,tooltip: 'Powered by Auth0 (http://auth0.com)'
+						,bind: {
+							hidden: '{username}'
+						}
+						,handler: 'login'
+					}
+				]
+			}
 			,bbar: [
 				'->'
 				,{