Hi, I am writing a script that replaces text smilies with images using <a href="http://userscripts.org/scripts/show/8400">Smilize</a>. It worked right out-of-the-box, but I edited it some (mostly regex) and now it's not working.
Can anyone see what's wrong with this script?
<pre>
<code>
function smilize() {
try {
/*
Regular Expressions to match all the smileys.
// [\(\*\:;8][\w]*[dpo\)\(]?\*?(?![\w])(?![\/\/])
*/
var smileyRegex = /((\*[\d\w]*\*)|[:;][\w()])/gi;
/*
Regular Expression to match smiley if it is at the starting of line.
*/
var smileyAtStartRegex = /^((((?:\*)[:;][\w()](?:\*)|[:;][\w()]))|(\*[\w]*\*))/i;
/*
Regular Expressions to match individual smileys.
*/
var smileysRegex = [ /:\)/ , /;\)/ , /:D/i , /:P/i , /:\(/ , /:o/i , /\*ill\*/i , /\*cool\*/i ,
/\*yawn\*/i , /\*mad\*/i , /\*cry\*/i , /\*blush\*/i , /\*confused\*/i , /\*love\*/i ,
/\*mean\*/i , /\*glad\*/i ];
/*
DATA URIs for holding the smiley image data to be embedded into the page.
Naming convention used is self explanatory.
DATA URI generation courtesy - http://software.hixie.ch/utilities/cgi/data/data
*/
var smileys = [ "data:image/gif;base64,R0lGODlhEYYOhETY0gCIT49 ... (large array of data:uris)" ];
/*
XPath for getting all the text nodes in the html document containing the smileys.
*/
var smileElements = document.evaluate("//text()[not(ancestor::script) "+
"and not(ancestor::style) " +
"and not(ancestor::textarea) " +
"and (contains(., ':)' ) " +
"or contains(., ';)' ) " +
"or contains(., ':D' ) " +
"or contains(., ':d' ) " +
"or contains(., ':P' ) " +
"or contains(., ':p' ) " +
"or contains(., ':(' ) " +
"or contains(., ':o' ) " +
"or contains(., ':O' ) " +
"or contains(., '*cool*' ) " +
"or contains(., '*yawn*' ) " +
"or contains(., '*cry*' ) " +
"or contains(., '*love*' ) " +
"or contains(., '*confused*' ) " +
"or contains(., '*mad*' ) " +
"or contains(., '*ill*' ) " +
"or contains(., '*glad*' ) " +
"or contains(., '*blush*' ) " +
"or contains(., '*mean*' ) ) ] ",
document,
null,
XPathResult.UNORDERED_NODE_SNAPSHOT_TYPE,
null);
/*
Beginning traversing through the element nodes that the XPath expression returned.
I choose to go from last node to first node so as to avoid any discrepancies since
I will be adding nodes to the document and editing it's structure.
*/
for(var i = smileElements.snapshotLength - 1;i >= 0; i--) {
var elm = smileElements.snapshotItem(i);
if(smileyRegex.test(elm.nodeValue)) {
var elmSpan = document.createElement("span");
elm.parentNode.replaceChild(elmSpan, elm);
var text = elm.nodeValue;
/*
Checking if smiley is at the starting of the line.
If found replace it with appropriate smiley and then alter the 'text' of the element
node cached to incorporate it having been replaced by an appropriate smiley.
*/
if(smileyAtStartRegex.test(text)) {
var smiley = smileyAtStartRegex.exec(text);
text = text.substring(text.indexOf(smiley)+smiley.length+1);
var smileyData=getSmiley(smileysRegex, smileys, smiley);
var elmSmile = document.createElement("img");
elmSmile.setAttribute("src", smileyData);
elmSmile.setAttribute("align", "center");
elmSmile.style.border = "none";
elmSpan.appendChild(elmSmile);
}
/*
Setting the Smiley Regular Expression's lastIndex to 0 to start traversing through
all the smileys that occur in the text node using 'exec' function.
*/
smileyRegex.lastIndex = 0;
for(var match = null, lastLastIndex = 0; (match = smileyRegex.exec(text)); ) {
elmSpan.appendChild(document.createTextNode(text.substring(lastLastIndex, match.index)+RegExp.$1));
var smiley = text.substring(match.index,smileyRegex.lastIndex);
var smileyData=getSmiley(smileysRegex, smileys, smiley);
var elmSmile = document.createElement("img");
elmSmile.setAttribute("src", smileyData);
elmSmile.setAttribute("align", "center");
elmSmile.style.border = "none";
elmSpan.appendChild(elmSmile);
lastLastIndex = smileyRegex.lastIndex;
}
elmSpan.appendChild(document.createTextNode(text.substring(lastLastIndex)));
elmSpan.normalize();
}
/*
Case when the smiley at the start is the only smiley in that particular node.
*/
else if(smileyAtStartRegex.test(elm.nodeValue)) {
GM_log(elm.nodeValue);
var elmSpan = document.createElement("span");
elm.parentNode.replaceChild(elmSpan, elm);
var smiley = smileyAtStartRegex.exec(elm.nodeValue);
var smileyData=getSmiley(smileysRegex, smileys, smiley);
var elmSmile = document.createElement("img");
elmSmile.setAttribute("src", smileyData);
elmSmile.setAttribute("align", "center");
elmSmile.style.border = "none";
elmSpan.appendChild(elmSmile);
elmSpan.appendChild(document.createTextNode(elm.nodeValue.substring(elm.nodeValue.indexOf(smiley)+smiley.length+1)));
elmSpan.normalize();
}
}
} catch (e) {
GM_log(e); //Catch and log any errors if encountered during the entire process.
}
}
/*
function to get the appropriate smiley from smileys array, by matching the smiley with
each smileys regular expression.
*/
function getSmiley(smileysRegex, smileys, smiley) {
for(var j=0;j<smileys.length;j++) {
if(smileysRegex[j].test(smiley)) {
return smileys[j];
}
}
}
smilize();
</code>
</pre>
<p>Hi, I am writing a script that replaces text smilies with images using <a href="http://userscripts.org/scripts/show/8400">Smilize</a>. It worked right out-of-the-box, but I edited it some (mostly regex) and now it's not working.</p>
<p>Can anyone see what's wrong with this script?
<br /><pre>
<code>
function smilize() {
try {
/*
Regular Expressions to match all the smileys.
// [\(\*\:;8][\w]*[dpo\)\(]?\*?(?![\w])(?![\/\/])
*/
var smileyRegex = /((\*[\d\w]*\*)|[:;][\w()])/gi;
/*
Regular Expression to match smiley if it is at the starting of line.
*/
var smileyAtStartRegex = /^((((?:\*)[:;][\w()](?:\*)|[:;][\w()]))|(\*[\w]*\*))/i;
/*
Regular Expressions to match individual smileys.
*/
var smileysRegex = [ /:\)/ , /;\)/ , /:D/i , /:P/i , /:\(/ , /:o/i , /\*ill\*/i , /\*cool\*/i ,
/\*yawn\*/i , /\*mad\*/i , /\*cry\*/i , /\*blush\*/i , /\*confused\*/i , /\*love\*/i ,
/\*mean\*/i , /\*glad\*/i ];
/*
DATA URIs for holding the smiley image data to be embedded into the page.
Naming convention used is self explanatory.
DATA URI generation courtesy - http://software.hixie.ch/utilities/cgi/data/data
*/
var smileys = [ "data:image/gif;base64,R0lGODlhEYYOhETY0gCIT49 ... (large array of data:uris)" ];
/*
XPath for getting all the text nodes in the html document containing the smileys.
*/
var smileElements = document.evaluate("//text()[not(ancestor::script) "+
"and not(ancestor::style) " +
"and not(ancestor::textarea) " +
"and (contains(., ':)' ) " +
"or contains(., ';)' ) " +
"or contains(., ':D' ) " +
"or contains(., ':d' ) " +
"or contains(., ':P' ) " +
"or contains(., ':p' ) " +
"or contains(., ':(' ) " +
"or contains(., ':o' ) " +
"or contains(., ':O' ) " +
"or contains(., '*cool*' ) " +
"or contains(., '*yawn*' ) " +
"or contains(., '*cry*' ) " +
"or contains(., '*love*' ) " +
"or contains(., '*confused*' ) " +
"or contains(., '*mad*' ) " +
"or contains(., '*ill*' ) " +
"or contains(., '*glad*' ) " +
"or contains(., '*blush*' ) " +
"or contains(., '*mean*' ) ) ] ",
document,
null,
XPathResult.UNORDERED_NODE_SNAPSHOT_TYPE,
null);
/*
Beginning traversing through the element nodes that the XPath expression returned.
I choose to go from last node to first node so as to avoid any discrepancies since
I will be adding nodes to the document and editing it's structure.
*/
for(var i = smileElements.snapshotLength - 1;i >= 0; i--) {
var elm = smileElements.snapshotItem(i);
if(smileyRegex.test(elm.nodeValue)) {
var elmSpan = document.createElement("span");
elm.parentNode.replaceChild(elmSpan, elm);
var text = elm.nodeValue;
/*
Checking if smiley is at the starting of the line.
If found replace it with appropriate smiley and then alter the 'text' of the element
node cached to incorporate it having been replaced by an appropriate smiley.
*/
if(smileyAtStartRegex.test(text)) {
var smiley = smileyAtStartRegex.exec(text);
text = text.substring(text.indexOf(smiley)+smiley.length+1);
var smileyData=getSmiley(smileysRegex, smileys, smiley);
var elmSmile = document.createElement("img");
elmSmile.setAttribute("src", smileyData);
elmSmile.setAttribute("align", "center");
elmSmile.style.border = "none";
elmSpan.appendChild(elmSmile);
}
/*
Setting the Smiley Regular Expression's lastIndex to 0 to start traversing through
all the smileys that occur in the text node using 'exec' function.
*/
smileyRegex.lastIndex = 0;
for(var match = null, lastLastIndex = 0; (match = smileyRegex.exec(text)); ) {
elmSpan.appendChild(document.createTextNode(text.substring(lastLastIndex, match.index)+RegExp.$1));
var smiley = text.substring(match.index,smileyRegex.lastIndex);
var smileyData=getSmiley(smileysRegex, smileys, smiley);
var elmSmile = document.createElement("img");
elmSmile.setAttribute("src", smileyData);
elmSmile.setAttribute("align", "center");
elmSmile.style.border = "none";
elmSpan.appendChild(elmSmile);
lastLastIndex = smileyRegex.lastIndex;
}
elmSpan.appendChild(document.createTextNode(text.substring(lastLastIndex)));
elmSpan.normalize();
}
/*
Case when the smiley at the start is the only smiley in that particular node.
*/
else if(smileyAtStartRegex.test(elm.nodeValue)) {
GM_log(elm.nodeValue);
var elmSpan = document.createElement("span");
elm.parentNode.replaceChild(elmSpan, elm);
var smiley = smileyAtStartRegex.exec(elm.nodeValue);
var smileyData=getSmiley(smileysRegex, smileys, smiley);
var elmSmile = document.createElement("img");
elmSmile.setAttribute("src", smileyData);
elmSmile.setAttribute("align", "center");
elmSmile.style.border = "none";
elmSpan.appendChild(elmSmile);
elmSpan.appendChild(document.createTextNode(elm.nodeValue.substring(elm.nodeValue.indexOf(smiley)+smiley.length+1)));
elmSpan.normalize();
}
}
} catch (e) {
GM_log(e); //Catch and log any errors if encountered during the entire process.
}
}
/*
function to get the appropriate smiley from smileys array, by matching the smiley with
each smileys regular expression.
*/
function getSmiley(smileysRegex, smileys, smiley) {
for(var j=0;j<smileys></code>
</pre></p>
2008-07-22T00:45:44Z
1
Forum
10784
2877
2008-07-22T00:48:14Z
39648