aegis-framework 0.1.4 → 0.2.1

package/aegis/runtime/aegis-api.js

@@ -604,18 +604,391 @@
             return invoke(action, payload);
         },
 
-        // ==================== Utility Functions ====================
+        // ==================== DOM Utilities ====================
 
         /**
          * Version of Aegis
          */
-        version: '0.1.0',
+        version: '0.2.0',
 
         /**
          * Check if running in Aegis environment
          */
         isAegis: function () {
             return !!(window.webkit && window.webkit.messageHandlers && window.webkit.messageHandlers.aegis);
+        },
+
+        // ==================== Element Selection ====================
+
+        /**
+         * Get single element by selector
+         */
+        get: function (selector) {
+            if (typeof selector !== 'string') return selector;
+            if (selector.startsWith('#') && !selector.includes(' ') && !selector.includes('.')) {
+                return document.getElementById(selector.slice(1));
+            }
+            return document.querySelector(selector);
+        },
+
+        /**
+         * Get all elements by selector
+         */
+        getAll: function (selector) {
+            return document.querySelectorAll(selector);
+        },
+
+        // ==================== Event Shortcuts ====================
+
+        /**
+         * Universal event listener
+         */
+        on: function (selector, events, handler, options = {}) {
+            const elements = typeof selector === 'string' ? Aegis.getAll(selector) : [selector];
+            const eventList = events.split(' ');
+            elements.forEach(el => {
+                eventList.forEach(event => {
+                    el.addEventListener(event.trim(), handler, options);
+                });
+            });
+            return elements;
+        },
+
+        /**
+         * One-time event listener
+         */
+        once: function (selector, events, handler) {
+            return Aegis.on(selector, events, handler, { once: true });
+        },
+
+        /**
+         * Remove event listener
+         */
+        off: function (selector, events, handler) {
+            const elements = typeof selector === 'string' ? Aegis.getAll(selector) : [selector];
+            const eventList = events.split(' ');
+            elements.forEach(el => {
+                eventList.forEach(event => {
+                    el.removeEventListener(event.trim(), handler);
+                });
+            });
+            return elements;
+        },
+
+        /**
+         * Click shortcut
+         */
+        click: function (selector, handler) {
+            return Aegis.on(selector, 'click', handler);
+        },
+
+        /**
+         * Submit shortcut
+         */
+        submit: function (selector, handler) {
+            return Aegis.on(selector, 'submit', handler);
+        },
+
+        /**
+         * Change shortcut
+         */
+        change: function (selector, handler) {
+            return Aegis.on(selector, 'change', handler);
+        },
+
+        /**
+         * Input shortcut
+         */
+        input: function (selector, handler) {
+            return Aegis.on(selector, 'input', handler);
+        },
+
+        /**
+         * Hover shortcut (mouseenter + mouseleave)
+         */
+        hover: function (selector, onEnter, onLeave) {
+            Aegis.on(selector, 'mouseenter', onEnter);
+            if (onLeave) Aegis.on(selector, 'mouseleave', onLeave);
+        },
+
+        /**
+         * Key press shortcut
+         */
+        keypress: function (selector, handler) {
+            return Aegis.on(selector, 'keydown', handler);
+        },
+
+        // ==================== Element Creation ====================
+
+        /**
+         * Create element with options
+         */
+        create: function (tag, options = {}) {
+            const el = document.createElement(tag);
+            if (options.id) el.id = options.id;
+            if (options.class) el.className = options.class;
+            if (options.html) el.innerHTML = options.html;
+            if (options.text) el.textContent = options.text;
+            if (options.value !== undefined) el.value = options.value;
+            if (options.attrs) {
+                Object.entries(options.attrs).forEach(([key, value]) => {
+                    el.setAttribute(key, value);
+                });
+            }
+            if (options.style) {
+                Object.assign(el.style, options.style);
+            }
+            if (options.data) {
+                Object.entries(options.data).forEach(([key, value]) => {
+                    el.dataset[key] = value;
+                });
+            }
+            if (options.on) {
+                Object.entries(options.on).forEach(([event, handler]) => {
+                    el.addEventListener(event, handler);
+                });
+            }
+            if (options.children) {
+                options.children.forEach(child => el.appendChild(child));
+            }
+            if (options.parent) {
+                const parent = Aegis.get(options.parent);
+                if (parent) parent.appendChild(el);
+            }
+            return el;
+        },
+
+        // ==================== Class Manipulation ====================
+
+        addClass: function (selector, ...classes) {
+            const el = Aegis.get(selector);
+            if (el) el.classList.add(...classes);
+            return el;
+        },
+
+        removeClass: function (selector, ...classes) {
+            const el = Aegis.get(selector);
+            if (el) el.classList.remove(...classes);
+            return el;
+        },
+
+        toggleClass: function (selector, className, force) {
+            const el = Aegis.get(selector);
+            if (el) el.classList.toggle(className, force);
+            return el;
+        },
+
+        hasClass: function (selector, className) {
+            const el = Aegis.get(selector);
+            return el ? el.classList.contains(className) : false;
+        },
+
+        // ==================== Style Manipulation ====================
+
+        css: function (selector, styles) {
+            const el = Aegis.get(selector);
+            if (el && styles) Object.assign(el.style, styles);
+            return el;
+        },
+
+        hide: function (selector) {
+            const el = Aegis.get(selector);
+            if (el) el.style.display = 'none';
+            return el;
+        },
+
+        show: function (selector, display = 'block') {
+            const el = Aegis.get(selector);
+            if (el) el.style.display = display;
+            return el;
+        },
+
+        toggleDisplay: function (selector) {
+            const el = Aegis.get(selector);
+            if (el) el.style.display = el.style.display === 'none' ? '' : 'none';
+            return el;
+        },
+
+        // ==================== Content Manipulation ====================
+
+        attr: function (selector, name, value) {
+            const el = Aegis.get(selector);
+            if (!el) return null;
+            if (value === undefined) return el.getAttribute(name);
+            el.setAttribute(name, value);
+            return el;
+        },
+
+        data: function (selector, key, value) {
+            const el = Aegis.get(selector);
+            if (!el) return null;
+            if (value === undefined) return el.dataset[key];
+            el.dataset[key] = value;
+            return el;
+        },
+
+        html: function (selector, content) {
+            const el = Aegis.get(selector);
+            if (!el) return null;
+            if (content === undefined) return el.innerHTML;
+            el.innerHTML = content;
+            return el;
+        },
+
+        text: function (selector, content) {
+            const el = Aegis.get(selector);
+            if (!el) return null;
+            if (content === undefined) return el.textContent;
+            el.textContent = content;
+            return el;
+        },
+
+        val: function (selector, value) {
+            const el = Aegis.get(selector);
+            if (!el) return null;
+            if (value === undefined) return el.value;
+            el.value = value;
+            return el;
+        },
+
+        // ==================== DOM Manipulation ====================
+
+        each: function (selector, callback) {
+            const elements = typeof selector === 'string' ? Aegis.getAll(selector) : selector;
+            elements.forEach((el, i) => callback(el, i));
+            return elements;
+        },
+
+        removeEl: function (selector) {
+            const el = Aegis.get(selector);
+            if (el && el.parentNode) el.parentNode.removeChild(el);
+            return el;
+        },
+
+        append: function (parent, child) {
+            const p = Aegis.get(parent);
+            const c = typeof child === 'string' ? Aegis.get(child) : child;
+            if (p && c) p.appendChild(c);
+            return p;
+        },
+
+        prepend: function (parent, child) {
+            const p = Aegis.get(parent);
+            const c = typeof child === 'string' ? Aegis.get(child) : child;
+            if (p && c) p.insertBefore(c, p.firstChild);
+            return p;
+        },
+
+        empty: function (selector) {
+            const el = Aegis.get(selector);
+            if (el) el.innerHTML = '';
+            return el;
+        },
+
+        // ==================== JSON Utilities ====================
+
+        parseJSON: function (str, fallback = null) {
+            try {
+                return JSON.parse(str);
+            } catch (e) {
+                return fallback;
+            }
+        },
+
+        stringify: function (obj, pretty = false) {
+            return JSON.stringify(obj, null, pretty ? 2 : 0);
+        },
+
+        // ==================== Storage Utilities ====================
+
+        storage: {
+            get: function (key, fallback = null) {
+                try {
+                    const value = localStorage.getItem(key);
+                    return value ? JSON.parse(value) : fallback;
+                } catch (e) {
+                    return fallback;
+                }
+            },
+            set: function (key, value) {
+                try {
+                    localStorage.setItem(key, JSON.stringify(value));
+                    return true;
+                } catch (e) {
+                    return false;
+                }
+            },
+            remove: function (key) {
+                localStorage.removeItem(key);
+            },
+            clear: function () {
+                localStorage.clear();
+            }
+        },
+
+        // ==================== Animation Utilities ====================
+
+        fadeIn: function (selector, duration = 300) {
+            const el = Aegis.get(selector);
+            if (!el) return;
+            el.style.opacity = '0';
+            el.style.display = '';
+            el.style.transition = `opacity ${duration}ms ease`;
+            requestAnimationFrame(() => {
+                el.style.opacity = '1';
+            });
+            return el;
+        },
+
+        fadeOut: function (selector, duration = 300) {
+            const el = Aegis.get(selector);
+            if (!el) return;
+            el.style.transition = `opacity ${duration}ms ease`;
+            el.style.opacity = '0';
+            setTimeout(() => {
+                el.style.display = 'none';
+            }, duration);
+            return el;
+        },
+
+        // ==================== Utility Functions ====================
+
+        ready: function (callback) {
+            if (document.readyState !== 'loading') {
+                callback();
+            } else {
+                document.addEventListener('DOMContentLoaded', callback);
+            }
+        },
+
+        debounce: function (func, wait) {
+            let timeout;
+            return function (...args) {
+                clearTimeout(timeout);
+                timeout = setTimeout(() => func.apply(this, args), wait);
+            };
+        },
+
+        throttle: function (func, limit) {
+            let inThrottle;
+            return function (...args) {
+                if (!inThrottle) {
+                    func.apply(this, args);
+                    inThrottle = true;
+                    setTimeout(() => inThrottle = false, limit);
+                }
+            };
+        },
+
+        delay: function (ms) {
+            return new Promise(resolve => setTimeout(resolve, ms));
+        },
+
+        /**
+         * Generate unique ID
+         */
+        uid: function (prefix = 'aegis') {
+            return `${prefix}-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`;
         }
     };
 
@@ -632,3 +1005,4 @@
     console.log('%c⚡ Aegis v' + Aegis.version + ' loaded', 'color: #00ff88; font-weight: bold;');
 
 })();
+

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "aegis-framework",
-    "version": "0.1.4",
+    "version": "0.2.1",
     "description": "Lightweight AppImage framework using WebKit2GTK and Python - An alternative to Electron that creates ~200KB apps instead of 150MB!",
     "keywords": [
         "appimage",