closure fake selector

README.md

@@ -55,6 +55,32 @@ When you accessing to some property in bound object (`$s` in this document), for
 - Element(s) with `name="input"`. You can use it for radiobuttons, or, if not found,
 - Element(s) with one of classes, equals `input`. 
 
+### special fake selectors
+
+This selectors changes default nanobind behaviour about data structures (cloning, round-robin, object-to-class assignements, nested structures, and so)
+
+#### `|dom`
+`some selector|dom` says to nanobind than assigning structure isn't a subobject for nested tags, but dom object to assign to exactly this element(s).
+#### `|closure`
+`some selector|closure` says to nanobind than assigning array isn't for default array nanobind behavior, but function with params, which initializes some plugin at matching elements. Function runned by nanobind, and should return a closure function
+to read plugin status:
+
+```javascript
+$s['somePluginContainer|closure'] = [function(value, options){
+    this.value = value
+    return function(){
+        return this.value
+    }
+},
+'someDefaultValueForInput']
+
+....
+alert($s['somePluginContainer|closure'])
+```
+When you set array to `|closure` selector, nanobind runs your function (first in array) with `this` set to matched element(s) (i. e. `#somePluginContainer` in sample above). When you read this selector, nanobind runs function, returned by passed function
+when set.
+
+
 ## Anisotropic dataflow
 
 **Nanobind** offers *anisotropic* behavior for data passed and read in DOM tree. I. e. when you set something to DOM and read this property, it's sometimes aren't

static/nb.js

@@ -17,12 +17,17 @@ function nbInit(a,b){
     var root=document, $s=a;
 
     var dom = null;
+    var closure = null;
 
     function searchElement(root, selector){
         if (selector.indexOf('|dom') === selector.length - 4){
             selector = selector.slice(0,selector.length - 4)
             dom      = true;
         }
+        if (selector.indexOf('|closure') === selector.length - 8){
+            selector = selector.slice(0,selector.length - 8)
+            closure  = true;
+        }
         if (root === document){
             var items = [root.getElementById(selector)]; 
         }
@@ -97,11 +102,11 @@ function nbInit(a,b){
         nBind(function (item, $s, selector, value, key, thisByClass){
             value = typeof value === 'undefined' ? $s[selector] : value;
             var keyExists = typeof key !== 'undefined';
+            if (closure){
+                item.nbData = value[0].apply(item, value.slice(1))
+            }
             if ((!item.children.length && !Array.isArray(value) && typeof value === 'object') || thisByClass || dom){ //hash array on single leaf node -> set attrs on the tag
                 recursiveObjectSet(item,value);
-                //for (var key in value){
-                    //item[key] = value[key];
-                //}
                 if (!thisByClass && !dom){
                     item.nbData = value;
                 }
@@ -182,6 +187,9 @@ function nbInit(a,b){
 
     function syncFromDOM(prop){
         nBind(function(item, $s, selector){
+            if (closure){
+                return item.nbData()
+            }
             if (item.type === 'radio'){
                 if (item.checked) 
                     return item.value; 
@@ -262,6 +270,7 @@ function nbInit(a,b){
             //}
             syncFromDOM(prop);
             dom = null;
+            closure = null;
             return target[prop];
         },
         set(target, prop, value){
@@ -269,6 +278,7 @@ function nbInit(a,b){
             target[prop] = value
             syncToDOM(prop);
             dom = null;
+            closure = null;
             return true;
         },
     })