| online portfolio of Ursula Wing
animation
interactive video
illustration
design
photography
paintings
works on paper
sketchbook
*
résumé/CV
about
links
store
contact
a word on usage
note to prospective models

programming stuff/digital assets:
like my gallery? here's the code
flash audio cookie tutorial
rotatable, draggable mc's
continuous AS tweens
maya models
FLASH AUDIO COOKIES
Saving audio settings with Shared Local Objects

So you find yourself working in an HTML/DHTML environment and want to add some flash audio to some or all pages. What do you do if you don't want the loop to start at the beginning each time the page containing the .swf loads? While a truly aurally seamless solution would likely require the use of frames or a pop-up window, I came up with this for a client who wanted flash audio to play while the user was navigating a PHP store. At the time, my web searches on the subject turned up in vain, hence the following tutorial:

Here is a simple audio .swf with a bit of dialogue from "A Few Good Men." Try it by refreshing the page (F5); If the audio is playing, it continues where it left off when the page was reloaded; If it was off, your preference is 'remembered' for the next 48 hours.

If you are unfamiliar with Shared Local Objects, you might want to take a gander at this tutorial first.

NUM
 /********************************************
FLASH AUDIO COOKIES: EMBEDDED SOUND
********************************************/

function init() {

     //attach the sound
     bgTune = new Sound(this);
     bgTune.attachSound("aFewGoodMen.wav");

     //define the audio cookie (or create it if it's not there)
     audio_data = SharedObject.getLocal("myuser_data");

     //check the audio cookie for previous settings
     lastVisitDate = audio_data.data.visitDate;
     storedAudioSetting = audio_data.data.audioChoice;
     storedAudioPoint = audio_data.data.audioPoint;

     //if no cookie, set default audio vars
     if (lastVisitDate == undefined) {
            lastVisitDate = 0;
     }
     if (storedAudioSetting == undefined) {
           storedAudioSetting = true;
     }
     if (storedAudioPoint == undefined) {
            storedAudioPoint = 0;
      }
     //see how it's been since their last visit (172800000 msec = 2 days)
     todaysDate = new Date();
     timeLapsed = todaysDate.getTime()-lastVisitDate;
     if (timeLapsed>172800000) {
           storedAudioSetting = true;
           storedAudioPoint = 0;
     }
     //determine sound and button state based on shared object vars
     if (storedAudioSetting != false) {
            bgTune.start(storedAudioPoint,999);
            audioOnButton.gotoAndStop("bold");
           audioOffButton.gotoAndStop("normal");
           _root.audioOn = true;
      } else {
            audioOnButton.gotoAndStop("normal");
            audioOffButton.gotoAndStop("bold");
           _root.audioOn = false;
      }
     //start loop
      onEnterFrame = function () {
           audioCheck();
     };
}

function audioCheck() {

     //write the audio position & current universal time to the shared object
     if (_root.audioOn == true) {
           audio_data.data.audioPoint = bgTune.position/1000;
     }

     myDate = new Date();
     audio_data.data.visitDate = myDate.getTime();

     //if end of soundclip is reached, reset stop point to the beginning
     if (bgTune.position>=7700) {
            stopAllSounds();
            storedAudioPoint = 0;

           //cookie
           audio_data.data.audioPoint = 0;
           audio_data.data.audioChoice = true;
           audio_data.flush();
           init();
     }
}

function turnAudioOn() {

     if (_root.audioOn != true) {
            _root.audioOn = true;

           //cookie
           audio_data.data.audioChoice = true;
            storedAudioPoint = audio_data.data.audioPoint;
           if (storedAudioPoint == undefined) {
                  storedAudioPoint = 0;
           }
           //visual changes
            audioOnButton.gotoAndStop("bold");
           audioOffButton.gotoAndStop("normal");

           bgTune.start(storedAudioPoint);

           //restart loop
           onEnterFrame = function () {
                 audioCheck();
           };
     }
}

function turnAudioOff() {

     if (_root.audioOn == true) {
          _root.audioOn = false;

           //cookie
           audio_data.data.audioChoice = false;

           //visual changes
           audioOnButton.gotoAndStop("normal");
           audioOffButton.gotoAndStop("bold");

           //stop audio
            stopAllSounds();

           //stop loop
           onEnterFrame = null;
     }
}

audioOffButton.onRelease = function() {
     turnAudioOff();
};
audioOnButton.onRelease = function() {
     turnAudioOn();
};

init();


SETTING UP THE .FLA
Essentially, your audio.swf should be a loop which continually checks the current position of the playing audio object and defines that spot with a variable which is saved and referred to on the user's hard drive.

At left is your Flash Interface; The stage contains one ON Button, named "audioOnButton and one OFF Button, named "audioOffButton." In this case, each of these is a movieclip with "bold" and "normal" states which toggle depending on the audio status.

Ensure that the audio elements in your library have "Export for Actionscript" checked on in the Linkage Properties.

DOWNLOAD the .fla here
(right/option-click, save as)
:
(When invoking a function which plays audio, just use one event with the on() handler. If you use more than one, such as on(press, release){} as I am fond of doing, your audio event will occur twice, resulting in a muddy echo.)
© Ursula Wing 1997-2008