/*
	Editable script made by shani elharrar & mor (a)butbul
	
	Todo :
		* Rename all "."s in id to "_"s
	
*/

$(function() {

    var edit_array = [];

	var editComplete = function(thatInput) {
		
		return function(data) {   
			
			var input = thatInput;
			// Will continue from here...
			var span = input.parent();
            var button = span.siblings("input.edit");
            var content = $(data.content);   
			span.html(content.html());
			span.dblclick(startEdit);
            setEditButton(button);

			start_cycle_slideshow();
		}
				
	}
	
	var slideShowComplete = function(form) {

        // Delete from edit array
        edit_array.splice(edit_array.indexOf(form.parent().attr('id')),1);

        if (edit_array.length == 0) {
            $(window).unbind('beforeunload',before_unload);
        }
		// Need to send the form ajaxly.
		$.post(baseUrl() + '/dynamicContent/slideshow/' + form.find('input[name="id"]').val() + '?format=json', form.serialize(), editComplete(form), 'json');
		
	}
	
	var endEdit = function() {
		var input = $(this);
		var span = input.parent();

        // Check if input value is empty, and set it to the default value
        

        if (input.val() == "") {
            input.val(span.siblings("input.default_description").val());
        }

        // Delete from edit array
        edit_array.splice(edit_array.indexOf(span.attr('id')),1);
        
        if (edit_array.length == 0) {
            $(window).unbind('beforeunload',before_unload);
        }

		var is_editable = span.hasClass('editable');
		input.attr('disabled', 'disabled');
		
		$.post(baseUrl() + '/dynamicContent/' + span.attr('id') + '?format=json', {content : input.val(), type : getClass(span), editable : is_editable}, editComplete(input), 'json');
		
	}
	
	var startEdit = function() {
		var span = $(this);

        if (edit_array.length == 0) {
            $(window).bind('beforeunload',before_unload);
        }

        // Insert into edit array
        edit_array[edit_array.length] = span.attr('id');

		var text = span.html();

        // Check if input value is the default value, and reset
        if (text == span.siblings("input.default_description").val()) {
            text = "";
        }

        var button = $(this).siblings("input.edit");
		span.unbind('dblclick');
                
        var type = getClass(span);

		if(type == 'textarea')
		{
			var input = $("<textarea />");
		}
		else if (type == 'text')
		{
			var input = $("<input />");
		}
		else if (type == 'slideshow')
		{
			// We're allready unbinded dblclick on the span,
			// Lets create the slideshow...
			createSlideshowEditor(span).complete(slideShowComplete);
			return;	
		}
		else if (type == 'youtube')
		{
			// Todo : Implement youtube editor.
			var input = $("<input />");
		}
		else
		{
			alert('You must not be here');
			return ;
		}
		
		input.val(text, endEdit);
		span.html(input);
		
		input.ckeditor().focus();
		setSaveButton(button);

	};

    var getClass = function (span) {
        var type;
		var classes = ['textarea','text','slideshow','youtube'];
        for (var index in classes) {
			var current = classes[index];
			if (span.hasClass(current)) {
				return current;
			}
		}
		
		return null;
    };

	var createSlideshowEditor = function(span) {
		
		var form = $("<form />");
		var imageNum = 0;
        
		$('<input type="hidden" />').attr('name','id').val(span.attr('id')).appendTo(form);
		
		var submitButton = $('<input type="submit" value="     " />').addClass('save_mode').addClass('edit');
		form.append(submitButton);
		
		var addedForm = false;
		
		var uploadComplete = function() {
			if (!addedForm) {
				return;
			}
			// If all images are filled, we add more image.
			if (form.find('input[type=text][name!=img][value=""]').length == 0) {
				addImage(form, imageNum++, '');
			}
		}
		
		var uploadCanceled = function(uploadFrame) {
			
		}
		
		var addImage = function(form, imageNum, value) {
			var retVal = $('<input type="text">').hide();
			retVal.val(value);
			retVal.addClass('file');
			retVal.attr('name', 'img' + imageNum);
			retVal.insertBefore(submitButton).show();
            
            var aspectRatio;
            if ($(span).hasClass('no_limit')) {
                aspectRatio = 0;
            } else {
                aspectRatio = 1.5;
            }
            
			retVal.inline_upload({crop : {maxSize : [0,0], minSize:[10,10], aspectRatio:aspectRatio,setSelect : [200,200,100,100]},
								  callbacks: {complete : uploadComplete, canceled: uploadCanceled}});
			return retVal;
		}
		
		var images = span.children().children('img:not(.default)');
		images.each(function(index) {
			if (index+1 == images.length) {
				addedForm = true;
			}
			var img = $(this);
			addImage(form, imageNum++, img.attr('src').replace(baseUrl(), ''));
		});
		
		for (var i = imageNum; i < 1; i++)
		{
			addImage(form, imageNum++, '');
		}
		
		span.html(form);
		addedForm = true;
		
		
		var callbacks = [];
		
		form.submit(function() {
			for (var callbackId in callbacks) {
				callbacks[callbackId](form);
			}
			return false;
		})
		
		return {
			complete : function(callback) {
				callbacks.push(callback);
			}
		}
		
	}

	var setSaveButton = function(button) {
        button.unbind('click');
        button.removeClass('edit_mode').addClass('save_mode').click(function () {
            endEdit.apply($(this).siblings("div.editable").children("input,textarea"));
        });
    }

    var setEditButton = function (button) {
        button.unbind('click');
        button.removeClass('save_mode').addClass('edit_mode').click(function () {
            $(this).siblings("div.editable").dblclick();
        });
    }

	$("div.editable").dblclick(startEdit);

	$("div.editable").parent().children("input.edit").click(function(){
        $(this).parent().children("div.editable").dblclick();
    });


    $("input.edit").hover(function() {
        var left = $(this).position().left - 100;
        var top = $(this).position().top - 20;
        var label = $("<span />");
        label.text($(this).attr('alt'));
        label.addClass('input_label');
        label.css({'position':'absolute','top':top,'left':left});
        
        $(this).parent().append(label);
    }, function(){
        $(this).siblings('.input_label').remove();
    });

    var before_unload = function() {
        return "לא ביצעת שמירה לאחר העריכה";
    }
});