From a472506f567e0b166b99f0f96ddfd4bfd995d0ed Mon Sep 17 00:00:00 2001
From: rsninja722 <jnick722547@gmail.com>
Date: Sat, 18 Apr 2020 11:43:05 -0400
Subject: [PATCH 1/5] movin and grovin
---
docs/assets/js/game.js | 1 +
docs/assets/js/index.js | 2 +
docs/assets/js/player/leg.js | 55 +++-------
docs/assets/js/player/player.js | 185 +++++++++++++++-----------------
docs/index.html | 8 +-
5 files changed, 107 insertions(+), 144 deletions(-)
diff --git a/docs/assets/js/game.js b/docs/assets/js/game.js
index dbbfc67..868774e 100644
--- a/docs/assets/js/game.js
+++ b/docs/assets/js/game.js
@@ -353,6 +353,7 @@ function line(x1, y1, x2, y2, color) {
curCtx.style = color;
curCtx.moveTo(x1 + camera.x + difx, y1 + camera.y + dify);
curCtx.lineTo(x2 + camera.x + difx, y2 + camera.y + dify);
+ curCtx.stroke();
}
function shape(x,y,relitivePoints,color) {
diff --git a/docs/assets/js/index.js b/docs/assets/js/index.js
index df0eaaa..51d3657 100644
--- a/docs/assets/js/index.js
+++ b/docs/assets/js/index.js
@@ -33,6 +33,7 @@ function update() {
// playing
case globalStates.playing:
handlePlaying();
+ player.update();
break;
// paused
case globalStates.paused:
@@ -91,6 +92,7 @@ function absoluteDraw() {
// playing
case globalStates.playing:
drawPlayingUI();
+ player.draw();
break;
// paused
case globalStates.paused:
diff --git a/docs/assets/js/player/leg.js b/docs/assets/js/player/leg.js
index 0ca436f..d8c74bc 100644
--- a/docs/assets/js/player/leg.js
+++ b/docs/assets/js/player/leg.js
@@ -1,56 +1,25 @@
-
-
// a Class for legs
class Leg{
- Leg(thighX, thighY, kneeX, kneeY, footX, footY){
+ constructor(x, y, len, angle) {
- // Thigh X,Y
- this.thighX = thighX;
- this.thighY = thighY;
+ this.x = x;
+ this.y = y;
- // Knee X,Y
- this.kneeX = kneeX;
- this.kneeY = kneeY;
- // Foot X,Y
- this.footX = footX;
- this.footY = footY
+ this.len = len;
+ this.len2 = this.len * this.len;
+ this.angle = angle;
- // Calculates distances
- this.thighToKnee = abs(math.hypot(thighX - kneeX, thighY - kneeY));
- this.kneeToFoot = abs(math.hypot(kneeX - footX, kneeY - footX));
-
- }
-
- setThigh(newX, newY){
- this.thighX = newX;
- this.thighY = newY;
-
- // Recalculates distances
- this.thighToKnee = abs(math.hypot(newX - this.kneeX, newY - this.kneeY));
- }
-
- setKnee(newX, newY){
- this.kneeX = newX;
- this.kneeY = newY;
-
- // Recalculates distances
- this.thighToKnee = abs(math.hypot(this.thighX - newX, this.thighY - newY));
- this.kneeToFoot = abs(math.hypot(newX - this.footX, newY - this.footY));
- }
-
- setFoot(newX, newY){
- this.footX = newX;
- this.footY = newY;
-
- // Recalculates distances
- this.kneeToFoot = abs(math.hypot(this.kneeX - newX, this.kneeY - newY));
+ this.x2 = this.x + len * Math.cos(angle);
+ this.y2 = this.y + len * Math.sin(angle);
}
-
+
};
-
+Leg.prototype.draw = function() {
+ line(this.x,this.y,this.x2,this.y2,"green");
+};
\ No newline at end of file
diff --git a/docs/assets/js/player/player.js b/docs/assets/js/player/player.js
index 69fb573..ea54969 100644
--- a/docs/assets/js/player/player.js
+++ b/docs/assets/js/player/player.js
@@ -3,131 +3,122 @@ class Player {
constructor(x, y){
this.x = x;
this.y = y;
- this.hipL = {x:x-5,y:y};
- this.hipR = {x:x+5,y:y};
- this.footL = {x:x-5,y:y+10};
- this.footR = {x:x+5,y:y+10};
- this.kneeL= {x:x-5,y:y+5};
- this.kneeR = {x:x+5,y:y+5};
- this.legSelected = "l";
- this.shouldMoveLeg = false;
+ this.w = 10;
+ this.h = 20;
+ this.hipLeft = {x:this.x-5,y:this.y+10};
+ this.hipRight = {x:this.x+5,y:this.y+10};
+ this.leftLeg = new Leg(this.hipLeft.x,this.hipLeft.y,50,-Math.PI/4);
+ this.rightLeg = new Leg(this.hipRight.x, this.hipRight.y, 50, Math.PI/2);
+ this.legSelected = "R";
+ this.shouldMoveLeg = true;
}
- getLeg(){
- if(this.legSelected === "l"){
- return [this.footL, this.kneeL, this.thighL];
- }
- return [this.footR, this.kneeR, this.thighR];
-
- }
+
}
+Player.prototype.getActiveLeg = function(){
+ if(this.legSelected === "L"){
+ return this.leftLeg;
+ }
+ return this.rightLeg;
+}
+Player.prototype.getLockedLeg = function(){
+ if(this.legSelected === "R"){
+ return this.leftLeg;
+ }
+ return this.rightLeg;
+}
// leg has been selected, move leg towards mouse
Player.prototype.moveLeg = function(){
-
+ // Stops if we shouldn't move leg
if(!this.shouldMoveLeg){
- return
+ return 0;
}
- var target = mousePosition();
-
- //TODO set a proper constant
- if(Math.hypot(this.x - target.x, this.y - target.y) < constants.legs.size.maximumMovement){
-
- // Points to move towards
- var ix = target.x;
- var iy = target.y;
- var leg = this.getLeg()
-
- // Check collision psuedo code need to figure out actual collison
- if(ix.collide()){
- ix = leg[0].x;
- }
-
- // Check collision psuedo code need to figure out actual collison
- if(iy.collide()){
- iy = leg[0].y;
- }
-
-
- // total distances as a square
- var targetSqrDistance = ix * ix + iy * iy;
-
- // gets lengths may need to be tweaked
- var thighKneeLength = abs(Math.hypot(leg[2].x - leg[1].x, leg[2].y - leg[1].y) * 2)
- var kneeFootLength = abs(Math.hypot(leg[1].x - leg[0].x, leg[1].y - leg[0].y) * 2)
-
-
- var thighKneeAngle = Math.max(-1, Math.min(1, (targetSqrDistance + thighKneeLength - kneeFootLength)
- / (2 * (thighKneeLength / 2) * Math.sqrt(targetSqrDistance)
- )));
-
-
+ // gets active leg & target
+ var curLeg = this.getActiveLeg();
+ var target = mousePos;
+ // move selected leg towards mouse
+
+ // var angle = turn(pointTo(curLeg,{x:curLeg.x2,y:curLeg.y2}),pointTo(curLeg,target),0.1);
+ var angle = pointTo(curLeg,target);
+ curLeg.x2 = curLeg.x + curLeg.len * Math.cos(angle);
+ curLeg.y2 = curLeg.y + curLeg.len * Math.sin(angle);
+ if(dist(curLeg,target) > curLeg.len) {
+ // move towards mouse
+ this.x += Math.cos(angle) * dist(curLeg,target)/50;
+
+ this.y += Math.sin(angle) * dist(curLeg,target)/50;
+ this.updateHips();
}
+ // if leg is right update it accordingly
+ if(this.legSelected === "R") {
+ // set angle to the locked foot to the locked hip
+ oppLeg = this.getLockedLeg();
+ angle = pointTo({x:oppLeg.x2,y:oppLeg.y2},this.hipRight);
+ // snap body to a position where the hip is attached to the leg
+ this.x = (oppLeg.x2 + oppLeg.len * Math.cos(angle)) - 5;
+ this.y = (oppLeg.y2 + oppLeg.len * Math.sin(angle)) - 10;
+ this.updateHips();
+
+ // make sure each leg ends at the hips
+ oppLeg.x = this.hipRight.x;
+ oppLeg.y = this.hipRight.y;
+ curLeg.x = this.hipLeft.x;
+ curLeg.y = this.hipLeft.y;
+ } else {
+ // set angle to the locked foot to the locked hip
+ oppLeg = this.getLockedLeg();
+ angle = pointTo({x:oppLeg.x2,y:oppLeg.y2},this.hipLeft);
- /*
-
- if target within range of leg
- ik towards target in x
- if colliding undo move
- ik towards target in y
- if colliding undo move
- if out of target
- ik towards target in x
- if colliding undo move
- ik towards target in y
- if colliding undo move
- slowly move torso towards mouse
- planted leg ik towards torso
- if torso outside the planted leg range
- move torso back
- */
-
-
- // Finds the distance between the old hip position and the future one
- requiredLegDistance = Math.hypot(currentHip.x - futureFoot.x, currentHip.y - futureFoot.y);
-
- newFootX = futureFoot.x;
- newFootY = futureFoot.y;
-
-
-
- // TODO implement collision checking
-
-
-
- newHipX = currentHip.x + futureFoot.x - currentFoot.x;
- newHipY = currentHip.y + futureFoot.y - currentFoot.y;
-
- // newKneeX =
-
-
-
-
- // returns new leg positions
- return [{x:newHipX, y:newHipY}, {x:newKneeX, y:newKneeY}, {x:newFootX, y:newFootY}];
-
+ // snap body to a position where the hip is attached to the leg
+ this.x = (oppLeg.x2 + oppLeg.len * Math.cos(angle)) + 5;
+ this.y = (oppLeg.y2 + oppLeg.len * Math.sin(angle)) - 10;
+ this.updateHips();
+ // make sure each leg ends at the hips
+ oppLeg.x = this.hipLeft.x;
+ oppLeg.y = this.hipLeft.y;
+ curLeg.x = this.hipRight.x;
+ curLeg.y = this.hipRight.y;
+ }
}
-
+Player.prototype.updateHips = function() {
+ this.hipLeft = {x:this.x-5,y:this.y+10};
+ this.hipRight = {x:this.x+5,y:this.y+10};
+}
Player.prototype.draw = function() {
-
+ rect(this.x, this.y, this.w, this.h,"green");
+ this.leftLeg.draw();
+ this.rightLeg.draw();
}
Player.prototype.update = function() {
-
-}
\ No newline at end of file
+ this.moveLeg();
+ var curLeg = this.getActiveLeg();
+ if(collidingWithWorld({x:curLeg.x2,y:curLeg.y2,w:4,h:4})||mousePress[0]){
+ if(this.legSelected === "R"){
+ this.legSelected = "L";
+ } else {
+ this.legSelected = "R";
+ }
+ }
+}
+
+
+
+var player = new Player(300,200);
\ No newline at end of file
diff --git a/docs/index.html b/docs/index.html
index 051e7d8..4ca07ad 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -32,14 +32,14 @@
<!-- <script src="assets/js/world/build.js"></script> -->
<script src="assets/js/world/level.js"></script>
- <!-- <script src="assets/js/player/player.js"></script>
<script src="assets/js/player/leg.js"></script>
- <script src="assets/js/player/lifeFunctions.js"></script> -->
+ <script src="assets/js/player/player.js"></script>
+ <!-- <script src="assets/js/player/lifeFunctions.js"></script> -->
<script src="assets/js/playing/playing.js"></script>
- <!-- <script src="assets/js/titleScreen/titleScreen.js"></script>
- <script src="assets/js/UI/ui.js"></script> -->
+ <script src="assets/js/titleScreen/titleScreen.js"></script>
+ <script src="assets/js/UI/ui.js"></script>
<!-- Webpage -->
<script src="assets/js/injection/cssinjector.js"></script>
From 7a71387b4279ade1d4c8c0ec73a82d0e4ab40b47 Mon Sep 17 00:00:00 2001
From: rsninja722 <jnick722547@gmail.com>
Date: Sat, 18 Apr 2020 13:07:49 -0400
Subject: [PATCH 2/5] smoother movement
---
docs/assets/js/player/player.js | 38 ++++++++++++++++++++-------------
docs/assets/js/world/level.js | 4 ++--
2 files changed, 25 insertions(+), 17 deletions(-)
diff --git a/docs/assets/js/player/player.js b/docs/assets/js/player/player.js
index ea54969..f953331 100644
--- a/docs/assets/js/player/player.js
+++ b/docs/assets/js/player/player.js
@@ -33,7 +33,6 @@ Player.prototype.getLockedLeg = function(){
// leg has been selected, move leg towards mouse
Player.prototype.moveLeg = function(){
-
// Stops if we shouldn't move leg
if(!this.shouldMoveLeg){
return 0;
@@ -45,27 +44,30 @@ Player.prototype.moveLeg = function(){
// move selected leg towards mouse
- // var angle = turn(pointTo(curLeg,{x:curLeg.x2,y:curLeg.y2}),pointTo(curLeg,target),0.1);
- var angle = pointTo(curLeg,target);
- curLeg.x2 = curLeg.x + curLeg.len * Math.cos(angle);
- curLeg.y2 = curLeg.y + curLeg.len * Math.sin(angle);
+ // console.log(curLeg.angle.toPrecision(5),pointTo(curLeg,target).toPrecision(5));
+ curLeg.angle = turn( curLeg.angle,pointTo(curLeg,target),0.1);
+ // var angle = pointTo(curLeg,target);
+ curLeg.x2 = curLeg.x + curLeg.len * Math.cos(curLeg.angle);
+ curLeg.y2 = curLeg.y + curLeg.len * Math.sin(curLeg.angle);
+
+ // curLeg.angle = pointTo(curLeg,{x:curLeg.x2,y:curLeg.y2});
if(dist(curLeg,target) > curLeg.len) {
// move towards mouse
- this.x += Math.cos(angle) * dist(curLeg,target)/50;
-
- this.y += Math.sin(angle) * dist(curLeg,target)/50;
+ this.x += Math.cos(pointTo(curLeg,target)) * clamp(dist(curLeg,target)/50,1,3);
+
+ this.y += Math.sin(pointTo(curLeg,target)) * clamp(dist(curLeg,target)/50,1,3);
this.updateHips();
}
// if leg is right update it accordingly
if(this.legSelected === "R") {
// set angle to the locked foot to the locked hip
oppLeg = this.getLockedLeg();
- angle = pointTo({x:oppLeg.x2,y:oppLeg.y2},this.hipRight);
+ oppLeg.angle = pointTo({x:oppLeg.x2,y:oppLeg.y2},this.hipRight);
// snap body to a position where the hip is attached to the leg
- this.x = (oppLeg.x2 + oppLeg.len * Math.cos(angle)) - 5;
- this.y = (oppLeg.y2 + oppLeg.len * Math.sin(angle)) - 10;
+ this.x = (oppLeg.x2 + oppLeg.len * Math.cos(oppLeg.angle)) - 5;
+ this.y = (oppLeg.y2 + oppLeg.len * Math.sin(oppLeg.angle)) - 10;
this.updateHips();
@@ -75,14 +77,18 @@ Player.prototype.moveLeg = function(){
curLeg.x = this.hipLeft.x;
curLeg.y = this.hipLeft.y;
+ console.log(oppLeg.angle)
+ // if leg is left update it accordingly
} else {
+ console.log(curLeg.angle)
// set angle to the locked foot to the locked hip
oppLeg = this.getLockedLeg();
- angle = pointTo({x:oppLeg.x2,y:oppLeg.y2},this.hipLeft);
+ oppLeg.angle = pointTo({x:oppLeg.x2,y:oppLeg.y2},this.hipLeft);
+
// snap body to a position where the hip is attached to the leg
- this.x = (oppLeg.x2 + oppLeg.len * Math.cos(angle)) + 5;
- this.y = (oppLeg.y2 + oppLeg.len * Math.sin(angle)) - 10;
+ this.x = (oppLeg.x2 + oppLeg.len * Math.cos(oppLeg.angle)) + 5;
+ this.y = (oppLeg.y2 + oppLeg.len * Math.sin(oppLeg.angle)) - 10;
this.updateHips();
@@ -113,12 +119,14 @@ Player.prototype.update = function() {
if(collidingWithWorld({x:curLeg.x2,y:curLeg.y2,w:4,h:4})||mousePress[0]){
if(this.legSelected === "R"){
this.legSelected = "L";
+ this.leftLeg.angle += pi;
} else {
this.legSelected = "R";
+ this.rightLeg.angle += pi;
}
}
}
-var player = new Player(300,200);
\ No newline at end of file
+var player = new Player(250,200);
\ No newline at end of file
diff --git a/docs/assets/js/world/level.js b/docs/assets/js/world/level.js
index 6e2af18..ae5e364 100644
--- a/docs/assets/js/world/level.js
+++ b/docs/assets/js/world/level.js
@@ -24,9 +24,9 @@ function drawWorldBlocks() {
}
function collidingWithWorld(objectWithXYWH) {
- for (let i = 0, l = collisionRects.length; i < l; i++) {
+ for (var i = 0; i < collisionRects.length; i++) {
if (rectrect(collisionRects[i], objectWithXYWH)) {
- return i;
+ return true;
}
}
return false;
From 8ce73a53985673bc492912c2757b03931af96e81 Mon Sep 17 00:00:00 2001
From: William <Wcmeathrel@gmail.com>
Date: Sat, 18 Apr 2020 15:34:08 -0400
Subject: [PATCH 3/5] Improved Player collision
---
docs/assets/js/player/player.js | 48 ++++++++++++++++++++++++++++++---
1 file changed, 44 insertions(+), 4 deletions(-)
diff --git a/docs/assets/js/player/player.js b/docs/assets/js/player/player.js
index ea54969..91ef6d0 100644
--- a/docs/assets/js/player/player.js
+++ b/docs/assets/js/player/player.js
@@ -11,6 +11,9 @@ class Player {
this.rightLeg = new Leg(this.hipRight.x, this.hipRight.y, 50, Math.PI/2);
this.legSelected = "R";
this.shouldMoveLeg = true;
+ this.collided = false;
+ this.lastBodyX = x;
+ this.lastBodyY = y;
}
@@ -43,13 +46,34 @@ Player.prototype.moveLeg = function(){
var curLeg = this.getActiveLeg();
var target = mousePos;
- // move selected leg towards mouse
-
+ // Last leg position
+ var lastX = curLeg.x2;
+ var lastY = curLeg.y2;
+
// var angle = turn(pointTo(curLeg,{x:curLeg.x2,y:curLeg.y2}),pointTo(curLeg,target),0.1);
var angle = pointTo(curLeg,target);
+
curLeg.x2 = curLeg.x + curLeg.len * Math.cos(angle);
curLeg.y2 = curLeg.y + curLeg.len * Math.sin(angle);
+ console.log(this.legSelected);
+ debugger
+ // Collision
+ if(collidingWithWorld({x:curLeg.x2,y:curLeg.y2,w:4,h:4})){
+ this.collided = true;
+ curLeg.x2 = lastX;
+ curLeg.y2 = lastY;
+ return 0;
+
+ }
+
+
+ if(collidingWithWorld({x:this.x, y:this.y, w:this.w, h:this.h})){
+ this.x = this.lastBodyX;
+ this.y = this.lastBodyY;
+ }
+
+
if(dist(curLeg,target) > curLeg.len) {
// move towards mouse
this.x += Math.cos(angle) * dist(curLeg,target)/50;
@@ -57,6 +81,7 @@ Player.prototype.moveLeg = function(){
this.y += Math.sin(angle) * dist(curLeg,target)/50;
this.updateHips();
}
+
// if leg is right update it accordingly
if(this.legSelected === "R") {
// set angle to the locked foot to the locked hip
@@ -93,6 +118,13 @@ Player.prototype.moveLeg = function(){
curLeg.x = this.hipRight.x;
curLeg.y = this.hipRight.y;
}
+
+
+
+
+
+ this.lastBodyX = this.x;
+ this.lastBodyY = this.y;
}
Player.prototype.updateHips = function() {
@@ -110,15 +142,23 @@ Player.prototype.draw = function() {
Player.prototype.update = function() {
this.moveLeg();
var curLeg = this.getActiveLeg();
- if(collidingWithWorld({x:curLeg.x2,y:curLeg.y2,w:4,h:4})||mousePress[0]){
+ if(mousePress[0] || this.collided){//collidingWithWorld({x:curLeg.x2,y:curLeg.y2,w:4,h:4})||
if(this.legSelected === "R"){
this.legSelected = "L";
+ this.lastFootX = this.leftLeg.x2;
+ this.lastFootX = this.leftLeg.y2;
} else {
this.legSelected = "R";
+ this.lastFootX = this.rightLeg.x2;
+ this.lastFootX = this.rightLeg.x2;
+
}
+
+ this.collided = false;
+
}
}
-var player = new Player(300,200);
\ No newline at end of file
+var player = new Player(400,200);
\ No newline at end of file
From 70de5fca979a26168402c37c12200dc4477bff6a Mon Sep 17 00:00:00 2001
From: rsninja722 <jnick722547@gmail.com>
Date: Sat, 18 Apr 2020 15:56:53 -0400
Subject: [PATCH 4/5] stuff
---
docs/assets/js/constants.js | 13 ++-
docs/assets/js/index.js | 3 +-
docs/assets/js/player/player.js | 176 +++++++++++++++++++++++---------
3 files changed, 137 insertions(+), 55 deletions(-)
diff --git a/docs/assets/js/constants.js b/docs/assets/js/constants.js
index 4570ac8..ab3930d 100644
--- a/docs/assets/js/constants.js
+++ b/docs/assets/js/constants.js
@@ -33,9 +33,16 @@ var constants = {
complex_width: 0.65
}
},
- legs:{
- size:{
- maximumMovement: 30
+ player:{
+ leg_speed: 0.1,
+ movement_divider: 50,
+ max_movement_speed: 3,
+ width: 30,
+ height: 50,
+ select_range: 10,
+ hip: {
+ offset_x: 15,
+ offset_y: 25
}
}
diff --git a/docs/assets/js/index.js b/docs/assets/js/index.js
index 51d3657..ae09bbc 100644
--- a/docs/assets/js/index.js
+++ b/docs/assets/js/index.js
@@ -62,7 +62,9 @@ function draw() {
break;
// playing
case globalStates.playing:
+ camera.zoom = 2;
drawWorldBlocks();
+ player.draw();
break;
// paused
case globalStates.paused:
@@ -92,7 +94,6 @@ function absoluteDraw() {
// playing
case globalStates.playing:
drawPlayingUI();
- player.draw();
break;
// paused
case globalStates.paused:
diff --git a/docs/assets/js/player/player.js b/docs/assets/js/player/player.js
index f953331..9566cb3 100644
--- a/docs/assets/js/player/player.js
+++ b/docs/assets/js/player/player.js
@@ -1,31 +1,28 @@
class Player {
-
- constructor(x, y){
+ constructor(x, y) {
this.x = x;
this.y = y;
- this.w = 10;
- this.h = 20;
- this.hipLeft = {x:this.x-5,y:this.y+10};
- this.hipRight = {x:this.x+5,y:this.y+10};
- this.leftLeg = new Leg(this.hipLeft.x,this.hipLeft.y,50,-Math.PI/4);
- this.rightLeg = new Leg(this.hipRight.x, this.hipRight.y, 50, Math.PI/2);
+ this.w = constants.player.width;
+ this.h = constants.player.height;
+ this.hipLeft = { x: this.x - constants.player.hip.offset_x, y: this.y + constants.player.hip.offset_y };
+ this.hipRight = { x: this.x + constants.player.hip.offset_x, y: this.y + constants.player.hip.offset_y };
+ this.leftLeg = new Leg(this.hipLeft.x, this.hipLeft.y, 50, -Math.PI / 4);
+ this.rightLeg = new Leg(this.hipRight.x, this.hipRight.y, 50, Math.PI / 2);
this.legSelected = "R";
- this.shouldMoveLeg = true;
+ this.hover = { active: false, leg: "R" };
+ this.shouldMoveLeg = false;
}
-
-
-
}
Player.prototype.getActiveLeg = function(){
- if(this.legSelected === "L"){
+ if (this.legSelected === "L") {
return this.leftLeg;
}
return this.rightLeg;
}
Player.prototype.getLockedLeg = function(){
- if(this.legSelected === "R"){
+ if (this.legSelected === "R") {
return this.leftLeg;
}
return this.rightLeg;
@@ -33,62 +30,80 @@ Player.prototype.getLockedLeg = function(){
// leg has been selected, move leg towards mouse
Player.prototype.moveLeg = function(){
+ var targetPos = mousePosition();
// Stops if we shouldn't move leg
- if(!this.shouldMoveLeg){
+ if (!this.shouldMoveLeg) {
+ var curLeg = this.getActiveLeg();
+ this.hover.active = false;
+ if (distanceToLineSegment(this.leftLeg.x, this.leftLeg.y, this.leftLeg.x2, this.leftLeg.y2, targetPos.x, targetPos.y) < constants.player.select_range) {
+ this.hover.active = true;
+ this.hover.leg = "L";
+ if(mousePress[0]) {
+ this.shouldMoveLeg = true;
+ this.legSelected = "L";
+ this.hover.active = false;
+ }
+ } else if (distanceToLineSegment(this.rightLeg.x, this.rightLeg.y, this.rightLeg.x2, this.rightLeg.y2, targetPos.x, targetPos.y) < constants.player.select_range) {
+ this.hover.active = true;
+ this.hover.leg = "R";
+ if(mousePress[0]) {
+ this.shouldMoveLeg = true;
+ this.legSelected = "R";
+ this.hover.active = false;
+ }
+ }
return 0;
}
-
+
// gets active leg & target
var curLeg = this.getActiveLeg();
- var target = mousePos;
+ var target = targetPos;
// move selected leg towards mouse
-
+
// console.log(curLeg.angle.toPrecision(5),pointTo(curLeg,target).toPrecision(5));
- curLeg.angle = turn( curLeg.angle,pointTo(curLeg,target),0.1);
+ curLeg.angle = turn(curLeg.angle, pointTo(curLeg, target), constants.player.leg_speed);
// var angle = pointTo(curLeg,target);
curLeg.x2 = curLeg.x + curLeg.len * Math.cos(curLeg.angle);
curLeg.y2 = curLeg.y + curLeg.len * Math.sin(curLeg.angle);
// curLeg.angle = pointTo(curLeg,{x:curLeg.x2,y:curLeg.y2});
- if(dist(curLeg,target) > curLeg.len) {
+ if (dist(curLeg, target) > curLeg.len) {
// move towards mouse
- this.x += Math.cos(pointTo(curLeg,target)) * clamp(dist(curLeg,target)/50,1,3);
+ this.x += Math.cos(pointTo(curLeg, target)) * clamp(dist(curLeg, target) / constants.player.movement_divider, 1, constants.player.max_movement_speed);
- this.y += Math.sin(pointTo(curLeg,target)) * clamp(dist(curLeg,target)/50,1,3);
+ this.y += Math.sin(pointTo(curLeg, target)) * clamp(dist(curLeg, target) / constants.player.movement_divider, 1, constants.player.max_movement_speed);
this.updateHips();
}
// if leg is right update it accordingly
- if(this.legSelected === "R") {
+ if (this.legSelected === "R") {
// set angle to the locked foot to the locked hip
oppLeg = this.getLockedLeg();
- oppLeg.angle = pointTo({x:oppLeg.x2,y:oppLeg.y2},this.hipRight);
+ oppLeg.angle = pointTo({ x: oppLeg.x2, y: oppLeg.y2 }, this.hipRight);
// snap body to a position where the hip is attached to the leg
- this.x = (oppLeg.x2 + oppLeg.len * Math.cos(oppLeg.angle)) - 5;
- this.y = (oppLeg.y2 + oppLeg.len * Math.sin(oppLeg.angle)) - 10;
+ this.x = (oppLeg.x2 + oppLeg.len * Math.cos(oppLeg.angle)) - constants.player.hip.offset_x;
+ this.y = (oppLeg.y2 + oppLeg.len * Math.sin(oppLeg.angle)) - constants.player.hip.offset_y;
this.updateHips();
-
+
// make sure each leg ends at the hips
oppLeg.x = this.hipRight.x;
oppLeg.y = this.hipRight.y;
curLeg.x = this.hipLeft.x;
curLeg.y = this.hipLeft.y;
- console.log(oppLeg.angle)
- // if leg is left update it accordingly
+ // if leg is left update it accordingly
} else {
- console.log(curLeg.angle)
- // set angle to the locked foot to the locked hip
+ // set angle to the locked foot to the locked hip
oppLeg = this.getLockedLeg();
- oppLeg.angle = pointTo({x:oppLeg.x2,y:oppLeg.y2},this.hipLeft);
+ oppLeg.angle = pointTo({ x: oppLeg.x2, y: oppLeg.y2 }, this.hipLeft);
// snap body to a position where the hip is attached to the leg
- this.x = (oppLeg.x2 + oppLeg.len * Math.cos(oppLeg.angle)) + 5;
- this.y = (oppLeg.y2 + oppLeg.len * Math.sin(oppLeg.angle)) - 10;
+ this.x = (oppLeg.x2 + oppLeg.len * Math.cos(oppLeg.angle)) + constants.player.hip.offset_x;
+ this.y = (oppLeg.y2 + oppLeg.len * Math.sin(oppLeg.angle)) - constants.player.hip.offset_y;
this.updateHips();
@@ -99,34 +114,93 @@ Player.prototype.moveLeg = function(){
curLeg.x = this.hipRight.x;
curLeg.y = this.hipRight.y;
}
+
+
}
Player.prototype.updateHips = function() {
- this.hipLeft = {x:this.x-5,y:this.y+10};
- this.hipRight = {x:this.x+5,y:this.y+10};
+ this.hipLeft = { x: this.x - constants.player.hip.offset_x, y: this.y + constants.player.hip.offset_y };
+ this.hipRight = { x: this.x + constants.player.hip.offset_x, y: this.y + constants.player.hip.offset_y };
}
Player.prototype.draw = function() {
- rect(this.x, this.y, this.w, this.h,"green");
- this.leftLeg.draw();
- this.rightLeg.draw();
-}
-
-Player.prototype.update = function() {
- this.moveLeg();
- var curLeg = this.getActiveLeg();
- if(collidingWithWorld({x:curLeg.x2,y:curLeg.y2,w:4,h:4})||mousePress[0]){
- if(this.legSelected === "R"){
- this.legSelected = "L";
- this.leftLeg.angle += pi;
+ rect(this.x, this.y, this.w, this.h, "green");
+ if(this.hover.active) {
+ if(this.hover.leg === "R") {
+ curCtx.shadowBlur = 10;
+ curCtx.shadowColor = "yellow";
+ curCtx.lineWidth = 3;
+ this.rightLeg.draw();
+ curCtx.lineWidth = 1;
+ curCtx.shadowBlur = 0;
+ curCtx.shadowColor = "black";
+ this.leftLeg.draw();
} else {
- this.legSelected = "R";
- this.rightLeg.angle += pi;
+ curCtx.shadowBlur = 10;
+ curCtx.shadowColor = "yellow";
+ curCtx.lineWidth = 3;
+ this.leftLeg.draw();
+ curCtx.lineWidth = 1;
+ curCtx.shadowBlur = 0;
+ curCtx.shadowColor = "black";
+ this.rightLeg.draw();
}
+ } else {
+ this.leftLeg.draw();
+ this.rightLeg.draw();
}
}
+Player.prototype.update = function() {
+ var curLeg = this.getActiveLeg();
+ if(mousePress[0]) {// if (collidingWithWorld({ x: curLeg.x2, y: curLeg.y2, w: 4, h: 4 })) {
+ // if (this.legSelected === "R") {
+ // this.legSelected = "L";
+ // this.leftLeg.angle += pi;
+ // } else {
+ // this.legSelected = "R";
+ // this.rightLeg.angle += pi;
+ // }
+ this.shouldMoveLeg = false;
+ }
+ this.moveLeg();
+ centerCameraOn(this.x,this.y);
+}
+
+// https://github.com/scottglz/distance-to-line-segment/blob/master/index.js
+function distanceSquaredToLineSegment2(lx1, ly1, ldx, ldy, lineLengthSquared, px, py) {
+ var t; // t===0 at line pt 1 and t ===1 at line pt 2
+ if (!lineLengthSquared) {
+ // 0-length line segment. Any t will return same result
+ t = 0;
+ }
+ else {
+ t = ((px - lx1) * ldx + (py - ly1) * ldy) / lineLengthSquared;
+
+ if (t < 0)
+ t = 0;
+ else if (t > 1)
+ t = 1;
+ }
+
+ var lx = lx1 + t * ldx,
+ ly = ly1 + t * ldy,
+ dx = px - lx,
+ dy = py - ly;
+ return dx * dx + dy * dy;
+}
+function distanceSquaredToLineSegment(lx1, ly1, lx2, ly2, px, py) {
+ var ldx = lx2 - lx1,
+ ldy = ly2 - ly1,
+ lineLengthSquared = ldx * ldx + ldy * ldy;
+ return distanceSquaredToLineSegment2(lx1, ly1, ldx, ldy, lineLengthSquared, px, py);
+}
+
+function distanceToLineSegment(lx1, ly1, lx2, ly2, px, py) {
+ return Math.sqrt(distanceSquaredToLineSegment(lx1, ly1, lx2, ly2, px, py));
+}
-var player = new Player(250,200);
\ No newline at end of file
+
+var player = new Player(250, 150);
\ No newline at end of file
From 5e2a58528b9b3b23d931f3abea46bae06bec8883 Mon Sep 17 00:00:00 2001
From: William <Wcmeathrel@gmail.com>
Date: Sat, 18 Apr 2020 16:01:01 -0400
Subject: [PATCH 5/5] Added some collision
---
docs/assets/js/index.js | 3 ++-
docs/assets/js/player/player.js | 34 +++++++++------------------------
2 files changed, 11 insertions(+), 26 deletions(-)
diff --git a/docs/assets/js/index.js b/docs/assets/js/index.js
index 51d3657..b3a82eb 100644
--- a/docs/assets/js/index.js
+++ b/docs/assets/js/index.js
@@ -63,6 +63,7 @@ function draw() {
// playing
case globalStates.playing:
drawWorldBlocks();
+ player.draw();
break;
// paused
case globalStates.paused:
@@ -92,7 +93,7 @@ function absoluteDraw() {
// playing
case globalStates.playing:
drawPlayingUI();
- player.draw();
+
break;
// paused
case globalStates.paused:
diff --git a/docs/assets/js/player/player.js b/docs/assets/js/player/player.js
index f57e74b..5e356c4 100644
--- a/docs/assets/js/player/player.js
+++ b/docs/assets/js/player/player.js
@@ -45,25 +45,19 @@ Player.prototype.moveLeg = function(){
var curLeg = this.getActiveLeg();
var target = mousePos;
-
// Last leg position
var lastX = curLeg.x2;
var lastY = curLeg.y2;
-
+
// move selected leg towards mouse
-
// console.log(curLeg.angle.toPrecision(5),pointTo(curLeg,target).toPrecision(5));
curLeg.angle = turn( curLeg.angle,pointTo(curLeg,target),0.1);
// var angle = pointTo(curLeg,target);
curLeg.x2 = curLeg.x + curLeg.len * Math.cos(curLeg.angle);
curLeg.y2 = curLeg.y + curLeg.len * Math.sin(curLeg.angle);
- // curLeg.angle = pointTo(curLeg,{x:curLeg.x2,y:curLeg.y2});
-
- console.log(this.legSelected);
- debugger
// Collision
if(collidingWithWorld({x:curLeg.x2,y:curLeg.y2,w:4,h:4})){
this.collided = true;
@@ -106,10 +100,10 @@ Player.prototype.moveLeg = function(){
curLeg.x = this.hipLeft.x;
curLeg.y = this.hipLeft.y;
- console.log(oppLeg.angle)
+ //console.log(oppLeg.angle)
// if leg is left update it accordingly
} else {
- console.log(curLeg.angle)
+ //console.log(curLeg.angle)
// set angle to the locked foot to the locked hip
oppLeg = this.getLockedLeg();
oppLeg.angle = pointTo({x:oppLeg.x2,y:oppLeg.y2},this.hipLeft);
@@ -145,6 +139,7 @@ Player.prototype.updateHips = function() {
Player.prototype.draw = function() {
rect(this.x, this.y, this.w, this.h,"green");
+
this.leftLeg.draw();
this.rightLeg.draw();
}
@@ -152,34 +147,23 @@ Player.prototype.draw = function() {
Player.prototype.update = function() {
this.moveLeg();
var curLeg = this.getActiveLeg();
- if(mousePress[0] || this.collided){//collidingWithWorld({x:curLeg.x2,y:curLeg.y2,w:4,h:4})||
+ if(mousePress[0] || this.collided){
if(this.legSelected === "R"){
this.legSelected = "L";
-<<<<<<< HEAD
- this.lastFootX = this.leftLeg.x2;
- this.lastFootX = this.leftLeg.y2;
- } else {
- this.legSelected = "R";
- this.lastFootX = this.rightLeg.x2;
- this.lastFootX = this.rightLeg.x2;
-
-=======
this.leftLeg.angle += pi;
} else {
this.legSelected = "R";
this.rightLeg.angle += pi;
->>>>>>> 7a71387b4279ade1d4c8c0ec73a82d0e4ab40b47
}
this.collided = false;
}
+ centerCameraOn(this.x,this.y);
}
-<<<<<<< HEAD
-var player = new Player(400,200);
-=======
-var player = new Player(250,200);
->>>>>>> 7a71387b4279ade1d4c8c0ec73a82d0e4ab40b47
+
+var player = new Player(500,100);
+