Saving dynamic data from Flash

Untitled Document

2. Saving to text files

The first question: saving data for what? I mean, why we want to save the data? There could be many reasons, and this reasons will modify the way we save it. In this example, we assume that the data is saved in order to be used again from Flash, so we will save name/value pairs as Flash expects in order to load it (see loading data tutorial)
The second problem: can Flash write files by itself? Well, the answer is no, you need always a back-end language in order to perform the file writing. So we will use php in order to write to the file, and will give ASP and ColdFusion example code
Here's a screenshot of our form example

This is a simple form, like the ones we usually use in HTML. We need to store three piece of data here: title, comments and name of the image. When the user press the send button, we send data to our back-end script and wait until a successful message arrives.
To create the movie, open a blank document and create two layers: one for the code, the other to place three input textfields. Name each one: Title, Image and Comments. Remember to set the Comments input textfield as multiline. Create a Send button and give an instance name of submit. Feel free of use an MX or MX 2004 push button component ... since this tutorial is not related to components, I simply use a standard button I build my own. If you use some component, modify the ActionScript accordingly.
When using forms, we always need to validate data prior to send (usually JavaScript take care of this in HTML forms) So our submit function should validate data, and if is correct send it. In this case we only validate that none of the textfields is empty.So let's add the button code in the code layer

submit.onPress = function(){ if(Title.text!="" && Comments.text !="" && Image.text!=""){ myData.Title = Title.text myData.Comments = Comments.text myData.Image = Image.text myData.sendAndLoad("save.php", myData, "POST") } } stop()

But what's this myData object there? Well, it's a LoadVars object that we will use to send data and receive an answer. This LoadVars object fires an onLoad event when data is received from the script, in this case, a success in the file writing or an error. So let's declare the LoadVars object before submit data:

myData = new LoadVars() myData.onLoad = function(){ if(this.writing=="Ok") { gotoAndStop(2) status.text = "Submited data was saved" } else status.text = "Error in saving submitted data" }

Here, the back-end script will be return some message about the operation like this: writing=Ok, if no message is returned, we assume the operation fails

Now we need to add a second keyframe in order to display the returned message. So add a new keyframe, delete the input and static textfields and the button from stage and put a dynamic textfield named status, where the returned message displays. Add a stop. Our basic movie is finished

Back-end scripts

Here's a summary listing of three scripts that could manage the incoming data. Let's begin with PHP. You should use:

myData.sendAndLoad("save.php", myData, "POST")

in your movie and here's save.php code:

<?php //Capture data from $_POST array $title = $_POST['Title']; $comments = $_POST['Comments']; $image = $_POST['Image']; //Make one big string in a format Flash understand $toSave ="Title=$title&Comments=$comments&Image=.$image"; //Open a file in write mode $fp = fopen("anastasio.txt", "w"); if(fwrite($fp, $toSave)) echo "writing=Ok&"; else echo "writing=Error&" fclose($fp); ?>

We capture the data from the $_POST array, then we make a Flash readable string and save it to the file. Note that we use "w" mode. This mode create a new file or overwrite an existent. If you want to save data more than once in a cumulative way, use "a+" mode instead.

Take a look at the ASP code. You should use:

myData.sendAndLoad("save.asp", myData, "POST")

in your movie and here's save.asp code:

<% 'Dim variables Dim objFSO Dim objTextStream Dim PathFile 'Look for the path to current directory, change to match your directory based on root PathFile = Server.MapPath("/Flash/anastasio.txt") 'Create the filesystem Object set objFSO = createobject("Scripting.FileSystemObject") 'Open the file: if doesn't exists, create it Set objTextStream = objFSO.OpenTextFile(PathFile, 2, True) 'Write to the data file objTextStream.Write "Title=" & Request("Title") & "&Comments=" & Request("Comments") & "&Image=" & Request("Image") 'Say OK to Flash Response.Write "writing=Ok&" 'Clean objects objTextStream.Close Set objTextStream = Nothing Set objFSO = Nothing %>

If you want to append to the textfile, use 8 instead of 2: Set objTextStream = objFSO.OpenTextFile(PathFile, 8)

And finally, Take a look at the ColdFusion code. You should use:

myData.sendAndLoad("save.cfm", myData, "POST")

in your movie and here's save.cfm code:

<cfsetting enablecfoutputonly="YES"> <cfset Title = form.Title> <cfset Comments = form.Comments> <cfset Image = form.Image> <cffile action = "write" file = "c:\CFusionMX\wwwroot\myNews\anastasio.txt" mode = 644 charset = "UTF-8" output = "Title=#Title#&Comments=#Comments#&Image=#Image#"> <cfset returnToFlash = "&writing=Ok&">  <cfprocessingdirective suppresswhitespace="Yes"> <cfoutput> #returnToFlash# </cfoutput> </cfprocessingdirective>

Note that we use an absolute path to put text files in our local disk. In a server environment, you can use CGI variables to look at current path, like CGI.SERVER_NAME plus some path info. If you want to add to the text file, use <cffile action = "append" instead of "write". Those using ColdFusion locally on port 8500, should use the complete path: myData.sendAndLoad("http://localhost:8500/save.cfm", myData, "POST")

So, now that we know how to save data to text files, we can move to Shared Objects