Imageflow (coverflowish JS animation)

[Timos-Welt]

==============
   ImageFlow v2.08
==============

What it does:
--------------
Displays a coverflowish JavaScript animation of pics from a meta album (random files, last additions, most viewed or top rated) on album list page. Can make use of the plugin EnlargeIt!
The animation can be controlled by:
- click on a pic
- arrow keys
- double click or single click on active pic opens intermediate page
No flash needed, so every modern browser works.
This plugin has been created for cpg1.4.x.

Requirements:
---------------
- Your server must run PHP 4.3.2 or above
- GD2 extension has to be installed

Browser Compatibility:
-----------------------
The animation is tested to be fully compatible with these browsers:
- IE 6
- IE 7
- Firefox 2.x (Win)
- Firefox 2.x (Linux)
- Opera 9.x (Win)
- Opera 9.x (Linux)
- Safari 3.1 (Win)
- Konqueror 3.5.x (Linux)
It probably works fine in many other browsers, too.

=========================================================================

How to install:
---------------
* Download v2.07
* Uninstall any previous version
* Unzip
* Upload folder 'imageflow' into Coppermine's plugins folder
* Go to plugin manager page and install it
* Empty your browser cache

How to enable:
---------------
* To enable this plugin, you'll have to add "imageflow" to "the content of the main page" in coppermine's config in the section "Album list view". The setting should look like "breadcrumb/catlist/alblist/imageflow" or similar. For details, review the documentation that comes with coppermine (inside the docs folder) in the section "The gallery configuration page" > "Album list view" > "The content of the main page".

How to configure:
-------------------
* Use the additional button 'Imageflow' in admin menu.

=========================================================================

Settings in detail:
--------------------
see README.TXT

=========================================================================

Credits:
----------
This plugin is written by Timos-welt.
The plugin uses the incredible ImageFlow script. See http://imageflow.finnrudolph.de
Please note: The author of the Imageflow javascript changed the license of his script with version 1.0, so you have to pay for commercial use now. This release is based on an older Imageflow version (0.9) that is absolutely free, so you may use it wherever you want. Look here for details.
Parts of the code are adapted from the great CPG plugins 'Onlinestats' and 'Highslide' by Nibbler and Sami.
Don't try to contact the plugin author for support - post on the board publicly instead.

=========================================================================

Change log:
-------------

v2.08 (2008/12/11)
------------------
fixed: IE would display unwanted tooltips
fixed: IE6 sometimes crashed with a strange error report ('member not found')

v2.07 (2008/11/18)
------------------
Fixed global use of $matches in mainpage function.

v2.06 (2008/11/05)
------------------
EnlargeIt! can now be used to play youtube movies, though these will not appear as thumbs in imageflow

v2.05 (2008/09/15)
------------------
fixed a bug with Firefox 3 that would lead to ugly selections when using the slider

v2.03 (2008/08/27)
------------------
fixed a bug that would lead to double id's (invalid XHTML) if not enough pics in cat
added french translation

v2.02 (2008/07/10)
------------------
faster reaction with EnlargeIt! plugin
removed BOM from one of the JS files

v2.0 (2008/06/16)
-----------------
* Works together with EnlargeIt! plugin.

v1.72 (2008/05/11)
------------------
* New EnlargeIt! version 0.94 fixes two bugs
* Dutch language file added (thanks Hein)

v1.71 (2008/05/09)
------------------
* Fixed a bug where pics wouldn't be displayed when no intermediate pic had been
 generated
* Changed the way the script is integrated into the header for better
 compatibility with bridged and/or heavily modded gallerys
* New EnlargeIt! version 0.93 with more options
* Added italian language (contribution by user ngul)

v1.7 (2008/05/03)
-----------------
* EnlargeIt! integration (see http://enlargeit.timos-welt.de) - really nice effect with ImageFlow
* much better support of pics with funny filenames

v1.5 (2008/04/16)
-----------------
* now out of the box compatible with Highslide, Slider and most other Javascripts
* corrected JS syntax to make it packable, the JS is now only 5,5 kByte in
 size, unpacked version is still included as 'imageflow_source.js'

V1.4 (2008/03/31)
-----------------
* the Imageflow container now has correct height for pics with relations width:height
 from format 2:3 to 20:1, so they won't overlap the borders anymore
* if Imageflow width is set to a fixed pixel value (e. g. 800px), the reflexion
 images will be generated exact in size to fit. This greatly improves image
 quality and loading speed, because the images needn't to be interpolated by
 the client browser when having their maximum size while in focus; therefore,
 it's highly recommended to use a fixed px value instead of a % setting for
 Imageflow width
* improved animation - all pics now on a straight line like in original coverflow
* finally full compatible with Highslide 3.03

v1.3 (2008/03/28)
-----------------
* fixed a bug where pics wouldn't be displayed if no intermediate size image had been
 generated
* fixed a bug where Imageflow would possibly prevent other plugins from working

v1.2 (2008/03/28)
-----------------
* new option to select meta album (random files, last additions, most viewed, top rated)
* new option to display imageflow in a standard table of the theme with caption; this way,
 Imageflow can replace one of the meta album contents completely (e. g. top rated pics)
* now works as intended in multi-user galleries
* if there's not enough pics in a category, they will be repeated to give at least 5 pics
 to prevent the Imageflow animation from crashing
* if there's not a single pic in a category, the plugin will display random pics from the
 whole gallery
* if there's not a single pic in the whole gallery, a dummy pic will be used to prevent
 the Imageflow animation crashing
* a few performance improvements in codebase.php

v1.1 (2008/03/26)
-----------------
* Fullsize display didn't work anymore - fixed.
* Option 'Imageflow is inside a table' now works as expected;
 as it doesn't harm normally, standard value is now 'Yes'.

v1.0 (2008/03/22)
-----------------
* initial release

[Edit GauGau 2010-03-05]
This plugin has been added to the subversion repository: http://coppermine.svn.sourceforge.net/viewvc/coppermine/branches/cpg1.4.x/plugins/

It has been updated as well to reflect the version checking routines in the plugin manager that are meant to make sure that galleries don't break because of plugins installed that aren't meant for that particular version of the gallery.

Download: https://sourceforge.net/projects/coppermine/files/Plugins/1.4.x/cpg1.4.x_plugin_imageflow_v2.9.zip/download
[/Edit]

[Timos-Welt]

==============
Imageflow external
==============

Update v1.2 (2009/03/31):
--------------------------
* compatible with Firefox 3.x
* compatible with Nibbler's YouTube mod

Update v1.1 (2008/05/12):
--------------------------
* Pics now on a straight line like in original coverflow
* Links now open in seperate window

What it does:
--------------
This little add on generates an Imageflow animation on a seperate page, that can be included via iframe. The add on works completely indepent of the original plugin. The plugin needn't even to be installed at all (though it doesn't harm to have it installed as well). This add on cannot be configured using the plugin config page; the parameters have to be set in file imgflow_external.php.

This add on cannot replace the plugin, it will e. g.
- only work on public galleries,
- it will only display pics that are available to anonymous users,
- the image quality will be inferior to the plugin,
- and it will not allow the generated reflexion images to be cached.

It is meant as a solution for those, who can't use the plugin for the following reasons:
- The Imageflow animation should be displayed on a seperate page that's not part of the gallery, e. g. the start page of your website.


Demo:
-------
http://cpgdev.timos-welt.de/cpg1416/imgflow_external.php


Installation:
-------------
- unzip
- open imgflow_external.php with a decent text editor
- set the parameters as you wish
- upload the 6 files to your gallery root


How to use it:
--------------
- open http://path.to.your.gallery.root/imgflow_external.php
- include it via <iframe> on the page where you want it to be displayed
- if you don't know what an <iframe> is, use google
- if you googled and still don't know how to include it on your page, please use the plugin instead


Uninstall:
----------
- delete the 6 files from your gallery root (their name starts with imgflow_)
- done

[Sami]

Didn't try it yet but it looks nice on your demo site.
Great job , fantastic

[Hein Traag]

Nice one Timos. Looks really smooth 

[Joachim Müller]

Excellent plugin - I absolutely love it, since it doesn't require flash. I tested it on my local testbed (not available on the internet) - here are my test results: there is an issue with the position of the images floating on top (no matter if I select yes or no for "Imageflow is inside a table") - they are outside of the black background no matter what setting I use for "Correct upper border of animation" - see screenshot. I will test this later on my Windows-driven testbed as well.

My testbed is

• Firefox2.0
• Ubuntu Linux
• cpg1.4.17 (SVN checkout, not released yet)
• classic theme

These are my settings:

• "the content of the main page" -> "breadcrumb/catlist/alblist/imageflow/random,2/lastup,2"
• "Width of Imageflow" -> 870px
• Number of pics -> 15
• Background color -> 000000
• Skip pics in portrait orientation -> yes
• align -> center
• Imageflow is inside a table -> no
• Correct upper border of animation -> 0 (doesn't matter though what I have set this to)
• Generated reflexion images have 
  size of normal intermediate pics in percent -> 66%
• Cache generated reflexion pics -> no

Your demo looks as expected, so this must be something on my end.

[Pascal YAP]

Yo Timos-Welt,

I'll push your Karma with one Point again
So nice plugin : APPLAUD

PYAP

ps : Thanx Joachim about your screenshot ! The Pix in middle is mine 

[Timos-Welt]

Thanks everyone for testing. Just released v1.1.

Joachim: v1.1 should fix your issue with the classic skin.

Update 1.0 => 1.1
Make sure to uninstall the plug before updating. Replace folder plugins/imageflow with the one from the new ZIP. Then re-install.


Have fun! 
Timo

[Joachim Müller]

Timo,

thanks for the update. I did as you suggested and uninstalled v1.0, removed the folder, unzipped v1.1 into the plugins folder, installed the plugin, but alas no change - the same thing happens that used to happen before. Happens not only on the classic theme, but as well for eyeball, fruity, rainy day and water drop. Works as expected for hardwired, igames, project vii and mac ox x.
Then I figured out that I needed to refresh the browser cache ([Ctrl]+[F5]), which improved the situation dramatically, so the problem basically was a PEBKAC-issue. However, I suggest adding a note to the instructions (and even the imageflow config page) that you need to force-refresh your browser after changing any settings (even though I have set "Cache generated reflexion pics" to "no").
A side-note though: the toggle "Imageflow is inside a table" does not work as advertized - it doesn't wrap the output of imageflow into a table, so I guess it hasn't been implemented. I suggest as well to review the use of <center> - it is deprecated and should be replaced with a corresponding <div>-container.

Again: thanks for your excellent work.

Joachim

[Timos-Welt]

Hi Joachim,

Then I figured out that I needed to refresh the browser cache ([Ctrl]+[F5]), which improved the situation dramatically, so the problem basically was a PEBKAC-issue.

It's always a good idea to empty your browser cache after changes in JS/CSS things. I removed v1.0 from the downloads because it's obsolete, so noone should have to update ATM. If there should be another version, I'll add a remark to empty browser cache.

that you need to force-refresh your browser after changing any settings

Wrong. The settings you can influence via the config page will not change anything of the static content (JS/CSS). All settings change their stuff in the actual page HTML, which normally shouldn't be cached if you generally prefer some alternation in life. 

the toggle "Imageflow is inside a table" does not work as advertized - it doesn't wrap the output of imageflow into a table, so I guess it hasn't been implemented

Wrong. The setting "Imageflow is inside a table" will wrap imageflow in an additional div container, which is neccessary if Imageflow is inside a table (or you'll encounter the problems you had in version 1.0 with certain skins). The setting could also be named "Skin has table-based layout", I'll probably rename it in a later version. Check yourself: Set this to 'no' and reload - classic skin (and the others you mentioned) will be broken again. Igames, hardwired etc. work without a problem. This option should have no impact if you use a skin that doesn't wrap things in tables.

I suggest as well to review the use of <center> - it is deprecated

I know that, but the use of <center> is - at least ATM - the only way to keep all browsers working. I tried to use a container element aligned to center, but it broke the Imageflow layout in some browser versions. There's no browser on the market that doesn't perfectly interpret the <center>-tag, so let's wait some more time changing this. Still too many people with IE6 on the road...

Again: thanks for your excellent work.

Thanks very much for your review!

Version 1.1 works as expected. I will remove the 'beta status' remark from the initial posting.

Have fun! 
Timo

[lurkalot]

I just installed this plugin, and love the effect. But I have a question.

Before I installed this plugin, and with a bog standard setup of coppermine.   If you click for example, Last uploads, or Top rated etc, you get a page with just those pics in.   Also if you click a users gallery, you see the pics from that user only.  With this plugin installed, when I click on a users gallery you still get random pics showing from other people in the imageflow. 

Is there a way to make this plugin display the users gallery in this way (just that users pics?), "top rated", "Last uploads", Last comments", "most viewed"

Not explaining myself too well, am I  .  So instead of random pics on every page, have it display only the pics from that users gallery, or from "top rated", "Last uploads", Last comments", "most viewed" as it would if the plugin were not installed.

This for me would make this plugin an absolute winner.

[Timos-Welt]

Hi lurkalot,

well, I cannot integrate Imageflow on every page of the gallery ATM (I simply don't know enough about Coppermine and PHP to do it). Imageflow will - not for the time being, but for some more weeks or months - be restricted to the main (album list) page in one instance.

What I can do: Let you select, which meta album to display via Imageflow. Attached, you'll find a beta version that can do this. See README.TXT for details.

To update, uninstall previous version, then copy folder imageflow to plugins directory, then re-install. No need to clear browser cache, because the static files aren't changed.

This release is beta and not really tested here, so please test it and report. I'm quite sure that it works as intended, but I cannot guarantee it.

regards
Timo

Edit: File removed, because v1.2 is released.

[lurkalot]

Timo, thank you very much for your reply.

I have now installed your 1.2 beta version and it works just fine.  Your getting very close to what I need, and at least it now has those new options.  Just a shame you can't get it to follow the user galleries, and display their latest pics etc.

Problem as I see it.  When I click on someones gallery, I'll see (assuming imageflow is set to show latest uploads) for example.  When I look at their gallery it's easy to mistake the images I see in imageflow as images that user has uploaded.  This could lead to confusion.  Hope you understand what I'm trying to say, I'm not moaning and really appreciate the work your putting in to this.  It's a great plugin. 

You can see your new version in action here.  www.cameracraniums.com  currently set to show latest uploads. 

[Timos-Welt]

Ahhh now I understand what you mean. As I said, I don't know everything about Coppermine - for example I don't use user galleries at all. From a users point of view it seems to be an own album list page for each user gallery. What you want should be absolutely no problem to implement, gimme some hours.

regards
Timo

[Timos-Welt]

Here's another beta that can do what you want.

Have fun 
Timo

Edit: File removed because 1.2 is released.

[lurkalot]

Here's another beta that can do what you want.

Have fun 
Timo

This is fantastic, thank you.  New beta is installed and working as I want.   Now this can be used on a community site, as well as a personal one.  Great work. 

All I have to do now is stop it from obscuring my nav buttons, any advice on how to do that?

Again you can see your new beta running here www.cameracraniums.com  set to latest uploads again.   

[Timos-Welt]

I'm glad that it works for you.

All I have to do now is stop it from obscuring my nav buttons, any advice on how to do that?

Set "Correct upper border of animation (value between -200 and 500)" to a higher value, e. g. 50.

regards
Timo

[Timos-Welt]

Just released v1.2.
If no show stopping bug is found, Imageflow v1.2 will be the last version for some time.

Language files wanted!

If you like to translate it, use the english.php from the lang folder, rename it to yourlanguage.php and translate the contents.

TIA
Timo

[hobert]

This is soooo cool, thank you for all the hard work.

I've got it installed as a replacement to the RANDOM section on my gallery @ http://www.hobert.net/gallery/ at the very bottom, but if the image does not have a fullsize one (ie, there is only the thumbnail and intermediate), I get a red "X" showing up.  Since you can see through it to the next image, it's not so much a bother, other than being annoying.

[lurkalot]

I'm glad that it works for you.

Set "Correct upper border of animation (value between -200 and 500)" to a higher value, e. g. 50.

regards
Timo

Thanks again, that worked just fine set at 50.  What a Great plugin. 

[Timos-Welt]

This is soooo cool, thank you for all the hard work.

I've got it installed as a replacement to the RANDOM section on my gallery @ http://www.hobert.net/gallery/ at the very bottom, but if the image does not have a fullsize one (ie, there is only the thumbnail and intermediate), I get a red "X" showing up.  Since you can see through it to the next image, it's not so much a bother, other than being annoying.

Fixed in 1.3, please update. The problem isn't that no fullsize pic is there (it is _always_ there), but that no intermediate image is being generated if the original image is too small or if it's deactivated in config. Both cases won't be a problem anymore with v1.3.

Have fun!
Timo