Permalink
Browse files

add manual

  • Loading branch information...
1 parent 6d95055 commit ae892b3059394d1fda7608ffeb55bf1c79d26520 @supercaracal committed Apr 29, 2012
View
50 css/style.css
@@ -0,0 +1,50 @@
+body {
+ width: 1000px;
+ background-color: #EEEEEE;
+}
+
+#title {
+ width: 720px;
+ margin: 0px;
+ padding: 0px;
+ float: left;
+ text-align: center;
+}
+
+#title h1 {
+ margin-top: 220px;
+ font-size: 20px;
+ color: #777777;
+}
+
+#manual {
+ width: 279px;
+ margin-left: 721px;
+}
+
+#manual h2 {
+ font-size: 14px;
+ font-style: italic;
+ margin-bottom: 0px;
+}
+
+#manual table {
+ font-size: 12px;
+}
+
+#manual table thead tr th {
+ background-color: #DDDDDD;
+}
+
+#manual table thead tr th, #manual table tbody tr td {
+ padding: 3px;
+ border: solid 1px #CCCCCC;
+}
+
+#manual .right {
+ text-align: right;
+}
+
+#manual .center {
+ text-align: center;
+}
View
101 index.html
@@ -12,6 +12,8 @@
<meta property="og:image" content="https://github.com/supercaracal/duelshooting/raw/master/screenshot.jpg" />
<meta property="og:description" content="This is a javascript game." />
+<link rel="stylesheet" type="text/css" media="all" href="/css/style.css" />
+
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">google.load('prototype', '1.7')</script>
<script type="text/javascript" src="/socket.io/socket.io.js"></script>
@@ -20,9 +22,9 @@
<script type="text/javascript" src="/js/action/action-ship-red.js"></script>
<script type="text/javascript" src="/js/action/action-ship-white.js"></script>
-<script type="text/javascript" src="/js/command/base/command.js"></script>
-<script type="text/javascript" src="/js/command/command-ship-red.js"></script>
-<script type="text/javascript" src="/js/command/command-ship-white.js"></script>
+<script type="text/javascript" src="/js/cmd/base/command.js"></script>
+<script type="text/javascript" src="/js/cmd/command-ship-red.js"></script>
+<script type="text/javascript" src="/js/cmd/command-ship-white.js"></script>
<script type="text/javascript" src="/js/game/game.js"></script>
<script type="text/javascript" src="/js/sound/sound-creater.js"></script>
@@ -52,12 +54,95 @@
<script type="text/javascript" src="/js/duel-shooting.js"></script>
-<script type="text/javascript">
-Event.observe(window, 'load', function() {
- new DuelShooting();
-});
-</script>
+<script type="text/javascript">Event.observe(window, 'load', function() { new DuelShooting(); });</script>
</head>
<body>
+<div id="title">
+ <h1>Duel Shooting Online</h1>
+</div>
+<div id="manual">
+ <h2>White Demon</h2>
+ <table>
+ <thead>
+ <tr>
+ <th>Action</th>
+ <th>Keyboard</th>
+ <th>Mouse or Touch</th>
+ </thead>
+ <tbody>
+ <tr>
+ <td class="right">Move Right</td>
+ <td class="center">→</td>
+ <td>Lower part right</td>
+ </tr>
+ <tr>
+ <td class="right">Move Left</td>
+ <td class="center">←</td>
+ <td>Lower part left</td>
+ </tr>
+ <tr>
+ <td class="right">Wait</td>
+ <td class="center">↓</td>
+ <td>Lower part center</td>
+ </tr>
+ <tr>
+ <td class="right">Attack1</td>
+ <td class="center">↑</td>
+ <td>Upper part center</td>
+ </tr>
+ <tr>
+ <td class="right">Attack2</td>
+ <td class="center">F</td>
+ <td>Upper part left</td>
+ </tr>
+ <tr>
+ <td class="right">Attack3</td>
+ <td class="center">M</td>
+ <td>Upper part right</td>
+ </tr>
+ </tbody>
+ </table>
+ <h2>Red Comet</h2>
+ <table>
+ <thead>
+ <tr>
+ <th>Action</th>
+ <th>Keyboard</th>
+ <th>Mouse or Touch</th>
+ </thead>
+ <tbody>
+ <tr>
+ <td class="right">Move Right</td>
+ <td class="center">→</td>
+ <td>Lower part right</td>
+ </tr>
+ <tr>
+ <td class="right">Move Left</td>
+ <td class="center">←</td>
+ <td>Lower part left</td>
+ </tr>
+ <tr>
+ <td class="right">Avoid</td>
+ <td class="center">N</td>
+ <td>Lower part center</td>
+ </tr>
+ <tr>
+ <td class="right">Attack1</td>
+ <td class="center">↑</td>
+ <td>Upper part center</td>
+ </tr>
+ <tr>
+ <td class="right">Attack2</td>
+ <td class="center">F</td>
+ <td>Upper part left</td>
+ </tr>
+ <tr>
+ <td class="right">Barrier</td>
+ <td class="center">I</td>
+ <td>Upper part right</td>
+ </tr>
+ </tbody>
+ </table>
+</div>
</body>
</html>
View
41 js/action/action-ship-red.js
@@ -1,10 +1,11 @@
var ActionShipRed = Class.create(Action, {
- handler: function (e) {
+ KEY_F: 70,
+ KEY_I: 73,
+ KEY_N: 78,
+
+ handler: function(e) {
e.stop();
- var KEY_F = 70;
- var KEY_I = 73;
- var KEY_N = 78;
switch (e.keyCode) {
case Event.KEY_RIGHT:
this.nextCommand = 'stepRight';
@@ -15,30 +16,42 @@ var ActionShipRed = Class.create(Action, {
case Event.KEY_UP:
this.nextCommand = 'attack';
break;
- case KEY_I:
+ case this.KEY_I:
this.nextCommand = 'barrier';
break;
- case KEY_F:
+ case this.KEY_F:
this.nextCommand = 'funnel';
break;
- case KEY_N:
+ case this.KEY_N:
this.nextCommand = 'avoid';
break;
}
},
- convertToAction: function (x, y) {
- if ((this.clientHeight / 2 < y) && (x < this.sprite.clientWidth / 3)) {
+ convertToAction: function(x, y) {
+
+ var screenUpperPart = (0 < y) && (y < this.sprite.clientHeight / 2);
+ var screenLowerPart = (this.sprite.clientHeight / 2 < y) && (y < this.sprite.clientHeight);
+ var screenLeft = (0 < x) && (x < this.sprite.clientWidth / 3);
+ var screenCenter = (this.sprite.clientWidth / 3 < x) && (x < this.sprite.clientWidth / 3 * 2);
+ var screenRight = (this.sprite.clientWidth / 3 * 2 < x) && (x < this.sprite.clientWidth);
+
+ if (screenLowerPart && screenLeft) {
this.nextCommand = 'stepLeft';
- } else if ((this.clientHeight / 2 < y) && (this.sprite.clientWidth / 3 < x) && (x < this.sprite.clientWidth / 3 * 2)) {
+
+ } else if (screenLowerPart && screenCenter) {
this.nextCommand = 'avoid';
- } else if ((this.clientHeight / 2 < y) && (this.sprite.clientWidth / 3 * 2 < x)) {
+
+ } else if (screenLowerPart && screenRight) {
this.nextCommand = 'stepRight';
- } else if ((y < this.clientHeight / 2) && (x < this.sprite.clientWidth / 3)) {
+
+ } else if (screenUpperPart && screenLeft) {
this.nextCommand = 'funnel';
- } else if ((y < this.clientHeight / 2) && (this.sprite.clientWidth / 3 < x) && (x < this.sprite.clientWidth / 3 * 2)) {
+
+ } else if (screenUpperPart && screenCenter) {
this.nextCommand = 'attack';
- } else if ((y < this.clientHeight / 2) && (this.sprite.clientWidth / 3 * 2 < x)) {
+
+ } else if (screenUpperPart && screenRight) {
this.nextCommand = 'barrier';
}
}
View
37 js/action/action-ship-white.js
@@ -1,9 +1,10 @@
var ActionShipWhite = Class.create(Action, {
- handler: function (e) {
+ KEY_F: 70,
+ KEY_M: 77,
+
+ handler: function(e) {
e.stop();
- var KEY_F = 70;
- var KEY_M = 77;
switch (e.keyCode) {
case Event.KEY_RIGHT:
this.nextCommand = 'stepRight';
@@ -17,28 +18,40 @@ var ActionShipWhite = Class.create(Action, {
case Event.KEY_DOWN:
this.nextCommand = 'wait';
break;
- case KEY_F:
+ case this.KEY_F:
this.nextCommand = 'funnel';
break;
- case KEY_M:
+ case this.KEY_M:
this.nextCommand = 'megaCannon';
break;
}
},
- convertToAction: function (x, y) {
- if ((this.clientHeight / 2 < y) && (x < this.sprite.clientWidth / 3)) {
+ convertToAction: function(x, y) {
+
+ var screenUpperPart = (0 < y) && (y < this.sprite.clientHeight / 2);
+ var screenLowerPart = (this.sprite.clientHeight / 2 < y) && (y < this.sprite.clientHeight);
+ var screenLeft = (0 < x) && (x < this.sprite.clientWidth / 3);
+ var screenCenter = (this.sprite.clientWidth / 3 < x) && (x < this.sprite.clientWidth / 3 * 2);
+ var screenRight = (this.sprite.clientWidth / 3 * 2 < x) && (x < this.sprite.clientWidth);
+
+ if (screenLowerPart && screenLeft) {
this.nextCommand = 'stepLeft';
- } else if ((this.clientHeight / 2 < y) && (this.sprite.clientWidth / 3 < x) && (x < this.sprite.clientWidth / 3 * 2)) {
+
+ } else if (screenLowerPart && screenCenter) {
this.nextCommand = 'wait';
- } else if ((this.clientHeight / 2 < y) && (this.sprite.clientWidth / 3 * 2 < x)) {
+
+ } else if (screenLowerPart && screenRight) {
this.nextCommand = 'stepRight';
- } else if ((y < this.clientHeight / 2) && (x < this.sprite.clientWidth / 3)) {
+
+ } else if (screenUpperPart && screenLeft) {
this.nextCommand = 'funnel';
- } else if ((y < this.clientHeight / 2) && (this.sprite.clientWidth / 3 < x) && (x < this.sprite.clientWidth / 3 * 2)) {
+
+ } else if (screenUpperPart && screenCenter) {
this.nextCommand = 'attack';
- } else if ((y < this.clientHeight / 2) && (this.sprite.clientWidth / 3 * 2 < x)) {
+
+ } else if (screenUpperPart && screenRight) {
this.nextCommand = 'megaCannon';
}
}
View
4 js/action/base/action.js
@@ -29,12 +29,12 @@ var Action = Class.create({
return command;
},
- handlerMouse: function (e) {
+ handlerMouse: function(e) {
e.stop();
this.convertToAction(e.pageX, e.pageY);
},
- handlerSmart: function (e) {
+ handlerSmart: function(e) {
e.stop();
this.convertToAction(e.touches[0].pageX, e.touches[0].pageY);
}
View
14 js/cmd/base/command.js
@@ -0,0 +1,14 @@
+var Command = Class.create({
+
+ ship: null,
+ auto: null,
+
+ initialize: function(ship, auto) {
+ this.ship = ship;
+ this.auto = auto;
+ },
+
+ execute: function(command) {
+ if (command && command in this) this[command]();
+ }
+});
View
29 js/cmd/command-ship-red.js
@@ -0,0 +1,29 @@
+var CommandShipRed = Class.create(Command, {
+
+ stepRight: function() {
+ this.ship.stepRight();
+ },
+
+ stepLeft: function() {
+ this.ship.stepLeft();
+ },
+
+ avoid: function() {
+ this.ship.avoid();
+ },
+
+ barrier: function() {
+ this.ship.barrier();
+ },
+
+ attack: function() {
+ if (this.ship.iField && this.ship.iField.isActive) {
+ return;
+ }
+ this.auto.addBulletHoming();
+ },
+
+ funnel: function() {
+ this.auto.addFunnelCircle();
+ }
+});
View
24 js/cmd/command-ship-white.js
@@ -0,0 +1,24 @@
+var CommandShipWhite = Class.create(Command, {
+
+ stepRight: function() {
+ this.ship.stepRight();
+ },
+
+ stepLeft: function() {
+ this.ship.stepLeft();
+ },
+
+ wait: Prototype.emptyFunction,
+
+ attack: function() {
+ this.auto.addBulletLinear();
+ },
+
+ funnel: function() {
+ this.auto.addFunnelSlider();
+ },
+
+ megaCannon: function() {
+ this.auto.fireMegaCannon();
+ }
+});
View
2 js/sprite/background.js
@@ -8,6 +8,8 @@ var Background = Class.create(Sprite, {
backgroundColor: '#333333',
height: this.clientHeight + 'px',
width: this.clientWidth + 'px',
+ borderRight: 'solid 1px #AAAAAA',
+ borderBottom: 'solid 1px #AAAAAA'
}).setOpacity(0.8);
},

0 comments on commit ae892b3

Please sign in to comment.