Category ArchiveAction Script



Action Script 21 Jul 2006 08:44 am

Slide Show Class for Dynamic Image Gallery updated

May be you already read my post about Slide Show Class for Dyanmic Image Gallery.
Now the class is update which are now has horizontal and vertical slide fx available.

PLAIN TEXT
Actionscript:
  1. //
  2. //  Slide Show Tween Class V2
  3. //
  4. class janumedia.fx.tween {
  5.    
  6.     private var mc:MovieClip; // target mc
  7.     private var mask1:MovieClip; // mask1
  8.     private var mask2:MovieClip; // mask2
  9.     private var img1:MovieClip; // mc1
  10.     private var img2:MovieClip; // mc2
  11.     private var border:MovieClip; // border mc
  12.     private var width:Number; // width
  13.     private var height:Number // height
  14.     private var orientation:String; // slide orientation
  15.     private var data:Array; // image gallery
  16.     private var speed:Number; // tween speed interval
  17.     private var cur:Number; // current play
  18.     private var tw:Boolean; // tween status
  19.     private var intervalID;
  20.    
  21.     function tween(t:MovieClip,d:Array,s:Number,o,w:Number,h:Number){
  22.         // t = movieclip target ; d = image list in array ; s = swening speed interval in sec ;
  23.         // o = orientation --> available : "alpha" => alpha, "x" => horizontal, "y" => vertical
  24.         // w = witdh , h = height
  25.         mc          = t.createEmptyMovieClip("mainSlide",t.getNextHighestDepth());;
  26.         data        = d;
  27.         speed       = s;
  28.         cur         = 0;
  29.         tw      = false;
  30.         width      = w;
  31.         height    = h;
  32.         orientation = o == undefined ? "alpha" : o;
  33.         prepared();
  34.     }
  35.     private function prepared(){
  36.         img1 = mc.createEmptyMovieClip("img1",10);
  37.         img2 = mc.createEmptyMovieClip("img2",9);
  38.         img1.createTextField("status",10,200,125,10,10);
  39.         img2.createTextField("status",10,200,125,10,10);
  40.        
  41.         // set masking if the value is available
  42.         if(width != undefined and height != undefined) addMask(mc,0,0,width,height);
  43.        
  44.         if(data.length>= 1){
  45.             var theImg = nextImage();
  46.             if(theImg != "" && theImg != undefined ){
  47.                 deleteNoImage(img1);
  48.                 loadImage(img1,theImg);
  49.             } else {
  50.                 noImage(img1);
  51.             }
  52.         }
  53.        
  54.         if(data.length>= 2){
  55.             var theImg = nextImage();
  56.             if(theImg != "" && theImg != undefined ){
  57.                 deleteNoImage(img2);
  58.                 loadImage(img2,theImg);
  59.             } else {
  60.                 noImage(img2);
  61.             }
  62.         }
  63.        
  64.     }
  65.     private function beginTween(n:MovieClip){
  66.         clearInterval(intervalID);
  67.         //trace("begin tween "+n);
  68.        
  69.         switch(n){
  70.             case img1 :
  71.                 img2.owner = this;
  72.                 img2.onEnterFrame = function(){ this.owner.doSlide(this); }
  73.                 break
  74.             case img2 :
  75.                 img1.owner = this;
  76.                 img1.onEnterFrame = function(){ this.owner.doSlide(this); }
  77.                 break;
  78.         }
  79.     }
  80.    
  81.     private function doSlide(t:MovieClip){
  82.        
  83.         switch(orientation){
  84.             case "alpha":
  85.                 //trace("tween for "+t._name);
  86.                 t._x = 0;
  87.                 t._y = 0;
  88.                 t._alpha -= speed;
  89.                 var otherImg = eval( t._name == "img1" ? img2 : img1 );
  90.                 with(otherImg){
  91.                     _x = 0;
  92.                     _y = 0;
  93.                 }
  94.                 if(t._alpha <= 0) {
  95.                     t.swapDepths(9);
  96.                     otherImg.swapDepths(10);
  97.                     delete t.onEnterFame;
  98.                     var theImg = nextImage();
  99.                     if(theImg != "" && theImg != undefined ){
  100.                         deleteNoImage(t);
  101.                         loadImage(t,theImg);
  102.                     } else {
  103.                         noImage(t);
  104.                     }
  105.                 }
  106.                 break;
  107.             case "x":
  108.                 t._y = 0;
  109.                 t._x -= speed;
  110.                 t._alpha = 100;
  111.                 var otherImg = eval( t._name == "img1" ? img2 : img1 );
  112.                 with(otherImg){
  113.                     _x = t._x + t._width;
  114.                     _y = 0;
  115.                     _alpha = 100;
  116.                 }
  117.                 if(t._x <= - t._width ) {
  118.                     delete t.onEnterFame;
  119.                     var theImg = nextImage();
  120.                     if(theImg != "" && theImg != undefined ){
  121.                         deleteNoImage(t);
  122.                         loadImage(t,theImg);
  123.                     } else {
  124.                         noImage(t);
  125.                     }
  126.                 }
  127.                 break;
  128.             case "y":
  129.                 t._x = 0;
  130.                 t._y -= speed;
  131.                 t._alpha = 100;
  132.                 var otherImg = eval( t._name == "img1" ? img2 : img1 );
  133.                 with(otherImg){
  134.                     _x = 0;
  135.                     _y = t._y + t._height;
  136.                     _alpha = 100;
  137.                 }
  138.                
  139.                 if(t._y <=  - t._height ) {
  140.                     delete t.onEnterFame;
  141.                     var theImg = nextImage();
  142.                     if(theImg != "" && theImg != undefined ){
  143.                         deleteNoImage(t);
  144.                         loadImage(t,theImg);
  145.                     } else {
  146.                         noImage(t);
  147.                     }
  148.                 }
  149.                 break;
  150.         }
  151.     }
  152.    
  153.     private function nextImage():String{
  154.         var n = cur;
  155.         cur++;
  156.         cur = cur>= data.length ? 0 : cur;
  157.         //trace("cur : "+cur+" : "+data[n]);
  158.         return data[n];
  159.     }
  160.    
  161.     private function loadImage(t:MovieClip,img){
  162.         //trace("load : "+img+" to : "+t);
  163.        
  164.         t._parent.status.autoSize = "center";
  165.         t._parent.status.embedFonts = true;
  166.         var fmt:TextFormat = new TextFormat();
  167.         fmt.font = "Arial"
  168.         t._parent.status.setTextFormat(fmt);
  169.        
  170.         var my_mcl = new MovieClipLoader();
  171.         var myListener = new Object(); 
  172.         myListener.owner = this;
  173.         myListener.onLoadComplete = function (tmc:MovieClip, bytesLoaded:Number, bytesTotal:Number) {
  174.             tmc._alpha = 100;
  175.             if(this.owner.tw) this.owner.intervalID = setInterval(this.owner,"beginTween",speed * 1000,tmc);
  176.             this.owner.tw = true;
  177.         }
  178.         myListener.onLoadProgress = function(tmc:MovieClip, bytesLoaded:Number, bytesTotal:Number) {
  179.             var a = Math.round((bytesLoaded/bytesTotal)*100);
  180.             t._parent.status.text = a+"%";
  181.             //trace("load progress ");
  182.         }
  183.         my_mcl.addListener(myListener);
  184.         my_mcl.loadClip(img, t);
  185.     }
  186.    
  187.     private function deleteNoImage(t:MovieClip){
  188.         removeMovieClip(t.noimage);
  189.     }
  190.    
  191.     private function noImage(t:MovieClip){
  192.         // trace("no image");
  193.         var x = 0;
  194.         var y = 0;
  195.         var w = 399;
  196.         var h = 250;
  197.         t.createEmptyMovieClip("noimage", 123456);
  198.         var mc = t.noimage;
  199.         with(mc){
  200.             beginFill(0xFFFFFF);
  201.             lineStyle(0, 0xC9C9C9);
  202.             moveTo(x, y);
  203.             lineTo(w, y);
  204.             lineTo(w, h);
  205.             lineTo(x, h);
  206.             lineTo(x, y);
  207.             endFill();
  208.         }
  209.         mc.createTextField("status",10,mc._width/2,(mc._height/2)-14,10,10);
  210.         with(mc.status){
  211.             autoSize    = "center";
  212.             text        = "no image";
  213.             embedFonts  = true;
  214.             selectable  = false;
  215.             textColor   = 0xC9C9C9;
  216.         }
  217.  
  218.         var fmt:TextFormat = new TextFormat();
  219.         with(fmt){
  220.             font        = "Arial"; 
  221.             size        = 14;
  222.         }
  223.         mc.status.setTextFormat(fmt);
  224.     }
  225.    
  226.     private function addMask(t:MovieClip,x,y,w:Number,h:Number){
  227.  
  228.         var mask = t.createEmptyMovieClip("mask_mc", t.getNextHighestDepth());
  229.         with(mask){
  230.             beginFill(0xFF0000);
  231.             moveTo(x, y);
  232.             lineTo(w, y);
  233.             lineTo(w, h);
  234.             lineTo(x, h);
  235.             lineTo(x, y);
  236.             endFill();
  237.         }
  238.         t.setMask(mask);
  239.     }
  240.    
  241.     public function move(x:Number,y:Number):Void{
  242.         mc._x = x;
  243.         mc._y = y;
  244.     }
  245.    
  246.     public function set mode(t:String){
  247.         orientation = t;
  248.     }
  249.    
  250.     public function drawBorder(s:Number,w:Number,h:Number,c):Void{
  251.         border = mc.createEmptyMovieClip("border_mc", mc.getNextHighestDepth());
  252.         with(border){
  253.             lineStyle(s,c);
  254.             moveTo(0, 0);
  255.             lineTo(w, 0);
  256.             lineTo(w, h);
  257.             lineTo(0, h);
  258.             lineTo(0, 0);
  259.         }
  260.     }
  261.    
  262.     public function clearBorder(s:Number,w:Number,h:Number,c):Void{
  263.         border.clear();
  264.     }
  265. }

How to use it? Simple is much the same as the old version all you need to add is the fx / orientation, also add masking if you want it.

PLAIN TEXT
Actionscript:
  1. // sample 1 vertical slide show
  2. var slideShow = new janumedia.fx.tween(this,["image1.jpg","image2.jpg"],1,"y",320,250);

PLAIN TEXT
Actionscript:
  1. // sample 2 horisonal slide show
  2. var slideShow = new janumedia.fx.tween(this,["image1.jpg","image2.jpg"],1,"x",320,250);

PLAIN TEXT
Actionscript:
  1. // sample 3 alpha fx slide show
  2. var slideShow = new janumedia.fx.tween(this,["image1.jpg","image2.jpg"],1,"alpha",320,250);

Online example and get source

Comments (12)

Action Script & Tutorials 01 Jun 2006 02:39 am

Slide Show Tween Class for dynamic Image Gallery

Last week I wrote this class for a flash site development. Since the data is dynamic then I must wrote the code for dynamic slide show gallery also and here the class that i wrote:

PLAIN TEXT
Actionscript:
  1. // slide show tween class
  2. class janumedia.fx.tween {
  3.    
  4.     private var mc:MovieClip; // target mc
  5.     private var img1:MovieClip; // mc1
  6.     private var img2:MovieClip; // mc2
  7.     private var data:Array; // image gallery
  8.     private var speed:Number; // tween speed interval
  9.     private var cur:Number; // current play
  10.     private var tw:Boolean; // tween status
  11.     private var intervalID;
  12.    
  13.     function tween(t:MovieClip,d:Array,s:Number){ // t = movieclip target ; d = image list in array ; s = swening speed interval
  14.         mc  = t;
  15.         data    = d;
  16.         speed   = s;
  17.         cur = 0;
  18.         tw            = false;
  19.         prepared();
  20.     }
  21.     private function prepared(){
  22.         mc.createEmptyMovieClip("img1",10);
  23.         mc.createEmptyMovieClip("img2",9);
  24.         img1 = mc.img1;
  25.         img2 = mc.img2;
  26.  
  27.         loadImage(img1,nextImage());
  28.         loadImage(img2,nextImage());
  29.        
  30.     }
  31.     private function beginTween(n:MovieClip){
  32.         clearInterval(intervalID);
  33.         //trace("begin tween "+n);
  34.                                 n.owner = this; 
  35.         switch(n){
  36.             case img1 :
  37.                 //trace("img1");
  38.                 img2.onEnterFrame = function(){
  39.                     this._alpha -= self.speed;
  40.                     //trace(this._alpha);
  41.                     if(this._alpha <= 0) {
  42.                         this.swapDepths(9);
  43.                         this.owner.swapDepths(10);
  44.                         delete this.onEnterFame;
  45.                         this.owner.loadImage(this,this.owner.nextImage());
  46.                     }
  47.                 }
  48.                 break
  49.             case img2 :
  50.                 //trace("img2");
  51.                 img1.onEnterFrame = function(){
  52.                     this._alpha -= self.speed;
  53.                     if(this._alpha <= 0) {
  54.                         this.swapDepths(9);
  55.                         this.owner.img2.swapDepths(10);
  56.                         delete this.onEnterFame;
  57.                         this..owner.loadImage(this,this.owner.nextImage());
  58.                     }
  59.                 }
  60.                 break;
  61.         }
  62.     }
  63.     private function nextImage():String{
  64.         var n = cur;
  65.         cur++;
  66.         cur = cur>= data.length ? 0 : cur;
  67.         //trace("cur : "+cur+" : "+data[n]);
  68.         return data[n];
  69.     }
  70.     private function loadImage(t:MovieClip,img){
  71.         //trace("load : "+img+" to : "+t);
  72.         var self = this;
  73.         var my_mcl = new MovieClipLoader();
  74.         var myListener = new Object();
  75.         myListener.onLoadComplete = function (tmc:MovieClip, bytesLoaded:Number, bytesTotal:Number) {
  76.             tmc._alpha = 100;
  77.             if(self.tw) self.intervalID = setInterval(self,"beginTween",2000,tmc);
  78.             self.tw = true;
  79.         }
  80.         myListener.onLoadProgress = function(tmc:MovieClip, bytesLoaded:Number, bytesTotal:Number) {
  81.             var a = Math.round((bytesLoaded/bytesTotal)*100);
  82.             trace("load progress "+a);
  83.         }
  84.         my_mcl.addListener(myListener);
  85.         my_mcl.loadClip(img, t);
  86.     }
  87. }

To use is is very simple. Make sure you copy this code and save as tween.as in folder janumedia/fx.
Then ready to use with this code:

PLAIN TEXT
Actionscript:
  1. var myGallery = new Array("image1.jpg","image2.jpg","image2.jpg");
  2. var myslideshow = new janumedia.fx.tween(this, myGallery, 200);

The gallery list (array data) it self can be load dynamically using xml data

> Get the update version here

Comments (10)

Action Script & Tutorials 26 May 2006 03:23 am

MovieClip point 2 point mover class

This class is based on Colin Moock Follow Grid of Point script.
With this class you can generate movement of movieclip from an array that contain some coordinat points.

PLAIN TEXT
Actionscript:
  1. //
  2. // save it as moveToPoint.as in janumedia folder
  3. //
  4. class janumedia.moveToPoint {
  5.    
  6.     private var pathArray:Array;
  7.     private var mc:MovieClip;
  8.    
  9.     function moveToPoint(t:MovieClip,pathTo:Array,speed:Number){
  10.        
  11.         pathArray   = pathTo;
  12.         drawPath(t,pathArray);
  13.         mc      = t;
  14.         mc.count    = 0;
  15.         mc.oldT  = getTimer();
  16.         mc.speed    = speed;
  17.         mc.oriX  = mc._x;
  18.         mc.oriY  = mc._y;
  19.         mc.xPos  = pathTo[mc.count].x;
  20.         mc.yPos  = pathTo[mc.count].y;
  21.         mc.owner    = this;
  22.         mc.onEnterFrame = function(){
  23.             this.owner.doMove();
  24.         }
  25.        
  26.     }
  27.    
  28.     private function doMove(){
  29.         mc.curT = getTimer();
  30.         mc.elapsedSeconds = (mc.curT - mc.oldT) / 1000;
  31.         mc.oldT = mc.curT;
  32.         mc.moveDist = mc.speed * mc.elapsedSeconds;
  33.         // Determine distance between clip and destination
  34.         var deltaX = mc._x - mc.xPos;
  35.         var deltaY = mc._y - mc.yPos;
  36.         var dist = Math.sqrt((deltaX * deltaX) + (deltaY * deltaY));
  37.    
  38.         if (mc.moveDist>= dist) {
  39.             mc._x = mc.xPos;
  40.             mc._y = mc.yPos;
  41.             mc.count++;
  42.             if(mc.count <pathArray.length){
  43.                 mc.xPos  = pathArray[mc.count].x;
  44.                 mc.yPos  = pathArray[mc.count].y;
  45.             } else {
  46.                 delete mc.onEnterFrame;
  47.             }
  48.        
  49.         } else {
  50.             // Allocate speed between x and y axes
  51.             var moveX = mc.moveDist * (deltaX / dist);
  52.             var moveY = mc.moveDist * (deltaY / dist);
  53.             // Move follower towards the destination.
  54.             mc._x -= moveX;
  55.             mc._y -= moveY;
  56.         }
  57.     }
  58.    
  59.     private function drawPath(t:MovieClip,data:Array){
  60.         var path = t._parent.createEmptyMovieClip("mcpath",t._parent.getNextHighestDepth(),{_x:0,_y:0});
  61.         with(path){
  62.             clear();
  63.             lineStyle(0, 0x000000, 50);
  64.             moveTo(t._x, t._y);
  65.         }
  66.         for(var i=0 ; i<data.length ; i++){
  67.             path.lineTo(data[i].x, data[i].y);
  68.         }
  69.     }
  70. }

Don't forget to download the sample here

No Comments Yet

Action Script & Tutorials 19 May 2006 06:57 am

The Sources beeing shared

Inspired by Herdiansah, I would like to shared also some of my code which are most of them are already published in any Flash Community.
Since this is still relatively new hosting then still just a few sources there but will increase soon :) . C'moon get it here. Use it but don't abused it.

Comments (6)

Action Script 04 Jan 2006 05:21 am

ActionScript 2.0 Language Reference

Download the Standalone HTML ActionScript 2.0 Language Reference from the Flash Docs Page.
Download the zipped equivalent PDF version or visit the online LiveDocs.

via Brajeshwar

No Comments Yet

Action Script & Tutorials 21 Dec 2005 04:31 pm

Watch out! z-index limit until 1048575

If you ever using createEmptyMovieClip class or createTextField, or may be attachMovie or any class that you should set / input z-index / depth of that movieClip or textField.

PLAIN TEXT
Actionscript:
  1. // createEmptyMovieClip method
  2. my_mc.createEmptyMovieClip(instanceName:String, depth:Number) : MovieClip
  3. // createTextField method
  4. my_mc.createTextField(instanceName:String, depth:Number, x:Number, y:Number, width:Number, height:Number) : Void
  5. // attachMovie method
  6. my_mc.attachMovie(idName:String, newName:String, depth:Number [, initObject:Object]) : MovieClip

For just setting up the depth should be no problem if you're using getNextHighestDepth().
But beware if the depth already reach number higher than 1048575 you will failed when try to do removeMovieClip or removeTextField

Try this:

PLAIN TEXT
Actionscript:
  1. this.createTextField("my_text", this.getNextHighestDepth(), 100, 10, 10, 10);
  2. my_text.autoSize = true;
  3. my_text.text = "Blah...blah...blah...";

You will see the text "Blah...blah...blah..."
Then when you add removeTextField function (see the script below) you should see the text again.

PLAIN TEXT
Actionscript:
  1. this.createTextField("my_text", this.getNextHighestDepth(), 100, 10, 10, 10);
  2. my_text.autoSize = true;
  3. my_text.text = "Blah...blah...blah...";
  4. my_text.removeTextField(); //<---------- remove it

So far is okay let's say getNextHighestDepth value is equal or lower than 1048575. You still can remove the textField

PLAIN TEXT
Actionscript:
  1. this.createTextField("my_text", 1048575, 100, 10, 10, 10); //<-- simulate if getNextHighestDepth = 1048575
  2. my_text.autoSize = true;
  3. my_text.text = "Blah...blah...blah...";
  4. my_text.removeTextField();

Then watch what happend if the depth we set higher than 1048575, try 1048576 (just 1 point higher than 1048575)

PLAIN TEXT
Actionscript:
  1. this.createTextField("my_text", 1048576, 100, 10, 10, 10);
  2. my_text.autoSize = true;
  3. my_text.text = "Blah...blah...blah...";
  4. my_text.removeTextField();

As you see the text will stay, ""Blah...blah...blah...". This mean is failed when try to remove.

The conculsion for this case is z-index / depth of object still manageable when set lower or equal to 1048575.

Solutions
Because the problem with the z-index. Than the solutions should be fix if we set the z-index to lower.
If the object is already set the z-index higher than 10487575 then you can set it the depth lower before you called remove function. But this only available for MovieClip. Yes you can use swapDepths() for movieclip to reset the z-index lower before you call removeMovieClip() function.

PLAIN TEXT
Actionscript:
  1. if(mc.getDepth()> 10487575){
  2.          mc.swapDepths(123456);  // <---- reset to lower z-index number
  3. }
  4. mc..removeMovieClip();

And for textField problem I'm still not found any solutions because swapDepths() only work for MovieClip not TextField.
The best way is put the TextField in MovieClip so you can reset the z-index using swapDepths(). Or jusy make sure you not set z-index of the TextField higher than 10487575 :)

Comments (2)

Action Script & Action Script 3.0 18 Oct 2005 05:01 pm

Action Script 3.0 Reference

Get list upadate of Action Script 3.0 reference here

No Comments Yet

Action Script & Action Script 3.0 12 Oct 2005 01:27 pm

ActionScript 3.0 Syntax

While we wait the alpha version of Flash 8.5 which is from some infromation that I got, will be release by next week. Understanding about AS 3.0 syntax will help to developer.

via http://janumedia.blogsome.com

No Comments Yet

Action Script & Flash Media Server & Tutorials 27 Sep 2005 03:39 pm

Build Whiteboard in Difference Way Using BitmapObj, getPixel, or setPixel?

I have found this 3 interesting post and could be usefull to build different way of whiteboard:
-Sending a BitmapObject via Flashcom
-Export JPEG with Flash/PHP
-Sending a BitmapObject via FCS using getPixel & SetPixel

Comments (2)

Action Script & Flash Media Server 31 Aug 2005 01:12 pm

[FlashComm] Audio Component with Mic Permission

This post based on thread at flashcomguru.com forum.
The idea is how to set audio component to make mic disable while the other side still talk (mic in used).
I remark the audio component from communication component to make a simple sample. Also for simple room sample I'm using from simple application that include on FlashComm Package. Anyway about the component I recomended you to build your own component to make it better. The code you can read on my post on flashcomguru.com forum.
Here the zip file.

You can modified the code and make your own code. For example if you want there is an admin will control who's mic will available.

Comments (11)

— Next Page »