<html>
<script language="javascript">
   
    op=""; //operadores globais.
    num1="";
    num2="";
    resp="";
   
       function mostra(x){
  
       document.formulario.calculo.value += x; //essa funao vai mostrando os numeros na caixa de texto
       }                                       //e o +- vai concatenando um numero apos o outro   
   
       function coleta(y){
       if(op==""){                             //se o operador for vazio
          op=y;                                //atribui o valor a variavel op o caracter +ou- etc.. conforme o clicado no botao
          num1=document.formulario.calculo.value;//atribui a num1 o valor da caixa de texto
          document.formulario.calculo.value=''; //limpa a caixa de texto
       }
       else{
         alert ("No  possvel realizar duas operaces");//se clicarmos varias vezes no botao operaao aparecera essa mensagem.
       }  
    
    
   
       }
   
       function calcula(){
       if(op==""){
         alert ("Selecione uma operaao");//se apertarmos o = antes do operador o op sera vazio e aparecera esse alert. 
       }
       else{
         num2=document.formulario.calculo.value;//num2 recebe oque esta na caixa de texto.
         resp=num1 + op + num2;//resp recebe o valor do num1+op+num2,exeplo 2+3
         document.formulario.calculo.value=eval(resp);//retorna o valor dos mesmos 2+3 como resposta na caixa de texto devido ao eval
                                                      //se o eval nao estivesse ai apareceria na caixa de texto 2+3.o eval retorna o valor do 2+3 
       }
      
       }

       function novocalculo(){//essa funao permite fazer mais um calculo.
         num1="";//limpa as variaveis
         num2="";
         op="";
         resp="";
         document.formulario.calculo.value="";//limpa a caixa de texto
       }
       function raiz(){//funao que calcula a raiz quadrada
         num1=document.formulario.calculo.value;
         document.formulario.calculo.value='';
         resp=Math.sqrt(num1);//funao em java script que calcula a raiz quadrada
         document.formulario.calculo.value=eval(resp);
       }
       function cos(){//funao que calcula o cosseno
         num1=document.formulario.calculo.value;
         document.formulario.calculo.value='';
         resp=Math.cos(num1);
         document.formulario.calculo.value=eval(resp);
       }
       function sen(){//funao que calcula o seno
         num1=document.formulario.calculo.value;
         document.formulario.calculo.value='';
         resp=Math.sin(num1);
         document.formulario.calculo.value=eval(resp);
       }
       function tan(){//funao que calcula a tangente
         num1=document.formulario.calculo.value;
         document.formulario.calculo.value='';
         resp=Math.tan(num1);
         document.formulario.calculo.value=eval(resp);
       }
       function limpa(){
         document.formulario.calculo.value=""; 
  
       }      
            
   
</script>

<body bgcolor="#000000"> <!--aqui comea o html-->
<center>

 <table border="4" bordercolor="#FF3300">
  <form name="formulario">              <!--aqui foi criado um formulario para a caixa de texto,e um objeto chamado formulario-->
       <input type="text" id="calculo" >
  </form>

  <tr><!--comeo da tabela-->
    <td><input type="button" value="7    " id="botao7" onclick="mostra(7);"></td><!--onclick chama a funao mostra quando clicado-->
    <td><input type="button" value="8    " id="botao8" onclick="mostra(8);"></td>
    <td><input type="button" value="9    " id="botao9" onclick="mostra(9);"></td>
    <td><input type="button" value="+     " id="botao+" onclick="coleta('+');"></td><!--chama a funao coleta-->
    <td><input type="button" value="Sqrt  " id="raiz" onclick="raiz();"></td>       <!--chama a funao raiz-->
  </tr>

  <tr>
   <td><input type="button" value="4    " id="botao4" onclick="mostra(4);"></td>
   <td><input type="button" value="5    " id="botao5" onclick="mostra(5);"></td>
   <td><input type="button" value="6    " id="botao6" onclick="mostra(6);"></td>
   <td><input type="button" value="-      " id="botao-" onclick="coleta('-');"></td>
   <td><input type="button" value="Cos  " id="Cos" onclick="cos();"></td>
  </tr>

  <tr>
   <td><input type="button" value="1    " id="botao1" onclick="mostra(1);"></td>
   <td><input type="button" value="2    " id="botao2" onclick="mostra(2);"></td>
   <td><input type="button" value="3    " id="botao3" onclick="mostra(3);"></td>
   <td><input type="button" value="*      " id="botao*" onclick="coleta('*');"></td>
   <td><input type="button" value="Sen  " id="seno*" onclick="sen();"></td>
  </tr>

  <tr>
   <td><input type="button" value="0    " id="botao0" onclick="mostra(0);"/></td>
   <td><input type="button" value="CE" id="rest" onclick="novocalculo();"/></td>
   <td><input type="button" value="=    " id="botao=" onclick="calcula();"/></td>
   <td><input type="button" value="/      " id="botao/" onclick="coleta('/');"></td>
   <td><input type="button" value="Tan  " id="tangente" onclick="tan();"></td>
  </tr>
  <tr>
    <td><input type="button" value="RS" id="limpa" onclick="limpa();"> </td>
    <td><input type="button" value=".     " id="ponto" onclick="mostra('.');"> </td>
  
  </tr>
 </table>
</center>

<h1><font color="#FFFFFF"><center>Instruoes De Uso</center></font></h1><!--comeo das instruoes-->
<center>
 <font color="#FFFFFF">
    <ul>
      <li>A calculadora s realiza duas operaoes de cada vez,portanto aperte CE cada vez que realizar uma operao para que possa realizar a proxima.
      <li>Para calcular o cos,tan,sen,sqrl digite primeiro o nmero e depois a operaao.
      <li>O resutado do cosseno da tangente e do seno sao mostrados em radianos.
      <li>Use somente o teclado virtual.nao tente digitar os numeros.
      <li>O botao RS limpa a tela.
    </ul>
 </font>
</center>














</body>
</html>
