Tuesday 31 May 2011

Flash SlideShow Banner


Description:
XML driven banner which tweens from one image to another. The are many customisable features like size of the canvas,speed and image position.

Download:
http://www.fahimchowdhury.com/files/FlashSlideShowComponent_v1.zip

Structure:
All the assets can sit at any file structure because you provide the paths to all you assets. Once you have created you assets and put them into folder then you can begin setting up the gallery.


Setting up the HTML Page:
First thing you need to do is embed the flash object with the script below (there are better ways to embed flash but for this example we are going to use the standard embed code) , once you have copied the code into your HTML then we can edit it.

<object width="850" height="600">
<param name="movie" value="swf/Main.swf">
<param name="FlashVars" value="dataUrl=xml/&dataFileName=config.xml">
<param name="wmode" value="transparent">
<embed src="swf/
Main.swf" width="850" height="600" wmode="transparent" flashvars="dataUrl=xml/&dataFileName=config.xml">
</embed>
</object> 


Change the Width and Height of the Flash Area:
You need to change the width and height in two places. First in the 'object' tag there is properties for the width and height as shown below:

<object width="850" height="600"> 

change this to your desired width and height, remember that this is for the whole flash area not the main image.

Now you have to change it in the 'embed' tag as shown below:

<embed ...... width="850" height="600"...

Located the width and height and change it to your desired values. Thats it!

Provide the Flash (SWF) location:
Once you have placed the swf in your folder structure we now need to point the HTML page to it. The swf location will be relative to the HTML page NOT the swf. Like the width and height procedure we will change values in two places to provided the swf location. 

First in the 'object' tag locate the param 'movie' as shown below:

 <param name="movie" value="swf/GalleryComponent.swf"> 
Now change the value to your swf location.

The next place to change the path is the 'embed' tag, locate the 'src' as shown below:

<embed src="swf/GalleryComponent.swf".....

In the embed tag change the 'src' to your swf location. 

Providing the Flash with the Config XML Name and Location via FlashVars: 

Using the flashvars (flash variables) you can provide the flash gallery with the location of the config xml folder and the config xml file name.

In the 'object' tag locate the flashvars as shown below:

<param name="FlashVars" value="dataUrl=xml/&dataFileName=config.xml"> 

In the value you can see 'dataUrl=' which then proceeds with a folder name, in this case I have specified 'xml/' you have to change this to point to your xml folder, for example if my config xml was in 'gallery/xml' the my 'dataUrl' will look like this:
dataUrl=gallery/xml/
Note: always provide the trailing slash.
Now the flashvars has a second part which starts with '&' and this part is the file name.  

&dataFileName=config.xml

The example above states my xml file name is 'config', you will change this to point to the correct config file. In a situation where you have more than one config file than this will be handy.

In the 'embed tag locate flashvars:

flashvars="dataUrl=xml/&dataFileName=config.xml"

and do the same as the 'object tag.


NOTES
*When creating directories/folders use only lowercase characters for the file name.


Tuesday 24 May 2011

Illegal override of z in mx.core.BitmapAsset

When embedding images into a class you can often get the error below:


Exception fault: VerifyError: Error #1053: Illegal override of z in mx.core.BitmapAsset.


to avoid this error from re-occurring you simple have to check the version of the flash player that you are running. In my case I was running flash player 9 and complying to 10 so I just point the flash player path to flash player 10 and it worked.

Sunday 8 May 2011

Contact Form

Download link
http://fahimchowdhury.com/files/contactform.zip

Setting up HTML
In the header of the HTML add the following script:
<script type="text/javascript" src="scripts/main.js"></script>


Adding your Form
before you create your form items add this at the top then create your form items.
<form  id="contact_form"  method="post"> 


Form Items
ensure you use the following naming conventions when creating your form items:
name = mail_name
email = mail_email
subject = mail_subject
message = mail_message


also in each form item add the following onfocus function to clear the invalid background colour.
onfocus="onFieldFocus(this)"


Add Error Message
create a div  an other element and provide it with the following id:

<div id="formMessage"></div>

Add PHP Iframe
Add the following iframe to load the php script into:
<iframe name="php" id="php" src="" width="700" height="100"></iframe>



Configure Error Messages and Email Address
In the Javascript (main.js) edit the following fields to cater your own design and edit the email address. You can change the error colour,messages,email address and the PHP location.

var errorColor = "#FF0000";
var messageSent = "message sent";
var messageNotSent = "message could not be sent";
var fieldsEmpty = "please fill in all fields in red";
var messageEmail = "email address in not valid";
var email_to = "fahim@gmx.com";
var php_location = "scripts/mail.php";

Sunday 1 May 2011

Flash Gallery

Description:
create a customised flash gallery using one xml configuration file. The Gallery is lightweight as it is roughly 65kb in file size and it loads images in the background and stores them for faster view of each images instead of loading images very time you select one. 


Colour and the layout can be customised, the layout can either be a vertical or a horizontal layout with the thumbnails on either side of the main image. 


Download
http://fahimchowdhury.com/files/FlashGallery_v1.5.zip

Vertical Layout

Horizontal Layout



Structure:
All the assets can sit at any file structure because you provide the paths to all you assets. Once you have created you assets and put them into folder then you can begin setting up the gallery.


Setting up the HTML Page:
First thing you need to do is embed the flash object with the script below (there are better ways to embed flash but for this example we are going to use the standard embed code) , once you have copied the code into your HTML then we can edit it.

<object width="850" height="600">
<param name="movie" value="swf/GalleryComponent.swf">
<param name="FlashVars" value="dataUrl=xml/&dataFileName=config.xml">
<param name="wmode" value="transparent">
<embed src="swf/GalleryComponent.swf" width="850" height="600" wmode="transparent" flashvars="dataUrl=xml/&dataFileName=config.xml">
</embed>
</object>


Change the Width and Height of the Flash Area:
You need to change the width and height in two places. First in the 'object' tag there is properties for the width and height as shown below:

<object width="850" height="600"> 

change this to your desired width and height, remember that this is for the whole flash area not the main image.

Now you have to change it in the 'embed' tag as shown below:

<embed ...... width="850" height="600"...

Located the width and height and change it to your desired values. Thats it!

Provide the Flash (SWF) location:
Once you have placed the swf in your folder structure we now need to point the HTML page to it. The swf location will be relative to the HTML page NOT the swf. Like the width and height procedure we will change values in two places to provided the swf location. 

First in the 'object' tag locate the param 'movie' as shown below:

 <param name="movie" value="swf/GalleryComponent.swf"> 
Now change the value to your swf location.

The next place to change the path is the 'embed' tag, locate the 'src' as shown below:

<embed src="swf/GalleryComponent.swf".....

In the embed tag change the 'src' to your swf location. 

Providing the Flash with the Config XML Name and Location via FlashVars: 

Using the flashvars (flash variables) you can provide the flash gallery with the location of the config xml folder and the config xml file name.

In the 'object' tag locate the flashvars as shown below:

<param name="FlashVars" value="dataUrl=xml/&dataFileName=config.xml"> 

In the value you can see 'dataUrl=' which then proceeds with a folder name, in this case I have specified 'xml/' you have to change this to point to your xml folder, for example if my config xml was in 'gallery/xml' the my 'dataUrl' will look like this:
dataUrl=gallery/xml/
Note: always provide the trailing slash.
Now the flashvars has a second part which starts with '&' and this part is the file name.  

&dataFileName=config.xml

The example above states my xml file name is 'config', you will change this to point to the correct config file. In a situation where you have more than one config file than this will be handy.

In the 'embed tag locate flashvars:

flashvars="dataUrl=xml/&dataFileName=config.xml"

and do the same as the 'object tag.


NOTES
*When creating directories/folders use only lowercase characters for the file name.