if(!window.console)
console = { log: function(msg) {} };

/**
 *
 */
var WordsList = Class.create({

    initialize: function() {

        console.log('WordsList.initialize()');

        this.initialized = false;

        this.options = Object.extend({

            id:                    null,
            container:             null,
            html:                  null,
            itemsClass:            null,
            populated:             false,
            disabled:              false,
            progressIndicator:     null,
            onSelect:              null,
            searchField:           null,
            searchFieldFilterType: 'left',     // 'left', 'substring'
            searchFieldFilterMode: 'scrollto', // 'filter', 'scrollto' ('scrollto' only for type 'left')
            updateSearchField:     true,
            jumpmarksContainer:    null,
            listEmptyMessage:      null

        }, arguments[0] || {});

        this.clicked = null;
        this.listScrollDisabled = false;

        this.jumpTargets        = $H();
        this.eventListenerCache = $H();

        //this.words = words;

        if(!this.options.populated) {
            console.log('NP');
            this.populate(this.options.html);
        } else {
            this.registerClicks();
            this.buildJumpmarks();
        }

        //if(this.options.searchField)
        //new Form.Element.Observer(this.options.searchField, 0.5, this.observeSearchField.bind(this));

        //this.registerKeyEvents();
   },

    populate: function(html) {

        console.log('WordsList.populate()');

        if(this.options.progressIndicator)
        $(this.options.progressIndicator).show();

        console.log('BLOCK');
        $(this.options.container).block();

        console.log('UPDATE');
        this.options.container.update(html);

        this.registerClicks();

        console.log('FILL SEARCHFIELD');
        if(this.options.searchField)
        this.options.searchField.value = '';

        console.log('HIDE SPINNER');
        if(this.options.progressIndicator)
        $(this.options.progressIndicator).hide();

        console.log('UNBLOCK');
        $(this.options.container).unblock();
    },

    registerClicks: function() {

        console.log('wordsList.registerClicks()');

        var elementSelector = '#' + this.options.id + ' option.' + this.options.itemsClass;

        console.log('selector: ' + elementSelector)

        $(this.options.id).observe('change', this.selectItem.bindAsEventListener(this));

        /*
        $$(elementSelector).each(function(element) {
            //alert('Bind click to selectItem()');
            //element.observe('click', this.selectItem.bindAsEventListener(this));
            element.onselect = this.selectItem.bindAsEventListener(this);
        }.bind(this));
        */

    },

    buildJumpmarks: function() {

        if(!this.options.jumpmarksContainer)
        return;

        if(this.options.disabled)
        return;

        console.log('WordsList.buildJumpmarks()');

        $(this.options.jumpmarksContainer).update('');

        var letters = $A(new Array());
        var elementSelector = '#' + this.options.id + ' option.' + this.options.itemsClass;
        $$(elementSelector).each(function(element) {

            var word = element.innerHTML.strip();

            var letter = word.substr(0, 1).toUpperCase();

            if(letters.indexOf(letter) != -1)
            return;

            letters.push(letter);

            console.log('Building jumpmark for letter ' + letter);

            var jumplink = new Element('a', {
                href: 'javascript:void(0)'
            }).update(letter);

            jumplink.observe('click', function() { element.scrollIntoView(); }.bind(this));

            $(this.options.jumpmarksContainer).appendChild(jumplink);
            $(this.options.jumpmarksContainer).appendChild(document.createTextNode(' '));

            console.log('Jumpmark built');
        }.bind(this));
    },

    registerKeyEvents: function() {

        console.log('WordsList.registerKeyEvents()');

        var keyUp = function(event) {

            var selectItem = null;

            switch(event.keyCode) {
                case Event.KEY_DOWN:
                    console.log('DOWN');

                    if(this.clicked) {

                        if(this.clicked == this.wordsList.lastChild) {
                            selectItem = this.wordsList.firstChild;
                        } else {
                            selectItem = this.clicked.nextSibling;
                        }
                    }

                    break;

                case Event.KEY_UP:
                    console.log('UP');

                    if(this.clicked) {

                        if(this.clicked == this.wordsList.firstChild) {
                            selectItem = this.wordsList.lastChild;
                        } else {
                            selectItem = this.clicked.previousSibling;
                        }
                    }

                    break;
            }

            if(selectItem) {

                // TODO

                //selectItem.scrollIntoView();
                //this.selectItem(selectItem);
            }

        }.bindAsEventListener(this);

        console.log('Container');
        $(this.options.container.parentNode).observe('keypress', keyUp);

        if(this.options.searchField)
        $(this.options.searchField).observe('keyup', keyUp);
    },

    observeSearchField: function(element, value) {
        console.log('WordsList.observerSearchField()');

        if(this.options.disabled)
        return;

        value = value.strip();

        if(this.options.searchFieldFilterMode == 'filter') {

            var tmp = $A();
            this.words.each(function(word) {

                if(   (this.options.searchFieldFilterType == 'substring' && word.toLowerCase().include(value.toLowerCase()))
                   || (this.options.searchFieldFilterType == 'left' && word.toLowerCase().startsWith(value.toLowerCase())))
                tmp.push(word);
            }.bind(this));

            console.log('Words filtered:' + tmp.inspect());

            this.options.container.update('');
            this.options.container.appendChild(this.wordsList);

        } else if(this.options.searchFieldFilterMode == 'scrollto') {

            this.words.each(function(word) {
                if(word.toLowerCase().startsWith(value.toLowerCase())) {

                    console.log('Scroll to ID: ' + 'word_'+word.strip());

                    if(!this.listScrollDisabled) {
                        console.log('do scroll');
                        $('word_'+word.strip()).scrollIntoView();
                    }

                    console.log('enable scroll');
                    this.listScrollDisabled = false;

                    throw $break;
                }
            }.bind(this));
        }
    },

    selectItem: function(event) {
        //alert('WordsList.selectiItem()');

        var selectElement = $(this.options.id);
        var item = $(selectElement.options[selectElement.selectedIndex]);

        if(this.clicked)
        this.clicked.removeClassName('clicked');

        item.addClassName('clicked');
        this.clicked = item;

        if(this.options.searchField && this.options.updateSearchField) {
            this.listScrollDisabled = true;
            this.options.searchField.value = this.clicked.innerHTML.strip();
        }

        if(this.options.onSelect)
        this.options.onSelect(item, this.clicked.innerHTML.strip());
    },

    getSelectedValue: function() {

        //console.log('WordsList.getSelectedValue()');

        if(null != this.clicked) {
            //alert('GSV return: ' +  new String(this.clicked.innerHTML).strip());
            return new String(this.clicked.innerHTML).strip();
            //return this.clicked;
        }

        return "";
    },

    enable:  function() {
        this.options.disabled = false;
        //this.updateList(this.words);
    },
    disable: function() { this.options.disabled = true; }

});

/******************************************************************************/
/******************************************************************************/


var listA = null;
var listB = null;


function toggleListB() {
    console.log('toggle list');

    var elements = $A(new Array('headline_b', /*'jumpmarks_b',*/ 'searchfield_b', 'words_b'));

    var show = $('enable_words_b_yes').checked;

    elements.each(function(element) {

        if(show) {
            $(element).show();
        } else {
            $(element).hide();
        }
    });

    if(show) {
        listB.enable();
        $('headline_text_a').innerHTML = '1. Suchbegriff';
    } else {
        listB.disable();
        $('headline_text_a').innerHTML = 'Suchbegriff';
    }
}


/******************************************************************************/
var wordsCache = $H({});

function wordSelected(wordsList, value) {
    console.log('Selected value:' + value);

    $('spinner_b').show();

    if(wordsCache.get(value)) {
        console.log('Words for #{value} from cache'.interpolate({value: value}));

        listB.updateList(wordsCache.get(value));
        return;
    }

    new Ajax.Request(backendUrl + '?action=getwords&select_name=words_select_b&select_id=words_select_b&filter='+value, {
        method: 'post',

        onSuccess: function(t) {

            //console.log('Words for #{value} from server'.interpolate({value: value}));

            //options = $A(eval(t.responseText));
            listB.populate(t.responseText);

            wordsCache.set(value, t.repsonseText);
        }
    });
}

/******************************************************************************/

function blockForm(doBlock) {
    /*
    if(doBlock) {

        if(!bigSpinner) {
            bigSpinner = $(new Image());
            bigSpinner.src    = '/grafik/spinner-big-black.gif';
            bigSpinner.width  = 66;
            bigSpinner.height = 66;
            bigSpinner.setStyle({ position: 'absolute', display: 'none' });
            bigSpinner.alignTo($('contenttable'), { hAlign: 'center', vAlign: 'middle', offsetLeft: -30 });
            document.body.appendChild(bigSpinner);
        }

        $('contenttable').block();
        bigSpinner.show();
    } else {
        bigSpinner.hide();
        $('contenttable').unblock();
    }
    */

}

/******************************************************************************/

var backendUrl = '/expertensuche/sachv_backend/backend.php';
var bigSpinner = null;

Event.observe(window, 'load', function() {

    var fileref = document.createElement('script')
    fileref.setAttribute("type","text/javascript")
    fileref.setAttribute("src", '/js/prototype_extensions.js');
    document.getElementsByTagName("head")[0].appendChild(fileref);

    blockForm(true);

    listA = new WordsList({
        id:                 'words_select_a',
        container:          $('words_container_a'),
        itemsClass:         'words_select_a_option',
        searchField:        $('search_a'),
        progressIndicator:  $('spinner_a'),
        jumpmarksContainer: null,
        onSelect:           wordSelected,
        populated:        true
    });

    listB = new WordsList({
        id:                 'words_select_b',
        container:          $('words_container_b'),
        itemsClass:         'words_select_b_option',
        searchField:        $('search_b'),
        progressIndicator:  $('spinner_b'),
        jumpmarksContainer: null,
        disabled:           true,
        populated:          true,
        //html: '',
        listEmptyMessage:   'Kein passender 2. Suchbegriff gefunden'
    });

    /*$A(new Array(
        'enable_words_b_yes',
        'enable_words_b_no'
    )).each(function(radioButton) {
        $(radioButton).observe('click', toggleListB);
    });*/

    Event.observe('sachv_suche', 'submit', function(event) {

        event.stop();

        //var useSecondWord = $('enable_words_b_yes').checked;
        var useSecondWord = (listB.getSelectedValue().strip() != '');

        // verstecktes Formular bauen & abschicken
        // (ist bequemer, als vorhandenes umzubiegen:-))
        var form = new Element('form');
        form.action = $('sachv_suche').action;
        form.method = 'post';

        var action = new Element('input');
        action.name  = 'action';
        action.value = 'search';
        action.type  = 'hidden';
        form.appendChild(action);

        var step = new Element('input');
        step.name  = 'step';
        step.value = 2;
        step.type  = 'hidden';
        form.appendChild(step);

        var enableWordsB = new Element('input');
        enableWordsB.name  = 'enable_words_b';
        enableWordsB.value = (useSecondWord) ? '1' : '0';
        enableWordsB.type  = 'hidden';
        form.appendChild(enableWordsB);

        var wordA = new Element('input');
        wordA.name  = (useSecondWord) ? 'word_a' : 'words_select_a';
        wordA.value = listA.getSelectedValue();
        wordA.type  = 'hidden';
        form.appendChild(wordA);

        var wordB = new Element('input');
        wordB.name  = 'words_select_b';
        wordB.value = listB.getSelectedValue();
        wordB.type  = 'hidden';
        form.appendChild(wordB);

        //alert('word a: ' + $H(wordA).inspect() + "\n" +
        //    'word b: ' + wordB);

        document.body.appendChild(form);
        form.submit();

        return false;
    });

    blockForm(false);
});