PDA

View Full Version : word replacement var issues



bfinoradin
09-25-2010, 12:18 AM
I am altering a "bad word filter" for a silly project. Not looking to actually filter bad words. Here's what I have right now:



function filterText(sText) {

var rad1 = /dumb|lame/gi;
return sText.replace(rad1, "TOTALLY RAD!");


}



function showText() {
var oInput1 = document.getElementById("txt1");
var oInput2 = document.getElementById("txt2");
oInput2.value = filterText(oInput1.value);
}


So if the user types the words "dumb" or "lame" it is replaced by "TOTALLY RAD!"

The thing is, I want each word replaced to have it's own unique replacement word. I.e. "dumb" gets replaced by "cool" and "lame" gets replaced by "awesome"

Is there a way to define multiple replacements within sText.replace() similar to the way that I'm defining multiple words to be replaced: /dumb|lame/

I also tried just duplicating the var and return lines with their own unique var, etc. and that didn't work.

Am I approaching this from the wrong angle? Does it make more sense to use string?

This is how it will be implemented: http://benfinoradin.info/yes.htm
type into the top text box… try a sentence with "dumb" or "lame" in it.

jscheuer1
09-25-2010, 04:15 AM
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Untitled Document</title>

<script type="text/javascript">
function filterText(sText){
var regExes = filterText.regExes, i = regExes.length - 1;
for (i; i > -1; --i){
sText = sText.replace(regExes[i][0], regExes[i][1]);
}
return sText;
}
filterText.regExes = [[/dumb/gi, 'cool'], [/lame/gi, 'awesome']];

function showText(){
var oInput1 = document.getElementById('txt1');
var oInput2 = document.getElementById('txt2');
oInput2.value = filterText(oInput1.value);
}
</script>
<style type="text/css">
.stizzy {
font-family: arial, helvetica, sans-serif;
font-size: 24px;
}

p {
text-align: center;
margin: 2em 0 0 0;
}
</style>
</head>

<body>
<p>
<textarea cols="50" rows="10" class="stizzy" id="txt1" onchange="showText();" onmousemove="showText();" onkeyup="showText();"></textarea><br>
<textarea cols="50" rows="10" class="stizzy" id="txt2" onchange="showText();" onmousemove="showText();" onkeyup="showText();"></textarea>
</p>
</body>
</html>

bfinoradin
09-25-2010, 02:26 PM
thank you kind sir!

jscheuer1
09-25-2010, 04:00 PM
This is more efficient, and easier to configure and expand:


<script type="text/javascript">
(function(){
var bad = /(dumb|lame)/gi;
function toGood(a){
var lc = a.toLowerCase();
return (
lc === 'dumb'? 'cool' :
lc === 'lame'? 'awesome' :
'');
}
String.prototype.badToGood = function(){return this.replace(bad, toGood);};
})();

function showText(){
var oInput1 = document.getElementById('txt1').value;
var oInput2 = document.getElementById('txt2');
oInput2.value = oInput1.badToGood();
}
</script>

Note: Works in all modern browsers. However, in IE 5 and less there is no support for function as the replacement argument.

bfinoradin
09-26-2010, 08:00 PM
Thanks again John - this is working great!

I'm not sure if this would be possible to do only within the regex, but how would I tell the script to add punctuation and change to all caps if it doesn't find anything to replace?

jscheuer1
09-26-2010, 11:04 PM
Add punctuation where, according to what criteria?

You can easily change it all to upper case if no match is found, change:


String.prototype.badToGood = function(){return this.replace(bad, toGood);};

to:


String.prototype.badToGood = function(){return !bad.test(this)? this.toUpperCase() : this.replace(bad, toGood);};