mirror of
https://github.com/logsol/chuck.js.git
synced 2026-05-11 10:37:34 +00:00
added zooming with +, - and 0
This commit is contained in:
parent
cc8cf6c5f9
commit
ac27da1e31
7 changed files with 82 additions and 12 deletions
|
|
@ -30,6 +30,7 @@ function (Key) {
|
||||||
}
|
}
|
||||||
|
|
||||||
KeyboardInput.prototype._onKeyDown = function (e) {
|
KeyboardInput.prototype._onKeyDown = function (e) {
|
||||||
|
console.log(e.keyCode)
|
||||||
var key = this._getKeyByKeyCode(e.keyCode);
|
var key = this._getKeyByKeyCode(e.keyCode);
|
||||||
|
|
||||||
if (key && !key.getActive()) {
|
if (key && !key.getActive()) {
|
||||||
|
|
|
||||||
|
|
@ -38,7 +38,11 @@ function (Parent, KeyboardInput, MouseInput, Nc, GamepadInput) {
|
||||||
|
|
||||||
space: 32,
|
space: 32,
|
||||||
|
|
||||||
tab: 9
|
tab: 9,
|
||||||
|
|
||||||
|
plus: 187,
|
||||||
|
minus: 189,
|
||||||
|
zero: 48
|
||||||
}
|
}
|
||||||
|
|
||||||
this.init(keys);
|
this.init(keys);
|
||||||
|
|
@ -63,6 +67,10 @@ function (Parent, KeyboardInput, MouseInput, Nc, GamepadInput) {
|
||||||
this.keyboardInput.registerKey(keys.up, 'jump', 'jumpStop');
|
this.keyboardInput.registerKey(keys.up, 'jump', 'jumpStop');
|
||||||
this.keyboardInput.registerKey(keys.space, 'jump', 'jumpStop');
|
this.keyboardInput.registerKey(keys.space, 'jump', 'jumpStop');
|
||||||
|
|
||||||
|
this.keyboardInput.registerKey(keys.plus, 'zoomIn');
|
||||||
|
this.keyboardInput.registerKey(keys.minus, 'zoomOut');
|
||||||
|
this.keyboardInput.registerKey(keys.zero, 'zoomReset');
|
||||||
|
|
||||||
this.keyboardInput.registerKey(keys.tab, 'showInfo', 'hideInfo');
|
this.keyboardInput.registerKey(keys.tab, 'showInfo', 'hideInfo');
|
||||||
|
|
||||||
this.keyboardInput.registerKey(keys.f, 'handActionLeft');
|
this.keyboardInput.registerKey(keys.f, 'handActionLeft');
|
||||||
|
|
@ -127,6 +135,18 @@ function (Parent, KeyboardInput, MouseInput, Nc, GamepadInput) {
|
||||||
Nc.trigger(Nc.ns.client.game.gameInfo.toggle, false);
|
Nc.trigger(Nc.ns.client.game.gameInfo.toggle, false);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
PlayerController.prototype.zoomIn = function() {
|
||||||
|
Nc.trigger(Nc.ns.client.game.zoomIn, true);
|
||||||
|
};
|
||||||
|
|
||||||
|
PlayerController.prototype.zoomOut = function() {
|
||||||
|
Nc.trigger(Nc.ns.client.game.zoomOut, false);
|
||||||
|
};
|
||||||
|
|
||||||
|
PlayerController.prototype.zoomReset = function() {
|
||||||
|
Nc.trigger(Nc.ns.client.game.zoomReset, false);
|
||||||
|
};
|
||||||
|
|
||||||
PlayerController.prototype.destroy = function() {
|
PlayerController.prototype.destroy = function() {
|
||||||
Nc.offAll(this.ncTokens);
|
Nc.offAll(this.ncTokens);
|
||||||
Parent.prototype.destroy.call(this);
|
Parent.prototype.destroy.call(this);
|
||||||
|
|
|
||||||
|
|
@ -26,6 +26,10 @@ function (DomController, Settings, Exception, Nc) {
|
||||||
Nc.on(Nc.ns.client.view.playerInfo.update, this.onUpdatePlayerInfo, this),
|
Nc.on(Nc.ns.client.view.playerInfo.update, this.onUpdatePlayerInfo, this),
|
||||||
Nc.on(Nc.ns.client.view.playerInfo.remove, this.onRemovePlayerInfo, this),
|
Nc.on(Nc.ns.client.view.playerInfo.remove, this.onRemovePlayerInfo, this),
|
||||||
|
|
||||||
|
Nc.on(Nc.ns.client.game.zoomIn, this.onZoomIn, this),
|
||||||
|
Nc.on(Nc.ns.client.game.zoomOut, this.onZoomOut, this),
|
||||||
|
Nc.on(Nc.ns.client.game.zoomReset, this.onZoomReset, this),
|
||||||
|
|
||||||
Nc.on(Nc.ns.client.view.preloadBar.update, this.onUpdateLoader, this),
|
Nc.on(Nc.ns.client.view.preloadBar.update, this.onUpdateLoader, this),
|
||||||
];
|
];
|
||||||
|
|
||||||
|
|
@ -114,6 +118,18 @@ function (DomController, Settings, Exception, Nc) {
|
||||||
throw new Exception('Abstract Function setCameraZoom not overwritten');
|
throw new Exception('Abstract Function setCameraZoom not overwritten');
|
||||||
};
|
};
|
||||||
|
|
||||||
|
AbstractView.prototype.onZoomIn = function () {
|
||||||
|
throw new Exception('Abstract Function onZoomIn not overwritten');
|
||||||
|
};
|
||||||
|
|
||||||
|
AbstractView.prototype.onZoomOut = function () {
|
||||||
|
throw new Exception('Abstract Function onZoomOut not overwritten');
|
||||||
|
};
|
||||||
|
|
||||||
|
AbstractView.prototype.onZoomReset = function () {
|
||||||
|
throw new Exception('Abstract Function onZoomReset not overwritten');
|
||||||
|
};
|
||||||
|
|
||||||
AbstractView.prototype.onFullscreenChange = function(isFullScreen) {
|
AbstractView.prototype.onFullscreenChange = function(isFullScreen) {
|
||||||
|
|
||||||
if (!isFullScreen) {
|
if (!isFullScreen) {
|
||||||
|
|
|
||||||
|
|
@ -21,6 +21,7 @@ function (Parent, DomController, PIXI, Settings, Nc) {
|
||||||
this.loader = null;
|
this.loader = null;
|
||||||
this.init();
|
this.init();
|
||||||
this.pixi = PIXI;
|
this.pixi = PIXI;
|
||||||
|
this.currentZoom = Settings.ZOOM_DEFAULT;
|
||||||
|
|
||||||
PIXI.scaleModes.DEFAULT = PIXI.scaleModes.NEAREST;
|
PIXI.scaleModes.DEFAULT = PIXI.scaleModes.NEAREST;
|
||||||
}
|
}
|
||||||
|
|
@ -121,11 +122,17 @@ function (Parent, DomController, PIXI, Settings, Nc) {
|
||||||
}
|
}
|
||||||
|
|
||||||
PixiView.prototype.calculateCameraPosition = function() {
|
PixiView.prototype.calculateCameraPosition = function() {
|
||||||
var zoom = this.container.scale.x;
|
var targetZoom = this.currentZoom;
|
||||||
|
|
||||||
|
var oldZoom = (this.container.scale.x + this.container.scale.y) / 2;
|
||||||
|
var newZoom = (targetZoom -oldZoom) * Settings.CAMERA_GLIDE / 100;
|
||||||
|
|
||||||
|
this.container.scale.x += newZoom;
|
||||||
|
this.container.scale.y += newZoom;
|
||||||
|
|
||||||
var target = this.me.getHeadPosition();
|
var target = this.me.getHeadPosition();
|
||||||
target.x *= -Settings.RATIO * zoom;
|
target.x *= -Settings.RATIO * targetZoom;
|
||||||
target.y *= -Settings.RATIO * zoom;
|
target.y *= -Settings.RATIO * targetZoom;
|
||||||
|
|
||||||
target.x -= this.me.playerController.xyInput.x * Settings.STAGE_WIDTH / 4;
|
target.x -= this.me.playerController.xyInput.x * Settings.STAGE_WIDTH / 4;
|
||||||
target.y += this.me.playerController.xyInput.y * Settings.STAGE_HEIGHT / 4;
|
target.y += this.me.playerController.xyInput.y * Settings.STAGE_HEIGHT / 4;
|
||||||
|
|
@ -154,10 +161,13 @@ function (Parent, DomController, PIXI, Settings, Nc) {
|
||||||
return pos;
|
return pos;
|
||||||
};
|
};
|
||||||
|
|
||||||
PixiView.prototype.setCameraZoom = function (z) {
|
PixiView.prototype.setCameraZoom = function (zoom) {
|
||||||
this.container.scale.x = z;
|
/*
|
||||||
this.container.scale.y = z;
|
var oldZoom = this.container.scale.x;
|
||||||
|
|
||||||
|
this.container.scale.x += (zoom -oldZoom) * Settings.CAMERA_GLIDE / 100;
|
||||||
|
this.container.scale.y += (zoom -oldZoom) * Settings.CAMERA_GLIDE / 100;
|
||||||
|
*/
|
||||||
};
|
};
|
||||||
|
|
||||||
PixiView.prototype.onFullscreenChange = function(isFullScreen) {
|
PixiView.prototype.onFullscreenChange = function(isFullScreen) {
|
||||||
|
|
@ -165,10 +175,11 @@ function (Parent, DomController, PIXI, Settings, Nc) {
|
||||||
|
|
||||||
if(isFullScreen) {
|
if(isFullScreen) {
|
||||||
this.renderer.resize(window.innerWidth, window.innerHeight);
|
this.renderer.resize(window.innerWidth, window.innerHeight);
|
||||||
this.setCameraZoom(window.innerWidth / 600);
|
this.currentZoom = window.innerWidth / Settings.STAGE_WIDTH;
|
||||||
|
console.log();
|
||||||
} else {
|
} else {
|
||||||
this.renderer.resize(600, 400);
|
this.renderer.resize(600, 400);
|
||||||
this.setCameraZoom(1);
|
this.currentZoom = 1;
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
@ -305,6 +316,22 @@ function (Parent, DomController, PIXI, Settings, Nc) {
|
||||||
this.loader.visible = progress < 100;
|
this.loader.visible = progress < 100;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
PixiView.prototype.onZoomIn = function() {
|
||||||
|
if(this.currentZoom + Settings.ZOOM_FACTOR <= Settings.ZOOM_MAX) {
|
||||||
|
this.currentZoom += Settings.ZOOM_FACTOR;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
PixiView.prototype.onZoomOut = function() {
|
||||||
|
if(this.currentZoom - Settings.ZOOM_FACTOR > 0) {
|
||||||
|
this.currentZoom -= Settings.ZOOM_FACTOR;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
PixiView.prototype.onZoomReset = function() {
|
||||||
|
this.currentZoom = Settings.ZOOM_DEFAULT;
|
||||||
|
};
|
||||||
|
|
||||||
PixiView.prototype.destroy = function() {
|
PixiView.prototype.destroy = function() {
|
||||||
|
|
||||||
for (var i = 0; i < this.stage.children.length; i++) {
|
for (var i = 0; i < this.stage.children.length; i++) {
|
||||||
|
|
|
||||||
|
|
@ -3,6 +3,9 @@ define(function() {
|
||||||
var Settings = {
|
var Settings = {
|
||||||
STAGE_WIDTH: 600,
|
STAGE_WIDTH: 600,
|
||||||
STAGE_HEIGHT: 400,
|
STAGE_HEIGHT: 400,
|
||||||
|
ZOOM_FACTOR: 0.8,
|
||||||
|
ZOOM_DEFAULT: 1,
|
||||||
|
ZOOM_MAX: 10,
|
||||||
|
|
||||||
// BOX2D INITIALATORS
|
// BOX2D INITIALATORS
|
||||||
BOX2D_WORLD_AABB_SIZE: 3000,
|
BOX2D_WORLD_AABB_SIZE: 3000,
|
||||||
|
|
|
||||||
|
|
@ -63,7 +63,10 @@ function (Exception) {
|
||||||
game: {
|
game: {
|
||||||
gameInfo: {
|
gameInfo: {
|
||||||
toggle: null
|
toggle: null
|
||||||
}
|
},
|
||||||
|
zoomIn: null,
|
||||||
|
zoomOut: null,
|
||||||
|
zoomReset: null
|
||||||
},
|
},
|
||||||
to: {
|
to: {
|
||||||
server: {
|
server: {
|
||||||
|
|
|
||||||
|
|
@ -15,7 +15,7 @@
|
||||||
},
|
},
|
||||||
"main": "",
|
"main": "",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"socket.io": ">= 0.9.6",
|
"socket.io": "= 0.9.6",
|
||||||
"node-static": ">= 0.6.0",
|
"node-static": ">= 0.6.0",
|
||||||
"requirejs": "= 2.0.4",
|
"requirejs": "= 2.0.4",
|
||||||
"node-fork": ">= 0.4.2",
|
"node-fork": ">= 0.4.2",
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue