Pagina 1 di 1
[JS] Problema codice Istanza
Inviato: martedì 22 aprile 2014, 16:21
da treled
salve, come posso fare in questo modo:
Codice: Seleziona tutto
var jirafa = null;
function init()
{
jirafa = new jirafa();
}
essendo che jirafa è una :
Codice: Seleziona tutto
function jirafa(){
this.gameLoop = null;
var self = this;
etc..
il codice html:
Codice: Seleziona tutto
<!DOCTYPE html>
<html>
<head>
<title> jirafa Ping Pong</title>
<style>
body{
background-color: #e0f4fc;
}
canvas {
padding-left: 0;
padding-right: 0;
margin-left: auto;
margin-right: auto;
display: block;
width: 800px;
}
</style>
<script type="text/javascript" src="../../js/jirafa.js"></script>
<script type="text/javascript" src="./pong.js"></script>
<meta charset="utf-8">
</head>
<body onload="init();">
<div align="center">
<canvas id="game" width="800" height="600">
</canvas>
<h2>Ping Pong</h2>
</div>
</body>
</html>
ma mi restituisce :
Codice: Seleziona tutto
Uncaught TypeError: Cannot read property 'audio' of null pong.js:1
(anonymous function) pong.js:1
Uncaught TypeError: object is not a function jirafa.js:179
init jirafa.js:179
onload index.html:22
essendo che non viene richiamata in modo corretto ?
l'errore lo da qui:
Codice: Seleziona tutto
var jirafa = null;
function init()
{
jirafa = new jirafa();
}
come posso fare?
grazie mille, e buona giornata.
Re: [JS] Problema codice Istanza
Inviato: martedì 22 aprile 2014, 16:23
da Zoff
Posta il codice di pong.js
Re: [JS] Problema codice Istanza
Inviato: martedì 22 aprile 2014, 16:26
da treled
Codice: Seleziona tutto
var click_mouse = jirafa.audio.load('pong_click.mp3');
var stick_hit = jirafa.audio.load('pong_hit.mp3');
var background = jirafa.image.load('pong.png');
var game_width = 800;
var game_height = 600;
var scorea = 0, scoreb = 0;
var ballx = (game_width / 2);
var bally = (game_height / 2);
var ballvx = 0, ballvy = 0;
var posy = 150;
var cpuy = 100;
jirafa.input.mouse.isMove(game_mouseMove);
jirafa.input.mouse.isDown(game_mouseDown);
jirafa.input.touch.isMove(game_touchMove);
jirafa.input.touch.isDown(game_touchDown);
function game_touchMove (ev) {
if (!ev)
ev = event;
posy = ev.touches[0].pageY;
return false;
}
function game_touchDown (e) {
if (ballvx == 0) { ballvx = 10; ballvy = 0.4;
jirafa.audio.play(click_mouse);
}
}
function game_mouseMove (ev) {
if (ev.layerX || ev.layerX == 0) { // Firefox
posy = ev.layerY;
} else if (ev.offsetX || ev.offsetX == 0) { // Opera & Chrome
posy = ev.offsetY;
}
}
function game_mouseDown (e) {
if (ballvx == 0) { ballvx = 10; ballvy = 0.4;
jirafa.audio.play(click_mouse);
}
}
jirafa.draw = function()
{
// pulisco il game
jirafa.clear();
//background
jirafa.image.draw(background, 0, 0);
// disegno le barre
jirafa.graphics.rect(20,posy - 40,10,80, '#0080C0','#000000');
jirafa.graphics.rect(game_width - 30,cpuy - 40,10,80, '#00603C','#000000');
// disegno la pallina
jirafa.graphics.circle(ballx, bally, 6, '#ffffff', '#000000',1);
// scrivo i punteggi
jirafa.text.print('fill',"PLAYER: " + scorea,20,25,'bold 10px arial','#0080C0');
jirafa.text.print('fill',"CPU: " + scoreb, game_width - 60,25,'bold 10px arial','#FFFFFF');
}
jirafa.update = function()
{
// controllo cpu
if (cpuy < bally) cpuy +=6;
if (cpuy > bally) cpuy -=6;
// aggiorno dati e posizioni degli oggetti nella scena
if (posy < 40) posy = 40;
if (posy > game_height - 40) posy = game_height - 40;
if (cpuy < 40) cpuy = 40;
if (cpuy > game_height - 40) cpuy = game_height - 40;
ballx += ballvx;
bally += ballvy;
// URTI PALLINA
if ((ballvy > 0) && (bally >= game_height - 3)) ballvy = -ballvy;
if ((ballvy < 0) && (bally <= 3))
{
ballvy = -ballvy;
jirafa.audio.play(stick_hit);
}
if ((ballvx > 0) && (ballx >= game_width - 30) && (ballx <= game_width - 15)) {
if ((bally >= cpuy - 40) && (bally <= cpuy + 40)) {
ballvx = - ((Math.random() * 5) + 10);
ballvy = (Math.random() * 16) - 8;
jirafa.audio.play(stick_hit);
}
}
if (ballx > game_width) {
scorea ++; ballx = (game_width / 2);
bally = (game_height / 2); ballvx = 0; ballvy = 0;
jirafa.audio.play(stick_hit);
}
// URTI USER
if ((ballvx < 0) && (ballx >= 25) && (ballx <= 40)) {
if ((bally >= posy - 40) && (bally <= posy + 40)) {
jirafa.audio.play(stick_hit);
ballvx = ((Math.random() * 5) + 10);
ballvy = (Math.random() * 16) - 8;
}
}
if (ballx < 0 ) {
scoreb ++;
ballx = (game_width / 2);
bally = (game_height / 2);
ballvx = 0; ballvy = 0;
jirafa.audio.play(stick_hit);
}
}
jirafa.gameloop = function()
{
jirafa.draw();
jirafa.update();
}
jirafa.run(1000/20);
vedi ..
ma mi garbava mettere i script nel'head invece ora li tengo sotto il canvas e funziona regolare.
idee?
Re: [JS] Problema codice Istanza
Inviato: martedì 22 aprile 2014, 16:28
da Zoff
pong.js viene eseguito prima che venga terminato il caricamento della pagina, quindi prima che venga richiamato init().
Re: [JS] Problema codice Istanza
Inviato: martedì 22 aprile 2014, 16:29
da treled
scusa, vorrei metterli nell'head e nell onload= mettere onload=init();
idee?
Re: [JS] Problema codice Istanza
Inviato: martedì 22 aprile 2014, 16:35
da Zoff
Metti il codice di pong in una funzione che richiami al caricamento della pagina.
Considera comunque che è preferibile mettere tutti gli script in fondo alla pagina, in modo da renderla più responsive, i contenuti vengono caricati prima e gli script solo dopo, quando serve. In questo modo l'utente ha l'impressione di un caricamento più veloce.
Mi sembra che ti manchino le basi di Javascript, ti consiglio di approfondire Javascript prima di buttarti su canvas e html5
Re: [JS] Problema codice Istanza
Inviato: martedì 22 aprile 2014, 16:37
da treled
quindi come è adesso va bene lo stesso ed è più veloce?
ti ringrazio se e cosi la lascio cosi.
Ora mi studio bene la guida che ho comprato che c'è la base del javascript e poi insegna ad usare canvas per far video giochi.
Re: [JS] Problema codice Istanza
Inviato: martedì 22 aprile 2014, 16:40
da Zoff
"va bene" nel senso che gli script sono nel punto giusto.
Il fatto che cambiando la loro posizione comprometta il funzionamento è segno evidente che il codice è scritto male.