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 @@
+/*
+    Flags
+    0x01  01 watch enabled
+    0x02  02 read layer enabled
+    0x04  04 write layer enable
+    0x08  08 initial state
+    0x10  16 changing state
+    0x20  32 immediate change
+ */
+(()=>{
+    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 );
+            };
+            return real;
+        };
+        this.set = () => {
+            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)
     {
-    let value = undefined;
-    let effects = [];
-    let piping = é.pipeLine();
-    let flag = 0;
-    let version = 0;
-    let diff = é.diff;
-    let get = () => {
-        return (flag & 2) ? piping.get(value) : value;
-    };
-    let set = (newValue) => {
-        newValue = é.extract(newValue, value);
-        (flag & 4) && (newValue = piping.set(newValue));
-        if(diff(newValue,value))
+        if(this instanceof é)
         {
-            (flag & 1) && effects.filter(e => e.o).forEach(k => k());
-            value = newValue;
-            version++;
-            (flag & 1) && effects.map(e => e.f());
-        }
-    };
-    let useEffect = (e) => {
-        flag = flag | 1;
-        let k = {
-            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)
-        }
+            this.value = é.extract(defaultValue);
+            this.version = 0;
+            this.effects = [];
+            this.piping = new pipeLine();
+            this.flag = 8;
+        }else{
+            return new é(defaultValue)
         }
     }
+    é.fingerPrint = Symbol("wire");
     é.isWire = n => n?.fp == é.fingerPrint;
     é.extract = (e,v) => typeof e=='function'?e(v):e;
     é.isSame = (a,b) => !é.diff(a,b);
-é.fingerPrint = Symbol("wire");
-é.useEffect = (fn, assoc) => 
-{
+    é.watch = (fn, assoc) => {
         for (const wireVar of assoc)
         {
             if(é.isWire(wireVar))
             {
-            wireVar.useEffect(fn);
+                wireVar.watch(fn);
             }
         }
     };
     é.diff = (a,b,c) => {
-    let cursoryDiffResult = é.cDiff(a,b);
-    if(cursoryDiffResult == é.cDiff.adiff)
+        let cursoryDiffResult = cDiff(a,b);
+        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;
@@ -120,16 +135,16 @@ 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) => {
-    return é.cArrDiff(
+    const cObjectDiff = (a,b) => {
+        return cArrDiff(
             Object.keys(a),
             Object.keys(b)
         );
     };
-é.cDiff = (a,b) => {
+    const cDiff = (a,b) => {
         switch(typeof a)
         {
             case "undefined":
@@ -148,30 +163,95 @@ function é(defaultValue)
             }
         };
     }
-é.cDiff.adiff = -1;
-é.cDiff.some = 0;
-é.cDiff.different = 1;
-é.pipeLine = () => {
-    let k = {};
-    let reads = [];
-    let writes = [];
-    k.read = (fn,pr) => reads.push({fn,pr});
-    k.write = (fn,pr) => writes.push({fn,pr});
-    k.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 );
-        };
-        return real;
-    };
-    k.set = (val) => {
-        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;
-    };
-    return k;
+    cDiff.adiff = -1;
+    cDiff.some = 0;
+    cDiff.different = 1;
+
+    é.prototype.fp = é.fingerPrint;
+    é.prototype.diff = é.diff;
+    é.prototype.get = function(){
+        if(this.flag & 2)
+        {
+            return this.piping.get(this.value)
+        }else{
+            return this.value
         }
+    };
+    é.prototype.set = function(newValue){
+        if(this.flag & 16)
+        {
+            return;
+        }
+        newValue = é.extract(newValue, this.value);
+        if(this.flag & 4)
+        {
+            newValue = this.piping.set(newValue)
+        };
+        if(this.diff(newValue,this.value))
+        {
+            this.flag = this.flag | 16;
+            if(this.flag & 1)
+            {
+                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;
+        }
+    };
+    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)
+                    }
+                }
+            })
+        }
+    };
+    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.é = é;
+    }
+})();