Jun 6th, 2008 | By dikiem | Category:Uncategorized | no comments | 452 views

Before switching to 3rd party hosting for my photography gallery, I used this really neat flash application called “SimpleViewer”. It works very well!

SimpleView Website: (HERE)
Wordpress Plugin For SimpleView: (HERE)

In order to see the SimpleViewer gallery, you must first have Flash installed. Click (HERE) to check the Flash version installed on your desktop.

If you wish to embed the SWFObject manually the old fashion way into Wordpress Post, you could use this plugin to assist you http://downloads.wordpress.org/plugin/kimili-flash-embed.1.4.2.zip

Simple Viewer FAQ

1. What Is Simple Viewer?
- Simple Viewer is a small application developed using Adobe Flash (formerly known as Macromedia Flash) allowing you to view your pictures.

2. Where Can I Find Simple Viewer?
- Vist their offical website at http://www.airtightinteractive.com/simpleviewer/

3. Is There An Offical FAQ For Simple Viewer?
- Yes. Visit their website and see their FAQ at http://www.airtightinteractive.com/simpleviewer/faq.html

4. How Do Add Text To Each Image?
- In the imageData.xml, you place the text or name of your image between the <CAPTION> tag.See Simple Viewer FAQ #14 http://www.airtightinteractive.com/simpleviewer/faq.html

5. Simpleviewer works fine in IE, but the thumbnails when clicked in Firefox having problem?
- Try commenting out fo.addParam(”wmode”, “transparent”) from the index file. Apparently version 1.7.1 seems to have problem with Firefox with this enabled.

6. How Do I Add Pictures To Existing Gallery?
- There are two methods to approach this. The automatic method and the manual method.

  • The automatic method is to first upload the additional pictures to the images directory and re-execute the script you did originally when setting up your gallery (i.e.: buildgallery.php). It will automatically create the thumbnail files and update the ImageData.xml file with the additional pictures.
  • The manual method is for you to upload the additional pictures to both the images directory and the thumbs directory. Afterward, manually update the ImageData.xml file to include the new images.

7. How Do I Get Simple Viewer To Display EXIF Info?

- One way is to modify the buildgallery.php file provided by Simple Viewer and include a small PHP function. See sample code below:


//Obtain EXIF Information From Pictures
$exif = exif_read_data($exif_file, EXIF, TRUE);
foreach ($exif as $key1 => $section1) {
foreach ($section1 as $name1 => $val) {
if ($name1 == "ApertureFNumber" && $key1 == "COMPUTED") {
$ApertureFNumber = "ApertureFNumber: ".$val;
} elseif ($name1 == "ExposureTime" && $key1 == "EXIF") {
list($a, $b) = split ("/", $val);
$ab = $b / $a;
$ExposureTime = "ExposureTime: 1/".$ab;
}

The piece off code above is a sample code you can embed within the buildgallery.php. Once this piece is completed, you will embed the variable code you’ve specified between the CAPTION tag. If you wish to dissect the modified buildgallery.php I did, click here if you are using version 1.71 of Simple Viewer. Click Here if you are using version 1.8 of Simple Viewer. The modified version of buildgallery.php will automatically create an imagedata.xml and index.php for each gallery you have. These sample version was modified based upon the directory structure I am using. You should at least basic understanding of PHP prior to dissect it and modify it. It was not intended for direct download and use without some modification for your environment.
In the sample.zip, it is structured exactly how you should have your gallery. Place the buildgallery.php in the main picture directory of where you have multiple galleries under.
For example, if your current directory structure looks as below:

/www/pictures

The pictures directory is where you store all your galleries.

/www/pictures/gallery1
/www/pictures/gallery2
/www/pictures/gallery3

in each of the gallery, you have the images and thumbs directory

/www/pictures/gallery1/images/
/www/pictures/gallery1/thumbs/

Place the buildgallery.php at /www/pictures/

Execute the buildgallery.php by pointing your url to http://www.yourdomain.com/pictures/buildgallery.php. This will auto-generate an imagedata.xml and index.php file for your each one of your galleries.

Modify the following variables:

$framecolor = "0xFFFFFF"; ---> will set frame color
$textcolor = "0xFFFFFF"; ---> will set text color
$framewidth = "1"; ---> will set frame width
$thumbnailcolumns = "11"; ---> will set number of columns for thumbnails
$thumbnailrows = "1"; ---> will set number of rows for thumbnails
$navposition = "bottom"; ---> will set thumbnails position in retrospec to the picture
$maxImageSize = "600"; ---> will set max image size
$bgcolor = "0x181818"; ---> will set background color

Modify the value 750 and 850 you see below in the buildgallery.php to set the weight and height of the flash object
$indexwrite .= ‘ var fo = new FlashObject(”viewer.swf”, “viewer”,”750″, “850″, “3″, “#000000″);’.$carreturn;

8. How Do I Use Simpleviewer With blogspot.com or myspace.com?
- See official FAQ On It @ http://www.airtightinteractive.com/simpleviewer/faq.html. See FAQ #25 - Example provided by Airtightinteractive: http://www.myspace.com/104862880 - My explanation below:
Requirements:

  • Use version 1.8 or higher of simpleviewer. Make sure the viewer.swf modification date is greater than 08/25/2006
  • Host your images and thumbnails on your own domain so you could reference it
  • Have basic understanding of HTML and able to modify the HTML file of myspace.com or blogspot.com

- Now For The Instructions:

  1. you need to create a directory on your domain to host the file. For example, create a directory called “myspace”. If access it via URL, it should be http://www.mydomain.com/myspace/
  2. In the gallery.xml file, use absolute path to the thumbnails and images path you’ve created in the myspace directory on your domain. For example images=”http://www.mydomain.com/myspace/images/” and thumbs=”http://www.mydomain.com/myspace/thumbs/”
  3. Embed this piece of code in the myspace.com or blogspot.com template
    <embed src=”http://www.mydomain/myspace/viewer.swf” FlashVars=”xmlDataPath=http://www.mydomain.com/myspace/gallery.xml” bgcolor=#000000 WIDTH=400 HEIGHT=500 TYPE=”application/x-shockwave-flash”></embed>
  4. Adjust the height=”" and width=”" in above to accordingly to fit the blog website
  5. See my sample @ http://www.myspace.com/smilepak
  6. Download sample XML file I had generated by clicking here

9. Why use SWFObject vs Flash Embed
- You can read up on it at http://blog.deconcept.com/swfobject/#whyitsbetter

10. Who uses SimpleViewer?
- Many professional large corporation actually uses SimpleViewer. Here are some.

  • http://www.teslamotors.com/design/gallery-body.php


Leave Comment