diff --git a/app/model/Service.js b/app/model/Service.js
index 4ebb5427..41eb4de2 100644
--- a/app/model/Service.js
+++ b/app/model/Service.js
@@ -41,6 +41,10 @@ Ext.define('Rambox.model.Service', {
name: 'trust'
,type: 'boolean'
,defaultValue: false
+ },{
+ name: 'enabled'
+ ,type: 'boolean'
+ ,defaultValue: true
},{
name: 'js_unread'
,type: 'string'
diff --git a/app/store/Services.js b/app/store/Services.js
index 33bcec1c..81a2f441 100644
--- a/app/store/Services.js
+++ b/app/store/Services.js
@@ -34,6 +34,7 @@ Ext.define('Rambox.store.Services', {
,src: service.get('url')
,type: service.get('type')
,muted: service.get('muted')
+ ,enabled: service.get('enabled')
,record: service
,tabConfig: {
service: service
diff --git a/app/ux/WebView.js b/app/ux/WebView.js
index 9b356d6b..98be0eeb 100644
--- a/app/ux/WebView.js
+++ b/app/ux/WebView.js
@@ -34,22 +34,7 @@ Ext.define('Rambox.ux.WebView',{
if ( me.record.get('trust') ) ipc.send('allowCertificate', me.src);
Ext.apply(me, {
- items: [{
- xtype: 'component'
- ,hideMode: 'offsets'
- ,autoEl: {
- tag: 'webview'
- ,src: me.src
- ,style: 'width:100%;height:100%;'
- ,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'
- ,allowpopups: 'on'
- ,blinkfeatures: 'ApplicationCache,GlobalCacheStorage'
- ,useragent: Ext.getStore('ServicesList').getById(me.type).get('userAgent')
- }
- }]
+ items: me.webViewConstructor()
,tabConfig: {
listeners: {
badgetextchange: me.onBadgeTextChange
@@ -61,6 +46,7 @@ Ext.define('Rambox.ux.WebView',{
}
}
,clickEvent: ''
+ ,style: !me.enabled ? '-webkit-filter: grayscale(1)' : ''
,menu: {
plain: true
,items: [
@@ -117,13 +103,6 @@ Ext.define('Rambox.ux.WebView',{
,scope: me
,handler: me.reloadService
}
- ,{
- text: localStorage.getItem('offline_'+me.id.replace('tab_', '')) ? 'Go Online' : 'Go Offline'
- ,glyph: 'xf0ac@FontAwesome'
- ,scope: me
- ,offline: localStorage.getItem('offline_'+me.id.replace('tab_', '')) ? true : false
- ,handler: me.setOffline
- }
,'-'
,{
text: 'Toggle Developer Tools'
@@ -142,6 +121,41 @@ Ext.define('Rambox.ux.WebView',{
me.callParent(config);
}
+ ,webViewConstructor: function() {
+ var me = this;
+
+ var cfg;
+ if ( !me.record.get('enabled') ) {
+ cfg = {
+ xtype: 'container'
+ ,html: '
Service Disabled
'
+ ,style: 'text-align:center;'
+ ,padding: 100
+ };
+ } else {
+ cfg = {
+ xtype: 'component'
+ ,hideMode: 'offsets'
+ ,autoRender: true
+ ,autoShow: true
+ ,autoEl: {
+ tag: 'webview'
+ ,src: me.src
+ ,style: 'width:100%;height:100%;'
+ ,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'
+ ,allowpopups: 'on'
+ ,blinkfeatures: 'ApplicationCache,GlobalCacheStorage'
+ ,useragent: Ext.getStore('ServicesList').getById(me.type).get('userAgent')
+ }
+ };
+ }
+
+ return cfg;
+ }
+
,onBadgeTextChange: function( tab, badgeText, oldBadgeText ) {
if ( oldBadgeText === null ) oldBadgeText = 0;
var actualNotifications = Rambox.app.getTotalNotifications();
@@ -154,6 +168,9 @@ Ext.define('Rambox.ux.WebView',{
,onAfterRender: function() {
var me = this;
+
+ if ( !me.record.get('enabled') ) return;
+
var webview = me.down('component').el.dom;
// Google Analytics Event
@@ -283,16 +300,19 @@ Ext.define('Rambox.ux.WebView',{
ipc.send('setServiceNotifications', webview.partition, notification);
}
- ,setOffline: function(btn, e) {
+ ,setEnabled: function(enabled) {
var me = this;
- var webview = me.down('component').el.dom;
- console.info(me.type, 'Going '+ (!btn.offline ? 'offline' : 'online') + '...');
-
- webview.getWebContents().session.setProxy({ proxyRules: !btn.offline ? 'offline' : '' }, Ext.emptyFn);
- btn.offline = !btn.offline;
- btn.setText(Ext.String.toggle(btn.text, 'Go Online', 'Go Offline'));
- btn.offline ? localStorage.setItem('offline_'+me.id.replace('tab_', ''), true) : localStorage.removeItem('offline_'+me.id.replace('tab_', ''));
+ me.removeAll();
+ me.add(me.webViewConstructor());
+ if ( enabled ) {
+ me.resumeEvent('afterrender');
+ me.show();
+ me.tab.setStyle('-webkit-filter', 'grayscale(0)');
+ } else {
+ me.suspendEvent('afterrender');
+ me.tab.setStyle('-webkit-filter', 'grayscale(1)');
+ }
}
,goBack: function() {
diff --git a/app/view/main/Main.js b/app/view/main/Main.js
index 33e5d243..2112ae47 100644
--- a/app/view/main/Main.js
+++ b/app/view/main/Main.js
@@ -194,6 +194,18 @@ Ext.define('Rambox.view.main.Main', {
}
]
}
+ ,{
+ xtype: 'checkcolumn'
+ ,width: 40
+ ,dataIndex: 'enabled'
+ ,renderer: function(value, metaData) {
+ metaData.tdAttr = 'data-qtip="Service '+(value ? 'Enabled' : 'Disabled')+'"';
+ return this.defaultRenderer(value, metaData);
+ }
+ ,listeners: {
+ checkchange: 'onEnableDisableService'
+ }
+ }
]
,viewConfig: {
emptyText: 'No services added...'
diff --git a/app/view/main/MainController.js b/app/view/main/MainController.js
index 3efe7643..fc355ce8 100644
--- a/app/view/main/MainController.js
+++ b/app/view/main/MainController.js
@@ -6,11 +6,13 @@ Ext.define('Rambox.view.main.MainController', {
// Make focus on webview every time the user change tabs, to enable the autofocus in websites
,onTabChange: function( tabPanel, newTab, oldTab ) {
var me = this;
- var webview = newTab.down('component').el.dom;
// Set Google Analytics event
ga_storage._trackPageview('/index.html', 'main');
+ if ( newTab.id === 'ramboxTab' || !newTab.record.get('enabled') ) return;
+
+ var webview = newTab.down('component').el.dom;
if ( webview ) webview.focus();
}
@@ -432,6 +434,12 @@ Ext.define('Rambox.view.main.MainController', {
win.down('textfield[name="serviceName"]').focus(true, 100);
}
+ ,onEnableDisableService: function(cc, rowIndex, checked) {
+ var rec = Ext.getStore('Services').getAt(rowIndex);
+
+ Ext.getCmp('tab_'+rec.get('id')).setEnabled(checked);
+ }
+
,onNewServiceSelect: function( view, record, item, index, e ) {
if ( record.get('url').indexOf('___') >= 0 ) {
this.showCustomModal(record);
diff --git a/packages/local/rambox-default-theme/sass/src/grid/column/Check.scss b/packages/local/rambox-default-theme/sass/src/grid/column/Check.scss
new file mode 100644
index 00000000..234f8df0
--- /dev/null
+++ b/packages/local/rambox-default-theme/sass/src/grid/column/Check.scss
@@ -0,0 +1,3 @@
+#ramboxTab .x-grid-cell-inner-checkcolumn {
+ padding: 13px 10px 14px 10px !important;
+}