JavaScript - Mover un objeto con el teclado en un juego js

 
Vista:

Mover un objeto con el teclado en un juego js

Publicado por Adrian (1 intervención) el 19/04/2017 09:37:49
Hola estoy haciendo el juego pong, pero no se como hacerlo mover con teclas o con las flechas del teclado.


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
<html><head><meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Pong</title>
</head>
 
<body bgcolor="#FFFFFF">
 
 
<script language="JavaScript">
<!--  to hide script contents from old browsers
// rev 0.04
var crlf = "\r\n";
// should determine from browser type
	var x = 1;
	var y = 1;
	var dx = 1;
	var dy = 1;
	var s = "";
	var u = 0;
	var oops_flag = false;
	var score = 0;

function move1() {
    x += dx;
    if (x > 31) {
	x -= 2 * Math.abs(dx);
    if (dx > 0) dx = -dx; }
    if (x <  0) { 
	x += 2 * Math.abs(dx);
    if (dx < 0) dx = -dx; }
	y += dy;
    if (y > 14) { 
	y -= 2 * Math.abs(dy); 
    if (dy > 0) dy = -dy; 
    if (Math.abs(x - 2*u - 1) > 2) {
	oops_flag = true;
    }
    else {
	score += 1;
	}

    }
    if (y <  0) { y += 2 * Math.abs(dy); 
if (dy < 0) dy = -dy; }
  }


function display1() {
    var s1 = ""
    var i,j;
    if (oops_flag) return "Oops!! You messed up on the easiest game ever made!! I feel sorry for you!! You need a lot of practice!! Come back often and play!!!!!!";
    for (j=0;j<15;j++) {

      for (i=0;i<32;i++) {
	if (j == y && i == x) s1 += "o";
        else s1 += ".";
      }
      s1 += crlf;
    }
    var s2 = ""
    for (i=0;i<16;i++) {
       if (u == i) s2 += "==";
       else s2 += "..";
    }
    return (s1+s2)
  }
  var timerID = null;
  var timerRunning = false;
  var myform;

function stopclock (){
        if(timerRunning) clearTimeout(timerID);
        timerRunning = false;
  }

function startclock (form) {
        myform = form;
	oops_flag = false;
	if (navigator.userAgent.indexOf("Mac") > 2) crlf = "\n";
	// Make sure the clock is stopped
        stopclock();
        dotime();
  }

function dotime () {
	move1();
        if (myform != null) {
	  myform.text3.value = display1();	  
	  myform.score.value = " " + score;
	}
	if (!oops_flag) timerID = setTimeout("dotime()",200);
        timerRunning = true;
  }
// end hiding contents from old browsers  -->
</script>

<center><font size="+1">Pong</font></center>


<center>Press start to run. Wave your mouse directly over the dashes under the text area to 
move the "paddle".
<hr>
<form name="myForm">
<textarea name="text3" rows="16" cols="34" wrap="">[game field]
</textarea>
Score: <input type="text" name="score" size="10" value="0">
<p>
<a href="http://www.htmlpoint.com/jscript/giochi/giochi07codice.htm" onmouseover="u =  0">\\\</a>
<a href="http://www.htmlpoint.com/jscript/giochi/giochi07codice.htm" onmouseover="u =  1">///</a>
<a href="http://www.htmlpoint.com/jscript/giochi/giochi07codice.htm" onmouseover="u =  2">\\\</a>
<a href="http://www.htmlpoint.com/jscript/giochi/giochi07codice.htm" onmouseover="u =  3">///</a>
<a href="http://www.htmlpoint.com/jscript/giochi/giochi07codice.htm" onmouseover="u =  4">\\\</a>
<a href="http://www.htmlpoint.com/jscript/giochi/giochi07codice.htm" onmouseover="u =  5">///</a>
<a href="http://www.htmlpoint.com/jscript/giochi/giochi07codice.htm" onmouseover="u =  6">\\\</a>
<a href="http://www.htmlpoint.com/jscript/giochi/giochi07codice.htm" onmouseover="u =  7">///</a>
<a href="http://www.htmlpoint.com/jscript/giochi/giochi07codice.htm" onmouseover="u =  8">\\\</a>
<a href="http://www.htmlpoint.com/jscript/giochi/giochi07codice.htm" onmouseover="u =  9">///</a>
<a href="http://www.htmlpoint.com/jscript/giochi/giochi07codice.htm" onmouseover="u = 10">\\\</a>
<a href="http://www.htmlpoint.com/jscript/giochi/giochi07codice.htm" onmouseover="u = 11">///</a>
<a href="http://www.htmlpoint.com/jscript/giochi/giochi07codice.htm" onmouseover="u = 12">\\\</a>
<a href="http://www.htmlpoint.com/jscript/giochi/giochi07codice.htm" onmouseover="u = 13">///</a>
<a href="http://www.htmlpoint.com/jscript/giochi/giochi07codice.htm" onmouseover="u = 14">\\\</a>
<a href="http://www.htmlpoint.com/jscript/giochi/giochi07codice.htm" onmouseover="u = 15">///</a>
.... wave your cursor here
<br><br>
<input type="button" name="Button1" value="[ Start Game ]" onclick="startclock(this.form)">
</p></form>
</center>
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de ScriptShow
Val: 2.019
Plata
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

Mover un objeto con el teclado en un juego js

Publicado por ScriptShow (670 intervenciones) el 21/04/2017 12:29:07
Saludos Adrian, veamos una posible opción:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
<HTML>
<HEAD>
<TITLE>Pong</TITLE>
</HEAD>
<BODY BGCOLOR="#FFFFFF">
<SCRIPT LANGUAGE="JavaScript">
<!--  to hide script contents from old browsers
// rev 0.04
var crlf = "\r\n";  
// should determine from browser type
var x = 1;
var y = 1;
var dx = 1;
var dy = 1;
var s = "";
var u = 0;
var oops_flag = false;
var score = 0;

function move1() {
x += dx;
if (x > 31) { 
x -= 2 * Math.abs(dx); 
if (dx > 0) dx = -dx; }
if (x <  0) { 
x += 2 * Math.abs(dx); 
if (dx < 0) dx = -dx; }
y += dy;
if (y > 14) { 
y -= 2 * Math.abs(dy); 
if (dy > 0) dy = -dy; 
if (Math.abs(x - 2*u - 1) > 2) {
oops_flag = true;
}
else {
score += 1;		  
}    
}
if (y <  0) { y += 2 * Math.abs(dy); 
if (dy < 0) dy = -dy; }
}

function display1() {
var s1 = ""
var i,j;
if (oops_flag) return "Oops!! You messed up on the easiest game ever made!! I feel sorry for you!! You need a lot of practice!! Come back often and play!!!!!!";
for (j=0;j<15;j++) {

for (i=0;i<32;i++) {
if (j == y && i == x) s1 += "o";
else s1 += ".";
}
s1 += crlf;
}
var s2 = ""
for (i=0;i<16;i++) {
if (u == i) s2 += "==";
else s2 += "..";
}
return (s1+s2)
}

var timerID = null;
var timerRunning = false;
var myform;

function stopclock (){
if(timerRunning) clearTimeout(timerID);
timerRunning = false;
}

function startclock (form) {
myform = form;
oops_flag = false;
if (navigator.userAgent.indexOf("Mac") > 2) crlf = "\n";
// Make sure the clock is stopped
stopclock();
dotime();
}

function dotime () {
move1();
if (myform != null) {
myform.text3.value = display1();	  
myform.score.value = " " + score;
}
if (!oops_flag) timerID = setTimeout("dotime()",200);
timerRunning = true;
}

onkeypress=function (event) {
var chCode = event.keyCode;
if (chCode == 39) {
if (u < 15) {u++}
}
if (chCode == 37) {
if (u > 0) {u--}
}
}
//  end hiding contents from old browsers  -->
</SCRIPT>
<CENTER>
<font size="24">Pong</font>
<BR><BR>
Press Start Game to run. Press over left right arrows to move the "paddle".
<hr>
<FORM NAME="myForm">
<TEXTAREA NAME="text3" ROWS=16 COLS=34 WRAP>
[game field]
</TEXTAREA>
<BR><BR>
Score: <INPUT TYPE="text" NAME="score" SIZE=10 VALUE=0>
<BR><BR>
<INPUT TYPE="button" NAME="Button1" VALUE="[ Start Game ]" onCLick="startclock(this.form)">
</FORM>
</CENTER>
</BODY>
</HTML>

Espero sea útil.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar