AS3 Add Child at the position of another Child - actionscript-3

Hey I have got some cavemen that when they build huts I want the huts to be added at the coords of the caveman I last clicked on which requires the ability to know exactly what caveman the user clicked on/tapped. Here is the code for spawning in the cavemen:
//////////////////////
///Starting Cavemen///
//////////////////////
var cavemanVar:Array = new Array(50);
for (var i:Number = 0; i < 50; i++)
{
cavemanVar[i] = 0;
}
var foo:MovieClip = new btn_caveman();
cavemanVar[0] = addChildAt(foo, 7);
var bar:MovieClip = new btn_caveman();
cavemanVar[1] = addChildAt(bar, 7);
cavemanVar[0].x = 335.50;
cavemanVar[0].y = 316.55;
cavemanVar[1].x = 335.50;
cavemanVar[1].y = 369.5;
stage.addEventListener(Event.ENTER_FRAME, example2);
function example2 (evt:Event) {
for (i = 0; i < 50; i++)
{
if (cavemanVar[i] != 0)
{
cavemanVar[i].addEventListener(TouchEvent.TOUCH_TAP, btn_cavemanMenu3);
}
}
}
function option1CavemenSpawn():void {
trace("using option 1")
actions += 1;
score += 5;
remaningActions += 1;
updateTextBox();
var foo6:MovieClip = new btn_caveman();
cavemanVar[2] = addChildAt(foo6, 7);
cavemanVar[2].x = 352.10;
cavemanVar[2].y = 260.80 + Math.random() * (392.40 - 260.80);
}
Any help would be great, I have tried using 'cavemanVar', 'cavemanVar[2]', 'cavemanVar[i]' and nothing is what I want it to be.
Hope I explained it properly it's a tricky thing to explain. I also have a move caveman feature I want to implement which would select the last clicked/tapped caveman and move it where the user clicks/taps so can any of this be done and if so how?
EDIT:
function btn_cavemanMenu3(event:TouchEvent):void {
btn_cavemanM.gotoAndStop(2);
trace('2');
allowBuildHut();
cancelTapCaveman();
allowTapCavemanClose();
if (remaningActions <= 2 || stone <= 29) {
cancelBuildHut();
}
}

Do you mean something like,
cavemanVar[i].addEventListener(TouchEvent.TOUCH_TAP, onTap);
function onTap(e:TouchEvent):void {
var caveman:btn_caveman = e.currentTarget as btn_caveman;
trace("caveman tapped --- (" + caveman.x + ", " + caveman.y + ")");
}

Okay, some things I noticed right away:
Attaching eventListeners with each frame, again and again. This will make your game slow if you make your game bigger. I'm not sure, but I think multiple event listeners with the same arguments don't stack, so it's not THAT bad.
Missing a return type for example2.
But aside from that, I think the reason that what you're trying to do doesn't work is because you're not referencing the selected caveman in your btn_cavemanMenu3 function. Via event.currentTarget you can reference the tapped caveman.
Currently, your question name and your question description conflict. What exactly do you wish to achieve? What is working and what isn't working right now?

Related

How to hitTest same Objects in one Array?

I want to create a stacking Game. Where when you tap the screen for instance a block falls down and a new one appears where the other one originally was. Now when the User taps the screen again the same block falls down and if aligned correctly stacks on top of the first one so one and so one. Keep stacking until you miss.
I thought creating an array and pushing each new object to that array would be able to hitTest between each new one etc and have them stack on each other. I realized I don't quite understand how to go about doing this. New instances are created so I got that down. Here is my code so far:
private function engineLogic(e:Event):void
{
stackingHandler();
}
private function stackingHandler():void
{
for (var i:int = 0; i < aCatArray.length; i++)
{
var currentCat:mcCats = aCatArray[i];
//HIT TEST CATS
}
trace("NUMBER OF CATS: " + aCatArray.length);
}
private function onTap(e:MouseEvent):void
{
//Move Down
TweenLite.to(cats, 1.0, {y:(stage.stageHeight / 2) + 290, onComplete: addCats});
}
private function addCats():void
{
//Create Instance
cats = new mcCats();
//Add Objects
addChild(cats);
//Push to Array
aCatArray.push(cats);
}
I would appreciate any help from you guys. Maybe if you can push me in the right direction. Thank you in advance!
It looks like the cats variable holds the object that is currently falling?
In that case you'd do something like this:
private function stackingHandler():void
{
for (var i:int = 0; i < aCatArray.length; i++)
{
if(cats.hitTestObject(aCatArray[i])) {
// collision detected!
// kill the Tween
// set the y position of the `cats` object
// so it appears on top of the object it collided with (`aCatArray[i]`)
// (it may have moved slightly past the object before doing this check)
}
}
}
So you're looping through the array and hit testing cats against every object in the array one at a time.
It might make more sense to use a basic gravity simulation, or just linearly increasing the y value instead of using a Tween, but you didn't ask about that.
You might also want to set a flag for whether or not an object is currently falling and use that to determine whether or not to run the stackingHandler. Otherwise, you'll just be continually hit testing all the objects when nothing is moving.
This is how I was able to fix it. Creating a double for loop. Checking if they are equal to each other continue and check for hitTest:
private function stackingHandler():void
{
for (var i:int = 0; i < aCatArray.length; i++)
{
var currentCat:mcCats = aCatArray[i];
for (var j:int = 0; j < aCatArray.length; j++)
{
var newCat:mcCats = aCatArray[j];
if (currentCat == newCat) continue;
//Hit Test between Objects
if (newCat.hitTestObject(currentCat.mcHit) && newCat.bFlag == false)
{
//Stop Moving
newCat.stopMoving();
trace("HIT");
if (highScore == 0)
{
addCats();
trace("ADD CATS 1");
}else
{
TweenLite.delayedCall(0.6, addCats);
trace("ADD CATS 2");
}
//Add Points
highScore ++;
trace(highScore + " Score");
//Set Flag boolean
newCat.bFlag = true
}
}
}
}

Animation code not fired when mouse is out Clip1 but mouse is inside clip 2

Problem:
When I move the mouse cursor out of Clip 1 but is above Clip 2, the MOUSE_OUT of Clip 1 does not work.
Expectation:
Granted that the mouse is inside Clip 2, the location of the mouse is outside of Clip 1 already, so the function mouse_out() of Clip 1 should fire the code inside it.
Full code:
I am attaching the full code so far.
import flash.display.MovieClip;
cat1.addEventListener(MouseEvent.MOUSE_OVER,mouse_over);
cat1.addEventListener(MouseEvent.MOUSE_OUT,mouse_out);
cat2.addEventListener(MouseEvent.MOUSE_OVER,mouse_over);
cat2.addEventListener(MouseEvent.MOUSE_OUT,mouse_out);
cat3.addEventListener(MouseEvent.MOUSE_OVER,mouse_over);
cat3.addEventListener(MouseEvent.MOUSE_OUT,mouse_out);
cat4.addEventListener(MouseEvent.MOUSE_OVER,mouse_over);
cat4.addEventListener(MouseEvent.MOUSE_OUT,mouse_out);
cat5.addEventListener(MouseEvent.MOUSE_OVER,mouse_over);
cat5.addEventListener(MouseEvent.MOUSE_OUT,mouse_out);
function mouse_over(e:MouseEvent)
{
squareEaseOut(e.currentTarget,["scaleX",1.5,"scaleY",1.5]);
}
function mouse_out(e:MouseEvent)
{
squareEaseOut(e.currentTarget,["scaleX",1,"scaleY",1]);
}
var iSquareEasingInterval:int;
//simple square easing, this can capture several properties to be animated
function squareEaseOut(mc:Object,vars:Array)
{
var checker:int = 0;
clearInterval(iSquareEasingInterval);
var ini:Array = new Array();
var accelNum:Number = 0;
var jerkNum:Number = 0;
var varsLength:uint = vars.length / 2;
for (var i:uint = 0; i<varsLength; i++)
{
ini[i] = mc[vars[2 * i]];
}
function animateEasing()
{
checker++;
if (compare(mc[vars[0]]+(0.25 * (vars[1] - ini[0])) / ((1 + accelNum) * (1 + accelNum)),vars[1]))
{
var end = new Date();
trace("Time lapse: "+(end - startD));
clearInterval(iSquareEasingInterval);
accelNum = 0;
jerkNum = 0;
for (var j:uint = 0; j<varsLength; j++)
{
mc[vars[2 * j]] = vars[(2 * j) + 1];
}
return;
}
for (var k:uint = 0; k<varsLength; k++)
{
mc[vars[2*k]] += (0.26 * (vars[(2*k)+1] - ini[k])) / ((1 + accelNum) * (1 + accelNum));
}
accelNum += 0.150+(jerkNum*jerkNum*jerkNum);
jerkNum += 0.09;
}
function compare(a:Number,b:Number)
{
if (vars[1]>ini[0])
{
return a>b;
}
else if (vars[1]<ini[0])
{
return a<b;
}
}
var startD = new Date();
iSquareEasingInterval = setInterval(animateEasing,20);
};
The problem is that you are calling the same method squareEaseOut when any mouse over or mouse out event occurs. Since you are moving your mouse immediately out of one Movie Clip and on to the other, the same method gets called twice, first for the mouse out (for the old movie clip) and then for the mouse over of the new Movie Clip. This will not result in correct behavior as the second call will override the first one as you are using setInterval and clearing the interval as well on every call.
While there may be multiple ways to solve this, easiest way would be to have separate methods for mouse out and mouse over, although that might lead to some code repetition. Or, you could wait for the first animation to finish and then call the other one.
You can also look at various tweening libraries available to achieve what you want, but thats not something that I would advertise here.
Hope this helps.

Arranging items in an inventory

I'm working on an inventory system I made following a short tutorial that leaves you stranded. I've managed to get the items removed and rearrange to the correct order somewhat. For some reason though, if I click on the last item in my inventory, then on the first item, the items do not rearrange correctly.
public class Inventory {
var itemsInInventory:Array;
var inventorySprite:Sprite;
var itemNum:int;
public function Inventory(parentMC:MovieClip) {
itemNum=0;
itemsInInventory = new Array();
inventorySprite = new Sprite();
inventorySprite.x = 50;
inventorySprite.y = 360;
parentMC.addChild(inventorySprite);
}
public function makeInventoryItems(arrayOfItems:Array){
for(var i:int = 0; i < arrayOfItems.length; i++){
arrayOfItems[i].addEventListener(MouseEvent.CLICK, getItem);
arrayOfItems[i].buttonMode = true;
}
}
public function getItem(e:MouseEvent){
var item:MovieClip = MovieClip(e.currentTarget);
itemsInInventory.push(item);
inventorySprite.addChild(item);
item.x = (itemsInInventory.length-1)*40;
item.y = 0;
item.removeEventListener(MouseEvent.CLICK, getItem);
item.addEventListener(MouseEvent.CLICK, useItem);
}
public function useItem(e:MouseEvent){
var item:MovieClip = MovieClip(e.currentTarget);
itemNum = item.x;
inventorySprite.removeChild(item);
itemsInInventory.splice(item, 1);
sortInventory();
}
public function sortInventory(){
for(var i:int = 0; i < itemsInInventory.length; i++){
if(itemsInInventory[i].x > itemNum){
itemsInInventory[i].x -= 40;
}
}
itemNum=0;
}
}
I belive thats all the coding info I need to provide for help solving this mystery.
Also, a link to the game for testing. If you would like a link for a download of the game, please ask.
LINK
Instead of substracting 40px, just set their position again:
for(var i:int = 0; i < itemsInInventory.length; i++){
itemsInInventory[i].x = i*40;
}
Also, I did not even know that it is possible to give an object reference to the splice function, I would rather use:
itemsInInventory.splice(itemsInInventory.indexOf(item), 1);
And remove the event listener from the item when you delete it from the inventory in the useItem function.
item.removeEventListener(MouseEvent.CLICK, useItem);
EDIT:
With Flash Player 10, Adobe introduced the Vector class which is kind of the same as the Array class, but it can only store one data type. In your case it would be MovieClip or Sprite. The Vector class is singificantly faster and more developer friendly because you can see the help from the IDE when you are typing myVector[i].. I recommend using that instead, although there is nothing wrong with Array. It is just outdated a bit, but is helpful when you want to store more data types.
myVector:Vector.<MovieClip> = new Vector.<MovieClip>();

AS3 Getting which movieclip clicked on

So, I made a for loop to get several buttons in my project. It's a questionary, and I need to have a button to quickly select and navigate to any question there. I could do them all manually, but not only would my code be long and confusing, but also there are problems since there isn't always the same number of questions.
So right now I have:
function SetQuestionSquares():void{
for(var i:Number = 1; i <= TestProperties.QuestionLimit;i++){
var QuestionSquare:questionsquare = new questionsquare;
QuestionSquare.buttonMode = true;
QuestionSquare.mouseChildren = false;
QuestionSquare.x = NavLeft.x + (20 * i);
QuestionSquare.y = NavLeft.y;
QuestionSquare.questionsquaretext.text = i.toString();
addChild(QuestionSquare);
QuestionSquare.addEventListener(MouseEvent.CLICK, GoToQuestionNumber);
}
addChild(NavLeft);
addChild(NavRight);
}
function GoToQuestionNumber(e:MouseEvent):void{
WhichQuestion = ???; //I don't know what goes here.
UpdateQuestions();
trace("testing"); //Gets called correctly, so its working.
}
My problem is identifying which square was clicked. I need to have some way to grab the "e" (clicked) event, so I know which button the user clicked on.
You need .target property of the Event object:
WhichQuestion = e.target as questionsquare;
function GoToQuestionNumber(e:MouseEvent):void{
var WhichQuestion:DisplayObject = e.currentTarget as DisplayObject;
UpdateQuestions();
trace("testing");
}

Stop and start a for loop in AS3?

I'm pulling an xml and using a for loop to create a thumb list. This list is going to be quite long but I only 25 thumbs to be loaded at a time, so that the next 25 is only loaded when a user hits a button. I know how to set up a for loop in a function, but I can't quite figure out how to break up a loop where it would stop and start. I was thinking I would call the function each time a button is pressed and the loop would pick up where it left off with the next 25.
I thought maybe I could substite other variables into the for(); but everything I've tried breaks it. I tried pulling the var i:int = 0; out of the for so the function could set the i, but I guess I'm not clear on exactly how the for loop works.
What I'm doing:
function loadarticleHeadlines():void
{
for (var i:int = 0; i < egarticleXml.articlelist.articleitem.length(); i++)
{
vsThumb = new articleBox();
vsThumb.alpha = 0;
vsThumbLoader = new Loader();
vsThumbLoader.load(new URLRequest(egarticleXml.articlelist.articleitem[i].articlethumbnail));
articleListContainter.addChild(vsThumb);
vsThumb.articleImage.addChild(vsThumbLoader);
vsThumb.articleTitle.text = egarticleXml.articlelist.articleitem[i].articletitle;
titleAutosize(vsThumb.articleTitle);
vsThumb.x = next_x;
next_x += 260;
articlevsThumb[i] = vsThumb;
//vsThumbLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, showBox);
vsThumb.clickBtn.buttonMode = true;
}
}
Try this out.
var xml:Array = [];
for(var i:int=0;i<100;i++)
{
xml.push(i);
//array from 0-99
}
var xmlPosition:int = 0;
grabXML(xmlPosition);
//25
grabXML(xmlPosition);
//50
grabXML(xmlPosition);
//75
grabXML(xmlPosition);
//100
function grabXML(position:int):void
{
for(position;position<xml.length;position++)
{
trace(xml[position]);
//yields 0-24, 25-49, 50-74, and 75-99
if(position === xmlPosition + 25)
{
break;
}
}
xmlPosition += 25;
}
I'm breaking as soon as the parameter is 25 more than its original value (xmlPosition). Calling the function additional times will yield nothing, as xmlPosition is greater than xml's length property.