/*
    SiteComponents version:
    6.8.0.1, tag SC_6_8_0_1, created Fri Aug 20 11:18:33 +0200 2010

    Disclaimer
    
    While we make every effort to ensure that this code is fit for its intended
    purpose, we make no guarantees as to its functionality. CoreTrek AS will
    accept no responsibility for the loss of data or any other damage or
    financial loss caused by use of this code.


    Copyright
    
    This programming code is copyright of CoreTrek AS. Permission to run this
    code is given to approved users of CoreTrek's publishing system CorePublish.
    
    This source code may not be copied, modified or otherwise repurposed for use
    by a third party without the written permission of CoreTrek AS.
    
    Contact webmaster@coretrek.com for information.
    
*/

/*jslint laxbreak: true, sub: true, white: false, browser: true,
onevar: false, nomen: false, noindent: true, eqeqeq: false, plusplus: false,
forin: true */
/*global siteComponentsConfig: false, getSiteComponentsConfig: false,
Ajax: false, $$: false, $: false, Element: false, window: false, Class: false,
Effect: false, lightbox: false, PeriodicalExecuter: false, Event: false,
CtCookie: false, cpKeywords: false, CtTooltip: false, Prototype: false,
cpWriteMediaObject: false, getThemeName: false, Hash: false, $H */

/*

    ============================================================================
    IMPORTANT! This javascript is dependent on Prototype. If Scriptaculous is
               available the tooltip will use some nice effects.
    ============================================================================

    Enhancement to the SiteComponents searchinput tile
    
*/

var SearchInputTile = Class.create({
    
    initialize: function(element) {
        this.element = $(element);
        
        this.element.select('div.searchfield').first().insert({after: '<div class="pane_headers"></div><div class="panes"></div>'});
        this.paneHeaders = this.element.select('div.pane_headers').first();
        this.paneContents = this.element.select('div.panes').first();
        
        this.paneMap = $H();
        
        this.element.select('div.pane').each(function(element) {
            this.addPane(element);
        }.bind(this));
        
        // The panes are set to display:none in markup to prevent them from
        // flickering before being fully initialized. We need to show them
        // now that the panes are added in their proper position
        this.paneHeaders.show();
        this.paneContents.show();
        
        this.handleErrorsFromSearchResult();
    },
    
    /**
     * Adds an search options pane for the given .pane element
     * 
     */
    addPane: function(element) {
        var paneHeader = element.select('h4').first();
        var paneContent = element.select('div').first();
        
        // Add the original pane class names to the pane content
        paneHeader.addClassName(element.classNames());
        paneContent.addClassName(element.classNames());
        
        this.paneMap.set(paneHeader.identify(), paneContent.identify());
        
        this.paneHeaders.insert({ bottom: paneHeader });
        this.paneContents.insert({ bottom: paneContent });
        
        paneHeader.observe('click', function(event) {
            this.showPane(event);
        }.bindAsEventListener(this));
        
        // The summary pane should be visible by default
        if(element.hasClassName('summarycriteria')) {
            paneHeader.addClassName('active');
        } else {
            paneContent.hide();
        }
    },
    
    showPane: function(event) {
        this.hideAllPanes();
        var header = event.element('h4');
        var pane = $(this.paneMap.get(header.identify()));
        header.addClassName('active');
        pane.show();
    },
    
    hideAllPanes: function() {
        this.paneMap.each(function(pair) {
            $(pair.key).removeClassName('active');
            $(pair.value).hide();
        });
    },
    
    /**
     * If there is no search result, or the search query is invalid, this
     * will be outputted by the search result tile inside one or more
     * .searchresult-message divs. If any of this is present, we put the
     * messages inside the search summary.
     */
    handleErrorsFromSearchResult: function() {
        var messages = $$('div.searchresult-message');
        
        if(messages.length > 0) {
            var searchStringSummary = $$('div.panes div.summarycriteria').first();
            
            messages.each(function(el) {
                if(el.hasClassName('error')) {
                    searchStringSummary.insert({ bottom: el });
                } else {
                    searchStringSummary.up().insert({ bottom: el });
                }
            });
        }
    },
    
    // LISTENERS
    
    selectAllCategoryCriteria: function(event) {
        var first = true;
        event.findElement('select').childElements().each(function(element) {
            if(first) {
                first = false;
                return;
            }
            element.selected = false;
        });
    }
    
});