How to swap bitmap in a symbol use jsfl - actionscript-3

I want to swap a bitmap in symbol with another bitmap,and I found the the function
swapElement
This is what I have tried
var elements = item.timeline.layers[0].frames[0].elements;//item is the symbol
for (var j = 0; j < elements.length; j++) {
var el = elements[j];
if (el.instanceType == "bitmap") {
el.selected = true;//this line not work, so I want a way to make the element selected
dom.swapElement(targetName);//targetName is another bitmap name that I wanted
}
}

Setting selected to true of an element, will only select the element if the element is on screen (and the layer is unlocked and visible). So before selected is set to true library.editItem(item.name) should be called. If the element is in frame x, frame x has to be made the current frame with document.getTimeline().setSelectedFrames(parseInt(x), parseInt(x) + 1, true). (I use parseInt(x) as a cast because of a bug in setSelectedFrames). To be sure the element is the only element that is selected document.selectNone() should be called before setting selected to true.
Every instance has a libraryItem so maybe replacing the libraryItem is easier.
The code here can be adapted for a more selective replace.

From library? Then following snippet could help you
var libItems = fl.getDocumentDOM().library.items;
for (i = 0; i < libItems.length; i++){
if(libItems[i].itemType == “bitmap”){
//found bitmap :)
}
OK, what about:
fl.selectElement(el); //instead of el.selected = true;
dom.swapElement(targetName);//assuming you have targetName
This works if there is anything (one item) selected that is bitmap it will replace it with library item named "image4":
var dom = fl.getDocumentDOM();
var selection = dom.selection;
if(selection.length == 1 && selection[0].instanceType == "bitmap")
{
dom.swapElement("image4");
}

Related

using Action Script 3 remove an object that appeared in the run time

I use this code to create list of words from an array and make them act like buttons
in the main page i have 2 buttons that activate the for loop to create the list of words
the problem is when i hit the second button in the main the list of words of the first button still shown on the screen, i need to remove the list first then activate the second loop
i used the removeChildAt() function but it didn't worked
what should i do ?
var words:Array = [];
var word:MovieClip=new MovieClip();
if(e.target.name=="glossumbolA"){
words=['School1','School2','School3','School4','School5','School6']
for (var j:int = 0; j < words.length; j++)
{
word = createTextButton(words[j]);
addChild(word);
word.addEventListener(MouseEvent.CLICK, wordButtonClick);
}
}
else if(e.target.name=="glossumbolB"){
words=['Class1','Class2']
for (var i:int = 0; i < words.length; i++)
{
word = createTextButton(words[i]);
addChild(word);
word.addEventListener(MouseEvent.CLICK, wordButtonClick);
}
}
function createTextButton(){
//code to make the word in the array a button
}
function wordButtonClick(){
//code to make an action when the word in the array clicked
}
you have multiple ways to do that:
1. create one new MovieClip inside 'word' (with name A), for glossumbolA and one new for glossumbolB (with name B), create buttons inside MCs. You can set 'visible' true || false for A and B. If glossumbolA button is clicked - check if B is visible, set visible to 0.
or
while (word.numChildren > 0) {
word.removeChildAt(0);
} then create new buttons

how do I call a function if the image clicked is equal to its matching word? Actionscript3

When my random word appears the user has to memorise it and click the correct corresponding image to it. I'm trying to write the code that runs if the user selects the right image. I have paired my words and images in my array. I'm just unsure as how to go about calling this function.
This is what I've attempted so far, but this isn't working. I'm new to actionscript3 so excuse the lack of knowledge as I am trying to teach myself.
All help greatly appreciated!!
This is one way you can do this:
See code comments
basket.visible = false;
//------ Home Button ------\\
backhome1btn.addEventListener(MouseEvent.CLICK, goback1Click);
function goback1Click(event:MouseEvent):void{
gotoAndStop("homepage");
}
//-------------------
var score:int = 0;
var items:Array = new Array(); //store all food items in array
var wordsToShow:Array = new Array(); //store all words to show in array - this is the array that will keep track of which has been asked (or rather not asked yet)
//to reduce redundant code, call this with each food item (below)
function initFoodItem(item:MovieClip, word:String):void {
item.word = word; //forget the array, just store the word on the image as a dynamic property
item.addEventListener(MouseEvent.CLICK, foodClicked);
items.push(item); //add to array
wordsToShow.push(item); //add to array
item.visible = false;
}
initFoodItem(oc, "Orange Juice");
initFoodItem(sand, "Sandwich");
//...repeat for all other food items
//now randmize the words to show array:
wordsToShow.sort(function(a,b):int {
return(Math.random() > .5) ? 1 : -1;
});
var curAnswer:MovieClip; //a var to store the current correct answer
//this does the next question per se
function displayWord():void {
if(wordsToShow.length < 1){
//they've all been asked
gotoAndPlay("gameoverpage");
return;
}
curAnswer = wordsToShow.pop(); //assigns the last item in the array to the cur asnwer, and pop also removes that item from the array (so it won't get asked again)
randomword.text = curAnswer.word; //assign the text to the word value of this item
randomword.visible = true;
remember.visible = true;
}
remember.addEventListener(MouseEvent.CLICK, readyClick);
//when you click your ready button
function readyClick(e:MouseEvent):void {
//we have an array of all items, let's loop through it and change them all to be visible
for (var i:int = 0; i < items.length; i++) {
//items[i].alpha = 1; //alpha values are 0 - 1 in AS3
items[i].visible = true; //use visible instead of alpha if just toggling visibility, it's more efficient
}
randomword.visible = false;
remember.visible = false;
bask.visible = true;
notepape.visible = false;
//! another reason to use visible instead of alpha = 0, is alpha = 0 items will still be clickable! visible = false items cannot be clicked.
}
function foodClicked(e:MouseEvent):void {
if (e.currentTarget == curAnswer) {
//if the current target (the item clicked) is the same item as what we stored in curAnswer, you answered correctly, so do this:
score += 10; //or however much you get for answering correctly
gotoAndStop("listpage"); //not sure what this does?
displayWord();
}else {
//wrong
gotoAndStop("gameoverpage");
}
}

Using createjs, preoloading and caching, why is my canvas still so slow?

I am trying to create a small RPG for class. I create one Bitmap image, cache it, and then every time I need that same Bitmap, I clone it, and finally add them to the stage. However, despite my efforts, my canvas is still extremely slow since I am drawing all of these bushes.
I would put them in a container, however, I need to know the X and Y position that way I know if the player is trying to step over their boundaries.
Here is my function:
parseRoom: function(mapObject, room, obj, image){
var letter = 'X';
//var object = obj;
var object = null;
var img = new createjs.Bitmap(image);
for(var m=0; m < mapObject.length; m++){
for(var j=0; j< mapObject[m].length; j++){
letter = mapObject[j][m];
switch (letter){
case 'X':
//do nothing
break;
case 'O':
//object = this.createObject();
//object.image = img.clone();
img.cache();
object = img.clone();
room.AddObstacle(object, m, j);
break;
}
}
}
}
and this is my function when I actually add them to the stage:
addObstacle: function(imgObj, x, y){
imgObj.x = x ||imgObj.x || 0;
imgObj.y = y ||imgObj.y || 0;
imgObj.setVisible = function(visible){
this.visible = visible;
};
imgObj.update = function(){
if(this.visible)this.visible= true;
else this.visible = false;
};
objects.push(imgObj);
stage.addChild(imgObj);
},
as you can see, I extend the Bitmap class and also add and update and a setVisible method to it. That way I can turn them all off or on depending on the screen. Any ideas that could help me and make my game smoother? Thank you!
I was constantly updating every object, including the bushes, and there was no need to update the bushes every tick. I simply removed logic from checking the bushes and now it runs really fast.

Drag-and-Drop - Limiting duplicate MCs for single use in targets?

I've been working on a Flash drag-and-drop scene using AS3. The scene is broken into 4 "zones", and each zone has 5 targets. I've used arrays to allow the mc's to be dropped in their respective zones, without any particular order. All of this works as it should.
The issue I have it that there are 2 "puzzle" pieces (MCs) that are identical to one-another in terms of how they visually display on the screen. I've set up the arrays to allow for both to be dropped in zone 1 or zone 2. However, I'd like to set it up so that if "identical piece 1" gets dropped into zone 1, then "identical piece 2" cannot also be dropped into that same zone.
Any suggestions for how to go about doing this?
How about setting a flag in every zone that tells if a piece has already been attached to it?
If your zones are MovieClips you can simply add variables to them, and set mcTarget.isTaken = true when a piece gets attached to it. If they are simply coordinates, you can use a global array like this
private mZoneTaken:Array = new Array();
for (var i:int=0; i<4; i++)
{
mZoneTaken[i] = new Array();
for (var j:int = 0; j<5; j++)
{
mZoneTaken[i][j] = false;
}
}
Then whenever a piece is dropped on a zone, you can set its flag to true, allowing you to prevent any further piece from getting attached to it.
Personally, I would have an array/Vector (Vectors are much, much faster. Though they can be a royal pain to use) of objects within each individual zone. You keep this updated at all times. If you remove one, you use splice(indexOf(obj),1) to remove it from the array.
For your problem, I would do this:
var p1:Sprite = new Sprite();
var p2:Sprite = new Sprite();
var zoneArray:Array = new Array();//there would be one for each zone, simplified it here
//this code would run whenever an object enters the zone
function zoneEnter(e:Event = null):void{
var currentZone:Sprite; //set this equal to the zone the sprite just entered
var currentObject:Sprite = e.currentTarget as Sprite; //this way we know which object just entered currentZone
if ( currentObject == p1 && zoneArray.indexOf(p2) >= 0 ) {
//prevent it from entering the zone
}
if ( currentObject == p2 && zoneArray.indexOf(p1) >= 0 ) {
//prevent it from entering the zone
}
}
There are obviously some limitations here if you are looking at a lot of objects. But if you know, for sure, there will only be two, I think this would be the way to go. If there will be more, you would need to create some kind of control structure that would allow you to check an object against other objects. I could elaborate and give a sample of what I am talking of here if it's needed. It's a tad bit complex, but not hard to implement.
EDIT 10-17-12: Added in example code of how the more advanced logic would look.
var puzzleMap:Array = new Array();
var piece1:Piece = new Piece(); //this is the puzzle piece we'll be checking
var piece2:Piece = new Piece();
var piece3:Piece = new Piece();
var piece1Objs:Array = [piece2,piece3];
var piece2Objs:Array = [piece1,piece3];
puzzleMap.push({piece:piece1,others:piece1Objs});
puzzleMap.push({piece:piece2,others:puzzle2Objs);
private function stopDragHandler(e:MouseEvent = null):void{
var space:Space = space; //this is the space the object was dropped into (I don't know how you identify them, so this is pseudo code)
var valid:Boolean = true; //we'll check for a bad drop since it's easiest
if (event.target.dropTarget != null && MovieClip(event.target.dropTarget.parent).allowed.indexOf(event.target) > -1){
for ( var i:Number = 0; i < puzzleMap.length; i++ ) {
var current:Object = puzzleMap[i];
if ( current == e.currentTarget ) {
for ( var j:Number = 0; j < current.others.length; j++ ) {
var checkAgainst:Piece = current.others[i] as Piece;
if ( space.currentObjects.indexOf(checkAgainst) < 0 ) {
valid = false;
break;
}
}
}
}
if ( !valid ) {
//prevent the drop here
}
}
}

AS3: Stalling a for loop at each pass

So I've worked out a great way to create a pixelized wipe effect, with movie clips of pixels nested in rows. I've created a loop that goes through each row, and then another loop inside that loop for the pixels in each row. I then use a random number between 1-0 for for the delay before it alpha-ups the pixel. I used Greensock for the tween and it works great.
One problem, I can't stall the for loop for the rows, and every row comes up at once. Still, the pixels are staggered, and this is a nice effect, but I want it to move from left to right. So my code looks like this: (BTW, yes, AS3 does have setTimeout and it works fine)
function stripeWipeUp(stripe:MovieClip):void {
var total = stripe.numChildren;
for (var i:int = 0; i<total; i++) { // the rows
trace(i);
setTimeout(function() {
trace("setTimeout: "+i);
var row:MovieClip = stripe.getChildAt(i) as MovieClip;
var pixTotal = row.numChildren;
for (var j:int = 0; j<pixTotal; j++) { the pixels
var pix:MovieClip = row.getChildAt(j) as MovieClip;
var num = Math.floor(Math.random()*100)/100; // the delay
pixUp(pix, num); // my greensock function
}
}, 500);
}
}
What happens, with the setTimeout in there, is that the "i" for loop hits every row (there are 27) before one setTimeout gets finished. So, it doesn't work as it should - the next loop should not execute until the setTimeout is finished. Any idea how to accomplish this so each row gets stalled by about 500 ms? Thanks.
Your problem is with this.
trace("setTimeout: "+i);
"i" is not what you think it is.
The scope of "i" is in stripeWipeUp not the anonymous function.
With that being said "i" is always the value of the last itteration of the loop that was run across all of your anonymous functions.
So as you can see when the anon functions trigger "i" will most-likely be equal to "total".
This is why we avoid using anonymous functions as scope is very hard determine.
Create an array and store a custom class in it for each "pixel" that will control what you want to do.
In this class use a Timer Object not setTimeOut. setTimeOut is a garbage function left over from AS2.
drop the setTimeout and just add a delay multiplied with i
var num = ( i * 500 ) + Math.floor(Math.random()*100)/100; // the delay
I would encapsulate i and j, a Timer, and an event handler for the Timer, into a class. In the event handler I would:
Do your effect for the pixel corresponding to j and i
Update j (and i)
If there are more pixels, schedule the next event
I was able to get it to work by taking the inner part out and making it a separate function. I would prefer a much cleaner solution like Creynders', but for some reason that didn't work. Here is the code:
// the row of pixels
function row(stripe:MovieClip, i:int, up:Boolean, del:Number):void {
setTimeout(function() {
var row:MovieClip = stripe.getChildAt(i) as MovieClip;
var pixTotal = row.numChildren;
for (var j:int = 0; j<pixTotal; j++) {
var pix:MovieClip = row.getChildAt(j) as MovieClip;
var num = Math.floor(Math.random()*100)/100;
(up) ? pixUp(pix, num) : pixDown(pix, num);
}
}, del);
}
// the rows in the "stripe"
function stripeWipe(stripe:MovieClip, up:Boolean):void {
var total = stripe.numChildren;
var del:Number = 0;
for (var i:int = 0; i<total; i++) {
row(stripe, i, up, del);
del = del+100;
}
}