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

Mover un objeto con el teclado en un juego js

Publicado por ScriptShow (471 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
Revisar política de publicidad