Green Tea Blog

Where to use:
- Creating interactive banners and backgrounds to attract users
- Applying in designing interactive games and simulation experiment on ecosytem
- Making interactive demonstrations which are environment friendly
This item sell in Flash Components.net click here to buy it
Feature: - Useful in background, banner, games, simulation, demonstration experiment on ecosystem - Rich user's interactive - Customizable, background, text, HTML and link, and a lot more - Resizable freely - Light - AS2+ - Flash 8+ What in this : smartclouds.zip include : 1) smartclouds.fla : the main source file smartclouds.fla for rich interactive banner/background 2) background_1.fla : the first background sample source file 3) background_2.fla : the second background sample source file 4) loader.fla : the loader sample source file 5) smartclouds.swf : the main file smartclouds.fla for rich interactive banner/background 6) background_1.swf : the second background sample file 7) background_2.swf : the first background sample file 8) loader.swf : loader sample file 9) Readme.txt : document help file ----------- sample.zip include: 1) preview.swf : the preview swf file for main file smartclouds for rich interactive banner/background 2) background_1.swf : the first background sample file 3) background_2.swf : the second background sample file --------- How to work: I created a background of a hill, a stream, the sun and one original cloud. The cloud has a default speed and flying direction on the screen. A button was created in a form of tree to plant trees on the hill. A timer is installed to make random clouds on the screen in case users do not click to the Sun for a new cloud. Each cloud is "an alive entity" which has it's own life cycle. It is being born and then lives and then being destroyed. Each cloud carries a message (text and link) to the contents you wish to send to your audience. If there is not action from users, the clouds will fly randomly on the screen. When touching the screen's boundary, the clouds will change direction. A new cloud will be created every 10 seconds (customizable). If 2 clouds meet each other, one cloud will eat the other and the raining, thunder and lightning will appear. ( I'd removed the thunder and rain sound but you can put your own sounds of thunder and rain) Users can speed up this process by creating more clouds up to a limit (customizable). "Drag and drop" function can be used for the clouds to actively make thunder, rain and lightning...2 background samples are provided (you can design yourself more). A background will be loaded randomly to help your website/presentation more interactive and live. Rule: Click the Sun (button) for a new Cloud with a random speed, size (width, length), location (x, y coordinate) and direction. The cloud will randomly fly on the screen but not too close to the ground. If you don't create a cloud (not touching to the Sun button), the every 10 seconds, the new cloud will be created by a timer. Duration can be customized based on your needs. Each cloud carries a message (text and link) to introduce about your self, your slogan, link to your Website ... You can customize number of cloud and number of messages. The created clouds wander on the sky (screen) and when they meet each other, the collision will happen. The bigger cloud will eat the smaller one and then the sky color will change and raining, thunder and lightning will happen . Raining duration can be customized too. ---------- How you can use it in your project: Step 1: Open file smartclouds.fla Step 2: Create your new flash file, create 2 layers Step 3: Below are code lines in the first keyframe of first layer in your fla file fscommand("allowscale",true); // ----- New------ //Check if not installed oldHitTest to install a new one if(this.oldHitTest()==undefined) { // ----- This code allow to change from global to local coordinate x, y in case you call load thi movie into another ------ MovieClip.prototype.oldHitTest = MovieClip.prototype.hitTest; MovieClip.prototype.hitTest = function(x, y, sf){ var obj = {x:x, y:y}; this._parent.localToGlobal(obj); return this.oldHitTest(obj.x, obj.y, sf); } // ----- End New------ } Step 4: Press Ctrl + L to open the library Step 5: Choose the mcInteractiveBacground movie clip you need on the Library smartclouds.fla Step 6: Drag the mcInteractiveBacground ones you have chosen from Library into your stage on the second layer and now it's READY for your use. Note: You can also use load movie clip command to use it in your fla project simply by putting a code line : this.loadMovie("smartclouds.swf"); This movie can be resided freely. I include a loader.fla as an example on how to load this movie as an external movie How to customize it: You can also customize them yourself. You can customize number of cloud, default size and random location, turn on/ off related information on the screen, text and link on each cloud, raining duration, the default times to create a could automatically. In summary, you can customized whatever you like in this flash. //-----------------Begin Your customize here------------- //-------------replace by your own text, these text will be shown randomly when a new cloud is created up to vMaxNumberOfClouds + 1 (here are 4), html code are ok var text1 = "Buy with Flashcomponents.net"; var text2 = "Sell with Flashcomponents.net"; var text3 = "Interactive with Flashcomponents.net"; var text4 = "Income with Flashcomponents.net"; var text5 = "Competitions with Flashcomponents.net< //- //--------------End text show on the Cloud-------------------------------------------- //--------------Customize your parameter on the function onClipEvent(load), customize section of movie clip mcInteractiveBacground // var vBackGroundName = "background_1.swf"; // Define a external swf background (size 590x300) // var vBackGroundName = "background_2.swf"; // Define a external swf background (size 590x300) var vTurnSound = true; // Turn on/off Sound of Thunder and Rain var vFlippingDegreeOfRain = 60; // Define a flipping raining shape correspond to the cloud' direction var vDefaultBackground = "background_1.swf"; // Define a default background var vRandomBackGround = true; // Turn on/off randomized background var vNumberOfBackGround = 2; // Define max number of background var vMaxNumberOfClouds=4; // Define max number of Clouds (vMaxNumberOfClouds + 1) var vMaxRainLoop = 3; // Define max Number of Raining var vShowInfor = true; // Turn on/off description var vTimeToCreateCloud = 10; // Define a default time to automatically create a new Cloud. A Zero (0) value means turning off this feature var vDeltaXBaseOfCloud = 200; // Default X margin distance to the right screen of each cloud var vDeltaYBaseOfCloud = 120; // Default Y margin distance to the top screen of each cloud var vDeltaWidthBaseOfCloud = 70; // Default Width of each cloud var vDeltaHeightBaseOfCloud = 30; // Default Width of each cloud //-----------------------------------------------------------------------------------You can use your owner thunder's sound by imported into your movie clip, I'd removed the thunder and rain sound but you can put your own sounds Step 1: Import your thunder sound into your library, place in fSounds folder Step 2: Right click on it name (sound' name) choose Linkage Step 3: Give the Identifier and tick these check box Identifier : SoundThunder Linkage: Export for ActionScript : Checked Export for runtime sharing : Not checked Export in first frame : Checked Import for runtime sharing : Not checked Main object in the Library mcInteractiveBacground : The main movie clip contain all part of this demonstration btn_Sun : Button to create new Clouds mcCloudy : Original's object of each cloud's instance btn_Tree: Button to growth trees in Erode Scene (background_1.swf) txt_vNumberOfClouds : Dynamic textbox to display current number of clouds txt_Hint : Dynamic textbox to display the name of each cloud's instance txt_S : Dynamic textbox to display the area of a specifics instance of a cloud mcClock: A simple timer to create a new cloud automatically txtGuide : Dynamic textbox to display a help when user move their mouse on the screen's object Comments for the Reviewer: I would like to certify that this product including all of its parts is made by myself only, except the free references instructions of hitTest function is listed here: Reference 1) hitTest in loaded movies 10th January 2004 by Keith Peters http://www.bit-101.com/blog/?p=499 MovieClip.prototype.oldHitTest = MovieClip.prototype.hitTest; MovieClip.prototype.hitTest = function(x, y, sf){ var obj = {x:x, y:y}; this._parent.localToGlobal(obj); return this.oldHitTest(obj.x, obj.y, sf); } Have fun! FAQ 1) How can I to customize it? You can also customize them yourself. You can customize number of cloud, default size and random location, turn on/ off related information on the screen, text and link on each cloud, raining duration, the default times to create a could automatically. In summary, you can customized whatever you like in this flash. //-----------------Begin Your customize here------------- //-------------replace by your own text, these text will be shown randomly when a new cloud is created up to vMaxNumberOfClouds + 1 (here are 4), html code are ok var text1 = "Buy with Flashcomponents.net"; var text2 = "Sell with Flashcomponents.net"; var text3 = "Interactive with Flashcomponents.net"; var text4 = "Income with Flashcomponents.net"; var text5 = "Competitions with Flashcomponents.net< //- //--------------End text show on the Cloud-------------------------------------------- //--------------Customize your parameter on the function onClipEvent(load), customize section of movie clip mcInteractiveBacground // var vBackGroundName = "background_1.swf"; // Define a external swf background (size 590x300) // var vBackGroundName = "background_2.swf"; // Define a external swf background (size 590x300) var vTurnSound = true; // Turn on/off Sound of Thunder and Rain var vFlippingDegreeOfRain = 60; // Define a flipping raining shape correspond to the cloud' direction var vDefaultBackground = "background_1.swf"; // Define a default background var vRandomBackGround = true; // Turn on/off randomized background var vNumberOfBackGround = 2; // Define max number of background var vMaxNumberOfClouds=4; // Define max number of Clouds (vMaxNumberOfClouds + 1) var vMaxRainLoop = 3; // Define max Number of Raining var vShowInfor = true; // Turn on/off description var vTimeToCreateCloud = 10; // Define a default time to automatically create a new Cloud. A Zero (0) value means turning off this feature var vDeltaXBaseOfCloud = 200; // Default X margin distance to the right screen of each cloud var vDeltaYBaseOfCloud = 120; // Default Y margin distance to the top screen of each cloud var vDeltaWidthBaseOfCloud = 70; // Default Width of each cloud var vDeltaHeightBaseOfCloud = 30; // Default Width of each cloud //------------------------------------------------------------------------------------------------ 2) How can i add my own sounds in this? You can use your owner thunder's sound by imported into your movie clip, I'd removed the thunder and rain sound but you can put your own sounds Step 1: Import your thunder sound into your library, place in fSounds folder Step 2: Right click on it name (sound' name) choose Linkage Step 3: Give the Identifier and tick these check box Identifier : SoundThunder Linkage: Export for ActionScript : Checked Export for runtime sharing : Not checked Export in first frame : Checked Import for runtime sharing : Not checked 3) How does it work? what is the rule in here? How to work: I created a background of a hill, a stream, the sun and one original cloud. The cloud has a default speed and flying direction on the screen. A button was created in a form of tree to plant trees on the hill. A timer is installed to make random clouds on the screen in case users do not click to the Sun for a new cloud. Each cloud is "an alive entity" which has it's own life cycle. It is being born and then lives and then being destroyed. Each cloud carries a message (text and link) to the contents you wish to send to your audience. If there is not action from users, the clouds will fly randomly on the screen. When touching the screen's boundary, the clouds will change direction. A new cloud will be created every 10 seconds (customizable). If 2 clouds meet each other, one cloud will eat the other and the raining, thunder and lightning will appear. ( I'd removed the thunder and rain sound but you can put your own sounds of thunder and rain) Users can speed up this process by creating more clouds up to a limit (customizable). "Drag and drop" function can be used for the clouds to actively make thunder, rain and lightning...2 background samples are provided (you can design yourself more). A background will be loaded randomly to help your website/presentation more interactive and live. Rule: Click the Sun (button) for a new Cloud with a random speed, size (width, length), location (x, y coordinate) and direction. The cloud will randomly fly on the screen but not too close to the ground. If you don't create a cloud (not touching to the Sun button), the every 10 seconds, the new cloud will be created by a timer. Duration can be customized based on your needs. Each cloud carries a message (text and link) to introduce about your self, your slogan, link to your Website ... You can customize number of cloud and number of messages. The created clouds wander on the sky (screen) and when they meet each other, the collision will happen. The bigger cloud will eat the smaller one and then the sky color will change and raining, thunder and lightning will happen . Raining duration can be customized too. 4) How you can use it in your project ? Step 1: Open file smartclouds.fla Step 2: Create your new flash file, create 2 layers Step 3: Below are code lines in the first keyframe of first layer in your fla file fscommand("allowscale",true); // ----- New------ //Check if not installed oldHitTest to install a new one if(this.oldHitTest()==undefined) { // ----- This code allow to change from global to local coordinate x, y in case you call load thi movie into another ------ MovieClip.prototype.oldHitTest = MovieClip.prototype.hitTest; MovieClip.prototype.hitTest = function(x, y, sf){ var obj = {x:x, y:y}; this._parent.localToGlobal(obj); return this.oldHitTest(obj.x, obj.y, sf); } // ----- End New------ } Step 4: Press Ctrl + L to open the library Step 5: Choose the mcInteractiveBacground movie clip you need on the Library smartclouds.fla Step 6: Drag the mcInteractiveBacground ones you have chosen from Library into your stage on the second layer and now it's READY for your use. Note: You can also use load movie clip command to use it in your fla project simply by putting a code line : this.loadMovie("smartclouds.swf"); This movie can be resized freely. I include a loader.fla as an example on how to load this movie as an external movie 5) What in this sample? sample.zip for demostration include: 1) preview.swf : the preview swf file for main file smartclouds for rich interactive banner/background 2) background_1.swf : the first background sample file 3) background_2.swf : the second background sample file 4) smartclouds.swf : the smartclouds.swf file ---------- smartclouds.zip for the buyer include : 1) smartclouds.fla : the main source file smartclouds.fla for rich interactive banner/background 2) background_1.fla : the first background sample source file 3) background_2.fla : the second background sample source file 4) loader.fla : the loader sample source file 5) smartclouds.swf : the main file smartclouds.fla for rich interactive banner/background 6) background_1.swf : the second background sample file 7) background_2.swf : the first background sample file 8) loader.swf : loader sample file 9) Readme.txt : document help file ----------- 6) What is the main movie clip so I can change it' shape? Main object in the Library are listed here: mcInteractiveBacground : The main movie clip contain all part of this demonstration btn_Sun : Button to create new Clouds mcCloudy : Original's object of each cloud's instance btn_Tree: Button to growth trees in Erode Scene (background_1.swf) txt_vNumberOfClouds : Dynamic textbox to display current number of clouds txt_Hint : Dynamic textbox to display the name of each cloud's instance txt_S : Dynamic textbox to display the area of a specifics instance of a cloud mcClock: A simple timer to create a new cloud automatically txtGuide : Dynamic textbox to display a help when user move their mouse on the screen's object 7) Where to use this Rich Interactive Background/Banner? Rich Interactive Background/Banner - Smart Clouds, Only 19.3Kb, Flash 8+, AS2 It is usefull for - Creating interactive banners and backgrounds to attract users - Applying in designing interactive games and simulation experiment on ecosytem - Making interactive demonstrations which are environment friendly