// SilverIPE: A simple In Place Editor Class
// By: Jean-Nicolas Jolivet (http://www.silverscripting.com)
// Released under the MIT License
// Version: 0.2

var SilverIPE = function (el, url, options) {
	this.url = url;
	var that = this;
	
	// If el is a string, we get the element by this id, if not, assume it's an element
	this.el = (typeof el === 'string') ? document.getElementById(el) : el;
	this.el.title = (this.el.title === '') ? 'Click to edit...' : this.el.title;
	// Remember the original BG color if it's not set, default to transparent
	this.originalBg = (this.el.style.backgroundColor === '') ? 'transparent' : this.el.style.backgroundColor;
	
	// define the default options...
	this.options = {
		parameterName: 'value',
		method: 'POST',
		highlightColor: '#FFFFBF',
		borderColor: '#000',
		savingText: 'сохранение...',
		saveButtonLabel: 'сохранить',
		cancelButtonLabel: 'отмена',
		textWidth: 20,
		textHeight: 4,
		additionalParameters: {}
	};
	
	this.options = this.mergeObjects(this.options, options || {});
	this.options.method = this.options.method.toUpperCase();
	this.el.onmouseover = function () {
		that.el.style.backgroundColor = that.options.highlightColor;
	};
	
	this.el.onmouseout = function () {
		that.el.style.backgroundColor = that.originalBg;
	};
	
	this.el.onclick = function () {	
		that.elClicked.call(that);
	};
	this.buildElements();
};

SilverIPE.prototype.buildElements = function () {
	var parentEl = this.el.parentNode;
	var that = this;
	
	// For inline elements, we use a text input
	if (this.el.tagName.toLowerCase() === 'span' || ((this.el.tagName.toLowerCase() === 'div' || this.el.tagName.toLowerCase() === 'p') && this.el.style.display === 'inline')) {
		this.inputEl = document.createElement("input");
		this.inputEl.type = "text";
		this.inputEl.size = this.options.textWidth;
		this.originalDisplay = 'inline';
	}
	// For block elements, use a textarea
	else if ((this.el.tagName.toLowerCase() === 'div' || this.el.tagName.toLowerCase() === 'p') || 
	(this.el.tagName.toLowerCase() && this.el.style.display === 'block')) 
	{
		this.inputEl = document.createElement("textarea");
		this.inputEl.cols = this.options.textWidth;
		this.inputEl.rows = this.options.textHeight;
		this.originalDisplay = (this.el.style.display === '') ? 'block' : this.el.style.display;
	}
	
	this.inputEl.style.display = 'none';
	this.inputEl.style.border = '1px dashed ' + this.options.borderColor;
	this.inputEl.style.backgroundColor = this.options.highlightColor;
	parentEl.insertBefore(this.inputEl, this.el.nextSibling);
	this.saveButton = document.createElement('a');
	this.saveButton.innerHTML = this.options.saveButtonLabel;
	this.setCommonStyles(this.saveButton);
	this.saveButton.onclick = function () {
		that.saveClicked.call(that);
		return false;
	};
    $(this.inputEl).keypress(function (e) {
        if (e.which == 13) {
            that.saveClicked.call(that);
            var lang = $(that.el).attr('class');
            $(that.el).addClass('idd');
            $(that.el).parent().parent().next('tr').children('td').children('.l').click();
            return false;
        }
    });
    $(this.inputEl).blur(function(){
        that.hideIpe();
    })

	parentEl.insertBefore(this.saveButton, this.inputEl.nextSibling);
	
	this.cancelButton = document.createElement('a');
	this.cancelButton.innerHTML = this.options.cancelButtonLabel;
	this.setCommonStyles(this.cancelButton);
	this.cancelButton.onclick = function () {
		that.cancelClicked.call(that);
		return false;
	};
	parentEl.insertBefore(this.cancelButton, this.saveButton.nextSibling);
};

SilverIPE.prototype.cancelClicked = function () {
	this.hideIpe();

};

SilverIPE.prototype.saveClicked = function () {
	if (this.inputEl.value !== this.lastValue)
	{
		this.el.innerHTML = this.options.savingText;
		this.hideIpe();
		var that = this;
		this.options.additionalParameters[this.options.parameterName] = this.inputEl.value;
		
        $.ajax({
            url    : this.url,
            type   : "POST",
            data   : this.options.additionalParameters,
            success : function(data){
                $(that.el).text(data);
                that.hideIpe();
                that.highlight(that.el, that.originalBg, that.options.highlightColor);
            },
            error  : function (XMLHttpRequest, textStatus, errorThrown){
                that.el.innerHTML = 'Error ' + textStatus + ": " + errorThrown;
                that.highlight(that.el, that.originalBg, '#FF8282');
            }
        });
	}
	else {
		this.cancelClicked();
	}
	
};

SilverIPE.prototype.hideIpe = function () {
	this.inputEl.style.display = 'none';
	this.saveButton.style.display = 'none';
	this.cancelButton.style.display = 'none';
	this.el.style.display = this.originalDisplay;
};


SilverIPE.prototype.setCommonStyles = function (el) {
	el.href = '#';
	el.className = 'noajax';
	el.style.fontFamily = 'arial, sans-serif';
	el.style.fontSize = '11px';
	el.style.display = 'none';
	el.style.margin = '0 4px';
};

SilverIPE.prototype.elClicked = function (test) {
	var strValue = $(this.el).text();
	if (strValue=='Нажмите чтобы отредактировать') strValue='';
	this.inputEl.value = strValue;
	this.lastValue = this.inputEl.value;
	this.showIpe();
	this.inputEl.focus();
};

SilverIPE.prototype.showIpe = function () {
	this.el.style.display = 'none';
	this.inputEl.style.display = 'inline';
	this.saveButton.style.display = 'inline';
	this.cancelButton.style.display = 'inline';
};

SilverIPE.prototype.highlight = function (el, origColor, highColor) {
	var that = this;
	setTimeout(function () {
		that.doHighlight.call(that, el, highColor);
	}, 75);
	setTimeout(function () {
		that.doHighlight.call(that, el, origColor);
	}, 150);
	setTimeout(function () {
		that.doHighlight.call(that, el, highColor);
	}, 225);
	setTimeout(function () {
		that.doHighlight.call(that, el, origColor);
	}, 300);
};

SilverIPE.prototype.doHighlight = function (el, color) {
	el.style.backgroundColor = color;
};

// Internal function to merge 2 objects...
SilverIPE.prototype.mergeObjects = function (orig, ext) {
	var name;
	for (name in ext || {}) {
		if (typeof name !== "function") {
			orig[name] = ext[name];
		}
	}
	return orig;
};

SilverIPE.prototype.trimString = function(str) {
	return str.replace(/^\s\s*/, '').replace(/\s\s*$/, '');
};