Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>Using an .SWF to package your files isn't ideal for many reason, but i hadn't thought about the security aspect. Although of course - if its on the net, its not secure...</p> <p>I whipped up a little demo for you this morning that can be found here: </p> <p>demo: <a href="http://www.digital.leskiwis.com/sirwin/" rel="nofollow noreferrer">http://www.digital.leskiwis.com/sirwin/</a></p> <p>download: <a href="http://www.digital.leskiwis.com/sirwin/sirwin.zip" rel="nofollow noreferrer">http://www.digital.leskiwis.com/sirwin/sirwin.zip</a></p> <p>Let me explain a few features:</p> <ul> <li>it makes use of hydrotik's queueLoader class. It makes loading and monitoring a breeze</li> <li>all assets are in compiled SWF's. One of the great features of the queue loading is drawing a SWF's frames as bitmap data (great for getting that smoothing down)</li> <li>it uses a resizing event to make sure the image is resized to scale </li> <li>All of the images in the swf are 720p sized (1024 x 720) so you get a good idea of how a big image scales smaller (and bigger on a 24 - 27 inch screen)</li> </ul> <p>Resize listeners:</p> <pre><code> stage.scaleMode = StageScaleMode.NO_SCALE; // the standard top left align, add some no scaling and throw in the event listener stage.align = StageAlign.TOP_LEFT; stage.addEventListener(Event.RESIZE, resizePhoto, false, 0, true); </code></pre> <p>Resize function: (we store the photoWidth and photoHeight variables once when the image is loaded so we dont have to check every frame)</p> <pre><code> function resizePhoto(e:Event){ var targetWidth = stage.stageWidth - buffer - photo.x // this gives us the target width we want the photo. we can figure out what percent the image would need to be to make this, and use that as a scale mutiplication.. var targetHeight = stage.stageHeight - buffer - photo.y // this gives us the target height we want the photo. we can figure out what percent the image would need to be to make this, and use that as a scale mutiplication.. //note: add in some smart sizing on this - this means the photo resize stops when it hits a height or width limit.. var wMult:Number = (targetWidth / photoWidth) var hMult:Number = (targetHeight / photoHeight) if(wMult &lt; hMult){ photo.width = photoWidth * wMult photo.height = photoHeight * wMult }else{ photo.width = photoWidth * hMult photo.height = photoHeight * hMult } } </code></pre> <p>While some of this is far from best practice, it has enough improvements for you to work with - while keeping some you in a comfort zone based on the code i saw in your files. If you need any clarification just yell. Here is the full code - you can download everything here: <a href="http://www.digital.leskiwis.com/sirwin/sirwin.zip" rel="nofollow noreferrer">http://www.digital.leskiwis.com/sirwin/sirwin.zip</a></p> <p>Enjoy!</p> <pre><code>package{ import flash.ui.*; import flash.display.*; import flash.events.*; import flash.text.*; import flash.geom.*; import flash.net.*; import flash.utils.*; import flash.media.* import fl.controls.Button; import com.hydrotik.queueloader.QueueLoader; import com.hydrotik.queueloader.QueueLoaderEvent; import com.hydrotik.queueloader.QLManager; public class Sirwin extends MovieClip { var sec_PERSONAL:Array = ['Animals', 'Macro']; // all of the topic sections... Note, the swf files need to match these names! var sec_LENGTH:uint = 0; // the length of the loaded array var sec_CUR:uint = 0; // the length of the loaded array var bmp_ARRAY:Array = []; // the container for the loaded section var buffer:uint = 10; // buffer in pixels for button placement var _oLoader:QueueLoader = new QueueLoader(); var photo:Sprite = new Sprite(); // holder for the photo to load into var nextBut:Button = new Button(); // attach the next button from the library var prevBut:Button = new Button(); // attach the prev button from the library var photoWidth:Number // we store these as variables to improve performance, check once - not each time var photoHeight:Number // we store these as variables to improve performance, check once - not each time public function Sirwin(){ trace("initialising Document..."); addEventListener(Event.ADDED_TO_STAGE, popStageVars); // once the movie has been added to the stage, we can set up some more vars } private function popStageVars(e:Event){ trace("popping stage vars...") removeEventListener(Event.ADDED_TO_STAGE, popStageVars); stage.scaleMode = StageScaleMode.NO_SCALE; // the standard top left align, add some no scaling and throw in the event listener stage.align = StageAlign.TOP_LEFT; stage.addEventListener(Event.RESIZE, resizePhoto, false, 0, true); _oLoader.addEventListener(QueueLoaderEvent.ITEM_COMPLETE, onItemComplete,false, 0, true); _oLoader.addEventListener(QueueLoaderEvent.ITEM_PROGRESS, onQueueProgress, false, 0, true); _oLoader.addEventListener(QueueLoaderEvent.QUEUE_COMPLETE, onQueueComplete,false, 0, true); photo.x = 180 photo.y = buffer addChild(photo) setSections(); setNav(); toggleNav(); } function resizePhoto(e:Event){ // set photo dimensions to match stage; photo.width = stage.stageWidth - buffer; photo.height = stage.stageHeight - buffer; // choose the larger scale property and match the other to it; ( photo.scaleX &lt; photo.scaleY ) ? photo.scaleY = photo.scaleX : photo.scaleX = photo.scaleY; } public function setSections(){ // this function places the section buttons on the stage... not so neccesary if you make your own buttons for(var i:uint = 0; i &lt; sec_PERSONAL.length; i++){ var but:Button = new Button(); // attach the button from the library but.label = sec_PERSONAL[i] // give the button a label from the array of names but.x = buffer but.y = buffer*5 + (i * (buffer + but.height)); but.addEventListener(MouseEvent.CLICK, loadSection, false, 0, true); // weak handler for better garbage collection addChild(but) } } public function setNav(){ // this function places the nav buttons on the stage... better practice would be having their own class and dispatching mouse events to be listened for. Baby steps.. nextBut.label = "Next &gt;" nextBut.x = buffer nextBut.y = 350 nextBut.addEventListener(MouseEvent.CLICK, navForward, false, 0, true); addChild(nextBut) prevBut.label = "Previous &lt;" prevBut.x = buffer prevBut.y = 400 prevBut.addEventListener(MouseEvent.CLICK, navBack, false, 0, true); addChild(prevBut) } public function loadSection(e:MouseEvent){ bmp_ARRAY = []; // reset the array to nothing var swf:String = convertFolderName(e.target.label, '_') + ".swf"; _oLoader.addItem("assets/"+swf, null, {title:"SWF Images", drawFrames:true}); _oLoader.execute(); } public function loadPhoto(){ while(photo.numChildren){ photo.removeChildAt(0); // get rid of any existing photo } var bmp:Bitmap = new Bitmap(bmp_ARRAY[sec_CUR]); // this gets the bitmap data from the array that has been loaded from the zip file bmp.smoothing = true; // this should solve your smoothing issues photo.addChild(bmp); photoWidth = photo.width; // update the photos height and width for easy ref photoHeight = photo.height; resizePhoto(null); // pass through a null event to avoid any compiler errors } public function convertFolderName(s:String, replacement:String):String{ // this function returns an underscore instead of a space var trimmedValue:String = s.replace(" ", replacement) return trimmedValue; } public function updateCur(n:Number){ sec_CUR += n; // add a +1, or -1 to the current pointer displaying.text = "Displaying: " + (sec_CUR + 1) + "/" + sec_LENGTH; // this updates the 'number of/how many' text. you need plus one to adjust for arrays starting at 0 } public function navForward(e:MouseEvent){ updateCur(1) toggleNav(); loadPhoto(); } public function navBack(e:MouseEvent){ updateCur(-1) toggleNav(); loadPhoto() } public function toggleNav():void{ //this function decides if the next or back should be shown trace(sec_CUR + " - " + sec_LENGTH) nextBut.visible = (sec_CUR &gt;= sec_LENGTH-1) ? false : true prevBut.visible = (sec_CUR &lt;= 0) ? false : true if(sec_CUR &lt; 0){ sec_CUR = 0; } if(sec_CUR &gt;= sec_LENGTH-1){ sec_CUR = sec_LENGTH-1; } } // ----------------------------------------------------- queue loading event handlers public function onQueueProgress(event:QueueLoaderEvent):void { // cheap preloading... trace("\t&gt;&gt;onQueueProgress: "+event.queuepercentage); displaying.text = "Loading: " + event.queuepercentage + "%"; } public function onItemComplete(event:QueueLoaderEvent):void { trace("\t&gt;&gt; "+event.type, "item title: "+event.title + " type: " + event.fileType); if (event.title == "SWF Images") { bmp_ARRAY = []; for (var i:int = 0; i&lt;event.bmArray.length; i++) { var bm:BitmapData = event.bmArray[i] bmp_ARRAY.push(bm) } } } public function onQueueComplete(event:QueueLoaderEvent):void { trace("** "+event.type); sec_LENGTH = bmp_ARRAY.length sec_CUR = 0; updateCur(0) toggleNav(); loadPhoto(); } } } </code></pre>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload