var searchFieldId = 'searchinput'; // Id des Input-Element der Standard-Suche
var detailUrl = '/detail.htm?$product=myid'; // URL zur Detailansicht. myid wird dynamisch ersetzt durch die ausgewählte ID
var align = "right"; // left|right - Ausrichtung der Box am Input-Element
var x_offset = 0; // Abstand zum Input-Field
var y_offset = 2; // Abstand zum Input-Field
var transparant = false; // wenn suchbox halb-transparent, dann in dynSearch.css in #ds_body die Hintergrundfarbe heraus nehmen
//falls schon in Seite includiert dann hier auskommentieren!
document.write('<link rel="stylesheet" type="text/css" href="/scripts/dynSearch.css" />');
document.write('<script type="text/javascript" src="/_shared/prototype.js"></script>');
document.write('<script type="text/javascript" src="/_shared/ajax.js?1"></script>');
document.write('<script type="text/javascript" src="/_shared/common.js"></script>');

// *************** Ab hier den Code unverändert belassen ***************************************

var inputfield;
var boxDiv;
var variableItemId;
var counter = -1;
var oldquery;
var length = 0;


//init

function initDynSearch(viid) {
    variableItemId = viid;
    inputfield = $(searchFieldId);
    inputfield.onkeyup = searchHandler;
    inputfield.setAttribute('autocomplete', 'off', 0);
    //inputfield.form.onsubmit = submitformHandler;
    boxDiv = document.createElement("div");
    boxDiv.id = "boxDiv";
    boxDiv.style.display = "none";
    boxDiv.style.position = "absolute";
    if (transparant)
        boxDiv.style.backgroundImage = "url(/scripts/pix/dynSearchBackround.png)"
    document.getElementsByTagName("body")[0].appendChild(boxDiv);
    document.getElementsByTagName("body")[0].onclick = hideBox;
}


//possitioniert die Box

function setPossition() {
    poss = Position.cumulativeOffset(inputfield);
    dims = Element.getDimensions(inputfield);
    boxdims = Element.getDimensions(boxDiv);
    if (align == "left") {
        boxDiv.style.left = (poss[0] + x_offset) + "px";
    }
    else {
        boxDiv.style.left = (poss[0] + dims.width - boxdims.width + x_offset) + "px";
    }
    boxDiv.style.top = (poss[1] + dims.height + y_offset) + "px";
}

// Cross-Browser keyCode-Ermittlung

function getTaste(evt) {
    if (!evt)
        evt = window.event;
    if (evt.which) {
        Tastencode = evt.which;
    }
    else
        if (evt.keyCode) {
            Tastencode = evt.keyCode;
        }
    return Tastencode;
}

function hideBox() {
    Element.hide('boxDiv');
}

//wenn das Formular submittet wird!

function submitformHandler(evt) {
    if (counter > -1) {
        return false;
    }
}

//wird nach jeder Taste aufgerufen
function searchHandler(evt) {
    if (!evt)
        evt = window.event;
    query = $F(searchFieldId);
    if (query.length == 0)
        Element.hide('boxDiv');
    var keyCode = getTaste(evt);
    if (keyCode == 38) { //hoch
        counter--;
        if (counter < -1) {
            counter = -1;
        }
        activate("result_" + counter);
    } else if (keyCode == 40) { //runter
        counter++;
        if (counter >= length) {
            counter = length - 1;
        }
        activate("result_" + counter);
    } else if (keyCode == 13) { //Return
        if (counter > -1) {
            goTo("result_" + counter);
        } else {
        }
    } else {
        counter = -1;
        if (oldquery != query) {
            oldquery = query;
            sendXmlHttp('$' + variableItemId + '.ajaxContent', 'chgdiv:boxDiv', 'q=' + query);
        }
    }
}

//wird vom ajax-framework aufgerufen, nach Aktualisierung der Box

function afterupdate_boxDiv() {
    if (boxDiv.innerHTML == "_no_session") {
        document.location.reload();
        return;
    }
    length = 0;
    for (i = 0; i < 30; i++) {
        lineDiv = $('result_' + i);
        if (lineDiv) {
            Element.classNames('result_' + i).set("ds_item");
            lineDiv.onmouseover = mover;
            lineDiv.onclick = click;
            length++;
        }
        else {
            break;
        }
    }
    setPossition();
    Element.show('boxDiv');
}

//Klick auf ein Ergebnis
function click(evt) {
    if (!evt)
        evt = window.event;
    goTo(getLineId(evt));
}

//Sprung zum Ergebnis
function goTo(lineid) {
    stopAllAjaxActivities = true;
    window.location = detailUrl.replace(/myid/, $(lineid).getAttribute('itemid'));
    //window.location = detailUrl.replace(/myid/, $(lineid).getAttribute('itemid'));
}

//mouseover
function mover(evt) {
    if (!evt)
        evt = window.event;
    lineid = getLineId(evt);
    activate(lineid);
    counter = 0 + lineid.substr(7);
}

//welches item hat den Event ausgelöst?
function getLineId(evt) {
    if (!evt)
        evt = window.event;
    node = Event.element(evt);
    while (!node.getAttribute('itemid'))
        node = node.parentNode;
    return node.id;
}

//item markieren

function activate(lineid) {
    for (i = 0; i < length; i++) {
        if ($('result_' + i)) {
            Element.classNames('result_' + i).set("ds_item");
        }
        else {
            break;
        }
    }
    if (lineid == "result_-1")
        return;
    Element.classNames(lineid).set("ds_item_active");
}

//normales Suchergebnis anzeigen.

function bigResult() {
    inputfield.form.submit();
}