javascript

JavaScript: edit web page in browser

Friday, July 11th, 2008

Here is small bookmarklet, which allows to edit the web page for any site (ok, You could save the results on Your local machine only).

javascript:document.body.contentEditable=’true’; document.designMode=’on’; void 0

JavaScript: Soundex implementation

Thursday, April 10th, 2008

There is a special algorithm for comparision strings, which sound similar (Soundex).
Here is JavaScript Soundex implementation:

function soundex ( s_src )
{   
 var s_rez = “0000″ ;
 var new_code, prev, idx
 
 a_codes = { “bfpv”: 1, “cgjkqsxz”:2, “dt”: 3, “l”: 4, “mn”: 5, “r”: 6 };
 
 s_src = s_src.toLowerCase().replace(/ /g,”")
 
 if ( s_src.length < 1) {
   return(s_rez);
 }
 
 s_rez = s_src.substr(0,1);
 prev = [...]

Template for proxy auto-config file

Monday, August 6th, 2007

Proxy autoconfig file could be used in browser (Opera,FireFox,IE) to change the proxy dynamically.
var ALLOWED = “DIRECT”;
var DISALLOWED = “PROXY 0.0.0.0:1234″;
function FindProxyForURL(url, host)
{
if (shExpMatch(url,”*.badsite.com/*”)) {return DISALLOWED;}
var currentTime = new Date();// convert the current time to minutes
var now = 60*currentTime.getHours() + currentTime.getMinutes();
// Do not allow the access before 18:00
if (now < 18 * 60 ) [...]

JavaScript: build table dynamically

Thursday, March 22nd, 2007

<script type=”text/javascript”>
function buildTable(n_rows,n_columns) {
var the_body = document.getElementsByTagName(”body”)[0];
var new_table = document.createElement(”table”);
var new_tbody = document.createElement(”tbody”);
var new_row, new_col, new_text ;
for(row=1;row<=n_rows;row++) {
new_row = document.createElement(”tr”);
new_row.className = “tr”+row ;
for(col=1;col<=n_columns;col++) {
new_col = document.createElement(”td”);
new_col.className = “td”+col ;
new_text = document.createTextNode(”text:” + row + “:” + col );
new_col.appendChild(new_text);
new_row.appendChild(new_col);
}
new_tbody.appendChild(new_row);
}
new_table.appendChild(new_tbody);
new_table.setAttribute(”border”, “2″);
the_body.appendChild(new_table);
return new_table ;
}
</script>
<body>
Example:
<script type=”text/javascript”>
buildTable(4,3)
</script>
</body>
There is also interesting article on oreillynet.com, discussing performance improvement for such operations.

Fading alerts in JavaScript

Thursday, February 15th, 2007

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml” lang=”en” xml:lang=”en”>
<head>
<title>Fade In Text</title>
<style type=”text/css”>
body, table, div{color:#333;font:bold 11px Verdana, Arial, sans-serif;}
.title{background:#F2F2F2;border:1px #CCC solid;padding:5px;text-align:center;}
.tblFade{border:1px #333 solid;width:150px;margin:175px;}
.fadeElem{height:20px;display:block;position:relative;border:1px #CCC solid;padding:3px 10px;}
</style>
<script type=”text/javascript”>
<!–
var fadeSteps = 20;
var fadeDelay = 20;
var nextSetDelay = 1000;
var loopPrepend = true;
var arMessage = new Array(”Fade-In Message 1″, “Fade-In Message 2″, “Fade-In Message 3″, “Fade-In Message 4″, [...]

Rewind caret in a non-empty <textarea>

Sunday, February 19th, 2006

When you TAB into a non-empty <textarea> the caret is usually placed after the last character. Which is not always ok. This JavaScript code deals with this problem for all modern browsers. IE variant needs onfocus and onbeforedeactivate event handlers which are installed with add_handler() function.
function add_handler(element, event_type, func) {
    if (element.attachEvent) {                  // IE
        element.attachEvent(’on’ + event_type, [...]

Keep on coding