javascript - Crafty.js displays white screen -
i'm using crafty.js(html5 engine games) won't load. white screen! set right , i'm using chrome. checked if file names ok, , are. can help me please? code:
class="snippet-code-html lang-html prettyprint-override"><html xmlns="http://www.w3.org/1999/xhtml"> <head> <script type="text/javascript" src="https://raw.github.com/craftyjs/crafty/release/dist/crafty.js"></script> <script type="text/javascript" src="box2dweb.js"></script> <script type="text/javascript" src="box2d.js"></script> <title>knights , ninjas</title> </head> <body> <div onload="load();" id="game"></div> <script type="text/javascript"> function load() { crafty.init(400, 320); crafty.audio.add("bgm", "ambler.mp3"); crafty.audio.play("bgm", -1); crafty.scene("titlescene", function() { crafty.background("#000"); crafty.sprite("banner.png", {introbanner:[0,0,320,105]}); var banner=crafty.e("2d, dom, introbanner"); banner.x=30; banner.y=200; banner.bind('keydown', function(e) { if(e.key==crafty.keys.right_arrow) { crafty.enterscene("gamescene"); } }); }); } crafty.c("paddlecontrols", { init: function() { this.requires("keyboard"); }, paddlecontrols: function() { this.bind("enterframe", function() { if (this.isdown("d")) { var myval=this.body.getposition(); return this.body.setpositionandangle(new b2vec2(myval.x+0.1, myval.y), this.body.getangle()); } if (this.isdown("a")) { var myval=this.body.getposition(); return this.body.setpositionandangle(new b2vec2(myval.x-0.1, myval.y), this.body.getangle()); } if (this.isdown("w") && window.canjump==true) { window.canjump=false; return this.body.applyimpulse(new b2vec2(0, -20), this.body.getworldcenter()); } }); return this; }}); crafty.c("jumpwall", function() {}); crafty.c("lethalentity", function() {}); crafty.scene("gamescene",function() { crafty.background("#f0f"); //gravity x, gravity y, pixel meter, speed enabled crafty.box2d.init(0, 1, 32, false); crafty.sprite("wall.png", {wallsprite:[0,0,220,12]}); crafty.sprite("back.png", {backsprite:[0,0,400,320]}); var back=crafty.e("2d, canvas, backsprite"); var wall1=crafty.e("2d, canvas, box2d, wallsprite, jumpwall"); wall1.x=13; wall1.y=100; //color("green").attr({x: 13, y: 100, w: 220, h: 12}); wall1.box2d({ bodytype: 'static' }); //must after positioning var wall2=crafty.e("2d, canvas, box2d, wallsprite, jumpwall"); wall2.x=140; wall2.y=200; //wall2.color("green").attr({x: 140, y: 200, w: 220, h: 12}); wall2.box2d({ bodytype: 'static' }); crafty.sprite("knight2.png", {knight:[0,0,30,32]}); var knight=crafty.e("2d, canvas, knight, box2d, paddlecontrols"); knight.y=200; knight.x=30; knight.paddlecontrols(); knight.box2d({ bodytype: 'dynamic' }); knight.body.setfixedrotation(true); knight.oncontact("jumpwall", function() { window.canjump=true; }); crafty.e("2d, canvas, color, box2d").attr({x: 1, y: 1, w: 10, h: 320}).box2d({ bodytype: 'static' }); crafty.e("2d, canvas, color, box2d").attr({x: 390, y:1, w: 10, h: 320}).box2d({ bodytype: 'static' }); crafty.e("2d, canvas, color, box2d, jumpwall").attr({x: 1, y: 1, w: 400, h: 10}).box2d({ bodytype: 'static' }); crafty.e("2d, canvas, color, box2d, jumpwall").attr({x: 1, y: 310, w: 400, h: 10}).box2d({ bodytype: 'static' }); crafty.sprite("ninjas.png", {redninja:[0,0,32,30], blueninja:[32,0,43,30]}); window.redninja=crafty.e("2d, canvas, redninja, box2d, lethalentity"); window.redninja.y=50; window.redninja.x=150; window.redninja.box2d({ bodytype: 'kinematic' }); window.redninja.body.setlinearvelocity(new b2vec2(0.33, 0)); knight.oncontact("lethalentity", function() { if(this.isdown("s")==false) crafty.enterscene("titlescene"); }); window.redninja.bind("enterframe", function() { var myval=this.body.getposition(); if(myval.x>400/32) //convert pixels meters { this.body.setpositionandangle(new b2vec2(0,50/32), this.body.getangle()); } }); window.blueninja=crafty.e("2d, canvas, blueninja, box2d, lethalentity"); window.blueninja.y=50; window.blueninja.x=30; window.blueninja.box2d({ bodytype: 'dynamic' }); window.blueninja.bind("enterframe", function() { var myval=this.body.getposition(); return this.body.setpositionandangle(new b2vec2(myval.x+0.1, myval.y), this.body.getangle()); }); }); crafty.enterscene("titlescene"); }; </script> </body> </html>
i doing exact samething. chnaged javascript link @ top.
<script type="text/javascript" src="https://rawgithub.com/craftyjs/crafty/release/dist/crafty.js"></script> do stages can problem shoot code.
javascript html5 craftyjs
No comments:
Post a Comment