$(function() {
    // fce pro nacteni dat
    function ajax(type, position, color) {
        $.getJSON(base_path + 'configurator_scripts.php', 
        {
            type: type,
            position: position,
            color: color,
            path: base_path
        },
        function(data) { 
            $('span.type_text').html(data.type_name);
            $('span.position_text').html(data.position_name);
            $('span.color_text').html(data.color_name);
            $('#text').html('Typ : ' + data.type_name + "\n");
            $('#text').append('Ansicht : ' + data.position_name + "\n");
            $('#text').append('Farbe :' + data.color_name + "\n");
            
            
            // nacteme obrazek
            $.ajax({
                type: 'POST',
                url: base_path + 'configurator_loadpict.php',
                data: 'type=' + type + '&position=' + position + '&color=' + color + '&path=' + base_path,
                success: function(data) {
                    $('#view_result').html(data);
                }
            });
        });
    }
    
    // nacteme defaultni obrazek
    var type = $('div.cars_out span.select').attr('id');
    var position = $('div.position_out span.select').attr('id');
    var position_name = $('div.position_out span.select').attr('title');
    var color = $('div.color_out span.select').attr('id');

    ajax(type, position, color);
        
        
    // po kliknuti na moznost
    $('div.configurator span').click( function() { 

        var trida = $(this).attr("class");
        
        if( trida == "cars" ) {
            $('div.cars_out span.cars').removeClass("select");
            $(this).addClass("select");
        }
        
        if( trida == "position" ) {
            $('div.position_out span.position').removeClass("select");
            $(this).addClass("select");
        }
        
        if( trida == "color" ) {
            $('div.color_out span.color').removeClass("select");
            $(this).addClass("select");                
        }
        
        var type = $('div.cars_out span.select').attr('id');
        var position = $('div.position_out span.select').attr('id');
        var position_name = $('div.position_out span.select').attr('title');
        var color = $('div.color_out span.select').attr('id');
        
        ajax(type, position, color);
        
        return false;
    });
    
    // title designer
    $("div.configurator span").append("<em></em>");
     
     $("div.configurator span").hover(function() {
        var p = $(this);
         var position = p.position(); // pozice objektu
         var widthObj = $(this).width()/2; // vypocteme polovinu sirky objektu

         $(this).find("em").animate({opacity: "show", top: position.top-28, left: position.left+widthObj-15}, 1); // zobrazime cca v polovine v objektu
         var hoverText = $(this).attr("title"); 
         
         if(hoverText != "") {
            $(this).find("em").text(hoverText);
            $(this).attr("title", "");
         }
     }, function() {
          $(this).find("em").animate({opacity: "hide"}, 1);
          var hoverText = $(this).find("em").text();
          $(this).attr("title", hoverText);    
     });
     
     if($.browser.msie && $.browser.version == 6) {
         $("span").hover( function() {
             $(this).addClass("select");
         }, function() {
             $(this).removeClass("select");
         });
     }
});