ziko 0.68.0 → 0.68.2

package/src/events/mixins/view.js

@@ -0,0 +1,24 @@
+import { register_view_event } from '../custom-events-registry/view.js';
+const CATEGORY = 'view';
+export const ViewListeners = {
+    onEnterView(callback){
+        if(!this.exp.events?.[CATEGORY]) register_view_event(this.element);
+        return this.on(
+            'enterview', callback, 
+            { category : CATEGORY, isCustom : true})
+    },
+    onExitView(callback){
+        if(!this.exp.events?.[CATEGORY]) register_view_event(this.element);
+        return this.on(
+            'exitview', callback, 
+            { category : CATEGORY, isCustom : true})
+    },
+    onResizeView(callback){
+        if(!this.exp.events?.[CATEGORY]) register_view_event(this.element);
+        return this.on(
+            'resizeview', callback, 
+            { category : CATEGORY, isCustom : true})
+    },
+}
+
+

package/src/ui/constructors/UIElement.js

@@ -5,15 +5,15 @@ import {
   AttrsMethods,
   DomMethods,
   IndexingMethods,
-  // EventsMethodes,
   StyleMethods,
-  PtrListeners,
-  ClickListeners,
-  KeyListeners,
 } from "./mixins/index.js";
 
 import {
-  EventController
+  EventController,
+  PtrListeners,
+  ClickListeners,
+  KeyListeners,
+  ViewListeners,
 } from '../../events/index.js'
 class UIElement extends UIElementCore{
   constructor({element, name ='', type='html', render = __Ziko__.__Config__.default.render}={}){
@@ -29,24 +29,26 @@ class UIElement extends UIElementCore{
       AttrsMethods, 
       DomMethods, 
       StyleMethods,
-      IndexingMethods, 
+      IndexingMethods,
       PtrListeners,
       ClickListeners,
-      KeyListeners
+      KeyListeners,
+      ViewListeners,
     );
 
     if(element)this.init(element, name, type, render)
   }
-  _on(event, callback, {details_setter, category = 'global', preventDefault = false} = {}){
+  on(event_name, callback, {details_setter, category = 'global', isCustom = false,preventDefault = false} = {}){
     if(category && !this.exp.events.hasOwnProperty(category)) this.exp.events[category] = new EventController(this, category);
-    const EVENT = this.exp.events[category]
-    EVENT.addListener(event, (e)=>{
+    isCustom && this.exp.events[category].cache.customEvents.add(event_name)
+    const EVENT = this.exp.events[category];
+    EVENT.addListener(event_name, (e)=>{
       if(details_setter) details_setter(EVENT);
       callback(e)
     },{
       preventDefault
     });
-    
+    return this;
   }
   _off(event, category = 'global'){
     this.exp.events[category].removeListener(event)

package/src/ui/constructors/mixins/index.js

@@ -7,8 +7,6 @@ export * as AttrsMethods from './attrs.js'
 export * from './dom.js'
 export * as DomMethods from './dom.js'
 
-// export * from './events.js'
-
 export * from './indexing.js'
 export * as IndexingMethods from './indexing.js'
 
@@ -16,4 +14,3 @@ export * as IndexingMethods from './indexing.js'
 export * from './style.js'
 export * as StyleMethods from './style.js'
 
-export * from './events/index.js'

package/src/events/details-setter/index.js

@@ -1,4 +0,0 @@
-export * from './key.js'
-export * from './pointer.js'
-export * from './mouse.js'
-export * from './touch.js'

package/src/events/details-setter/key.js

@@ -1,14 +0,0 @@
-export function key_details_setter(){
-    switch(this.currentEvent){
-        case "keydown" : {
-            this.kd = this.event.key
-        }; break;
-        case "keypress" : {
-            this.kp = this.event.key
-        }; break;
-        case "keyup" : {
-            this.ku = this.event.key
-        }; break;
-
-    }
-}

package/src/events/details-setter/mouse.js

@@ -1,35 +0,0 @@
-export function mouse_details_setter() {
-    const rect = this.targetElement.getBoundingClientRect();
-    const e = this.event;
-    let x = (e.clientX - rect.left) | 0;
-    let y = (e.clientY - rect.top) | 0;
-
-    if(this.cache.useNormalisedCoordinates){
-        const w = this.targetElement.clientWidth;
-        const h = this.targetElement.clientHeight;
-        x = +((x / w) * 2 - 1).toFixed(8);
-        y = +((y / h) * -2 + 1).toFixed(8);
-    }
-
-    switch (this.currentEvent) {
-
-        case "mousedown":
-            this.dx = x;
-            this.dy = y;
-            this.isDown = true;
-            break;
-
-        case "mousemove":
-            this.mx = x;
-            this.my = y;
-            this.isMoving = true;
-            break;
-
-        case "mouserup":
-            this.ux = x;
-            this.uy = y;
-            this.isDown = false;
-            this.isMoving = false;
-            break;
-    }
-}

package/src/events/details-setter/pointer.js

@@ -1,35 +0,0 @@
-export function ptr_details_setter() {
-    const rect = this.targetElement.getBoundingClientRect();
-    const e = this.event;
-    let x = (e.clientX - rect.left) | 0;
-    let y = (e.clientY - rect.top) | 0;
-
-    if(this.cache.useNormalisedCoordinates){
-        const w = this.targetElement.clientWidth;
-        const h = this.targetElement.clientHeight;
-        x = +((x / w) * 2 - 1).toFixed(8);
-        y = +((y / h) * -2 + 1).toFixed(8);
-    }
-    switch (this.currentEvent) {
-
-        case "pointerdown":
-            this.dx = x;
-            this.dy = y;
-            this.isDown = true;
-            break;
-
-        case "pointermove":
-            this.mx = x;
-            this.my = y;
-            this.isMoving = true;
-            break;
-
-        case "pointerup":
-            this.ux = x;
-            this.uy = y;
-            this.isDown = false;
-            this.isMoving = false;
-            break;
-    }
-}
-

package/src/events/details-setter/touch.js

@@ -1,37 +0,0 @@
-export function touch_details_setter() {
-    const e = this.event;
-    const touch = e.touches?.[0] || e.changedTouches?.[0];
-
-    if (!touch) return; // should never happen but safe
-
-    const rect = this.targetElement.getBoundingClientRect();
-    let x = touch.clientX - rect.left;
-    let y = touch.clientY - rect.top;
-
-    if(this.cache.useNormalisedCoordinates){
-        const w = this.targetElement.clientWidth;
-        const h = this.targetElement.clientHeight;
-        x = +((x / w) * 2 - 1).toFixed(8);
-        y = +((y / h) * -2 + 1).toFixed(8);
-    }
-
-    switch (this.currentEvent) {
-        case "touchstart":
-            this.dx = x;
-            this.dy = y;
-            this.isDown = true;
-            break;
-
-        case "touchmove":
-            this.mx = x;
-            this.my = y;
-            this.isMoving = true;
-            break;
-
-        case "touchend":
-            this.ux = x;
-            this.uy = y;
-            this.isDown = false;
-            break;
-    }
-}

package/src/ui/constructors/mixins/events/click.js

@@ -1,22 +0,0 @@
-const CATEGORY = 'click';
-import {register_click_away_event} from '../../../../events/custom-events-registry/click-away.js'
-export const ClickListeners = {
-    onClick(callback){
-        this._on(
-            'click', callback, 
-            { category : CATEGORY })
-    },
-    onDblClick(callback){
-        this._on(
-            'dblclick', callback, 
-            { category : CATEGORY})
-    },
-    onClickAway(callback){
-        register_click_away_event(this.element)
-        this._on(
-            'clickaway', callback, 
-            { category : CATEGORY})
-    },
-}
-
-

package/src/ui/constructors/mixins/events/index.js

@@ -1,3 +0,0 @@
-export * from './click.js'
-export * from './ptr.js'
-export * from './key.js'