if (!window.Idiom) {
    var Idiom = {};
}

Idiom.TagCloud = Class.create();

Idiom.TagCloud.prototype = {
    initialize:function(config) {

        var tc = this;

        this.events = [];
        this.config = config||{};
        this.tagArr = config.tagArr || [];
        if (!config.ele) {
            this.ele = document.createElement('div');
        }
        else {
            this.ele = config.ele;
        }

        Element.addClassName(this.ele, 'tagCloud');

        this.cls = config.cls || '';
        if (this.cls) {
            Element.addClassName(this.ele, this.cls);
        }

        if(config.elId){
            this.ele.id = config.elId;
        }
        //        this.id = config.id;

        this.tagClass = config.tagClass || '';
        this.tagTpl = new Template(config.tagTpl || '<span class="tagName">#{tagName}</span> <span class="tagCount">(#{tagCount})</span>');
        this.tagEles = [];

        this.tagHoverCls = config.tagHoverCls||'hover'; 

        //for now, do sort outside

        this.tagArr.each(function(tagObj){
            var tagEle = tc.makeTagEle(tagObj.tagName, tagObj.tagCount, tagObj.spl);
            tc.tagEles.push(tagEle);
            tc.ele.appendChild(tagEle);

        });

        (function(){
            var spc = document.createElement('div');
            Element.addClassName(spc, 'spacer');
            spc.innerHTML = '&nbsp;';
            tc.ele.appendChild(spc);
        })();

    },
    addEvents: function(events) {
        this.events = this.events || {};
        Object.extend(this.events, events);
    },

    addListener: function(eventName, handler, scope) {
        var listeners = this.events[eventName];
        if (!listeners) {
            this.events[eventName] = [];
            listeners = this.events[eventName];
        }
        else {
            if (typeof listeners == "boolean") {
                listeners = [];
            }
        }
        listeners.push({fn: handler, scope: scope});
        this.events[eventName] = listeners;

    },

    removeListener: function(eventName, fn) {

    },

    fireEvent: function(eventName) {

        var listeners = this.events[eventName];
        if (listeners && listeners.length && listeners.length > 0) {
            var args = Array.prototype.slice.call(arguments, 1);
            for (var i = 0; i < listeners.length; i++) {
                listeners[i].fn.apply(listeners[i].scope, args);
            }
        }

    },
    makeTagEle:function(name, count, /* function*/ spl) {
        var tc = this;
        var tagEle = document.createElement('div');
        Element.addClassName(tagEle, 'tag');
        if (this.tagClass) {
            Element.addClassName(tagEle, this.tagClass);
        }
        tagEle.innerHTML = this.tagTpl.evaluate({tagName:name, tagCount:count});
        Event.observe(tagEle, 'click', function(){
            

            tc.setActiveTag(name, tagEle);

            tc.fireEvent('tagClick',name, tagEle);
        });

         Event.observe(tagEle, 'mouseover', function() {
            Element.addClassName(tagEle, tc.tagHoverCls);
             tc.fireEvent('tagHover', name);
        });
        Event.observe(tagEle, 'mouseout', function() {
            Element.removeClassName(tagEle, tc.tagHoverCls);
            tc.fireEvent('tagHoverOut', name);
        });


        if(spl){
            tagEle = spl(tagEle, name);
        }

        return tagEle;
    },
    setActiveTag:function(tag, tagEle){
        if(this.activeTag){
            Element.removeClassName(this.activeTagEle, 'active');

        }
        this.activeTag = tag;
        this.activeTagEle = tagEle;
        Element.addClassName(tagEle, 'active');

    }
};