Update directory structure

README.md

@@ -4,19 +4,11 @@ View your favorite AltStore source.
 ## Get Started
 Simply paste in the URL of an AltStore source to begin. [Try it here](https://therealfoxster.github.io/altsource-viewer/search)!
 
-> **Note**: If a source can't be viewed, it is highly likely due to a CORS restriction set by the server hosting the JSON file. To my knowledge, a JSON file hosted on GitHub (via GitHub Pages) does not have this problem. Regardless, feel free to open a new issue if you find any.
+**Note**: If a source can't be viewed, it is highly likely due to a CORS restriction set by the server hosting the JSON file. To my knowledge, a JSON file hosted on GitHub (via GitHub Pages) does not have this problem. Regardless, feel free to open a new issue if you find any.
-
-## Handy Tip
-When linking to a particular page, you can omit the `.html` extension completely.
-
-For instance:
-* https://therealfoxster.github.io/altsource-viewer/apps.html?source=https://therealfoxster.github.io/altsource/apps.json
-* https://therealfoxster.github.io/altsource-viewer/apps?source=https://therealfoxster.github.io/altsource/apps.json
-
-both lead to the same page.
 
 ## Preview
-<img src="https://user-images.githubusercontent.com/77606385/235048007-5775c95e-1bdb-4feb-a9b7-71609ea3c739.PNG" width="350"><img src="https://user-images.githubusercontent.com/77606385/235048015-057eb1d7-e53d-4525-b6d6-a7137832b0c1.PNG" width="350"><img src="https://user-images.githubusercontent.com/77606385/235048018-14263912-d17f-43ad-a79d-8530f8a55ace.PNG" width="350"><img src="https://user-images.githubusercontent.com/77606385/235048031-0b3d78ea-2a4b-46fb-9106-f60e9b15e5db.PNG" width="350"><img src="https://user-images.githubusercontent.com/77606385/235048040-5f20231b-28c4-4929-90a0-3117f9aa99c6.PNG" width="350"><img src="https://user-images.githubusercontent.com/77606385/235048045-be9bfc92-8e9e-4d4c-ae95-6a1a94c26e34.PNG" width="350">
+<img src="https://github.com/therealFoxster/altsource-viewer/assets/77606385/93c8e962-ac8d-4356-a2c1-a96d0b48b7ba" width="350"><img src="https://github.com/therealFoxster/altsource-viewer/assets/77606385/aa7d6a01-8660-4ea6-a951-a2b2816cc109" width="350">
+
 
 ## License
 [The MIT License](https://github.com/therealFoxster/altsource-viewer/blob/master/LICENSE.md)

common/assets/entitlements.json

@@ -0,0 +1,57 @@
+{
+    "com.apple.security.application-groups": {
+        "name": "App Groups",
+        "description": "Allow app to share files with other apps and app extensions in the same App Group.",
+        "icon": "columns-gap"
+    },
+    "com.apple.developer.associated-domains": {
+        "name": "Associated Domains",
+        "description": "The associated domains for specific services, such as shared web credentials, universal links, and App Clips.",
+        "icon": "globe2"
+    },
+    "com.apple.developer.carplay-audio": {
+        "name": "CarPlay Audio",
+        "description": "Allows the app the provide audio content for CarPlay.",
+        "icon": "car-front-fill"
+    },
+    "get-task-allow": {
+        "name": "Debuggable",
+        "description": "Allow developers to attach a debugger to this app. This permission is required for JIT to work.",
+        "icon": "tools"
+    },
+    "com.apple.developer.device-information.user-assigned-device-name": {
+        "name": "Device Name",
+        "description": "Grants access to the user-assigned device name instead of a generic device name.",
+        "icon": "phone-fill"
+    },
+    "keychain-access-groups": {
+        "name": "Keychain",
+        "description": "Allows app to read and write secure data to the system's keychain.",
+        "icon": "key-fill"
+    },
+    "com.apple.developer.networking.multicast": {
+        "name": "Multicast",
+        "description": "App can send or receive IP multicast traffic.",
+        "icon": "globe2"
+    },
+    "aps-environment": {
+        "name": "Push Notifications",
+        "description": "App can send push notifications.",
+        "icon": "app-indicator"
+    },
+    "com.apple.developer.applesignin": {
+        "name": "Sign in with Apple",
+        "description": "Allows sign in with Apple.",
+        "icon": "apple"
+    },
+    "com.apple.developer.siri": {
+        "name": "Siri",
+        "description": "Allows app to handle Siri requests.",
+        "icon": "mic-fill"
+    },
+    "com.apple.developer.networking.wifi-info": {
+        "name": "Wi-Fi Information Access",
+        "description": "Allows app to access information about the connected Wi-Fi network.",
+        "icon": "wifi"
+    }
+}

common/assets/legacy-permissions.json

@@ -0,0 +1,11 @@
+{
+    "background-audio": {
+        "icon": "volume-up-fill"
+    },
+    "background-fetch": {
+        "icon": "arrow-repeat"
+    },
+    "photos": {
+        "icon": "images"
+    }
+}

common/assets/privacy.json

@@ -0,0 +1,44 @@
+{
+    "AppleMusic": {
+        "icon": "music-note-beamed"
+    },
+    "BluetoothAlways": {
+        "name": "Bluetooth",
+        "icon": "bluetooth"
+    },
+    "BluetoothPeripheral": {
+        "name": "Bluetooth (Peripherals)",
+        "icon": "bluetooth"
+    },
+    "Contacts": {
+        "icon": "person-circle"
+    },
+    "Camera": {
+        "icon": "camera-fill"
+    },
+    "FaceID": {
+        "name": "Face ID",
+        "icon": "person-bounding-box"
+    },
+    "LocalNetwork": {
+        "icon": "globe2"
+    },
+    "LocationWhenInUse": {
+        "name": "Location (When Using)",
+        "icon": "cursor-fill"
+    },
+    "Microphone": {
+        "icon": "mic-fill"
+    },
+    "PhotoLibrary": {
+        "name": "Photos",
+        "icon": "images"
+    },
+    "PhotoLibraryAdd": {
+        "name": "Photos (Add)",
+        "icon": "image"
+    },
+    "UserTracking": {
+        "icon": "person-vcard-fill"
+    }
+}

common/assets/sources.json

@@ -0,0 +1,9 @@
+[
+    "https://therealfoxster.github.io/altsource/apps.json",
+    "https://qnblackcat.github.io/AltStore/apps.json",
+    "https://quarksources.github.io/dist/quantumsource.min.json",
+    "https://quarksources.github.io/dist/quantumsource%2B%2B.min.json",
+    "https://alt.getutm.app",
+    "https://flyinghead.github.io/flycast-builds/altstore.json",
+    "https://provenance-emu.com/apps.json"
+]

common/components/AltStoreBanner.js

@@ -6,7 +6,7 @@
 //  MIT License.
 //
 
-import { sourceURL } from "../constants.js";
+import { sourceURL } from "../modules/constants.js";
 
 export const AltStoreBanner = (sourceName) => `
 <div class="uibanner">

common/components/AppHeader.js

@@ -6,9 +6,9 @@
 //  MIT License.
 //
 
-import { sourceURL } from "../constants.js";
+import { sourceURL } from "../modules/constants.js";
 
-export const AppHeader = app => app ? `
+export const AppHeader = (app, x = ".") => app ? `
 <div class="item">
     <div class="app-header">
         <div class="content">
@@ -18,7 +18,7 @@ export const AppHeader = app => app ? `
                     <p class="title">${app.name}</p>
                     <p class="subtitle">${app.developerName}</p>
                 </div>
-                <a href="app.html?source=${sourceURL}&id=${app.bundleIdentifier}">
+                <a href="${x}/app/?source=${sourceURL}&id=${app.bundleIdentifier}">
                     <button class="uibutton" style="background-color: #${app.tintColor.replaceAll("#", "")};">View</button>
                 </a>
             </div>

common/components/NewsItem.js

@@ -21,5 +21,5 @@ export const NewsItem = (news, minimal = false) => `
     "</div>" : ""} 
     </div> ${news.url ?
     "</a>" : ""} ${news.appID && !minimal ?
-        AppHeader(getAppWithBundleId(news.appID)) ?? "" : ""}
+        AppHeader(getAppWithBundleId(news.appID), "..") ?? "" : ""}
 </div>`;

common/modules/constants.js

@@ -114,7 +114,7 @@ export const privacy = {
     "UserTracking": {
         icon: "person-vcard-fill"
     },
-}
+};
 
 export const legacyPermissions = {
     "background-audio": {
@@ -126,4 +126,4 @@ export const legacyPermissions = {
     "photos": {
         icon: "images"
     }
-}
+};

common/modules/main.js

@@ -7,27 +7,28 @@
 //
 
 import { urlSearchParams, sourceURL } from "./constants.js";
-import { search, isValidHTTPURL, setTintColor, insertAltStoreBanner, setUpBackButton } from "./utilities.js";
+import { isValidHTTPURL, setTintColor, insertAltStoreBanner, setUpBackButton, open } from "./utilities.js";
 
-export function main(callback) {
+export function main(callback, fallbackURL = "../../") {
-    (() => {
+    // If no source
-        // If no source
+    if (!urlSearchParams.has('source')) {
-        if (!urlSearchParams.has('source'))
+        open(fallbackURL);
-            search();
+        return;
-        // If source is not a valid HTTP URL
+    }
-        else if (!isValidHTTPURL(sourceURL)) {
+    // If source is not a valid HTTP URL
-            alert("Invalid HTTP URL.");
+    else if (!isValidHTTPURL(sourceURL)) {
-            search();
+        alert("Invalid HTTP URL.");
-        }
+        open(fallbackURL);
+        return;
+    }
 
-        var apps;
+    var apps;
-        window.setApps = array =>
+    window.setApps = array =>
-            apps = array;
+        apps = array;
-        window.getAppWithBundleId = bundleId =>
+    window.getAppWithBundleId = bundleId =>
-            apps?.find(app => app.bundleIdentifier == bundleId) ?? undefined;
+        apps?.find(app => app.bundleIdentifier == bundleId) ?? undefined;
 
-        setUpBackButton();
+    setUpBackButton();
-    })();
 
     fetch(sourceURL)
         .then(response => response.json())

common/modules/utilities.js

@@ -6,9 +6,9 @@
 //  MIT License.
 //
 
-import { AltStoreBanner } from "./components/AltStoreBanner.js";
+import { AltStoreBanner } from "../components/AltStoreBanner.js";
-import { NavigationBar } from "./components/NavigationBar.js";
+import { NavigationBar } from "../components/NavigationBar.js";
-import { urlRegex } from "./constants.js";
+import { urlRegex, sourceURL } from "./constants.js";
 
 export function formatVersionDate(arg) {
     const versionDate = new Date(arg),
@@ -23,12 +23,8 @@ export function formatVersionDate(arg) {
         dateString = "Today";
     else if (msDifference <= msPerDay * 2)
         dateString = "Yesterday";
-    
-    return dateString;
-}
 
-export function exit() {
+    return dateString;
-    window.location.replace(`index.html?source=${sourceURL}`);
 }
 
 export function insertSpaceInSnakeString(string) {
@@ -91,8 +87,8 @@ export function setUpBackButton() {
     document.getElementById("back")?.addEventListener("click", () => history.back());
 }
 
-export function search() {
+export function open(url) {
-    window.location.replace("search.html");
+    window.open(url, "_self");
 }
 
 const $ = selector => selector.startsWith("#") && !selector.includes(".") && !selector.includes(" ")

common/style.css

@@ -6,7 +6,7 @@
     MIT License.
 */
 
-@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.4/font/bootstrap-icons.css");
+@import url("./vendor/bootstrap-icons-1.11.2/bootstrap-icons.min.css");
 
 :root {
   --accent-color: #018084;

index.css

@@ -1,5 +1,5 @@
 /* 
-    search.css
+    index.css
     altsource-viewer (https://github.com/therealFoxster/altsource-viewer)
 
     Copyright (c) 2023 Foxster.

index.html

@@ -12,40 +12,28 @@
   <meta charset="UTF-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <link rel="stylesheet" href="css/style.css">
+  <link rel="stylesheet" href="./common/style.css">
+  <link rel="stylesheet" href="index.css">
+  <title>AltSource Viewer</title>
 </head>
-<body class="loading">
+<body>
-  <div id="loading">
-    <img src="img/loading.gif" alt="loading">
-    <p>Loading</p>
-  </div>
-  <!-- Add to AltStore banner -->
-  <div id="top"></div>
   <div id="main">
-    <p>AltSource Viewer</p>
+    <h1 id="title">AltSource Viewer</h1>
-    <div class="header">
+    <div class="textfield">
-      <h1 id="title">altsource-v2</h1>
+      <input type="text" placeholder="Source URL">
-      <a href="search.html" style="font-size: 0.75em; font-weight: 750;">EDIT</a>
     </div>
-    <div id="news" class="section">
+    <div id="suggestions" class="section">
       <div class="header">
-        <h2>News</h2>
+        <h2>Discover</h2>
-        <a href="search.html">View All</a>
-      </div>
-      <div id="news-items"></div>
-    </div>
-    <div id="apps" class="section">
-      <div class="header">
-        <h2>Featured Apps</h2>
-        <a href="search.html">View All Apps</a>
-      </div>
-    </div>
-    <div id="about" class="section">
-      <div class="header">
-        <h2>About</h2>
       </div>
+      <a href="https://github.com/therealFoxster/altsource-viewer" target="_blank">
+        <div class="suggestion" id="source-code">
+          <i class="bi bi-code-slash"></i>
+          Source Code
+        </div>
+      </a>
     </div>
   </div>
-  <script src="js/index.js" type="module"></script>
+  <script src="index.js" type="module"></script>
 </body>
 </html>

index.js

@@ -0,0 +1,48 @@
+//
+//  index.js
+//  altsource-viewer (https://github.com/therealFoxster/altsource-viewer)
+//
+//  Copyright (c) 2023 Foxster.
+//  MIT License.
+//
+
+import { urlSearchParams, sourceURL } from "./common/modules/constants.js";
+import { isValidHTTPURL } from "./common/modules/utilities.js";
+const { default: sources } = await import("./common/assets/sources.json", { assert: { type: "json" } });
+
+(function main() {
+    const success = url => window.location.replace(`./view/?source=${url}`);
+
+    for (const url of sources) {
+        insertSource(url);
+    }
+
+    // If valid source provided
+    if (urlSearchParams.has('source') && isValidHTTPURL(sourceURL))
+        success(sourceURL);
+
+    const textField = document.querySelector("input");
+    textField.addEventListener("keypress", function (event) {
+        if (event.key === "Enter") {
+            event.preventDefault();
+
+            const url = textField.value;
+            if (!isValidHTTPURL(url))
+                alert("Invalid HTTP URL.");
+            else success(url);
+        }
+    });
+
+    async function insertSource(url) {
+        fetch(url).then(data => data.json()).then(source => {
+            document.getElementById("source-code").insertAdjacentHTML("beforebegin",`
+                <a href="./view/?source=${url}">
+                    <div class="suggestion">
+                    <i class="bi bi-search"></i>
+                    ${source.name}
+                    </div>
+                </a>`
+            );
+        });
+    }
+})();

js/search.js

@@ -1,30 +0,0 @@
-//
-//  search.js
-//  altsource-viewer (https://github.com/therealFoxster/altsource-viewer)
-//
-//  Copyright (c) 2023 Foxster.
-//  MIT License.
-//
-
-import { urlSearchParams, sourceURL } from "./constants.js";
-import { isValidHTTPURL } from "./utilities.js";
-
-(function main() {
-    const success = url => window.location.replace(`index.html?source=${url}`);
-
-    // If valid source provided
-    if (urlSearchParams.has('source') && isValidHTTPURL(sourceURL))
-        success(sourceURL);
-
-    const textField = document.querySelector("input");
-    textField.addEventListener("keypress", function (event) {
-        if (event.key === "Enter") {
-            event.preventDefault();
-
-            const url = textField.value;
-            if (!isValidHTTPURL(url))
-                alert("Invalid HTTP URL.");
-            else success(url);
-        }
-    });
-})();

search.html

@@ -1,81 +0,0 @@
-<!-- 
-    search.html
-    altsource-viewer (https://github.com/therealFoxster/altsource-viewer)
-
-    Copyright (c) 2023 Foxster.
-    MIT License.
- -->
-
-<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <meta http-equiv="X-UA-Compatible" content="IE=edge">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <link rel="stylesheet" href="css/style.css">
-  <link rel="stylesheet" href="css/search.css">
-  <title>AltSource Viewer</title>
-</head>
-<body>
-  <div id="main">
-    <h1 id="title">AltSource Viewer</h1>
-    <div class="textfield">
-      <input type="text" placeholder="Source URL">
-    </div>
-    <div id="suggestions" class="section">
-      <div class="header">
-        <h2>Discover</h2>
-      </div>
-      <a href="index.html?source=https://therealfoxster.github.io/altsource/apps.json">
-        <div class="suggestion">
-          <i class="bi bi-search"></i>
-          Foxster's AltSource
-        </div>
-      </a>
-      <a href="index.html?source=https://qnblackcat.github.io/AltStore/apps.json">
-        <div class="suggestion">
-          <i class="bi bi-search"></i>
-          Qn_'s AltStore Repo
-        </div>
-      </a>
-      <a href="index.html?source=https://quarksources.github.io/dist/quantumsource.min.json">
-        <div class="suggestion">
-          <i class="bi bi-search"></i>
-          Quantum Source
-        </div>
-      </a>
-      <a href="index.html?source=https://quarksources.github.io/dist/quantumsource%2B%2B.min.json">
-        <div class="suggestion">
-          <i class="bi bi-search"></i>
-          Quantum Source++
-        </div>
-      </a>
-      <a href="index.html?source=https://alt.getutm.app">
-        <div class="suggestion">
-          <i class="bi bi-search"></i>
-          UTM Repository
-        </div>
-      </a>
-      <a href="index.html?source=https://flyinghead.github.io/flycast-builds/altstore.json">
-        <div class="suggestion">
-          <i class="bi bi-search"></i>
-          Flyinghead
-        </div>
-      </a>
-      <a href="index.html?source=https://provenance-emu.com/apps.json">
-        <div class="suggestion">
-          <i class="bi bi-search"></i>
-          Provenance EMU
-        </div>
-      </a>
-      <a href="https://github.com/therealFoxster/altsource-viewer" target="_blank">
-        <div class="suggestion">
-          <i class="bi bi-code-slash"></i>
-          Source Code
-        </div>
-      </a>
-    </div>
-  </div>
-  <script src="js/search.js" type="module"></script>
-</body>
-</html>

view/all-apps/all-apps.css

@@ -1,5 +1,5 @@
 /* 
-    apps.css
+    all-apps.css
     altsource-viewer (https://github.com/therealFoxster/altsource-viewer)
 
     Copyright (c) 2023 Foxster.

view/all-apps/all-apps.js

@@ -1,14 +1,14 @@
 //
-//  apps.js
+//  all-apps.js
 //  altsource-viewer (https://github.com/therealFoxster/altsource-viewer)
 //
 //  Copyright (c) 2023 Foxster.
 //  MIT License.
 //
 
-import { insertNavigationBar } from "./utilities.js";
+import { insertNavigationBar } from "../../common/modules/utilities.js";
-import { AppHeader } from "./components/AppHeader.js";
+import { AppHeader } from "../../common/components/AppHeader.js";
-import { main } from "./main.js";
+import { main } from "../../common/modules/main.js";
 
 insertNavigationBar("All Apps");
 
@@ -25,7 +25,7 @@ main((json) => {
 
         let html = `
         <div class="app-container">
-            ${AppHeader(app)}
+            ${AppHeader(app, "..")}
             <p style="text-align: center; font-size: 0.9em;">${app.subtitle ?? ""}</p>`;
         if (app.screenshotURLs) {
             html += `

view/all-apps/index.html

@@ -1,5 +1,5 @@
 <!-- 
-    apps.html
+    all-apps/index.html
     altsource-viewer (https://github.com/therealFoxster/altsource-viewer)
 
     Copyright (c) 2023 Foxster.
@@ -12,12 +12,12 @@
   <meta charset="UTF-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <link rel="stylesheet" href="css/style.css">
+  <link rel="stylesheet" href="../../common/style.css">
-  <link rel="stylesheet" href="css/apps.css">
+  <link rel="stylesheet" href="all-apps.css">
 </head>
 <body class="loading">
   <div id="loading">
-    <img src="img/loading.gif" alt="loading">
+    <img src="../../common/assets/img/loading.gif" alt="loading">
     <p>Loading</p>
   </div>
   <!-- Add to AltStore banner & navigation bar -->
@@ -25,6 +25,6 @@
   <div id="main">
     <div id="apps"></div>
   </div>
-  <script src="js/apps.js" type="module"></script>
+  <script src="all-apps.js" type="module"></script>
 </body>
 </html>

view/app/app.js

@@ -6,13 +6,20 @@
 //  MIT License.
 //
 
-import { urlSearchParams, sourceURL, legacyPermissions } from "./constants.js";
+import { urlSearchParams, sourceURL } from "../../common/modules/constants.js";
-import { formatString, insertSpaceInCamelString, insertSpaceInSnakeString, exit, formatVersionDate } from "./utilities.js";
+import { formatString, insertSpaceInCamelString, insertSpaceInSnakeString, formatVersionDate, open } from "../../common/modules/utilities.js";
-import { main } from "./main.js";
+import { main } from "../../common/modules/main.js";
-import { privacy, entitlements } from "./constants.js";
+import { AppPermissionItem } from "../../common/components/AppPermissionItem.js";
-import { AppPermissionItem } from "./components/AppPermissionItem.js";
+// import { privacy, entitlements, legacyPermissions } from "../../modules/constants.js";
 
-if (!urlSearchParams.has('id')) exit();
+// Dynamic imports (https://stackoverflow.com/a/76845572/19227228)
+const { default: privacy } = await import("../../common/assets/privacy.json", { assert: { type: "json" } })
+const { default: entitlements } = await import("../../common/assets/entitlements.json", { assert: { type: "json" } })
+const { default: legacyPermissions } = await import("../../common/assets/legacy-permissions.json", { assert: { type: "json" } })
+
+const fallbackURL = `../?source=${sourceURL}`;
+
+if (!urlSearchParams.has('id')) open(fallbackURL);
 const bundleId = urlSearchParams.get('id');
 
 (function () {
@@ -39,7 +46,10 @@ const bundleId = urlSearchParams.get('id');
 
 main((json) => {
     const app = getAppWithBundleId(bundleId);
-    if (!app) exit();
+    if (!app) {
+        open(fallbackURL);
+        return;
+    }
 
     // If has multiple versions, show the latest one
     if (app.versions) {
@@ -151,7 +161,7 @@ main((json) => {
         versionDescriptionElement.insertAdjacentHTML("beforeend", more);
 
     // Version history
-    document.getElementById("version-history").href = `version-history.html?source=${sourceURL}&id=${app.bundleIdentifier}`;
+    document.getElementById("version-history").href = `./version-history/?source=${sourceURL}&id=${app.bundleIdentifier}`;
 
     // 
     // Permissions
@@ -170,7 +180,7 @@ main((json) => {
             icon;
         if (permission?.icon) icon = permission.icon;
         else icon = "gear-wide-connected";
-        privacyContainer.querySelector(".permission-items").insertAdjacentHTML("beforeend", 
+        privacyContainer.querySelector(".permission-items").insertAdjacentHTML("beforeend",
             AppPermissionItem(name, icon, privacyPermission?.usageDescription)
         );
     });
@@ -184,7 +194,7 @@ main((json) => {
                 icon;
             if (permission?.icon) icon = permission.icon;
             else icon = "gear-wide-connected";
-            privacyContainer.querySelector(".permission-items").insertAdjacentHTML("beforeend", 
+            privacyContainer.querySelector(".permission-items").insertAdjacentHTML("beforeend",
                 AppPermissionItem(name, icon, appPermission?.usageDescription)
             );
         });
@@ -200,7 +210,7 @@ main((json) => {
             icon;
         if (permission?.icon) icon = permission.icon;
         else icon = "gear-wide-connected";;
-        entitlementsContainer.querySelector(".permission-items").insertAdjacentHTML("beforeend", 
+        entitlementsContainer.querySelector(".permission-items").insertAdjacentHTML("beforeend",
             AppPermissionItem(name, icon, permission?.description)
         );
     });
@@ -212,6 +222,6 @@ main((json) => {
     const sourceTitle = source.querySelector(".row-title");
     const sourceSubtitle = source.querySelector(".row-subtitle");
     sourceTitle.innerText = json.name;
-    sourceContainer.href = `index.html?source=${sourceURL}`;
+    sourceContainer.href = `../../?source=${sourceURL}`;
     sourceSubtitle.innerText = json.description ?? "Tap to get started";
 });

view/app/index.html

@@ -1,5 +1,5 @@
 <!-- 
-    app.html
+    app/index.html
     altsource-viewer (https://github.com/therealFoxster/altsource-viewer)
 
     Copyright (c) 2023 Foxster.
@@ -12,12 +12,12 @@
   <meta charset="UTF-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <link rel="stylesheet" href="css/style.css">
+  <link rel="stylesheet" href="../../common/style.css">
-  <link rel="stylesheet" href="css/app.css">
+  <link rel="stylesheet" href="app.css">
 </head>
 <body class="loading">
   <div id="loading">
-    <img src="img/loading.gif" alt="loading">
+    <img src="../../common/assets/img/loading.gif" alt="loading">
     <p>Loading</p>
   </div>
   <div id="main">
@@ -31,7 +31,7 @@
           </button>
         </div>
         <div id="title" class="hidden">
-          <img id="app-icon" src="img/generic_app.jpeg" alt="generic-app-icon">
+          <img id="app-icon" src="../../common/assets/img/generic_app.jpeg" alt="generic-app-icon">
           <p>AltSource</p>
         </div>
         <a href="https://example.com" class="install hidden">
@@ -43,7 +43,7 @@
     <div class="item">
       <div class="app-header">
         <div class="content">
-          <img id="app-icon" src="img/generic_app.jpeg" alt="generic-app-icon">
+          <img id="app-icon" src="../../common/assets/img/generic_app.jpeg" alt="generic-app-icon">
           <div class="right">
             <div class="text">
               <p class="title">AltSource</p>
@@ -63,19 +63,12 @@
       </div>
     </div>
     <div id="preview" class="section">
-      <p id="subtitle">The quick brown fox jumps over the lazy dog.</p>
+      <p id="subtitle"></p>
       <div class="header">
         <h2>Preview</h2>
       </div>
       <div id="screenshots"></div>
-      <p id="description">
+      <p id="description"></p>
-        The quick brown fox jumps over the lazy dog.
-        The quick brown fox jumps over the lazy dog.
-        The quick brown fox jumps over the lazy dog.
-        The quick brown fox jumps over the lazy dog.
-        The quick brown fox jumps over the lazy dog.
-        The quick brown fox jumps over the lazy dog.
-      </p>
     </div>
     <div id="whats-new" class="section">
       <div class="header">
@@ -87,14 +80,7 @@
         <p id="version">Version 2.0</p>
         <p id="version-date">Apr 10, 2023</p>
       </div>
-      <p id="version-description">
+      <p id="version-description"></p>
-        The quick brown fox jumps over the lazy dog.
-        The quick brown fox jumps over the lazy dog.
-        The quick brown fox jumps over the lazy dog.
-        The quick brown fox jumps over the lazy dog.
-        The quick brown fox jumps over the lazy dog.
-        The quick brown fox jumps over the lazy dog.
-      </p>
     </div>
     <div id="permissions" class="section">
       <div class="header">
@@ -114,8 +100,7 @@
           <div class="permission-container-header">
             <i class="permission-icon bi-key-fill"></i>
             <p><b>Entitlements</b></p>
-            <p class="description">Entitlements are additional permissions that grant access to certain system services,
+            <p class="description">Entitlements are additional permissions that grant access to certain system services, including potentially sensitive information.</p>
-              including potentially sensitive information.</p>
           </div>
           <div class="permission-items">
           </div>
@@ -128,13 +113,13 @@
       </div>
       <a class="container" target="_blank">
         <div class="row">
-          <p class="row-title">Hello, World!</p>
+          <p class="row-title"></p>
-          <p class="row-subtitle">The quick brown fox jumps over the lazy dog.</p>
+          <p class="row-subtitle"></p>
         </div>
         <i class="bi bi-arrow-up-right-square"></i>
       </a>
     </div>
   </div>
-  <script src="js/app.js" type="module"></script>
+  <script src="app.js" type="module"></script>
 </body>
 </html>

view/app/version-history/index.html

@@ -1,5 +1,5 @@
 <!-- 
-    version-history.html
+    version-history/index.html
     altsource-viewer (https://github.com/therealFoxster/altsource-viewer)
 
     Copyright (c) 2023 Foxster.
@@ -12,12 +12,12 @@
     <meta charset="UTF-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <link rel="stylesheet" href="css/style.css">
+    <link rel="stylesheet" href="../../../common/style.css">
-    <link rel="stylesheet" href="css/version-history.css">
+    <link rel="stylesheet" href="version-history.css">
 </head>
 <body class="loading">
     <div id="loading">
-        <img src="img/loading.gif" alt="loading">
+        <img src="../../../common/assets/img/loading.gif" alt="loading">
         <p>Loading</p>
     </div>
     <!-- Add to AltStore banner & navigation bar -->
@@ -25,6 +25,6 @@
     <div id="main">
         <div id="versions"></div>
     </div>
-    <script src="js/versionHistory.js" type="module"></script>
+    <script src="version-history.js" type="module"></script>
 </body>
 </html>

view/app/version-history/version-history.js

@@ -1,24 +1,30 @@
 //
-//  versionHistory.js
+//  version-history.js
 //  altsource-viewer (https://github.com/therealFoxster/altsource-viewer)
 //
 //  Copyright (c) 2023 Foxster.
 //  MIT License.
 //
 
-import { urlSearchParams } from "./constants.js";
+import { urlSearchParams, sourceURL } from "../../../common/modules/constants.js";
-import { insertNavigationBar, exit, formatVersionDate, formatString } from "./utilities.js";
+import { insertNavigationBar, formatVersionDate, formatString, open } from "../../../common/modules/utilities.js";
-import { main } from "./main.js";
+import { main } from "../../../common/modules/main.js";
-import { MoreButton } from "./components/MoreButton.js";
+import { MoreButton } from "../../../common/components/MoreButton.js";
-import { VersionHistoryItem } from "./components/VersionHistoryItem.js";
+import { VersionHistoryItem } from "../../../common/components/VersionHistoryItem.js";
 
-if (!urlSearchParams.has('id')) exit();
+const fallbackURL = `../../?source=${sourceURL}`;
+
+if (!urlSearchParams.has('id')) open(fallbackURL);
 const bundleId = urlSearchParams.get('id');
 
 insertNavigationBar("Version History");
 
-main((json) => {
+main(json => {
     const app = getAppWithBundleId(bundleId);
+    if (!app) {
+        open(fallbackURL);
+        return;
+    }
 
     // Set tab title
     document.title = `Version History - ${app.name}`;
@@ -36,7 +42,7 @@ main((json) => {
                     version.version,
                     formatVersionDate(version.date),
                     formatString(version.localizedDescription),
-                    version.downloadURL, 
+                    version.downloadURL,
                     i
                 )
             );
@@ -57,4 +63,4 @@ main((json) => {
         if (element.scrollHeight > element.clientHeight)
             element.insertAdjacentHTML("beforeend", MoreButton(tintColor));
     });
-});
+}, "../../../");

view/index.html

@@ -0,0 +1,51 @@
+<!-- 
+    view/index.html
+    altsource-viewer (https://github.com/therealFoxster/altsource-viewer)
+
+    Copyright (c) 2023 Foxster.
+    MIT License.
+ -->
+
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <link rel="stylesheet" href="../common/style.css">
+</head>
+<body class="loading">
+  <div id="loading">
+    <img src="../common/assets/img/loading.gif" alt="loading">
+    <p>Loading</p>
+  </div>
+  <!-- Add to AltStore banner -->
+  <div id="top"></div>
+  <div id="main">
+    <p>AltSource Viewer</p>
+    <div class="header">
+      <h1 id="title">altsource-v2</h1>
+      <a href="../" style="font-size: 0.75em; font-weight: 750;">EDIT</a>
+    </div>
+    <div id="news" class="section">
+      <div class="header">
+        <h2>News</h2>
+        <a href="../">View All</a>
+      </div>
+      <div id="news-items"></div>
+    </div>
+    <div id="apps" class="section">
+      <div class="header">
+        <h2>Featured Apps</h2>
+        <a href="../">View All Apps</a>
+      </div>
+    </div>
+    <div id="about" class="section">
+      <div class="header">
+        <h2>About</h2>
+      </div>
+    </div>
+  </div>
+  <script src="view.js" type="module"></script>
+</body>
+</html>

view/news/index.html

@@ -1,5 +1,5 @@
 <!-- 
-    news.html
+    news/index.html
     altsource-viewer (https://github.com/therealFoxster/altsource-viewer)
 
     Copyright (c) 2023 Foxster.
@@ -12,12 +12,12 @@
   <meta charset="UTF-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <link rel="stylesheet" href="css/style.css">
+  <link rel="stylesheet" href="../../common/style.css">
-  <link rel="stylesheet" href="css/news.css">
+  <link rel="stylesheet" href="news.css">
 </head>
 <body class="loading">
   <div id="loading">
-    <img src="img/loading.gif" alt="loading">
+    <img src="../../common/assets/img/loading.gif" alt="loading">
     <p>Loading</p>
   </div>
   <!-- Add to AltStore banner & navigation bar -->
@@ -25,6 +25,6 @@
   <div id="main">
     <div id="news"></div>
   </div>
-  <script src="js/news.js" type="module"></script>
+  <script src="news.js" type="module"></script>
 </body>
 </html>

view/news/news.js

@@ -6,13 +6,13 @@
 //  MIT License.
 //
 
-import { insertNavigationBar } from "./utilities.js";
+import { insertNavigationBar } from "../../common/modules/utilities.js";
-import { NewsItem } from "./components/NewsItem.js";
+import { NewsItem } from "../../common/components/NewsItem.js";
-import { main } from "./main.js";
+import { main } from "../../common/modules/main.js";
 
 insertNavigationBar("All News");
 
-main((json) => {
+main(json => {
     // Set tab title
     document.title = `News - ${json.name}`;
 

view/view.js

@@ -1,22 +1,22 @@
 //
-//  index.js
+//  view.js
 //  altsource-viewer (https://github.com/therealFoxster/altsource-viewer)
 //
 //  Copyright (c) 2023 Foxster.
 //  MIT License.
 //
 
-import { sourceURL } from "./constants.js";
+import { sourceURL } from "../common/modules/constants.js";
-import { formatString } from "./utilities.js";
+import { formatString } from "../common/modules/utilities.js";
-import { NewsItem } from "./components/NewsItem.js";
+import { NewsItem } from "../common/components/NewsItem.js";
-import { AppHeader } from "./components/AppHeader.js";
+import { AppHeader } from "../common/components/AppHeader.js";
-import { main } from "./main.js";
+import { main } from "../common/modules/main.js";
 
-main((json) => {
+main(json => {
     // Set "View All News" link
-    document.querySelector("#news a").href = `news.html?source=${sourceURL}`;
+    document.querySelector("#news a").href = `./news/?source=${sourceURL}`;
     // Set "View All Apps" link
-    document.querySelector("#apps a").href = `apps.html?source=${sourceURL}`;
+    document.querySelector("#apps a").href = `./all-apps/?source=${sourceURL}`;
 
     // Set tab title
     document.title = json.name;
@@ -67,4 +67,4 @@ main((json) => {
         </div>
     `);
     else document.getElementById("about").remove();
-});
+}, "../");