Add customUserAgent field to services

2020-02-20 12:46:53 +01:00 · 2020-02-20 12:46:53 +01:00 · 1d988b38b7
commit 1d988b38b7
parent 7fc4ddcde1
10 changed files with 253 additions and 676 deletions
--- a/package.json
+++ b/package.json
@ -9,7 +9,6 @@
  "homepage": "https://gitlab.com/ArisuOngaku/tabs",
  "license": "MIT",
  "main": "tabs.js",
-  "type": "module",
  "scripts": {
    "start": "electron .",
    "dev": "electron . --dev",
--- a/resources/empty.html
+++ b/resources/empty.html
@ -0,0 +1,11 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <meta charset="UTF-8">
+    <title>Loading...</title>
+</head>
+
+<body>
+<p>Loading...</p>
+</body>
+</html>
--- a/resources/js/index.js
+++ b/resources/js/index.js
@ -16,6 +16,7 @@ let selectedService = null;
 let forwardButton;
 let backButton;
 let addButton;
+let emptyPage;


 // Service context menu
@ -69,7 +70,7 @@ function openServiceContextMenu(event, serviceId) {
 }


-ipcRenderer.on('data', (event, appData, brandIcons, solidIcons, actualServices, actualSelectedService) => {
+ipcRenderer.on('data', (event, appData, brandIcons, solidIcons, actualServices, actualSelectedService, emptyUrl) => {
    // App info
    appInfo.title = appData.title;

@ -113,6 +114,9 @@ ipcRenderer.on('data', (event, appData, brandIcons, solidIcons, actualServices,
        actualSelectedService = 0;
    }
    setActiveService(actualSelectedService);
+
+    // Empty
+    emptyPage = emptyUrl;
 });

 ipcRenderer.on('updateService', (e, id, data) => {
@ -331,29 +335,40 @@ function loadService(serviceId, service) {

        document.querySelector('#services > .loader').classList.remove('hidden');
        service.view = document.createElement('webview');
-        service.view.setAttribute('src', service.url);
        service.view.setAttribute('partition', 'persist:service_' + service.partition);
        service.view.setAttribute('autosize', 'true');
        service.view.setAttribute('preload', 'js/service-webview.js');
+        service.view.setAttribute('src', emptyPage);

        // Append element to DOM
        document.querySelector('#services').appendChild(service.view);

-        // On load event
-        service.view.addEventListener('dom-ready', () => {
-            if (service.customCSS) {
-                service.view.insertCSS(service.customCSS);
-            }
-
-            document.querySelector('#services > .loader').classList.add('hidden');
-            service.li.classList.add('loaded');
-            service.viewReady = true;
-
-            updateNavigation();
-
-            if (selectedService === null) {
-                setActiveService(serviceId);
+        // Load chain
+        let listener;
+        service.view.addEventListener('dom-ready', listener = () => {
+            service.view.removeEventListener('dom-ready', listener);
+
+            service.view.addEventListener('dom-ready', listener = () => {
+                if (service.customCSS) {
+                    service.view.insertCSS(service.customCSS);
+                }
+
+                document.querySelector('#services > .loader').classList.add('hidden');
+                service.li.classList.add('loaded');
+                service.viewReady = true;
+
+                updateNavigation();
+
+                if (selectedService === null) {
+                    setActiveService(serviceId);
+                }
+            });
+
+            if (typeof service.customUserAgent === 'string') {
+                let webContents = remote.webContents.fromId(service.view.getWebContentsId());
+                webContents.setUserAgent(service.customUserAgent);
            }
+            service.view.setAttribute('src', service.url);
        });

        // Load favicon
@ -440,16 +455,16 @@ function updateWindowTitle() {
    if (selectedService === null) {
        ipcRenderer.send('updateWindowTitle', null);
    } else if (services[selectedService].viewReady) {
-        ipcRenderer.send('updateWindowTitle', selectedService, services[selectedService].view.getWebContents().getTitle());
+        ipcRenderer.send('updateWindowTitle', selectedService, remote.webContents.fromId(services[selectedService].view.getWebContentsId()).getTitle());
    }
 }

 function goForward() {
    let view = services[selectedService].view;
-    if (view) view.getWebContents().goForward();
+    if (view) remote.webContents.fromId(view.getWebContentsId()).goForward();
 }

 function goBack() {
    let view = services[selectedService].view;
-    if (view) view.getWebContents().goBack();
+    if (view) remote.webContents.fromId(view.getWebContentsId()).goBack();
 }
--- a/resources/js/service-settings.js
+++ b/resources/js/service-settings.js
@ -47,6 +47,10 @@ document.addEventListener('DOMContentLoaded', () => {
    });

    ipcRenderer.send('sync-settings');
+
+    document.getElementById('userAgentAutoFill').addEventListener('click', () => {
+        document.getElementById('custom-user-agent').value = 'Mozilla/5.0 (X11; Linux x86_64; rv:73.0) Gecko/20100101 Firefox/73.0';
+    });
 });

 function updateIconSearchResults() {
@ -120,6 +124,7 @@ function loadServiceValues() {
    document.getElementById('use-favicon').checked = service.useFavicon;
    document.getElementById('auto-load').checked = service.autoLoad;
    document.getElementById('custom-css').value = service.customCSS;
+    document.getElementById('custom-user-agent').value = service.customUserAgent;

    isImageCheckbox.checked = service.isImage;
    if (service.isImage) {
@ -148,6 +153,8 @@ function save() {
    service.autoLoad = formData.get('autoLoad') === 'on';
    service.customCSS = formData.get('customCSS');

+    let customUserAgent = formData.get('customUserAgent').trim();
+    service.customUserAgent = customUserAgent.length === 0 ? null : customUserAgent;

    if (!isValid()) {
        return;
@ -175,4 +182,4 @@ function isValid() {
        return false;
    }
    return true;
-}
+}
--- a/resources/service-settings.html
+++ b/resources/service-settings.html
@ -40,6 +40,12 @@
            <textarea name="customCSS" id="custom-css" rows="3"></textarea>
        </div>

+        <div class="form-group">
+            <label for="custom-user-agent">Custom UserAgent (i.e. google services)</label>
+            <input type="text" name="customUserAgent" id="custom-user-agent">
+            <button type="button" id="userAgentAutoFill">Auto-fill</button>
+        </div>
+
        <div id="icon-choice">
            <div class="form-group-header">
                <h2>Service icon</h2>
@ -76,4 +82,4 @@
    </div>
 </form>
 </body>
-</html>
+</html>
--- a/resources/style/service-settings.css
+++ b/resources/style/service-settings.css
@ -70,7 +70,7 @@ form {
    display: grid;

    margin: 8px;
-    grid-template-columns: 0fr auto;
+    grid-template-columns: 0fr auto 0fr;
 }

 .form-group > * {
@ -80,11 +80,11 @@ form {
    align-self: center;
 }

-.form-group > :nth-child(1) {
+.form-group > :first-child {
    justify-self: end;
 }

-.form-group > :nth-child(2) {
+.form-group > :not(:first-child) {
    margin-left: 8px;
 }

@ -121,4 +121,4 @@ form {

 #custom-css {
    min-height: 96px;
-}
+}
--- a/src/Service.js
+++ b/src/Service.js
@ -35,6 +35,7 @@ Service.requiredProperties = {
    'useFavicon': true,
    'autoLoad': false,
    'customCSS': null,
+    'customUserAgent': null,
 };

-export default Service;
+export default Service;
--- a/src/main.js
+++ b/src/main.js
@ -194,7 +194,7 @@ function createWindow() {

 function sendData() {
    console.log('Syncing data');
-    window.webContents.send('data', Meta.title, brandIcons, solidIcons, config.services, selectedService);
+    window.webContents.send('data', Meta.title, brandIcons, solidIcons, config.services, selectedService, path.resolve(resourcesDir, 'empty.html'));
 }

 function setActiveService(index) {
--- a/tabs.js
+++ b/tabs.js
@ -7,4 +7,4 @@ lock.lock().then(() => {
 }).catch(error => {
    console.error(error);
    process.exit(0);
-});
+});
--- a/yarn.lock
+++ b/yarn.lock