Introduction
This tutorial will show you how to use dynamic image loading in Flash MX to create a simple web cam type inline image updater.
1. Setup the Movie
Size a Flash MX movie to fit the target height and width of the web cam jpg you will be dynamically displaying ( 320 x 240 pixels in this case) and set the frame rate to 1 fps.
2. Import a Sample Image
In the default layer (layer 1), import a sample of the web cam jpg (place it at x:0.0 y:0.0 for this example).
3. Convert the Image to a Movie Clip Symbol
Select the image and convert it to a symbol (F8 or Insert> Convert to Symbol). The behavior should be set to Movie Clip (name it JPG for this example).
Name the instance of the movie JPG.
4. Create a Seperate Action Layer
Insert a new layer, and create 3 blank key frames in that layer for actions.
5. Frame 1 Actions
In the first key frame insert the following code:
| url = "webcam.jpg";
counter = 2;
function update() {
newmovie = "JPG" + counter++;
duplicateMovieClip("JPG", newmovie, counter);
loadMovie(url, newmovie);
} |
6. Frame 2 Action
In the second key frame insert the following code:
update.call(); |
7. Frame 3 Action
In the third key frame insert the following code:
gotoAndPlay(2); |
8. Mind your domains!
As long as the domain hosting the swf and the image are the same, that's all you have to do (or if you run the flash file from your desktop, you can grab images from any domain).
However, if the domain of the jpg is different from domain where the flash file is located
(for example url=http://earthcam.com/webcam.jpg and the swf is located at http://yourwebsite.com/webcam.swf),
you will have to bounce the image through a cgi script at your domain
(for example http://yourwebsite.com/getjpg.cgi).
Change the script on the first frame as follows:
| url = "http://earthcam.com/webcam.jpg";
cgiscript = "http://yourwebsite.com/getjpg.cgi";
counter = 2;
function update() {
newmovie = "JPG" + counter++;
duplicateMovieClip("JPG", newmovie, counter);
loadMovie(cgiscript, newmovie, "GET");
} |
| #!/usr/bin/perl
##########################################################################
# Get JPG from non local domain Script v1.00
#------------------------------------------------------------------------#
# Last Updated: 3/18/2002 written by: Jeff Hughes
# Use this script however you want ...
# just don't blame me for anything that goes wrong.
##########################################################################
## Get Input From Form ##################################################
read(STDIN, $buffer, $ENV{'CONTENT_LENGTH'});
$buffer = $ENV{'CONTENT_LENGTH'} || $ENV{'QUERY_STRING'};
@pairs = split(/&/, $buffer);
foreach $pair (@pairs) {
($name, $value) = split(/=/, $pair);
$value =~ tr/+/ /;
$value =~ s/%([a-fA-F0-9][a-fA-F0-9])/pack("C", hex($1))/eg;
if ($INPUT{$name}) { $INPUT{$name} = $INPUT{$name}.",".$value; }
else { $INPUT{$name} = $value; }}
##### $INPUT{'name'} #####################################################
use HTTP::Request;
use LWP::UserAgent;
my $ua = LWP::UserAgent->new;
my $request = HTTP::Request->new(GET => $INPUT{'url'});
my $response = $ua->request($request);
my %hash = %{$response};
$content = $hash{_content};
$msg = $hash{_msg};
print "Content-type: image/jpeg; name=\"webcam.jpg\"\n";
print "Content-Disposition: inline; filename=\"webcam.jpg\"\n\n";
binmode STDOUT;
print $content;
#------------------------------------------------------------------------#
# End of Script ### First Created: 3/18/2002
##########################################################################
|
discuss this topic to forum
