1.1 --- a/minesweeper/src/main/webapp/pages/index.html Sun Jun 28 07:14:21 2015 +0200
1.2 +++ /dev/null Thu Jan 01 00:00:00 1970 +0000
1.3 @@ -1,250 +0,0 @@
1.4 -<!--
1.5 -
1.6 - The MIT License (MIT)
1.7 -
1.8 - Copyright (C) 2013 Jaroslav Tulach <jaroslav.tulach@apidesign.org>
1.9 -
1.10 - Permission is hereby granted, free of charge, to any person obtaining a copy
1.11 - of this software and associated documentation files (the "Software"), to deal
1.12 - in the Software without restriction, including without limitation the rights
1.13 - to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
1.14 - copies of the Software, and to permit persons to whom the Software is
1.15 - furnished to do so, subject to the following conditions:
1.16 -
1.17 - The above copyright notice and this permission notice shall be included in
1.18 - all copies or substantial portions of the Software.
1.19 -
1.20 - THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
1.21 - IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
1.22 - FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
1.23 - AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
1.24 - LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
1.25 - OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
1.26 - THE SOFTWARE.
1.27 -
1.28 --->
1.29 -<!DOCTYPE html>
1.30 -<html>
1.31 - <head>
1.32 - <title>Fair Minesweeper</title>
1.33 - <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
1.34 - <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no"/>
1.35 - <link href="bootstrap.css" rel="stylesheet">
1.36 - <link href="bootstrap-responsive.css" rel="stylesheet">
1.37 - <link href="mines.css" rel="stylesheet">
1.38 - <!-- Target tablets -->
1.39 - <link href="mines-tablet-large.css"
1.40 - media="(min-width:640px), (min-height:660px)"
1.41 - rel="stylesheet" />
1.42 - <link href="mines-tablet-small.css"
1.43 - media="(min-width:510px) and (max-width:640px), (min-height:520px) and (max-height:660px)"
1.44 - rel="stylesheet" />
1.45 - <!-- Target phones -->
1.46 - <link href="mines-phone-large.css"
1.47 - media="(min-width:410px) and (max-width:510px), (min-height:400px) and (max-height:520px)"
1.48 - rel="stylesheet" />
1.49 - <link href="mines-phone-small.css"
1.50 - media="(min-width:300px) and (max-width:410px), (min-height:300px) and (max-height:400px)"
1.51 - rel="stylesheet" />
1.52 - <link href="mines-phone-smaller.css"
1.53 - media="(max-width:300px), (max-height:300px)"
1.54 - rel="stylesheet" />
1.55 - </head>
1.56 - <body>
1.57 - <div class="navbar">
1.58 - <div class="navbar-inner">
1.59 - <a id="apptitle" class="brand" href="#" data-bind="click: showHelp">
1.60 - <img height="20" width="20" src="DukeSweeper.png">
1.61 - <span class="hidden-phone">Minesweeper</span>
1.62 - </a>
1.63 - <button class="btn btn-default navbar-btn" disabled="true" data-bind="disable: false, click: normalGame">
1.64 - <span>↻</span>
1.65 - <span class="info-text">New!</span>
1.66 - </button>
1.67 - <button class="hidden-phone btn btn-default navbar-btn" disabled="true" data-bind="disable: !gameInProgress(), click: giveUp ">
1.68 - <span>✗</span>
1.69 - <span>Show Mines!</span>
1.70 - </button>
1.71 - <button class="btn btn-default navbar-btn" disabled="true" data-bind="disable: !gameInProgress(), click: markMine">
1.72 - <span>⚠</span>
1.73 - <span class="info-text">Mark Mine!</span>
1.74 - </button>
1.75 - </div>
1.76 - </div>
1.77 -
1.78 -
1.79 - <script type="text/html" id="field">
1.80 - <center>
1.81 - <table class="field" data-bind="css: gameStyle">
1.82 - <tbody>
1.83 - <!-- ko foreach: rows -->
1.84 - <tr>
1.85 - <!-- ko foreach: columns -->
1.86 - <td data-bind="css: style, click: $parents[1].click" >
1.87 - <div></div>
1.88 - </td>
1.89 - <!-- /ko -->
1.90 - </tr>
1.91 - <!-- /ko -->
1.92 - </tbody>
1.93 - </table>
1.94 - </center>
1.95 - </script>
1.96 -
1.97 - <div data-bind="template: { name : 'field', if: fieldShowing }"></div>
1.98 -
1.99 - <div class="jumbotron control-label" data-bind="visible: !fieldShowing() ">
1.100 - <div class="container">
1.101 - <h1>HTML/Java Technology Demo</h1>
1.102 -
1.103 - <p>At first sight this is an old good <em>minesweeper</em>
1.104 - game. At closer look, this is a demo of a revolutionary
1.105 - technology that allows you to use <strong>Java</strong>
1.106 - to code your application logic and present it using
1.107 - <strong>HTML</strong> on any device capable of rendering
1.108 - modern <strong>HTML5</strong> browser.
1.109 - </p>
1.110 - <p><a class="btn btn-primary btn-lg" role="button"
1.111 - target="_blank" href="http://html.java.net"
1.112 - >Visit Project Page!</a>
1.113 - </p>
1.114 - </div>
1.115 - </div>
1.116 -
1.117 - <div class="container" data-bind="visible: !fieldShowing()">
1.118 - <div>
1.119 - <div class="col-md-4">
1.120 - <h2>Minesweeper</h2>
1.121 - <p>
1.122 - Discover ten square fields that contain a mine and
1.123 - mark them with a ⚠ sign.
1.124 - Touch a square to find out if there is
1.125 - a mine or not and
1.126 - how many mines are in the eight surrounding
1.127 - ones. Avoid random play, the game
1.128 - recognizes guessing and can re-arrange
1.129 - the mines. This game is <b>fair</b>!
1.130 - </p>
1.131 - <p><a class="btn btn-default" href="#" data-bind="click: normalGame"role="button">Play »</a></p>
1.132 - </div>
1.133 - <div class="col-md-4">
1.134 - <h2>Documentation</h2>
1.135 - <p>
1.136 - In case you want to write application like
1.137 - this (e.g. use <strong>Java</strong> and <strong>HTML</strong>)
1.138 - you can learn more about the libraries that
1.139 - make that possible. Follow this link to
1.140 - our documentation.
1.141 - </p>
1.142 - <p><a class="btn btn-default"
1.143 - target="_blank" href="http://bits.netbeans.org/html+java/"
1.144 - role="button">Read more »</a></p>
1.145 - </div>
1.146 - <div class="col-md-4">
1.147 - <h2>Run in a Browser</h2>
1.148 - <p>
1.149 - While primarily this technology runs on a desktop
1.150 - or as a table or phone application, it is possible
1.151 - to execute the same unchanged code in a browser
1.152 - as well. To do so, one needs a
1.153 - <a href="http://bck2brwsr.apidesign.org">bck2brwsr</a>
1.154 - virtual machine.
1.155 - </p>
1.156 - <p><a class="btn btn-default"
1.157 - target="_blank" href="http://xelfi.cz/minesweeper/bck2brwsr/"
1.158 - role="button">Try it »</a></p>
1.159 - </div>
1.160 - </div>
1.161 - </div>
1.162 -<div class="container" data-bind="visible: !fieldShowing()">
1.163 - <div class="col-sm-6 col-md-4">
1.164 - <div class="thumbnail">
1.165 - <img src="android_logo.jpg" width="120" height="120" alt="Android">
1.166 - <div class="caption">
1.167 - <h3>DlvkBrwsr</h3>
1.168 - <p>
1.169 - This application has been packaged to run on your Android phone
1.170 - and is available on Google Play! In this mode it
1.171 - uses Dalvik virtual machine to execute Java code natively.
1.172 - It uses Android's WebView to display the UI and execute
1.173 - generated JavaScript. Both these components are
1.174 - bound together via <a href="http://wiki.apidesign.org/wiki/DlvkBrwsr">
1.175 - DlvkBrwsr</a>.
1.176 - </p>
1.177 - <p>
1.178 - <a href="https://play.google.com/store/apps/details?id=org.apidesign.demo.minesweeper"
1.179 - target="_blank"
1.180 - class="btn btn-primary" role="button"
1.181 - >Install »</a>
1.182 - </p>
1.183 - </div>
1.184 - </div>
1.185 - </div>
1.186 - <div class="col-sm-6 col-md-4">
1.187 - <div class="thumbnail">
1.188 - <img src="ios_logo.jpg" width="120" height="120" alt="Android">
1.189 - <div class="caption">
1.190 - <h3>iBrwsr</h3>
1.191 - <p>
1.192 - This application has been packaged to run on your iPhone
1.193 - or iPad and made available on AppStore.
1.194 - In this mode it
1.195 - uses <a target="_blank" href="http://www.robovm.org">RoboVM</a>
1.196 - virtual machine to execute Java code natively.
1.197 - It uses iOS WebView to display the UI and execute
1.198 - generated JavaScript. Both these components are
1.199 - bound together via <a target="_blank"
1.200 - href="http://wiki.apidesign.org/wiki/IBrwsr">
1.201 - iBrwsr</a> library.
1.202 - </p>
1.203 - <p>
1.204 - <a href="https://itunes.apple.com/us/app/fair-minesweeper/id903688146"
1.205 - target="_blank"
1.206 - class="btn btn-primary" role="button"
1.207 - >Install »</a>
1.208 - </p>
1.209 - </div>
1.210 - </div>
1.211 - </div>
1.212 - <div class="col-sm-6 col-md-4">
1.213 - <div class="thumbnail">
1.214 - <img src="netbeans_logo.jpg" width="120" height="120" alt="Android">
1.215 - <div class="caption">
1.216 - <h3>Develop Own App!</h3>
1.217 - <p>
1.218 - One can package this application as a
1.219 - <a href="http://plugins.netbeans.org/plugin/53864/"
1.220 - target="_blank"
1.221 - >plugin for NetBeans</a> or
1.222 - use <a href="http://www.netbeans.org" target="_blank">
1.223 - NetBeans</a> IDE to create
1.224 - application like this yourself. Enjoy the
1.225 - power of <em>HTML</em> and <em>Java</em>.
1.226 - Write your applications once and deploy and display
1.227 - them on any device!
1.228 - </p>
1.229 - <p>
1.230 - <a href="http://wiki.apidesign.org/wiki/DukeScriptInNetBeans"
1.231 - target="_blank"
1.232 - class="btn btn-primary" role="button"
1.233 - >Develop »</a>
1.234 - </p>
1.235 - </div>
1.236 - </div>
1.237 - </div>
1.238 -</div>
1.239 - <!-- boot bck2brwsr -->
1.240 - <script type="text/javascript" src="bck2brwsr.js"></script>
1.241 - <script>
1.242 - if (!this.hasOwnProperty("main")) {
1.243 - this.main = function() {
1.244 - var vm = bck2brwsr('minesweeper.js');
1.245 - var c = vm.loadClass('org.apidesign.demo.minesweeper.MinesModel');
1.246 - c.invoke('main');
1.247 - }
1.248 - }
1.249 - this.main();
1.250 - </script>
1.251 -
1.252 - </body>
1.253 -</html>