/*
    1.)     How to "bind" StarSlider.js" to an aspx site:

            function SysOnReadyPageLoad() {
            ...

                // The next FOUR lines are the important one!
                $('#form0').bind('mousemove', resetStarNumber);                                                 
                $('#starWrapper').unbind().bind('mouseout', resetStarNumber);
                usedStarsForCalculation = <%: Model.Data.numberOfStars %>;
	            starSlider(usedStarsForCalculation);    // Init star slider; set n stars full filled

                // ... how it goes typically further:
                ShowFakeTariffLoading();
	            GetResult(); // ... or: CallGetResult(this);
        
                $("#Data_xxx").focus();    // sets to top of frame 
            }

    2.)     ATTENTION:
            In          "function starClick(event) {...}"
            is method   "CallGetResult()"  
            without any parameter(!) called!
*/

function starSlider(event) {
    if (isAjaxFired)
        return;

    var ID = 0;

    if (isNaN(event))
        ID = parseInt(this.id.substr(this.id.length - 1, 1));
    else
        ID = event;

    var star = new Array($("#star0"), $("#star1"), $("#star2"), $("#star3"), $("#star4"), $("#star5"));

    var filledStarHtml = "<img src=\"/Resources/Images/Dialog/BigFilledStar.png\" alt=\"[?]\" width=\"20px;\" height=\"20px;\" />";
    var emptyStarHtml = "<img src=\"/Resources/Images/Dialog/BigEmptyStar.png\"  alt=\"[?]\" width=\"20px;\" height=\"20px;\" />";

    for (var a = 1; a <= ID; a++)
        star[a].html(filledStarHtml);

    for (var a = ID + 1; a < 6; a++)
        star[a].html(emptyStarHtml);

    // Removing all events and binding onmouseover to all stars
    for (var a = 0; a < 6; a++)
        $("#star" + a).unbind().bind("mouseover", starSlider);

    // Removing all events (= onmouseover) and adding onclick event, but only for that star over that the mouse is positionized.
    $("#star" + ID).unbind().bind("click", starClick);

    $("#Data_numberOfStars").val(ID);
    return true;
}

var usedStarsForCalculation = 0;
function starClick(event) {
    if (isAjaxFired)
        return;

    var n = this.id.substr(this.id.length - 1, 1);
    $("#Data_numberOfStars").val(n);

    usedStarsForCalculation = parseInt(n);

    CallGetResult();
    return true;
}

function resetStarNumber(e) {
    if (isAjaxFired)
        return;

    // Reseting the correct number of filled and empty stars only when mouse is outsite the starWrapper div!
    // This avoids flickering while user "slides" over the stars.
    // The "correct number" is the number of stars which was last used for (re-)calculation.
    var starWrapper = $("#starWrapper");
    if (typeof (starWrapper) == 'undefined')
        return true;

    var offset = starWrapper.offset();

    var starMinX = offset.left;
    var starMaxX = starMinX + starWrapper.width();
    var starMinY = offset.top;
    var starMaxY = starMinY + starWrapper.height();

    var IE = document.all ? true : false;
    var msX = 0;
    var msY = 0;
    if (IE) {
        msX = event.clientX + document.body.scrollLeft;
        msY = event.clientY + document.body.scrollTop;
    } else {
        msX = e.pageX;
        msY = e.pageY;
    }

    if (msX < 0)
        msX = 0;
    if (msY < 0)
        msY = 0;

    if ((msX < starMinX)
                    ||
                    (msX > starMaxX)
                    ||
                    (msY < starMinY)
                    ||
                    (msY > starMaxY)
                )
        starSlider(usedStarsForCalculation);

    return true;
}