Tutorial: SharedObject

How to save data using ActionScript 3.0

When developing user interactive flash application you some times want the user to be able to save his preferences. It can be very frustrating to use several minutes adjusting some settings and then the next day return and find them resat.
You can save content easily on the users computer using the SharedObject class in ActionScript 3.0.

How to create an instance of SharedObject
If you're working in an external script you will first have to import the library. The SharedObject class is located in the .net library. In my tutorial we will only be working in the actions panel so we don't need to import the class.

On the stage we have 5 textfields. 2 input textfields and 3 dynamic. The two input fields have an instance name of "name_field" and "age_field". The dynamic fields have the following instance names: "visit_counter", "last_visit_txt" and "info_txt".

Let's make the textfields interactive. First we want to make a new SharedObject. By using the getLocal(String) function we assign a name to the saved file. This can be any string at all. It will simply be the name of the file on the users computer like the name on for example a Word document. When the user opens the application for the first time the getLocal() function will create the SharedObject on the local drive. The next time it will go and get it.

Code Snippet
var savedData:SharedObject = SharedObject.getLocal("lewinzki");
 
var visits:uint = 0;
 
var date:Date = new Date();
 
var last_visit:String;
last_visit = "You last visit was: " + date.toLocaleDateString();

Here are all of the variables we will need. We will count the visits and show a date. The toLocalDateString() function converts the rather complex date format into a nice readable string.
Now we need to check wether this is the first time the user visits the application and in that case is there already some data in our SharedObject.

Code Snippet
if (savedData.data.personalInfo) {
	name_field.text = savedData.data.personalInfo[0];
	age_field.text = savedData.data.personalInfo[1];
}
if (savedData.data.visits) {
	visits = savedData.data.visits[0];
	last_visit_txt.text = savedData.data.visits[1];
}

This snippet checks wether a save is located on the users machine and if there is then it assigns the saved values to our variables. For now you will just have to live with it and don't ask any question. We'll come back to this later.

Code Snippet
visits++;
savedData.data.visits = [visits, last_visit];
savedData.flush();
savedData.close();
 
visit_counter.text = "You have visited this page " + visits + " times";
 
save_btn.addEventListener(MouseEvent.CLICK, saveFile);
erase_btn.addEventListener(MouseEvent.CLICK, eraseFile);

The number of visit gets incremented from its current value. And then. We save both the current date and the number of visits in an array on the SharedObject.data. The .visits instance name is a name you assign to the saved file - just a reference.

.flush() saves the data on the local drive of the user.

.close() closes all contact to any drive. I only think this is necessary when working with remote servers but still it's a good habit when working with SharedObject.

line 6: We update the text of the visit_counter field.

Then we assign some eventListeners to our buttons. One to save the current data on the screen and one to erase all data in our SharedObject.
Let's take a look at the functions!

Code Snippet
function saveFile(event:MouseEvent):void {
	savedData.data.personalInfo = [name_field.text, age_field.text];
 
	savedData.flush();
	savedData.close();
 
	info_txt.text = "Saved";
}
 
function eraseFile(event:MouseEvent):void {
	savedData.clear();
 
	info_txt.text = "Erased";
}

When the save button is pressed we create a new subfolder to the SharedObject.data called "personalInfo" and in here we store an array containing the users name and age if entered in the fields.
Again we simply save and close the SharedObject and let a text field show that the data is saved.

If the user presses the erase button all of the data get deleted. Next time the user visits the application Flash will think it has never met the person.

Here is the final code

Final Script
var savedData:SharedObject = SharedObject.getLocal("lewinzki");
 
var visits:uint = 0;
 
var date:Date = new Date();
 
var last_visit:String;
last_visit = "You last visit was: " + date.toLocaleDateString();
 
if (savedData.data.personalInfo) {
	name_field.text = savedData.data.personalInfo[0];
	age_field.text = savedData.data.personalInfo[1];
}
if (savedData.data.visits) {
	visits = savedData.data.visits[0];
	last_visit_txt.text = savedData.data.visits[1];
}
 
visits++;
savedData.data.visits = [visits, last_visit];
savedData.flush();
savedData.close();
 
visit_counter.text = "You have visited this page " + visits + " times";
 
save_btn.addEventListener(MouseEvent.CLICK, saveFile);
erase_btn.addEventListener(MouseEvent.CLICK, eraseFile);
 
function saveFile(event:MouseEvent):void {
	savedData.data.personalInfo = [name_field.text, age_field.text];
 
	savedData.flush();
	savedData.close();
 
	info_txt.text = "Saved";
}
 
function eraseFile(event:MouseEvent):void {
	savedData.clear();
 
	info_txt.text = "Erased";
}

By Lewinzki