[F8]Offline (local network) score (high score) table in Flash 8
Recently I've started a little quest about creating an offline score table and couldn't find any tutorial (just one line mentioning SharedObjects). As I've succeeded to find the solution on my own, I'm posting here a little "tutorial" about how I've solved this problem.
As I'm not a native english speaker (I'm from Croatia), please don't resent my English!
If you find out better solutions reading this article or if you find my "tutorial" helpful (at least a little) I would appreciate if you e-mail me, specially because I usually forget to check out if there are some replies on my threads on forum and this is actually my very first tutorial on some Flash subject and on English.
Tnx
Alex
Last edited by avukovi4; 03-08-2009 at 04:32 PM.
Reason: Wrong title
Tutorial itself is pretty good and explains working with shared objects quite well, I just wonder why you used doc format instead of simply posting the tutorial as text.
Explanation of code for "Offline Score Table" with SharedObject - Flash
The code below is for one-player games (but can be rearranged for multi-players games as well)
1st step
- We have to create a counter which will store the ordinal number of the game playing (1 - game
played for the first time, 2 - game played for the second time etc.). --> We need that counter for
storing the player's score accordingly (first score, second score etc.)
- We will store and change the value of that counter with SharedObject, because if we change its
value inside AS code, we'll loose all informations once the .swf or .exe is closed
PHP Code:
var so = SharedObject.getLocal("cookie");
var i; //ordinal number of the game playing
- We have to keep in mind that when our game is played for the first time all SharedObjects have
value undefined (until we storage a piece of information into them)
We will change a little this code later on
PHP Code:
this.onLoad = function() {
i = so.data.game;
if (i == undefined) {
i = 1;
so.data.game = i;
}
else {
i += 1;
so.data.game = i;
}
}
- Now we have a counter i which increases by one every time we open our game --> That's why I
previously called it "the ordinal number of the game playing"
2nd step
- I've created a very simple game for the purpose of this tutorial --> There are 5 math tasks on the
stage and 5 input text boxes for answering, instance names ans1 to ans5
- The game score check function is called with a button, instance name check_btn --> Each right
answer brings 10 points, so the maximum is 50 points
- The game result is stored in the variable called score
Problem explanation:
- We have to create second SharedObject which will be an array in which we'll store the result of
each single game playing --> For example: when i value is 1 (first game) we'll have the first game
score, ... , when i value is 5 (fifth game) we'll have the fifth game score etc.
PHP Code:
//container for individual game scores
var so1 = SharedObject.getLocal("cookie1");
var score = 0;
check_btn.onPress = function() {
if (ans1.text == 11) {
score += 10;
}
//... loop through each input box to check the answer
if (so1.data.result == undefined) {
so1.data.result = new Array();
so1.data.result[0] = score;
}
else {
so1.data.result[i-1] = score;
}
//... we'll put some code here later
}//end of function
Code explanation
- Inital value of counter i is undefined (i.e. 1 - see onLoad function above) --> At the same time
(meaning when your game is played for first time) the initial value of SharedObject so1 is also
undefined and we've changed its initial value to the first score (first element of that array is the
first score --> so1.data.result[0] = score)
- When the value of counter i is greater than 1 i.e. i > 1 (when your game is played for second ...
time), i-1 element of so1.data.result is populated with new score --> This is because the first
element of an array has index 0, second element has index 1 etc.
- Now we have array so1.data.result which stores the result (score) of each individual game playing
3rd step
Problem explanation:
- I want only top 4 scores in my score table and I want to input only the name of the player with the
higest score currently
- So, when the game is played for the first time, game score and player's name input are automatical
--> Second input will perform only if the game score of a particular individual game playing is
bigger or equal to the previous one (which has been "recorded" in array)
- For that purpose we have to create third SharedObject which will be an array that consists of
best game results in descending sort order
PHP Code:
//container for best game scores
var bestSc = SharedObject.getLocal("cookie3");
...
if (bestSc.data.best == undefined) {
bestSc.data.best = new Array();
bestSc.data.best[0] = score;
}
else {
if (score >= bestSc.data.best[0]) {
bestSc.data.best.unshift(score);
}
}
Code explanation:
- Initial value of SharedObject bestSc is undefined so we've changed its value to the first score
(game score achieved when your game is played for the first time) --> When your game is played
for second ... time, your game score is compared to the one previously "recorded" and if it's
bigger, bestSc.data.best array is populated with new score --> New score becomes the first
(index 0) element of bestSc.data.best array --> This is achieved with the unshift array method that
adds one ore more elements to the beginning of an array and returns the new length of the array
- Now we have array bestSc.data.best which stores best results of individual game playing in
descending sord order
Whole code:
PHP Code:
//container for individual game scores
var so1 = SharedObject.getLocal("cookie1");
//container for best game scores
var bestSc = SharedObject.getLocal("cookie3");
var score = 0;
check_btn.onPress = function() {
if (ans1.text == 11) {
score += 10;
}
//... loop through each input box to check the answer
if (so1.data.result == undefined) {
so1.data.result = new Array();
so1.data.result[0] = score;
_root.register_mc.gotoAndStop(2);//explanation in next step
}
else {
so1.data.result[i-1] = score;
}
if (bestSc.data.best == undefined) {
bestSc.data.best = new Array();
bestSc.data.best[0] = score;
}
else {
if (score >= bestSc.data.best[0]) {
bestSc.data.best.unshift(score);
_root.register_mc.gotoAndStop(2);//explanation in next step
}
}
}//end of function
4th step
Problem explanation:
- I have created a movie clip, instance name register_mc, with score table that consists of one input
text box (on the top of the table because only the best game score currently can assign player's
name to it) and dynamic text boxes
- We have to create fourth SharedObject which will be an array that consists of player's names
--> This array will be created likewise bestSc.data.best array using the unshift array method
PHP Code:
code snippet - inside movie clip register_mc
var so2 = SharedObject.getLocal("cookie2"); //container for player's name(s)
insert_btn.onPress = function() {
if(_root.register_mc.pl1.text == "") {
_root.register_mc.feedback = "You have to write your name!";
}
else {
insert_btn.enabled = false;
var written = _root.register_mc.pl1.text;
_root.register_mc.feedback = "";
if (so2.data.ime == undefined) {
so2.data.ime = new Array();
so2.data.ime[0] = written;
}
else {
so2.data.ime.unshift(written);
}
}
}
Code explanation:
- As said before, when your game is played for the first time player is automatically redirected to
the register_mc after finishing the game --> Player will write his/her name into pl1 input text box
--> If he/she click insert_btn before writting any text into pl1 input text box, returning message
"You have to write your name!" will appear in dynamic text box named feedback
- Because the initial value of a SharedObject (when .swf or .exe is launched for the first time) is
undefined, the initial value of so2.data.ime is the name of the first player
- After that, as described before, only the next best result can assign player's name to it --> Movie
clip register_mc will be launched next time when new game result is bigger than the one
"recorded" before (in bestSc.data.best array) --> New player's name will automatically become the
first element (index 0) of the so2.data.ime array using the unshift array method
IMPORTANT REMARK
- Now you only have to figure out how to populate other dynamic text boxes with other scores --> I
have populated them with the score and the name of the 2nd, 3rd and 4th player --> The next best
result always comes on the top (in the first row)
- If you remember (hm... after a long text like this one... not likely ) at the beginning of this
tutorial, when describing onLoad function, I've said that it will be changed a little later on --> The
SharedObject class is used to read and store limited amounts of data on a user's computer
(similar to browser cookies), so I recommend you to limit "up to" counter i value meaning that
after a certain number of game repeating you should clear SharedObjects with simple
SharedObject_name.clear() method like I did or you can create Clear_btn in the register_mc and
let a player to "decide" when SharedObjects will be cleared
my solution
PHP Code:
this.onLoad = function() {
i = so.data.game;
if (i == undefined) {
i = 1;
so.data.game = i;
}
else {
if (i < 50) {
i += 1;
so.data.game = i;
}
else {
so.data.game = 1;
i = so.data.game;
so1.clear();
bestSc.clear();
_root.register_mc.so2.clear();
}
}
}