This tutorial will take you through the basic steps for using the flashGuestbook component.
First we will create a simple form to enable visitors to submit messages to our guestbook.
1. After installing the flashGuestbook component using the Adobe/Macromedia Extension Manager and after following the Server Installation instructions, open Flash and start a new file.
2. Press Ctrl+F7 (Win) or Cmnd+F7 (Mac) to open the components panel. Locate the TextInput component that shipped with Flash and drag a copy onto the stage.
Note you can use our Bit Component Set components instead of those that shipped with Flash.
With the TextInput component still selected on the stage press Ctrl+F3 (Win) or Cmnd+F3 (Mac) to open the properties panel and give the component the instance name 'name_ti' (without the quotes).
3. Drag a copy of the TextArea component out of the components panel onto the stage, beneath the TextInput component you added in step 2.
Give the TextArea the instance name 'message_ta' (without the quotes).
4. Drag a copy of the Button component onto the stage beneath the TextArea component you added in step 3.
Give the Button component the instance name 'submit_btn'.
5. With the Button component still selected press Alt+F7 to open the component inspector and set the button's label to "Submit".
Press the 'T' key to select the text tool and add a static text field with the words "Submit a message" above the form. Add static text fields to give the TextInput and TextArea the titles "name" and "message".
The next step is to create a clip to display each message in your guestbook.
6. Press Ctrl+F8 (Win) or Cmnd+F8 (Mac) to open the 'Create New Symbol' dialogue box. Give the clip the name 'entry clip' (without the quotes). Ensure the symbol's type is set to 'Movie clip'.
If the advanced section is not open press the 'Advanced' button to open it. Tick the 'Export for Actionscript' checkbox and allow the 'Export in first frame' checkbox to tick itself. Enter 'entryClip' as the symbol's identifier. Click 'OK'
7. You should now have been automatically taken to the new clip's timeline. Press the 'R' key to select the rectangle tool and draw a background for your new clip on the stage.
With the background still selected press F8 to convert the background to a movieclip.
With the movie clip still selected give it the instance name 'clipBg' (without the quotes).
8. Optional: If you wish to display the guestbook entries with alternating background colors, you can repeat step 7 to create the second background in a different color, giving it a different instance name. For example, 'clipBg2' (without the quotes). It is recommened to create the second background in its own layer, for easier editing.
9. Create a new layer above the background layer and draw a dynamic text field on the stage (using the text tool), inside the area created by your background.
Set the text field to be 'Single line' and give it the instance name 'name_txt' (without the quotes).
10. Create a second text field below the first, still inside the area created by your background.
Set the text field to be 'multiline' and give it the instance name 'message_txt' (without the quotes).
The next step is to create a movie clip to hold all your guestbook entries.
11. Press Ctrl+F8 (Win) or Cmnd+F8 (Mac) to create a new movie clip. Name the movie clip 'holder clip' and ensure the type is set to 'Movie clip'. Click 'OK'
12. Return to the main timeline. Press Ctrl+L (Win) or Cmnd+L (Mac) to open the library panel. Locate the symbol you created in step 11 and drag a copy onto the stage. In the properties panel give the movie clip the instance name 'holderClip' (without the quotes).
Next we add the flashGuestbook to the stage and configure it to connect our Flash elements to the database.
13. Open the 'Components' panel and drag a copy of the flashGuestbook component onto the stage. (You can position the flashGuestbook component anywhere convenient as it won't be visible when the swf file is exported.)
With the component still selected, open the properties panel and give the component the instance name 'myGuestBook' (without the quotes).
14. Press Alt+F7 to open the 'Component Inspector' panel.
For the value of the 'Entry movie clip identifier' enter the identifier of the movie clip you created in step 6 (entryClip).
For the value of 'Background A' enter the instance name of the background movie clip you created in step 7 (clipBg).
If you created an alernating background color, enter the instance name of the second background movie clip you created in step 8 (clipBg2) in the 'Background B' parameter.
For the value of the 'Holder Clip' enter the instance name of the clip you added to the stage in step 12 (holderClip).
Note: at this time the value of the 'Script Type' parameter must be set to 'php'.
15. Select the empty brackets next to the Data entry fields' and click the magnifying glass that appears next to the entry to edit it. Click the 'plus' button twice to add two entries.
Enter as the fieldInstance of the first entry, the instance name of the TextInput component you added to the stage in step 2 (name_ti), set the 'componentType' to 'TextInput' and set the 'field' to 'Full Name'.
Enter as the fieldInstance of the second entry, the instance name of the TextArea component you added in step 3 (message_ta), set the 'componentType' to 'TextArea' and set the 'field' to 'Message'.
Click 'OK'.
16. Click the empty brackets next to the Display fields' then click the magnifying glass that appears. Click the 'plus' button twice to add two entries.
Enter as the 'fieldInstance' of the first entry the instance name of the text field you added in step 9 (name_txt) and set the 'field' to 'Full Name'.
Enter as the 'fieldInstance' of the second entry the instance name of the text field you added in step 10 (message_txt) and set the 'field' to 'Message'.
Click 'OK'.
The final step is to add Actionscript to your button that will submit the message a visitor to your site enters.
17. Create a new layer on your main timeline and name it 'Actions'. Select the keyframe at frame 1 and press Alt+F9 to open the 'Actions' panel. Enter the following script:
submit_btn.onRelease = function(){
myGuestBook.submit();
}
18. Press Ctrl+S (Win) or Cmnd+S (Mac) to save your file and Shift+F12 to publish it.
Upload the .html and .swf files created when you published the movie to the same directory as your 'script' folder and open the .html file in a browser to test your file.
Note that if you wish to upload your .swf and .html files to a different directory from the directory containing the 'script' folder you should specify the path to the script folder in the component's 'Path To Script' parameter. The path should end with a slash ("/"). For example: "guestbook/"
Enter your name in the 'name' field, and enter a message for yourself in the 'message' field. Click 'Submit' and the message along with your name will be removed from the input fields added to your database and then displayed using the entry clip you created in step 6.