/**
On a current project, where accessibility is essential, I have integrated a stylesheet switcher on two pages where a mouseover affect on an image montage displays an introduction to each page in a separate box below the montage. The montage is structurally defined as a definition list, since it is a visual representation of links to pages on the site, with a brief description of each page. The stylesheet switcher allows users to switch the view to an actual list representation, if, for example, they are using only the keyboard. For CSS-enabled browsers without Javascript, the switcher loads a fresh page with the list display, and for non-display browsers the montage is just represented as a list from the outset.

While, I hope this will be effective under most conditions, I found a frustrating problem with supplementing the onclick event with an onkeypress event for keyboard users in Mozilla and co. When tabbing through the links on the page, as soon as the user tabs off the switcher (containing the event handler) the key press event is triggered. Well, of course, this is the correct behaviour, but Inte$net Exploder actually only triggers the event when the Return key is pressed, which is misleading to the developer, and incorrect interpretation.

The solution was to integrate a filter function that is called by the onkeypress event and this in turn only calls the style switcher function if the key pressed was Return

Here is the code:


function checkKeyPressed(evt, func, params)
{
  evt = (evt) ? evt : (window.event) ? event : null;
  if (evt)
  {
    var charCode = (evt.charCode) ? evt.charCode :
                   ((evt.keyCode) ? evt.keyCode :
                   ((evt.which) ? evt.which : 0));
    if (charCode == 13) func(params);
  }    
}

Where 13 is the ASCII value for the Return key. As well as passing the event as argument, I passed the function to be called and its parameters, to make the function generic. The scenario is just as relevant if using the event handlers to open a new window from a link (although this is strongly discouraged). The resulting anchor is as follows:


<a href="#" onclick="setStyleSheet('sheet'); return false;"
onkeypress="checkKeyPressed(event, setStyleSheet, 'sheet');"
>Switch to List View</a>

It is important that a false value is not returned in the key press event since this would prevent the user from tabbing beyond the style switcher link. The DHTML cookbook suggests the key detection in the filter should work in Netscape and Exploder back to v.4. It resolved the issue for this project.

*/
function checkKeyPressed(evt, func, params)
{
  evt = (evt) ? evt : (window.event) ? event : null;
  if (evt)
  {
    var charCode = (evt.charCode) ? evt.charCode :
                   ((evt.keyCode) ? evt.keyCode :
                   ((evt.which) ? evt.which : 0));
    if (charCode == 13) func(params);
  }    
}

////////

function removeSpaces(string) {
	var tstring = "";
	string = '' + string;
	splitstring = string.split(" ");
	for(i = 0; i < splitstring.length; i++)
	tstring += splitstring[i];
	return tstring;
}

///////////////////////////////


function isArray(obj) {
   if(!obj)	
	  return false;
	  
   if (obj.constructor.toString().indexOf("Array") == -1)
      return false;
   else
      return true;
}

/**
* email kontrol eder. doğru bir girişse true, yanlışsa false döner
*/

function isValidEmail(emailAdayi){
	
	var reg_email = /^[a-zA-Z0-9]+[_a-zA-Z0-9-]*(\.[_a-z0-9-]+)*@.+\..+$/;
	
	if(emailAdayi.value == ''){
		return false;
	}
	
	if(!reg_email.test(emailAdayi)){
		return false;
	}
	
	if(emailAdayi.charAt(emailAdayi.length-1)=='.'){
		return false;
	}
	
	return true;
}//

/**
* bir stringin bir string parçacığını barındırıp barındırmadığını kontrol eder
* @PARAMS;
* needle :  aranacak olan string
* haystack : içerisinde arama yapılacak olan string
* @RETURN;
* varsa boolean true, yoksa false döner
*/
function str_contains(needle, haystack){
	if(haystack.indexOf(needle) == -1) return false;
	else return true;
}//end function str_contains()

/** bir stringin, bir dizi içerisindeki bütün string parçalarını barındırıp barındırmadığını kontrol eder
* @PARAMS;
* needleArray : içerisindeki string parçaları aranacak olan array
* haystack : içerisinde aram yapılacak olan string
*
* @RETURN;
*  needleArray bir dizi değilse 1 döner.
*  needleArray'in eleman sayısı 0 ise 2 döner
*  needleArray içindeki parçalardan biri yoksa boolean false, hepsi varsa true döner
*/

function str_containsAll(needleArray, haystack){
	if(!isArray(needleArray)) return 1;
	
	var arrLen = needleArray.length;
	if(arrLen == 0) return 2;
	
	var i=0;
	
	for(i=0; i<arrLen; i++){
		if(haystack.indexOf(needleArray[i]) == -1) return false;
	}//end for
	
	return true;
}//end function str_containsAll()

/**
* bir dizinin içindeki herhangi bir elemanın bir stringde geçip geçmediğini kontrol eder
* @PARAMS;
* needleArray : içerisindeki string parçaları aranacak olan array
* haystack : içerisinde aram yapılacak olan string
*
* @RETURN;
*  needleArray bir dizi değilse 1 döner.
*  needleArray'in eleman sayısı 0 ise 2 döner
*  needleArray içindeki parçalardan herhangi biri varsa boolean false, hiçbiri yoksa true döner
*/

function str_containsNone(needleArray, haystack){
	if(!isArray(needleArray)) return 1;
	
	var arrLen = needleArray.length;
	if(arrLen == 0) return 2;
	
	var i=0;
	
	for(i=0; i<arrLen; i++){
		if(haystack.indexOf(needleArray[i]) != -1) return false;
	}//end for
	
	return true;
}//end function str_containsNone()


/**
*
* Javascript trim, ltrim, rtrim
* http://www.webtoolkit.info/
*
*
**/

function trim(str, chars) {
    return ltrim(rtrim(str, chars), chars);
}

function ltrim(str, chars) {
    chars = chars || "\\s";
    return str.replace(new RegExp("^[" + chars + "]+", "g"), "");
}

function rtrim(str, chars) {
    chars = chars || "\\s";
    return str.replace(new RegExp("[" + chars + "]+$", "g"), "");
}

function resetForm(form_id){
	var form = document.getElementById(form_id);
	var len = form.length;
	var i=0;
	
	for(i=0; i<len; i++){
		if(form[i].type != 'submit'){
			form[i].value = '';
		}
	}
}

/**
form elemanlarını disabled yapar
*/
function disableForm(form_id){
	var form = document.getElementById(form_id);
	var i=0;
	
	for(i = 0; i<form.length; i++){
		
		form[i].disabled = true;
	}
}//end function disableForm()

/**
form elemanlarını enabled yapar
*/
function enableForm(form_id){
	var form = document.getElementById(form_id);
	var i=0;
	
	for(i = 0; i<form.length; i++){
		
		form[i].disabled = false;
	}
}//end function enableForm()





/** form doğrulama fonksiyonları  **/
function box_isEmpty(box_id,message){
	var box = document.getElementById(box_id);
	if(trim(box.value) == ''){
		alert(message);
		box.focus();
		return true;
	}
	
	return false;
}//end function box_isEmpty();

function box_isNumeric(box_id,message_ifempty,message_ifnotnumeric){
	var box = document.getElementById(box_id);
	
	if(box.value == ''){
		alert(message_ifempty);
		box.focus();
		return false;
	}
	
	if(box.value.replace(/0/g,'') != parseInt(box.value.replace(/0/g,''))){
		alert(message_ifnotnumeric);
		box.focus();
		return false;
	}
	
	return true;
}//end function box_isNumeric();

function box_isNumericIdentity(box_id,message, defaultLength, defaultLength_message){
	var box = document.getElementById(box_id);
	
	if(box.value.replace(/0/g,'') != parseInt(box.value.replace(/0/g,''))){
		alert(message);
		box.focus();
		return false;
	}
	
	if(defaultLength){
		if(trim(box.value).length != defaultLength){
			alert(defaultLength_message);
			box.focus();
			return false;
		}
	}
	
	return true;
}//end function box_isNumericIdentity()


function box_isValidPassword(passBox_id, passRepeatBox_id, message_1, message_2){
	var box1 = document.getElementById(passBox_id);
	
	if(trim(box1.value) == ''){
		alert(message_1);
		box1.focus();
		return false;
	}
	
	if(box1.value != document.getElementById(passRepeatBox_id).value){
		alert(message_2);
		document.getElementById(passRepeatBox_id).focus();
		return false;
	}
	
	return true;
}//end function box_isValidPassword()


function box_isEmail(box_id, message){
	var box = document.getElementById(box_id);
	
	if(!isValidEmail(box.value)){
		alert(message);
		box.focus();
		return false;
	}
	
	return true;
}//end function box_isEmail();


var charset = "ABCÇDEFGĞHIİJKLMNOÖPQRSŞTUÜVWXYZabcçdefgğhiıjklmnoöpqrsştuüvwxyz ,.";
var ad_charset = "ABCÇDEFGĞHIİJKLMNOÖPQRSŞTUÜVWXYZabcçdefgğhiıjklmnoöpqrsştuüvwxyz ";

var numcharset = "0123456789";
var tel_charset = "0123456789 ";

function kontrol(target) {
	oldvalue = target.value;
	StrLen = oldvalue.length;
	var tempy = '';
	
	for (a=0; a < StrLen; a++) {
	
	if (charset.indexOf(oldvalue.charAt(a)) != -1) tempy += oldvalue.charAt(a);
	}
	if (oldvalue != tempy) target.value = tempy;
}


function num_kontrol(target) {
	oldvalue = target.value;
	StrLen = oldvalue.length;
	var tempy = '';
	
	for (a=0; a < StrLen; a++) {
	if (numcharset.indexOf(oldvalue.charAt(a)) != -1) tempy += oldvalue.charAt(a);
	}
	if (oldvalue != tempy) target.value = tempy;
}

function tel_kontrol(target) {
	oldvalue = target.value;
	StrLen = oldvalue.length;
	var tempy = '';
	
	for (a=0; a < StrLen; a++) {
	if (tel_charset.indexOf(oldvalue.charAt(a)) != -1) tempy += oldvalue.charAt(a);
	}
	if (oldvalue != tempy) target.value = tempy;
}

function ad_kontrol(target){
	var oldvalue = target.value;
	var StrLen = oldvalue.length;
	var tempy = '';
	
	for (a=0; a < StrLen; a++) {
	
	if (ad_charset.indexOf(oldvalue.charAt(a)) != -1) tempy += oldvalue.charAt(a);
	}
	if (oldvalue != tempy) target.value = tempy;
}//end function ad_kontrol()