Structure Updated

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@saqut/wirejs",
-  "version": "0.1.0",
+  "version": "0.2.0",
   "type": "commonjs",
   "private": false,
   "description": "Dont use variable, use smart variable wires !",

readme.md

@@ -2,7 +2,7 @@
 
 ## Açıklama
 
-WiréS, ReactJS kütüphanesinin useState ve useEffect kancalarından ilham alınarak browser ortamı için tekrar yazılmış bir kütüphanedir. 
+WiréS, ReactJS kütüphanesinin useState ve watch kancalarından ilham alınarak browser ortamı için tekrar yazılmış bir kütüphanedir. 
 Verileri getter/setter fonksiyonlarıyla sararak gerçek değişikleri algılayan özelliği sayesinde gereksiz güncellemeleri göz ardı eder.
 
 Veri ilişkilerini önceden belirleyerek değişiklik olduğunda okunacak ve yazılacak verileri koşullara bağlayabilir, okuma ve yazma öncesi ara katmanlar ekleyebilirsiniz
@@ -36,18 +36,18 @@ currency.get(); // --> 25
 
 ## Değişimler
 
-Bir kablonun değerinin değiştiğini `useEffect` özelliğiyle dinleyebilirsiniz veya birden fazla kablonun değişimini aynı anda dinlemek için `é.useEffect` fonksiyonunu kullanabilirsiniz
+Bir kablonun değerinin değiştiğini `watch` özelliğiyle dinleyebilirsiniz veya birden fazla kablonun değişimini aynı anda dinlemek için `é.watch` fonksiyonunu kullanabilirsiniz
 
 ```javascript
 let a = é(0);
 let b = é(0);
-a.useEffect(()=>{
+a.watch(()=>{
     // a kablosu değiştiğinde burası çalışacak
 })
-b.useEffect(()=>{
+b.watch(()=>{
     // b kablosu değiştiğinde burası çalışacak
 })
-é.useEffect(()=>{
+é.watch(()=>{
     // a veya b değiştiğinde burası çalışacak
 },[a, b])
 ```
@@ -57,17 +57,17 @@ let toplayan = é(0);
 let toplanan = é(0);
 let sonuc = é(0);
 
-é.useEffect(()=>{
+é.watch(()=>{
     sonuc.set( toplayan.get() + toplanan.get() )
 },[toplayan, toplanan])
 
-toplayan.useEffect(()=>{
+toplayan.watch(()=>{
     console.log("Toplayan: ",toplayan.get())
 })
-toplanan.useEffect(()=>{
+toplanan.watch(()=>{
     console.log("Toplanan: ",toplanan.get())
 })
-sonuc.useEffect(()=>{
+sonuc.watch(()=>{
     console.log("Değişen Sonuç: ",sonuc.get())
 })
 

wire.js

@@ -1,82 +1,97 @@
-function é(defaultValue)
+/*
-{
+    Flags
-    let value = undefined;
+    0x01  01 watch enabled
-    let effects = [];
+    0x02  02 read layer enabled
-    let piping = é.pipeLine();
+    0x04  04 write layer enable
-    let flag = 0;
+    0x08  08 initial state
-    let version = 0;
+    0x10  16 changing state
-    let diff = é.diff;
+    0x20  32 immediate change
-    let get = () => {
+ */
-        return (flag & 2) ? piping.get(value) : value;
+(()=>{
+    let pipeLine = function(){
+        this.reads = [];
+        this.writes = [];
+        this.read = (fn,pr) => reads.push({fn,pr});
+        this.write = (fn,pr) => writes.push({fn,pr});
+        this.get = (val) => {
+            let fns = reads.sort((a,b) => (a?.pr|0) - (b?.pr|0)),
+            real = val;
+            for (const { fn } of fns) {
+                fn( real, e => real = e );
             };
-    let set = (newValue) => {
+            return real;
-        newValue = é.extract(newValue, value);
+        };
-        (flag & 4) && (newValue = piping.set(newValue));
+        this.set = () => {
-        if(diff(newValue,value))
+            let fns = writes.sort((a,b) => (a?.pr|0) - (b?.pr|0)),
+            real = val;
+            for (const { fn } of fns) {
+                fn( real, e => real = e );
+            };
+            return real;
+        };
+    }
+    pipeLine.prototype.read = function(fn,pr){
+        this.reads.push({fn,pr})
+    }
+    pipeLine.prototype.write = function(fn,pr){
+        this.writes.writes({fn,pr})
+    }
+    pipeLine.prototype.get = function(val){
+        let fns = this.reads.sort((a,b) => (a?.pr|0) - (b?.pr|0)),
+        real = val;
+        for (const { fn } of fns) {
+            fn( real, e => real = e );
+        };
+        return real;
+    }
+    pipeLine.prototype.set = function(val){
+        let fns = this.writes.sort((a,b) => (a?.pr|0) - (b?.pr|0)),
+        real = val;
+        for (const { fn } of fns) {
+            fn( real, e => real = e );
+        };
+        return real;
+    }
+    function é(defaultValue)
     {
-            (flag & 1) && effects.filter(e => e.o).forEach(k => k());
+        if(this instanceof é)
-            value = newValue;
+        {
-            version++;
+            this.value = é.extract(defaultValue);
-            (flag & 1) && effects.map(e => e.f());
+            this.version = 0;
-        }
+            this.effects = [];
-    };
+            this.piping = new pipeLine();
-    let useEffect = (e) => {
+            this.flag = 8;
-        flag = flag | 1;
+        }else{
-        let k = {
+            return new é(defaultValue)
-            f:e,
-            o:undefined
-        };
-        requestAnimationFrame(()=> {
-            k.o = e();
-        })
-        effects.push(k);
-    }
-    value = é.extract(defaultValue, value);
-    return {
-        get,
-        set,
-        useEffect,
-        fp: é.fingerPrint,
-        getVersion: () => version,
-        equalTo: n => é.isSame(n, value),
-        readLayer: (a,b) => {
-            flag = flag | 2;
-            piping.read(a,b)
-        },
-        writeLayer: (a,b) => {
-            flag = flag | 4;
-            piping.write(a,b)
         }
     }
-}
+    é.fingerPrint = Symbol("wire");
-é.isWire = n => n?.fp == é.fingerPrint;
+    é.isWire = n => n?.fp == é.fingerPrint;
-é.extract = (e,v) => typeof e=='function'?e(v):e;
+    é.extract = (e,v) => typeof e=='function'?e(v):e;
-é.isSame = (a,b) => !é.diff(a,b);
+    é.isSame = (a,b) => !é.diff(a,b);
-é.fingerPrint = Symbol("wire");
+    é.watch = (fn, assoc) => {
-é.useEffect = (fn, assoc) => 
-{
         for (const wireVar of assoc)
         {
             if(é.isWire(wireVar))
             {
-            wireVar.useEffect(fn);
+                wireVar.watch(fn);
             }
         }
-};
+    };
-é.diff = (a,b,c) => {
+    é.diff = (a,b,c) => {
-    let cursoryDiffResult = é.cDiff(a,b);
+        let cursoryDiffResult = cDiff(a,b);
-    if(cursoryDiffResult == é.cDiff.adiff)
+        if(cursoryDiffResult == cDiff.adiff)
         {
-        return é.adiff(a,b,c||[])
+            return adiff(a,b,c||[])
         }else{
-        return cursoryDiffResult == é.cDiff.some ? false : true;
+            return cursoryDiffResult == cDiff.some ? false : true;
         }
-}
+    }
-é.adiff = (a,b,c) => {
+    const adiff = (a,b,c) => {
         if(c.includes(a) && c.includes(b))
         {
             console.error("Circular object detected !")
-        return é.cObjectDiff(a,b);
+            return cObjectDiff(a,b);
         }
         let typea = a instanceof Array ? 0 : a.byteLength ? 1 : 2;
         let typeb = b instanceof Array ? 0 : b.byteLength ? 1 : 2;
@@ -119,17 +134,17 @@ function é(defaultValue)
             }
             return false
         }
-}
+    }
-é.cArrDiff = (a,b) => {
+    const cArrDiff = (a,b) => {
         return a.length != b.length || !a.every((v,i) => a[i] === v)
-};
+    };
-é.cObjectDiff = (a,b) => {
+    const cObjectDiff = (a,b) => {
-    return é.cArrDiff(
+        return cArrDiff(
             Object.keys(a),
             Object.keys(b)
         );
-};
+    };
-é.cDiff = (a,b) => {
+    const cDiff = (a,b) => {
         switch(typeof a)
         {
             case "undefined":
@@ -147,31 +162,96 @@ function é(defaultValue)
                 return é.cDiff.adiff;
             }
         };
-}
+    }
-é.cDiff.adiff = -1;
+    cDiff.adiff = -1;
-é.cDiff.some = 0;
+    cDiff.some = 0;
-é.cDiff.different = 1;
+    cDiff.different = 1;
-é.pipeLine = () => {
+
-    let k = {};
+    é.prototype.fp = é.fingerPrint;
-    let reads = [];
+    é.prototype.diff = é.diff;
-    let writes = [];
+    é.prototype.get = function(){
-    k.read = (fn,pr) => reads.push({fn,pr});
+        if(this.flag & 2)
-    k.write = (fn,pr) => writes.push({fn,pr});
+        {
-    k.get = (val) => {
+            return this.piping.get(this.value)
-        let fns = reads.sort((a,b) => (a?.pr|0) - (b?.pr|0)),
+        }else{
-        real = val;
+            return this.value
-        for (const { fn } of fns) {
+        }
-            fn( real, e => real = e );
     };
-        return real;
+    é.prototype.set = function(newValue){
+        if(this.flag & 16)
+        {
+            return;
+        }
+        newValue = é.extract(newValue, this.value);
+        if(this.flag & 4)
+        {
+            newValue = this.piping.set(newValue)
         };
-    k.set = (val) => {
+        if(this.diff(newValue,this.value))
-        let fns = writes.sort((a,b) => (a?.pr|0) - (b?.pr|0)),
+        {
-        real = val;
+            this.flag = this.flag | 16;
-        for (const { fn } of fns) {
+            if(this.flag & 1)
-            fn( real, e => real = e );
+            {
+                schedule((()=>{
+                    this.effects.filter(e => e.o).forEach(k => k())
+                }));
+            }
+            this.value = newValue;
+            this.version++;
+            if(this.flag & 1)
+            {
+                schedule((()=>{
+                    this.effects.map(e => e.f());
+                }));
+            }
+            this.flag = this.flag ^ 16;
+        }
     };
-        return real;
+    const schedule = function(fn){
+        schedule.jobs.push(fn)
+        if(!é.schedule.executing)
+        {
+            requestAnimationFrame(()=>{
+                for (const fn of schedule.jobs) {
+                    try{
+                        fn()
+                    }catch(e){
+                        console.error(e)
+                    }
+                }
+            })
+        }
     };
-    return k;
+    schedule.executing = false;
-}
+    schedule.jobs = [];
+    é.prototype.watch = function(fn){
+        this.flag = this.flag | 1;
+        let k = {
+            f:fn,
+            o:undefined
+        };
+        requestAnimationFrame(()=> {
+            k.o = fn();
+        })
+        this.effects.push(k);
+    };
+    é.prototype.getVersion = function(){
+        return this.version;
+    }
+    é.prototype.equalTo = function(value){
+        return é.isSame(value, this.value)
+    }
+    é.prototype.readLayer = function(value){
+        this.flag = this.flag | 2;
+        this.piping.read(a,b)
+    }
+    é.prototype.writeLayer = function(value){
+        this.flag = this.flag | 4;
+        this.piping.write(a,b)
+    }
+    try{
+        module.exports = é;
+    }catch{
+        window.é = é;
+    }
+})();