/* * jQuery RTE plugin 0.5.1 - create a rich text form for Mozilla, Opera, Safari and Internet Explorer * * Copyright (c) 2009 Batiste Bieler * Distributed under the GPL Licenses. * Distributed under the MIT License. Extending: The formatting is done with document.execCommand so adding $(Ô.underlineÕ, tb).click(function(){ formatText(iframe, ÔunderlineÕ);return false; }); ought to work. (YouÕll need too add a button as well) */ // define the rte light plugin (function($) { if(typeof $.fn.rte === "undefined") { var defaults = { media_url: "/lib/rte/", content_css_url: "rte.css", dot_net_button_class: null, max_height: 350 }; $.fn.rte = function(options) { $.fn.rte.html = function(iframe) { return iframe.contentWindow.document.getElementsByTagName("body")[0].innerHTML; }; // build main options before element iteration var opts = $.extend(defaults, options); // iterate and construct the RTEs return this.each( function() { var textarea = $(this); var iframe; var element_id = textarea.attr("id"); // enable design mode function enableDesignMode() { var content = textarea.val(); // Mozilla needs this to display caret if($.trim(content)=='') { content = '
'; } // already created? show/hide if(iframe) { console.log("already created"); textarea.hide(); $(iframe).contents().find("body").html(content); $(iframe).show(); $("#toolbar-" + element_id).remove(); textarea.before(toolbar()); return true; } // for compatibility reasons, need to be created this way iframe = document.createElement("iframe"); iframe.frameBorder=0; iframe.frameMargin=0; iframe.framePadding=0; iframe.height=200; if(textarea.attr('class')) iframe.className = textarea.attr('class'); if(textarea.attr('id')) iframe.id = element_id; if(textarea.attr('name')) iframe.title = textarea.attr('name'); textarea.after(iframe); var css = ""; if(opts.content_css_url) { css = ""; } var doc = ""+css+""+content+""; tryEnableDesignMode(doc, function() { $("#toolbar-" + element_id).remove(); textarea.before(toolbar()); // hide textarea textarea.hide(); }); } function tryEnableDesignMode(doc, callback) { if(!iframe) { return false; } try { iframe.contentWindow.document.open(); iframe.contentWindow.document.write(doc); iframe.contentWindow.document.close(); } catch(error) { //console.log(error); } if (document.contentEditable) { iframe.contentWindow.document.designMode = "On"; callback(); return true; } else if (document.designMode != null) { try { iframe.contentWindow.document.designMode = "on"; callback(); return true; } catch (error) { //console.log(error); } } setTimeout(function(){tryEnableDesignMode(doc, callback)}, 500); return false; } function disableDesignMode(submit) { var content = $(iframe).contents().find("body").html(); if($(iframe).is(":visible")) { textarea.val(content); } if(submit !== true) { textarea.show(); $(iframe).hide(); } } // create toolbar and bind events to it's elements function toolbar() { var tb = $("
\

\ \

\

\ bold\ italic\

\

\ unordered list\ link\ image\ close rte\

"); $('select', tb).change(function(){ var index = this.selectedIndex; if( index!=0 ) { var selected = this.options[index].value; formatText("formatblock", '<'+selected+'>'); } }); $('.bold', tb).click(function(){ formatText('bold');return false; }); $('.italic', tb).click(function(){ formatText('italic');return false; }); $('.unorderedlist', tb).click(function(){ formatText('insertunorderedlist');return false; }); $('.link', tb).click(function(){ var p=prompt("URL:"); if(p) formatText('CreateLink', p); return false; }); $('.image', tb).click(function(){ var p=prompt("image URL:"); if(p) formatText('InsertImage', p); return false; }); $('.disable', tb).click(function() { disableDesignMode(); var edm = $('Enable design mode'); tb.empty().append(edm); edm.click(function(e){ e.preventDefault(); enableDesignMode(); // remove, for good measure $(this).remove(); }); return false; }); // .NET compatability if(opts.dot_net_button_class) { var dot_net_button = $(iframe).parents('form').find(opts.dot_net_button_class); dot_net_button.click(function() { disableDesignMode(true); }); // Regular forms } else { $(iframe).parents('form').submit(function(){ disableDesignMode(true); }); } var iframeDoc = $(iframe.contentWindow.document); var select = $('select', tb)[0]; iframeDoc.mouseup(function(){ setSelectedType(getSelectionElement(), select); return true; }); iframeDoc.keyup(function() { setSelectedType(getSelectionElement(), select); var body = $('body', iframeDoc); if(body.scrollTop() > 0) { var iframe_height = parseInt(iframe.style['height']) if(isNaN(iframe_height)) iframe_height = 0; var h = Math.min(opts.max_height, iframe_height+body.scrollTop()) + 'px'; iframe.style['height'] = h; } return true; }); return tb; }; function formatText(command, option) { iframe.contentWindow.focus(); try{ iframe.contentWindow.document.execCommand(command, false, option); }catch(e){ //console.log(e) } iframe.contentWindow.focus(); }; function setSelectedType(node, select) { while(node.parentNode) { var nName = node.nodeName.toLowerCase(); for(var i=0;i