javaquery/demo-calculator/src/main/resources/org/apidesign/bck2brwsr/mavenhtml/Calculator.xhtml
author Jaroslav Tulach <jaroslav.tulach@apidesign.org>
Thu, 20 Dec 2012 16:17:31 +0100
branchlauncher
changeset 357 dc375a56fd15
parent 198 5c1604c5ca9a
child 358 f6a165f7f00f
permissions -rw-r--r--
Mojo for execution in a browser
     1 <?xml version="1.0" encoding="UTF-8"?>
     2 <!--
     3 
     4     Back 2 Browser Bytecode Translator
     5     Copyright (C) 2012 Jaroslav Tulach <jaroslav.tulach@apidesign.org>
     6 
     7     This program is free software: you can redistribute it and/or modify
     8     it under the terms of the GNU General Public License as published by
     9     the Free Software Foundation, version 2 of the License.
    10 
    11     This program is distributed in the hope that it will be useful,
    12     but WITHOUT ANY WARRANTY; without even the implied warranty of
    13     MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
    14     GNU General Public License for more details.
    15 
    16     You should have received a copy of the GNU General Public License
    17     along with this program. Look for COPYING file in the top folder.
    18     If not, see http://opensource.org/licenses/GPL-2.0.
    19 
    20 -->
    21 <!DOCTYPE html>
    22 <html xmlns="http://www.w3.org/1999/xhtml">
    23     <head>
    24         <title>Simple Calculator in HTML5 and Java</title>
    25 
    26         <style type="text/css">
    27         body {color: #ffffff; background-color: #121e31; font-family: Monospaced}
    28         pre {color: #ffffff; background-color: #121e31; font-family: Monospaced}
    29         table {color: #ffffff; background-color: #121e31; font-family: Monospaced}
    30         .string {color: #e2ce00}
    31         a {color: #e2ce00}
    32         .ST1 {color: #0000cc; font-family: Monospaced; font-weight: bold}
    33         .ST0 {color: #0000ff}
    34         .comment {color: #428bdd}
    35         .keyword-directive {color: #f8bb00}
    36         .tag {color: #f8bb00}
    37         .ST0 {color: #628fb5; background-color: #1b3450}
    38         .sgml-comment {color: #808080}
    39         .value {color: #99006b}
    40         .argument {color: #007c00}
    41         .sgml-declaration {color: #bf9221}
    42         </style>    
    43         </head>
    44     <body>
    45         <h1>Java and HTML5 - Together at Last!</h1>
    46         <table border="0" cellspacing="2">
    47             <tbody>
    48                 <tr>
    49                     <td colspan="4"><input id="display" value="0" 
    50                             style="text-align: right"/>
    51                 </td>
    52                 </tr>
    53                 <tr>
    54                     <td><button id="n1">1</button></td>
    55                     <td><button id="n2">2</button></td>
    56                     <td><button id="n3">3</button></td>
    57                     <td><button id="plus">+</button></td>
    58                 </tr>
    59                 <tr>
    60                     <td><button id="n4">4</button></td>
    61                     <td><button id="n5">5</button></td>
    62                     <td><button id="n6">6</button></td>
    63                     <td><button id="minus">-</button></td>
    64                 </tr>
    65                 <tr>
    66                     <td><button id="n7">7</button></td>
    67                     <td><button id="n8">8</button></td>
    68                     <td><button id="n9">9</button></td>
    69                     <td><button id="mul">*</button></td>
    70                 </tr>
    71                 <tr>
    72                     <td><button id="clear">C</button></td>
    73                     <td><button id="n0">0</button></td>
    74                     <td><button id="result">=</button></td>
    75                     <td><button id="div">/</button></td>
    76                 </tr>
    77             </tbody>
    78         </table>
    79 
    80         <script src="/bck2brwsr.js"></script>
    81         <script src="/vm.js"></script>
    82         <script type="text/javascript">
    83             vm.loadClass('org.apidesign.bck2brwsr.mavenhtml.Calculator').class__V();
    84         </script>
    85         
    86         <hr/>
    87     <pre>
    88     <span class="keyword-directive">package</span> org.apidesign.bck2brwsr.mavenhtml;
    89 
    90     <span class="keyword-directive">import</span> org.apidesign.bck2brwsr.htmlpage.api.OnClick;
    91     <span class="keyword-directive">import</span> org.apidesign.bck2brwsr.htmlpage.api.Page;
    92 
    93     <span class="comment">/**</span> <span class="comment">HTML5</span><span class="comment"> &amp; </span><span class="comment">Java</span> <span class="comment">demo</span> <span class="comment">showing</span> <span class="comment">the</span> <span class="comment">power</span> <span class="comment">of</span> <a href="http://wiki.apidesign.org/wiki/AnnotationProcessor">annotation processors</a>
    94     <span class="comment"> * </span><span class="comment">as</span> <span class="comment">well</span> <span class="comment">as</span> <span class="comment">other</span> <span class="comment">goodies</span><span class="comment">, including type-safe association between</span>
    95     <span class="comment"> * </span><span class="comment">an XHTML page and Java.</span>
    96     <span class="comment"> * </span>
    97     <span class="comment"> * </span><span class="ST1">@author</span> <span class="comment">Jaroslav</span> <span class="comment">Tulach</span> <span class="ST0">&lt;jaroslav.tulach@apidesign.org&gt;</span>
    98      <span class="comment">*/</span>
    99     @Page(xhtml=<span class="string">&quot;</span><span class="string">Calculator.xhtml</span><span class="string">&quot;</span>)
   100     <span class="keyword-directive">public</span> <span class="keyword-directive">class</span> App {
   101         <span class="keyword-directive">private</span> <span class="keyword-directive">static</span> <span class="keyword-directive">double</span> memory;
   102         <span class="keyword-directive">private</span> <span class="keyword-directive">static</span> String operation;
   103 
   104         @OnClick(id=<span class="string">&quot;</span><span class="string">clear</span><span class="string">&quot;</span>)
   105         <span class="keyword-directive">static</span> <span class="keyword-directive">void</span> clear() {
   106             memory = <span class="number">0</span>;
   107             operation = <span class="keyword-directive">null</span>;
   108             Calculator.DISPLAY.setValue(<span class="string">&quot;</span><span class="string">0</span><span class="string">&quot;</span>);
   109         }
   110 
   111         @OnClick(id= { <span class="string">&quot;</span><span class="string">plus</span><span class="string">&quot;</span>, <span class="string">&quot;</span><span class="string">minus</span><span class="string">&quot;</span>, <span class="string">&quot;</span><span class="string">mul</span><span class="string">&quot;</span>, <span class="string">&quot;</span><span class="string">div</span><span class="string">&quot;</span> })
   112         <span class="keyword-directive">static</span> <span class="keyword-directive">void</span> applyOp(String op) {
   113             memory = getValue();
   114             operation = op;
   115             Calculator.DISPLAY.setValue(<span class="string">&quot;</span><span class="string">0</span><span class="string">&quot;</span>);
   116         }
   117 
   118         @OnClick(id=<span class="string">&quot;</span><span class="string">result</span><span class="string">&quot;</span>)
   119         <span class="keyword-directive">static</span> <span class="keyword-directive">void</span> computeTheValue() {
   120             <span class="keyword-directive">switch</span> (operation) {
   121                 <span class="keyword-directive">case</span> <span class="string">&quot;</span><span class="string">plus</span><span class="string">&quot;</span>: setValue(memory + getValue()); <span class="keyword-directive">break</span>;
   122                 <span class="keyword-directive">case</span> <span class="string">&quot;</span><span class="string">minus</span><span class="string">&quot;</span>: setValue(memory - getValue()); <span class="keyword-directive">break</span>;
   123                 <span class="keyword-directive">case</span> <span class="string">&quot;</span><span class="string">mul</span><span class="string">&quot;</span>: setValue(memory * getValue()); <span class="keyword-directive">break</span>;
   124                 <span class="keyword-directive">case</span> <span class="string">&quot;</span><span class="string">div</span><span class="string">&quot;</span>: setValue(memory / getValue()); <span class="keyword-directive">break</span>;
   125                 <span class="keyword-directive">default</span>: <span class="keyword-directive">throw</span> <span class="keyword-directive">new</span> IllegalStateException(operation);
   126             }
   127         }
   128 
   129         @OnClick(id={<span class="string">&quot;</span><span class="string">n0</span><span class="string">&quot;</span>, <span class="string">&quot;</span><span class="string">n1</span><span class="string">&quot;</span>, <span class="string">&quot;</span><span class="string">n2</span><span class="string">&quot;</span>, <span class="string">&quot;</span><span class="string">n3</span><span class="string">&quot;</span>, <span class="string">&quot;</span><span class="string">n4</span><span class="string">&quot;</span>, <span class="string">&quot;</span><span class="string">n5</span><span class="string">&quot;</span>, <span class="string">&quot;</span><span class="string">n6</span><span class="string">&quot;</span>, <span class="string">&quot;</span><span class="string">n7</span><span class="string">&quot;</span>, <span class="string">&quot;</span><span class="string">n8</span><span class="string">&quot;</span>, <span class="string">&quot;</span><span class="string">n9</span><span class="string">&quot;</span>}) 
   130         <span class="keyword-directive">static</span> <span class="keyword-directive">void</span> addDigit(String digit) {
   131             digit = digit.substring(<span class="number">1</span>);
   132             String v = Calculator.DISPLAY.getValue();
   133             <span class="keyword-directive">if</span> (getValue() == <span class="number">0.0</span>) {
   134                 Calculator.DISPLAY.setValue(digit);
   135             } <span class="keyword-directive">else</span> {
   136                 Calculator.DISPLAY.setValue(v + digit);
   137             }
   138         }
   139 
   140         <span class="keyword-directive">private</span> <span class="keyword-directive">static</span> <span class="keyword-directive">void</span> setValue(<span class="keyword-directive">double</span> v) {
   141             StringBuilder sb = <span class="keyword-directive">new</span> StringBuilder();
   142             sb.append(v);
   143             Calculator.DISPLAY.setValue(sb.toString());
   144         }
   145 
   146         <span class="keyword-directive">private</span> <span class="keyword-directive">static</span> <span class="keyword-directive">double</span> getValue() {
   147             <span class="keyword-directive">try</span> {
   148                 <span class="keyword-directive">return</span> Double.parseDouble(Calculator.DISPLAY.getValue());
   149             } <span class="keyword-directive">catch</span> (NumberFormatException ex) {
   150                 Calculator.DISPLAY.setValue(<span class="string">&quot;</span><span class="string">err</span><span class="string">&quot;</span>);
   151                 <span class="keyword-directive">return</span> <span class="number">0.0</span>;
   152             }
   153         }
   154     }
   155 
   156     </pre>
   157     </body>
   158 </html>