Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP

Comparing changes

Choose two branches to see what's changed or to start a new pull request. If you need to, you can also compare across forks.

Open a pull request

Create a new pull request by comparing changes across two branches. If you need to, you can also compare across forks.
base fork: phated/monwarp
base: 8a3b86c5db
...
head fork: phated/monwarp
compare: d3bbae80ef
  • 4 commits
  • 12 files changed
  • 0 commit comments
  • 3 contributors
Commits on Dec 04, 2011
@davidsiaw davidsiaw added mouse events. no touch events yet 5d1b030
@davidsiaw davidsiaw a bit of docs c23043b
Commits on Apr 21, 2012
@monteslu monteslu merged readme 834f56a
Commits on May 09, 2012
Luis Montes fix lint issues d3bbae8
View
51 README
@@ -14,4 +14,53 @@ https://chrome.google.com/webstore/detail/acjijhekaonkmkedfdabbageicfhhlgo
More documentation coming. Promise :)
--Luis
+-Luis
+=======
+
+Firstly:
+Since this is a dojo extension it requires dojo. I'm going to assume you already use dojo, and your site has a directory named "dojo". Your site should have a directory structure that looks roughly like:
+
+/js
+ /dojo
+ /cldr
+ /data
+ /date
+ /dnd
+ /fx
+ /io
+ /nls
+ /rsources
+ /rpc
+ /selector
+ /store
+ - dojo.js
+ - other js files...
+
+To install:
+put the /src/mwe from the src/ folder into your dojo directory
+
+To use:
+here's a skeleton HTML file
+
+<html>
+<head>
+<title></title>
+<script
+ src="js/dojo/dojo.js"
+ djConfig="baseUrl: 'js/dojo/', modulePaths: {mwe: 'mwe'}">
+</script>
+</head>
+<body>
+<script>
+ dojo.require('mwe.GameCore');
+ dojo.require('mwe.Sprite');
+ dojo.require('mwe.ResourceManager');
+ dojo.require('mwe.GameAction');
+</script>
+</body>
+</html>
+
+This pulls in monwarp.
+
+extra doc credit:
+@davidsiaw
View
90 src/mwe/Animation.js
@@ -6,13 +6,13 @@ dojo.provide("mwe.Animation");
dojo.declare("mwe.AnimFrame",null,{
- endTime: 0,
- imgSlotX: 0,
- imgSlotY: 0,
- image: null,
+ endTime: 0,
+ imgSlotX: 0,
+ imgSlotY: 0,
+ image: null,
constructor: function(args){
- dojo.safeMixin(this, args);
+ dojo.safeMixin(this, args);
}
});
@@ -32,35 +32,35 @@ dojo.declare("mwe.Animation",null,{
Creates a new, empty Animation.
*/
constructor: function(args){
- dojo.safeMixin(this, args);
- //this.frames= args.frames;
- this.start();
+ dojo.safeMixin(this, args);
+ //this.frames= args.frames;
+ this.start();
},
-
-
+
+
createFromTile: function(frameCount,frameTimes,img,h,w,ySlot){
- var anim = new mwe.Animation({
- image: img,
- height: h,
- width: w
- });
-
- var isFTArray = dojo.isArray(frameTimes);
-
- var currentFrameTime = 1;
- if(!ySlot){
- ySlot = 0;
- }
- for(var j = 0; j < frameCount; j++){
- if(isFTArray){
- currentFrameTime = frameTimes[j];
- }else{
- currentFrameTime = frameTimes;
- }
- anim.addFrame(currentFrameTime,j,ySlot);
- }
- return anim;
- },
+ var anim = new mwe.Animation({
+ image: img,
+ height: h,
+ width: w
+ });
+
+ var isFTArray = dojo.isArray(frameTimes);
+
+ var currentFrameTime = 1;
+ if(!ySlot){
+ ySlot = 0;
+ }
+ for(var j = 0; j < frameCount; j++){
+ if(isFTArray){
+ currentFrameTime = frameTimes[j];
+ }else{
+ currentFrameTime = frameTimes;
+ }
+ anim.addFrame(currentFrameTime,j,ySlot);
+ }
+ return anim;
+ },
/**
Creates a duplicate of this animation. The list of frames
@@ -78,9 +78,9 @@ dojo.declare("mwe.Animation",null,{
*/
addFrame: function(duration,imageSlotX,imageSlotY)
{
- if(!this.frames){
- this.frames = [];
- }
+ if(!this.frames){
+ this.frames = [];
+ }
this.totalDuration += duration;
this.frames.push(new mwe.AnimFrame({endTime: this.totalDuration, image: this.image, imgSlotX: imageSlotX, imgSlotY: imageSlotY}));
},
@@ -123,27 +123,17 @@ dojo.declare("mwe.Animation",null,{
getFrame: function(i) {
return this.frames[i];
},
-
+
/**
- Gets this Animation's current animation frame. Returns null if this
- animation has no frames.
+ Gets this Animation's current animation frame. Returns null if this
+ animation has no frames.
*/
getCurrentFrame: function() {
- if (this.frames.length == 0) {
+ if (this.frames.length === 0) {
return null;
}
else {
return this.getFrame(this.currFrameIndex);
}
}
-});
-
-
-
-
-
-
-
-
-
-
+});
View
246 src/mwe/GameAction.js
@@ -21,128 +21,148 @@ dojo.provide("mwe.GameAction");
/*********************** mwe.GameAction ********************************************/
dojo.declare("mwe.GameAction",null,{
- name : null,
- behavior: 0,
- amount : 0,
- state : 0,
-
+ name : null,
+ behavior: 0,
+ amount : 0,
+ state : 0,
+ x : -1,
+ y : -1,
+
statics: {
- /**
- Normal behavior. The isPressed() method returns true
- as long as the key is held down.
- */
- NORMAL : 0,
-
- /**
- Initial press behavior. The isPressed() method returns
- true only after the key is first pressed, and not again
- until the key is released and pressed again.
- */
- DETECT_INITAL_PRESS_ONLY : 1,
-
- STATE_RELEASED : 0,
- STATE_PRESSED : 1,
- STATE_WAITING_FOR_RELEASE : 2
- },
+ /**
+ Normal behavior. The isPressed() method returns true
+ as long as the key is held down.
+ */
+ NORMAL : 0,
+
+ /**
+ Initial press behavior. The isPressed() method returns
+ true only after the key is first pressed, and not again
+ until the key is released and pressed again.
+ */
+ DETECT_INITAL_PRESS_ONLY : 1,
+
+ STATE_RELEASED : 0,
+ STATE_PRESSED : 1,
+ STATE_WAITING_FOR_RELEASE : 2,
+ STATE_MOVED : 3
+ },
/**
Creates new game action.
*/
constructor: function(args){
- dojo.safeMixin(this, args);
- this.reset();
+ dojo.safeMixin(this, args);
+ this.reset();
},
-
- /**
- Gets the name of this GameAction.
- */
- getName : function() {
- return this.name;
- },
-
-
- /**
- Resets this GameAction so that it appears like it hasn't
- been pressed.
- */
- reset : function() {
- this.state = this.statics.STATE_RELEASED;
- this.amount = 0;
- },
-
-
- /**
- Taps this GameAction. Same as calling press() followed
- by release().
- */
- tap: function() {
- this.press();
- this.release();
- },
+
+ /**
+ Gets the name of this GameAction.
+ */
+ getName : function() {
+ return this.name;
+ },
+
+
+ /**
+ Resets this GameAction so that it appears like it hasn't
+ been pressed.
+ */
+ reset : function() {
+ this.state = this.statics.STATE_RELEASED;
+ this.amount = 0;
+ },
+
+
+ /**
+ Taps this GameAction. Same as calling press() followed
+ by release().
+ */
+ tap: function() {
+ this.press();
+ this.release();
+ },
- /**
- Signals that the key was pressed.
- */
- press: function() {
- //this.pressAmt(1);
- this.state = this.statics.STATE_PRESSED;
- },
-
-
- /**
- Signals that the key was pressed a specified number of
- times, or that the mouse move a specified distance.
- */
- pressAmt: function(amount) {
- if (this.state != this.statics.STATE_WAITING_FOR_RELEASE) {
- this.amount+=amount;
- this.state = this.statics.STATE_PRESSED;
- }
-
- },
-
-
- /**
- Signals that the key was released
- */
- release : function() {
- this.state = this.statics.STATE_RELEASED;
- },
-
-
- /**
- Returns whether the key was pressed or not since last
- checked.
- */
- isPressed : function() {
- //return (this.getAmount() != 0);
- if(this.state == this.statics.STATE_PRESSED){
- return true;
- }else{
- return false;
- }
- },
-
-
- /**
- For keys, this is the number of times the key was
- pressed since it was last checked.
- For mouse movement, this is the distance moved.
- */
- getAmount : function() {
- var retVal = this.amount;
- if (retVal != 0) {
- if (this.state == this.statics.STATE_RELEASED) {
- amount = 0;
- }
- else if (this.behavior == this.statics.DETECT_INITAL_PRESS_ONLY) {
- this.state = this.statics.STATE_WAITING_FOR_RELEASE;
- this.amount = 0;
- }
- }
- return retVal;
- }
+ /**
+ Signals that the key was pressed.
+ */
+ press: function() {
+ //this.pressAmt(1);
+ this.state = this.statics.STATE_PRESSED;
+ },
+
+
+ /**
+ Signals that the key was pressed a specified number of
+ times, or that the mouse move a specified distance.
+ */
+ pressAmt: function(amount) {
+ if (this.state != this.statics.STATE_WAITING_FOR_RELEASE) {
+ this.amount+=amount;
+ this.state = this.statics.STATE_PRESSED;
+ }
+
+ },
+
+
+ /**
+ Signals that the key was released
+ */
+ release : function() {
+ this.state = this.statics.STATE_RELEASED;
+ },
+
+ /**
+ Signals that a movement has occurred
+ */
+ move: function(x, y) {
+ this.x = x;
+ this.y = y;
+ },
+
+
+ /**
+ Returns whether the key was pressed or not since last
+ checked.
+ */
+ isPressed : function() {
+ //return (this.getAmount() != 0);
+ if(this.state == this.statics.STATE_PRESSED){
+ return true;
+ }else{
+ return false;
+ }
+ },
+
+
+ /**
+ Gets the current position of the mouse/touch if its registered
+ as a mouse/touch action
+ */
+ getPosition : function() {
+ var self = this;
+ return {x:self.x, y:self.y};
+ },
+
+ /**
+ For keys, this is the number of times the key was
+ pressed since it was last checked.
+ For mouse movement, this is the distance moved.
+ */
+ getAmount : function() {
+ var retVal = this.amount;
+ if (retVal !== 0) {
+ if (this.state == this.statics.STATE_RELEASED) {
+ amount = 0;
+ }
+ else if (this.behavior == this.statics.DETECT_INITAL_PRESS_ONLY) {
+ this.state = this.statics.STATE_WAITING_FOR_RELEASE;
+ this.amount = 0;
+ }
+ }
+ return retVal;
+ }
});
View
320 src/mwe/GameCore.js
@@ -1,5 +1,5 @@
/**
-
+
Copyright 2011 Luis Montes
Licensed under the Apache License, Version 2.0 (the "License");
@@ -25,12 +25,12 @@ dojo.require('mwe.InputManager');
dojo.declare("mwe.GameCore",null,{
-
- statics: {FONT_SIZE : 24},
+
+ statics: {FONT_SIZE : 24},
isRunning : false,
-
+
canvasId: null,
maxStep: 40, //max number of milliseconds between updates. (in case user switches tabs and requestAnimationFrame pauses)
contextType: '2d',
@@ -40,11 +40,11 @@ dojo.declare("mwe.GameCore",null,{
inputManager: null,
loadingForeground: '#00F',
loadingBackground: '#FFF',
-
+
constructor: function(args){
- dojo.safeMixin(this, args);
- // canvas: null,
- },
+ dojo.safeMixin(this, args);
+ // canvas: null,
+ },
/**
@@ -59,17 +59,17 @@ dojo.declare("mwe.GameCore",null,{
Calls init() and gameLoop()
*/
run: function() {
- if(!this.isRunning){
- this.init();
- this.loadResources(this.canvas);
- this.launchLoop();
- }
+ if(!this.isRunning){
+ this.init();
+ this.loadResources(this.canvas);
+ this.launchLoop();
+ }
},
/**
Should be overidden in the subclasses to create images
- */
- loadResources: function(canvas){
+ */
+ loadResources: function(canvas){
},
@@ -78,135 +78,135 @@ dojo.declare("mwe.GameCore",null,{
*/
init: function() {
if(!this.canvas){
- this.canvas = dojo.byId(this.canvasId);
+ this.canvas = dojo.byId(this.canvasId);
}
- if(!this.canvas){
- alert('Sorry, your browser does not support canvas. I recommend any browser but Internet Explorer');
- return;
- }
-
- if(!this.context){
- this.context = this.canvas.getContext(this.contextType);
- }
- if(!this.canvas){
- alert('Sorry, your browser does not support a ' + this.contextType + ' drawing surface on canvas. I recommend any browser but Internet Explorer');
- return;
- }
-
-
- //try using game object's dimensions, or set dimensions to canvas if none are specified
- if(this.height){
- this.canvas.height = this.height;
- }else{
- this.height = this.canvas.height;
- }
- if(this.width){
- this.canvas.width = this.width;
- }else{
- this.width = this.canvas.width;
- }
-
-
- if(!this.inputManager){
- this.inputManager = new mwe.InputManager({canvas: this.canvas});
- }
-
- this.initInput(this.inputManager);
-
+ if(!this.canvas){
+ alert('Sorry, your browser does not support canvas. I recommend any browser but Internet Explorer');
+ return;
+ }
+
+ if(!this.context){
+ this.context = this.canvas.getContext(this.contextType);
+ }
+ if(!this.canvas){
+ alert('Sorry, your browser does not support a ' + this.contextType + ' drawing surface on canvas. I recommend any browser but Internet Explorer');
+ return;
+ }
+
+
+ //try using game object's dimensions, or set dimensions to canvas if none are specified
+ if(this.height){
+ this.canvas.height = this.height;
+ }else{
+ this.height = this.canvas.height;
+ }
+ if(this.width){
+ this.canvas.width = this.width;
+ }else{
+ this.width = this.canvas.width;
+ }
+
+
+ if(!this.inputManager){
+ this.inputManager = new mwe.InputManager({canvas: this.canvas});
+ }
+
+ this.initInput(this.inputManager);
+
this.isRunning = true;
},
-
-
+
+
/**
Should be overidden in the subclasses to map input to actions
- */
+ */
initInput: function(inputManager) {
-
+
},
-
+
/**
Should be overidden in the subclasses to deal with user input
- */
+ */
handleInput: function(inputManager,elapsedTime) {
-
+
},
/**
Runs through the game loop until stop() is called.
- */
- gameLoop: function() {
- this.currTime = new Date().getTime();
- this.elapsedTime = Math.min(this.currTime - this.prevTime, this.maxStep);
+ */
+ gameLoop: function() {
+ this.currTime = new Date().getTime();
+ this.elapsedTime = Math.min(this.currTime - this.prevTime, this.maxStep);
this.prevTime = this.currTime;
-
+
//it's using a resource manager, but resources haven't finished
- if(this.resourceManager && !this.resourceManager.resourcesReady()){
-
- this.updateLoadingScreen(this.elapsedTime);
- this.drawLoadingScreen(this.context);
-
- }else{
- this.handleInput(this.inputManager,this.elapsedTime);
-
- if(!this.paused){
- // update
- this.update(this.elapsedTime);
- }
-
- // draw the screen
- this.context.save();
- this.draw(this.context);
- this.context.restore();
- }
-
- //requestAnimFrame(this.gameLoop(), this.canvas);
- },
-
- /**
- Launches the game loop.
- */
- launchLoop: function(){
-
- this.elapsedTime = 0;
- var startTime = Date.now();
- this.currTime = startTime;
- this.prevTime = startTime;
-
-
-
- // shim layer with setTimeout fallback
- window.requestAnimFrame = (function(){
- return window.requestAnimationFrame ||
- window.webkitRequestAnimationFrame ||
- window.mozRequestAnimationFrame ||
- window.oRequestAnimationFrame ||
- window.msRequestAnimationFrame ||
- function(/* function */ callback, /* DOMElement */ element){
- window.setTimeout(callback, 1000 / 60);
- };
- })();
-
-
- // usage:
- // instead of setInterval(render, 16) ....
-
- var thisgame = this;
-
- (function animloop(){
- thisgame.gameLoop();
- requestAnimFrame(animloop, document);
- })();
-
- //requestAnimFrame(this.gameLoop(), this.canvas);
- //this.gameLoop();
- },
-
- loopRunner: function(){
- this.gameLoop();
- requestAnimFrame(this.loopRunner, this.canvas);
-
- },
+ if(this.resourceManager && !this.resourceManager.resourcesReady()){
+
+ this.updateLoadingScreen(this.elapsedTime);
+ this.drawLoadingScreen(this.context);
+
+ }else{
+ this.handleInput(this.inputManager,this.elapsedTime);
+
+ if(!this.paused){
+ // update
+ this.update(this.elapsedTime);
+ }
+
+ // draw the screen
+ this.context.save();
+ this.draw(this.context);
+ this.context.restore();
+ }
+
+ //requestAnimFrame(this.gameLoop(), this.canvas);
+ },
+
+ /**
+ Launches the game loop.
+ */
+ launchLoop: function(){
+
+ this.elapsedTime = 0;
+ var startTime = Date.now();
+ this.currTime = startTime;
+ this.prevTime = startTime;
+
+
+
+ // shim layer with setTimeout fallback
+ window.requestAnimFrame = (function(){
+ return window.requestAnimationFrame ||
+ window.webkitRequestAnimationFrame ||
+ window.mozRequestAnimationFrame ||
+ window.oRequestAnimationFrame ||
+ window.msRequestAnimationFrame ||
+ function(/* function */ callback, /* DOMElement */ element){
+ window.setTimeout(callback, 1000 / 60);
+ };
+ })();
+
+
+ // usage:
+ // instead of setInterval(render, 16) ....
+
+ var thisgame = this;
+
+ (function animloop(){
+ thisgame.gameLoop();
+ requestAnimFrame(animloop, document);
+ })();
+
+ //requestAnimFrame(this.gameLoop(), this.canvas);
+ //this.gameLoop();
+ },
+
+ loopRunner: function(){
+ this.gameLoop();
+ requestAnimFrame(this.loopRunner, this.canvas);
+
+ },
/**
Updates the state of the game/animation based on the
@@ -218,45 +218,45 @@ dojo.declare("mwe.GameCore",null,{
/**
- Override this if want to use it update sprites/objects on loading screen
- */
- updateLoadingScreen: function(elapsedTime) {
- },
-
+ Override this if want to use it update sprites/objects on loading screen
+ */
+ updateLoadingScreen: function(elapsedTime) {
+ },
+
/**
Draws to the screen. Subclasses or instances must override this
method to paint items to the screen.
*/
draw: function(context){
- if(this.contextType == '2d'){
- context.font = "14px sans-serif";
- context.fillText("This game does not have its own draw function!", 10, 50);
- }
+ if(this.contextType == '2d'){
+ context.font = "14px sans-serif";
+ context.fillText("This game does not have its own draw function!", 10, 50);
+ }
},
-
+
drawLoadingScreen: function(context){
-
- if(this.resourceManager && (this.contextType == '2d')){
- context.fillStyle = this.loadingBackground;
- context.fillRect(0,0, this.width,this.height);
-
- context.fillStyle = this.loadingForeground;
- context.strokeStyle = this.loadingForeground;
-
- var textPxSize = Math.floor(this.height/12);
- //var loadingText = ;
- //var textWidth = ctx.measureText(s.text).width;
-
- context.font = "bold " + textPxSize + "px sans-serif";
-
- context.fillText("Loading... " + this.resourceManager.getPercentComplete() + "%", this.width * 0.1, this.height * 0.55);
-
- context.strokeRect(this.width * 0.1, this.height * 0.7,this.width * 0.8, this.height * 0.1);
- context.fillRect(this.width * 0.1, this.height * 0.7,(this.width * 0.8) * this.resourceManager.getPercentComplete()/100, this.height * 0.1);
-
-
- context.lineWidth = 4;
- }
-
+
+ if(this.resourceManager && (this.contextType == '2d')){
+ context.fillStyle = this.loadingBackground;
+ context.fillRect(0,0, this.width,this.height);
+
+ context.fillStyle = this.loadingForeground;
+ context.strokeStyle = this.loadingForeground;
+
+ var textPxSize = Math.floor(this.height/12);
+ //var loadingText = ;
+ //var textWidth = ctx.measureText(s.text).width;
+
+ context.font = "bold " + textPxSize + "px sans-serif";
+
+ context.fillText("Loading... " + this.resourceManager.getPercentComplete() + "%", this.width * 0.1, this.height * 0.55);
+
+ context.strokeRect(this.width * 0.1, this.height * 0.7,this.width * 0.8, this.height * 0.1);
+ context.fillRect(this.width * 0.1, this.height * 0.7,(this.width * 0.8) * this.resourceManager.getPercentComplete()/100, this.height * 0.1);
+
+
+ context.lineWidth = 4;
+ }
+
}
});
View
242 src/mwe/InputManager.js
@@ -1,5 +1,5 @@
/**
-
+
Copyright 2011 Luis Montes
Licensed under the Apache License, Version 2.0 (the "License");
@@ -20,25 +20,25 @@ dojo.provide("mwe.InputManager");
/*********************** mwe.InputManager ********************************************/
dojo.declare("mwe.InputManager",null,{
-
- keyActions: [],
- mouseAction: null,
- touchAction: null,
-
- canvas: null,
+
+ keyActions: [],
+ mouseAction: null,
+ touchAction: null,
+
+ canvas: null,
constructor: function(args){
- dojo.safeMixin(this, args);
- dojo.connect(document,"onkeydown",this,this.keyPressed);
- dojo.connect(document,"onkeyup",this,this.keyReleased);
- dojo.connect(this.canvas,"onmousedown",this,this.mouseDown);
- dojo.connect(document,"onmouseup",this,this.mouseUp);
- dojo.connect(this.canvas,"onmousemove",this,this.mouseMove);
-
- dojo.connect(document,'ontouchend',this,this.touchEnd);
- dojo.connect(this.canvas,'ontouchstart',this.touchStart);
- dojo.connect(this.canvas,'ontouchmove',this.touchMove);
- },
+ dojo.safeMixin(this, args);
+ dojo.connect(document,"onkeydown",this,this.keyPressed);
+ dojo.connect(document,"onkeyup",this,this.keyReleased);
+ dojo.connect(this.canvas,"onmousedown",this,this.mouseDown);
+ dojo.connect(document,"onmouseup",this,this.mouseUp);
+ dojo.connect(this.canvas,"onmousemove",this,this.mouseMove);
+
+ dojo.connect(document,'ontouchend',this,this.touchEnd);
+ dojo.connect(this.canvas,'ontouchstart',this.touchStart);
+ dojo.connect(this.canvas,'ontouchmove',this.touchMove);
+ },
/**
@@ -46,111 +46,107 @@ dojo.declare("mwe.InputManager",null,{
defined in java.awt.KeyEvent. If the key already has
a GameAction mapped to it, the new GameAction overwrites
it.
- */
- mapToKey: function(gameAction, keyCode) {
- if(!this.keyActions){
- this.keyActions = [];
- }
- this.keyActions[keyCode] = gameAction;
- },
-
- addKeyAction: function(keyCode,initialPressOnly){
- var ga = new mwe.GameAction();
- if(initialPressOnly){
- ga.behavior = ga.statics.DETECT_INITAL_PRESS_ONLY;
- }
- this.mapToKey(ga,keyCode);
- },
-
- setMouseAction: function(gameAction){
- this.mouseAction = gameAction;
- },
-
- setTouchAction: function(gameAction){
- this.touchAction = gameAction;
- },
-
-
- mouseUp: function(e){
-
-
- },
-
- mouseDown: function(e){
-
-
- },
-
- mouseMove: function(e){
-
- },
-
- touchStart: function(e){
-
-
- },
-
- touchEnd: function(e){
-
-
- },
-
- touchMove: function(e){
-
- },
-
-
- getKeyAction: function(e) {
-
- if (this.keyActions.length) {
- return this.keyActions[e.keyCode];
- }
- else {
- return null;
- }
- },
-
- keyPressed : function(e) {
- var gameAction = this.getKeyAction(e);
- if (gameAction && (!gameAction.isPressed())) {
- gameAction.press();
- }
-
-
- // make sure the key isn't processed for anything else
- // TODO
- //e.consume();
- },
-
-
- keyReleased : function(e) {
- var gameAction = this.getKeyAction(e);
- if (gameAction != null) {
- gameAction.release();
- }
-
-
- // make sure the key isn't processed for anything else
- // TODO
- //e.consume();
- },
-
-
- keyTyped: function(e) {
- // make sure the key isn't processed for anything else
- // TODO
- //e.consume();
- },
-
- /**
- * Get the mouse pointer location within the canvas' coordinates, not the page's
- */
- getMouseLoc: function(evt){
- var coordsM = dojo.coords(this.canvas);
- return {x: Math.round(evt.clientX - coordsM.x), y: Math.round(evt.clientY - coordsM.y)};
- }
-
-
+ */
+ mapToKey: function(gameAction, keyCode) {
+ if(!this.keyActions){
+ this.keyActions = [];
+ }
+ this.keyActions[keyCode] = gameAction;
+ },
+
+ addKeyAction: function(keyCode,initialPressOnly){
+ var ga = new mwe.GameAction();
+ if(initialPressOnly){
+ ga.behavior = ga.statics.DETECT_INITAL_PRESS_ONLY;
+ }
+ this.mapToKey(ga,keyCode);
+ },
+
+ setMouseAction: function(gameAction){
+ this.mouseAction = gameAction;
+ },
+
+ setTouchAction: function(gameAction){
+ this.touchAction = gameAction;
+ },
+
+
+ mouseUp: function(e) {
+ this.mouseAction.release();
+ },
+
+ mouseDown: function(e){
+ this.mouseAction.press();
+ },
+
+ mouseMove: function(e){
+ this.mouseAction.move(e.clientX, e.clientY);
+ },
+
+ touchStart: function(e){
+ this.touchAction.press();
+ },
+
+ touchEnd: function(e){
+ this.touchAction.release();
+ },
+
+ touchMove: function(e){
+ this.touchAction.move(e.clientX, e.clientY);
+ },
+
+
+ getKeyAction: function(e) {
+
+ if (this.keyActions.length) {
+ return this.keyActions[e.keyCode];
+ }
+ else {
+ return null;
+ }
+ },
+
+ keyPressed : function(e) {
+ var gameAction = this.getKeyAction(e);
+ if (gameAction && (!gameAction.isPressed())) {
+ gameAction.press();
+ }
+
+
+ // make sure the key isn't processed for anything else
+ // TODO
+ //e.consume();
+ },
+
+
+ keyReleased : function(e) {
+ var gameAction = this.getKeyAction(e);
+ if (gameAction !== null) {
+ gameAction.release();
+ }
+
+
+ // make sure the key isn't processed for anything else
+ // TODO
+ //e.consume();
+ },
+
+
+ keyTyped: function(e) {
+ // make sure the key isn't processed for anything else
+ // TODO
+ //e.consume();
+ },
+
+ /**
+ * Get the mouse pointer location within the canvas' coordinates, not the page's
+ */
+ getMouseLoc: function(evt){
+ var coordsM = dojo.coords(this.canvas);
+ return {x: Math.round(evt.clientX - coordsM.x), y: Math.round(evt.clientY - coordsM.y)};
+ }
+
+
});
View
132 src/mwe/ResourceManager.js
@@ -1,5 +1,5 @@
/**
-
+
Copyright 2011 Luis Montes
Licensed under the Apache License, Version 2.0 (the "License");
@@ -23,75 +23,75 @@ dojo.provide("mwe.ResourceManager");
dojo.declare("mwe.ResourceManager",null,{
-
- imageCount: 0,
- loadedImages: 0,
- allLoaded: false,
-
- imageDir : 'images/',
- imgList: [],
- constructor: function(args){
- dojo.safeMixin(this, args);
+ imageCount: 0,
+ loadedImages: 0,
+ allLoaded: false,
+
+ imageDir : 'images/',
+ imgList: [],
+
+ constructor: function(args){
+ dojo.safeMixin(this, args);
+
-
- },
+ },
/**
Gets an image.
- */
- loadImage: function(filename,width, height) {
-
-
- //if we already have the image, just return it
- for(i=0;i<this.imgList.length;i++){
- if(this.imgList[i].name == filename ){
- return this.imgList[i].img;
- }
- }
-
- this.allLoaded = false;
-
- var img = new Image();
-
- if(this.imageDir){
- filename = this.imageDir + filename;
- }
- img.src = filename;
-
- this.imgList.push({name:filename,img:img});
-
- return img;
- },
-
- resourcesReady: function(){
- if(this.allLoaded){
- return true;
- }else{
- for(i=0; i<this.imgList.length; i++){
- if(!this.imgList[i].img.complete){
- return false;
- }
- }
- this.allLoaded = true;
- return true;
- }
- },
-
- getPercentComplete: function(){
- var numComplete = 0.0;
- for(i=0; i<this.imgList.length; i++){
- if(this.imgList[i].img.complete){
- numComplete = numComplete + 1.0;
- }
- }
- if(this.imgList.length === 0){
- return 0;
- }else{
- return Math.round((numComplete/this.imgList.length) * 100.0);
- }
-
-
- }
+ */
+ loadImage: function(filename,width, height) {
+
+
+ //if we already have the image, just return it
+ for(i=0;i<this.imgList.length;i++){
+ if(this.imgList[i].name == filename ){
+ return this.imgList[i].img;
+ }
+ }
+
+ this.allLoaded = false;
+
+ var img = new Image();
+
+ if(this.imageDir){
+ filename = this.imageDir + filename;
+ }
+ img.src = filename;
+
+ this.imgList.push({name:filename,img:img});
+
+ return img;
+ },
+
+ resourcesReady: function(){
+ if(this.allLoaded){
+ return true;
+ }else{
+ for(i=0; i<this.imgList.length; i++){
+ if(!this.imgList[i].img.complete){
+ return false;
+ }
+ }
+ this.allLoaded = true;
+ return true;
+ }
+ },
+
+ getPercentComplete: function(){
+ var numComplete = 0.0;
+ for(i=0; i<this.imgList.length; i++){
+ if(this.imgList[i].img.complete){
+ numComplete = numComplete + 1.0;
+ }
+ }
+ if(this.imgList.length === 0){
+ return 0;
+ }else{
+ return Math.round((numComplete/this.imgList.length) * 100.0);
+ }
+
+
+ }
});
View
60 src/mwe/Sprite.js
@@ -21,8 +21,8 @@ dojo.declare("mwe.Sprite", null, {
Creates a new Sprite object.
*/
constructor: function(args){
- dojo.safeMixin(this, args);
- //anim = args.anim;
+ dojo.safeMixin(this, args);
+ //anim = args.anim;
},
/**
@@ -30,7 +30,7 @@ dojo.declare("mwe.Sprite", null, {
on the velocity.
*/
update: function(elapsedTime) {
- this.x += this.dx * elapsedTime;
+ this.x += this.dx * elapsedTime;
this.y += this.dy * elapsedTime;
this.anim.update(elapsedTime);
},
@@ -100,42 +100,42 @@ dojo.declare("mwe.Sprite", null, {
per millisecond.
*/
setVelocityX: function(dx) {
-
+
this.dx = this.limitSpeed(dx);
},
/**
Sets the vertical velocity of this Sprite in pixels
per millisecond.
- */
- setVelocityY: function(dy) {
- this.dy = this.limitSpeed(dy);
- },
+ */
+ setVelocityY: function(dy) {
+ this.dy = this.limitSpeed(dy);
+ },
limitSpeed: function(v){
if(this.getMaxSpeed()){
- if(Math.abs(v) > this.getMaxSpeed()){
- if(v > 0){
- return this.getMaxSpeed();
- }else if(v < 0){
- return this.getMaxSpeed();
- }else{
- return 0;
- }
- }else{
- return v;
- }
+ if(Math.abs(v) > this.getMaxSpeed()){
+ if(v > 0){
+ return this.getMaxSpeed();
+ }else if(v < 0){
+ return this.getMaxSpeed();
+ }else{
+ return 0;
+ }
+ }else{
+ return v;
+ }
}else{
- return v;
+ return v;
}
},
- /**
+ /**
Gets the maximum speed of this Creature.
- */
- getMaxSpeed: function() {
- return this.maxSpeed;
- },
+ */
+ getMaxSpeed: function() {
+ return this.maxSpeed;
+ },
@@ -145,13 +145,13 @@ dojo.declare("mwe.Sprite", null, {
getCurrentFrame: function() {
return this.anim.getCurrentFrame();
},
-
+
drawCurrentFrame: function(context){
- var cf = this.anim.getCurrentFrame();
- context.drawImage(this.anim.image, cf.imgSlotX * this.anim.width, cf.imgSlotY * this.anim.height, this.anim.width, this.anim.height, this.x,this.y, this.anim.width, this.anim.height);
+ var cf = this.anim.getCurrentFrame();
+ context.drawImage(this.anim.image, cf.imgSlotX * this.anim.width, cf.imgSlotY * this.anim.height, this.anim.width, this.anim.height, this.x,this.y, this.anim.width, this.anim.height);
},
-
- clone: function() {
+
+ clone: function() {
return new mwe.Sprite({anim: this.anim.clone()});
}
});
View
78 src/mwe/box2d/Box.js
@@ -1,5 +1,5 @@
/**
-
+
Copyright 2011 Luis Montes
Licensed under the Apache License, Version 2.0 (the "License");
@@ -57,35 +57,35 @@ dojo.declare("mwe.box2d.Box",null,{
constructor: function(args){
dojo.safeMixin(this, args);
if(args.intervalRate){
- this.intervalRate = parseInt(args.intervalRate);
+ this.intervalRate = parseInt(args.intervalRate,10);
}
-
+
if(!this.bodiesMap){
- this.bodiesMap = [];
+ this.bodiesMap = [];
}
if(!this.fixturesMap){
- this.fixturesMap = [];
+ this.fixturesMap = [];
}
-
+
this.world = new b2World(
- new b2Vec2(this.gravityX, this.gravityY)
- , this.allowSleep
+ new b2Vec2(this.gravityX, this.gravityY)
+ , this.allowSleep
);
-
+
},
-
+
update : function() {
var start = Date.now();
var stepRate = (this.adaptive) ? (now - this.lastTimestamp) / 1000 : (1 / this.intervalRate);
this.world.Step(
- stepRate //frame-rate
- , 10 //velocity iterations
- , 10 //position iterations
+ stepRate //frame-rate
+ , 10 //velocity iterations
+ , 10 //position iterations
);
this.world.ClearForces();
return (Date.now() - start);
},
-
+
getState : function() {
var state = {};
for (var b = this.world.GetBodyList(); b; b = b.m_next) {
@@ -95,7 +95,7 @@ dojo.declare("mwe.box2d.Box",null,{
}
return state;
},
-
+
setBodies : function(bodyEntities) {
console.log('bodies',bodyEntities);
for(var id in bodyEntities) {
@@ -104,36 +104,36 @@ dojo.declare("mwe.box2d.Box",null,{
}
this.ready = true;
},
-
+
addBody : function(entity) {
var bodyDef = new b2BodyDef();
var fixDef = new b2FixtureDef();
fixDef.restitution = entity.restitution;
fixDef.density = entity.density;
fixDef.friction = entity.friction;
-
-
+
+
if(entity.staticBody){
bodyDef.type = b2Body.b2_staticBody;
}else{
bodyDef.type = b2Body.b2_dynamicBody;
}
-
-
+
+
if (entity.radius) {
- fixDef.shape = new b2CircleShape(entity.radius);
+ fixDef.shape = new b2CircleShape(entity.radius);
} else if (entity.points) {
- var points = [];
- for (var i = 0; i < entity.points.length; i++) {
- var vec = new b2Vec2();
- vec.Set(entity.points[i].x, entity.points[i].y);
- points[i] = vec;
- }
- fixDef.shape = new b2PolygonShape;
- fixDef.shape.SetAsArray(points, points.length);
+ var points = [];
+ for (var i = 0; i < entity.points.length; i++) {
+ var vec = new b2Vec2();
+ vec.Set(entity.points[i].x, entity.points[i].y);
+ points[i] = vec;
+ }
+ fixDef.shape = new b2PolygonShape();
+ fixDef.shape.SetAsArray(points, points.length);
} else {
- fixDef.shape = new b2PolygonShape;
- fixDef.shape.SetAsBox(entity.halfWidth, entity.halfHeight);
+ fixDef.shape = new b2PolygonShape();
+ fixDef.shape.SetAsBox(entity.halfWidth, entity.halfHeight);
}
bodyDef.position.x = entity.x;
bodyDef.position.y = entity.y;
@@ -141,19 +141,19 @@ dojo.declare("mwe.box2d.Box",null,{
bodyDef.linearDamping = entity.linearDamping;
bodyDef.angularDamping = entity.angularDamping;
this.bodiesMap[entity.id] = this.world.CreateBody(bodyDef);
- this.bodiesMap[entity.id].CreateFixture(fixDef);
-
+ this.bodiesMap[entity.id].CreateFixture(fixDef);
+
},
-
+
applyImpulse : function(bodyId, degrees, power) {
//console.log('bodiesMap',this.bodiesMap);
var body = this.bodiesMap[bodyId];
body.ApplyImpulse(new b2Vec2(Math.cos(degrees * (Math.PI / 180)) * power,
- Math.sin(degrees * (Math.PI / 180)) * power),
- body.GetWorldCenter());
+ Math.sin(degrees * (Math.PI / 180)) * power),
+ body.GetWorldCenter());
//console.log('applying impluse',bodyId, degrees, power);
},
-
+
removeBody : function(id) {
if(this.bodiesMap[id]){
this.bodiesMap[id].DestroyFixture(this.fixturesMap[id]);
@@ -162,6 +162,6 @@ dojo.declare("mwe.box2d.Box",null,{
delete this.bodiesMap[id];
}
}
-
-
+
+
});
View
10 src/mwe/box2d/CircleEntity.js
@@ -4,7 +4,7 @@ dojo.require('mwe.box2d.Entity');
dojo.declare("mwe.box2d.CircleEntity", [mwe.box2d.Entity], {
radius: 1,
-
+
constructor: function(/* Object */args){
dojo.safeMixin(this, args);
},
@@ -12,17 +12,17 @@ dojo.declare("mwe.box2d.CircleEntity", [mwe.box2d.Entity], {
ctx.fillStyle = this.color;
ctx.beginPath();
- ctx.arc(this.x * SCALE, this.y * SCALE, this.radius * SCALE, 0, Math.PI * 2, true);
+ ctx.arc(this.x * SCALE, this.y * SCALE, this.radius * SCALE, 0, Math.PI * 2, true);
ctx.closePath();
ctx.fill();
-
+
ctx.strokeStyle = '#000000';
ctx.beginPath();
- ctx.arc(this.x * SCALE, this.y * SCALE, this.radius * SCALE, 0, Math.PI * 2, true);
+ ctx.arc(this.x * SCALE, this.y * SCALE, this.radius * SCALE, 0, Math.PI * 2, true);
ctx.closePath();
ctx.stroke();
-
+
this.inherited(arguments);
}
});
View
26 src/mwe/box2d/Entity.js
@@ -1,5 +1,5 @@
/**
-
+
Copyright 2011 Luis Montes
Licensed under the Apache License, Version 2.0 (the "License");
@@ -25,14 +25,14 @@ dojo.declare("mwe.box2d.Entity", null, {
angle: 0,
center: 0,
restitution : 0.3,
- density : 1.0,
- friction : 0.9,
- linearDamping : 0,
- angularDamping : 0,
- staticBody : false,
- color: 'rgba(128,128,128,0.5)',
- hidden: false,
-
+ density : 1.0,
+ friction : 0.9,
+ linearDamping : 0,
+ angularDamping : 0,
+ staticBody : false,
+ color: 'rgba(128,128,128,0.5)',
+ hidden: false,
+
constructor: function(/* Object */args){
dojo.safeMixin(this, args);
},
@@ -40,20 +40,20 @@ dojo.declare("mwe.box2d.Entity", null, {
dojo.mixin(this, state);
},
draw: function(ctx){
-
- //black circle in entity's location
+
+ //black circle in entity's location
ctx.fillStyle = 'black';
ctx.beginPath();
ctx.arc(this.x * SCALE, this.y * SCALE, 4, 0, Math.PI * 2, true);
ctx.closePath();
ctx.fill();
-
+
//yellow circle in entity's geometric center
ctx.fillStyle = 'yellow';
ctx.beginPath();
ctx.arc(this.center.x * SCALE, this.center.y * SCALE, 2, 0, Math.PI * 2, true);
ctx.closePath();
- ctx.fill();
+ ctx.fill();
},
build : function(def) {
if (def.radius) {
View
6 src/mwe/box2d/PolygonEntity.js
@@ -3,11 +3,11 @@ dojo.provide("mwe.box2d.PolygonEntity");
dojo.require('mwe.box2d.Entity');
dojo.declare("mwe.box2d.PolygonEntity", [mwe.box2d.Entity], {
- points: null,
- constructor: function(/* Object */args){
+ points: null,
+ constructor: function(/* Object */args){
dojo.safeMixin(this, args);
if(!this.points){
- this.points = [];
+ this.points = [];
}
},
draw: function(ctx){
View
230 src/mwe/reiner/Creature.js
@@ -1,10 +1,10 @@
-/*
+/*
* This type of sprite is based off of the excellent images from Reiner's tilesets: http://www.reinerstilesets.de/
- *
- * creatures have walking, idle, and dying animations in 8 isometric directions
- * The animations directions are in E,N,NE,NW,S,SE,SW,W (alphabetical) order simply because that's
+ *
+ * creatures have walking, idle, and dying animations in 8 isometric directions
+ * The animations directions are in E,N,NE,NW,S,SE,SW,W (alphabetical) order simply because that's
* how i stitched them together using ImageMagick.
- *
+ *
*/
@@ -17,123 +17,123 @@ dojo.require("mwe.Sprite");
/*********************** mwe.Sprite ********************************************/
dojo.declare("mwe.reiner.Creature", [mwe.Sprite], {
-
- statics: {
- EAST : 0,
- NORTH : 1,
- NORTHEAST: 2,
- NORTHWEST: 3,
- SOUTH : 4,
- SOUTHEAST : 5,
- SOUTHWEST : 6,
- WEST : 7,
- STATE_WALKING : 0,
- STATE_DYING : 1,
- STATE_IDLE : 2,
-
- createAnimations: function(frameCount,frameTimes,img,h,w,ySlot){
- var anims = [];
- var isFTArray = dojo.isArray(frameTimes);
- var currentFrameTime = 1;
- if(!ySlot){
- ySlot = 0;
- }
- for(var i = 0; i < 8; i++){
- anims[i] = new mwe.Animation({height: h, width: w, image: img});
- for(j = 0; j < frameCount; j++){
- if(isFTArray){
- currentFrameTime = frameTimes[j];
- }else{
- currentFrameTime = frameTimes;
- }
- anims[i].addFrame(currentFrameTime,j + frameCount * i,ySlot);
- }
- }
- return anims;
-
- }
- },
-
- state: 0,
- walkingAnims: [],
- dyingAnims: [],
- idleAnims: [],
- direction: 0,
-
+
+ statics: {
+ EAST : 0,
+ NORTH : 1,
+ NORTHEAST: 2,
+ NORTHWEST: 3,
+ SOUTH : 4,
+ SOUTHEAST : 5,
+ SOUTHWEST : 6,
+ WEST : 7,
+ STATE_WALKING : 0,
+ STATE_DYING : 1,
+ STATE_IDLE : 2,
+
+ createAnimations: function(frameCount,frameTimes,img,h,w,ySlot){
+ var anims = [];
+ var isFTArray = dojo.isArray(frameTimes);
+ var currentFrameTime = 1;
+ if(!ySlot){
+ ySlot = 0;
+ }
+ for(var i = 0; i < 8; i++){
+ anims[i] = new mwe.Animation({height: h, width: w, image: img});
+ for(j = 0; j < frameCount; j++){
+ if(isFTArray){
+ currentFrameTime = frameTimes[j];
+ }else{
+ currentFrameTime = frameTimes;
+ }
+ anims[i].addFrame(currentFrameTime,j + frameCount * i,ySlot);
+ }
+ }
+ return anims;
+
+ }
+ },
+
+ state: 0,
+ walkingAnims: [],
+ dyingAnims: [],
+ idleAnims: [],
+ direction: 0,
+
constructor: function(args){
- this.state = this.statics.STATE_IDLE;
- this.direction = this.statics.EAST;
- dojo.safeMixin(this, args);
- },
-
- update: function(elapsedTime){
- this.x += this.dx * elapsedTime;
+ this.state = this.statics.STATE_IDLE;
+ this.direction = this.statics.EAST;
+ dojo.safeMixin(this, args);
+ },
+
+ update: function(elapsedTime){
+ this.x += this.dx * elapsedTime;
this.y += this.dy * elapsedTime;
-
+
if(this.state != this.statics.STATE_DYING){
- if(this.dx > 0 && this.dy === 0){
- this.direction = this.statics.EAST;
- }
- else if(this.dx === 0 && this.dy < 0){
- this.direction = this.statics.NORTH;
- }
- else if(this.dx > 0 && this.dy < 0){
- this.direction = this.statics.NORTHEAST;
- }
- else if(this.dx < 0 && this.dy < 0){
- this.direction = this.statics.NORTHWEST;
- }
- else if(this.dx === 0 && this.dy > 0){
- this.direction = this.statics.SOUTH;
- }
- else if(this.dx > 0 && this.dy > 0){
- this.direction = this.statics.SOUTHEAST;
- }
- else if(this.dx < 0 && this.dy > 0){
- this.direction = this.statics.SOUTHWEST;
- }
- else if(this.dx < 0 && this.dy === 0){
- this.direction = this.statics.WEST;
- }
-
- if(this.dx === 0 && this.dy === 0){
- this.state = this.statics.STATE_IDLE;
- }else{
- this.state = this.statics.STATE_WALKING;
- }
+ if(this.dx > 0 && this.dy === 0){
+ this.direction = this.statics.EAST;
+ }
+ else if(this.dx === 0 && this.dy < 0){
+ this.direction = this.statics.NORTH;
+ }
+ else if(this.dx > 0 && this.dy < 0){
+ this.direction = this.statics.NORTHEAST;
+ }
+ else if(this.dx < 0 && this.dy < 0){
+ this.direction = this.statics.NORTHWEST;
+ }
+ else if(this.dx === 0 && this.dy > 0){
+ this.direction = this.statics.SOUTH;
+ }
+ else if(this.dx > 0 && this.dy > 0){
+ this.direction = this.statics.SOUTHEAST;
+ }
+ else if(this.dx < 0 && this.dy > 0){
+ this.direction = this.statics.SOUTHWEST;
+ }
+ else if(this.dx < 0 && this.dy === 0){
+ this.direction = this.statics.WEST;
+ }
+
+ if(this.dx === 0 && this.dy === 0){
+ this.state = this.statics.STATE_IDLE;
+ }else{
+ this.state = this.statics.STATE_WALKING;
+ }
}
-
+
if(this.state === this.statics.STATE_WALKING){
- this.anim = this.walkingAnims[this.direction];
+ this.anim = this.walkingAnims[this.direction];
}else if(this.state === this.statics.STATE_DYING){
- this.anim = this.dyingAnims[this.direction];
+ this.anim = this.dyingAnims[this.direction];
}else{
- this.anim = this.idleAnims[this.direction];
+ this.anim = this.idleAnims[this.direction];
}
-
+
this.anim.update(elapsedTime);
- },
-
- createAnimations: function(frameCount,frameTimes,img,h,w,ySlot){
- var anims = [];
- var isFTArray = dojo.isArray(frameTimes);
- var currentFrameTime = 1;
- if(!ySlot){
- ySlot = 0;
- }
- for(var i = 0; i < 8; i++){
- anims[i] = new mwe.Animation({height: h, width: w, image: img});
- for(j = 0; j < frameCount; j++){
- if(isFTArray){
- currentFrameTime = frameTimes[j];
- }else{
- currentFrameTime = frameTimes;
- }
- anims[i].addFrame(currentFrameTime,j + frameCount * i,ySlot);
- }
- }
- return anims;
-
- }
-
+ },
+
+ createAnimations: function(frameCount,frameTimes,img,h,w,ySlot){
+ var anims = [];
+ var isFTArray = dojo.isArray(frameTimes);
+ var currentFrameTime = 1;
+ if(!ySlot){
+ ySlot = 0;
+ }
+ for(var i = 0; i < 8; i++){
+ anims[i] = new mwe.Animation({height: h, width: w, image: img});
+ for(j = 0; j < frameCount; j++){
+ if(isFTArray){
+ currentFrameTime = frameTimes[j];
+ }else{
+ currentFrameTime = frameTimes;
+ }
+ anims[i].addFrame(currentFrameTime,j + frameCount * i,ySlot);
+ }
+ }
+ return anims;
+
+ }
+
});

No commit comments for this range

Something went wrong with that request. Please try again.