25.7.11

web album vanroekel analysis and operational (14-12-2010)

web album vanroekel analysis and operational  (14-12-2010)

closer look at 3rd party embed instructions referred to by vanroekel - here: SimpleViewer Embedding Guide - relevant to embedding pwa+php solution

A - general principles:
  • place entire contents of viewer/gallery folder in same folder that contains the html page (Page) in which the photos are to be viewed
  • locate and copy the "embed code"
  • paste the embed code in the body of Page where the album/gallery is to appear
  • load browser and test if it works
B - in the vanroekel solution files:
  • a separate html file is provided, from which the embed code is extracted
  • some code to paste in the header
  • some code topmast in the body
  • throw away code-donor html file after doing this
C - adjust variables width, height etc in the 'other files' comprising the viewer


vanroekel web album "web integrator"solutions
 

•    CONLUSIONS:
   
⁃    the best example so far
    ⁃    got it to work fine on local disc/browser basis, including feature adjustment controls
    ⁃    big questions:
    ⁃    how to get it working embedded on external website?
    ⁃    does it work with private Picasa albums?


•    features of "web integrator":
    ⁃    gives a lightbox style display
    ⁃    on top of a calender thumbnail layout
    ⁃    arrow and mouse navigation - good

    •    note first - the (8 steps) common installation instructions expressly for 4 of his 3rd party adapted solutions, namely below, but her refers to the same instructions for all 8 of them:
    ⁃    simpleviewer
    ⁃    autoviewer
    ⁃    tiltviewer
    ⁃    postcard viewer

•    his Picasa web album integrator product - which has its own install page instructions (in 6 steps - see below) and a different file system
    •    first - amend te pwi file - easy done
    •    then he says: Finally edit your existing webpage so it points to the needed css and js files (see index.html in download)

•    GOT IT - theory:
    ⁃    this means that inside the "index.html" file that comes with the vanroekel download package, the code is ready made to insert into the actual website in which the album is embeded
    ⁃    refer also to the how-to websites describing how the 'head' and 'body' of the album-hosting page need to include the code they provide

•    SUCCESS - in practice using firefox browser on a local file:
    ⁃    by amending the pwi-1.0.js file as per "Basic instructions", then opening the included 'html.index' file in mozilla, the browser takes me straight to my Picasa list of public folders listing albums by thumbnail
    ⁃    click on an album thumbnail to give:
          ⁃    a calendar of all pics, click on which gives a lightbox  effect which is mouse/arrow scrollable
          ⁃    an auto-slideshow scroll option:
                ⁃    goes through the entire album (seems to loop), has a black background
                ⁃    opens a separate browser window
                ⁃    actually takes you to the Picasa page [vanroekel demo doesn't do this????

⁃    look at all the great variables that can be adjusted, including the show slideshare option - here is an eg of some:
            //Album and Photo details to show or not
            var pwi_show_albumtitles = true;
            var pwi_show_albumdate = true;
            var pwi_show_albumphotocount = true;
            var pwi_show_albumdescription = true;
            var pwi_show_albumlocation = true;
            var pwi_show_slideshowlink = true;
            var pwi_show_photocaption = true;
            var pwi_show_photodate = true;


vanroekel web album "restyle Picasa"- auto solutions
    •    displays only all public galleries in Picasa
    •    the template has footers and other junk that needs to be purged from visibility
    •    takes you to "Gallery Home"
    •    here: Restyle your Picasa Web Albums - show your photos on your site!
    •    program it with:
          ⁃    username:
          ⁃    album name:
    •    instructions below


Appendix 1

additional embedding instructions for simpleviewer, some insight and guidance relevant to other solutions as well: SimpleViewer Embedding Guide

Appendix 2