function makeSlideShowForSingleImage() {
    makeSlideShow(true, false)
}

function makeSlideShowForMultipleImages() {
    makeSlideShow(false, true)
}

function makeSlideShow(manualTransition, directionNav){
    $('.slider').each(function(){
        $(this).nivoSlider({
            effect:'random', // Specify sets like: 'fold,fade,sliceDown'
            slices:15, // For slice animations
            boxCols: 8, // For box animations
            boxRows: 4, // For box animations
            animSpeed:500, // Slide transition speed
            pauseTime:3000, // How long each slide will show
            startSlide:0, // Set starting Slide (0 index)
            directionNav:directionNav, // Next & Prev navigation
            directionNavHide:true, // Only show on hover
            controlNav:false, // 1,2,3... navigation
            controlNavThumbs:false, // Use thumbnails for Control Nav
            controlNavThumbsFromRel:false, // Use image rel for thumbs
            controlNavThumbsSearch: '.jpg', // Replace this with...
            controlNavThumbsReplace: '_thumb.jpg', // ...this in thumb Image src
            keyboardNav:true, // Use left & right arrows
            pauseOnHover:true, // Stop animation while hovering
            manualAdvance:manualTransition, // Force manual transitions
            captionOpacity:0.8, // Universal caption opacity
            prevText: 'Prev', // Prev directionNav text
            nextText: 'Next', // Next directionNav text
            beforeChange: function(){}, // Triggers before a slide transition
            afterChange: function(){}, // Triggers after a slide transition
            slideshowEnd: function(){}, // Triggers after all slides have been shown
            lastSlide: function(){}, // Triggers when last slide is shown
            afterLoad: function(){} // Triggers when slider has loaded
        });

        $(this).hover(function(){
            var $caption = $(".nivo-caption", $(this))
            if ($caption.children('p').text()){
                $caption.show(400)
            }
        }, function(){
            $(".nivo-caption", $(this)).hide(400)
        })

        $(".nivo-caption", $(this)).hide()
    })
//    $('#slider')

}

function createCkEditor(saveUrl, box, width) {
    if (width) {
        CKEDITOR.config.width = width
    }
    CKEDITOR.config.height = '430'
    CKEDITOR.config.resize_enabled = false
    CKEDITOR.plugins.registered['save']=
    {
        init : function( editor )
        {
            var command = editor.addCommand( 'save',
                {
                    modes : {
                        wysiwyg:1,
                        source:1
                    },
                    exec : function( editor ) {
                        update(saveUrl,{
                            text: box.ckeditorGet().getData()
                        }, function(){
                            disposeMask(function(){})
                            destroyCkeditor(box)
                            populateText(saveUrl, box)
                        })
                    }
                }
            );
            editor.ui.addButton( 'Save',{
                label : 'Salvar',
                command : 'save'
            });
        }
    }
    box.ckeditor(function(){},{
        toolbar: [
            ['FontSize', 'Bold', 'Italic',  'TextColor', 'Table', '-', 'NumberedList', 'BulletedList', '-', 'Link', 'Unlink','-','Save']
        ],
        uiColor : '#999'
    })
}

function destroyCkeditor(box) {
    box.ckeditor(function(){
        this.destroy();
    })
}

function mask(box, box_wrapper) {
    box_wrapper.addClass('showup')
    //Get the screen height and width
    var maskHeight = $(".global_area").height();
    var maskWidth = $(".global_area").width();
    //Set height and width to mask to fill up the whole screen
    $('#mask').css({
        'width':maskWidth + 25,
        'height':maskHeight + 10
    });
    //transition effect
    $('#mask').fadeIn(1000);
    $('#mask').fadeTo("slow",0.8);
    $(box).removeClass('selectedToEdit')
    box_wrapper.fadeIn(2000);
}

function disposeMask(onDisposeCallback) {
    $('#mask').hide();
    $('.showup').removeClass("showup");
    onDisposeCallback()
}

function makeSelectable(box, box_wrapper, clickCallback, onExitCallback) {
    box.mousemove(function(){
        if (!box_wrapper.hasClass('showup')){
            $(this).addClass('selectedToEdit')
        }
    }).mouseout(function(){
            $(this).removeClass('selectedToEdit')
        }).click(function(){
            mask(this, box_wrapper)
            clickCallback()
        })

    $('#mask').click(function () {
        disposeMask(onExitCallback)
    });

}

function populateText(url, box) {
    box.html('');
    request(url, {}, function(data){
        box.append(data.text)
    })
}

function make_image_editable($box, $wrapper) {
    makeSelectable($box, $wrapper,
        function(){
            var hostname = window.location.protocol + "://" + window.location.host + "/"
            var path_name = window.location.pathname
            var params = "edition=" + path_name + ""
            var redirect_url = '/picture_edition?' + params
            window.location = redirect_url
        },
        function(){})
}