The source code for the javascript used is :
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
var FKeyPad = document.Keypad;
var Accum = 0;
var FlagNewNum = false;
var PendingOp = "";
function NumPressed (Num) {
if (FlagNewNum) {
FKeyPad.ReadOut.value = Num;
FlagNewNum = false;
}
else {
if (FKeyPad.ReadOut.value == "0")
FKeyPad.ReadOut.value = Num;
else
FKeyPad.ReadOut.value += Num;
}
}
function Operation (Op) {
var Readout = FKeyPad.ReadOut.value;
if (FlagNewNum && PendingOp != "=");
else
{
FlagNewNum = true;
if ( '+' == PendingOp )
Accum += parseFloat(Readout);
else if ( '-' == PendingOp )
Accum -= parseFloat(Readout);
else if ( '/' == PendingOp )
Accum /= parseFloat(Readout);
else if ( '*' == PendingOp )
Accum *= parseFloat(Readout);
else
Accum = parseFloat(Readout);
FKeyPad.ReadOut.value = Accum;
PendingOp = Op;
}
}
function Decimal () {
var curReadOut = FKeyPad.ReadOut.value;
if (FlagNewNum) {
curReadOut = "0.";
FlagNewNum = false;
}
else
{
if (curReadOut.indexOf(".") == -1)
curReadOut += ".";
}
FKeyPad.ReadOut.value = curReadOut;
}
function ClearEntry () {
FKeyPad.ReadOut.value = "0";
FlagNewNum = true;
}
function Clear () {
Accum = 0;
PendingOp = "";
ClearEntry();
}
function Neg () {
FKeyPad.ReadOut.value = parseFloat(FKeyPad.ReadOut.value) * -1;
}
function Percent () {
FKeyPad.ReadOut.value = (parseFloat(FKeyPad.ReadOut.value) / 100) * parseFloat(Accum);
}
// End -->
</script>
The Calculator frame-code is as follows :
<form method="post" action="" novalidate="novalidate" data-form="preview" name="Keypad" id="docContainer" class="fb-100-item-column fb-toplabel selected-object" style="BACKGROUND-IMAGE: none; BORDER-BOTTOM-COLOR: #00ffff; BACKGROUND-COLOR: #dbfbff; BORDER-TOP-COLOR: #00ffff; WIDTH: 600px; FONT-FAMILY: arial; BORDER-RIGHT-COLOR: #00ffff; BORDER-LEFT-COLOR: #00ffff; TOP: 0px;">
<p id="body">
<CENTER>
<B>
<TABLE border=0 width=470 height=361 cellpadding=1 cellspacing=5>
<TR bordercolor="#000000">
<TD height="58" colspan=6 align=left bgcolor="#CCFF66"><b><font color="#0066FF" size="+3"> Calculator v1 </font></b> <b>by, Sushant Kumar Gupta</b></TD>
</TR>
<TR bordercolor="#FFFFFF">
<TD height="21" colspan=3 align=middle> </TD>
<td width="21"></TD>
<TD colspan="2"> </TD>
</TR>
<TR bordercolor="#FFFFFF">
<TD height="26" colspan=6 align=middle><input name="ReadOut" type="Text" size=5 value="0" width=100% onmousedown="this.value=''"></TD>
</TR>
<TR bordercolor="#FFFFFF" align="center">
<TD height="21" colspan="3"> </TD>
<TD></TD>
<TD colspan="2" valign="middle"> </TD>
</TR>
<TR bordercolor="#FFFFFF" align="center">
<TD height="22" colspan="3" bgcolor="#FF9933"><font color="#FFFFFF"> Numbers to use while calculation:</font></TD>
<TD></TD>
<TD colspan="2" bgcolor="#00CCFF" valign="middle"><font color="#FFFFFF">Operators : </font></TD>
</TR>
<TR bordercolor="#FFFFFF" align="center">
<TD height="21" align="center"> </TD>
<TD align="center"> </TD>
<TD align="center"> </TD>
<TD></TD>
<TD> </TD>
<TD> </TD>
</TR>
<TR bordercolor="#FFFFFF" align="center">
<TD width="95" height="28" bgcolor="#99FF99" align="center"><input name="btnSeven" type="Button" value=" 7 " onClick="NumPressed(7)" width="300" class="button"></TD>
<TD width="103" bgcolor="#99FF99" align="center"><input name="btnEight" type="Button" value=" 8 " onClick="NumPressed(8)" class="button"></TD>
<TD width="97" bgcolor="#99FF99" align="center"><input name="btnNine" type="Button" value=" 9 " onClick="NumPressed(9)" class="button"></TD>
<TD></TD>
<TD width="53" bgcolor="#CC66FF"><input name="btnPlus" type="Button" value=" + " onClick="Operation('+')"></TD>
<TD width="54" bgcolor="#CC66FF"><input name="btnMinus" type="Button" value=" - " onClick="Operation('-')"></TD>
</TR>
<TR align="center">
<TD height="26" bgcolor="#99FF99"><input name="btnFour" type="Button" value=" 4 " onClick="NumPressed(4)" class="button"></TD>
<TD bgcolor="#99FF99"><input name="btnFive" type="Button" value=" 5 " onClick="NumPressed(5)" class="button"></TD>
<TD bgcolor="#99FF99"><input name="btnSix" type="Button" value=" 6 " onClick="NumPressed(6)" class="button"></TD>
<TD></TD>
<TD align=middle bgcolor="#CC66FF"><input name="btnMultiply" type="Button" value=" * " onClick="Operation('*')"></TD>
<TD align=middle bgcolor="#CC66FF"><input name="btnDivide" type="Button" value=" / " onClick="Operation('/')"></TD>
</TR>
<TR align="center">
<TD height="26" bgcolor="#99FF99"><input name="btnOne" type="Button" value=" 1 " onClick="NumPressed(1)" class="button"></TD>
<TD bgcolor="#99FF99"><input name="btnTwo" type="Button" value=" 2 " onClick="NumPressed(2)" class="button"></TD>
<TD bgcolor="#99FF99"><input name="btnThree" type="Button" value=" 3 " onClick="NumPressed(3)" class="button"></TD>
<TD></TD>
<TD colspan="2" align=middle valign="middle"> </TD>
</TR>
<TR align="center">
<TD height="26" bgcolor="#99FF99"><input name="btnZero" type="Button" value=" 0 " onClick="NumPressed(0)" class="button"></TD>
<TD bgcolor="#99FF99"><input name="btnDecimal" type="Button" class="button" onClick="Decimal()" value=" . "></TD>
<TD bgcolor="#99FF99"><input name="btnNeg" type="Button" class="button" onClick="Neg()" value=" +/- "></TD>
<TD></TD>
<TD colspan="2" align=middle bgcolor="#00CCFF" valign="middle"><font color="#FFFFFF">Calculate : </font></TD>
</TR>
<TR align="center">
<TD height="26" colspan="3" bgcolor="#99FF99"><input name="btnClear" type="Button" value=" Reset all Values " onClick="Clear()"></TD>
<TD></TD>
<TD bgcolor="#CC66FF"><input name="btnEquals" type="Button" value=" = " onClick="Operation('=')"></TD>
<TD bgcolor="#CC66FF"><input name="btnPercent" type="Button" value=" % " onClick="Percent()"></TD>
</TR>
</TABLE>
</B>
<p><strong>Important Note :</strong> <em>Please only use keys provided. Dont use Keyboard.</em> </p>
</CENTER>
<p align="center"><a id="fb-link-logo1" class="fb-link-logo" href="" target="_blank"><img style="display: none;" id="fb-logo1" class="fb-logo" title="Alternative text" alt="Alternative text" src="index_files/image_default.png"></a></form>
<p id="body">
<CENTER>
<B>
<TABLE border=0 width=470 height=361 cellpadding=1 cellspacing=5>
<TR bordercolor="#000000">
<TD height="58" colspan=6 align=left bgcolor="#CCFF66"><b><font color="#0066FF" size="+3"> Calculator v1 </font></b> <b>by, Sushant Kumar Gupta</b></TD>
</TR>
<TR bordercolor="#FFFFFF">
<TD height="21" colspan=3 align=middle> </TD>
<td width="21"></TD>
<TD colspan="2"> </TD>
</TR>
<TR bordercolor="#FFFFFF">
<TD height="26" colspan=6 align=middle><input name="ReadOut" type="Text" size=5 value="0" width=100% onmousedown="this.value=''"></TD>
</TR>
<TR bordercolor="#FFFFFF" align="center">
<TD height="21" colspan="3"> </TD>
<TD></TD>
<TD colspan="2" valign="middle"> </TD>
</TR>
<TR bordercolor="#FFFFFF" align="center">
<TD height="22" colspan="3" bgcolor="#FF9933"><font color="#FFFFFF"> Numbers to use while calculation:</font></TD>
<TD></TD>
<TD colspan="2" bgcolor="#00CCFF" valign="middle"><font color="#FFFFFF">Operators : </font></TD>
</TR>
<TR bordercolor="#FFFFFF" align="center">
<TD height="21" align="center"> </TD>
<TD align="center"> </TD>
<TD align="center"> </TD>
<TD></TD>
<TD> </TD>
<TD> </TD>
</TR>
<TR bordercolor="#FFFFFF" align="center">
<TD width="95" height="28" bgcolor="#99FF99" align="center"><input name="btnSeven" type="Button" value=" 7 " onClick="NumPressed(7)" width="300" class="button"></TD>
<TD width="103" bgcolor="#99FF99" align="center"><input name="btnEight" type="Button" value=" 8 " onClick="NumPressed(8)" class="button"></TD>
<TD width="97" bgcolor="#99FF99" align="center"><input name="btnNine" type="Button" value=" 9 " onClick="NumPressed(9)" class="button"></TD>
<TD></TD>
<TD width="53" bgcolor="#CC66FF"><input name="btnPlus" type="Button" value=" + " onClick="Operation('+')"></TD>
<TD width="54" bgcolor="#CC66FF"><input name="btnMinus" type="Button" value=" - " onClick="Operation('-')"></TD>
</TR>
<TR align="center">
<TD height="26" bgcolor="#99FF99"><input name="btnFour" type="Button" value=" 4 " onClick="NumPressed(4)" class="button"></TD>
<TD bgcolor="#99FF99"><input name="btnFive" type="Button" value=" 5 " onClick="NumPressed(5)" class="button"></TD>
<TD bgcolor="#99FF99"><input name="btnSix" type="Button" value=" 6 " onClick="NumPressed(6)" class="button"></TD>
<TD></TD>
<TD align=middle bgcolor="#CC66FF"><input name="btnMultiply" type="Button" value=" * " onClick="Operation('*')"></TD>
<TD align=middle bgcolor="#CC66FF"><input name="btnDivide" type="Button" value=" / " onClick="Operation('/')"></TD>
</TR>
<TR align="center">
<TD height="26" bgcolor="#99FF99"><input name="btnOne" type="Button" value=" 1 " onClick="NumPressed(1)" class="button"></TD>
<TD bgcolor="#99FF99"><input name="btnTwo" type="Button" value=" 2 " onClick="NumPressed(2)" class="button"></TD>
<TD bgcolor="#99FF99"><input name="btnThree" type="Button" value=" 3 " onClick="NumPressed(3)" class="button"></TD>
<TD></TD>
<TD colspan="2" align=middle valign="middle"> </TD>
</TR>
<TR align="center">
<TD height="26" bgcolor="#99FF99"><input name="btnZero" type="Button" value=" 0 " onClick="NumPressed(0)" class="button"></TD>
<TD bgcolor="#99FF99"><input name="btnDecimal" type="Button" class="button" onClick="Decimal()" value=" . "></TD>
<TD bgcolor="#99FF99"><input name="btnNeg" type="Button" class="button" onClick="Neg()" value=" +/- "></TD>
<TD></TD>
<TD colspan="2" align=middle bgcolor="#00CCFF" valign="middle"><font color="#FFFFFF">Calculate : </font></TD>
</TR>
<TR align="center">
<TD height="26" colspan="3" bgcolor="#99FF99"><input name="btnClear" type="Button" value=" Reset all Values " onClick="Clear()"></TD>
<TD></TD>
<TD bgcolor="#CC66FF"><input name="btnEquals" type="Button" value=" = " onClick="Operation('=')"></TD>
<TD bgcolor="#CC66FF"><input name="btnPercent" type="Button" value=" % " onClick="Percent()"></TD>
</TR>
</TABLE>
</B>
<p><strong>Important Note :</strong> <em>Please only use keys provided. Dont use Keyboard.</em> </p>
</CENTER>
<p align="center"><a id="fb-link-logo1" class="fb-link-logo" href="" target="_blank"><img style="display: none;" id="fb-logo1" class="fb-logo" title="Alternative text" alt="Alternative text" src="index_files/image_default.png"></a></form>