@onetype/framework 2.0.41 → 2.0.43

package/lib/src/classes/addon/classes/render/mixins/compile.js

@@ -1,3 +1,5 @@
+import onetype from '#framework/load.js';
+
 const RenderCompile =
 {
     Compile(html, data = null)
@@ -13,7 +15,7 @@ const RenderCompile =
 
             const prefix = this.GetAddon().GetName().charAt(0).toLowerCase();
 
-            element.classList.add(prefix + '-' + this.GetOneType().GenerateHash(this.GetAddon().GetName() + '-' + this.GetName()));
+            element.classList.add(prefix + '-' + onetype.GenerateHash(this.GetAddon().GetName() + '-' + this.GetName()));
         }
 
         const compile = {
@@ -32,11 +34,11 @@ const RenderCompile =
 
         const start = performance.now();
 
-        this.GetOneType().Emit('addon.render.compile.before', this, compile, element, '0');
+        onetype.Emit('@addon.render.compile.before', this, compile, element, '0');
 
         this.CompileWalkNodes(element, '0', compile);
 
-        this.GetOneType().Emit('addon.render.compile.after', this, compile, element, '0');
+        onetype.Emit('@addon.render.compile.after', this, compile, element, '0');
 
         compile.time = performance.now() - start;
 
@@ -54,7 +56,7 @@ const RenderCompile =
 
         const parent = node.parentNode;
 
-        this.GetOneType().Emit('addon.render.compile.node', this, compile, node, identifier);
+        onetype.Emit('@addon.render.compile.node', this, compile, node, identifier);
 
         if(node.parentNode !== parent)
         {

package/lib/src/classes/addon/classes/render/mixins/dom.js

@@ -1,3 +1,5 @@
+import onetype from '#framework/load.js';
+
 const RenderDOM =
 {
     DOMCreateElement(html)
@@ -9,7 +11,7 @@ const RenderDOM =
 
     DOMPatchElement(current, target)
     {
-        return this.Addon.onetype.DOMPatch(current, target);
+        return onetype.DOMPatch(current, target);
     },
 };
 

package/lib/src/classes/addon/classes/render/mixins/events.js

@@ -1,10 +1,12 @@
+import onetype from '#framework/load.js';
+
 const RenderEvents =
 {
     EventOn(event, callback)
     {
         if(!(event in this.Events))
         {
-            throw new Error('Event ' + event + ' doesn\'t exist.');
+            throw onetype.Error(400, 'Event :event: doesn\'t exist.', {event});
         }
 
         const run = {
@@ -22,7 +24,7 @@ const RenderEvents =
         {
             this.Events[event].push(callback);
         }
-        
+
         return this;
     },
 
@@ -30,7 +32,7 @@ const RenderEvents =
     {
         if(!(event in this.Events))
         {
-            throw new Error('Event ' + event + ' doesn\'t exist.');
+            throw onetype.Error(400, 'Event :event: doesn\'t exist.', {event});
         }
 
         const skip = {
@@ -71,7 +73,7 @@ const RenderEvents =
     {
          if(!(event in this.Events))
         {
-            throw new Error('Event ' + event + ' doesn\'t exist.');
+            throw onetype.Error(400, 'Event :event: doesn\'t exist.', {event});
         }
 
         if(!callback)
@@ -100,51 +102,36 @@ const RenderEvents =
         return this.EventOn(event, onceWrapper);
     },
 
-    EventInitObserver(type)
+    EventCleanup()
     {
-        if(this.Observer[type])
+        /* Global emitters */
+        for(const emitter of this.Emitters)
         {
-            return;
+            onetype.EmitOff(emitter.name, emitter.id);
         }
 
-        this.EventOn('mount', () =>
+        this.Emitters = [];
+
+        /* Visibility / Resize observers */
+        if(this.Element)
         {
-            if(type === 'visibility')
-            {
-                this.Observer[type] = new IntersectionObserver(entries =>
-                {
-                    entries.forEach(entry =>
-                    {
-                        if(entry.isIntersecting)
-                        {
-                            this.EventEmit('visible', entry);
-                        }
-                    });
-                }, {threshold: 0.1});
-            }
-            else if(type === 'resize')
-            {
-                this.Observer[type] = new ResizeObserver(entries =>
-                {
-                    entries.forEach(entry => this.EventEmit('resize', entry));
-                });
-            }
-
-            this.Observer[type].observe(this.Element);
-        });
-    },
-    
-    EventCleanup()
-    {
-        Object.keys(this.Observer).forEach(key =>
+            onetype.ObserverUnvisible(this.Element);
+            onetype.ObserverUnresize(this.Element);
+        }
+
+        /* Update frame */
+        if(this.UpdateFrame)
         {
-            if(this.Observer[key])
-            {
-                this.Observer[key].disconnect();
-                this.Observer[key] = undefined;
-            }
-        });
+            cancelAnimationFrame(this.UpdateFrame);
+            this.UpdateFrame = null;
+        }
+
+        /* Local events */
+        for(const event in this.Events)
+        {
+            this.Events[event] = [];
+        }
     }
 };
 
-export default RenderEvents;
+export default RenderEvents;

package/lib/src/classes/addon/classes/render/mixins/get.js

@@ -15,11 +15,6 @@ const RenderGet =
         return this.Addon;
     },
 
-    GetOneType()
-    {
-        return this.Addon.onetype;
-    },
-    
     GetData()
     {
         return this.Data;

package/lib/src/classes/addon/classes/render/mixins/methods.js

@@ -1,3 +1,5 @@
+import onetype from '#framework/load.js';
+
 const RenderMethods =
 {
     Mount(target)
@@ -6,40 +8,39 @@ const RenderMethods =
         {
             if(!this.Element)
             {
-                throw new Error('Cannot mount - render not processed');
+                throw onetype.Error(400,'Cannot mount - render not processed');
             }
-            
+
             if(this.State.mounted)
             {
-                throw new Error('Already mounted');
+                throw onetype.Error(400,'Already mounted');
             }
-            
+
             /* Before mount */
             this.EventEmit('mount');
-            
+
             /* Insert into DOM */
             target = typeof target === 'string' ? document.querySelector(target) : target;
 
             if(!target)
             {
-                throw new Error('Target element not found');
+                throw onetype.Error(400,'Target element not found');
             }
 
             target.appendChild(this.Element);
-            
+
             /* After mount */
             this.EventEmit('mounted');
-            
+
             return this;
         }
         catch(error)
         {
-            console.log(error);
             this.EventEmit('error', error);
             return this;
         }
     },
-    
+
     Unmount()
     {
         try
@@ -48,19 +49,19 @@ const RenderMethods =
             {
                 return this;
             }
-            
+
             /* Before unmount */
             this.EventEmit('unmount');
-            
+
             /* Remove from DOM */
             if(this.Element && this.Element.parentNode)
             {
                 this.Element.parentNode.removeChild(this.Element);
             }
-            
+
             /* After unmount */
             this.EventEmit('unmounted');
-            
+
             return this;
         }
         catch(error)
@@ -69,17 +70,17 @@ const RenderMethods =
             return this;
         }
     },
-    
+
     Destroy()
     {
         try
         {
             /* Unmount first */
             this.Unmount();
-            
+
             /* Emit destroy */
             this.EventEmit('destroy');
-            
+
             /* Clear references */
             this.Element = null;
             this.Nodes = {};
@@ -94,10 +95,10 @@ const RenderMethods =
     },
 
     /* State Management */
-    
+
     Define(config)
     {
-        const data = this.GetOneType().DataDefine(this, config);
+        const data = onetype.DataDefine(this, config);
 
         for(const key in data)
         {
@@ -105,18 +106,54 @@ const RenderMethods =
         }
     },
 
+    UpdateData(data)
+    {
+        let changed = false;
+
+        for(const key in data)
+        {
+            if(key === 'state')
+            {
+                continue;
+            }
+
+            const value = data[key];
+
+            if(typeof value === 'function')
+            {
+                this.Data[key] = value;
+                continue;
+            }
+
+            if(this.Data[key] !== value)
+            {
+                this.Data[key] = value;
+                changed = true;
+            }
+        }
+
+        if(changed && this.State.ready && !this.State.rendering && !this.UpdateFrame)
+        {
+            this.UpdateFrame = requestAnimationFrame(() =>
+            {
+                this.UpdateFrame = null;
+                this.Update();
+            });
+        }
+    },
+
     Update()
     {
         try
         {
             if(!this.Element)
             {
-                throw new Error('Cannot update - element not rendered');
+                throw onetype.Error(400,'Cannot update - element not rendered');
             }
 
             const compiled = this.Compile(this.Html);
 
-            this.GetOneType().DOMPatch(this.Element, compiled.element);
+            onetype.DOMPatch(this.Element, compiled.element);
 
             this.Nodes = compiled.nodes;
             this.Time = compiled.time;
@@ -131,58 +168,86 @@ const RenderMethods =
     },
 
     /* Lifecycle Hooks */
-    
+
     OnInit(callback)
     {
         return this.EventOn('init', callback);
     },
-    
+
     OnMount(callback)
     {
         return this.EventOn('mount', callback);
     },
-    
+
     OnMounted(callback)
     {
         return this.EventOn('mounted', callback);
     },
-    
-    
-    OnBeforeUnmount(callback)
-    {
-        return this.EventOn('unmount', callback);
-    },
-    
+
     OnUnmount(callback)
     {
         return this.EventOn('unmount', callback);
     },
-    
+
     OnDestroy(callback)
     {
         return this.EventOn('destroy', callback);
     },
-    
+
     OnReady(callback)
     {
         return this.EventOn('ready', callback);
     },
-    
+
     OnVisible(callback)
     {
-        return this.EventOn('visible', callback);
+        const render = this;
+
+        this.EventOn('ready', () =>
+        {
+            onetype.ObserverVisible(render.Element, (entry) =>
+            {
+                callback.call(render, entry);
+            });
+        });
     },
-    
+
     OnResize(callback)
     {
-        return this.EventOn('resize', callback);
+        const render = this;
+
+        this.EventOn('ready', () =>
+        {
+            onetype.ObserverResize(render.Element, (entry) =>
+            {
+                callback.call(render, entry);
+            });
+        });
     },
-    
+
     OnError(callback)
     {
         return this.EventOn('error', callback);
     },
-    
+
+    /* Global Emitter */
+
+    Emit(name, ...args)
+    {
+        onetype.Emit(name, ...args);
+    },
+
+    On(name, callback)
+    {
+        const render = this;
+
+        const id = onetype.EmitOn(name, function(...args)
+        {
+            callback.call(render, ...args);
+        });
+
+        this.Emitters.push({ name, id });
+    },
 };
 
-export default RenderMethods;
+export default RenderMethods;

package/lib/src/classes/addon/classes/render/mixins/process.js

@@ -1,3 +1,5 @@
+import onetype from '#framework/load.js';
+
 const RenderProcess =
 {
     Process()
@@ -19,6 +21,8 @@ const RenderProcess =
             this.EventEmit('compile', compiled, false);
 
             this.Element = compiled.element;
+            this.Element.__add = () => this.EventEmit('mount');
+            this.Element.__remove = () => this.Destroy();
             this.Nodes = compiled.nodes;
             this.Time = compiled.time;
 
@@ -68,7 +72,7 @@ const RenderProcess =
             {
                 if(typeof resolved !== 'string')
                 {
-                    throw new Error('Render function must return a string');
+                    throw onetype.Error(400, 'Render function must return a string.');
                 }
 
                 this.Html = resolved;
@@ -80,7 +84,7 @@ const RenderProcess =
 
         if(typeof html !== 'string')
         {
-            throw new Error('Render function must return a string');
+            throw onetype.Error(400, 'Render function must return a string.');
         }
 
         return html;
@@ -91,7 +95,7 @@ const RenderProcess =
         const html = `
             <div class="ot-render-error" style="padding: 20px; background: rgb(255 0 0 / 10%); border: 1px solid rgb(255 0 0 / 20%); border-radius: 4px; color: #FF0000; font-family: monospace;">
                 <strong>Render Error | Name: ${this.GetName()} | Addon: ${this.GetAddon().GetName()} </strong><br>
-                ${this.GetOneType().StringSanitize(message)}
+                ${onetype.StringSanitize(message)}
             </div>
         `;
         

package/lib/src/classes/addon/classes/render/mixins/set.js

@@ -1,8 +1,10 @@
+import onetype from '#framework/load.js';
+
 const RenderSet =
 {
     SetData(data)
     {
-        this.Data = Object.assign({ state: this.GetOneType().StateGet() }, data);
+        this.Data = Object.assign({ state: onetype.StateGet() }, data);
         return this;
     },
 

package/lib/src/classes/addon/mixins/fields.js

@@ -28,10 +28,8 @@ const AddonFields =
         {
             if(!(name in this.items.map))
             {
-                this.items.map = {};
+                this.items.map[name] = {};
             }
-
-            this.items.map[name] = {};
         }
 
         if(define !== null) { this.fields.data[name].define = define; }
@@ -41,7 +39,7 @@ const AddonFields =
         if(callback)
         {
             this.fields.callbacks.add.forEach(callback => callback.call(this, this.fields.data[name]));
-            this.onetype.Emit('addon.field.add', this, this.fields.data[name]);
+            this.onetype.Emit('@addon.field.add', this, this.fields.data[name]);
         }
 
         return this.fields.data[name];
@@ -62,7 +60,7 @@ const AddonFields =
         if(callback)
         {
             this.fields.callbacks.remove.forEach(callback => callback.call(this, this.fields.data[name]));
-            this.onetype.Emit('addon.field.remove', this, this.fields.data[name]);
+            this.onetype.Emit('@addon.field.remove', this, this.fields.data[name]);
         }
 
         delete this.fields.data[name];
@@ -72,7 +70,7 @@ const AddonFields =
     {
         if(!(type in this.fields.callbacks))
         {
-            this.LogWarn('Field catcher not found.', {name});
+            this.onetype.Error(400, 'Field catcher not found.', {name});
             return this;
         }
 

package/lib/src/classes/addon/mixins/functions.js

@@ -12,7 +12,7 @@ const AddonFunctions =
 
         if (typeof callback !== 'function')
         {
-            this.onetype.LogWarn('Function "' + name + '" callback is not a function.');
+            this.onetype.Error(400, 'Function :name: callback is not a function.', {name});
             return this;
         }
 
@@ -21,11 +21,11 @@ const AddonFunctions =
         try
         {
             this.functions.callbacks.add.forEach(callback => callback.call(this, this.functions.data[name]));
-            this.onetype.Emit('addon.function.add', name);
+            this.onetype.Emit('@addon.function.add', name);
         }
         catch(error)
         {
-            this.onetype.LogError('Error in function "' + name + '" callback add.', {}, error);
+            this.onetype.Error(500, 'Error in function :name: callback add.', {name});
         }
 
         return this;
@@ -45,7 +45,7 @@ const AddonFunctions =
 
         if (!fn)
         {
-            this.onetype.LogError('Function not found.', {name});
+            this.onetype.Error(404, 'Function not found.', {name});
             return null;
         }
 
@@ -57,11 +57,11 @@ const AddonFunctions =
         try
         {
             this.functions.callbacks.before.forEach(callback => callback.call(context, fn, ...data));
-            this.onetype.Emit('addon.function.before', this, fn, response, ...data);
+            this.onetype.Emit('@addon.function.before', this, fn, response, ...data);
         }
         catch(error)
         {
-            this.onetype.LogError('Error in function callback before.', {name}, error);
+            this.onetype.Error(500, 'Error in function callback before.', {name});
         }
        
         response = fn.callback.call(context, ...data);
@@ -69,11 +69,11 @@ const AddonFunctions =
         try
         {
             this.functions.callbacks.after.forEach(callback => callback.call(context, fn, response, ...data));
-            this.onetype.Emit('addon.function.after', context, fn, response, ...data);
+            this.onetype.Emit('@addon.function.after', context, fn, response, ...data);
         }
         catch(error)
         {
-            this.onetype.LogError('Error in function callback after.', {name}, error);
+            this.onetype.Error(500, 'Error in function callback after.', {name});
         }
 
         return response;
@@ -91,11 +91,11 @@ const AddonFunctions =
         try
         {
             this.functions.callbacks.remove.forEach(callback => callback.call(this, fn));
-            this.onetype.Emit('addon.function.remove', this, fn);
+            this.onetype.Emit('@addon.function.remove', this, fn);
         }
         catch(error)
         {
-            this.onetype.LogError('Error in function callback remove.', {name: fn.name}, error);
+            this.onetype.Error(500, 'Error in function callback remove.', {name: fn.name});
         }
 
         delete this.functions.data[fn.name];
@@ -107,7 +107,7 @@ const AddonFunctions =
     {
         if(!(type in this.functions.callbacks))
         {
-            return this.LogWarn('Item catcher not found.', {type});
+            return this.onetype.Error(400, 'Function catcher not found.', {type});
         }
 
         this.functions.callbacks[type].push(callback);

package/lib/src/classes/addon/mixins/items.js

@@ -69,10 +69,18 @@ const AddonItems =
 
         item.SetData(object, false);
 
+        for(const [name, field] of Object.entries(this.fields.data))
+        {
+            if(field.map && this.items.map[name])
+            {
+                this.items.map[name][item.data[name]] = item.data.id;
+            }
+        }
+
         if(callback)
         {
-            this.items.callbacks.add.forEach(callback => callback.call(this, item));
-            this.onetype.Emit('addon.item.add', this, item);
+            this.items.callbacks.add.forEach(callback => callback(item));
+            this.onetype.Emit('@addon.item.add', item);
         }
 
         then && then(item);
@@ -84,8 +92,8 @@ const AddonItems =
 
         if(callback)
         {
-            this.items.callbacks.added.forEach(callback => callback.call(this, item));
-            this.onetype.Emit('addon.item.added', this, item);
+            this.items.callbacks.added.forEach(callback => callback(item));
+            this.onetype.Emit('@addon.item.added', item);
         }
 
         return item;
@@ -124,16 +132,16 @@ const AddonItems =
 
         if(callback)
         {
-            this.items.callbacks.remove.forEach(callback => callback.call(this, item));
-            this.onetype.Emit('addon.item.remove', this, item);
+            this.items.callbacks.remove.forEach(callback => callback(item));
+            this.onetype.Emit('@addon.item.remove', item);
         }
 
         delete this.items.data[id];
 
         if(callback)
         {
-            this.items.callbacks.removed.forEach(callback => callback.call(this, item));
-            this.onetype.Emit('addon.item.removed', this, item);
+            this.items.callbacks.removed.forEach(callback => callback(item));
+            this.onetype.Emit('@addon.item.removed', item);
         }
     },
 
@@ -157,7 +165,7 @@ const AddonItems =
     {
         if(!(type in this.items.callbacks))
         {
-            this.LogWarn('Item catcher not found for: ' + type + '.');
+            this.onetype.Error(400, 'Item catcher not found for :type:.', {type});
             return this;
         }