onelaraveljs 1.0.0

package/src/core/View.js

@@ -0,0 +1,273 @@
+/**
+ * View Engine class for managing view instances
+ * @param {Object} config - View configuration
+ */
+import { __defineGetters, __defineMethods, __defineProp, __defineProperties, __defineProps, deleteProp, hasData, uniqId } from '../helpers/utils.js';
+import { ViewState } from './ViewState.js';
+import logger from './services/LoggerService.js';
+import { ViewController } from './ViewController.js';
+
+/**
+ * @property {ViewController} __ - Internal view controller
+ */
+export class View {
+    /**
+     * Global resource registry
+     * Key: resourceKey (e.g., 'css:/css/chart.css' or 'js:/js/chart.js')
+     * Value: { element: HTMLElement, viewPaths: Set<string>, referenceCount: number, resourceType: string }
+     */
+    static resourceRegistry = new Map();
+    static scripts = new Map();
+
+    static registerScript(name, key, callback) {
+        if (!name || !key || typeof callback !== 'function') {
+            return;
+        }
+        if (!this.scripts.has(name)) {
+            this.scripts.set(name, new Map());
+        }
+        if (this.scripts.get(name).has(key)) {
+            return;
+        }
+        this.scripts.get(name).set(key, callback);
+    }
+
+    static getScript(name, key) {
+        if (!name || !key) {
+            return null;
+        }
+        return this.scripts.get(name)?.get(key) || null;
+    }
+
+    /**
+     * Generate resource key from resource data
+     * @param {Object} resource - Resource object
+     * @returns {string} Resource key
+     */
+    static getResourceKey(resource) {
+        // For function wrapper scripts, use function name (ensures single execution)
+        if (resource.type === 'code' && resource.function) {
+            return `script:function:${resource.function}`;
+        }
+
+        // For external resources, use src/href
+        if (resource.type === 'src' && resource.src) {
+            return `script:${resource.src}`;
+        }
+        if (resource.type === 'href' && resource.href) {
+            return `style:${resource.href}`;
+        }
+
+        // For inline resources with id, use id
+        if (resource.id) {
+            const prefix = resource.type === 'code'
+                ? (resource.resourceType === 'script' ? 'script:inline:' : 'style:inline:')
+                : '';
+            return `${prefix}${resource.id}`;
+        }
+
+        // Fallback: use view path + content hash
+        const content = resource.content || resource.src || resource.href || '';
+        const hash = View._simpleHash(content);
+        return `${resource.type}:${resource.viewPath}:${hash}`;
+    }
+
+    /**
+     * Simple hash function for content
+     * @private
+     */
+    static _simpleHash(str) {
+        let hash = 0;
+        if (str.length === 0) return hash.toString();
+        for (let i = 0; i < str.length; i++) {
+            const char = str.charCodeAt(i);
+            hash = ((hash << 5) - hash) + char;
+            hash = hash & hash; // Convert to 32bit integer
+        }
+        return Math.abs(hash).toString(36);
+    }
+
+    constructor(path, config) {
+
+
+        /**
+         * @type {ViewController}
+         */
+        const controller = new ViewController(path, this, null);
+        Object.defineProperty(this, '__', {
+            value: controller,
+            writable: false,
+            configurable: false,
+            enumerable: false,
+        });
+        /**
+         * @type {boolean}
+         */
+        
+        __defineProp(this, 'path', {
+            value: path,
+            writable: false,
+            configurable: false,
+            enumerable: false,
+        });
+        
+        __defineProp(this, 'viewType', {
+            value: 'view',
+            writable: true,
+            configurable: false,
+            enumerable: false,
+        });
+
+    }
+
+
+    /**
+     * Setup the view engine with configuration
+     * @param {string} path - View path
+     * @param {Object} config - View configuration
+     */
+    setup(path, userDefined, config) {
+        if (this.isInitlized) {
+            return this;
+        }
+        this.__.setApp(this.App);
+        // Set config and path
+
+        // this.config = config || {};
+        this.__initialize__();
+
+        if (userDefined && typeof userDefined === 'object') {
+            Object.entries(userDefined).forEach(([key, value]) => {
+                this[key] = value;
+            });
+        }
+
+
+
+        this.__.setup(path, config);
+        // Call _initialize to do the actual setup
+        return this;
+    }
+
+
+    /**
+     * Initialize the view engine with configuration
+     * @private
+     */
+    __initialize__() {
+        if (this.isInitlized) {
+            return;
+        }
+
+        __defineProp(this, 'isInitlized', {
+            value: true,
+            writable: false,
+            configurable: false,
+            enumerable: false,
+        });
+
+    }
+
+
+
+
+
+
+    /**
+     * Set App instance
+     * @param {Object} app - App instance
+     * @returns {AppViewEngine} This instance for chaining
+     */
+    setApp(app) {
+        this.__.setApp(app);
+        return this;
+    }
+
+
+    /**
+     * Reset view engine
+     */
+    reset() {
+        // Implementation placeholder
+    }
+
+    // accessors
+
+    get App() {
+        return this.__.App;
+    }
+    set App(value) {
+        // this.__.App = value;
+    }
+
+    get id() {
+        return this.__.id;
+    }
+    set id(value) {
+        // this.__.id = value;
+    }
+
+    get type() {
+        return this.viewType;
+    }
+    set type(value) {
+        this.viewType = value;
+    }
+
+    get parent() {
+        return this.__.parent?.view || null;
+    }
+    set parent(value) {
+        // this.__.parent = value;
+    }
+
+    get children() {
+        return this.__.children.map(ctrl => ctrl.view);
+    }
+    set children(value) {
+        // this.__.children = value;
+    }
+
+    get superView() {
+        return this.__.superView?.view || null;
+    }
+    set superView(value) {
+        // this.__.superView = value;
+    }
+    get originalView() {
+        return this.__.originalView?.view || null;
+    }
+    set originalView(value) {
+        // this.__.originalView = value;
+    }
+    get isSuperView() {
+        return this.__.isSuperView;
+    }
+    set isSuperView(value) {
+        // this.__.isSuperView = value;
+    }
+    get isOriginalView() {
+        return this.__.isOriginalView;
+    }
+    set isOriginalView(value) {
+        // this.__.isOriginalView = value;
+    }
+
+    get hasSuperView() {
+        return this.__.hasSuperView;
+    }
+    set hasSuperView(value) {
+        this.__.hasSuperView = value;
+    }
+
+    get urlPath() {
+        return this.__.urlPath;
+    }
+    set urlPath(value) {
+        this.__.urlPath = value;
+    }
+
+}
+
+// Export ViewEngine as alias for View (for backward compatibility)
+export const ViewEngine = View;

package/src/core/ViewConfig.js

@@ -0,0 +1,229 @@
+const basePrefix = 'data-';
+const ATTR = {
+    PREFIX: {
+        BASE: basePrefix,
+        YIELD: `${basePrefix}yield-`,
+        
+
+        // DOM EVENTS - Mouse Events
+        CLICK: `${basePrefix}click-`,
+        DBLCLICK: `${basePrefix}dblclick-`,
+        MOUSEDOWN: `${basePrefix}mousedown-`,
+        MOUSEUP: `${basePrefix}mouseup-`,
+        MOUSEOVER: `${basePrefix}mouseover-`,
+        MOUSEOUT: `${basePrefix}mouseout-`,
+        MOUSEMOVE: `${basePrefix}mousemove-`,
+        MOUSEENTER: `${basePrefix}mouseenter-`,
+        MOUSELEAVE: `${basePrefix}mouseleave-`,
+        WHEEL: `${basePrefix}wheel-`,
+        AUXCLICK: `${basePrefix}auxclick-`,
+
+        // Keyboard Events
+        KEYDOWN: `${basePrefix}keydown-`,
+        KEYUP: `${basePrefix}keyup-`,
+        KEYPRESS: `${basePrefix}keypress-`,
+
+        // Form Events
+        INPUT: `${basePrefix}input-`,
+        CHANGE: `${basePrefix}change-`,
+        SUBMIT: `${basePrefix}submit-`,
+        RESET: `${basePrefix}reset-`,
+        INVALID: `${basePrefix}invalid-`,
+        SEARCH: `${basePrefix}search-`,
+
+        // Focus Events
+        FOCUS: `${basePrefix}focus-`,
+        BLUR: `${basePrefix}blur-`,
+        FOCUSIN: `${basePrefix}focusin-`,
+        FOCUSOUT: `${basePrefix}focusout-`,
+
+        // Selection Events
+        SELECT: `${basePrefix}select-`,
+        SELECTSTART: `${basePrefix}selectstart-`,
+        SELECTIONCHANGE: `${basePrefix}selectionchange-`,
+
+        // Touch Events
+        TOUCHSTART: `${basePrefix}touchstart-`,
+        TOUCHMOVE: `${basePrefix}touchmove-`,
+        TOUCHEND: `${basePrefix}touchend-`,
+        TOUCHCANCEL: `${basePrefix}touchcancel-`,
+
+        // Drag & Drop Events
+        DRAGSTART: `${basePrefix}dragstart-`,
+        DRAG: `${basePrefix}drag-`,
+        DRAGEND: `${basePrefix}dragend-`,
+        DRAGENTER: `${basePrefix}dragenter-`,
+        DRAGLEAVE: `${basePrefix}dragleave-`,
+        DRAGOVER: `${basePrefix}dragover-`,
+        DROP: `${basePrefix}drop-`,
+
+        // Media Events
+        PLAY: `${basePrefix}play-`,
+        PAUSE: `${basePrefix}pause-`,
+        ENDED: `${basePrefix}ended-`,
+        LOADSTART: `${basePrefix}loadstart-`,
+        LOADEDDATA: `${basePrefix}loadeddata-`,
+        LOADEDMETADATA: `${basePrefix}loadedmetadata-`,
+        CANPLAY: `${basePrefix}canplay-`,
+        CANPLAYTHROUGH: `${basePrefix}canplaythrough-`,
+        WAITING: `${basePrefix}waiting-`,
+        SEEKING: `${basePrefix}seeking-`,
+        SEEKED: `${basePrefix}seeked-`,
+        RATECHANGE: `${basePrefix}ratechange-`,
+        DURATIONCHANGE: `${basePrefix}durationchange-`,
+        VOLUMECHANGE: `${basePrefix}volumechange-`,
+        SUSPEND: `${basePrefix}suspend-`,
+        STALLED: `${basePrefix}stalled-`,
+        PROGRESS: `${basePrefix}progress-`,
+        EMPTIED: `${basePrefix}emptied-`,
+        ENCRYPTED: `${basePrefix}encrypted-`,
+        WAKEUP: `${basePrefix}wakeup-`,
+
+        // Window Events
+        LOAD: `${basePrefix}load-`,
+        UNLOAD: `${basePrefix}unload-`,
+        BEFOREUNLOAD: `${basePrefix}beforeunload-`,
+        RESIZE: `${basePrefix}resize-`,
+        SCROLL: `${basePrefix}scroll-`,
+        ORIENTATIONCHANGE: `${basePrefix}orientationchange-`,
+        VISIBILITYCHANGE: `${basePrefix}visibilitychange-`,
+        PAGEHIDE: `${basePrefix}pagehide-`,
+        PAGESHOW: `${basePrefix}pageshow-`,
+        POPSTATE: `${basePrefix}popstate-`,
+        HASHCHANGE: `${basePrefix}hashchange-`,
+        ONLINE: `${basePrefix}online-`,
+        OFFLINE: `${basePrefix}offline-`,
+
+        // Document Events
+        DOMCONTENTLOADED: `${basePrefix}DOMContentLoaded-`,
+        READYSTATECHANGE: `${basePrefix}readystatechange-`,
+
+        // Error Events
+        ERROR: `${basePrefix}error-`,
+        ABORT: `${basePrefix}abort-`,
+
+        // Context Menu
+        CONTEXTMENU: `${basePrefix}contextmenu-`,
+
+        // Animation Events
+        ANIMATIONSTART: `${basePrefix}animationstart-`,
+        ANIMATIONEND: `${basePrefix}animationend-`,
+        ANIMATIONITERATION: `${basePrefix}animationiteration-`,
+
+        // Transition Events
+        TRANSITIONSTART: `${basePrefix}transitionstart-`,
+        TRANSITIONEND: `${basePrefix}transitionend-`,
+        TRANSITIONRUN: `${basePrefix}transitionrun-`,
+        TRANSITIONCANCEL: `${basePrefix}transitioncancel-`,
+
+        // Pointer Events (Modern browsers)
+        POINTERDOWN: `${basePrefix}pointerdown-`,
+        POINTERUP: `${basePrefix}pointerup-`,
+        POINTERMOVE: `${basePrefix}pointermove-`,
+        POINTEROVER: `${basePrefix}pointerover-`,
+        POINTEROUT: `${basePrefix}pointerout-`,
+        POINTERENTER: `${basePrefix}pointerenter-`,
+        POINTERLEAVE: `${basePrefix}pointerleave-`,
+        POINTERCANCEL: `${basePrefix}pointercancel-`,
+        GOTPOINTERCAPTURE: `${basePrefix}gotpointercapture-`,
+        LOSTPOINTERCAPTURE: `${basePrefix}lostpointercapture-`,
+
+        // Fullscreen Events
+        FULLSCREENCHANGE: `${basePrefix}fullscreenchange-`,
+        FULLSCREENERROR: `${basePrefix}fullscreenerror-`,
+
+        // Clipboard Events
+        COPY: `${basePrefix}copy-`,
+        CUT: `${basePrefix}cut-`,
+        PASTE: `${basePrefix}paste-`,
+
+        // Gamepad Events
+        GAMEPADCONNECTED: `${basePrefix}gamepadconnected-`,
+        GAMEPADDISCONNECTED: `${basePrefix}gamepaddisconnected-`,
+
+        // Battery Events
+        BATTERYCHARGINGCHANGE: `${basePrefix}batterychargingchange-`,
+        BATTERYLEVELCHANGE: `${basePrefix}batterylevelchange-`,
+
+        // Device Orientation Events
+        DEVICEORIENTATION: `${basePrefix}deviceorientation-`,
+        DEVICEMOTION: `${basePrefix}devicemotion-`,
+        DEVICELIGHT: `${basePrefix}devicelight-`,
+        DEVICEPROXIMITY: `${basePrefix}deviceproximity-`,
+
+        // WebGL Events
+        WEBGLCONTEXTLOST: `${basePrefix}webglcontextlost-`,
+        WEBGLCONTEXTRESTORED: `${basePrefix}webglcontextrestored-`,
+
+
+        // view
+        VIEW: `${basePrefix}view-`,
+    },
+    KEYS: {
+        VIEW: `${basePrefix}view`,
+        VIEW_ID: `${basePrefix}view-id`,
+        VIEW_REF: `${basePrefix}view-ref`,
+        VIEW_SECTION_REF: `${basePrefix}view-section-ref`,
+        VIEW_RESOURCE: `${basePrefix}view-resource`,
+        VIEW_STYLE: `${basePrefix}view-style`,
+        VIEW_WRAPPER: `${basePrefix}view-wrapper`,
+        // yield
+        YIELD_ATTR: `${basePrefix}yield-attr`,
+        YIELD_CONTENT: `${basePrefix}yield-content`,
+        YIELD_CHILDREN: `${basePrefix}yield-children`,
+        YIELD_SUBSCRIBE: `${basePrefix}yield-subscribe`,
+        YIELD_SUBSCRIBE_ATTR: `${basePrefix}yield-subscribe-attr`,
+        YIELD_SUBSCRIBE_CONTENT: `${basePrefix}yield-subscribe-content`,
+        YIELD_SUBSCRIBE_CHILDREN: `${basePrefix}yield-subscribe-children`,
+    },
+    CLASSNAME: {
+        BASE: basePrefix,
+        VIEW_ERROR: `${basePrefix}view-error`,
+        VIRTUAL_CONTAINER: `${basePrefix}virtual-container`,
+        SECTION_ERROR: `${basePrefix}section-error`,
+    },
+    prefix: (key) => ATTR.PREFIX[key.toUpperCase()] || basePrefix + key,
+    key: (key) => ATTR.KEYS[key.toUpperCase()] || basePrefix + key,
+    className: (key) => ATTR.CLASSNAME[key.toUpperCase()] || basePrefix + key.toLowerCase().replace(/_/g, '-'),
+
+}
+
+export const FORBIDDEN_KEYS = [
+    'init',
+    'destroy',
+    'beforeInit',
+    'afterInit',
+    'beforeDestroy',
+    'destroyed',
+    'loadServerData',
+    'render',
+    'prerender',
+    'insertResources',
+    'removeResources',
+    'setMaster',
+    'setApp',
+    'addChild',
+    'removeChild',
+    'remove',
+    'setParent',
+    'parent',
+    'master',
+    'beforeCreate',
+    'created',
+    'beforeUpdate',
+    'updated',
+    'beforeMount',
+    'mounted',
+    'beforeUnmount',
+    'unmounted',
+    'renderLongSections',
+    'renderSections',
+    'prerenderSections',
+    'data',
+    'scope',
+    'subscribe',
+    'updateVariableItem',
+    'updateVariableData',
+];
+
+export { ATTR };