Creating a Small Custom Controller

The skin you use for smaller video dimensions is similar to the larger skin, except some assets need to be removed so the necessary buttons display properly in the controller. Because the small skin is similar to the large skin, it is easiest to duplicate the previous FLA file and make a few modifications.

1. Open the completed farmSkin_large.fla and select File > Save As. Save the new document as farmSkin_small.fla.
2. Delete the stop_mc movie clip and volumeBar_mc movie clip from the Stage.
3. Select Unused Items from the Library Options menu. The symbols that you no longer use in the current document are highlighted in the Library panel. Click the garbage can icon near the bottom of the Library panel to delete the selected symbols. You'll also need to select the empty Stop Button folder in the Library, and delete it as well.

4. Click frame 1 of the actions layer and replace the existing getSkinInfo function with the following code:

   function getSkinInfo():Object {
        var res:Object = new Object();
        res.video = {x:10, y:10, w:-20, h:-47};
        res.mode = "hide";
        res.playBtn = {x:10, y:-30};
        res.pauseBtn = {x:10, y:-30};
        res.seekBar = {x:55, y:-33, w:-94};
        res.buffering = {x:56, y:-27, w:-96}; 
       res.volumeMute = {x:-28, y:-31}; 
       res.autoHide = false;
        res.bgColor = 0xFFFFFF;
        res.uiMode = "stretch";
        return res;
    }  

   This code differs from the old function. It has slightly different positions for the assets this skin contains, because it lacks a stop button and a volume bar. Because the video is smaller, you need to be conservative about spacing. Also notice that the mode property has changed from disable to hide. You position the playBtn and pauseBtn in the same location and set the mode to hide, so the buttons toggle on and off instead of disabling like the first skin. You see this in action after you embed a new Flash video and use the custom skin.

5. Save and publish the file. Flash creates a SWF file, which you will copy to various folders throughout the Farm site in the following exercise.