Creating Dynamic Flash Header using Koolmoves Action scripting with PHP GD

This php project consisted of using koolmoves to create an flash actionscript file.

For each domain, Different set of images has been uploaded through administrator panel . This uploaded image count is assigned depending upon our front end flash header file.

In front end, Our web company had created a index file named index.html. In index.html at the top, we show a dynamic header flash file which was created through action script and PHP GD functions.

Uploading dynamic images through Admin panel

We have used a mysql database table called “domain_images” which contains all domain details like domain url and domain images for each domain.

In administrator panel, for each domain which has been added a different set of images were uploaded. Also each image contains different color versions like “gray, green, yellow, blue, violet, red etc”. A Composite image has been generated by using these different color versions. We have stitched together different color versions of the domain together dynamically using php and GD. We have applied flash transitions for the composite image using flash action script.

The above images are different color versions of same image.

Website Index page

We have created index page as index.html and our software developer team has used Ajax to fetch dynamic images for the corresponding URL which visitor visits. Using Ajax, we run PHP scripts in background. Visitor’s domain name has been passed to PHP script to fetch corresponding domain’s images from a database in a randomized manner.

We passed result value which contains domain id and 6 images number(which is fetched randomly) from Ajax script.

Ajax script

In Ajax script, we get domain name which is passed from index.html. Using that domain name, Images has been fetched from domain_images table. We have assigned the available images as an array. As well as we found how many images are available for this domain.

If there are less than 6 images, then our web developer team scripted the php ajax program in such a way that it fetched images from a default domain and assigned those domain images as image array. Earlier We have uploaded images for this domain through administrator panel like other domains.

Passing Randomized Images

We shuffle the image array, so that each time when visitor visiting to website, flash header will be shown with dynamic randomized images.

By echoing that string, we have passed that domain details to HTML page using ajax.

Flash file with FlashVars

We needed to pass the fetched domain details to Flash file. To achieve this, we have used FlashVars in SWF file. FlashVars is a way to pass data or variables as Query String from html to flash file.

flashIntroduction.swf is the flash file which we have created through koolmoves action scripting.

Creating Slide Shows with Dynamic images in KoolMoves

We have used Koolmoves to create slide show with transitions. In koolmoves we have created composite images dynamically from the passed images using PHP script.

We have used “Button/on clip events” event in key frame. In that code, we have assigned slide show primary settings like “Slide Height and Slide show width and slide show scrollbar colors and border,navigation settings”.

In onClipEvent() we created slide array and pushed all the images into that array to create slide show. Here image values has been passed to php script which is passed from HTML via flashVars.

For example, we fetched values like _root.img1, root.img2 etc
slides.push() has been used to push images to slides array.

Here,

1.transition id is used to give different transition effect like bars horizontal, bars vertical, blinds large horizontal, blinds large vertical etc.

2.transition time is the time of transition to be applied for each slide item.

3.image / symbol library link name is the image name. In our case, we used php script which generated composite image using GD function.

4.Image time is image time ie., slide duration in floating point
seconds, after the transition effect has finished.

5.Scale mode is used to specify the image scale property.
There are 3 scale modes are available.
1.0=Scale to fit
2.1=scale and crop
3.2=crop

6. Background color is the background color of slide show.

So each slides.push() statement created a composite image(from PHP GD script) with different color images of the domain and applied various transitions for each slide item.

We assigned slides array in setSlides(slides, -1); We have used -1 to stop the animation when it reaches last slide item slide.

Generating Dynamic images using GD

We stitched them together by using imageCopyMerge() function.

In imageCopyMerge() function, we have specified Image source name, Image destination name, Destination x position, Destination y position, Source x position, Source y position, Source height, Source width and pct.

We used this to create a composite image and output that image to flash file where we have assigned all slide properties like transition id, transition time etc.

Exporting Flash file

We saved above flash file as “flashIntro.fun”. We exported our flash file as “flashIntro.swf” which we used in index.html.

As usual our web company skillfully completed this advanced project for a client in USA deftly.