Custom preloader based on idea and code from Pathfinder Development
authorAndy Allan <gravitystorm@gmail.com>
Fri, 14 Jan 2011 14:39:50 +0000 (14:39 +0000)
committerAndy Allan <gravitystorm@gmail.com>
Fri, 14 Jan 2011 14:39:50 +0000 (14:39 +0000)
embedded/potlatch2logo.png [new file with mode: 0644]
net/systemeD/potlatch2/Preloader.as [new file with mode: 0644]
net/systemeD/potlatch2/PreloaderDisplayBase.as [new file with mode: 0644]
potlatch2.mxml

diff --git a/embedded/potlatch2logo.png b/embedded/potlatch2logo.png
new file mode 100644 (file)
index 0000000..a217d64
Binary files /dev/null and b/embedded/potlatch2logo.png differ
diff --git a/net/systemeD/potlatch2/Preloader.as b/net/systemeD/potlatch2/Preloader.as
new file mode 100644 (file)
index 0000000..1014c0a
--- /dev/null
@@ -0,0 +1,112 @@
+package net.systemeD.potlatch2 {
+    import flash.display.DisplayObject;
+    import flash.display.GradientType;
+    import flash.display.Sprite;
+    import flash.filters.DropShadowFilter;
+    import flash.geom.Matrix;
+    import flash.text.TextField;
+    import flash.text.TextFormat;
+
+
+    public class Preloader extends net.systemeD.potlatch2.PreloaderDisplayBase {
+
+       [Embed("../../../embedded/potlatch2logo.png") ]
+        [Bindable] public var Logo:Class;
+
+        private var t:TextField;
+        private var f:DropShadowFilter=new DropShadowFilter(2,45,0x000000,0.5)
+        private var p2Logo:DisplayObject;
+        private var bar:Sprite=new Sprite();
+        private var barFrame:Sprite;
+        private var mainColor:uint=0x045966;
+
+        public function Preloader()
+        {
+            super();
+        }
+
+        // This is called when the preloader has been created as a child on the stage.
+        //  Put all real initialization here.
+        override public function initialize():void
+        {
+            super.initialize();
+
+            clear();  // clear here, rather than in draw(), to speed up the drawing
+
+            var indent:int = 20;
+            var height:int = 20;
+
+            //creates all visual elements
+            createAssets();
+        }
+        //this is our "animation" bit
+        override protected function draw():void
+        {
+            t.text = int(_fractionLoaded*100).toString()+"%";
+            //make objects below follow loading progress
+            //positions are completely arbitrary
+            //d tells us the x value of where the loading bar is at
+            var d:Number=barFrame.x + barFrame.width * _fractionLoaded
+            t.x = d - t.width - 25;
+            bar.graphics.beginFill(0xffffff,1)
+            bar.graphics.drawRoundRectComplex(0,0,bar.width * _fractionLoaded,15,12,0,0,12);
+            bar.graphics.endFill();
+        }
+
+        protected function createAssets():void
+        {
+            //create the logo
+            p2Logo = new Logo();
+            p2Logo.y = stageHeight/2 - p2Logo.height/2;
+            p2Logo.x = stageWidth/2 - p2Logo.width/2;
+            //p2Logo.filters = [f];
+            addChild(p2Logo);
+
+            //create bar
+            bar = new Sprite();
+             bar.graphics.drawRoundRectComplex(0,0,400,15,12,0,0,12);
+            bar.x = stageWidth/2 - bar.width/2;
+            bar.y = stageHeight/1.2 - bar.height/2;
+            bar.filters = [f];
+            addChild(bar);
+
+            //create bar frame
+            barFrame = new Sprite();
+            barFrame.graphics.lineStyle(2,0xFFFFFF,1)
+            barFrame.graphics.drawRoundRectComplex(0,0,400,15,12,0,0,12);
+            barFrame.graphics.endFill();
+            barFrame.x = stageWidth/2 - barFrame.width/2;
+            barFrame.y = stageHeight/1.2 - barFrame.height/2;
+            barFrame.filters = [f];
+            addChild(barFrame);
+
+            //create text field to show percentage of loading
+            t = new TextField()
+            t.y = barFrame.y-27;
+            t.filters=[f];
+            addChild(t);
+            //we can format our text
+            var s:TextFormat=new TextFormat("Verdana",null,0xFFFFFF,null,null,null,null,null,"right");
+            t.defaultTextFormat=s;
+        }
+
+        protected function clear():void
+        {
+            // Draw gradient background
+            var b:Sprite = new Sprite;
+             var matrix:Matrix =  new Matrix();
+            matrix.createGradientBox(stageWidth, stageHeight, Math.PI/2);
+            b.graphics.beginGradientFill(GradientType.LINEAR,
+                                        [mainColor, mainColor],
+                                        [1,1],
+                                        [0,255],
+                                        matrix
+                                        );
+            b.graphics.drawRect(0, 0, stageWidth, stageHeight);
+            b.graphics.endFill();
+            addChild(b);
+        }
+    }
+
+}
+
diff --git a/net/systemeD/potlatch2/PreloaderDisplayBase.as b/net/systemeD/potlatch2/PreloaderDisplayBase.as
new file mode 100644 (file)
index 0000000..c8c0e80
--- /dev/null
@@ -0,0 +1,137 @@
+package net.systemeD.potlatch2
+{
+    // As seen at: http://www.pathf.com/blogs/2008/08/custom-flex-3-lightweight-preloader-with-source-code/
+    // Can be "resued without restriction", so say the original authors
+
+    import flash.display.Sprite;
+    import flash.events.Event;
+    import flash.events.ProgressEvent;
+    import flash.events.TimerEvent;
+    import flash.utils.Timer;
+
+    import mx.events.FlexEvent;
+    import mx.preloaders.IPreloaderDisplay;
+
+    public class PreloaderDisplayBase extends Sprite implements IPreloaderDisplay
+    {
+        // Implementation variables, used to make everything work properly
+        protected var _IsInitComplete:Boolean = false;
+        protected var _timer:Timer;                 // we have a timer for animation
+        protected var _bytesLoaded:uint = 0;
+        protected var _bytesExpected:uint = 1;      // we start at 1 to avoid division by zero errors.
+        protected var _fractionLoaded:Number = 0;   // 0-1
+
+        public function PreloaderDisplayBase()
+        {
+            super();
+        }
+
+        // This function is called whenever the state of the preloader changes.  Use the _fractionLoaded variable to draw your progress bar.
+        virtual protected function draw():void
+        {
+        }
+
+        ////
+        //// IPreloaderDisplay interface elements
+        ////   check out the docs on IPreloaderDisplay to see more details.
+
+        // This function is called when the PreloaderDisplayBase has been created and is ready for action.
+        virtual public function initialize():void
+        {
+            _timer = new Timer(1);
+            _timer.addEventListener(TimerEvent.TIMER, timerHandler);
+            _timer.start();
+        }
+
+
+        protected var _preloader:Sprite;
+        /**
+         *  The Preloader class passes in a reference to itself to the display class
+         *  so that it can listen for events from the preloader.
+         */
+         // This code comes from DownloadProgressBar.  I have modified it to remove some unused event handlers.
+        virtual public function set preloader(value:Sprite):void
+        {
+            _preloader = value;
+
+            value.addEventListener(ProgressEvent.PROGRESS, progressHandler);
+            value.addEventListener(Event.COMPLETE, completeHandler);
+
+        //    value.addEventListener(RSLEvent.RSL_PROGRESS, rslProgressHandler);
+        //    value.addEventListener(RSLEvent.RSL_COMPLETE, rslCompleteHandler);
+        //    value.addEventListener(RSLEvent.RSL_ERROR, rslErrorHandler);
+
+            value.addEventListener(FlexEvent.INIT_PROGRESS, initProgressHandler);
+            value.addEventListener(FlexEvent.INIT_COMPLETE, initCompleteHandler);
+        }
+
+        virtual public function set backgroundAlpha(alpha:Number):void{}
+        virtual public function get backgroundAlpha():Number { return 1; }
+
+        protected var _backgroundColor:uint = 0xffffffff;
+        virtual public function set backgroundColor(color:uint):void { _backgroundColor = color; }
+        virtual public function get backgroundColor():uint { return _backgroundColor; }
+
+        virtual public function set backgroundImage(image:Object):void {}
+        virtual public function get backgroundImage():Object { return null; }
+
+        virtual public function set backgroundSize(size:String):void {}
+        virtual public function get backgroundSize():String { return "auto"; }
+
+        protected var _stageHeight:Number = 300;
+        virtual public function set stageHeight(height:Number):void { _stageHeight = height; }
+        virtual public function get stageHeight():Number { return _stageHeight; }
+
+        protected var _stageWidth:Number = 400;
+        virtual public function set stageWidth(width:Number):void { _stageWidth = width; }
+        virtual public function get stageWidth():Number { return _stageWidth; }
+
+        //--------------------------------------------------------------------------
+        //
+        //  Event handlers
+        //
+        //--------------------------------------------------------------------------
+
+        // Called from time to time as the download progresses.
+        virtual protected function progressHandler(event:ProgressEvent):void
+        {
+            _bytesLoaded = event.bytesLoaded;
+            _bytesExpected = event.bytesTotal;
+            _fractionLoaded = Number(_bytesLoaded) / Number(_bytesExpected);
+
+            draw();
+        }
+
+        // Called when the download is complete, but initialization might not be done yet.  (I *think*)
+        // Note that there are two phases- download, and init
+        virtual protected function completeHandler(event:Event):void
+        {
+        }
+
+
+        // Called from time to time as the initialization continues.
+        virtual protected function initProgressHandler(event:Event):void
+        {
+            draw();
+        }
+
+        // Called when both download and initialization are complete
+        virtual protected function initCompleteHandler(event:Event):void
+        {
+            _IsInitComplete = true;
+        }
+
+        // Called as often as possible
+        virtual protected function timerHandler(event:Event):void
+        {
+            if (_IsInitComplete)
+            {
+                // We're done!
+                _timer.stop();
+                dispatchEvent(new Event(Event.COMPLETE));
+            }
+            else
+                draw();
+        }
+    }
+}
\ No newline at end of file
index 010c228..0867a88 100644 (file)
@@ -7,7 +7,8 @@
        horizontalScrollPolicy="off"
        verticalScrollPolicy="off"
        horizontalAlign="center" 
-       addedToStage="initApp()">
+       addedToStage="initApp()"
+       preloader="net.systemeD.potlatch2.Preloader">
        
        <mx:Style source="styles/Application.css"/>