I have just created a calculator that can be invoked in a page.
Currently, the key combination for invoking the calculator is the Ctrl
Windows key. This shows and hides the calculator. The calculator has a
text area and the user can type in an arithmetic (Validation is pending
for non arithmetic keys) expression and on enter key, the same is
evaluated.
Here is the code
=============================
<html>
<head>
<script language="javascript">
document.onkeyup = KeyCheck;
var calcVisible = false;
function KeyCheck(e)
{
var KeyID = (window.event) ? event.keyCode : e.keyCode;
switch(KeyID)
{
case 91:
if (!calcVisible)
ShowCalc('CalcPlace')
else
HideCalc('CalcPlace');
break;
default:
//alert(KeyID);
}
}
function ShowCalc(ParentId)
{
var
strCalcEl="<div id='calc'><textarea id='calcInput'
style='width:300px; height: 50px;'
onkeydown='EvalCalc(event);'></textarea><br/><input
id='calcResult' type='text' readonly
STYLE='width:300px;'/></div>";
document.getElementById(ParentId).innerHTML=strCalcEl;
calcVisible = true;
document.getElementById("calcInput").focus();
}
function HideCalc(ParentId)
{
document.getElementById(ParentId).innerHTML="";
calcVisible = false;
}
function EvalCalc(e)
{
var KeyID = (window.event) ? event.keyCode : e.keyCode;
switch(KeyID)
{
case 13:
document.getElementById('calcResult').value=eval(document.getElementById("calcInput").value);
break;
default:
//alert(KeyID);
}
}
</script>
</head>
<body>
<div id="CalcPlace" style="width:100%;"></div>
</body>
</html>
=============================
IE non-standard onPropertyChange is a huge problem in most of the places. I was working on a work of moving an application designed to work on IE to a cross-browser standard. For some of the forms, there is a pop up and on the close button of the pop up, it used to update some of the fields in the opener page as:
function fnClose(rowid){
var taxHTML = document.getElementById("taxvalues").innerHTML;
window.opener.document.getElementById("taxvalues").innerHTML=taxHTML;
window.opener.document.getElementById("hdnTax").value=rowid;
//There is a event handler on this element in the opener using "onPropertyChange=fnPopClosed(this.value);"
window.close();
}
There is a hidden field in the opener and onPropertyChange event of the hidden field was handled to accomplish the final task. On the opener page there was a call to a javascript function triggered by the onPropertyChange event of the hidden field. Though IE gracefully handles the situation, Firefox and other browsers have never heard of such an event. So there is no activity.
I studied a lot of techniques to emulate the onPropertyChange event including adding a eventlistener. After around three hours of tweaking different ideas, I finally wired up the same in a different technique. I called the javascript method in the opener page directly from the pop up like this:
function fnClose(rowid){
var taxHTML = document.getElementById("taxvalues").innerHTML;
window.opener.document.getElementById("taxvalues").innerHTML=taxHTML;
window.opener.fnPopClosed(rowid);
window.close();
}
And I got what I wished to have.
Enjoy javascripting....