Initial commit

Author: jelveh

.gitattributes

@@ -0,0 +1,2 @@
+# Auto detect text files and perform LF normalization
+* text=auto

.gitignore

@@ -0,0 +1,5 @@
+.DS_Store
+node_modules/
+*.zip
+*.tgz
+license.config.json

LICENSE.txt

@@ -0,0 +1,3 @@
+const {build} = require("./utils.js")
+
+build();

README.md

@@ -0,0 +1,57 @@
+const express = require("express");
+const { generateDevHtml, build } = require("./utils.js");
+const { argv } = require('node:process');
+const chalk = require('chalk');
+
+const app = express();
+let port = 4000; // Starting port
+const maxAttempts = 10; // Maximum number of ports to try
+const env = argv[2] ?? "dev";
+
+const startServer = (attempt) => {
+    if (attempt > maxAttempts) {
+        console.error(chalk.red(`ERROR: Unable to find an available port after ${maxAttempts} attempts.`));
+        return;
+    }
+
+    app.listen(port, () => {
+        console.log("\n-----------------------------------------------------------\n");
+        console.log(`Puter is now live at: `, chalk.underline.blue(`http://localhost:${port}`));
+        console.log("\n-----------------------------------------------------------\n");
+    }).on('error', (err) => {
+        if (err.code === 'EADDRINUSE') { // Check if the error is because the port is already in use
+            console.error(chalk.red(`ERROR: Port ${port} is already in use. Trying next port...`));
+            port++; // Increment the port number
+            startServer(attempt + 1); // Try the next port
+        }
+    });
+};
+
+// Start the server with the first attempt
+startServer(1);
+
+// build the GUI
+build();
+
+app.get(["/", "/app/*", "/action/*"], (req, res) => {
+    res.send(generateDevHtml({
+        env: env,
+        api_origin: "https://api.puter.com",
+        title: "Puter",
+        max_item_name_length: 150,
+        require_email_verification_to_publish_website: false,
+        short_description: `Puter is a privacy-first personal cloud that houses all your files, apps, and games in one private and secure place, accessible from anywhere at any time.`,
+    }));
+})
+app.use(express.static('./'));
+
+if(env === "prod"){
+    // make sure to serve the ./dist/ folder maps to the root of the website
+    app.use(express.static('./dist/'));
+}
+
+if(env === "dev"){
+    app.use(express.static('./src/'));
+}
+
+module.exports = app;

build.js

@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="utf-8"?>
+<browserconfig>
+<msapplication>
+<tile>
+<square70x70logo src="./favicons/ms-icon-70x70.png"/>
+<square150x150logo src="./favicons/ms-icon-150x150.png"/>
+<square310x310logo src="./favicons/ms-icon-310x310.png"/>
+<TileColor>#ffffff</TileColor></tile></msapplication></browserconfig>

dev-server.js

@@ -0,0 +1,2 @@
+<?xml version="1.0" encoding="utf-8"?>
+<browserconfig><msapplication><tile><square70x70logo src="/ms-icon-70x70.png"/><square150x150logo src="/ms-icon-150x150.png"/><square310x310logo src="/ms-icon-310x310.png"/><TileColor>#ffffff</TileColor></tile></msapplication></browserconfig>

dist/browserconfig.xml

@@ -0,0 +1,41 @@
+{
+ "name": "App",
+ "icons": [
+  {
+   "src": "\/android-icon-36x36.png",
+   "sizes": "36x36",
+   "type": "image\/png",
+   "density": "0.75"
+  },
+  {
+   "src": "\/android-icon-48x48.png",
+   "sizes": "48x48",
+   "type": "image\/png",
+   "density": "1.0"
+  },
+  {
+   "src": "\/android-icon-72x72.png",
+   "sizes": "72x72",
+   "type": "image\/png",
+   "density": "1.5"
+  },
+  {
+   "src": "\/android-icon-96x96.png",
+   "sizes": "96x96",
+   "type": "image\/png",
+   "density": "2.0"
+  },
+  {
+   "src": "\/android-icon-144x144.png",
+   "sizes": "144x144",
+   "type": "image\/png",
+   "density": "3.0"
+  },
+  {
+   "src": "\/android-icon-192x192.png",
+   "sizes": "192x192",
+   "type": "image\/png",
+   "density": "4.0"
+  }
+ ]
+}

dist/bundle.min.css

@@ -0,0 +1,127 @@
+window.gui_env="prod"; 
+
+window.puter_gui_enabled = true;
+/**
+ * Initializes and configures the GUI (Graphical User Interface) settings based on the provided options.
+ * 
+ * The function sets global variables in the window object for various settings such as origins and domain names.
+ * It also handles loading different resources depending on the environment (development or production).
+ * 
+ * @param {Object} options - Configuration options to initialize the GUI.
+ * @param {string} [options.gui_origin='https://puter.com'] - The origin URL for the GUI.
+ * @param {string} [options.api_origin='https://api.puter.com'] - The origin URL for the API.
+ * @param {number} [options.max_item_name_length=500] - Maximum allowed length for an item name.
+ * @param {boolean} [options.require_email_verification_to_publish_website=true] - Flag to decide whether email verification is required to publish a website.
+ * 
+ * @property {string} [options.app_domain] - Extracted domain name from gui_origin. It's derived automatically if not provided.
+ * @property {string} [window.gui_env] - The environment in which the GUI is running (e.g., "dev" or "prod").
+ * 
+ * @returns {Promise<void>} Returns a promise that resolves when initialization and resource loading are complete.
+ * 
+ * @example
+ * window.gui({
+ *     gui_origin: 'https://myapp.com',
+ *     api_origin: 'https://myapi.com',
+ *     max_item_name_length: 250
+ * });
+ */
+
+window.gui = async function(options){
+    options = options ?? {};
+    // app_origin is deprecated, use gui_origin instead
+    window.gui_origin = options.gui_origin ?? options.app_origin ?? `https://puter.com`;
+    window.app_domain = options.app_domain ?? new URL(window.gui_origin).hostname;
+    window.hosting_domain = options.hosting_domain ?? 'puter.site';
+    window.api_origin = options.api_origin ?? "https://api.puter.com";
+    window.max_item_name_length = options.max_item_name_length ?? 500;
+    window.require_email_verification_to_publish_website = options.require_email_verification_to_publish_website ?? true;
+
+    // Add Puter.JS
+    await loadScript('https://js.puter.com/v2/');
+
+    // DEV: Load the initgui.js file if we are in development mode
+    if(!window.gui_env || window.gui_env === "dev"){
+        await loadScript('/initgui.js', {isModule: true});
+    }
+    
+    // PROD: load the minified bundles if we are in production mode
+    // note: the order of the bundles is important
+    // note: Build script will prepend `window.gui_env="prod"` to the top of the file
+    else if(gui_env === "prod"){
+        // Load the minified bundles
+        await loadCSS('/dist/bundle.min.css');
+        await loadScript('/dist/bundle.min.js');
+    }
+
+    // 🚀 Launch the GUI 🚀
+    initgui();
+}
+
+/**
+* Dynamically loads an external JavaScript file.
+* @param {string} url The URL of the external script to load.
+* @param {Object} [options] Optional configuration for the script. 
+* @param {boolean} [options.isModule] Whether the script is a module.
+* @param {boolean} [options.defer] Whether the script should be deferred.
+* @param {Object} [options.dataAttributes] An object containing data attributes to add to the script element.
+* @returns {Promise} A promise that resolves once the script has loaded, or rejects on error.
+*/
+window.loadScript = async function(url, options = {}) {
+    return new Promise((resolve, reject) => {
+        const script = document.createElement('script');
+        script.src = url;
+
+        // Set default script loading behavior
+        script.async = true;
+
+        // Handle if it is a module
+        if (options.isModule) {
+            script.type = 'module';
+        }
+
+        // Handle defer attribute
+        if (options.defer) {
+            script.defer = true;
+            script.async = false; // When "defer" is true, "async" should be false as they are mutually exclusive
+        }
+
+        // Add arbitrary data attributes
+        if (options.dataAttributes && typeof options.dataAttributes === 'object') {
+            for (const [key, value] of Object.entries(options.dataAttributes)) {
+                script.setAttribute(`data-${key}`, value);
+            }
+        }
+
+        // Resolve the promise when the script is loaded
+        script.onload = () => resolve();
+
+        // Reject the promise if there's an error during load
+        script.onerror = (error) => reject(new Error(`Failed to load script at url: ${url}`));
+
+        // Append the script to the body
+        document.body.appendChild(script);
+    });
+};
+
+/**
+* Dynamically loads an external CSS file.
+* @param {string} url The URL of the external CSS to load.
+* @returns {Promise} A promise that resolves once the CSS has loaded, or rejects on error.
+*/
+window.loadCSS = async function(url) {
+    return new Promise((resolve, reject) => {
+        const link = document.createElement('link');
+        link.rel = 'stylesheet';
+        link.href = url;
+
+        link.onload = () => {
+            resolve();
+        };
+
+        link.onerror = (error) => {
+            reject(new Error(`Failed to load CSS at url: ${url}`));
+        };
+
+        document.head.appendChild(link);
+    });
+}

dist/bundle.min.js

@@ -0,0 +1,41 @@
+{
+ "name": "App",
+ "icons": [
+  {
+   "src": "/favicons/android-icon-36x36.png",
+   "sizes": "36x36",
+   "type": "image/png",
+   "density": "0.75"
+  },
+  {
+   "src": "/favicons/android-icon-48x48.png",
+   "sizes": "48x48",
+   "type": "image/png",
+   "density": "1.0"
+  },
+  {
+   "src": "/favicons/android-icon-72x72.png",
+   "sizes": "72x72",
+   "type": "image/png",
+   "density": "1.5"
+  },
+  {
+   "src": "/favicons/android-icon-96x96.png",
+   "sizes": "96x96",
+   "type": "image/png",
+   "density": "2.0"
+  },
+  {
+   "src": "/favicons/android-icon-144x144.png",
+   "sizes": "144x144",
+   "type": "image/png",
+   "density": "3.0"
+  },
+  {
+   "src": "/favicons/android-icon-192x192.png",
+   "sizes": "192x192",
+   "type": "image/png",
+   "density": "4.0"
+  }
+ ]
+}