var cIdx = 0;
var IdxMax = 0;
var pExpType = 0;
var flipSource = 'hfPhotoData';
var loadImg = '../PageImgs/Loading.gif';

$(document).ready(function() {
    $('#ImgFlipper').dialog({ autoOpen: false, title: 'Frame Model Photos', position:'top' });
    $(".ui-dialog-titlebar").remove();
});

function OpenFlipper(imgIdx) {
    flipSource = 'hfPhotoData';
    cIdx = imgIdx;
    var imgDataArray = JSON.parse($('#' + prefixPgControl(flipSource)).val());
    var imgData = imgDataArray[imgIdx];
    var Img = $('#ImgFlipperImg');
    IdxMax = imgDataArray.length - 1;

    if (IdxMax == 0) {
        $('#' + prefixPgControl('btnPrev')).addClass('VisHidden');
        $('#' + prefixPgControl('btnNext')).addClass('VisHidden');
    }
    else {
        $('#' + prefixPgControl('btnPrev')).removeClass('VisHidden');
        $('#' + prefixPgControl('btnNext')).removeClass('VisHidden');
    }

    Img.attr('src', '../PageImgs/WheelSmall.png').css('width', '').css('height', '');
    Img.attr('src', imgData.URL).css('width', imgData.Width + 'px').css('height', imgData.Height + 'px');
    $('#ImgFlipperSource').empty().append('Source: ' + imgData.Source);
    $('#ImgFlipper').dialog('option', 'width', (imgData.Width + 40));
    $('#toplftFlipper').html('Photo ' + (imgIdx + 1) + ' of ' + imgDataArray.length);
    setTimeout("$('#ImgFlipper').dialog('open');", 250);
}

function AddNewExample() {
    var ModelID = $('#' + prefixPgControl('hfModelID')).val();
    window.location = "../Velos/AddEdit/FrameExample_General.aspx?ModelID=" + ModelID;
}

function getToolTip(obj) {
    var t = $(obj).attr("hoverTip");
    if (t == undefined) { t = "- error -"; }
    return t;
}

function CngThumbs(btn, iStart) {
    $(btn).attr('src', '../PageImgs/progress.gif');
    var cbItem = JSON.parse($('#' + prefixPgControl('hfCBTemplate')).val());
    cbItem.Event = "cngthumbs";
    cbItem.Arguments = iStart;
    ViewModelCallback(JSON.stringify(cbItem), 2);
}

function ChgFlipper(dir) {
    var imgDataArray = JSON.parse($('#' + prefixPgControl(flipSource)).val());
    if (dir == 0) {
        cIdx = cIdx - 1;
        if (cIdx < 0) { cIdx = IdxMax; }
    }
    else {
        cIdx = cIdx + 1;
        if (cIdx > IdxMax) { cIdx = 0; }
    }

    $('#ImgFlipper').dialog('close');
    var imgData = imgDataArray[cIdx];
    var Img = $('#ImgFlipperImg');
    Img.attr('src', '../PageImgs/WheelSmall.png').css('width', '').css('height', '');
    Img.attr('src', imgData.URL).css('width', imgData.Width + 'px').css('height', imgData.Height + 'px');
    $('#ImgFlipperSource').empty().append('Source: ' + imgData.Source);
    $('#ImgFlipper').dialog('option', 'width', (imgData.Width + 40));
    $('#toplftFlipper').html('Photo ' + (cIdx + 1) + ' of ' + imgDataArray.length);
    setTimeout("$('#ImgFlipper').dialog('open');", 100);
}

function SetExampleFlipper(lType) {
    $('#ImgFlipper').dialog('close');
    var Img = $('#ImgFlipperImg');
    Img.attr('src', loadImg);
    $('#ImgFlipperSource').empty();

    if (pExpType != lType) {
        // Callback to load data
        $('#ImgFlipper').dialog('option', 'width', (500 + 40));
        //setTimeout("$('#ImgFlipper').dialog('open');", 100);

        var cbItem = JSON.parse($('#' + prefixPgControl('hfCBTemplate')).val());
        cbItem.Event = "expphotos";
        cbItem.Arguments = lType;
        ViewModelCallback(JSON.stringify(cbItem), 1);
    }
    else {
        // call to get loaded data
        LoadExampleFlipper();
    }
}

function LoadExampleFlipper() {
    $('#ImgFlipper').dialog('close');
    flipSource = 'hfExamplePhotos'
    var imgDataArray = JSON.parse($('#' + prefixPgControl(flipSource)).val());
    cIdx = 0;
    IdxMax = imgDataArray.length - 1;

    if (IdxMax == 0) {
        $('#' + prefixPgControl('btnPrev')).addClass('VisHidden');
        $('#' + prefixPgControl('btnNext')).addClass('VisHidden');
    }
    else {
        $('#' + prefixPgControl('btnPrev')).removeClass('VisHidden');
        $('#' + prefixPgControl('btnNext')).removeClass('VisHidden');
    }

    var imgData = imgDataArray[cIdx];
    var Img = $('#ImgFlipperImg');
    Img.attr('src', '../PageImgs/WheelSmall.png');
    Img.attr('src', imgData.URL).css('width', imgData.Width + 'px').css('height', imgData.Height + 'px'); ;
    $('#ImgFlipperSource').empty().append('Source: ' + imgData.Source);
    $('#ImgFlipper').dialog('option', 'width', (imgData.Width + 40));
    $('#toplftFlipper').html('Photo ' + (cIdx + 1) + ' of ' + imgDataArray.length);
    setTimeout("$('#ImgFlipper').dialog('open');", 250);
}

function ViewModelCallbackHandler(arg, ctx) {
    if (ctx == 0)
    { }
    else if (ctx == 1) {
        $('#' + prefixPgControl('hfExamplePhotos')).val(arg)
        LoadExampleFlipper();
    }
    else if (ctx == 2)
    {
        $('#' + prefixPgControl('mainPhotoPanel')).empty().append(arg);
        $('.ttiptxt').tooltip({ delay: 0, track: true, fade: 500, showURL: false, bodyHandler: function() { return getToolTip(this); } });
    }
    return;
}