/**
 * editableText plugin that uses contentEditable property (FF2 is not supported)
 * Project page - http://github.com/valums/editableText
 * Copyright (c) 2009 Andris Valums, http://valums.com
 * Licensed under the MIT license (http://valums.com/mit-license/)
 */
(function(){
    /**
     * The dollar sign could be overwritten globally,
     * but jQuery should always stay accesible
     */
    var $ = jQuery;
	/**
     * Extending jQuery namespace, we
     * could add public methods here
     */
	$.editableText = {};
    $.editableText.defaults = {
		/**
		 * Event that is triggered when editable text is changed
		 */
		changeEvent : 'change'
	};
	/**
	 * Usage $('selector).editableText(optionArray);
	 * See $.editableText.defaults for valid options
	 */
    $.fn.editableText = function(options){
        var options = $.extend({}, $.editableText.defaults, options);

        return this.each(function(){
             // Add jQuery methods to the element
            var editable = $(this);

			/**
			 * Save value to restore if user presses cancel
			 * This var will hold previous value
			 */
			var prevValue;

			// Create edit/save buttons
            var buttons = $(
				"<div class='editableToolbar'>" +
            		"<button href='#' class='edit'>edit</button>" +
            		"<button href='#' class='save'>save</button>" +
            		"<button href='#' class='cancel'>cancel</button>" +
                    "<select class='editor_blocktype'>\n\
<option value=\"nil\">--block type--</option>\n\    \n\
<option value=\"p\">Paragraph</option>\n\
    <option value=\"h1\">Heading 1</option>\n\
    <option value=\"h2\">Heading 2</option>\n\
    <option value=\"h3\">Heading 3</option>\n\
    <option value=\"h4\">Heading 4</option>\n\
    </select><select class='editor_listtype'>\
    <option value=\"nil\">--list type--</option>\n\    \n\
    <option value=\"ol\">Ordered</option>\n\
    <option value=\"ul\">Unordered</option>\n\
    </select>" +
                "<button href='#' class='editor_indent'>indent</button>" +
                "<button href='#' class='editor_outdent'>outdent</button>" +
            	"</div>")
				.insertBefore(editable);

			// Save references and attach events
            var editEl = buttons.find('.edit').click(startEditing);

			buttons.find('.save').click(function(){
				stopEditing();
				editable.trigger(options.changeEvent);
                return false;
			});
			buttons.find('.cancel').click(function(){
				stopEditing();
				editable.html(prevValue);
                return false;
			});
            buttons.find('.indent').click(function(){
				document.execCommand("indent", false, false);
			});
            buttons.find('.outdent').click(function(){
				document.execCommand("outdent", false, false);
			});

            buttons.find('.editor_blocktype').change(function(){
				document.execCommand("formatBlock", false, $(this).val());
			});

            buttons.find('.editor_blocktype').focus(function(){
				this.selectedIndex = 0;
			});
            
            buttons.find('.editor_listtype').change(function(){
                if ($(this).val() == "ol"){
                    document.execCommand("insertOrderedList", false, false);
                } else if ($(this).val() == "ul"){
                    document.execCommand("insertUnorderedList", false, false);
                }				
			});

            buttons.find('.editor_listtype').focus(function(){
				this.selectedIndex = 0;
			});



			// Display only edit button
			buttons.children().css('display', 'none');
			editEl.show();

			/**
			 * Makes element editable
			 */
			function startEditing(){
				// Save previous value
				prevValue = editable.html();

                buttons.children().show();
                editEl.hide();

	            editable.attr('contentEditable', true);
                editable.keypress(function(e){
                    switch (e.which){

                    }
                    return true;
                });
                return false;
			}
			/**
			 * Makes element non-editable
			 */
			function stopEditing(){
				buttons.children().hide();
				editEl.show();
                editable.attr('contentEditable', false);
			}
        });
    }
})();