Editor de texto

cristian_web · Julho 18, 2011

Olá pessoal sou novo aqui no forum gostaria que me ajudassem com um editor de texto bem simples que achei na internet...

Sou programador de um site de noticias então precisei instala-lo no meu sistem de noticias... o negocio é o seguinte:

sempre que alguem cola algum conteudo de outro site no editor ele vai formatado com o mesmo estilo do site exemplo: se

o site tem como fonte original 14 ele vai com fonte 14.Gostaria de saber se existe alguma forma de desabilitar isso pelo codigo

ai vai o codigo do editor

/*
* jQuery RTE plugin 0.3 - create a rich text form for Mozilla, Opera, and Internet Explorer
*
* Copyright (c) 2007 Batiste Bieler
* Distributed under the GPL (GPL-LICENSE.txt) licenses.
*/

// define the rte light plugin
jQuery.fn.rte = function(css_url, media_url) {

   if(document.designMode || document.contentEditable)
   {
       $(this).each( function(){
           var textarea = $(this);
           enableDesignMode(textarea);
       });
   }

   function formatText(iframe, command, option) {
       iframe.contentWindow.focus();
       try{
        iframe.contentWindow.document.execCommand(command, false, option);
       }catch(e){console.log(e)}
       iframe.contentWindow.focus();
   }

   function tryEnableDesignMode(iframe, doc, callback) {
       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(iframe, doc, callback)}, 250);
       return false;
   }

   function enableDesignMode(textarea) {
       // need to be created this way
       var 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 = textarea.attr('id');
       if(textarea.attr('name'))
           iframe.title = textarea.attr('name');
       textarea.after(iframe);
       var css = "";
       if(css_url)
       var css = "<link type='text/css' rel='stylesheet' href='"+css_url+"' />"
       var content = textarea.val();
       // Mozilla need this to display caret
       if($.trim(content)=='')
      content = '<br>';
       var doc = "<html><head>"+css+"</head><body class='frameBody'>"+content+"</body></html>";
       tryEnableDesignMode(iframe, doc, function() {
           $("#toolbar-"+iframe.title).remove();
           $(iframe).before(toolbar(iframe));
           textarea.remove();
       });
   }

   function disableDesignMode(iframe, submit) {
       var content = iframe.contentWindow.document.getElementsByTagName("body")[0].innerHTML;
       if(submit==true)
           var textarea = $('<input type="hidden" />');
       else
           var textarea = $('<textarea cols="40" rows="10" onkeyup="wr_txt(this, 1)" onkeypress="wr_txt(this, 1)"></textarea>');
       textarea.val(content);
       t = textarea.get(0);
       if(iframe.className)
           t.className = iframe.className;
       if(iframe.id)
           t.id = iframe.id;
       if(iframe.title)
           t.name = iframe.title;
       $(iframe).before(textarea);
       if(submit!=true)
       $(iframe).remove();
       return textarea;
   }

   function toolbar(iframe) {

       var tb = $("<div class='rte-toolbar' id='toolbar-"+iframe.title+"'><div>\
		<select>\
                   <option value=''>Noticia Normal</option>\
               </select>\
           <p>\
               <a href='#notcs' class='bold' rel='tooltip' title='Clique aqui para deixar seu texto em <b>NEGRITO</b>'><img src='"+media_url+"bold.gif' alt='bold' /></a>\
               <a href='#notcs' class='italic' rel='tooltip' title='Clique aqui para deixar seu texto em <i>ITALICO</i>'><img src='"+media_url+"italic.gif' alt='italic' /></a>\
           </p>\
           <p>\
               <a href='#notcs' class='unorderedlist' rel='tooltip' title='Clique aqui para deixar seu texto em <br>•lista<br>•lista'><img src='"+media_url+"unordered.gif' alt='unordered list' /></a>\
               <a href='#notcs' class='link' rel='tooltip' title='Selecione um texto e clique aqui para adicionar um <a href=\"#\" style=\"color=blue\"> LINK </a>' ><img src='"+media_url+"link.png' alt='link' /></a>\
               <a href='#notcs' class='image' rel='tooltip' title='Adicionar imagens<br>(usar somente em ultimo caso)' ><img src='"+media_url+"image.png' alt='image' /></a>\
               <a href='#notcs' class='disable' rel='tooltip' title='Ver codigo fonte<br>Clique somente se você tiver um bom conhecimento em html' ><img src='"+media_url+"close.gif' alt='close rte' /></a>\
			<a href='#preview' onclick='preview()' class='preview' rel='tooltip' title='Veja a previa da noticia antes de publica-la'><img src='"+media_url+"preview.gif' alt='Preview' /></a>\
           </p></div></div>");
       $('select', tb).change(function(){
           var index = this.selectedIndex;
           if( index!=0 ) {
               var selected = this.options[index].value;
               formatText(iframe, "formatblock", '<'+selected+'>');
           }
       });
       $('.bold', tb).click(function(){ formatText(iframe, 'bold');return false; });
       $('.italic', tb).click(function(){ formatText(iframe, 'italic');return false; });
       $('.unorderedlist', tb).click(function(){ formatText(iframe, 'insertunorderedlist');return false; });
       $('.link', tb).click(function(){ 
           var p=prompt("URL:");
           if(p)
               formatText(iframe, 'CreateLink', p);
           return false; });
       $('.image', tb).click(function(){ 
           var p=prompt("image URL:");
           if(p)
               formatText(iframe, 'InsertImage', p);
           return false; });
       $('.disable', tb).click(function() {
           var txt = disableDesignMode(iframe);
		wr_txt(document.form.texto);
           var edm = $('<a href="#notcs" rel="tooltip" title="Voltar"><img src="'+media_url+'back.gif" alt="Voltar" border="0" /></a>');
           tb.empty().append(edm);
           edm.click(function(){
               enableDesignMode(txt);
               return false;
           });
           return false;
       });
       $(iframe).parents('form').submit(function(){
           disableDesignMode(iframe, true); });
       var iframeDoc = $(iframe.contentWindow.document);

       var select = $('select', tb)[0];
       iframeDoc.mouseup(function(){ 
           setSelectedType(getSelectionElement(iframe), select);
           return true;
       });
       iframeDoc.keyup(function(){ 
           setSelectedType(getSelectionElement(iframe), select);
           var body = $('body', iframeDoc);
           if(body.scrollTop()>0)
               iframe.height = Math.min(350, parseInt(iframe.height)+body.scrollTop());
           return true;
       });

       return tb;
   }

   function setSelectedType(node, select) {
       while(node.parentNode) {
           var nName = node.nodeName.toLowerCase();
           for(var i=0;i<select.options.length;i++) {
               if(nName==select.options[i].value){
                   select.selectedIndex=i;
                   return true;
               }
           }
           node = node.parentNode;
       }
       select.selectedIndex=0;
       return true;
   }

   function getSelectionElement(iframe) {
       if (iframe.contentWindow.document.selection) {
           // IE selections
           selection = iframe.contentWindow.document.selection;
           range = selection.createRange();
           try {
               node = range.parentElement();
           }
           catch (e) {
               return false;
           }
       } else {
           // Mozilla selections
           try {
               selection = iframe.contentWindow.getSelection();
               range = selection.getRangeAt(0);
           }
           catch(e){
               return false;
           }
           node = range.commonAncestorContainer;
       }
       return node;
   }
}

Ted k' · Julho 18, 2011

Cara, eu sempre tive problemas com essas coisas, eu resolvi colocando no bloco de notas e depois no editor, se alguém tiver algo ai, gostaria de saber também!

cristian_web · Julho 18, 2011

É se fosse para min iria resolver sim... só que como o redator do site não sou eu eles precisam de um sistema bem facilitado pra fazerem as noticias o mais rapido possivel... Se tivesse outra solução eu agradeceria muito :(

Ted k' · Julho 18, 2011

Fazer ou copiar...??

Eu trabalhei em sites de noticias que eram assim, copiar, bloco de notas e colar no site, bem... foi experiência, mais aguarda ai a galera relatar alguma coisa melhor, não precisa dar um "up" no post!

cristian_web · Julho 19, 2011

No caso... será se eu começar com o textarea e depois caso o editor quizer colocar algum efeito habilitasse o editor?

Ted k' · Julho 19, 2011

Bem... pode testar se realmente está certo, a depender do editor, imagina como irá fazer isso? Essa troca? via javascript ou refresh?

cristian_web · Julho 19, 2011

Você acha que teria como incrementar esse script com esse editor?

http://richtextcleanpaste.codeplex.com/SourceControl/changeset/view/18533#309499

Ted k' · Julho 20, 2011

como ter sempre tem cara, o fato é... qual ação seria adequada para você... creio que só um display resolveria!

Arquivado

Editor de texto

Recommended Posts

cristian_web 15

Compartilhar este post

Link para o post

Compartilhar em outros sites

Ted k' 126

Compartilhar este post

Link para o post

Compartilhar em outros sites

cristian_web 15

Compartilhar este post

Link para o post

Compartilhar em outros sites

Ted k' 126

Compartilhar este post

Link para o post

Compartilhar em outros sites

cristian_web 15

Compartilhar este post

Link para o post

Compartilhar em outros sites

Ted k' 126

Compartilhar este post

Link para o post

Compartilhar em outros sites

cristian_web 15

Compartilhar este post

Link para o post

Compartilhar em outros sites

Ted k' 126

Compartilhar este post

Link para o post

Compartilhar em outros sites

Orientação - Codificação Caracteres Especiais em Java

Não consigo carregar imagem do captcha no meu formulário

Estou criando uma calculadora de m2 e litros de tinta

Fóruns

Tempo Real

Informação importante