var MClist = {
    init: function(options) {
        this.makeHeader = options.makeTitle || "Fabrikat";
        this.modelHeader = options.modelTitle || "Model";
        this.colorHeader = options.colorTitle || "Farve";
        this.yearHeader = options.yearTitle || "År";
        this.distanceHeader = options.distanceTitle || "KM";
        this.priceHeader = options.priceTitle || "Pris";
        this.imageHeader = options.imageTitle || "";
        this.container = options.container || "mctools";
        this.detailsContainer = options.detailsContainer || "mctools-details";
        this.renderListAs = options.renderListAs || "table";
        this.useShadowbox = options.useShadowbox || false;
        this.api = options.apiKey || "201003155555555"; //Defaults to test API key.
        this.imageServerHost = "http://webpictures-dk01.infotools.dk";
        this.imagesPath = "/Pictures";
        this.imagesPath060 = "/Pictures060/";
        this.imagesPath075 = "/Pictures075/";
        this.imagesPath095 = "/Pictures095/";
        this.imagesPath150 = "/Pictures150/";
        this.imagesPath250 = "/Pictures250/";
        this.imagesPath300 = "/Pictures300/";
        this.imagesPath350 = "/Pictures350/";
        this.imagesPath500 = "/Pictures500/";
        this.imagesPath600 = "/Pictures600/";
        this.detailsHeight = 370;
        this.detailsWidth = 700;
        this.noImage600 = "http://api.mclist.dk/images/nophoto600x400.jpg";
        this.noImage500 = "http://api.mclist.dk/images/nophoto500x333.jpg";
        this.noImage350 = "http://api.mclist.dk/images/nophoto350x233.jpg";
        this.noImage300 = "http://api.mclist.dk/images/nophoto300x200.jpg";
        this.noImage250 = "http://api.mclist.dk/images/nophoto250x167.jpg";
        this.noImage150 = "http://api.mclist.dk/images/nophoto150x100.jpg";
        this.noImage95 = "http://api.mclist.dk/images/nophoto95x63.jpg";
        this.noImage75 = "http://api.mclist.dk/images/nophoto75x50.jpg";
        this.noImage60 = "http://api.mclist.dk/images/nophoto60x40.jpg";
        this.thumbsInListLeft = options.thumbsInListLeft;
        this.thumbsInListRight = options.thumbsInListRight;
    }
}

MClist.listATVScooterMopeds = function() {
    var script = document.createElement('script');
    script.src = 'http://api.mclist.dk/json/' + MClist.api + '/atvscootermopeds?method=MClist.listVehiclesCallback';
    document.body.appendChild(script);
    return false;
}

MClist.listMotorcycles = function() {
    var script = document.createElement('script');
    script.src = 'http://api.mclist.dk/json/' + MClist.api + '/motorcycles?method=MClist.listVehiclesCallback';
    document.body.appendChild(script);
    return false;
}

MClist.listVehiclesCallback = function(result) {
    var container = document.getElementById(MClist.container);
    var html = "";
    if (MClist.renderListAs == "list") {
        html += "<ul>";
        for (var i = 0; i < result.Data.length; i++) {
            var item = result.Data[i];
            var name = item.MakeName;
            if ((item.ModelName != null) && (item.ModelName != "null"))
                name += ' ' + item.ModelName;
            if (MClist.useShadowbox) {
                html += '<li><a href="#' + item.ID + '" onclick="return MClist.detailsVehicleS(' + item.ID + ');">' + name + '</a></li>'
            }
            else {
                html += '<li><a href="#' + item.ID + '" onclick="return MClist.detailsVehicle(' + item.ID + ');">' + name + '</a></li>'
            }
        }
        html += '</ul>'
    }
    else {
        html += '<table id="mctools-list"><tr class="mctools-row-header">';
        if (MClist.thumbsInListLeft)
            html += '<th class="mctools-col-header image">' + MClist.imageHeader + '</th>';

        html += '<th class="mctools-col-header first">' + MClist.makeHeader + '</th>';
        html += '<th class="mctools-col-header second">' + MClist.modelHeader + '</th>';
        html += '<th class="mctools-col-header third">' + MClist.colorHeader + '</th>';
        html += '<th class="mctools-col-header fourth">' + MClist.yearHeader + '</th>';
        html += '<th class="mctools-col-header fifth">' + MClist.distanceHeader + '</th>';
        html += '<th class="mctools-col-header last">' + MClist.priceHeader + '</th>';

        if (MClist.thumbsInListRight)
            html += '<th class="mctools-col-header image">' + MClist.imageHeader + '</th>';
        html += '</tr>';

        for (var i = 0; i < result.Data.length; i++) {
            var item = result.Data[i];
            var rowClass = "even";
            if (i % 2)
                rowClass = "odd";

            var color = item.Color;
            if (color == null)
                color = '-';

            var price = item.FormattedRetailPrice;
            if (price == '0,00')
                price = '-';
            html += '<tr id="mctools-row-' + i + '" class="mctools-row ' + rowClass + '">'

            if (MClist.thumbsInListLeft) {
                html += '<th class="mctools-col image">';
                if (item.Images.length > 0)
                    html += '<img src="' + MClist.imageServerHost + MClist.imagesPath075 + item.Images[0] + '" width="75" height="50">';
                else
                    html += '<img src="' + MClist.noImage75 + '" widht="75" />';
                html += '</th>';
            }
            html += '<td class="mctools-col first">' + item.MakeName + '</td>';
            html += '<td class="mctools-col second"><a href="#' + item.ID + '" onclick="';
            if (MClist.useShadowbox)
                html += 'MClist.detailsVehicleS';
            else
                html += 'MClist.detailsVehicle';
            html += '(' + item.ID + ');return false;">' + item.ModelName + '</a></td>';
            html += '<td class="mctools-col third">' + color + '</td>';
            html += '<td class="mctools-col fourth">' + item.ModelYear + '</td>';
            html += '<td class="mctools-col fifth">' + item.Distance + '</td>';
            html += '<td class="mctools-col last">' + price + '</td>';
            if (MClist.thumbsInListRight) {
                html += '<th class="mctools-col image">';
                if (item.Images.length > 0)
                    html += '<img src="' + MClist.imageServerHost + MClist.imagesPath075 + item.Images[0] + '" width="75" height="50">';
                else
                    html += '<img src="' + MClist.noImage75 + '" width="75" />';
                html += '</th>';
            }
            html += '</tr>';
        }
        html += '</table>';
    }
    container.innerHTML = html;
}


MClist.detailsVehicle = function(id) {
    var script = document.createElement('script');
    script.src = 'http://api.mclist.dk/json/' + MClist.api + '/motorcycles/' + id + '?method=MClist.detailsVehicleCallback';
    document.body.appendChild(script);
    return false;
}

MClist.detailsVehicleCallback = function(result) {
    var container = document.getElementById(MClist.detailsContainer);
    var html = '<div id="mctools-details">'
    html += '<h1>' + result.Data.MakeName;

    if ((result.Data.ModelName != null) && (result.Data.ModelName != "null"))
        html += ' ' + result.Data.ModelName;
    html += '</h1><table><tr><td>';

    if (result.Data.Images.length > 0) {
        var imagePath = MClist.imageServerHost + MClist.imagesPath350 + result.Data.Images[0];
        html += '<div id="mctools-large-container"><img id="mctools-imglarge" alt="' + result.Data.MakeName + ' ' + result.Data.ModelName + '" src="' + MClist.imageServerHost + MClist.imagesPath350 + result.Data.Images[0] + '" width="350" /></div>';
        html += '<div id="mctools-thumbs">';
        for (var i = 0; i < result.Data.Images.length; i++) {
            var item = result.Data.Images[i];
            html += '<div class="mctools-thumb">';
            html += '<img src="' + MClist.imageServerHost + MClist.imagesPath075 + item + '" width="75" height="50" onmouseover="MClist.showLargeImage(\'350/' + item + '\');" />';
            html += '</div>';
        }
        html += '</div>';
    }
    else {
        html += '<div id="mctools-large-container"><img id="mctools-imglarge" src="' + MClist.noImage350 + '" /></div>';
    }

    html += '</td><td><table>';
    html += '<tr><td class="mctools-details-description">Pris</td><td id="mctools-details-retailprice">' + result.Data.PriceCurrency + ' ' + result.Data.FormattedRetailPrice + '</td></tr>';
    html += '<tr><td class="mctools-details-description">' + result.Data.DistanceUnit + '</td><td>' + result.Data.Distance + '</td></tr>';
    html += '<tr><td class="mctools-details-description">Model &Aring;r</td><td>';
    if (result.Data.ModelYear == "null")
        html += "-";
    else
        html += result.Data.ModelYear;
    html += '</td></tr>';
    html += '<tr><td class="mctools-details-description">Farve</td><td>';
    if ((result.Data.Color == null) || (result.Data.Color == "null")) {
        html += "-";
    }
    else {
        html += result.Data.Color;
    }
    html += '</td></tr>';
    html += '<tr><td class="mctools-details-description">Udstyr</td><td>';
    if ((result.Data.DescriptiveEquipmentText == null) || (result.Data.DescriptiveEquipmentText == "null"))
        html += "-";
    else
        html += result.Data.DescriptiveEquipmentText;
    html += '</td></tr>';

    html += '</table></td>';

    html += '</tr></table>';
    html += '</div>';
    container.innerHTML = html;
}

MClist.detailsVehicleS = function(id) {
    var script = document.createElement('script');
    script.src = 'http://api.mclist.dk/json/' + MClist.api + '/motorcycles/' + id + '?method=MClist.detailsVehicleSCallback';
    document.body.appendChild(script);
    return false;
}


MClist.detailsVehicleSCallback = function(result) {
    var html = '<div id="mctools-details">';

    html += '<div id="mctools-image-container">';
    if (result.Data.Images.length > 0) {
        html += '<div id="mctools-large-container"><img id="mctools-imglarge" src="' + MClist.imageServerHost + MClist.imagesPath500 + result.Data.Images[0] + '" /></div>';
        html += '<div id="mctools-thumbs">';
        for (var i = 0; i < result.Data.Images.length; i++) {
            var item = result.Data.Images[i];
            html += '<div class="mctools-thumb">';
            html += '<img src="' + MClist.imageServerHost + MClist.imagesPath075 + item + '" width="75" height="50" onmouseover="MClist.showLargeImage(\'500/' + item + '\');" />';
            html += '</div>';
        }
        html += '</div>';
    }
    else
        html += '<div id="mctools-large-container"><img id="mctools-imglarge" src="' + MClist.noImage500 + '" /></div>';

    var price = result.Data.FormattedRetailPrice;
    if (price == '0,00')
        price = '-';

    html += '</div><div id="mctools-details-container"><table id="mctools-details-table">';
    html += '<tr><td class="mctools-details-description">Pris</td><td id="mctools-details-retailprice">' + result.Data.PriceCurrency + ' ' + price + '</td></tr>';
    html += '<tr><td class="mctools-details-description">' + result.Data.DistanceUnit + '</td><td>' + result.Data.Distance + '</td></tr>';
    html += '<tr><td class="mctools-details-description">Model &Aring;r</td><td>';
    if (result.Data.ModelYear == "null")
        html += "-";
    else
        html += result.Data.ModelYear;
    html += '</td></tr>';
    html += '<tr><td class="mctools-details-description">Farve</td><td>';
    if (result.Data.Color == "null")
        html += "-";
    else
        html += result.Data.Color;
    html += '</td></tr>';
    html += '<tr><td class="mctools-details-description">Udstyr</td><td>';
    if (result.Data.DescriptiveEquipmentText == "null")
        html += "-";
    else
        html += result.Data.DescriptiveEquipmentText;
    html += '</td></tr>';

    html += '</div></table>';

    html += '</div>'

    var height = MClist.detailsHeight;
    if (result.Data.Images.length == 0)
        height = height - 50;

    Shadowbox.open({
        content: html,
        title: result.Data.MakeName + " " + result.Data.ModelName,
        player: "html",
        height: height,
        width: MClist.detailsWidth
    });
}

MClist.showLargeImage = function(image) {
    var img = document.getElementById("mctools-imglarge");
    img.src = MClist.imageServerHost + MClist.imagesPath + image;
}