M Studio Labs Beaker

M Studio Labs


Ant is a great little build tool which allows you to automate all sorts of things like compiling code, moving/copying files, creating .zip archives and using FTP to upload. The latest version of FDT has a library of Ant commands specific to Flash. There are a bunch of articles listed below which explain some of the other features, but I’m going to focus on FTP here.

Whenever I have a project in FDT, I eventually want to post my bin directory to a server so that the client can review it. I usually also post a .zip of the folder so that they can deploy it on their own server. Here’s what I want my build file to do:

  • Compile the SWF
  • Export a clean “deploy” copy of the bin directory, without any .svn properties, etc.
  • Create a .zip of the “deploy” directory
  • Upload “deploy” files to the web server and delete the local copy
  • In the console, display the link to the site and .zip file so they can easily be pasted into an e-mail

Step 1: Install the FTP Java Libraries

The Ant build tool is installed with FDT, but it doesn’t include the FTP Java libraries. You can download them at the links below. Extract “commons-net-2.0.jar” and “jakarta-oro-2.0.8.jar” from the .zip archives and place both files in your ant bin directory, which probably looks something like “FDT\plugins\org.apache.ant_#####\bin\”

Java FTP Libraries:
commons-net-2.0.jar
jakarta-oro-2.0.8.jar

Note: If you want to skip the step-by-step, you can download the final Ant build file here.

Once those files are in place, you need to add them to the Ant classpath in FDT (image below). Go to “Preferences > Ant > Runtime”. Click the “Classpath” tab. Select the first entry, named “Ant Home Entries (Default)” and then select “Add External JARs…” Add the 2 jar files from above and then click Ok.

Step 2: Add Your Ant Build File

In your FDT project, right click and select “New > Folder”. Name it “ant”.
Next, right-click that folder and select “New > Other > XML > XML”. Name it “build.xml”.

In order to have FDT recognize this as an Ant file, go to “Window > Show View > Ant”. You’ll see the Ant window open. Drag your build.xml file into this window and FDT will recognize it properly.

Your project should look something like this:

Step 3: Declare your Project Properties

Open the “build.xml” in the editor and type the following:

<?xml version="1.0" encoding="UTF-8"?>
<project name="AntExample" default="compile">

	<!-- declare all project-specific properties here -->
	<property name="version.num" 	value="1"/>
	<property name="src.dir" 	value="${basedir}/../src"/>
	<property name="bin.dir" 	value="${basedir}/../bin"/>
	<property name="deploy.dir" 	value="${basedir}/../deploy"/>
	<property name="ftp.server" 	value="ftp.MYDOMAIN.com"/>
	<property name="ftp.dir" 	value="/httpdocs/PROJECTNAME/"/>
	<property name="ftp.username" 	value="USERNAME"/>
	<property name="ftp.password" 	value="PASSWORD"/>
	<property name="site.url" 	value="http://www.MYDOMAIN.com/PROJECTNAME/"/>

</project>

These are the properties you’ll use in your Ant targets. You’ll need to edit the highlighted lines above as follows:

  • ftp.server: your FTP/IP address to upload deploy files to
  • ftp.dir: the remote directory to upload to
  • ftp.username: FTP username
  • ftp.password: FTP username
  • optional: version.num: this will append the version number to the remote directory

Step 4: Create your “Compile” Target

Next, add the following to the project node. This will create the SWF in the bin directory and open it in the External SWF Viewer:

<target name="compile">
	<fdt.launch.application
		projectname 	= "AntExample"
		mainClass		= "${src.dir}/Main.as"
		target 			= "${bin.dir}/main.swf"
		startswf 		= "true"
		swflauncher 	= "External SWF Viewer"
	/>
</target>

Step 5: Create your “Export” Target

The “Export” target will create a temporary directory named “deploy” and export all files, minus any meta data or .svn properties. You can filter out additional file types by using the “exclude” element. Note, that we’re adding a dependancy here named “compile”. This means that before “export” runs, “compile” should first be run. We need to make sure the bin folder has a SWF before exporting it:

<target name="export" depends="compile">
		<copy overwrite="true" todir="${deploy.dir}">
			<fileset dir="${bin.dir}">
				<exclude name="**/.settings/**" />
				<exclude name="**/*.as3_classpath"/>
				<exclude name="**/*.project"/>
				<exclude name="**/.svn/**" />
			</fileset>
		</copy>
   	</target>

Step 6: Create your “Export” and “Zip” Targets

The “Export” target will create a temporary directory named “deploy” and export all files, minus any meta data or .svn properties. You can filter out additional file types by using the “exclude” element. Note, that we’re adding a dependancy here named “compile”. This means that before “export” runs, “compile” should first be run. We need to make sure the bin folder has a SWF before exporting it. The “Zip” target will just create an archive of the “deploy” directory:

<target name="export" depends="compile">
		<copy overwrite="true" todir="${deploy.dir}">
			<fileset dir="${bin.dir}">
				<exclude name="**/.settings/**" />
				<exclude name="**/*.as3_classpath"/>
				<exclude name="**/*.project"/>
				<exclude name="**/.svn/**" />
			</fileset>
		</copy>
   	</target>
       <target name="zip" depends="export">
		 <zip file="${basedir}/../deploy.zip">
			<fileset dir="${basedir}/../">
				<include name="**/deploy/**" />
			</fileset>
		</zip>
	</target>

Step 7: Create a target to upload the deploy files, delete them locally and print out the urls.
Note that the target first creates a directory on the server using “mkdir” before uploading files:

<target name="upload" depends="zip">
			<!-- create the directory on the server -->
			 <ftp action	="mkdir"
		       server		="${ftp.server}"
			 	userid		="${ftp.username}"
				password	="${ftp.password}"
		        remotedir	="${ftp.dir}${version.num}/"/>

			<!-- upload the files to the new directory -->
			<ftp server		="${ftp.server}"
				port			="21"
				remotedir	="${ftp.dir}${version.num}/"
				userid		="${ftp.username}"
				password	="${ftp.password}"
				passive		="no"> <!-- YOU MAY NEED TO CHANGE TO "yes" DEPENDING ON YOUR SERVER -->
				<fileset dir  ="${deploy.dir}/"/>
				<fileset file ="${basedir}/../deploy.zip"/>
			</ftp>

			<!-- delete the deploy files from the file system -->
			<delete dir="${deploy.dir}/"/>
			<delete file="${basedir}/../deploy.zip"/>

			<!-- output the urls -->
			<echo message="Preview: ${site.url}${version.num}/"/>
			<echo message="Files: ${site.url}${version.num}/deploy.zip" />

</target>

That’s about it. You can grab my Ant file here, and you can see the full code here:

<?xml version="1.0" encoding="UTF-8"?>
<project name="AntExample" default="compile"> 

	<!-- declare all project-specific properties here -->
	<property name="version.num" 	value="1"/>
	<property name="src.dir" 		value="${basedir}/../src"/>
	<property name="bin.dir" 		value="${basedir}/../bin"/>
	<property name="deploy.dir" 	value="${basedir}/../deploy"/>
	<property name="ftp.server" 	value="ftp.MYDOMAIN.com"/>
	<property name="ftp.dir" 		value="/httpdocs/PROJECTNAME/"/>
	<property name="ftp.username" 	value="USERNAME"/>
	<property name="ftp.password" 	value="PASSWORD"/>
	<property name="site.url" 		value="http://www.MYDOMAIN.com/PROJECTNAME/"/>

	<target name="reset">
		<fdt.launch.resetFCSH/>
	</target>

	<target name="compile">
		<fdt.launch.application
			projectname 	= "AntExample"
			mainClass		= "${src.dir}/Main.as"
			target 			= "${bin.dir}/main.swf"
			startswf 		= "true"
			swflauncher 	= "External SWF Viewer"
		/>
	</target>

	<!-- this will copy the bin folder to the deploy folder,
	removing all non-essential files and directories -->
	<target name="export" depends="compile">
		<copy overwrite="true" todir="${deploy.dir}">
			<fileset dir="${bin.dir}">
				<exclude name="**/.settings/**" />
				<exclude name="**/*.as3_classpath"/>
				<exclude name="**/*.project"/>
				<exclude name="**/.svn/**" />
			</fileset>
		</copy>
   	</target>

	<!-- this will copy the bin folder to the deploy folder,
		removing all non-essential files and directories -->
	<target name="zip" depends="export">
		 <zip file="${basedir}/../deploy.zip">
			<fileset dir="${basedir}/../">
				<include name="**/deploy/**" />
			</fileset>
		</zip>
	</target>

	<!-- upload the deploy directory and zip,
		delete the files and print out the urls -->

	<target name="upload" depends="zip">
			<!-- create the directory on the server -->
			 <ftp action	="mkdir"
		       server		="${ftp.server}"
			 	userid		="${ftp.username}"
				password	="${ftp.password}"
		        remotedir	="${ftp.dir}${version.num}/"/>

			<!-- upload the files to the new directory -->
			<ftp server		="${ftp.server}"
				port			="21"
				remotedir	="${ftp.dir}${version.num}/"
				userid		="${ftp.username}"
				password	="${ftp.password}"
				passive		="no"> <!-- YOU MAY NEED TO CHANGE TO "yes" DEPENDING ON YOUR SERVER -->
				<fileset dir  ="${deploy.dir}/"/>
				<fileset file ="${basedir}/../deploy.zip"/>
			</ftp>

			<!-- delete the deploy files from the file system -->
			<delete dir="${deploy.dir}/"/>
			<delete file="${basedir}/../deploy.zip"/>

			<!-- output the urls -->
			<echo message="Preview: ${site.url}${version.num}/"/>
			<echo message="Files: ${site.url}${version.num}/deploy.zip" />

	</target>

</project>

Links to other resources and tutorials:
FDT HTML Template using Ant
FDT and ANT | A User’s Guide – Part I


Leave a Reply




Comment:





About this Blog
This blog is maintained by Alex Motzenbecker at M Studio. This is where I'll try to share our approaches to Flash-related challenges with the rest of the developer community.

I'll post our solutions, any Flash-related news and updates on the work we're doing here. You can send any feedback or hello's to alex [at] mstudio.com.
spacer
Recent Posts
Categories
Favorite Resources