What we need is an AS3 (Action Script 3) component that can be easily embeded within any AS3 (Flash/Flex) application.
The Progress Bar we need needs to be "faked". ? What we mean by "faked" is that the component is not tight to a specific process but runs for a specific amount of time.
In reality what we need is an "animation" that pretends to be a progress bar. ? ;)
**Requirement 1: Look and feel**
The progress bar component needs to be adjustable in height and width. ? When called, the component will be specified the following four parameters (see snapshot): width, height, component height, component width.
We want the progress bar to be nice looking with some cool shiny effect (no plain color please). ? Uses of images is prohibited - we want everything vectorized! ? We expect that progress bar to look "at least" as nice as the sample we are providing you. ? Still there is room for creativity and we will accept anything that looks professional.
**Requirement 2: Behavior**
The progress bar has three distinct phases:
- Phase 1: Connecting phase ? (first 20% of the progress bar)
- Phase 2: Transfer phase
- Phase 3: Verification phase (last 20% of the progress bar)
Each phase has its specific duration (in seconds) that is provided as parameters when launching the component (phase1Duration, phase2Duration, phase3Duration).
Each phase has also a string message that will get displayed during its duration (phase1Message, phase2Message, phase3Message, completionMessage).
The progress bar will fill up progressively for each phase. ? As an example if the phase1Duration parameter is set to 4 seconds, the progress bar will show a 10% completion after 2 seconds and 20% completion after 4 seconds (the progress bar will then enter its phase 2).
IMPORTANT: The progress bar must fillup gracefully!
Once phase 1 is completed, the component switch automatically to its phase 2. ? The Phase 2 message gets displayed and the progression continues according to the new duration (phase2Duration).
As opposed to Phase 1 which ends after its specified duration, phase 2 will remain until an "end message" is received from the application. ? When the "end message" is received, the progress bar fills up instantly to 80% and switch to Phase 3. ? If the Phase 2 duration ends but no "end message" has yet been received, the progress bar remains blocked at 80% waiting for the "end message" to arrive.
Upon receval of the "end message" the progress bar enters phase 3 and displays its message. ? Once the Phase 3 duration ends the progressBar is filled up entirely and the completionMessage gets displayed.
**Requirement 3: Termination**
The progress bar can be terminated at any time by the application, no matter what phases the progress bar is in.
The deliverable must include a test application (either Flash or Flex) showing the use of the component.
The sample data to use for the test application are:
phase1Message: Connecting to server...
phase2Message: Transferring data...
phase3Message: Closing connection...
completionMessage: Transfer completed successfully.