﻿
var lastOffset = '510px';

function DeleteImage(id) {

    /* Borro la imagen */
    $.ajax({
        type: 'POST',
        url: '/Geography/Images/DeleteImage/',
        async: false,
        datatype: 'json',
        data: {
            'imageId': id
        },
        success: function (msg) {
            trace(msg);
        },
        error: function (o, d, s) {
            trace(o);
        }
    });

    /* Recargo el tab */
    /*var tbs = $('#tabs');*/
    /*var tbs = $('[imageid=' + id + ']').parents('.ui-tabs');*/
    var tbs = $('.ui-tabs:last');
    var selected = tbs.tabs('option', 'selected');    
    tbs.tabs('load', selected);
}

function OnImage(img, cap, th, ed) {

    /*Creo un párrafo donde voy a tener la descripción*/
    if ($(th).attr('class') != undefined) {
        var d = '<p id="' + $(th).attr('imageid') + '" class="ad-image-description" style="display:none" >';
        d += $(th).attr('title') + '</p>';

        /*Saco el titulo que pone la galería*/
        $('.caption').remove();

        /*Hago que la imagen tenga la descripción por encima*/
        $(img).css('overflow', 'hidden');
        $(img).parent().append(d);
        $('.ad-image-description').fadeIn('slow');

        /*Hago que la descripción sea editable, si corresponde*/
        
        if (ed == 'true' || ed == 'True' || ed == true) {            
            $('.ad-image-description').editable('/Geography/Images/EditImageDescription', {

                cancel: 'Cancelar',
                submit: 'OK',
                placeholder:'',
                tooltip: 'Click para editar...',
                id: 'imageId',
                name: 'description',
                callback: function(value, settings) {
                    $(th).attr('title', value);
                }
            });

            var close = '<div id="deleteImgDiv" class="ui-widget ui-dialog-titlebar ui-widget-header ui-corner-all ui-helper-clearfix" unselectable="on" style="-moz-user-select: none;position:absolute;z-index:25;display:none">';
            close += '<a href="javascript:void(0);" onclick="return DeleteImage(\'' + $(th).attr('imageid') + '\');" class="ui-dialog-titlebar-close ui-corner-all" role="button" unselectable="on" style="-moz-user-select: none; cursor: pointer; z-index: 1003;">';
            close += '<span class="ui-icon ui-icon-closethick" unselectable="on" style="-moz-user-select: none;">eliminar</span>';
            close += '</a><div>';
            $(img).parent().append(close);
        }

        /*Ajusto la posición de la descripción y el botón de eliminar*/
        if ($('.replaced').size() > 0) {
            var img = $('.replaced');
            offset = img.position().top + 290;

            if (offset == 'NaNpx' || offset < 500) {
                offset = lastOffset;
            } else {
                lastOffset = offset;
            }

            $('.ad-image-description').css('top', offset);
            var testTop = '220px';
            var realTop = img.position().top;
            while (realTop <= testTop || (realTop > testTop && realTop < 250 )) {};
            testTop = realTop;

            $('#deleteImgDiv').css('top', testTop);

            var leftoffset = img.position().left;
            if (leftoffset <= 0) {
                leftoffset = '236px';
            }

            var closeLeftOffset = img.position().left + img.width() - 17;
            if (closeLeftOffset <= 300) {
                closeLeftOffset = '817px';
            }

            $('.ad-image-description').css('left', leftoffset);

            $('#deleteImgDiv').css('left', closeLeftOffset);
            $('#deleteImgDiv').css('display', '');
        }


        
        
    }
}
