Creating a Flex photo gallery with robust web-based admin

Creating a Flex photo gallery with robust web-based admin

This is a method of using the SlideShowPro Director backend and integrating it with a Flex-built photo gallery

http://slideshowpro.net/products/slideshowpro_director/slideshowpro_director

screenshot:

Here’s a (very simple) example of a gallery: (right click for source)
http://www.actionfiguremusic.com/sspTester/

Here’s another example

Note: As far as I can tell, this use does not violate SlideShowPros Terms of Service, however, if you implement this solution you do so at your own risk. Please read their TOS first!)

What you will need:
SlideShowProDirector (I’m using 1.0.9.9 so I can only assure that it works for this version)
Flex 2+
Hosting with PHP
mysql database

What is SlideShowPro?

SlideShowPro is a photogallery system for flash that has a very limited (in terms of flexibility) front end, with a fantastic back-end admin tool.
The flash component front-end is usable unless you encounter a designer or client that wants a highly customized gallery (most of them).

I’ve had this for a while, but only recently decided to integrate it with flex, because it’s a great tool, but was collecting dust because of the front-end.

First of all you need to purchase (I think it’s $29 – fair price) and install ssp_director. They have pretty good docs, and mysql etc is beyond the scope of this, but I’ll give a quick run-through:

1) set up a mysql database.
2) upload the ssp_director folder to your server
3) enter the path to the folder in your browser, and gpo to it, this will initiate installation
4) it will check for system requirements – you will probably have to change permissions on a few folders.
5) log into director, play around with the interface a bit – add an album and upload a few photos: please check out their docs on how to do this – if it doesn’t seem self explanatory

Note: ssp_director supports multiple galleries and albums (sets of galleries) – this particular solution in it’s current state only works for 1 gallery.

By this point you should have a gallery set up with a few photos in it.

Now for the fun part.

Create a php document called getImages.php cut/paste the following code and upload it to your server.

<?php
//SQL Connection Info – update with your database, username & password
$connection = mysql_connect(‘localhost’, ‘username’, ‘password’) or die (‘cannot reach database’);
$db = mysql_select_db(“databaseName”) or die (“this is not a valid database”);

$result = mysql_query(“SELECT * FROM ssp_images WHERE ssp_images.src != ‘NULL’ ORDER BY seq ASC”);

//Get the number of rows
$num_row = mysql_num_rows($result);

//Start the output of XML
echo ‘<?xml version=”1.0″ encoding=”iso-8859-1″?>’;
echo “<data>”;
echo ‘<num>’ .$num_row. ‘</num>’;
if (!$result) {
die(‘Query failed: ‘ . mysql_error());
}
/* get column metadata – column name ————————————————-*/
$i = 0;
while ($i < mysql_num_fields($result)) {
$meta = mysql_fetch_field($result, $i);
$ColumnNames[] = $meta->name; //place col name into array
$i++;
}
$specialchar = array(“&”,”>”,”<”); //special characters
$specialcharReplace = array(“&”,”>”,”<”); //replacement
/* query & convert table data and column names to xml —————————*/

$w = 0;
while ($line = mysql_fetch_array($result, MYSQL_ASSOC)) {
echo “<row>”;
foreach ($line as $col_value){
echo ‘<’.$ColumnNames[$w].’>’;
$col_value_strip = str_replace($specialchar, $specialcharReplace, $col_value);
echo $col_value_strip;
echo ‘</’.$ColumnNames[$w].’>’;
if($w == ($i – 1)) { $w = 0; }
else { $w++; }
}
echo “</row>”;
}
echo “</data>”;
mysql_free_result($result);
?>

Here’s a (very simple) example of a gallery: (right click for source)
http://www.actionfiguremusic.com/sspTester/

This entry was posted in Flex. Bookmark the permalink.

Leave a Reply