index.html

<!DOCTYPE html>
<html manifest="manifest.appcache" lang="pt-br">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
    <script>
    if (window.applicationCache) {
    	applicationCache.addEventListener('updateready', function() {
	        if (confirm('Uma nova versão está disponível. Mostrar agora?')) {
            	window.location.reload();
        	}
    	});
	}
    </script>

    <title>Calculadora da Jana</title>

    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-status-bar-style" content="black" />
    <link rel="shortcut icon" href="calculator.ico">
    <link rel="apple-touch-icon" href="calculator-128.png">

    <link rel="stylesheet" href="js/jquery.mobile/jquery.mobile.min.css" />

    <script type="text/javascript" src="js/jquery.min.js"></script>
    <script src="js/jquery.mobile/jquery.mobile.min.js"></script>
    <script src="js/jquery.maskMoney.js"></script>
    <script src="js/jquery.global.js"></script>
    <script src="js/jquery.glob.pt-BR.js"></script>

    <script type="text/javascript">
        $(document).ready(function() {
            $('#acao').focus();
            $("form").bind("submit", function(event) {
                event.preventDefault();
            });
            $.global.preferCulture("pt-BR");
            $("#acao").maskMoney({symbol:'R$ ', showSymbol:true, thousands:'.', decimal:',', symbolStay: true});

            $("#calcular").click(function(event){
                var acao      = $.global.parseFloat($("#acao").val());
                var honorario = parseFloat($("#honorario").val());
                var advogados = parseInt($("#advogados").val())
                var resultado = honorario * acao;
                
                $("#result").html(
                    '<table>'
                    + '<tr>'
                        + '<th>' + 'Quant. Advogados' + '</th>'
                        + '<td>' + jQuery.global.format(advogados, 'n0') + '</td>'
                    + '</tr>'
                    + '<tr>'
                        + '<th>' + 'Cada um fica com' + '</th>'
                        + '<td>' + jQuery.global.format(resultado / advogados, "c") + '</td>'
                    + '</tr>'
                    + '<tr>'
                        + '<th>' + 'Ação total' + '</th>'
                        + '<td>' + jQuery.global.format(acao, "c") + '</td>'
                    + '</tr>'
                    + '<tr>'
                        + '<th>' + 'Honorários' + '</th>'
                        + '<td>' + jQuery.global.format(honorario, "p0") + '</td>'
                    + '</tr>'
                    + '<tr>'
                        + '<th>' + 'Sobra pro cliente' + '</th>'
                        + '<td>' + jQuery.global.format((acao - resultado), 'c') + '</td>'
                    + '</tr>'
                    + '</table>'
                );
            });
        });
    </script>
  </head>
  <body>
     <div data-role="page" id="input">
        <div data-role="header">
          <h1>Calculadora da Jana</h1>
        </div>
        <form data-role="content">
            <fieldset>
                <legend>Calcular honorários</legend>
                <label for="acao">Qual o valor da ação do cliente?</label><br />
                    <input id="acao" type="text" placeholder="Em reais (R$)"><br />
                <label for="honorario">Humor?</label><br />
                    <select id="honorario">
                        <option value=".3">Estou legal, 30%</option>
                        <option value=".5">Não fui com a cara, 50%</option>
                        <option value=".7">Sem explicação, 70%</option>
                    </select><br />
                <label for="advogados">Advogados</label><br />
                    <select id="advogados">
                        <option value="1">Um apenas, só eu né!!</option>
                        <option value="2">Dois, tive que dividir</option>
                        <option value="3">Três, é demais!!</option>
                    </select><br />
                <a href="#output" id="calcular" data-role="button" data-theme="b">Calcular o meu!</a><br />
            </fieldset>
        </form>
        <div data-role="footer">
            <p>&copy; <script type="text/javascript">
        var currentTime = new Date();
        document.write(currentTime.getFullYear());
        </script> - <a href="http://pradoj.com">PradoJ.com</a> - <a href="http://pradoj.com/contato/">Contato</a></p>
        </div>
        <script type="text/javascript">
	bb_bid = "1639816";
	bb_lang = "pt-BR";
	bb_keywords = "advogado, direito, calculadora";
	bb_name = "custom";
	bb_limit = "4";
	bb_format = "bbe";
</script>
<script type="text/javascript"><!--
google_ad_client = "ca-pub-7518068256340054";
/* jana */
google_ad_slot = "2048934118";
google_ad_width = 125;
google_ad_height = 125;
//-->
</script>
<script type="text/javascript"
src="//pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
    </div>


    <div data-role="page" id="output">
        <div data-role="header">
          <a href="#input" data-rel="back">Voltar</a>
          <h1>Calculadora da Jana</h1>
        </div>
        <div data-role="content">
            <p id="result"></p>
        </div>
        <div data-role="footer">
            <p>&copy; <script type="text/javascript">
        var currentTime = new Date();
        document.write(currentTime.getFullYear());
        </script> - <a href="http://pradoj.com">PradoJ.com</a> - <a href="http://pradoj.com/contato/">Contato</a></p>
        </div>
    </div>
    <script>
      (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
      (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
      m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
      })(window,document,'script','//www.google-analytics.com/analytics.js','ga');

      ga('create', 'UA-23860787-2', 'auto');
      ga('send', 'pageview');
    </script>
    <p></p>
  </body>
</html>