This tutorial will guide you to create a simple slidebar wich will control an mp3.

Our media player is divided to 4 components:
    - Slide Bar which will control the mp3 position
    - Left Pane to show the current mp3 playing position in percentage of its length
    - RightPane to start/stop the mp3
    - Mask to add some tweening effects to the movie clip

The project is simply a .as file, which contains 5 classes:

- First is the SlideBarContainer,
This classes when instanciated, creates dynamically a rectangular background and place in it a bar and a circular slider, and position them relatively.
All their components are sprites, and it extends the MovieClip class
This way we can add to the stage our slidebar as a movieclip, and control its contents(bar, slider) using the getters/setters functions.

class SlideBarContainer extends MovieClip
    private var _track:Sprite;
    private var _slider:Sprite;
    private var _bar:Sprite;
    public function SlideBarContainer()
        _track = new Sprite;
        _slider = new Sprite();
        _bar = new Sprite();
        // Track background, 0.4);, 0x666666);, 0, 300, 34);;
        // Bar;,0x999999);, 0, 280, 8, 5);;
        _bar.x = (_track.width - _bar.width)/2;
        _bar.y = (_track.height - _bar.height)/2;
        // Slider;,0x959595);, 0, 8);;
        _slider.x = _bar.x + _slider.width/2;
        _slider.y = _track.height/2;
        _slider.buttonMode = true;

- Second class is RightPnaeContainer:
This class represents the right gray rectangle, it simply creates the background (_pane) and place in it two sprites: Triangle as 'Play' symbol, and a square as 'Stop' symbol, and position them relativelly.
these sprites are often controlled from outside by the gettres/setters.

class RightPaneContainer extends MovieClip
    private var _pane:Sprite;
    private var _rectangle:Sprite;
    private var _triangle:Sprite;
    public function RightPaneContainer()
        _pane = new Sprite();
        _rectangle = new Sprite();
        _triangle = new Sprite();
        // Main Pane;,0x959595);, 0, 70, 34, 10);
        //, 0, 70, 34);;
        // Stop Rectangle;,0x959595);, 0, 16, 16);;
        _rectangle.x = (_pane.width - _rectangle.width)/2;
        _rectangle.y = (_pane.height - _rectangle.height)/2;
        // Play Triangle;, 16);,8);, 0);
        _triangle.x = (_pane.width - _triangle.width)/2;
        _triangle.y = (_pane.height - _triangle.height)/2;