createjs noob here,
I am trying to make a class, that when you pass in a shape, it lets you scale an object up or down based on mouse position.
beeSyrup.Scaler = function(obj){
console.log("hi from scaler");
if (not(obj) || !obj.on) return;
obj.addEventListener("pressmove", function(e){
obj.cursor = "alias";
mouseX = e.stageX;
mouseY = e.stageY;
var lastMouseX = mouseX;
var lastMouseY = mouseY;
if (lastMouseX < mouseX && lastMouseY < mouseY){
obj.scaleX += .1;
obj.scaleY += .1;
}else{
obj.scaleX -= .1;
obj.scaleY -= .1;
}
stage.update();
});
}
Currently this will scale it down once, but once it scales down you can only scale up. How would the correct if statement logic work?
In your code, mouseX and lastMouseX are always equal, because you are setting lastMouseX = mouseX before comparing them (true of the Y values as well). As such, the else condition is always satisfied, so it will always scale down.
There are many other things you will likely want to change to make this work in an user-friendly manner, but this is your immediate problem.
Here's a very rough JSFiddle to get you started down the right path: http://jsfiddle.net/9zu9jpvx/
Related
How can wheelnav.js be setup to rotate both clockwise and counterclockwise, whichever is closest? Whenever it goes from 0 to the highest number, it flips around the long way, as seen when you go from 0 to 5 on this demo page after turning on rotation:
http://pmg.softwaretailoring.net/
It needs to always rotate in the closest direction and never flip around the long way.
I am also open to a solution using wheelizate tabs, which uses Wheelnav to accomplish this:
http://wtabs.softwaretailoring.net/
Thank you for your attention on this.
Found the solution by doing a Console.log(rotationAngle), and watching what the rotation value for each particular click. Then I found that I could take the numbers of the situations that went the wrong way, and subtract 360 from it to get it to rotate the opposite direction.
The patch involve adding this to Wheelnav.js line 411:
if (rotationAngle == 288){
rotationAngle = -72;
}
if (rotationAngle == 216){
rotationAngle = -144;
}
You need to replace the next line (line 422 of Wheelnav.js):
navItem.currentRotateAngle -= rotationAngle;
with the following conditional expression:
if (rotationAngle >= 180) {
rotationAngle = 360 - rotationAngle;
navItem.currentRotateAngle += rotationAngle;
} else if (Math.abs(rotationAngle) > 180) {
rotationAngle = 360 + rotationAngle;
navItem.currentRotateAngle -= rotationAngle;
} else {
navItem.currentRotateAngle -= rotationAngle;
}
I'm trying to do wall collision for objects and I've followed a tutorial that offers one method of doing collision.
This is the tutorial: https://www.youtube.com/watch?v=yZU1QJJdxgs
Currently, if the object detects a wall, instead of moving it's full distance, it moves pixel by pixel until it's against the wall. This worked well until I started trying to rotate the object with image_rotate, because it caused objects to get stuck in walls by either sliding against them or if they rotated into them.
I fixed this by using draw_sprite_ext instead and changing the rotation of the sprite itself and not the mask, which worked for about 20 minutes until it started causing more problems.
///obj_player Step
//Initialise Variables
hor_speed = 0;
ver_speed = 0;
accelerationspeed = 0.2;
decelerationspeed = 0.2;
maxspeed = 3;
pointdirection = 0;
//Get player's input
key_right = keyboard_check(ord("D"))
key_left = -keyboard_check(ord("A"))
key_up = -keyboard_check(ord("W"))
key_down = keyboard_check(ord("S"))
pointdirection = point_direction(x,y,mouse_x,mouse_y) + 270
hor_movement = key_left + key_right;
ver_movement = key_up + key_down;
//horizontal acceleration
if !(abs(hor_speed) >= maxspeed) {
hor_speed += hor_movement * accelerationspeed;
}
//horizontal deceleration
if (hor_movement = 0) {
if !(hor_speed = 0) {
hor_speed -= (sign(hor_speed) * decelerationspeed)
}
}
//vertical acceleration
if !(abs(ver_speed) >= maxspeed) {
ver_speed += ver_movement * accelerationspeed;
}
//vertical deceleration
if (ver_movement = 0) {
if !(ver_speed = 0) {
ver_speed -= (sign(ver_speed) * decelerationspeed)
}
}
//horizontal collision
if (place_meeting(x+hor_speed,y,obj_wall)) {
while(!place_meeting(x+sign(hor_speed),y,obj_wall)) {
x += sign(hor_speed);
}
hor_speed = 0;
}
//vertical collision
if (place_meeting(x,y+ver_speed,obj_wall)) {
while(!place_meeting(x,y+sign(ver_speed),obj_wall)) {
y += sign(ver_speed);
}
ver_speed = 0;
}
//move the player
x += hor_speed;
y += ver_speed;
///obj_player Draw
//rotate to look at cursor
draw_sprite_ext(spr_player, 0, x,y,image_xscale,image_yscale, pointdirection, image_blend, image_alpha);
I think the best way to rotate objects is through image_rotate, and I'd like to do it without getting stuff stuck in walls. Can my current method of collision be adapted to do this, or should I attempt to do it in a different way?
Your code looks fine, but if you're going to be rotating objects then you would also need to consider having a "knock back mechanic." Reason being is the player could be sitting next to this wall and if you rotate the object over them so they cant move, its not a fun time being stuck.
So you 'could' have the object that's rotating do a check before rotating and if objects are in the way then either stop it or push them back so they cant be within range.
I am having some trouble with programming hit detection in Processing.JS. I have tried to make a function that checks if something is touching an object and returns true and otherwise returns false. This is that here.
`Box.prototype.checkTouching = function(v){
if(v.position.x > this.position.x - this.width/2 && v.position <
this.position.x + this.width/2 && v.position.y > this.positon.y -
this.height/2 && v.position.y < this.position.y + this.height/2){
return true;
}else{
return false;
}
};`
I am implementing it by creating a new variable "b" in my draw function that holds the value the function returned then using an if statement to check if the value "b" is holding is true. Like so
var b = box3.checkTouching(mos);
if(b === true){
println("It works");
}
What should happen when the two objects touch is that a message saying "it works" gets printed in to the console. Unfortunately even when the object the function is running on is touching the object that is running it nothing happens. I have already checked to see if the logic works and it is valid so I know it has to be my implementation I just can not seem to find out what is wrong with my implementation. Can anyone tell what I am doing wrong? Full program here
You need to check whether the rectangles overlap. You'd do this by checking each side, like this:
if(rectOneRight > rectTwoLeft && rectOneLeft < rectTwoRight && rectOneBottom > rectTwoTop && rectOneTop < rectTwoBottom){
//collision
}
Shameless self-promotion: I've written a tutorial on collision detection in Processing (including rectangle-rectangle collision) available here.
To build on what Kevin posted, say I want to hover my mouse over a rectangle. processing has the built in variables mouseX, mouseY that return the coordinates of the mouse.
so I would check if the mouse X position was greater then the rect X pos, and less than the rect X pos + the rect width. the, do the same with the mouseY, rect Y and rect height
if (mouseX > rectXpos &&
mouseX < rectXpos + rectWidth &&
mouseY > rectYpos &&
mouseY < rectYpos + rectHeight) {
// the button is being hovered over
}
I am trying to get the direction that the mouse is moving when using pressmove. On mousedown I get store the cursor coordinates values in the variables startX and startY, then on pressmove I check to see which side of startX and startY the mouse is. I would like to only get the general direction and not keep on jumping between the values as I am currently getting. So if the general direction is up then log 'up' and not 'up''left''up'etc.
pressMove = function(event){
var pt = this.globalToLocal(event.stageX, event.stageY);
if(pt.x > this.startPosX){
this.dragDirection = 'right';
}
if(pt.x < this.startPosX){
this.dragDirection = 'left';
}
if(pt.y < this.startPosY){
this.dragDirection = 'up';
}
if(pt.y > this.startPosY){
this.dragDirection = 'down';
}
console.log(this.dragDirection)
}
I am totally new at this whole programming thing, and I really need help. So basically, I'm trying to make a healthbar that will increase or decrease depending on what button is clicked. I made a healthbar movieclip with 101 frames (I included zero) and put this in the actionscript layer of the movieclip:
var health:Number = 0;
if(health == 0)
{
gotoAndStop("1")
}
if(health == 1)
{
gotoAndStop("2")
}
if(health == 2)
{
gotoAndStop("3")
}
and on and on like so. Basically, on the stage itself, I have a button called fortyfiveup_btn that is commanded to do this:
var health:Number = 0;
fortyfiveup_btn.addEventListener(MouseEvent.CLICK, fortyfiveupClick);
function fortyfiveupClick(event:MouseEvent):void{
health = health+45
}
I quickly realized that both health variables, the one for the button and the one for the healthbar will not interact. How can I make it so if the button is clicked, the health goes to the relevant frame or percentage?
Thanks for any answers, and I appreciate all the help I can get :)
If the answer == yes to my comment you should do this:
You need to give the movieclip an instancename (perhaps lifebar) and from stage you can access the health inside the "lifebar" with lifebar.health.
So you need this inside your stage:
//You can delete the var health:Number = 0;
fortyfiveup_btn.addEventListener(MouseEvent.CLICK, fortyfiveupClick);
function fortyfiveupClick(event:MouseEvent):void{
//You can write this, too: lifebar.health += 45;
lifebar.health = lifebar.health+45;
}
You can even optimize your lifebar script, don't use 101 times the if(health == x) you can use this, too:
gotoAndStop(health + 1);
(I think this is inside an ENTER_FRAME event?)
EDIT:
Some error countermeasures:
//Don't let health decrease below 0
if(health < 0) health = 0;
//And don't above 100
else if(health > 100) health = 100;
gotoAndStop(health + 1);
Use int instead of Number when you don't use decimal numbers and uint when you don't use negative integers (this bugs when the number can drop under 0, so for your health we take int):
health:int = 0;