var links;
var time;
var interval;
var intervalID;
$(document).ready(function() {
    $.ajax({
        type: "GET",
        url: "xml/www.xml",
        dataType: "xml",
        success: function(xml) {
            $(xml).find('article').each(function() {
                links = $(this).find('counter').text();

            });
            buildtable(xml);
            time = 8000;
            interval = 1;
            intervalID = setInterval('changeimage()', time);
            buildlinks();


        }
    });
});
function changeimage() {
    if (interval != links) {
        $("#image" + interval).hide("fast");
        $('#tdimage' + interval).removeClass('RotatingImageActive').addClass('RotatingImageNoActive');
        interval++;
        $("#image" + interval).show("fast");
        $('#tdimage' + interval).removeClass('RotatingImageNoActive').addClass('RotatingImageActive');
        time += 8000;
    }
    else {
        $("#image" + interval).hide("fast");
        $('#tdimage' + interval).removeClass('RotatingImageActive').addClass('RotatingImageNoActive');
        interval = 1;
        $("#image" + interval).show("fast");
        $('#tdimage' + interval).removeClass('RotatingImageNoActive').addClass('RotatingImageActive');
        time = 8000;
    }

}
function changeimage2(count) {
    clearInterval(intervalID);
    for (var i = 0; i <= links; i++) {
        $("#image" + i).hide("fast");
        $('#tdimage' + i).removeClass('RotatingImageActive').addClass('RotatingImageNoActive');
    }
    $("#image" + count).show("fast");
    $('#tdimage' + count).removeClass('RotatingImageNoActive').addClass('RotatingImageActive');
}
function buildlinks() {
    var table = "";
    var count = 1;
    for (var i = links; i > 0; i--) {

        var row = "<table width='16px' border='0' cellpadding='0' cellspacing='0'>";

        row += "<tr><td width='16px' id='tdimage" + i +"' class='RotatingImageNoActive' onclick='changeimage2(" + i + ");'>" + i + "</td></tr>";
        row += '</table>';

        table += row;
        count++;
    }
    $('#tdlinks').html(table);
    $('#tdimage1').removeClass('RotatingImageNoActive').addClass('RotatingImageActive');

}
function buildtable(xml) {
    var table = "";
    var count = 1;
    $(xml).find('article').each(function() {

        var image = "images/" + $(this).find('image').text();
        var url = $(this).find('link').text();
        var row = "<table cellpadding='0' cellspacing='0' class='tablelinks' border='0'>";
        row += "<tr>";
        row += "<td width='759' ><a id='image" + count + "' style='display:none' href='" + url + "'><img border='0' src='" + image + "' width='759' height='352' /></a></td>"

        row += '</tr></table>';

        table += row;
        count++;

    });
    $('#tdimage').html(table);
    $("#image1").show("fast");

}
