var countryBeingSeen = 0;
var workmanshipBeingSeen = 0;

function showWorkmanShips(idCountry, isDone) {

    $("#infoListWorkmanShip").css('background-image', 'url(../Content/Images/ajax-loader.gif)');
    $("#infoListWorkmanShip").html("");

    countryBeingSeen = idCountry;

    $('#infoListCountry div').css('color', '#000000');
    $('#country_' + idCountry).css('color', '#ffffff'); 

    $.getJSON("/Obras/GetWorkmanships", { idCountry: idCountry, isDone: isDone }, function(json) {

        var first = true;
        var htmlFinal = "";
  
        $.each(json, function(i) {
            if (first) {
                first = false;
                htmlFinal += "<div class='infoListElementWorkmanShip' id='workmanship_" + this.idWorkmanship + "' style='color:black;' onmouseover='overElement(" + this.idWorkmanship + ", true, \"#workmanship_\");' onmouseout='overElement(" + this.idWorkmanship + ", false, \"#workmanship_\");' onclick='showWorkmanShipImages(" + this.idWorkmanship + ");' >" + this.titleWorkmanship + "</div>";
                workmanshipBeingSeen = this.idWorkmanship;
            }
            else
                htmlFinal += "<div class='infoListElementWorkmanShip' id='workmanship_" + this.idWorkmanship + "' onmouseover='overElement(" + this.idWorkmanship + ", true, \"#workmanship_\");' onmouseout='overElement(" + this.idWorkmanship + ", false, \"#workmanship_\");'  onclick='showWorkmanShipImages(" + this.idWorkmanship + ");' >" + this.titleWorkmanship + "</div>";
        });

        showWorkmanShipImages(workmanshipBeingSeen);
        
        $("#infoListWorkmanShip").css('background-image', 'url()');
        $("#infoListWorkmanShip").html(htmlFinal);
        
    });

}

function showWorkmanShipImages(idWorkmanship) {

    //alert(workmanshipBeingSeen + ", " + idWorkmanship);

    $("#infoListWorkmanShipImage").css('background-image', 'url(../Content/Images/ajax-loader.gif)');
    $("#infoListWorkmanShipImage").html("");
    
    workmanshipBeingSeen = idWorkmanship;

    $('#infoListWorkmanShip div').css('color', '#000000');
    $('#workmanship_' + idWorkmanship).css('color', '#ffffff');
    
    $.getJSON("/Obras/GetWorkmanshipImages", { idWorkmanship: idWorkmanship }, function(json) {

        
        var x = 0, y = 0;
        var htmlFinal = "";
    

        $.each(json, function(i) {
            htmlFinal += "<div class='infoListElementWorkmanShipImage' style='left:" + (74 * x) + "px;top:" + (74 * y) + "px;'>";
            htmlFinal += "<a class='lightbox' href='http://admin.globalgeo.com/uploads/" + this.pathImage + "' title='" + this.descriptionImage + "' ><img src='http://admin.globalgeo.com/uploads/" + this.thumbImage + "' alt='' /></a>";
            htmlFinal += "</div>";
            
            x++;

            if (x == 4) {
                x = 0;
                y++;
            }

        });

        $("#infoListWorkmanShipImage").css('background-image', 'url()');
        $("#infoListWorkmanShipImage").html(htmlFinal);

        $('a.lightbox').lightBox();
        jQuery('ul.sf-menu').superfish();
    });

}

function overElement(element, inside, type) {

    var toBeCompared = 0;

    switch (type) {
        case '#country_': toBeCompared = countryBeingSeen; break;
        case '#workmanship_': toBeCompared = workmanshipBeingSeen; break;
        default: break;
    }

    if (toBeCompared != element) {
        if (!inside)
            $(type + element).css('color', '#000000');
        else
            $(type + element).css('color', '$ffffff');
    }
}