var JobsUI = new Class({
    initialize: function() {
        this.cities = $('facets').getElement('.facet.cities');
        this.industries = $('facets').getElement('.facet.industries');
        this.provinces = $('facets').getElement('.facet.provinces');
        this.citiesMap = $H({});
        this.industriesMap = $H({});
        this.provincesMap = $H({});
        this.rows = $('jobs-container').getElements('.job-row-container');
        this.rows.each(function(el) {
            var data = el.getElements('span').get('text');
            var industry = data[1];
            var city = data[2];
            var province = data[3];
            this.insertRow(this.industriesMap, industry, el);
            this.insertRow(this.citiesMap, city, el);
            this.insertRow(this.provincesMap, province, el);
        }.bind(this));
        this.createFacets(this.cities, this.citiesMap, 'city');
        this.createFacets(this.industries, this.industriesMap, 'industry');
        this.createFacets(this.provinces, this.provincesMap, 'province');
        this.enabledFacets = $H({});
        this.headers = $('jobs-heading-container').getElements('.jobs-heading a');
        this.headers.each(function(el, idx) {
            el.addEvent('click', this.sortBy.bindWithEvent(this, [el, idx]));
        }.bind(this));
        this.currentSort = null;
    },
    sortBy: function(ev, header, hidx) {
        ev.stop();
        var sortType = 'down';
        if(this.currentSort != header) {
            if(this.currentSort) this.currentSort.removeClass('up').removeClass('down');
            header.addClass('down');
            this.currentSort = header;
            sortType = 'down';
        } else {
            if(header.hasClass('down')) {
                header.removeClass('down').addClass('up');
                sortType = 'up';
            } else {
                header.removeClass('up').addClass('down');
                sortType = 'down';
            }
        }

        this.rows.sort(function(a, b) {
            var av = a.getElements('span')[hidx].get('text');
            var bv = b.getElements('span')[hidx].get('text');
            return sortType == 'up' ? av < bv : av > bv;
        });
        var last = 'even-row';
        this.rows.each(function(el) {
            el.dispose().inject($('jobs-container'), 'bottom');
            if(el.getStyle('display') == 'block') {
                el.removeClass('odd-row').removeClass('even-row');
                last = last == 'even-row' ? 'odd-row' : 'even-row';
                el.addClass(last);
            }
        });
    },
    insertRow: function(map, vals, el) {
        if(!vals) return;
        var fv = vals.split(/\s+or\s+/);
        for(i=0; i<fv.length; i++) {
            var val = fv[i];
            if(map.has(val)) {
                map[val].push(el);
            } else {
                map[val] = [el];
            }
        }
    },
    createFacets: function(el, map, type) {
        el.empty();
        
        var sortedKeys = map.getKeys().sort();
        
        sortedKeys.each(function(key) {
            var val = map[key];
            var li = new Element('li', { 'html': '<a href="#">'+key+'</a>'});
            li.inject(el);
            var link = li.getElement('a');
            link.store('rows', val);
            link.addEvent('click', this.enableValue.bindWithEvent(this, [link, val, type, type+":"+key]));
        }.bind(this));

        el.setStyle('display', 'block');
    },
    enableValue: function(ev, link, rows, facetType, facetValue) {
        ev.stop();
        
        if(this.enabledFacets.has(facetValue)) {
            this.enabledFacets.erase(facetValue);
            link.removeClass('enabled');
        } else {
            this.enabledFacets[facetValue] = {
                type: facetType,
                rows: rows
            };
            link.addClass('enabled');
        }
        this.refreshRows();
    },
    refreshRows: function() {
        var allEnabledTypes = $H([]);
        
        this.enabledFacets.each(function(val, key) {
            allEnabledTypes[val['type']] = false;
        });
        var isRowEnabled = function(el) {
            var enabled = $H([]);
            
            this.enabledFacets.each(function(val, key) {
                if(val['rows'].contains(el)) enabled[val['type']] = false;
            });
            
            return allEnabledTypes.getKeys().length == enabled.getKeys().length;
        }.bind(this);
        var passthrough = allEnabledTypes.getKeys().length == 0;
        var last = 'even-row';
        this.rows.each(function(el) {
            var show = passthrough || isRowEnabled(el) ? 'block' : 'none';
            el.setStyle('display', show);
            if(show == 'block') {
                el.removeClass('odd-row').removeClass('even-row');
                last = last == 'even-row' ? 'odd-row' : 'even-row';
                el.addClass(last);
            }
        });
    }
});
window.addEvent('domready', function() {
    new JobsUI();
});

