This article relates to the game "Dota 2". Click here for more information.
This article relates to the SDK/Workshop Tools for "Dota 2 Workshop Tools". Click here for more information.
This article's documentation is for Source 2. Click here for more information.

Dota 2 Workshop Tools/Custom UI/Custom Error Tutorial

From Valve Developer Community
Jump to: navigation, search
English (en)
... Icon-Important.png

Example Video

This is a short step by step tutorial to make your own Custom Error module. There is not a lot going on, but it will show you how we can utilise Valve UI panels to our advantage.

First, we are going to create our new CustomError.fla with the corresponding CustomError.as. If you don't know how to do that, check out the Setting Up Flash tutorial. We will also import the Globals class for our use.

After doing all the basic stuff, our code in the CustomError.as should look like this:

package  {
	
	import flash.display.MovieClip;
	
	import ValveLib.Globals;
				
	public class CustomError extends MovieClip {
		
		public var gameAPI:Object;
		public var globals:Object;
		public var elementName:String;

		
		public function CustomError() {
			//constructor
		}
		
		public function onLoaded() : void {			
			//make this UI visible
			visible = true;
		}
	}
	
}


Next, we'll add our custom event to the custom_events.txt file in "../game/dota_addons/<addon_name>/scripts/"

"CustomEvents"
{
	
	"custom_error_show"
	{
		"player_ID"		"short"
		"_error"		"string"
	}
	
}


"custom_error_show" is the event name, the "player_ID" and "_error" is what we will be passing from Lua later on, while the "short" and "string" are the types of the respective variables.


Now would be a good time to subscribe to our custom event in the CustomErrors.as. To do that, simply add one line of code to the onLoaded() function, as shown here:

public function onLoaded() : void {			
	//make this UI visible
	visible = true;
	
	//add our event listener
	this.gameAPI.SubscribeToGameEvent("custom_error_show", this.showError);			
}


"custom_error_show" is the name of the event we are listening to, while "this.showError" is the name of the function we are calling once our event fires. We don't have that yet, so let's add that inside our class in CustomErrors.as:

public function showError( args:Object ){
	// get the pID of the owner of this UI
	var pID:int = this.globals.Players.GetLocalPlayer();

	// check if the owner of this UI is the same as the player passed by the event
	if( pID == args.player_ID ) {
		// last but not least, utilise the error_msg panel to show our custom error message
		this.globals.Loader_error_msg.movieClip.setErrorMsg(args._error);
	}
}


The "args:Object" in "public function showError( args:Object )" holds the values passed from Lua upon firing the event. We access the values by using args.variableName, where variableName is the name of a property of the event in custom_events.txt.


We are done with our .as, this is how the whole code should look:

package  {
	
	import flash.display.MovieClip;
	
	import ValveLib.Globals;
				
	public class CustomError extends MovieClip {
		
		public var gameAPI:Object;
		public var globals:Object;
		public var elementName:String;

		
		public function CustomError() {
			//constructor
		}
		
		public function onLoaded() : void {			
			//make this UI visible
			visible = true;

			//add our event listener
			this.gameAPI.SubscribeToGameEvent("custom_error_show", this.showError);	
		}

		public function showError( args:Object ){
			// get the pID of the owner of this UI
			var pID:int = this.globals.Players.GetLocalPlayer();

			// check if the owner of this UI is the same as the player passed by the event
			if( pID == args.player_ID ) {
				// last but not least, utilise the error_msg panel to show our custom error message
				this.globals.Loader_error_msg.movieClip.setErrorMsg(args._error);
			}
		}
	}
	
}


Now we compile and build our .swf. Put it in "../game/dota_addons/<addon_name>/resource/flash3/" and change the custom_ui.txt located there to include our newly made .swf:

"CustomUI"
{
	"1"
	{
		"File"		"CustomError"
		"Depth"		"50"
	}
}


All that's left to do is add one line in our Lua for when we want to show the error (you may reuse it as much as you want throughout your Lua code):

FireGameEvent('custom_error_show', { player_ID = <playerID>, _error = 'Insert custom error here!' } )


Of course, change <playerID> to the ID of the player that we want to show the error to.