A Little Detour To Revisit a Old Side Project

Hello everyone!

My buddy Andrew contacted me the other day and asked if I wanted to help him redo a lot of the stuff that we made for SpaceWings now that we have a bit more experience. So, we dredged up as many of the old files that we could and got to work figuring out what we needed to redo. He wanted to tackle most of the base code himself, while I took on getting the menus put together.

Unfortunately, the only assets we had from the original menus were screenshots. A bit of Photoshop magic and I had almost all the elements I needed. A major thing I was still missing was the font. None of the other guys that worked on it before that I talked to had the name of the font we used in the original. So, I had to find some new fonts. I then had to try and replicate the effects that Justin Bucher made for the originals. He's much more proficient at Photshop than I am though, but I did my best.

Here are some of the HUD assets:

Once I got the main aspects of the menus done I decided to start working on getting the pickup system working. This has four main parts to it: Picking up and classifying an item, adding to the inventory if applicable, updating the HUD if something was added to the inventory, and checking to see if the player has a particular item. 

Picking Up and Classifying

---

Getting the item to be picked up proved to be surprisingly difficult for me. I haven't really worked with skeletal meshes/skinning/animation before in UDK. I got almost all of it set up thanks to some help from Andrew, mostly setting up the anim tree. The part that kept throwing me off was the collision. To get collision on a static mesh is really easy, but I was having a trouble with a skeletal mesh. Turns out I was looking at too much code and over looked adding BlockNonZeroExtent = true default properties of the skeletal mesh component...

As for classifying it, there is a variable in the actual pickup that holds what type of pickup it is. When the pickup is touched it calls a function in the player controller class that takes that variable and decides what to do with it. Here is my base pickup class:

class SW_Pickup extends Actor
    abstract
    placeable
    ClassGroup(SW_Pickups);

var string PickupType;
var SpaceWingsPlayerController PC;
var SpaceWingsPawn P;

event Touch(Actor Other, PrimitiveComponent OtherComp, vector HitLocation, vector HitNormal)
{
    PC = SpaceWingsPlayerController(GetALocalPlayerController());
    P = SpaceWingsPawn(PC.Pawn);
    
    PC.MyLog("A" @ PickupType @ "Pickup was touched", 'PickupTouch');

    //If the instigator is the player, then process the pickup
    if(Other == P)
    {
        PC.ProcessPickup(PickupType);
        Destroy();
    }
}

defaultproperties
{
    PickupType = "None"

    Begin Object Class=SkeletalMeshComponent Name=PickupMesh
    Scale3D=(X=1.0, Y=1.0, Z=1.0)
    CollideActors=true
    BlockNonZeroExtent=true
    End Object
    Components.Add(PickupMesh)

    CollisionComponent=PickupMesh

    bCollideActors = true
    bBlockActors = false

    CollisionType = COLLIDE_TouchAll
}

And then all you have to do is extend off of that and add the relevant skeletal mesh properties in the defaultproperties of the child class and assign the item type to that variable I mentioned earlier. For example, here is the the red key card pickup class.

class SW_RedKeyCardPickup extends SW_Pickup;

defaultproperties
{
    PickupType = "RedKeyCard"
    
    Begin Object Name=PickupMesh
        SkeletalMesh=SkeletalMesh'SW_Meshes.KeyCard.KeyCard'
        Materials(0)=Material'SW_Meshes.KeyCard.RedKeyCard_Mat'
        AnimSets(0)=AnimSet'SW_Meshes.KeyCard.KeyCard_Anim'
        AnimTreeTemplate=AnimTree'SW_Meshes.KeyCard.KeyCard_AnimTree'
        PhysicsAsset=PhysicsAsset'SW_Meshes.KeyCard.KeyCard_Physics'
    End Object
}

Adding To My Inventory

---

Adding it to the inventory was really simple. Since the inventory can hold a maximum of 3 items I didn't need to implement a grand inventory manager. For simplicity I assigned each pickup that could be added to the inventory a number instead of trying to save a class into the array, or something overly complex like that. I could have done a string, but I end up using the id number when updating the HUD. Here are the functions that manage my small inventory:

exec function AddItem(int ItemID)
{
    local int i;

    if(ItemList.length < 3)
    {
        i = ItemList.length;
        ItemList.length = ItemList.length + 1;
        
        ItemList[i] = ItemID;

        HUDGFx.UpdateItems();
    }

    else
    {
        MyLog("ItemList is full", 'AddItem');
    }
}

function bool CheckForItem(int ItemID, out int FoundItemID)
{
    local int i;
    local bool bHaveItem;

    bHaveItem = false;

    for(i = 0; i < ItemList.length; i++)
    {
        if(ItemList[i] == ItemID)
        {
            bHaveitem = true;
            FoundItemID = i;
        }
    }

    return bHaveItem;
}

//This would be used like this in whatever function needs the check
//If not being called from this class, get PC reference like normal
/*
local int FoundID;

if(CheckForItem(1, FoundID)) //If we have a keycard (ID 1)
{
    RemoveItem(FoundID);
    //Insert the rest of the code that happens if they have the keycard
}

*/

exec function RemoveItem(int ItemID)
{
    ItemList.Remove(ItemID, 1);
    HUDGFx.UpdateItems();
}

Updating the HUD

---

Now that I have all of that in order I have to update the HUD to show which items I have in my inventory. As I do more and more Scaleform projects I try and migrate as much code as I can from AS3 to Unrealscript, since Unrealscript runs faster than AS3. Since I will be spawning movieclips directly from Unrealscript I have to keep a reference to them in order to adjust them or delete them. To help manage my references I decided to make my AttachMovie function a bit more dynamic on what parameters are passed. The first step was to create an array that holds the linkage names(to match the ones in Flash) and the desired instance names for all of the different item types that can be added to the inventory. The element number then corresponds to the ID I gave the items when I added them to the inventory. Here is how I have the AttachMovie and the reference array set up:

var struct ItemInfo
{
    var string LinkageName; //Name used in Flash
    var string InstanceName; //Desired Instance Name
} ItemReference;

//ItemSlot[0] holds the id number of the item assigned to that spot.
ItemOneSlot.AttachMovie(ItemReference[ItemList[0]].LinkageName, ItemReference[ItemList[0]].InstanceName);
ItemOneMC = GetVariableObject("_root.itemOneSlot_mc." $ ItemReference[ItemList[0]].InstanceName);

//In the defualt properties
ItemReference[1] = (LinkageName = "redKeyCard_item", InstanceName = "redKeyCard")
ItemReference[2] = (LinkageName = "blueKeyCard_item", InstanceName = "blueKeyCard")

CheckForItem Kismet Node

---

Since I like using Kismet for setting up triggers and other level specific things I needed a way to check if I had the correct item before the actual action could be executed. For instance, if they have the red keycard when trying to lower the force field. If they don't have it they shouldn't be able to lower it. So I made a custom Kistmet node that calls my check inventory function in my PlayerController class(see above), then outputs the correct result. I wanted to be able to set which item was being checked and also if I wanted it to be removed when the check was made. If I had like a master key card or something that could be used over and over again I wouldn't want it to be removed from my inventory. Anyway, here is my Kismet node:

class SeqCond_CheckForItem extends SequenceCondition;

var bool bResult;
var int ItemID;

/**Remove the item if found? */
var(Items) bool bRemove;

/**Expected Item Type*/
var(Items) enum ItemTypes
{
    ITEM_RedKeyCard,
    ITEM_BlueKeyCard
} ExpectedItem;

event Activated()
{
    local SpaceWingsPlayerController PC;

    PC = SpaceWingsPlayerController(class'WorldInfo'.static.GetWorldInfo().Game.GetALocalPlayerController());
    bResult = PC.CheckForItem(ExpectedItem + 1, ItemID);

    if(bResult && bRemove)
    {
        PC.RemoveItem(ItemID);
    }

    //If the check result is true, activate the first output link, else the second
    OutputLinks[(bResult == true) ? 0 : 1].bHasImpulse = true;
}

defaultproperties
{
    ObjName="CheckForItem"
    ObjCategory="SpaceWings"

    bRemove = true

    InputLinks(0)=(LinkDesc="In")
    OutputLinks(0)=(LinkDesc="True")
    OutputLinks(1)=(LinkDesc="False")

    VariableLinks(0)=(ExpectedType=class'SeqVar_Bool',LinkDesc="Result",bWriteable=true,PropertyName=bResult)
}

Wow, this post ended up being a lot longer than I had anticipated. I was going to throw up a video of the pickups and HUD in action, but that will have to wait until later. Time to work!

Chuggin' Along - Winds of Commerce

Hey guys!

Just a quick update on Winds of Commerce. I've been steadily getting components of the code done. I recently finished up opening and filling the information page which will give you a random amount of information about the city you click on. From there you can purchase additional information if you'd like. I also decided to add a transaction list to the game, that way you can look back and see how much you spent, or made, at a given city and on what day that was on. It will also show you the net profit from each city.

While I have completed quite a few things, I still have a lot of work to do with the menus, choosing the starting options, and the end game.

Here is a neat bit of code I found while doing all of this that would have made some of my previous projects a little smoother. This allows you to create a movieclip in Flash, from Unrealscript. This helps because you then have an easier reference to dynamically created objects than you would spawning them through AS3. Here is the code to add the movie:

//In your custom GFxMovieplayer class

var GFxObject RootMC, TestMC;

RootMC = GetVariableObject("_root");

RootMC.AttachMovie("mySymbol", "myInstanceName");

TestMC = GetVariableObject("_root.myInstanceName");

This part of the code is pretty self explanatory. The function AttachMovie takes 4 parameters, but only two are required.

/** Attaches a symbol to specified movie instance.  If no instance is found in this object's scope with the InstanceName, a new instance is created and returned */
native final function GFxObject AttachMovie(string symbolname, string instancename, optional int depth = -1, optional class<GFxObject> type = class'GFxObject');

The first parameter is the name of the linkage name you set in your Flash file.

The second is what you want the instance name to be of the newly created movieclip. You  can also set the depth of the new movie clip, or where it falls on the z-order in the SWF. The last parameter is what class to cast the return as, but I'm not entirely sure.

Now, even though they have a function to add a movieclip, they don't have one pre-built to remove one through Unrealscript. Matt Doyle, on the Epic Games forums, posted a work around(here) that works like a charm. First you'll need to create a new class extending from GFxObject. This will allow us to add the proper functions to remove the clip.

class GFxDisplayObject extends GFxObject;

function RemoveChild(GFxObject childObject)
{
    ActionScriptVoid("removeChild");
}

defaultproperties
{
}

This will allow us to call the removeChild function easily on a movieclip cast to this class. When ActionScriptVoid(or similar, like ActionScriptBool, or ActionScriptObject) is called it will automatically pass whatever parameters are passed to the function that is calling it. In this case it will pass childObject onto the removeChild function in AS3. To actually make use of this you just need to add this line into your custom GFxMoviePlayer class:

//In your custom GFxMoviePlayer class

GFxDisplayObject(TestMC.GetObject("parent", class'GFxDisplayObject')).RemoveChild(TestMC);

Here, you are grabbing the parent of the movieclip you want to remove, casting it into the custom GFxObject class you made, then calling the RemoveChild function of it, passing the desired movieclip. This line is really versatile since you don't have to set a hardcoded path to the object, since you are getting the parent.

Well enough rambling. hope this was helpful to someone.

Learning Challenge, AS3 Style!

Hey guys!

After my last post I began looking at what I would need to do in order to get the visuals for the action queue to work. I decided I wanted it to look similar in style to the example below. In this example the player wants to use a key, move, talk to a person, then move again. The action that is being performed is scaled larger and is in the 'highlighted' slot on the bar.

This seemed pretty easy in theory, just spawn an icon tot he left of the last one. When one action is completed move the remainder to the right and make the 1st action icon larger. Instead of diving in to this I decided to do a little challenge. The challenge was to make an inventory system that could support a dynamic amount of items. I also wanted to make it scrollable. Now this doesn't seem like it would help with the action queue problem, but both involve spawning movieclips in a line and setting parameters from an array. The last will be important because the actions will be stored in an array and that information will be used to spawn the correct icon. I added the scrolling challenge since I plan on using a system very similar to the challenge if I redo my crafting page, or add an inventory system to my menu collection.

The challenge only took me a couple hours of work, though I had a couple days where both of my computers were out of commission. Many thanks to Craig Campbell over at School of Flash, and Ali Qureshi for their tutorials. Between the two I was able to get the bulk of the logic figured out and implemented. I ended up using Craig's custom scrollbar and masking approach rather than the scrollpane as in Ali's example so I could have more control over the look of it. Ali has a very well commented block of code for spawning the desirable amount of movieclips from AS3. I used this primarily to get the inventory items to spawn. Overall I learned a lot about spawning movieclips and setting parameters using a for loop, and what math is needed to get a particular block of content to scroll. Here is the final product of my self-challenge: (Go ahead, click on it! It's interactive!)

Here is the Actionscript3 code that makes it work: Not too different from the tutorials though.

import flash.events.MouseEvent;

stop();

//Movieclip vars
var desiredMCs:int = 20;
var nextYPos:int = 10;
var i:int = 0;
var invoCont:invoContainer;
var invoArray:Array = ["Bread", "Milk", "Juice", "Steak", "Pinapple", "Carrot", "Ginger", "Parsley", "Eggs", "Peppers", "Onions", "Porkchops", "Chicken Nuggets", "Salmon", "Prickly Pear Cactus", "Butter Cup Squash", "Spam", "Red Leaf Lettuce", "Cornbread", "Cheeseburger"];

//Scrollbar vars
var rect:Rectangle;
var scrollerMinY:Number = slider_mc.handle_mc.y; 
var containerMaxY:Number; 
var padding:Number = 20;

slider_mc.handle_mc.buttonMode = true;
slider_mc.handle_mc.addEventListener(MouseEvent.MOUSE_DOWN, dragHandle);

popup_mc.drawInvo_btn.addEventListener(MouseEvent.CLICK, drawInvo);
back_btn.addEventListener(MouseEvent.CLICK, removeInvoCont);

//Inventory functions
function drawInvo(e:MouseEvent)
{
    desiredMCs = popup_mc.inputField_txt.text;
    
    if(desiredMCs >= 1 && desiredMCs <= 20)
    {
        invoCont = new invoContainer();
        
        invoCont.x = 170;
        invoCont.y = 30;
        
        mainICont_mc.addChild(invoCont);
        
        containerMaxY = invoCont.y;
    
        popup_mc.visible = false;
        
        for (i = 0; i < desiredMCs; i++) 
        {
            var item:invoItem = new invoItem();
            
            item.x = 10;
            item.y = nextYPos;
            item.name = "invoItem" + i;
            item.itemName_txt.text ="Item Name: " + invoArray[i];
            item.itemType_txt.text ="Item Number: Item " + (i +1);
            item.itemDesc_txt.text ="";
            
            invoCont.addChild(item);
            nextYPos += item.height + 1;
        }
        
        for (i = 0; i < invoCont.numChildren; i++)
        {
            trace ("name: " + invoCont.getChildAt(i).name + "\t type:" + invoCont.getChildAt(i));
        }
        
        //If there is not enough content to scroll, disable it
        if(desiredMCs <= 3)
        {
            slider_mc.visible = false;
        }
        else
        {
            slider_mc.visible = true;
        }
    }
    
    else
    {
        //Do something to show an invalid number
    }
}


function removeInvoCont(e:MouseEvent)
{
    //Removing the existing inventory
    mainICont_mc.removeChild(invoCont);
    //Reseting variables for a new test
    slider_mc.handle_mc.y = 3;
    nextYPos = 10;
    popup_mc.inputField_txt.text = "";
    
    popup_mc.visible = true;
}

//Slider Functionality
function dragHandle(e:MouseEvent):void 
{
    rect = new Rectangle(0, 3, 0, 345);
    slider_mc.handle_mc.startDrag(false, rect);
    stage.addEventListener(MouseEvent.MOUSE_UP, releaseHandle);
    slider_mc.handle_mc.addEventListener(Event.ENTER_FRAME, scrollInvo);
}

function scrollInvo(e:Event):void 
{
    var scrollerRange:Number = rect.height; 
    var contentRange:Number = invoCont.height - mask_mc.height + padding; 
    var percentage:Number = (slider_mc.handle_mc.y - scrollerMinY) / scrollerRange;
    var targetY:Number = containerMaxY - percentage * contentRange; 
    invoCont.y = targetY; 
}

function releaseHandle(e:MouseEvent):void 
{
    slider_mc.handle_mc.stopDrag();
    slider_mc.handle_mc.removeEventListener(Event.ENTER_FRAME, scrollInvo);
}

That's about it. It was a nice little challenge that I think will help me with creating the action queue visuals when I get around to them, plus a better inventory management system. For bearing with me here is an point pickup inspired by the 2007 game Monster Madness: Battle for Suburbia!

No texture, sorry!