Allow fetching from multiple sources

capacitor.config.json

@@ -5,9 +5,13 @@
   "ios": {
     "allowsBackForwardNavigationGestures": true
   },
+  "server": {
+    "url": "http://sam.local:5173",
+    "cleartext": true
+  },
   "plugins": {
     "SplashScreen": {
-      "launchAutoHide": true
+      "launchAutoHide": false
     }
   }
 }

readme.md

@@ -2,28 +2,15 @@
 
 ```npm run start```
 
-### Browser: Dev Frontend and Dev Backend (localhost)
+## Install Native Tools
-This option should be at the top level of capacitor.config.json
-"server": {
-    "url": "http://sam.local:5173",
-    "cleartext": true
-},
 
-### Browser: Prod Frontend and Prod Backend
-Run:
-vite build
-npx serve dist
-
-If you need to login again:
-run localStorage.clear() in the browser dev tools console and then refresh the page.
-
-## Run On Device
 https://capacitorjs.com/docs/ios#adding-the-ios-platform
 
-One-Time Install:
 npm install @capacitor/ios
 npx cap add ios
 
+## Run On Device
+
 To Open XCode:
 npx cap open ios
 
@@ -33,17 +20,40 @@ npm run build && npx cap copy ios
 If getting black screen:
 npx cap sync iOS
 
-### iOS: Dev Frontend and Dev Backend (localhost)
+
+## iOS:
+
+### Browser: Dev Front and Dev Back (localhost)
 This option should be at the top level of capacitor.config.json
 "server": {
     "url": "http://sam.local:5173",
     "cleartext": true
 },
 
-### iOS: Dev Frontend with Prod Backend (frm.so)
+### Browser: Prod Front and Prod Back
+Run:
+vite build
+npx serve dist
+
+If you need to login again:
+run localStorage.clear() in the browser dev tools console and then refresh the page.
+
+
+
+
+## iOS:
+
+### Dev Front, Dev Back (localhost)
+This option should be at the top level of capacitor.config.json
+"server": {
+    "url": "http://sam.local:5173",
+    "cleartext": true
+},
+
+### Dev Front, Prod Back (frm.so)
 Add "https://frm.so" to VITE_API_URL in .env.development
 
-### iOS: Prod Frontend and Prod Backend (frm.so)
+### Prod Front, Prod Back (frm.so)
 Remove the "server" object from capacitor.config.
 
 ### Various Commands

src/.env.development

@@ -1 +0,0 @@
-VITE_API_URL=http://localhost:10002

src/.env.production

@@ -1 +0,0 @@
-VITE_API_URL=https://frm.so

src/_/code/shared.css

@@ -1,114 +0,0 @@
-:root {
-    --main: #FFE9C8;
-    --accent: #570b0b;
-    --lightaccent: #760f0f;
-    --darkaccent: #dfc9ac;
-    --text: #340000;
-    --yellow: #f1f3c3;
-    --bone: #fff2e7;
-    --gold: #FEBA7D;
-    --divider: #bb7c36;
-    --green: #0857265c;
-    --red: #ff0000;
-    --quillred: #DE3F3F;
-    --darkred: #6b2c1d;
-    --brown: #812A18;
-
-    --sidebar: #698b6f;
-    --divider: #523636;
-    --lightDivider: #52363681;
-    --darkbrown: #3f0808;
-    --darkgrey: #5c4646;
-
-    --headertext: #433c36e2;
-    --searchbackground: #ffeed8;
-    --loginButton: var(--main);
-    --loginBackground: #d96b6b;
-
-    --home-src: /_/icons/home.svg;
-    --home-selected-src: /_/icons/homelightselected.svg;
-    --people-src: /_/icons/people.svg;
-    --people-selected-src: /_/icons/peoplelightselected.svg;
-    --settings-src: /_/icons/settings.svg;
-    --settings-selected-src: /_/icons/settingslightselected.svg;
-    --events-src: /_/icons/events.svg;
-    --events-selected-src: /_/icons/eventslightselected.svg;
-    --jobs-src: /_/icons/jobs.svg;
-    --jobs-selected-src: /_/icons/jobslightselected.svg;
-
-    --column-src: /_/icons/column2.svg;
-    --nodes-src: /_/icons/nodes.svg;
-    --forum-src: /_/icons/forum.svg;
-    --trash-src: /_/icons/trash.svg;
-
-    --pin-src: /_/icons/pin.svg;
-    --time-src: /_/icons/time.svg;
-
-    --top-inset: env(safe-area-inset-top, 0px);
-    --bottom-inset: env(safe-area-inset-bottom, 0px);
-}
-
-@media (prefers-color-scheme: dark) {
-:root {
-    --main: #2A150E;
-    --lightaccent: #69413a;
-    --accent: #3D2622;
-    --darkaccent: #240609;
-    --text: #FADFB6;
-
-    --sidebar: #240609;
-    --divider: #523636;
-    --lightDivider: #52363680;
-    --darktext: #62473E;
-    --headertext: #ffd8bb;
-    --darkred: #6b2c1d;
-    --searchbackground: #260F0C;
-    --loginButton: var(--darkaccent);
-    --loginBackground: var(--accent);
-
-
-    --home-src: /_/icons/homelight.svg;
-    --home-selected-src: /_/icons/homelightselected.svg;
-    --people-src: /_/icons/peoplelight.svg;
-    --people-selected-src: /_/icons/peoplelightselected.svg;
-    --settings-src: /_/icons/settingslight.svg;
-    --settings-selected-src: /_/icons/settingslightselected.svg;
-    --events-src: /_/icons/eventslight.svg;
-    --events-selected-src: /_/icons/eventslightselected.svg;
-    --jobs-src: /_/icons/jobslight.svg;
-    --jobs-selected-src: /_/icons/jobslightselected.svg;
-
-    --column-src: /_/icons/column2.svg;
-    --nodes-src: /_/icons/nodes.svg;
-    --forum-src: /_/icons/forum.svg;
-    --trash-src: /_/icons/trash.svg;
-
-    --pin-src: /_/icons/pinlight.svg;
-    --time-src: /_/icons/timelight.svg;
-}
-}
-
-input {
-	outline: none;
-    caret-color: var(--text);  /* hide real caret */
-}
-
-input::placeholder {
-    font-family: Arial;
-    color: #5C504D;
-}
-
-html,
-body {
-	padding: 0;
-	margin: 0;
-	font-family: Arial;
-}
-
-body {
-	background-color: var(--main);
-	padding-top: env(safe-area-inset-top);
-	padding-bottom: env(safe-area-inset-bottom);
-	padding-left: env(safe-area-inset-left);
-	padding-right: env(safe-area-inset-right);
-}

src/index.html

@@ -10,9 +10,10 @@
     <meta name="format-detection" content="telephone=no" />
     <meta name="msapplication-tap-highlight" content="no" />
     <link rel="manifest" href="./manifest.json" />
-    <link rel="stylesheet" href="./_/code/shared.css" />
+    <link rel="stylesheet" href="" />
+    <script>window.config = { UI: 'https://frm.so', SERVER: 'https://frm.so' }</script>
     <script type="module">
-      await import('./util.js')
+      await import('./mobileutil.js')
 
       function appendScript(src, isModule = false) {
         return new Promise((resolve, reject) => {
@@ -26,9 +27,24 @@
         })
       }
 
+      function appendStylesheet(href, { replaceExisting = false } = {}) {
+            return new Promise((resolve, reject) => {
+                    if (replaceExisting) {
+                    document.querySelector('link[rel="stylesheet"]')?.remove();
+                }
+                const link = document.createElement('link');
+                link.rel = 'stylesheet';
+                link.href = href;
+                link.onload = resolve;
+                link.onerror = reject;
+                document.head.appendChild(link);
+            });
+        }
+
       try {
-        await appendScript(window.util.HOST + '/_/code/quill.js')
+        await appendStylesheet(`${window.config.UI}/_/code/shared.css`, { replaceExisting: true });
-        await appendScript(window.util.HOST + '/83947261/index.js', true)
+        await appendScript(window.config.UI + '/_/code/quill.js')
+        await appendScript(window.config.UI + '/83947261/index.js', true)
       } catch (e) {
         document.body.innerHTML = `
           <style>

src/mobileutil.js

@@ -20,13 +20,7 @@ window.capacitor = {
     SplashScreen,
 }
 
-const env = import.meta.env
+window.mobileUtil = class mobileUtil {
-
-window.util = class util {
-
-    static HOST = env.VITE_API_URL
-    static PushNotifications = PushNotifications
-    static Preferences = Preferences
 
     static async authFetch(url, options = {}) {
         const { value: token } = await Preferences.get({ key: 'auth_token' });
@@ -44,10 +38,4 @@ window.util = class util {
     static async removeAuthToken() {
         await Preferences.remove({ key: 'auth_token'})
     }
-
-    static cssVariable(value) {
-        return getComputedStyle(document.documentElement)
-        .getPropertyValue("--" + value)
-        .trim();
-    }
 }