<!--
Document : Calculatorulator
Created on : Feb 4, 2009, 10:00:27 PM
Author : COMP-E
Class: 2/5/09
-->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title></title>
<meta http-equiv= "Content-Type" content= "text/html; charset=UTF-8">
<link rel="stylesheet" type="text/css" href="fluidity.css" />
<style id="sty">
input.number {
color: red;
height: auto;
width: 40px;
}
input.bigbutton {
height: auto;
width: 85px;
}
input.regbutton {
height: auto;
width: 40px;
}
button.regbutton {
height: auto;
width: 40px;
font-size: 10px;
}
input.display{
text-align: right;
background-color: LightBlue;
color: black;
}
input.func{
height: auto;
width: 40px;
font-size: 10px;
}
tbl{
background-image: url('tablebg.jpg');
background-repeat: repeat;
border: 4px;
}
body {
margin: 0;
padding: 0;
background: #669966;
text-align: justify;
font: 13px "Trebuchet MS", Arial, Helvetica, sans-serif;
color: #7F7772;
}
#content {
top: 100px;
left: 300px;
position: absolute;
}
</style>
<script type ="text/javascript">
var shft = -1;
function abs(){
var a = document.getElementById("result");
a.value = Math.abs(a.value);
}
function sin(){
var a = document.getElementById("result");
if(shft == 1)
a.value = Math.sin(a.value);
else
a.value = Math.asin(a.value);
}
function cos(){
var a = document.getElementById("result");
if(shft == 1)
a.value = Math.cos(a.value);
else
a.value = Math.acos(a.value);
}
function tan(){
var a = document.getElementById("result");
if(shft == 1)
a.value = Math.tan(a.value);
else
a.value = Math.atan(a.value);
}
function square(a){
if(shft == 1)
x = Math.sqrt(a)
else
x = Math.pow(a,2);
return(x);
}
function cel(a){
if(shft == 1)
x = Math.floor(a)
else
x = Math.ceil(a);
return(x);
}
function shift(){
if(shft == -1){
document.getElementById("sn").style.backgroundColor = "#33cc99";
document.getElementById("cs").style.backgroundColor = "#33cc99";
document.getElementById("tn").style.backgroundColor = "#33cc99";
document.getElementById("fn").style.backgroundColor = "#33cc99";
document.getElementById("sq").style.backgroundColor = "#33cc99";
document.getElementById("cl").style.backgroundColor = "#33cc99";
document.getElementById("sn").value = "ASIN";
document.getElementById("cs").value = "ACOS";
document.getElementById("tn").value = "ATAN";
document.getElementById("sq").value = "√x";
document.getElementById("cl").value = " ⌊ ⌋ ";
}
else{
document.getElementById("sn").style.backgroundColor = "";
document.getElementById("cs").style.backgroundColor = "";
document.getElementById("tn").style.backgroundColor = "";
document.getElementById("fn").style.backgroundColor = "";
document.getElementById("sq").style.backgroundColor = "";
document.getElementById("cl").style.backgroundColor = "";
document.getElementById("sn").value = "SIN";
document.getElementById("cs").value = "COS";
document.getElementById("tn").value = "TAN";
document.getElementById("sq").value = "x²";
document.getElementById("cl").value = " ⌈ ⌉ ";
}
shft *= -1;
}
function pie(){
return(Math.PI);
}
function al(){
alert("HELP");
}
</script>
<script>
var dragObj = new Object();
dragObj.zIndex = 0;
var offsetX, offsetY, isDragging = false;
var x;
var dragObj = new Object();
var minX = 20;
var maxX = 600;
var minY = 20;
var maxY = 600;
document.onmousemove = dragMouse;
document.onmouseup = releaseMouse;
function dragStart(btn,evt){
var st;
dragObj = btn;
dragObj.stNode = evt.target;
var dragX = btn.offsetLeft;
var dragY = btn.offsetTop;
var mouseX = evt.clientX + window.scrollX;
var mouseY = evt.clientY + window.scrollY;
offsetX = mouseX - dragX;
offsetY = mouseY - dragY;
isDragging = true;
return false;
}
function dragMouse(evt) {
if (!isDragging) return;
var newX = evt.clientX - offsetX;
var newY = evt.clientY - offsetY;
var tmp = (newX + "px");
dragObj.style.left = (newX + "px");
dragObj.style.top = (newY + "px");
return false;
}
function releaseMouse() {
if (!isDragging) return;
isDragging = false;
return false;
}
function al(){
alert("HELLO");
}
</script>
</head>
<body class="body">
<div id = "content" onmousedown ="dragStart(this,event)">
<p> </p><p> </p><p> </p><p> </p><p> </p><p> </p>
<form name = "Calculator" onmousedown ="dragStart(this,event)">
<table style = "background: #000000 url(img13.jpg) repeat top left; border: 1px orange solid;" >
<tr>
<input type = "hidden">
</tr>
<tr>
<td>
<input id ="result" class = "display" type = "text" name = "display" Size= "22" value = "" disabled = "true">
<br>
</td>
</tr>
<tr class ="tbl">
<td>
<input class = "func" type = "button" name = "ABS" value = " ABS " OnClick = "abs()">
<input id = "sn" class = "func" type = "button" name = "SIN" value = " SIN " OnClick = "sin()" >
<input id = "cs" class = "func" type = "button" name = "COS" value = " COS " OnClick = "cos()">
<input id = "tn" class = "func" type = "button" name = "TAN" value = " TAN " OnClick = "tan()">
<input id = "fn" class = "func" type = "button" name = "FUN" value = " FUNC " OnClick = "shift()">
<br>
<input class = "number" type = "button" name = "seven" value = " 7 " OnClick = "Calculator.display.value += '7'">
<input class = "number" type = "button" name = "eight" value = " 8 " OnClick = "Calculator.display.value += '8'">
<input class = "number" type = "button" name = "nine" value = " 9 " OnClick = "Calculator.display.value += '9'">
<input class = "regbutton" type = "button" name = "div" value = " / " OnClick = "Calculator.display.value += ' / '; Calculator.decm.disabled = false;">
<input class = "number" type = "button" name = "pi" value = " П " OnClick = "Calculator.display.value += pie()">
<br>
<input class = "number" type = "button" name = "four" value = " 4 " OnClick = "Calculator.display.value += '4'">
<input class = "number" type = "button" name = "five" value = " 5 " OnClick = "Calculator.display.value += '5'">
<input class = "number" type = "button" name = "six" value = " 6 " OnClick = "Calculator.display.value += '6'">
<input class = "regbutton" type = "button" name = "times" value = " * " OnClick = "Calculator.display.value += ' * '; Calculator.decm.disabled = false;">
<input id = "sq" class ="regbutton" type = "button" name = "sqrt" value = "x²" OnClick ="Calculator.display.value = eval(square(Calculator.display.value));">
<br>
<input class = "number" type = "button" name = "one" value = " 1 " OnClick = "Calculator.display.value += '1'">
<input class = "number" type = "button" name = "two" value = " 2 " OnClick = "Calculator.display.value += '2'">
<input class = "number" type = "button" name = "three" value = " 3 " OnClick = "Calculator.display.value += '3'">
<input class = "regbutton" type = "button" name = "minus" value = " - " OnClick = "Calculator.display.value += ' - '; Calculator.decm.disabled = false;">
<input id = "cl" class = "regbutton" type = "button" name = "cl" value = " ⌈ ⌉ " OnClick = "Calculator.display.value = cel(Calculator.display.value)">
<br>
<input class = "number" type = "button" name = "zero" value = " 0 " OnClick = "Calculator.display.value += '0'">
<input class = "regbutton" type = "button" name = "decm" value = " . " OnClick = "Calculator.display.value += '.'; Calculator.decm.disabled = true;">
<input class = "regbutton" type = "button" name = "sign" value = " +/- " OnClick = "Calculator.display.value = eval(Calculator.display.value * -1)">
<input class = "regbutton" type = "button" name = "plus" value = " + " OnClick = "Calculator.display.value += ' + '; Calculator.decm.disabled = false;">
<input class = "regbutton" type = "button" name = "mod" value = " ( " OnClick = "Calculator.display.value += '('">
<br>
<input class = "bigbutton" type = "button" name = "clear" value = " c " OnClick = "Calculator.display.value = ''; Calculator.decm.disabled= false;">
<input class = "bigbutton" type = "button" name = "DoIt" value = " = " OnClick = "Calculator.display.value = eval(Calculator.display.value); Calculator.decm.disabled = false;">
<input class = "regbutton" type = "button" name = "mod" value = " ) " OnClick = "Calculator.display.value += ')'">
<br>
</td>
</tr>
</table>
</form>
</div>
</body>
</html>
