gallery-slider-value.js

YUI.add('gallery-slider-value', function(Y) {

Y.Node.ATTRS.value.setter = function (val) {
    var old = Y.DOM.getValue(this._node);

    Y.DOM.setValue(this._node, val);

    this.fire('valueChange', { prevVal: old, newVal: val });

    return this;
};

var HOST = "host",
    NODE = "node",
    NODES = "nodes",
    VALUE = "value",
    BIDIRECTIONAL = "bidirectional";

function SliderValuePlugin(config) {
    SliderValuePlugin.superclass.constructor.apply(this, arguments);
}

SliderValuePlugin.NS = VALUE;
SliderValuePlugin.NAME = "sliderValuePlugin";
SliderValuePlugin.ATTRS = {
    host : {
        value : null,
        validator : function(val, name) {
            return !(Y.Lang.isNull(val));
        }
    },
    
    node : {
        value : null,
        setter : function(val, name) {
            return (val instanceof Y.Node) ? val : Y.one(val);
        }
    },
    
    nodes : {
        value : null,
        setter : function(val, name) {
            if(val) {
                return (val instanceof Y.NodeList) ? val : Y.all(val);
            }
            
            return false;
        }
    },
    
    bidirectional : {
        value : false,
        setter : function(val, name) {
            return val ? true : false;
        }
    }
};

Y.extend(SliderValuePlugin, Y.Base, {
    _handles : [],
    _doHandles : [],
    _type : null,
    
    initializer : function(config) {
        if(!(config.node || config.nodes)) {
            return;
        }
        
        this.set((config.node) ? NODE : NODES, (config.node) ? config.node : config.nodes);
        this.set(BIDIRECTIONAL, config.bidirectional);
        
        var node = this.get(NODE),
            nodes = this.get(NODES),
            host = this.get(HOST);
        
        this._type = ((node) ? node : nodes.item(0)).get("nodeName").toLowerCase();
        
        //Slider -> Node(s)
        //store Y.on handle for unsubscribing on destroy
        this._handles.push(host.after("valueChange", function() {
            var val = host.get(VALUE),
                i, l;
            
            if(node) { //single node
                if(this._type === "input") {
                    node.set(VALUE, val);
                } else if(this._type === "select") {
                    var options = node.get("options");
                    
                    for(i = 0, l = options.size(); i < l; i++) {
                        if(options.item(i).get(VALUE) == val) {
                            node.set("selectedIndex", i);
                            return;
                        }
                    }
                } else {
                    node.setContent(val);
                }
            } else { //multiple nodes
                for(i = 0, l = nodes.size(); i < l; i++) {
                    if(nodes.item(i).get(VALUE) == val) {
                        nodes.item(i).set("checked", true);
                        return;
                    }
                }
            }
        }, this));
        
        // Node(s) -> Slider
        // only if it was asked for and the node can actually accept a value
        if(config.bidirectional && (this._type === "input" || this._type === "select" || this._type === "textarea")) {
            var callback, val;
            if(node) {
                callback = function(e) {
                    console.log("callback: %o", arguments); //TODO: REMOVE DEBUGGING
                    console.log(this); //TODO: REMOVE DEBUGGING CODE
                    var val;
                    
                    if(this._type === "input") {
                        val = node.get(VALUE);
                    } else if(this._type === "select") {
                        val = node.get("options").item(node.get("selectedIndex")).get(VALUE);
                    } else {
                        val = node.get("textContent");
                    }
                    
                    val = parseInt(val, 10);
                    
                    host.set(VALUE, val || 0);
                };
                
                //this._doHandles.push(Y.Do.after(callback, node, "set", this, true));
                this._handles.push(node.on("valueChange", callback, this));
                this._handles.push(node.on("change", callback, this));
            } else {
                callback = function(e) {
                    var item = Y.one(e.currentTarget);
                    
                    val = parseInt(item.get(VALUE), 10);
                    
                    host.set(VALUE, val || 0);
                };
                
                //this._doHandles.push(Y.Do.after(callback, nodes, "set", this, true));
                this._handles.push(nodes.on("valueChange", callback, this));
                this._handles.push(nodes.on("change", callback, this));
            }
        }
        
        return this;
    },
    
    destructor : function() {
        var i, l;
        
        if(this._handles.length) {
            for(i = 0, l = this._handles.length; i < l; i++) {
                this._handles[i].detach();
            }
        }
        
        if(this._doHandles.length) {
            for(i = 0, l = this._doHandles.length; i < l; i++) {
                Y.Do.detach(this._doHandles[i]);
            }
        }
    }
});

Y.SliderValuePlugin = SliderValuePlugin;



}, '@VERSION@' ,{requires:['base', 'value-change']});