From 5c2b948a15944a15df59ec6cfe64880cd8532afd Mon Sep 17 00:00:00 2001
From: TheGoddessInari <thegoddessinari@gmail.com>
Date: Fri, 20 Jul 2018 15:37:23 -0700
Subject: [PATCH] Add custom CSS injection. Closes #6

---
 app/model/Service.js          |  4 ++++
 app/model/ServiceList.js      |  4 ++++
 app/ux/WebView.js             | 11 +++++++++++
 app/view/add/Add.js           | 10 ++++++++++
 app/view/add/AddController.js |  2 ++
 5 files changed, 31 insertions(+)

diff --git a/app/model/Service.js b/app/model/Service.js
index 9d77df41..4e81dfe4 100644
--- a/app/model/Service.js
+++ b/app/model/Service.js
@@ -65,6 +65,10 @@ Ext.define('Rambox.model.Service', {
 		 name: 'js_unread'
 		,type: 'string'
 		,defaultValue: ''
+	},{
+		name: 'custom_css'
+		,type: 'string'
+		,defaultValue: ''
 	},{
 		 name: 'zoomLevel'
 		,type: 'number'
diff --git a/app/model/ServiceList.js b/app/model/ServiceList.js
index a2c45e93..1a80bbf3 100644
--- a/app/model/ServiceList.js
+++ b/app/model/ServiceList.js
@@ -24,6 +24,10 @@ Ext.define('Rambox.model.ServiceList', {
 		 name: 'js_unread'
 		,type: 'string'
 		,defaultValue: ''
+	},{
+		name: 'custom_css'
+		,type: 'string'
+		,defaultValue: ''
 	},{
 		 name: 'titleBlink'
 		,type: 'boolean'
diff --git a/app/ux/WebView.js b/app/ux/WebView.js
index bbe3ba8d..9bb4b4b7 100644
--- a/app/ux/WebView.js
+++ b/app/ux/WebView.js
@@ -404,6 +404,7 @@ Ext.define('Rambox.ux.WebView',{
 			if ( me.record.get('muted') || localStorage.getItem('locked') || JSON.parse(localStorage.getItem('dontDisturb')) ) me.setAudioMuted(true, true);
 
 			var js_inject = '';
+			var css_inject = '';
 			// Injected code to detect new messages
 			if ( me.record ) {
 				var js_unread = Ext.getStore('ServicesList').getById(me.record.get('type')).get('js_unread');
@@ -414,6 +415,15 @@ Ext.define('Rambox.ux.WebView',{
 					console.log(js_unread);
 					js_inject += js_unread;
 				}
+
+				var custom_css = Ext.getStore('ServicesList').getById(me.record.get('type')).get('custom_css');
+				custom_css = custom_css + me.record.get('custom_css');
+				if ( custom_css !== '' ) {
+					console.groupCollapsed(me.record.get('type').toUpperCase() + ' - Injected Custom CSS');
+					console.info(me.type);
+					console.log(custom_css);
+					css_inject += custom_css;
+				}
 			}
 
 			// Prevent Title blinking (some services have) and only allow when the title have an unread regex match: "(3) Title"
@@ -446,6 +456,7 @@ Ext.define('Rambox.ux.WebView',{
 			});
 
 			webview.executeJavaScript(js_inject);
+			webview.insertCSS(css_inject);
 		});
 
 		webview.addEventListener('ipc-message', function(event) {
diff --git a/app/view/add/Add.js b/app/view/add/Add.js
index d96806fd..2c340fb3 100644
--- a/app/view/add/Add.js
+++ b/app/view/add/Add.js
@@ -244,6 +244,16 @@ Ext.define('Rambox.view.add.Add',{
 								,anchor: '100%'
 								,height: 120
 								,style: 'font-family: Consolas, "Lucida Console", Monaco, monospace'
+							},
+							{
+								xtype: 'textarea'
+								,fieldLabel: 'Custom CSS'
+								,allowBlank: true
+								,name: 'custom_css'
+								,value: me.edit ? me.record.get('custom_css') : ''
+								,anchor: '100%'
+								,height: 120
+								,style: 'font-family: Consolas, "Lucida Console", Monaco, monospace'	
 							}
 						]
 					}
diff --git a/app/view/add/AddController.js b/app/view/add/AddController.js
index 09a0b581..57e42805 100644
--- a/app/view/add/AddController.js
+++ b/app/view/add/AddController.js
@@ -40,6 +40,7 @@ Ext.define('Rambox.view.add.AddController', {
 				,includeInGlobalUnreadCounter: formValues.includeInGlobalUnreadCounter
 				,trust: formValues.trust
 				,js_unread: formValues.js_unread
+				,custom_css: formValues.custom_css
 			});
 
 			var view = Ext.getCmp('tab_'+win.record.get('id'));
@@ -95,6 +96,7 @@ Ext.define('Rambox.view.add.AddController', {
 				,includeInGlobalUnreadCounter: formValues.includeInGlobalUnreadCounter
 				,trust: formValues.trust
 				,js_unread: formValues.js_unread
+				,custom_css: formValues.custom_css
 			});
 			service.save();
 			Ext.getStore('Services').add(service);