source: pycodeshooter/trunk/index.html @ 106

Revision 106, 7.1 KB checked in by atzm, 13 years ago (diff)
  • fixed small bug
  • add bullet frame
  • parameter adjust
  • Property svn:keywords set to Id
Line 
1<!-- $Id$ -->
2
3<!DOCTYPE html>
4<html lang="ja">
5  <head>
6    <meta charset="UTF-8"></meta>
7    <title>PyCodeShooter β</title>
8    <link rel="stylesheet" href="/tdiary.css" type="text/css" media="all" />
9    <script type="text/javascript" charset="UTF-8" src="shooter/bullet.js"></script>
10    <script type="text/javascript" charset="UTF-8" src="shooter/barrage.js"></script>
11    <script type="text/javascript" charset="UTF-8" src="shooter/action.js"></script>
12    <script type="text/javascript" charset="UTF-8" src="shooter/trooper.js"></script>
13    <script type="text/javascript" charset="UTF-8" src="shooter/system.js"></script>
14    <script type="text/javascript">
15    var titleIntervalId = 0;
16
17    function start(id, list) {
18        var msg    = document.getElementById("message");
19        var player = {
20            "name":         document.getElementById("name").value,
21            "size":         parseInt(document.getElementById("size").value),
22            "hitsize":      parseInt(document.getElementById("hitsize").value),
23            "speed":        parseInt(document.getElementById("speed").value),
24            "hitpoint":     parseInt(document.getElementById("hitpoint").value),
25            "shotsize":     parseInt(document.getElementById("shotsize").value),
26            "shotinterval": parseInt(document.getElementById("shotinterval").value),
27            "shotspeed":    parseInt(document.getElementById("shotspeed").value),
28            "shotlevel":    parseInt(document.getElementById("shotlevel").value),
29            "numbombs":     parseInt(document.getElementById("numbombs").value)
30        };
31
32        for (var n in player) {
33            if (n == "name")
34                continue;
35            if (!player[n] || player[n] < 0) {
36                setMessage(msg, "Invalid Input Data");
37                return;
38            }
39        }
40
41        if (titleIntervalId) {
42            clearInterval(titleIntervalId);
43            titleIntervalId = 0;
44        }
45
46        document.onkeydown  = function (ev) { setKeyDown(ev.keyCode); };
47        document.onkeyup    = function (ev) { setKeyUp(ev.keyCode); };
48        document.onkeypress = function (ev) { setKeyPress(ev.charCode); };
49
50        initGame(document.getElementById("screen"), msg, id, list[id], player);
51    }
52
53    function initControlPanel(list) {
54        var cp  = document.getElementById("controlpanel");
55        var sel = "<select id=\"bossSelection\">";
56
57        for (var id in list) {
58            sel += "<option value=\"" + id + "\"" + ">" + list[id].name + "</option>";
59        }
60
61        cp.innerHTML = sel + "</select>";
62
63        document.getElementById("bossSelection").onchange = function (ev) {
64            start(this[this.selectedIndex].value, list);
65        };
66    }
67
68    window.onload = function () {
69        var screen  = document.getElementById("screen");
70        var ctx     = screen.getContext("2d");
71        var logoimg = document.getElementById("logoimg");
72
73        var x           = (screen.width - logoimg.width) / 2;
74        var y           = -1 - logoimg.height;
75        var titlePos    = screen.height / 2 - logoimg.height / 2;
76        titleIntervalId = setInterval(function() {
77            drawScreen(ctx, "source-over", "rgba(8,8,8,0.5)", screen.width, screen.height);
78            updateBackground(ctx, screen.width, screen.height, 1, "#AAF", 10);
79            ctx.drawImage(logoimg, x, y);
80
81            if (++y > titlePos)
82                y = titlePos;
83        }, 20);
84
85        var req = new XMLHttpRequest();
86        req.open("GET", document.getElementById("api").value, false);
87        req.send(null);
88
89        initControlPanel(JSON.parse(req.responseText).result);
90    };
91    </script>
92  </head>
93
94  <body>
95    <h1 class="title">PyCodeShooter β</h1>
96
97    <div class="main">
98      <div style="margin-left: 5em; margin-right: 5em; font-style: italic;">
99        <p>Pythonista 達の挑戊に</p>
100        <p style="text-align: right;">君は耐えられるか...</p>
101      </div>
102
103      <div class="day">
104        <h2><span class="title">PyCodeShooter β</span></h2>
105        <div class="body">
106          <div class="section">
107            <form>
108              <h3><span class="sanchor">■</span> æŒ‘戊する!</h3>
109              <p id="controlpanel">Now loading...</p>
110              <p>
111                名前: <input type="text" value="Player" size="8" id="name" />
112                耐久性: <input type="text" value="15" size="3" id="hitpoint" />
113                ボム数: <input type="text" value="2" size="3" id="numbombs" />
114                <br />
115                <canvas id="screen" width="320" height="480"></canvas>
116                <input type="hidden" value="7"  id="size" />
117                <input type="hidden" value="1"  id="hitsize" />
118                <input type="hidden" value="5"  id="speed" />
119                <input type="hidden" value="7"  id="shotsize" />
120                <input type="hidden" value="5"  id="shotspeed" />
121                <input type="hidden" value="5"  id="shotinterval" />
122                <input type="hidden" value="3"  id="shotlevel" />
123                <input type="hidden" value="/etc/pycodebattler/?mode=json" id="api" />
124                <img src="logo.png" style="visibility: hidden;" id="logoimg" />
125              </p>
126            </form>
127          </div>
128        </div>
129      </div>
130    </div>
131
132    <div class="sidebar">
133      <div style="margin: 1em;">
134        <p>これは䜕?</p>
135        <ul style="font-size: small;">
136          <li><a href="/etc/pycodebattler/">PyCodeBattler</a> ã«ç™»éŒ²ã•ã‚ŒãŸ Python コヌドず戊いたす</li>
137        </ul>
138
139        <p>操䜜</p>
140        <dl style="font-size: small;">
141          <dt>■ ショット:</dt>
142          <dd>z</dd>
143          <dt>■ ボム:</dt>
144          <dd>a</dd>
145          <dt>■ 移動速床遅延:</dt>
146          <dd>x</dd>
147          <dt>■ 匟切替:</dt>
148          <dd>c</dd>
149          <dt>■ 巊移動:</dt>
150          <dd>← or h</dd>
151          <dt>■ 䞋移動:</dt>
152          <dd>↓ or j</dd>
153          <dt>■ 䞊移動:</dt>
154          <dd>↑ or k</dd>
155          <dt>■ 右移動:</dt>
156          <dd>→ or l</dd>
157        </dl>
158
159        <p>システムメッセヌゞ</p>
160        <span id="message" style="font-size: small;"><br /></span>
161
162        <p>泚意</p>
163        <ul style="font-size: small;">
164          <li>パラメヌタ等調敎䞭に぀きキャラの匷さや匟幕等が倉わったりする可胜性がありたす</li>
165          <li>Chrome 掚奚ですFirefox だず重くIE だず倚分動きたせん</li>
166        </ul>
167
168        <p>TODO</p>
169        <ul style="font-size: small;">
170          <li>動䜜パタヌンを増やす</li>
171          <li>匟幕パタヌンを増やす</li>
172          <li>ボム衚瀺</li>
173          <li>スコアリング</li>
174          <li>パワヌアップアむテム</li>
175          <li>敵/自機に画像ずか</li>
176          <li>メニュヌを䜕ずかする</li>
177          <li>ダメヌゞ時動䜜を凝る</li>
178        </ul>
179
180        <p>゜ヌスコヌド</p>
181        <ul style="font-size: small;">
182          <li><a href="http://trac.atzm.org/index.cgi/browser/pycodeshooter">pycodeshooter</a></li>
183        </ul>
184      </div>
185    </div>
186  </body>
187</html>
Note: See TracBrowser for help on using the repository browser.