Revamp userAgent code for services.

You can put in your own arbitrary UA string, as well as
separately select OSes from a menu and type in your own Chrome
version string.

app/Application.js

@@ -13,6 +13,7 @@ Ext.define('Hamsket.Application', {
 	,stores: [
 		 'ServicesList'
 		,'Services'
+		,'OS'
 	]
 
 	,config: {

app/model/Service.js

@@ -81,6 +81,18 @@ Ext.define('Hamsket.model.Service', {
 		name: 'slowed_timers'
 		,type: 'boolean'
 		,defaultValue: true
+	},{
+		name: 'userAgent'
+		,type: 'string'
+		,defaultValue: ''
+	},{
+		name: 'os_override'
+		,type: 'string'
+		,defaultValue: ''
+	},{
+		name: 'chrome_version'
+		,type: 'string'
+		,defaultValue: ''
 	},{
 		 name: 'zoomLevel'
 		,type: 'number'

app/model/ServiceList.js

@@ -56,6 +56,14 @@ Ext.define('Hamsket.model.ServiceList', {
 		 name: 'userAgent'
 		,type: 'string'
 		,defaultValue: ''
+	},{
+		name: 'os_override'
+		,type: 'string'
+		,defaultValue: ''
+	},{
+		name: 'chrome_version'
+		,type: 'string'
+		,defaultValue: ''
 	},{
 		 name: 'note'
 		,type: 'string'

app/store/OS.js

@@ -0,0 +1,14 @@
+Ext.define('Hamsket.store.OS', {
+    extend: 'Ext.data.Store'
+   ,alias: 'store.os'
+
+   ,fields: ['platform', 'label']
+   ,data: [
+        {  'platform': '',         'label': '(none)'}
+        ,{ 'platform': 'win32',    'label': 'Windows'}
+        ,{ 'platform': 'linux',    'label': 'Linux'}
+        ,{ 'platform': 'darwin',   'label': 'MacOS'}
+        ,{ 'platform': 'freebsd',  'label': 'FreeBSD'}
+        ,{ 'platform': 'Solaris',  'label': 'Solaris'}
+   ]
+});

app/store/Services.js

@@ -42,6 +42,9 @@ Ext.define('Hamsket.store.Services', {
 					,custom_css_complex: service.get('custom_css_complex')
 					,passive_event_listeners: service.get('passive_event_listeners')
 					,slowed_timers: service.get('slowed_timers')
+					,userAgent: service.get('userAgent')
+					,os_override: service.get('os_override')
+					,chrome_version: service.get('chrome_version')
 					,enabled: service.get('enabled')
 					,record: service
 					,tabConfig: {

app/ux/WebView.js

@@ -827,22 +827,41 @@ Ext.define('Hamsket.ux.WebView',{
 	}
 	,getUserAgent() {
 		const me = this;
+		const user_platform = me.record.get('os_override');
+		const service_platform = Ext.getStore('ServicesList').getById(me.record.get('type')).get('os_override');
+		const platform = user_platform ? user_platform :
+								service_platform ? service_platform :
+									'';
+		const user_version = me.record.get('chrome_version');
+		const service_version = Ext.getStore('ServicesList').getById(me.record.get('type')).get('chrome_version');
+		const chrome_version = user_version ? user_version :
+									service_version ? service_version :
+										'';
 		const default_ua = `Mozilla/5.0` +
-		` (${me.getOSPlatform()})` +
+		` (${me.getOSPlatform(platform)})` +
 		` AppleWebKit/537.36 (KHTML, like Gecko)` +
-		` Chrome/${me.getChromeVersion()} Safari/537.36`;
+		` Chrome/${me.getChromeVersion(chrome_version)} Safari/537.36`;
 		// NOTE: Keep just in case we need to go back to the basics.
 		// const default_ua = window.navigator.userAgent
 		// 					.replace(`Electron/${me.getElectronVersion()} `,'')
 		// 					.replace(`Hamsket/${me.getAppVersion()} `, '');
 		const service_ua = Ext.getStore('ServicesList').getById(me.record.get('type')).get('userAgent');
-		const ua = service_ua ? service_ua : default_ua;
+		const user_ua = me.record.get('userAgent');
+		const ua = (platform || chrome_version) ? default_ua :
+						user_ua ? user_ua :
+							service_ua ? service_ua :
+								default_ua;
 		return ua;
 	}
-	,getOSArch() {
+	,updateUserAgent() {
+		const me = this;
+		const webcontents = me.getWebContents();
+		webcontents.setUserAgent(me.getUserAgent());
+	}
+	,getOSArch(platform) {
 		const me = this;
 		const remote = require('electron').remote;
-		const platform = remote.require('os').platform();
+		platform = platform ? platform : remote.require('os').platform();
 		let arch = remote.require('os').arch();
 
 		switch (platform) {
@@ -893,27 +912,27 @@ Ext.define('Hamsket.ux.WebView',{
 		}
 		return arch;
 	}
-	,getOSPlatform() {
+	,getOSPlatform(platform) {
 		const me = this;
-		let platform = require('electron').remote.require('os').platform();
+		platform = platform ? platform : require('electron').remote.require('os').platform();
 		switch (platform) {
 			case 'win32':
-				platform = `Windows NT ${me.getOSRelease()}; ${me.getOSArch()}`;
+				platform = `Windows NT ${me.getOSRelease(platform)}; ${me.getOSArch(platform)}`;
 				break;
 			case 'linux':
-				platform = `X11; Linux ${me.getOSArch()}`;
+				platform = `X11; Linux ${me.getOSArch(platform)}`;
 				break;
 			case 'darwin':
-				platform = `${me.getOSArchType()} Mac OS X ${me.getOSRelease()}`;
+				platform = `${me.getOSArchType()} Mac OS X ${me.getOSRelease(platform)}`;
 				break;
 			case 'freebsd':
-				platform = `X11; FreeBSD ${me.getOSArch()}`;
+				platform = `X11; FreeBSD ${me.getOSArch(platform)}`;
 				break;
 			case 'sunos':
 				platform = `X11; SunOS i86pc`;
 				break;
 			default:
-				platform = `X11; ${platform} ${me.getOSArch()}`;
+				platform = `X11; ${platform} ${me.getOSArch(platform)}`;
 		}
 		return platform;
 	}
@@ -927,15 +946,23 @@ Ext.define('Hamsket.ux.WebView',{
 		else
 			return false;
 	}
-	,getOSRelease() {
+	,getOSRelease(platform) {
 		const me = this;
 		const remote = require('electron').remote;
-		return me.isWindows() ?
-		remote.require('os').release().match(/([0-9]+\.[0-9]+)/)[0]
-			: remote.require('os').release();
+		if (me.isWindows(platform)) {
+			if (platform)
+			{
+				return "Windows NT 10.0";
+			} else {
+				return remote.require('os').release().match(/([0-9]+\.[0-9]+)/)[0];
+			}
+		}
+		else {
+			return remote.require('os').release();
+		}
 	}
-	,getChromeVersion() {
-		return require('electron').remote.require('process').versions['chrome'];
+	,getChromeVersion(version) {
+		return version || require('electron').remote.require('process').versions['chrome'];
 	}
 	,getElectronVersion() {
 		return require('process').versions['electron'];

app/view/add/Add.js

@@ -19,11 +19,11 @@ Ext.define('Hamsket.view.add.Add',{
 	// defaults
 	,modal: true
 	,width: 500
-	,height: 750
+	,height: 800
 	,autoShow: true
 	,resizable: false
 	,draggable: false
-	,bodyPadding: 20
+	,bodyPadding: 10
 
 	,initComponent() {
 		const me = this;
@@ -252,54 +252,146 @@ Ext.define('Hamsket.view.add.Add',{
 						]
 					}
 					,{
-						 xtype: 'fieldset'
+						 xtype: 'tabpanel'
 						,title: locale['app.window[7]']
-						,margin: '10 0 0 0'
 						,collapsible: true
 						,collapsed: true
+						,closable: false
+						,layout: 'hbox'
+						,margin: '10 0 0 0'
 						,items: [
 							{
-								 xtype: 'textarea'
-								,fieldLabel: 'Custom JS'
-								,allowBlank: true
-								,name: 'custom_js'
-								,value: me.edit ? me.record.get('custom_js') : ''
-								,anchor: '100%'
-								,height: 100
-								,labelWidth: 64
-								,fieldStyle: 'font-family: Consolas, Lucida Console, Monaco, monospace !important;'
-							},
-							{
-								 xtype: 'checkbox'
-								,fieldLabel: 'Inject CSS via JS'
-								,name: 'custom_css_complex'
-								,value: me.edit ? me.record.get('custom_css_complex') : false
-								,inputValue: true
-								,uncheckedValue: false
-								,labelWidth: 64
-							},
-							{
-								 xtype: 'textarea'
-								,fieldLabel: 'Custom CSS'
-								,allowBlank: true
-								,name: 'custom_css'
-								,value: me.edit ? me.record.get('custom_css') : ''
+								xtype: 'fieldset'
+								,title: 'Code Injection'
 								,anchor: '100%'
-								,height: 100
-								,labelWidth: 64
-								,fieldStyle: 'font-family: Consolas, Lucida Console, Monaco, monospace !important;'
-							},
-							{
-								 xtype: 'textarea'
-								,fieldLabel: 'Custom badge update JS'
-								,allowBlank: true
-								,name: 'js_unread'
-								,value: me.edit ? me.record.get('js_unread') : ''
-								,anchor: '100%'
-								,height: 100
-								,labelWidth: 64
-								,fieldStyle: 'font-family: Consolas, Lucida Console, Monaco, monospace !important;'
-						}
+								,items: [
+								{
+									xtype: 'textarea'
+									,fieldLabel: 'Custom JS'
+									,allowBlank: true
+									,name: 'custom_js'
+									,value: me.edit ? me.record.get('custom_js') : ''
+									,anchor: '100%'
+									,height: 100
+									,labelWidth: 64
+									,fieldStyle: 'font-family: Consolas, Lucida Console, Monaco, monospace !important;'
+								},
+								{
+									xtype: 'checkbox'
+									,fieldLabel: 'Inject CSS via JS'
+									,name: 'custom_css_complex'
+									,value: me.edit ? me.record.get('custom_css_complex') : false
+									,inputValue: true
+									,uncheckedValue: false
+									,labelWidth: 64
+								},
+								{
+									xtype: 'textarea'
+									,fieldLabel: 'Custom CSS'
+									,allowBlank: true
+									,name: 'custom_css'
+									,value: me.edit ? me.record.get('custom_css') : ''
+									,anchor: '100%'
+									,height: 100
+									,labelWidth: 64
+									,fieldStyle: 'font-family: Consolas, Lucida Console, Monaco, monospace !important;'
+								},
+								{
+									xtype: 'textarea'
+									,fieldLabel: 'Custom badge update JS'
+									,allowBlank: true
+									,name: 'js_unread'
+									,value: me.edit ? me.record.get('js_unread') : ''
+									,anchor: '100%'
+									,height: 100
+									,labelWidth: 64
+									,fieldStyle: 'font-family: Consolas, Lucida Console, Monaco, monospace !important;'
+								}
+							]
+						},
+						{
+						xtype: 'fieldset'
+						,title: 'User Agent'
+						,anchor: '100%'
+						,margin: '10 0 0 0'
+						,items: [
+									{
+										xtype: 'combobox'
+										,fieldLabel: 'Override OS'
+										,name: 'os_override'
+										,anchor: '100%'
+										,value: me.edit ? 
+														me.record.get('os_override') ? me.record.get('os_override') :
+															me.service.get('os_override') ? me.service.get('os_override') :
+																''
+														: me.record.get('os_override') ? me.record.get('os_override') :
+															''
+										,editable: false
+										,forceSelection: true
+										,queryMode: 'local'
+										,store: 'OS'
+										,displayField: 'label'
+										,valueField: 'platform'
+										,multiSelect: false
+										,listeners: {
+											select(form, selected, opts) {
+												if (selected.data.platform === '') {
+													const version_override = form.nextSibling('[name=chrome_version]').value;
+													version_override || form.nextSibling('[name=userAgent]').setDisabled(false);
+												} else {
+													form.nextSibling('[name=userAgent]').setDisabled(true);
+												}
+											}
+										}
+									},
+									{
+										xtype: 'textfield'
+										,fieldLabel: 'Override Chrome Version'
+										,name: 'chrome_version'
+										,anchor: '100%'
+										,value: me.edit ?
+														me.record.get('chrome_version') ? me.record.get('chrome_version') :
+															me.service.get('chrome_version') ? me.service.get('chrome_version') :
+																''
+														: me.record.get('chrome_version') ? me.record.get('chrome_version') :
+															''
+										,listeners: {
+											change(form, new_value, old_value, opts) {
+												if (new_value === '') {
+													const os_override = form.previousSibling('[name=os_override]').value;
+													os_override || form.nextSibling('[name=userAgent]').setDisabled(false);
+												} else {
+													form.nextSibling('[name=userAgent]').setDisabled(true);
+												}
+											}
+										}
+									},
+									{
+										xtype: 'textfield'
+										,fieldLabel: 'Default User Agent'
+										,name: 'defaultUserAgent'
+										,anchor: '100%'
+										,labelWidth: 64
+										,fieldStyle: 'font-family: Consolas, Lucida Console, Monaco, monospace !important;'
+										,value: me.edit ? me.service.get('userAgent') ? me.service.get('userAgent') :
+															'' :
+															''
+										,hidden: me.edit ? !me.service.get('userAgent') : true
+										,disabled: true
+									},
+									{
+										xtype: 'textfield'
+										,fieldLabel: 'Custom User Agent'
+										,name: 'userAgent'
+										,anchor: '100%'
+										,allowBlank: true
+										,labelWidth: 64
+										,fieldStyle: 'font-family: Consolas, Lucida Console, Monaco, monospace !important;'
+										,value: me.edit ? me.record.get('userAgent') : ''
+										,disabled: me.edit ? (me.record.get('os_override') || me.record.get('chrome_version')): false
+									}
+								]
+							}
 						]
 					}
 					,{

app/view/add/AddController.js

@@ -44,6 +44,9 @@ Ext.define('Hamsket.view.add.AddController', {
 				,custom_css_complex: formValues.custom_css_complex
 				,passive_event_listeners: formValues.passive_event_listeners
 				,slowed_timers: formValues.slowed_timers
+				,userAgent: formValues.userAgent
+				,os_override: formValues.os_override
+				,chrome_version: formValues.chrome_version
 			});
 
 			const view = Ext.getCmp('tab_'+win.record.get('id'));
@@ -67,8 +70,38 @@ Ext.define('Hamsket.view.add.AddController', {
 				}
 			}
 			// Apply the JS Code of the Tab
-			if ( win.down('textarea').isDirty() ) {
-				Ext.Msg.confirm(locale['app.window[8]'].toUpperCase(), 'Hamsket needs to reload the service to execute the new JavaScript code. Do you want to do it now?', function( btnId ) {
+			let showNotify=false;
+			const standard_form_names = [
+				 'custom_js'
+				,'custom_css_complex'
+				,'custom_css'
+				,'js_unread'
+				,'passive_event_listeners'
+				,'slowed_timers'
+			];
+			for (form_name of standard_form_names) {
+				const form =  win.down('[name=' + form_name + ']');
+				if (form.isDirty()) {
+					showNotify = true;
+					break;
+				}
+			}
+			const ua_form_names = [
+				'os_override',
+				'userAgent',
+				'chrome_version'
+			];
+			for (form_name of ua_form_names) {
+				const form =  win.down('[name=' + form_name + ']');
+				if (form.isDirty()) {
+					showNotify = true;
+					view.updateUserAgent();
+					break;
+				}
+			}
+
+			if ( showNotify ) {
+				Ext.Msg.confirm(locale['app.window[8]'].toUpperCase(), 'Hamsket needs to reload the service to apply your changes. Do you want to do it now?', function( btnId ) {
 					if ( btnId === 'yes' ) view.reloadService();
 				});
 			}
@@ -101,6 +134,9 @@ Ext.define('Hamsket.view.add.AddController', {
 				,custom_css_complex: formValues.custom_css_complex
 				,passive_event_listeners: formValues.passive_event_listeners
 				,slowed_timers: formValues.slowed_timers
+				,userAgent: formValues.userAgent
+				,os_override: formValues.os_override
+				,chrome_version: formValues.chrome_version
 			});
 			service.save();
 			Ext.getStore('Services').add(service);

app/view/main/MainController.js

@@ -112,6 +112,9 @@ Ext.define('Hamsket.view.main.MainController', {
 				,custom_css_complex: rec.get('custom_css_complex')
 				,passive_event_listeners: rec.get('passive_event_listeners')
 				,slowed_timers: rec.get('slowed_timers')
+				,userAgent: rec.get('userAgent')
+				,os_override: rec.get('os_override')
+				,chrome_version: rec.get('chrome_version')
 				,enabled: rec.get('enabled')
 				,record: rec
 				,hidden: hideTab