Simple Flash Examples

Because the Ming module offers a large number of functions and is easy to handle, we use it in this section to show you how Flash can be combined with PostgreSQL.

Before we get into details, let's look at a simple example:

 <?php   dl('php_ming.so');   # Drawing square ...   $s = drawsquare(50, 0xee, 0, 0);   # creating "movie clip"   $p = new SWFSprite();   $i = $p->add($s);   # rotating object   for($x=0; $x<3; $x++)   {     squarerot($p, $i, 5, -4);     squarerot($p, $i, 10, 4);     squarerot($p, $i, 5, -4);   }   # going to the next frame   $p->nextFrame();   # create a new movie object (SWF version 4)   $m = new SWFMovie();   $i = $m->add($p);   $i->moveTo(160,120);   $i->setName("the_name");   # setting background and size   $m->setBackground(0xff, 0xff, 0xff);   $m->setDimension(320,240);   # writing header and output   header('Content-type: application/x-shockwave-flash');   $m->output(); # function for creating square function drawsquare($size, $color1, $color2, $color3) {   $s = new SWFShape();   $s->setRightFill($s->addFill($color1, $color2, $color3));   $s->movePenTo(-$size,-$size);   $s->drawLineTo($size,-$size);   $s->drawLineTo($size,$size);   $s->drawLineTo(-$size,$size);   $s->drawLineTo(-$size,-$size);   return $s; } # rotating an object $howoften times function squarerot($p, $i, $howoften, $angle) {   for($j=0; $j<$howoften; ++$j)   {     $p->nextFrame();     $i->rotate($angle);   } } ?> 

Figure 14.1 shows the result.

Figure 14.1. A simple Flash example.

In the first line, we include php_ming.so . In this case, including the module is necessary because we installed the module but have not added extension=php_ming.so to our php.ini file (see the installation HOWTO). Then we call drawsquare($size, $color1, $color2, $color3) with four parameters. The first parameter defines the size, and the other three parameters define the color of the square.

The eighth line creates an instance of the SWFSprite object. In the next line, the square we created previously is added to the object and we can start rotating it. We want the square to behave like a seesaw (rotating left and right). Rotating is performed by the function squarerot($p, $i, $howoften, $angle) which we implement later in the script. The function needs four parameters. The first two are used to refer to the objects we created before; the first argument tells the function how often the rotation has to be performed. The fourth parameter defines the angle of the various rotations . If you have a closer look at the squarerot function, you can see that the nextFrame() function is called every time the loop is processed . nextFrame goes to the next frame, so the movie is generated.

After rotating the object several times, we create a SWFMovie() object and add the things we have done up to now to it. Then we move the object to the center of the screen and assign a name to it.

In the next step, we define the color of the background and the size of the animation. After displaying the header for the Flash movie, we output the movie.

The first example shows that drawing with the help of the Ming module is pen-based, which means that many commands draw things relative to the current position of the pen. Because a fully pen-based system would be far too complicated, Ming also provides functions using absolute coordinates. The drawLineTo function, for instance, has a related function called drawLine , which uses relative positioning instead of absolute coordinates.

In the previous example, we drew an animated square. In the next example, we draw two quadratic B zier curves. We included this example to show you how quadratic B zier curves can be drawn and how two geometric objects can be added to a scenery :

 <?php   dl('php_ming.so');   $s = new SWFShape();   $s->setLine(10, 0xff, 0x11, 0x11);   $s->movePenTo(30, 30);   $cx = 0; $cy = 150; $ax = 60; $ay = 140;   $s->drawCurveTo($cx, $cy, $ax, $ay);   $t = new SWFShape();   $t->setLine(10, 0xff, 0x11, 0x11);   $t->movePenTo(30, 30);   $cx = 100; $cy = 50; $ax = 160; $ay = 40;   $t->drawCurveTo($cx, $cy, $ax, $ay);   $m = new SWFMovie();   $m->setDimension(320, 240);   $m->add($s);   $m->add($t);   $m->nextFrame();   header('Content-type: application/x-shockwave-flash');   $m->output(); ?> 

The result is no Picasso, but it's a good example of drawing curves and adding objects (see Figure 14.2).

Figure 14.2. Drawing two curves.

Let's have a closer look at the source code of the program. First we create a shape and define the colors of the lines that we are going to draw. Then we move the pen to the required position and define the parameters for the curve that we want to draw. The whole process has to be done twice, because we want two curves to be displayed.

Finally, we create the SWFMovie , setting the size, adding the curves to the instance of the SWFMovie object, and displaying the output.

Before we get to PostgreSQL and Flash, you will see how text can be processed with the help of the Ming module. Knowing how to process text is very important, because most data is displayed as text in real-world applications. In the next example, we want Hello from postgresql.cybertec.at to be moved on the screen:

 <?php   dl('php_ming.so');   # defining text   $string = "Hello from postgresql.cybertec.at";   # creating objects required for text   $f = new SWFFont("test.fdb");   $t = new SWFText();   $t->setFont($f);   $t->setColor(0xff, 0, 0);   $t->setHeight(20);   $t->addString($string);   # creating movie object   $m = new SWFMovie();   $m->setDimension(320, 240);   # adding text to the movie object   $i = $m->add($t);   # setting text to 60 units left and 60 units   $i->moveTo(100-$t->getWidth($string)/2, 60+$t->getAscent()/2);   # moving the text ...   for($j=1; $j<=20; $j++)   {     $i->move($j, $j);     $m->nextFrame();   }   # displaying results   header('Content-type: application/x-shockwave-flash');   $m->output(); ?> 

Figure 14.3 shows the result.

Figure 14.3. Moving text.

Let's go through the code quickly. First we define the string that we want displayed. In the next step, we create an instance of the SWFFont object. The name of the font we want to use has to be passed to the function in brackets. In our example, we use the font that comes with the Ming source distribution. Additional fonts can be added by using the makefdb utility. The source code of the program can be found in the util directory of the source code. Use make makefdb to compile it:

 [hs@duron util]$  make makefdb  gcc -g -Wall    -c -o blocktypes.o blocktypes.c gcc -g -Wall    -c -o read.o read.c gcc -g -Wall makefdb.c read.o blocktypes.o -o makefdb 

After defining the font that we want to use for our application, we create an instance of the SWFText object and define the properties of the text, such as font, height, and color. The addString method is used to assign $string to the object.

After those operations related to the text, we create the SWFMovie object, as we did in the previous examples, and add the text to it. With the help of moveTo() , we define the position where the text should be displayed. However, the way the position of the text is computed has to be explained in a more detailed way.

If we want to display the text in the middle of the browser window, we have to use a command such as this:

 $i->moveTo(160-$t->getWidth($string)/2, 120+$t->getAscent()/2); 

The center of the window is 160 units right of the left edge of the windows , because the size of the windows is exactly 320 units. getWidth returns the width of the string, and we subtract half of that width to find the left position, where the string has to start. The position of the text on the y-axis is computed the same way, except we use the getAscent method instead of the getWidth method.

Now that we have the right position of the text in the result, we include a loop to move the text from the left to the right and from up to down. Finally, we display the video.