3 Back 2 Browser Bytecode Translator
4 Copyright (C) 2012-2015 Jaroslav Tulach <jaroslav.tulach@apidesign.org>
6 This program is free software: you can redistribute it and/or modify
7 it under the terms of the GNU General Public License as published by
8 the Free Software Foundation, version 2 of the License.
10 This program is distributed in the hope that it will be useful,
11 but WITHOUT ANY WARRANTY; without even the implied warranty of
12 MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
13 GNU General Public License for more details.
15 You should have received a copy of the GNU General Public License
16 along with this program. Look for COPYING file in the top folder.
17 If not, see http://opensource.org/licenses/GPL-2.0.
24 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
25 <style type="text/css">
26 @-webkit-keyframes spin {
27 0% { -webkit-transform: rotate(0deg); }
28 100% { -webkit-transform: rotate(360deg); }
31 0% { transform: rotate(0deg); }
32 100% { transform: rotate(360deg); }
40 -webkit-animation-name: spin;
41 -webkit-animation-duration: 3s;
42 -webkit-animation-iteration-count: infinite;
43 -webkit-animation-direction: alternate;
45 animation-duration: 3s;
46 animation-iteration-count: infinite;
47 animation-direction: alternate;
57 border: 1px solid #ccc;
58 background: rgba(255,255,155,0.8);
61 -webkit-box-shadow: inset 0 0 40px rgba(0,0,0,0.4);
62 box-shadow: inset 0 0 40px rgba(0,0,0,0.4);
66 #words span:nth-child(1) { left: 45%; top: 0px; }
67 #words span:nth-child(2) { left: 25%; top: 100px; }
68 #words span:nth-child(3) { left: 65%; top: 100px; }
69 #words span:nth-child(4) { left: 10%; top: 200px; }
70 #words span:nth-child(5) { left: 45%; top: 200px; }
71 #words span:nth-child(6) { left: 80%; top: 200px; }
77 <input data-bind="textInput: message">
79 <button data-bind="enable: !rotating(), click: $root.turnAnimationOn">Start</button>
80 <button data-bind="enable: rotating, click: $root.turnAnimationOff">Stop</button>
81 <button data-bind="enable: !rotating(), click: $root.rotate5s">Rotate Few Seconds</button>
82 <button data-bind="click: $root.showScreenSize">Screen Size!</button>
83 <button id='beginTest' data-bind="click: $root.beginTest">Automatic Test</button>
86 <span id="words" data-bind="foreach: words">
87 <span data-bind="text: $data, css: { 'rotate' : $root.rotating } "></span>
90 <!-- ${browser.bootstrap} -->