Web App Solution Blog

Ever start a project as a plain-old Flex project that doesn’t use a Java server and then later want to convert it? You’d think you could do this simply by examing the project’s server properties (Project -> Properties -> Flex Server) and adding a server…but no…you can’t…ehhh…not to fret, there’s still hope…don’t create a new project from scratch just yet and copy all your old projects files into your new project. We just need to modify a couple of the project’s .files and we’re good to go.

Modify the Project Property Files

Since we started our Flex project as a non-server based project, we’ll need to make some modifications to our .project, .actionScriptProperties, and .flexProperties files in order to convert the project to a server-based application. These files all exist under the root of the Flex Project’s directory — if you can’t see them, make sure you’re in either the Flex or Flex Debugging Perspective.

As a side note, under the covers we’re modifying the Flex Project’s Properties as if we right-clicked on the project and selected Properties.

NOTE: The following examples use a @@key@@ to indicate where you should substitute your own project, workspace, and server settings.

NOTE: This also assumes that you’re building your flex project to a directory in your Java project called flex — you don’t need to create it in WebContent on the Java side, as it’s generated by Flex Builder when you do a build or clean.

.actionScriptProperties

Open up .actionScriptProperties and locate the <compiler> node and add or change the following attributes to look like this:

• outputFolderLocation=”DOCUMENTS/@@JavaProjectName@@/WebContent/flex”
• rootURL=”http://@@Host@@:@@Port@@/@@JavaAppContext@@/flex”

Your .actionScriptProperties should look like this:

<?xml version="1.0" encoding="UTF-8"?>
<actionScriptProperties
	mainApplicationPath="@@MyFlexApp@@.mxml"
	version="3">

<compiler
	additionalCompilerArguments="-locale en_US
	-use-network=false"
	copyDependentFiles="true"
	enableModuleDebug="true"
	generateAccessible="false"
	htmlExpressInstall="true"
	htmlGenerate="true"
	htmlHistoryManagement="true"
	htmlPlayerVersion="9.0.124"
	htmlPlayerVersionCheck="true"
	outputFolderLocation=
		"DOCUMENTS/@@JavaProjectName@@/WebContent/flex"
	outputFolderPath="bin-debug"
	rootURL="http://@@Host@@:@@Port@@/@@JavaAppContext@@/flex"
	sourceFolderPath="src"
	strict="true"
	useApolloConfig="false"
	verifyDigests="true"
	warn="true">

<compilerSourcePath/>
<libraryPath defaultLinkType="1">
<libraryPathEntry kind="4" path=""/>
<libraryPathEntry kind="1" linkType="1" path="libs"/>
</libraryPath>
<sourceAttachmentPath/>
</compiler>
<applications>
<application path="@@MyFlexApp@@.mxml"/>
</applications>
<modules/>
<buildCSSFiles/>
</actionScriptProperties>

.flexProperties

Open up .flexProperties and locate the <flexProperties> node and add or change the following attributes to look like this:

• flexServerType=”2″
• serverContextRoot=”/@@JavaAppContext@@”
• serverRoot=”${DOCUMENTS}/@@JavaProjectName@@/WebContent”
• serverRootURL=”http://@@Host@@:@@Port@@/@@JavaAppContext@@/”

Your .flexProperties should look like this:

<?xml version="1.0" encoding="UTF-8"?>
<flexProperties
	flexServerType="2"
	serverContextRoot="/@@JavaAppContext@@"
	serverRoot="${DOCUMENTS}/@@JavaProjectName@@/WebContent"
	serverRootURL="http://@@Host@@:@@Port@@/@@JavaAppContext@@/"
	toolCompile="true"
	useServerFlexSDK="false"
	version="1"/>

.project

Open up .project and locate the <projectDescription> node and add the node <linkedResources> after the <natures> node inside <projectDescription> — simply copy and paste the <linkedResources> node from my code snippet below; your .project file should look like this:

NOTE: You need to put the full, absolute path on your machine to your Java Web Project in place of the @@FULL_PATH@@ key I subsituted down below for the path on my machine.

<?xml version="1.0" encoding="UTF-8"?>
<projectDescription>
	<name>EmployeeManagementConsole4</name>
	<comment></comment>
	<projects>
	</projects>
	<buildSpec>
		<buildCommand>
			<name>com.adobe.flexbuilder.project.flexbuilder</name>
			<arguments>
			</arguments>
		</buildCommand>
	</buildSpec>
	<natures>
		<nature>com.adobe.flexbuilder.project.flexnature</nature>
		<nature>com.adobe.flexbuilder.project.actionscriptnature</nature>
	</natures>
	<linkedResources>
		<link>
			<name>bin-debug</name>
			<type>2</type>
			<location>
		@@FULL_PATH@@/@@JavaProjectName@@/WebContent/flex
			</location>
		</link>
	</linkedResources>
</projectDescription>

Check Flex Project Properties

Just to make sure we did everything correctly, let’s check the project properties by right-click on our Flex Project and selecting Properties -> Flex Build Path. It should look like this:

NOTE: The screen shots have my actual project, workspace, and server settings — these should help solidify the entire tutorial. They are from Part 4 of my Stack Tutorial Series.

• Main source folder: src
• Output folder: ${DOCUMENTS}/@@JavaProjectName@@/WebContent/flex
• Output folder URL: http://@@Host@@:@@Port@@/@@JavaAppContext@@/flex

Build Path Properties

Next let’s check the Flex Server Settings: Project Properties -> Flex Server:

• Root folder: ${DOCUMENTS}/@@JavaProjectName@@/WebContent
• Root URL: http://@@Host@@:@@Port@@/@@JavaAppContext@@/
• Context root: /@@JavaAppContext@@

Server Properties

Finished!

Tweet This Post