[Mobile] Add mobile controls.
They're invisible. Dpad on left, drift button on right, reverse button above it. Pressing the dpad starts holding an item - releasing touch releases the item. Flick forward or back to choose item direction.gh-pages
parent
a773b60b95
commit
446d07f1b4
|
@ -7,6 +7,11 @@
|
||||||
// includes: main.js
|
// includes: main.js
|
||||||
//
|
//
|
||||||
|
|
||||||
|
function getPlayerControls() {
|
||||||
|
if (mobile) return controlMobile;
|
||||||
|
else return controlDefault;
|
||||||
|
}
|
||||||
|
|
||||||
window.controlDefault = function() {
|
window.controlDefault = function() {
|
||||||
|
|
||||||
var thisObj = this;
|
var thisObj = this;
|
||||||
|
@ -28,7 +33,96 @@ window.controlDefault = function() {
|
||||||
|
|
||||||
//-1 to 1, intensity.
|
//-1 to 1, intensity.
|
||||||
turn: (keysArray[37]?-1:0)+(keysArray[39]?1:0),
|
turn: (keysArray[37]?-1:0)+(keysArray[39]?1:0),
|
||||||
airTurn: (keysArray[40]?-1:0)+(keysArray[38]?1:0) //air excitebike turn, doesn't really have much function
|
airTurn: (keysArray[40]?-1:0)+(keysArray[38]?1:0) //air excitebike turn, item fire direction
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
window.controlMobile = function() {
|
||||||
|
var thisObj = this;
|
||||||
|
this.local = true;
|
||||||
|
var kart;
|
||||||
|
var item = false;
|
||||||
|
|
||||||
|
this.setKart = function(k) {
|
||||||
|
kart = k;
|
||||||
|
thisObj.kart = k;
|
||||||
|
}
|
||||||
|
this.fetchInput = fetchInput;
|
||||||
|
|
||||||
|
function searchForTouch(rect) { //{touch: Touch, enterLeave: number} 1 is enter, leave is 2,
|
||||||
|
for (var i=0; i<touches.length; i++) {
|
||||||
|
var touch = touches[i];
|
||||||
|
var inNow = (touch.x > rect[0] && touch.y > rect[1] && touch.x < rect[2] && touch.y < rect[3]);
|
||||||
|
var inBefore = (touch.lastx > rect[0] && touch.lasty > rect[1] && touch.lastx < rect[2] && touch.lasty < rect[3]);
|
||||||
|
|
||||||
|
var active = inNow && !touch.released;
|
||||||
|
|
||||||
|
if (inNow == inBefore && inNow) {
|
||||||
|
return {touch: touch, enterLeave: 0, active: active};
|
||||||
|
} else if (inNow) {
|
||||||
|
return {touch: touch, enterLeave: 1, active: active};
|
||||||
|
} else if (inBefore) {
|
||||||
|
return {touch: touch, enterLeave: 2, active: active};
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
|
function step(start, end, value) {
|
||||||
|
return Math.max(0, Math.min(1, (value-start)/(end-start)));
|
||||||
|
}
|
||||||
|
|
||||||
|
function fetchInput() {
|
||||||
|
var targW = 1136;
|
||||||
|
var targH = 640;
|
||||||
|
//window.touches array is filled by the game container
|
||||||
|
//touches [{x:number (0-1), y:number (0-1), pressed:boolean, released:boolean, lastx:number (0-1), lasty:number (0-1)}]
|
||||||
|
|
||||||
|
//accel unless reverse button is pressed
|
||||||
|
var reverse = searchForTouch([955/targW, 320/targH, (955+125)/targW, (320+125)/targH]);
|
||||||
|
reverse = (reverse != null) && reverse.active;
|
||||||
|
|
||||||
|
var driftTouch = searchForTouch([780/targW, 468/targH, (780+300)/targW, (468+125)/targH]); //drift button on the right
|
||||||
|
var itemTouch = searchForTouch([50/targW, 468/targH, (50+300)/targW, (468+125)/targH]); //touch the button exactly
|
||||||
|
var dPadTouch = searchForTouch([0/targW, (468-50)/targH, (0+400)/targW, (468+225)/targH]); //allow for some space
|
||||||
|
|
||||||
|
var turn = 0;
|
||||||
|
if (dPadTouch != null && dPadTouch.active) {
|
||||||
|
turn = step(0/targW, 400/targW, dPadTouch.touch.x);
|
||||||
|
//digitize
|
||||||
|
turn = Math.floor(turn*3) - 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
var itemDir = 0;
|
||||||
|
if (!item) {
|
||||||
|
//if we touch the dpad (more exact than direction), start pressing item
|
||||||
|
if (itemTouch != null && itemTouch.active && itemTouch.touch.pressed) {
|
||||||
|
item = true;
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
//if we release dpad, fire the item
|
||||||
|
if (dPadTouch == null || !dPadTouch.active) {
|
||||||
|
if (dPadTouch != null) {
|
||||||
|
//set direction based on flick direction or position
|
||||||
|
var vel = dPadTouch.touch.lasty - dPadTouch.touch.y;
|
||||||
|
if (vel > 5/targH) itemDir = -1; //flicked down
|
||||||
|
if (vel < -5/targH) itemDir = 1; //flicked up
|
||||||
|
}
|
||||||
|
item = false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return {
|
||||||
|
accel: !reverse, //x
|
||||||
|
decel: reverse, //z
|
||||||
|
drift: (driftTouch != null && driftTouch.active), //s
|
||||||
|
item: item, //a
|
||||||
|
|
||||||
|
//-1 to 1, intensity.
|
||||||
|
turn: turn,
|
||||||
|
airTurn: itemDir //air excitebike turn, item fire direction
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -101,7 +101,7 @@ window.clientScene = function(wsUrl, wsInstance, res) {
|
||||||
wsH["$+"] = function(obj) { //add kart. only used in debug circumstances. (people can't join normal gamemodes midgame)
|
wsH["$+"] = function(obj) { //add kart. only used in debug circumstances. (people can't join normal gamemodes midgame)
|
||||||
console.log("kart added");
|
console.log("kart added");
|
||||||
if (t.mode != 1) return;
|
if (t.mode != 1) return;
|
||||||
var kart = new Kart([0, -2000, 0], 0, 0, obj.k.kart, obj.k.char, new ((obj.p)?((window.prompt("press y for cpu controlled") == "y")?controlRaceCPU:controlDefault):controlNetwork)(t.activeScene.nkm, {}), t.activeScene);
|
var kart = new Kart([0, -2000, 0], 0, 0, obj.k.kart, obj.k.char, new ((obj.p)?((window.prompt("press y for cpu controlled") == "y")?controlRaceCPU:getPlayerControls()):controlNetwork)(t.activeScene.nkm, {}), t.activeScene);
|
||||||
t.activeScene.karts.push(kart);
|
t.activeScene.karts.push(kart);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -130,7 +130,7 @@ window.clientScene = function(wsUrl, wsInstance, res) {
|
||||||
var k = obj.k[i];
|
var k = obj.k[i];
|
||||||
var pKart = (i == obj.p);
|
var pKart = (i == obj.p);
|
||||||
//TODO: custom character support
|
//TODO: custom character support
|
||||||
chars.push({charN:k.char, kartN:k.kart, controller:((pKart)?((window.prompt("press y for cpu controlled") == "y")?controlRaceCPU:controlDefault):controlNetwork), raceCam:pKart, extraParams:[{k:"name", v:k.name}, {k:"active", v:k.active}]});
|
chars.push({charN:k.char, kartN:k.kart, controller:((pKart)?((window.prompt("press y for cpu controlled") == "y")?controlRaceCPU:getPlayerControls()):controlNetwork), raceCam:pKart, extraParams:[{k:"name", v:k.name}, {k:"active", v:k.active}]});
|
||||||
|
|
||||||
if (pKart) {
|
if (pKart) {
|
||||||
for (var i=0; i<7; i++) {
|
for (var i=0; i<7; i++) {
|
||||||
|
|
|
@ -63,7 +63,7 @@ window.singleScene = function(course, wsInstance, res) {
|
||||||
|
|
||||||
function setUpCourse(mainNarc, texNarc, course) {
|
function setUpCourse(mainNarc, texNarc, course) {
|
||||||
var chars = [];
|
var chars = [];
|
||||||
chars.push({charN:mchar, kartN:mkart, controller:((window.prompt("press y for cpu controlled") == "y")?controlRaceCPU:controlDefault), raceCam:true, extraParams:[{k:"name", v:"single"}, {k:"active", v:true}]});
|
chars.push({charN:mchar, kartN:mkart, controller:((window.prompt("press y for cpu controlled") == "y")?controlRaceCPU:getPlayerControls()), raceCam:true, extraParams:[{k:"name", v:"single"}, {k:"active", v:true}]});
|
||||||
|
|
||||||
for (var i=0; i<7; i++) {
|
for (var i=0; i<7; i++) {
|
||||||
var tchar = Math.floor(Math.random()*12);
|
var tchar = Math.floor(Math.random()*12);
|
||||||
|
|
|
@ -120,7 +120,7 @@ window.BombC = function(item, scene, type) {
|
||||||
this.canBeDropped = true;
|
this.canBeDropped = true;
|
||||||
this.isDestructive = true;
|
this.isDestructive = true;
|
||||||
|
|
||||||
this.isExploding = false;
|
this.explodeTime = 0;
|
||||||
|
|
||||||
this.collideKart = collideKart;
|
this.collideKart = collideKart;
|
||||||
this.onRest = onRest;
|
this.onRest = onRest;
|
||||||
|
@ -135,6 +135,10 @@ window.BombC = function(item, scene, type) {
|
||||||
}
|
}
|
||||||
|
|
||||||
function update(argument) {
|
function update(argument) {
|
||||||
|
if (item.deadTimer > 0 && t.explodeTime == 0) {
|
||||||
|
//begin explosion
|
||||||
|
t.explodeTime = 1;
|
||||||
|
}
|
||||||
if (!item.held && item.colRadius < 6) {
|
if (!item.held && item.colRadius < 6) {
|
||||||
item.colRadius += 0.2;
|
item.colRadius += 0.2;
|
||||||
if (item.colRadius > 6) item.colRadius = 6;
|
if (item.colRadius > 6) item.colRadius = 6;
|
||||||
|
|
|
@ -79,6 +79,7 @@ window.GreenShellC = function(item, scene) {
|
||||||
//sliding plane
|
//sliding plane
|
||||||
var proj = vec3.dot(item.vel, n);
|
var proj = vec3.dot(item.vel, n);
|
||||||
vec3.sub(item.vel, item.vel, vec3.scale(vec3.create(), n, proj));
|
vec3.sub(item.vel, item.vel, vec3.scale(vec3.create(), n, proj));
|
||||||
|
item.stuckTo = dat.object;
|
||||||
} else {
|
} else {
|
||||||
adjustPos = false;
|
adjustPos = false;
|
||||||
ignoreList.push(plane);
|
ignoreList.push(plane);
|
||||||
|
|
File diff suppressed because one or more lines are too long
Loading…
Reference in New Issue