Skip to main content

This site requires you to update your browser. Your browsing experience maybe affected by not having the most up to date version.

Widgets

Discuss SilverStripe Widgets.

Moderators: martimiz, Sean, biapar, Willr, Ingo, swaiba, simon_w

ImageFlow Module for Silverstripe


Reply

8 Posts   1939 Views

Avatar
Johann

7 September 2010 at 3:50am (Last edited: 29 November 2010 1:46am), Community Member, 4 Posts

IMAGEFLOW FOR SILVERSTRIPE HAS ARRIVED!

This module implements the ImageFlow picture gallery.
ImageFlow has been created by Finn Rudolf (http://finnrudolph.de/ImageFlow).

As long as the modul is not available at silverstripe (which might take up to 4 weeks...), feel free to download the silverstripe module from here: http://www.johann-oberdorfer.eu/cms/blog/imageflow-module-for-silverstripe/

More documentation about installation, etc. 'll follow soon.

Installation procedure in brief:

  • * copy the module wherever you like in your source tree (typically down below "mysite") and unzip it.
  • * Run <my-site>/dev/build?flush=1 and ...
  • * you are ready to create a "CustomImageFlowPage" within the cms!
  • * After saving the customized page for the 1st time - the configuration parameters for the gallery appear (usual behavior).
  • * Specify a CMS folder where your images are available (different image sizes do not matter)
  • * if you would like to have transparent shades, you need to ensure, images are *.png files - (reflectionPNG = true)
  • * if you would like to have a customized background, you need to change the underlying css...
  • * configuration parameters are pretty self explanatory

Important note:

In order to get the shading mechanism to work, you need to copy reflect2.php and reflect3.php into your web-root directory!
Otherwise you won't get images with shading. Both scripts are included in the zip in a sub directory called 'imageflow'.

The author of ImageFlow has asked me to add information of the license model:

ImageFlow is licensed under a Creative Commons Attribution-Noncommercial 3.0 Unported License. This means you need the author's permission to use ImageFlow on commercial websites The commercial use requires the purchase of a license under: http://finnrudolph.de/ImageFlow/Download.

Silverstripe module: The module itself is distributed under a BSD license though.

-- enjoy --

Avatar
theoldlr

10 November 2010 at 5:36am Community Member, 103 Posts

Your installation instructions don't work for me. Nothing happens at a /dev/build. There is no _config.php in the module's directory... adding one creates fields in the DB but the new page types are not available in the cms.

Avatar
jessstaus

11 November 2010 at 2:19am (Last edited: 11 November 2010 2:20am), Community Member, 2 Posts

Same thing here, it seems like something is missing in the module which is shipped with the .zip file

Avatar
Axel Larator

13 November 2010 at 9:40am Community Member, 2 Posts

Hello Folks,

The same with me, it's not working inside SilverStripe. The out of the box example index.html works flawless and is a good source for playing with the options. The /dev/build created new fields but still nothing happens after that.
The examples on the FinnRudolph pages prevented saving of the Admin module. Only after modifications I could create a page. Also I modified page.ss.
Now I have a working page with three pictures but no image flow.

Suggestions are highly welcome

Axel

Avatar
GRiiDWeb

13 November 2010 at 11:16am Community Member, 60 Posts

It seems the .DS files are Mac only files, so it's not going to work unless these are converted/rewritten.
It looks a great module, so if any clever bods can improve or help out to get a working one, we await with excitement.

P.

Avatar
Johann

29 November 2010 at 1:40am (Last edited: 29 November 2010 1:47am), Community Member, 4 Posts

Sorry to reply a bit late. I didn't subscribe to this topic, so I wasn't aware, there's something going on out here...
Pls. ignore the .DS files (not relevant at all - related to mac's spotlight internal database - should have been really left out).

Did you also copy the required .php files to your web root as described?

In order to get the shading mechanism to work, you need to manually copy reflect2.php and reflect3.php into your web-root directory! Otherwise you won't get images with shading. Both scripts are included in the *.zip in a sub directory called 'imageflow'.

I am going to investigate some time to improve the module soon and also want to incorporate your feedback.
So, what to we have so far:
- missing _config.php -> as a workaround, pls. copy an empty _config.php in the module's root dir.
- no shading at all -> most likely related to missing reflect*.php files?!
- a modified page.ss -> need further information of what needs to be changed.
/Johann

Avatar
GRiiDWeb

3 December 2010 at 10:37am Community Member, 60 Posts

Hello,
Many thanks for the clarification. I will try out the module as per your instructions.
I'll offer as much feedback as I can also.

Thanks again

Paul

Avatar
Johann

3 December 2010 at 11:24am Community Member, 4 Posts

Hello Paul, thank you very much.
Typically there are 4 steps to achive:

1.) dev/build ... to establish data objects in your site's database schema (a CustomImageFlowPage should appear in your cms)
I like the idea to use "Custom" keyword to distinguish between build in page types and my custom once's.

2.) Upload images to your sites (down below your assets folder) as usual.

3.) Create a new CustomImageFlow page and declare your image directory in the CustomLayout notebook section.
Save your page - once this is done, your images are shown immediately in the HasManyComplexTableField list!

4.) Check out your Draft or Published Site to see if the image flow effect takes place.
You see empty boxes, but when you click on the box in the middle you get the image shown in a popup window?
This is an indication, the reflect2.php/reflect3.php file is missing!

Maybe you can tell me where you get stuck in-between?
Cheers, Johann

In the next release I am going to replace highslide with fancybox image viewer (which pop's up when you click on an image).