function slideshow (element, bannerEffect, bannerTime, bannerSpeed) {
    element.cycle('destroy');
    element.children('img').removeAttr('style');
    element.cycle({
        fx: bannerEffect,
        timeout: bannerTime,
        speed: bannerSpeed,
    });
};
function setSlideshow(element, data) {
    bannerName = data.name;
    bannerEffect = data.fx;
    bannerTime = data.time;
    bannerSpeed = data.speed;
    bannerW = data.w;
    bannerH = data.h;

    $("#pageslide #bannerName").attr("value", bannerName);
    $("#pageslide #timeout").attr("value", bannerTime);
    $("#pageslide #speed").attr("value", bannerSpeed);
    $("#pageslide #banner_width").attr("value", bannerW);
    $("#pageslide #banner_height").attr("value", bannerH);
    $("#pageslide .ad_banner_ad_fx option").each(function(i) {
        if($(this).attr("value") == bannerEffect) {
            this.selected = true;
            $(this).hasClass('notIE') ? $('.suckIE').show() : $('.suckIE').hide();
        }
    });
    element.cycle('destroy');
    slideshow(element, bannerEffect, 2000, 1000);
}

function preview() {
    $('.open-modal').on('click', function() {
        var _data = $(this).data();
        bannerName = _data.name;
        bannerEffect = _data.fx;
        bannerTime = _data.time;
        bannerSpeed = _data.speed;
        bannerW = _data.w;
        bannerH = _data.h;
        $('#preview').modal('show');
    });

    $('#preview').on('shown', function() {
        $(this).attr('aria-labelledby', bannerName.toString()).find('h3').text(bannerName.toString())
        if(bannerW > 500) {
            var resize = 500/bannerW
            bannerW = Math.floor(bannerW*resize);
            bannerH = Math.floor(bannerH*resize);
            console.log(bannerW)
        };
        if(bannerH > 300) {
            var resize = 300/bannerH
            bannerW = Math.floor(bannerW*resize);
            bannerH = Math.floor(bannerH*resize);
        }
        slideshow($(this).find('.preview'), bannerEffect, bannerTime, bannerSpeed);
        $(this).find('.preview').css({
            'width': bannerW,
            'height': bannerH
        });
        $(this).find('.preview img').css({
            'width': '100%',
            'height': '100%'
        });
    });
    $('#preview').on('hidden', function() {
        $(this).attr('aria-labelledby', '').find('h3').text('')
        $(this).find('.preview').cycle('destroy');
        $(this).find('.preview img').removeAttr('style');
    });
};

$(function() {
    var bannerName = null,
        bannerEffect = null,
        bannerTime = null,
        bannerSpeed = null,
        bannerW = null,
        bannerH = null,
        $preview = $('#pageslide .preview');

    $(".ad_banner_ad_fx").change(function () {
        var suckIE = false;
        // bannerTime = $("#pageslide #timeout").val()*1000;
        // bannerSpeed = $("#pageslide #speed").val()*1000;

        bannerTime = parseInt(bannerTime) || 300;
        bannerSpeed = parseInt(bannerSpeed) || 300;
        $(this).children('option:selected').each(function(index, el) {
            $(this).val() == 'flipHorz' || $(this).val() == 'flipVert' ? $('.suckIE').show() : $('.suckIE').hide();
        });
        slideshow($preview, $(this).val(), 2000, 1000);
    });
    preview();
});