$(document).ready(function() {
    if (jQuery.browser.msie) {
        $("#vml_ie").append("<style>v\:image { behavior:url(#default#VML); display:inline-block ; -ms-interpolation-mode: bicubic}</style>\n");
        $("#vml_ie").append("<xml:namespace ns=\"urn:schemas-microsoft-com:vml\" prefix=\"v\" />");
    }
    $('#featured_home li').find("a.slider_img").preload();
    /*
      
      
        
    <!-- Include the VML behavior -->
    <style>v\:image { behavior:url(#default#VML); display:inline-block ; -ms-interpolation-mode: bicubic}</style>
    <!-- Declare the VML namespace -->
    <xml:namespace ns="urn:schemas-microsoft-com:vml" prefix="v" />
    */
    /////////////////////////////
    // SLIDER
    /////////////////////////////
    // PARAMETERS:
    var $rotate_plus_sign_about = 180;    // degrees
    var $rotate_minus_sign_about = -180;  // degrees
    var $width_of_the_image = 100;        // width of ONE image in pixels, including the margin !!
    var $speed_of_moving = 0;             // in miliseconds, speed which are the images moving

    // SLIDER MAX is the minus sign
    // SLIDER MIN is the plus sign

    /////////////////////////////
    //INTERNAL PARAMS, PLEASE DONT CHANGE
    /////////////////////////////
    var $rotmaxangle = 180;
    var $rotminangle = -180;
    var $es = $("#thumbs").find("li").size();   // el = Elements in Slider
    var $es_width = $width_of_the_image;

    $("#sl_content").css("width", $es_width * $es);
    var $kook = 0;
    var $step = 0;
    var $actual_step = 0;
    var $max_step = $es - 9;
    if (!($.browser.msie && $.browser.version == "6.0")) {
        // $('#round_max').css("border", "1px solid black");
        $('#round_max').css("width", 26);
        $('#round_max').css("height", 26);
        $('#round_min').css("width", 26);
        $('#round_min').css("height", 26);
    }
    else {
        $('#round_max').css("margin", "34px 10px 33px 10px;");
        $('#round_min').css("margin", "34px 10px 33px 10px;");

        $('#sign_min').css("positon", "absolute");
        $('#sign_min').css("top", 40);
        $('#sign_min').css("left", 16);

        $('#sign_max').css("positon", "absolute");
        $('#sign_max').css("top", 40);
        $('#sign_max').css("left", 16);
        // $('#slider_max').("width", 26);	
    }

    if (!($.browser.msie && $.browser.version == "6.0")) {
        // we make objects from slider SIGNS
        var rot = $('#sign_min').rotate(0);
        var rota = $('#sign_max').rotate(0);
    }
    if ($.browser.msie && $.browser.version != "6.0")   // position of the signs in IE (dear got i was making that about 3 hours)
    {
        rot[0].css("position", "absolute");
        rot[0].css("top", 38);
        rot[0].css("left", 13);
        rota[0].css("position", "absolute");
        rota[0].css("top", 38);
        rota[0].css("left", 13);
    }
    else if (!($.browser.msie && $.browser.version == "6.0"))                // position of the signs in normal working internet browser (mozilla, opera, etc)
    {
        rot[0].css("position", "absolute");
        rot[0].css("top", 38);
        rot[0].css("left", 13);
        rota[0].css("position", "absolute");
        rota[0].css("top", 37);
        rota[0].css("left", 12);
    }

    // SLIDER MAX is the minus sign
    // SLIDER MIN is the plus sign
    $('#slider_max').hover(     // HERE WE SCALE THE CIRCLE WHEN THE MOUSE IS IN THE ELEMENT
      function() {
          if (!($.browser.msie && $.browser.version == "6.0")) {
              $('#round_max').animate({
                  width: 30,
                  height: 30,
                  marginLeft: 10,
                  marginTop: 35
              }, 50);
          }
      },
      function() {
          if (!($.browser.msie && $.browser.version == "6.0")) {
              $('#round_max').animate({
                  width: 26,
                  height: 26,
                  marginLeft: 12,
                  marginTop: 37
              }, 50);
          }
      });

    $('#slider_min').hover(   // HERE WE SCALE THE CIRCLE WHEN THE MOUSE IS IN THE ELEMENT
      function() {
          if (!($.browser.msie && $.browser.version == "6.0")) {
              $('#round_min').animate({
                  width: 30,
                  height: 30,
                  marginLeft: 10,
                  marginTop: 35
              }, 50);
          }
      },
      function() {
          if (!($.browser.msie && $.browser.version == "6.0")) {
              $('#round_min').animate({
                  width: 26,
                  height: 26,
                  marginLeft: 12,
                  marginTop: 37
              }, 50);
          }
      });

    // SLIDER MAX is the minus sign
    // SLIDER MIN is the plus sign

    // HERE IS THE ROTATING OF MINUS SIGN AND SLIDING
    $('#slider_max').click(function() {
        $('#slider').onselectstart = function() { return false; }
        $('#sign_max').stop();
        // IE fix
        if (!($.browser.msie && $.browser.version == "6.0")) {
            if ($rotminangle % 360 == 0 && $.browser.msie) {
                rota[0].animate({
                    top: 38,
                    left: 13
                }, 0);
            }
            else if ($.browser.msie) {
                rota[0].animate({
                    top: 37,
                    left: 12
                }, 0);
            }

            // main rotation
            rota[0].rotateAnimation($rotminangle);
            $rotminangle = $rotminangle - 180;
        }

        if ($actual_step <= 0)   // if is the slider on the end, we make a bounce effect
        {
            $("#sl_content").stop(false, false);
            $("#sl_content").animate({ marginLeft: +20 }, 300);
            $("#sl_content").animate({ marginLeft: 0 }, 80);
        }
        else  // when the slider can move, we move it
        {
            $step = $es_width;
            $kook = $kook + $step;
            $("#sl_content").stop(false, false);
            $("#sl_content").animate({ marginLeft: $kook }, 400);
            $actual_step--;
        }
    });




    // SLIDER MAX is the minus sign
    // SLIDER MIN is the plus sign 
    $('#slider_min').click(function() {
        $('#sign_min').stop();
        // IE fix
        if (!($.browser.msie && $.browser.version == "6.0")) {
            if ($rotmaxangle % 360 == 0 && $.browser.msie) {
                rot[0].animate({
                    top: 38,
                    left: 14
                }, 0);
            }
            else if ($.browser.msie) {
                rot[0].animate({
                    top: 37,
                    left: 13
                }, 0);
            }
            rot[0].rotateAnimation($rotmaxangle);
            $rotmaxangle = $rotmaxangle + 180;
        }
        if ($actual_step >= $max_step) // if we cant move, do the bounce effect
        {
            $("#sl_content").stop(false, false);
            var $bounce = (($es * $es_width) - (9 * $es_width)) * (-1);
            $("#sl_content").animate({ marginLeft: $bounce - 20 }, 300);
            $("#sl_content").animate({ marginLeft: $bounce }, 80);
        }
        else    // else move the slider
        {
            $step = $es_width;
            $kook = $kook - $step;
            $("#sl_content").stop(false, false);
            $("#sl_content").animate({ marginLeft: $kook }, 300);
            $actual_step++;
        }
    });

    // CHANGING THE IMAGES     
//    $('#featured_home li').click(function() {
//        $("#slider_main_img").fadeTo(150, 0);   //  fade the MAIN IMAGE to WHITE. And when is the main image white, we call the callback function 
//        $(this).fadeTo(150, 0.5, function()    // fade all slider images to non transparent
//        {// callback function
//            // GETTING THE Attributes from slider
//            $("#slider_post_cat").html($(this).find("div.slider_tit").html());
//            // $("#slider_img_tit").attr("href", $(this).find("a.slider_tit").attr("href"));

//            $("#slider_img_desc").html($(this).find("a.slider_desc").html());
//            $("#slider_img_desc").attr("href", $(this).find("a.slider_desc").attr("href"));

//            // FLIPPING THE IMAGE
//            $("#slider_main_img").attr("src", $(this).find("a.slider_img").attr("href"));
//            $("#slider_main_img").fadeTo(150, 1); // FADING MAIN IMAGE TO NORMAL
//        });



//        $('#featured_home li').fadeTo(5, 1);      // FADE ALL SLIDER IMAGES TO NORMAL
//        $(this).fadeTo(150, 1);

//    });

});