// Given the id (or array of idas) of a page element, and an object containg style keys and values, sets those styles on the given object style names that start with an underscore are treated as object properties directly instead of properties of the style object
function styler(ids, styles) {
	if (typeof ids != 'object') { ids = [ids]; }
	for (var ididx in ids) {
		var id = ids[ididx];
        var elem = el(id);
        if (!id) {return;}
        GenericStyler.applyStyles(elem, styles);
	}
}

var GenericStyler = new Object();

Object.extend(GenericStyler, {
   
    applyStyles: function(elem, styles) {
        for (var stylename in styles) {
            var stylevalue = styles[stylename];
            this.applyStyle(elem, stylename, stylevalue);
        }
    },
    
    
    // Styles that begin with and underscore and considered to be properties of the element itself
    // Style names with dahses will be converted to camelCase
    // ApplyStyle checks the GenericStyler.stylers object to see if there is a method for specificly handling this particular style.  This can be used to define new styles not native to the browser
    applyStyle: function(elem, name, value) {
        var styler = GenericStyler.stylers[name];
        if (typeof styler == 'function') { return styler(elem, name, value); }
       
        try {
            var bits = name.match(/^_(.*)/);
            if (bits != null) {
                elem[bits[1]] = value;
            }
            else {
                elem[name] = value;
            }
        }
        catch (e) { }
    },
    
    // Legacy to support aveda select boxes.  May go away
    // Creates all of the elements specified by the nested object in tree as children of parent
    // Each element with a _name field is also stored as a property of the object all
    addeltree: function(parent, tree, all) {
        
        var tagName = tree.tagName;
        delete tree.tagName;
        var name = tree._name;
        delete tree._name;
        var child = tree._child || new Array();
        delete tree._child;
        if (!(child.pop)) { child = [child]; }
        
        var elem = this.addel(parent, tagName, tree);
        if (name) { all[name] = elem; }
        for (var i=0; i<child.length; i++) {
            var kid = child[i];
            this.addeltree(elem, kid, all);
        }
        return parent;
    },
    
    addel: function(parent, tagname, attrs) {
        var elem = document.createElement(tagname);
        for (var attr in attrs) {
            var value = attrs[attr];
    //		if (attr == 'className') { attr = 'class'; }
    //		elem.setAttribute(attr, value);
            elem[attr] = value;
        }
        parent.appendChild(elem);
        return elem;
    },
         
    stylers: {
        hidden: function(elem, name, value) {
            value || value == 'true' ? elem.hide() : elem.show();
        }
    }
        
            
    });