Need help to solve paste from Word issues

41 views
Skip to first unread message

HD

unread,
Nov 19, 2010, 2:13:32 PM11/19/10
to MooEditable
Hi there,
i've tried to post on the first topic about that but the message
doesn't seems to be posted…
So, what i would like pretty much is to remove text format of the text
which have been pasted from Word when I click on "Remove Format". But
only bold an italic are remove, not size or color or font.
I'm not a developper, juste a graphic designer who make some
webdesign, so be cool to explain step by step (and I'm French…)

Thank you very much.

Roparz

unread,
Nov 19, 2010, 7:50:34 PM11/19/10
to MooEditable
Salut !
Voici un bout de code qui permet de ne garder que les balises que tu
as choisis :

var authTag = [
{name : 'p', attr: null},
{name : 'a', attr: ['href']},
{name : 'strong', attr: null},
{name : 'span', attr: ['style']},
{name : 'b', attr: null},
{name : 'em', attr: null},
{name : 'u', attr: null}
];

var content = this.mooEditable.getContent().replace(/<[^>]*>/g,
function(match) {
var t = '';
authTag.each(function(tag) {
if (match.contains('<' + tag.name)) {
t = tag.attr != null && match.contains(tag.attr) ? match : '<' +
tag.name + '>';
} else if (match.contains('</' + tag.name)) {
t = match;
}
});
return t;
}.bind(this));
this.mooEditable.setContent(this.mooEditable.cleanup(content));

Si tu veux une explication plus détaillé demandes moi.

Bon courage !

HD

unread,
Nov 20, 2010, 3:32:38 AM11/20/10
to MooEditable
Merci pour l'aide, est-ce que tu pourrais m'expliquer où insérer ce
code exactement ?

Merci.

------------------------

Thanks for your help, can you explain to me where do I insert this
code exactly ?

Thank you.

Roparz

unread,
Nov 20, 2010, 8:06:44 AM11/20/10
to MooEditable
Salut !
Tu trouveras un exemple ici : http://www.roparz.net/MyMooEditable/
Regarde le code source (et plus exactement le fichier
MyMooEditable.js), j'ai essayer de commenter du mieux possible.
Si tu as encore des questions, tu peux me contacter via Skype :
christophe3780.

---------
Hi !
You will find an exemple here : http://www.roparz.net/MyMooEditable/
Look at the source code (exactly the file MyMooEditable.js), I tried
to comment it the best as possible.
If you have more questions, you can contact me via Skype :
christophe3780.

HD

unread,
Nov 21, 2010, 1:59:34 AM11/21/10
to MooEditable
Salut,
c'est à peu près ce que je cherche, sauf que la police utilisée dans
Word ne semble pas être conservée, par exemple la Times. Mais ce n'est
pas trop grave.
Par contre est ce qu'il y aurait un moyen de l'intégrer dans
mooEditable, un peu à la manière des .extra ou .flash, car je fais
appelle à mooEditable à pas mal d'endroit et je me vois mal repasser
partout pour changer le nom de la class :/
Merci.

------------------------
Hi,
It's close to be what I'm looking for, except that the font used in
Word, in exemple Times, seems to be removed. But that not so
important.
But, is it a way to use the function without a new class, like
the .extra ou .flash files, because i'm using mooEditable a lot, and I
would'nt change it everywhere I'm using It.

Thanks a lot.

Barryvan

unread,
Nov 21, 2010, 6:53:05 PM11/21/10
to MooEditable
Hi!

The code that I use to do something similar looks something like this:

String.implement({
sanitiseWord: function() {
var s = this.replace(/\r/g, '\n').replace(/\n/g, ' ');
var rs = [];
rs.push(/<!--.+?-->/g); // comments
rs.push(/<title>.+?<\/title>/g); // Title
rs.push(/<style[^>]*?>.+?<\/style>/g); // Style info
rs.push(/<(\/)?(meta|link|style|div|head|html|body|span|table|
colgroup|col|tbody|thead|tfoot|tr|td|font|!\[)[^>]*?>/g); //
Unnecessary tags
rs.push(/<[^>\s]*?:[^>]*?>/g); // Namespaced elements
rs.push(/<\?[^>]*?>/g); // Processing instructions
rs.push(/<[^>]*?\?>/g); // Processing instructions
rs.push(/ v:.*?=".*?"/g); // Weird nonsense attributes
rs.push(/ style=".*?"/g); // Styles
rs.push(/ class=".*?"/g); // Classes
rs.push(/(&nbsp;){2,}/g); // Redundant &nbsp;s
rs.push(/<p>(\s|&nbsp;)*?<\/p>/g); // Empty paragraphs
for (var i = 0; i < rs.length; i++) {
s = s.replace(rs[i], '');
}
s = s.replace(/\s+/g, ' ');
var el = new Element('span');
return el.set('html', s).get('html'); // Balance unbalanced tags
}
});

It works pretty well, stripping out all but the simplest HTML tags.
Just to be safe, though, I run the same regular expressions server-
side, and then pass the text through HTMLTidy (well, jTidy, the Java
implementation) with some pretty strict parameters.

HD

unread,
Nov 22, 2010, 4:02:15 AM11/22/10
to MooEditable
Hi,
thank you for help,
one question : where do I need to paste this code ?

Optional question ;) :
Will this kind of feature be implement in the next versions of
mooEditable ?

Thanks

HD

unread,
Nov 25, 2010, 3:57:33 AM11/25/10
to MooEditable
Hi, thanks guy.
So I've made a mix of both of of you codes, and a little mine.
In the implement function of Roparz, I've change the cleanup function
with the one of Barryvan like this :

cleanup: function() {
// To clean up our pasted text, we will check for each tag if it's
authorized or not.
var content = this.mooEditable.getContent().sanitiseWord();
this.mooEditable.setContent(this.mooEditable.cleanup(content));
}

And in the sanatiseWord() function of Barryvan I have made some little
changes :

rs.push(/<(\/)?(meta|link|style|div|head|html|body|span|table|colgroup|
col|tbody|thead|tfoot|tr|td|!\[)[^>]*?>/g);//Unnecessary tags
I allow "font" tag, needed to font color.
And i have removed the line about empty paragraph, sometimes users
want it.

And at the end, to patch an IE issue :
return s;

until :

var el = new Element('span');
return el.set('html', s).get('html'); // Balance unbalanced tags

What could be greater :
transform : <span style="color:#333333;font-size:1em"></span> to <font
color="#333333" size="1em">
Because, if FF is able to remove format of the span, IE didn't and
need "font" tag to do it (M$ -love-…).

Thank you.
Reply all
Reply to author
Forward
0 new messages