jQuery(function () {
    jQuery('div[x-modweb-designer-banner]').each(function () {


        //jQuery.jqModweb.debug.write('ff');
        var widthPixels = jQuery(this).attr('x-width');
        var heightPixels = jQuery(this).attr('x-height');
        var bannerSetID = jQuery(this).attr('x-bannersetid');
        var target = jQuery(this).attr('x-target');
        var showWhenEmpty = jQuery.jqModweb.toBool(jQuery(this).attr('x-showwhenempty'));
        var bannerCount = jQuery(this).children('img').length;
        var isAdmin = jQuery.jqModweb.toBool(jQuery(this).attr('x-isadmin'));
        var frameDuration = jQuery.jqModweb.toInt(jQuery(this).attr('x-frameduration'));
        var animationType = jQuery(this).attr('x-animationtype');
        //var transitionMode = jQuery(this).attr('x-transitionmode');
        var frameOrder = jQuery(this).attr('x-frameorder');
        var transitionDuration = jQuery.jqModweb.toInt(jQuery(this).attr('x-transitionDuration'));
        var bannerContainer = jQuery(this);
        var logClicks = jQuery.jqModweb.toBool(jQuery(this).attr('x-logclicks'));

        var isRandom = false;

        switch (frameOrder) {
            case "Forward":
            case "Reverse":
            case "Shuffle":
                // do nothing, the <img> elements are already positions correctly server-side.
                // note, the server also handled the shuffling of the <img> tags if Shuffle/Reverse was selected.
                break;
            case "Random":
                isRandom = true;
                jQuery.jqModweb.debug.warning("Still working on FrameOrder=Random, still buggy!");
                break;
            default:
                jQuery.jqModweb.debug.error("Banner control has unknown FrameOrder '" + frameOrder + "'.");
                break;
        }


        // give container the sizing
        jQuery(this).css({ 'width': widthPixels + 'px' });
        jQuery(this).css({ 'height': heightPixels + 'px' });


        if (frameDuration === -1) {
            frameDuration = 4000; // default.
        }

        if (transitionDuration === -1) {
            transitionDuration = 1000; // default.
        }

        //alert(transitionDuration);


        /*
        var getPagerOptions = function () {
        var pagerUniqueID = jQuery(this).attr('x-link-bannerpager-uniqueid');
        var pagerContainer = jQuery('div[x-modweb-bannerpager][x-uniqueid="' + pagerUniqueID + '"]');

        // does the pager have prev or next buttons.
        var pagerPrevButton = pagerContainer.find('div[x-prev]');
        var pagerNextButton = pagerContainer.find('div[x-next]');
        };
        */


        if (bannerCount == 0) {

            if (showWhenEmpty !== false) {
                // render a dummy banner placeholder (there are no banner images yet).

                var dummy = jQuery('<div></div>');
                dummy.addClass('modweb-designer-banner-dummy');
                dummy.css({
                    'width': widthPixels + 'px'
                    , 'height': heightPixels + 'px'
                    , 'minHeight': '100px'
                    , 'minWidth': '100px'
                });

                if (isAdmin === true) {
                    dummy.text('No images to render in this banner set. Please right click this banner set to start adding images.');
                }
                else {
                }


                jQuery(this).append(dummy);

            }
            else {
                // completly hide the control.
                jQuery(this).remove();
                return;
            }
        }
        else if (bannerCount == 1) {
            // there is a bug with jquery.cycle-lite.js where if you have only 1 slide, it throws an error to the console and keeps the image hidden.
            jQuery(this).children('img').show();
        }
        else if (bannerCount > 1) {


            // pager.
            var pagerCurrentButtonCssClass = null;
            var pagerPrevButton = null;
            var pagerNextButton = null;
            var pagerGotoButton = null;
            {
                var pagerUniqueID = jQuery(this).attr('x-link-bannerpager-uniqueid');
                var pagerContainer = jQuery('div[x-modweb-bannerpager][x-uniqueid="' + pagerUniqueID + '"]');


                // pager parameters.
                var pagerButtonCssClass = pagerContainer.attr('x-buttoncssclass');
                pagerContainer.removeAttr('x-buttoncssclass');
                pagerCurrentButtonCssClass = pagerContainer.attr('x-currentbuttoncssclass');
                pagerContainer.removeAttr('x-currentbuttoncssclass');


                // render the banner pager.
                var slideCount = bannerContainer.find('img').length;
                for (var i = 0; i < slideCount; i++) {
                    var button = jQuery('<div class="' + pagerButtonCssClass + '"></div>');
                    if (false) {
                        // render text (the page number).
                        button.text(i);
                    }
                    button.attr('x-val', i);
                    // add the BannerPager.CurrentButtonCssClass to the first pager button since this is before the cycle plugin does anything.
                    if (i === 0)
                        button.addClass(pagerCurrentButtonCssClass);
                    button.css({
                        'cursor': 'pointer'
                    });
                    pagerContainer.append(button);
                }



                pagerGotoButton = pagerContainer.find('div');

            }



            // add cycle animation
            jQuery(this).modwebBannersCycle({
                sync: 1
                , speed: transitionDuration
            , delay: 0
            , timeout: frameDuration
            , myRandom: isRandom
            , before: function () {
                //TODO: change description here.
            }
            , prev: pagerPrevButton
            , next: pagerNextButton
            , goto: pagerGotoButton
            , currentButtonCssClass: pagerCurrentButtonCssClass
            });
        }


        // add hyperlinks
        jQuery(this).children('img[x-banner-item-hyperlink]').each(function (i) {
            jQuery(this).css({ 'cursor': 'pointer' }).click(function () {
                var bannerId = jQuery(this).attr('x-bannerid');


                var url = null;
                if (logClicks)
                    url = "/_framework/resources/Designer.Banner/BannerClick.aspx?b=" + bannerId + "&u=" + encodeURIComponent(jQuery(this).attr('x-banner-item-hyperlink'));
                else
                    url = jQuery(this).attr('x-banner-item-hyperlink');


                switch (target) {
                    case '_blank':
                        window.open(url);
                        break;
                    default:
                        window.location = url;
                        //jQuery.jqModweb.debug.error('Unsupported Target parameter on Banner (' + target + ').');
                }
            });
        });

        // context menu
        if (isAdmin) {
            jQuery(this).modwebContextMenu({
                modwebContextMenuItems: [
            { text: 'Edit Banner',
                onModwebContextMenuItemClicked: function () {
                    //window.location = "/_framework/admin/modules/banners/managebanners.aspx?bannersetid=" + bannerSetID;
                    window.open("/_framework/admin/modules/banners/managebanners.aspx?bannersetid=" + bannerSetID, "_blank");
                }
            }

            ]
            });
        }
    });
});