FlipViewer.com
  Technology Overview Products Services Support Devzone
 
Dynamic Flipbook Creation Using PHP - Vacation Album Creator:
Introduction
 
This chapter puts together all the ideas mentioned in the previous chapters and describes how FlipBooks can be created dynamically by web scripting languages like PHP. We'll base our case study on the fun-filled Vacation Album Creator which allows users to create vacation albums complete with album covers.
 
Before reading this tutorial, it's advantageous to have a basic understanding of the PHP language and some database skills.
 
In this example, we are using PHP 4 as our scripting language and MySQL 3.22 as our database server. We have a few input forms which allows users to select the album cover, vacation pictures and personal messages. The book will be generated dynamically on the fly after the pictures have been uploaded.
 
The Vacation Album Creator consists of 3 input screens which does the following:
 
Input Screen 1:
Step 1: Do you want to add to your "Favorites" (Optional) ?
Step 2: Album Details
Step 3: Album Cover Selection
Step 4: Add Your Personal Message

Input Screen 2:
Step 5: Insert Photos Into Your Album (Only JPEG allow)

Input Screen 3:
Background Step: Generate the FlipBook (vacation.opf) file
Step 6: Preview your Wedding Album
Step 7: Email Your Wedding Album Now

Input Screen 4:
Background Step: Generate Email To Send Notification and Album

 
The codes below are used for the automatic FlipBook generation.
 
Generate FLP for Cover Page
 
As shown on the first input screen of the , Vacation Album Creator the user is given the option of choosing standard album covers 1-4 under Step 3a or special covers under Step 3b. Special Covers under Step 3b (as shown above), are done using the FLP format and thus require some coding steps to generate.
 
The steps for creating special cover page are as follows:
i) Make a copy of the Vacation Cover File template and replace the marked symbols "%PICFILE%" with the JPEG file that the user has uploaded.
 
// Create Cover file
if (($cover == 7) || ($cover == 8) || ($cover == 9) || ($cover == 10)) {
$temflp = "/home/myfb/public_html/albumvac/cover/" . $category . $cover . ".flp";
$flp = "/home/myfb/public_html/pacvac/" . $stime . "/cover.flp";

// Copy the Flp template into an array
$flpcontents = file($temflp);

if (file_exists($flp)) {
passthru("rm -f $flp");
}

if (!($fp = fopen($flp, "w"))) {
echo "Error occurred when creating FLP file";
exit();
}

while (list ($line_num, $line) = each ($flpcontents)) {
$replaced = 0;
if ( ereg("%BGFILE%", $line) ) {
$flpline = ereg_replace('%BGFILE%', 'http://members2.myflipbooks.com/albumvac/cover/' . $category . $cover . '.jpg', $line);
$replaced = 1;
}

if ( ereg("%PICFILE%", $line) ) {
$flpline = ereg_replace('%PICFILE%', 'http://members2.myflipbooks.com/pacvac/' . $stime . '/cvvac.jpg', $line);
$replaced = 1;
}

if ($replaced == 0) {
$flpline = $line;
}
fputs($fp, $flpline);
} // while

fclose($fp);
chmod ($flp, 0777); // octal; correct value of mode
}
// End of Creating the Cover File

 
Generate the FlipBook OPF file
 
This portion of the code generates the OPF file in the format as discussed in
How to manually create a FlipBook by using FlipViewer®
 
//Create the OPF file
$textfile = "<?xml version = \"1.0\" encoding = \"UTF-8\"?";
$textfile .= ">
< package unique-identifier = \"unspecified\">
< metadata>
<x-metadata>
<meta name = \"EbooksysVersion\" content = \"1.1\"/>
<meta name = \"page_inset\" content = \"top: 0.03 bottom: 0.03 inner: 0.05 outer: 0.05\"/>
<meta name=\"centerfold\" content=\"no\"/>
<meta name = \"flipping_sound\" content = \"yes\"/>
<meta name = \"window_frame\" content = \"no\"/>
< !-- <meta name = \"window\" content = \"1 1 900 700\"/> -->
<meta name=\"openbook\" content=\"no\"/>
<meta name = \"autoflip\" content = \"no\"/>
<meta name = \"flipping_speed\" content = \"10 %\"/>
<meta name = \"new_page\" content = \"appended\"/>
<meta name = \"page_background\" content = \"texture:
http://members2.myflipbooks.com/albumvac/cover/bg.jpg\"/>
" ;

$textfile .= "<meta name=\"background_music\" content=\"no\"/>";

$textfile .= "
<meta name=\"book_binder\" content=\"numrings:0 ringtype:None\"/>
</x-metadata>
< /metadata>

<manifest>
" ;

if (($cover == 7) || ($cover == 8) || ($cover == 9) || ($cover == 10)) {
$textfile .= "<item id=\"itemCV\"
href=\"http://members2.myflipbooks.com/pacvac/" . $stime . "/cover.flp\"
media-type = \"application/x-flp\"/>
";
} else {
$textfile .= "<item id=\"itemCV\" href=\"\" media-type = \"application/x-flp\"/>
";
}

$textfile .= "
<item id=\"itemADV\" href=\"http://www.FlipViewer®.com/yahoo/yahooadv4/\"
media-type = \"text/html\"/>
" ;

$textfile .= "
<item id=\"itemMSG\" href=\"http://members2.myflipbooks.com/albumvac/message.php?id=";

$textfile .= $id;
$textfile .= "\" media-type = \"text/html\"/>
" ;

// Generate the individual pages of the OPF book
for ($iindex = 1; $iindex <= $numpage; $iindex++) {
$textfile .= "<item id = \"item" . $iindex;
$textfile .= "\" href = \"http://members2.myflipbooks.com/pacvac/" .
$stime . "/" . $iindex . ".jpg\" media-type = \"application/x-flp\"/>";
}

if (($numpage % 2) == 0) {
// No filler
} else {
$textfile .= "<item id=\"filler\" href=\"\" media-type = \"application/x-flp\"/>";
}

$textfile .= "
< item id=\"itemBK\" href=\"\" media-type = \"application/x-flp\"/>
< /manifest>
< spine>
" ;

if (($cover == 7) || ($cover == 8) || ($cover == 9) || ($cover == 10)) {
$textfile .= "<itemref idref = \"itemCV\" pageside = \"right\" index = \"no\"/>
";
} else {
$textfile .= "<itemref idref = \"itemCV\" page_background=\"texture:
http://members2.myflipbooks.com/albumvac/cover/" . $category .
$cover . ".jpg\" pageside = \"right\" index = \"no\"/>
";
}

$textfile .= "
<itemref idref=\"itemADV\" page_background=\"texture:
http://members2.myflipbooks.com/albumvac/cover/pgleftb.jpg\"/>
<itemref idref=\"itemMSG\" page_background=\"texture:
http://members2.myflipbooks.com/albumvac/cover/pgrightb.jpg\"/>
" ;

// <itemref idref=\"itemMSG\"/>

for ($iindex = 1; $iindex <= $numpage; $iindex++) {
$textfile .= "<itemref idref=\"item" . $iindex;
if (($iindex % 2) == 1) {
$textfile .= "\" page_background=\"texture:http://members2.myflipbooks.com/albumvac/cover/" .
$category . $cover . "leftbg.jpg\"/>";
} else {
$textfile .= "\" page_background=\"texture:http://members2.myflipbooks.com/albumvac/cover/" .
$category . $cover . "rightbg.jpg\"/>";
}
}

if (($numpage % 2) == 0) {
// No filler
} else {
$textfile .= "<itemref idref=\"filler\" page_background=\"texture:
http://members2.myflipbooks.com/albumvac/cover/" . $category . $cover . "rightbg.jpg\"/>";
}

$textfile .= "
<itemref idref=\"itemBK\" page_background=\"texture:
http://members2.myflipbooks.com/albumvac/cover/" . $category .
$cover . "bk.jpg\" pageside = \"left\" index = \"no\"/>
< /spine>
< /package>
" ;

chdir($opfdir);

$opffile = "album.opf";
if (file_exists($opffile)) {
passthru("rm -f $opffile");
}
if (!$file=fopen($opffile, "w")) {
echo "Sorry, your eCard could not be created.";
exit();
} else {
fwrite($file, $textfile);
}

fclose($file);
passthru("chmod 777 " . $opffile);


$opffile = "album.opf";
$opfpath = "http://members2.myflipbooks.com/pacvac/$stime/album.opf";

// Update the eCard Record
$query = "update ecard
set opffile = \"$opffile\",
opfpath = \"$opfpath\",
message = \"$message\",
msghtml = \"$msghtml\",
numpage = \"$numpage\"
where id = \"$id\"";
$result = mysql_query($query, $db);

} // if (empty($chgnumemails))

 
See below for the completed Vacation Album's OPF file that has been generated by the program:
* Substitute ~ in the code below with the URL "http://members2.myflipbooks.com/albumvac".
 
Vacation Album's OPF file
<?xml version = "1.0" encoding = "UTF-8"?>
<package unique-identifier = "unspecified">
<metadata>
<x-metadata>
<meta name="centerfold" content="no"/>
<meta name="openbook" content="no"/>
<meta name = "page_background" content = "texture: ~/background/pageright.jpg"/>
<meta name="background_music" content="no"/>
<meta name="book_binder" content="numrings:0 ringtype:None"/>
</x-metadata>
</metadata>

<manifest>
<item id = "item0" href = "" media-type = "application/x-flp"/>
<item id = "resource0_2_0" href = "~/vacation_opf_files/pacvac2.jpg"
media-type = "application/x-resource"/>
<item id = "item1" href = "~/vacation_opf_files/www_FlipViewer®_com/yahoo/yahooadv4/_default.htm"
media-type = "text/html"/>
<item id = "resource1_2_0" href = "~/vacation_opf_files\www_FlipViewer®_com\yahoo\
yahooadv4/pgleftb.jpg" media-type = "application/x-resource"/>
<item id = "item2" href = "~/vacation_opf_files/members2_myflipbooks_com/albumvac/message.php/
b1f1bf1c17ebb92014f82b3102b36718.htm" media-type = "text/html"/>
<item id = "resource2_2_0" href = "~/vacation_opf_files\members2_myflipbooks_com\albumvac\message.php/pgrightb.jpg" media-type = "application/x-resource"/>
<item id = "item3" href = "~/vacation_opf_files/1.jpg" media-type = "application/x-flp"/>
<item id = "resource3_2_0" href = "~/vacation_opf_files/pacvac2leftbg.jpg"
media-type = "application/x-resource"/>
<item id = "item4" href = "~/vacation_opf_files/2.jpg" media-type = "application/x-flp"/>
<item id = "resource4_2_0" href = "~/vacation_opf_files/pacvac2rightbg.jpg"
media-type = "application/x-resource"/>
<item id = "item5" href = "~/vacation_opf_files/3.jpg" media-type = "application/x-flp"/>
<item id = "item6" href = "~/vacation_opf_files/4.jpg" media-type = "application/x-flp"/>
<item id = "item7" href = "" media-type = "application/x-flp"/>
<item id = "resource7_2_0" href = "~/vacation_opf_files/pacvac2bk.jpg" media-type = "application/x-resource"/>
</manifest>

<spine>
<itemref idref = "item0" page_background = "texture:resource0_2_0"
pageside = "right" index = "no"/>
<itemref idref = "item1" page_background = "texture:resource1_2_0"/>
<itemref idref = "item2" page_background = "texture:resource2_2_0"/>
<itemref idref = "item3" page_background = "texture:resource3_2_0"/>
<itemref idref = "item4" page_background = "texture:resource4_2_0"/>
<itemref idref = "item5" page_background = "texture:resource3_2_0"/>
<itemref idref = "item6" page_background = "texture:resource4_2_0"/>
<itemref idref = "item7" page_background = "texture:resource7_2_0"
pageside = "left" index = "no"/>
</spine>
< /package>

 
>> Back to Content
"We wanted to offer something different to our readers, and putting the magazine online in this format enabled us to provide them with a multimedia experience unlike any other paintball magazine...

We chose E-Book Systems' technology because of all the extra elements it has allowed us to incorporate into publishing our digital issues...

Since introducing the digital issues, the reader response has been overwhelmingly positive...

We've seen the numbers for our online subscriptions growing steadily, with a 100% increase in online subscriptions ..."
- Cheryl Amaya,
   Publisher of Paintball 2Xtremes

  Home Site Map Terms of Use Privacy Policy (Updated 27 Oct 2005)