59 users Sign-in to change your status

sfLightboxPlugin is a symfony plugin that provides an easy to use wrapper for the Lightbox2 javascript library. JavaScript

• Homepage
• Repository
• Report a bug
• Download package
• Browse source

sfLightboxPlugin is a symfony plugin that provides an easy to use wrapper for the Lightbox2 JavaScript library.

Developers

Name	Status	Email
Vernet Loïc	lead	rf.oohay <<ta>> lioc_frq

License

Plugin by COil & Demental.

Lightbox library is made by Lokesh Dhakar. (http://www.huddletogether.com/projects/lightbox2)

Modalbox modification by Demental (http://demental.info/blog/index.php?post/2007/01/11/75-introducing-modalbox)

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

Releases for sf 1.4

Version	License	API	Released
1.0.12stable	MIT license	1.0.12stable	09/04/2010

Releases for sf 1.3

Version	License	API	Released
1.0.12stable	MIT license	1.0.12stable	09/04/2010

Releases for sf 1.2

Version	License	API	Released
1.0.12stable	MIT license	1.0.12stable	09/04/2010
1.0.11stable	MIT license	1.0.11stable	09/05/2009
1.0.10stable	MIT license	1.0.10stable	06/04/2009
1.0.9stable	MIT license	1.0.9stable	04/04/2009

Releases for sf 1.1

Version	License	API	Released
1.0.12stable	MIT license	1.0.12stable	09/04/2010
1.0.11stable	MIT license	1.0.11stable	09/05/2009
1.0.10stable	MIT license	1.0.10stable	06/04/2009
1.0.9stable	MIT license	1.0.9stable	04/04/2009
1.0.8stable	MIT license	1.0.8stable	01/10/2008

Releases for sf 1.0

Version	License	API	Released
1.0.12stable	MIT license	1.0.12stable	09/04/2010
1.0.11stable	MIT license	1.0.11stable	09/05/2009
1.0.10stable	MIT license	1.0.10stable	06/04/2009
1.0.9stable	MIT license	1.0.9stable	04/04/2009
1.0.8stable	MIT license	1.0.8stable	01/10/2008
1.0.7stable	MIT license	1.0.7stable	22/04/2008
1.0.6stable	MIT license	1.0.6stable	02/03/2008
1.0.5stable	MIT license	1.0.5stable	27/04/2007
1.0.4stable	MIT license	1.0.4stable	24/04/2007
1.0.3stable	MIT license	1.0.2stable	16/04/2007
1.0.2stable	MIT license	1.0.2stable	26/03/2007
1.0.1stable	MIT license	1.0.0stable	21/02/2007
1.0.0stable	MIT license	1.0.0stable	07/02/2007

Join this plugin team

Other releases

Release 1.0.12 - 09/04/2010

Release 1.0.11 - 09/05/2009

Release 1.0.10 - 06/04/2009

Release 1.0.9 - 04/04/2009

Release 1.0.8 - 01/10/2008

Release 1.0.7 - 22/04/2008

Release 1.0.6 - 02/03/2008

Release 1.0.5 - 27/04/2007

Release 1.0.4 - 24/04/2007

Release 1.0.3 - 16/04/2007

Release 1.0.2 - 26/03/2007

Release 1.0.1 - 21/02/2007

Release 1.0.0 - 07/02/2007

sfLightboxPlugin

sfLightboxPlugin is a symfony plugin that provides an easy to use wrapper for the Lightbox2 Javascript library.

It adds a new helper file : LightboxHelper with 6 new functions:

• light_image, to display an image (with lightbox) on an image link
• light_image_text, to display an image with a text link
• light_slideshow, to display a slide show with an image set
• light_slide_image, to display a slide show with an image link
• light_slide_text, to display a slide show with a text link
• light_modallink, to display a modal popup with any content

Installation

• For symfony 1.0.x

  > symfony plugin-install http://plugins.symfony-project.com/sfLightboxPlugin
  

You need to upgrade the Prototype version used by symfony because Lightbox 2.04 requires at least Prototype v1.6.0.2 and symfony 1.0.x is bundled with prototype v1.5.x. Download the last version of scriptaculous and copy the js files in the /sf/prototype/js directory. If you used the svn version of the plugin, don't forget to copy the /plugin/sfLightboxPlugin/web as /web/sfLightboxPlugin.

• For symfony 1.1.x, 1.2.x, 1.3.x, 1.4.x

  > symfony plugin:install sfLightboxPlugin
  

(or check out from the svn repository: http://svn.symfony-project.com/plugins/sfLightboxPlugin and publish the assets with the symfony plugin:publish-assets task)

• symfony 1.2.x specific, the sfProtoculousPlugin must be activated (it is activated by default) and you must publish its assets. (be sure that you have a /sfProtoculousPlugin directory or this alias in your /web folder.

• symfony 1.3.x and 1.4.x specific

  • Enable the plugin

    public function setup()
    {
      $this->enablePlugins('sfLightboxPlugin', 'sfDoctrinePlugin');
    }

  • Then install by hand the Scriptaculous Javascript libraries. Then update your view.yml file to include the required scripts: (change the paths if you installed those libraries into another directory than /js)

    # /apps/config/apps/your-app/config/view.yml
    javascripts:
      - prototype.js
      - scriptaculous.js?load=effects,builder
    

• Clear you cache

  > symfony cc
  

Usage

1 - Declare the helper

<?php use_helper('Lightbox'); ?>

2 - To display a lightbox link to one image

Check the _single_images.php template inside the plugin module.

<h1>Single images</h1>
<hr/>
<br/>
<h2>&nbsp;&nbsp;&raquo; On an image link</h2>
<?php
$image_options = array('title' => 'Optional caption Image 1.');
 
// Test light_image
echo light_image(
    'http://www.huddletogether.com/projects/lightbox2/images/thumb-1.jpg',
    'http://www.huddletogether.com/projects/lightbox2/images/image-1.jpg',
    $image_options
);
 
echo '&nbsp;&nbsp;';
 
$image_options = array('title' => 'Optional caption Image 2.');
echo light_image(
    'http://www.huddletogether.com/projects/lightbox2/images/thumb-2.jpg',
    'http://www.huddletogether.com/projects/lightbox2/images/image-2.jpg',
    $image_options
);
 
?>
 
<br/><br/>
<h2>&nbsp;&nbsp;&raquo; On a standart text link</h2>
 
<?php echo light_image_text(
  '&raquo; Click me to see the image !! &laquo;',
  'http://www.huddletogether.com/projects/lightbox2/images/image-2.jpg'
);

3 - To display a slide show of several images

Check the _image_set.php template inside the plugin module.

<br/><br/><br/>
<h1>Image set</h1>
<hr/>
<br/>
<h2>&nbsp;&nbsp;&raquo; For all images of the set</h2>
 
<?php
 
// To display a slide show of several images
$images[] = array(
    'thumbnail' => 'http://www.huddletogether.com/projects/lightbox2/images/thumb-3.jpg',
    'image'     => 'http://www.huddletogether.com/projects/lightbox2/images/image-3.jpg',
    'options'   => array('title' => 'Roll over and click right side of image to move forward.')
);
 
$images[] = array(
    'thumbnail' => 'http://www.huddletogether.com/projects/lightbox2/images/thumb-4.jpg',
    'image'     => 'http://www.huddletogether.com/projects/lightbox2/images/image-4.jpg',
    'options'   => array('title' => 'Alternatively you can press the right arrow key.')
);
 
$images[] = array(
    'thumbnail' => 'http://www.huddletogether.com/projects/lightbox2/images/thumb-5.jpg',
    'image'     => 'http://www.huddletogether.com/projects/lightbox2/images/image-5.jpg',
    'options'   => array('title' => 'The script preloads the next image in the set as you\'re viewing.')
);
 
$images[] = array(
    'thumbnail' => 'http://www.huddletogether.com/projects/lightbox2/images/thumb-6.jpg',
    'image'     => 'http://www.huddletogether.com/projects/lightbox2/images/image-6.jpg',
    'options'   => array('title' => 'Press Esc to close')
);
 
$link_options = array(
    'title'     => 'Lightbox2',
    'slidename' => 'lightbox',
);
 
 
echo light_slideshow($images, $link_options);
?>
 
<br/><br/>
<h2>&nbsp;&nbsp;&raquo; For all images of the set as an html list</h2>
 
<ul>
<?php
 
$link_options = array(
    'title'     => 'Lightbox2-list',
    'slidename' => 'lightbox_list',
);
 
  echo light_slideshow($images, $link_options, true); ?>
</ul>
 
<br/><br/>
<br/>
<h2>&nbsp;&nbsp;&raquo; On one image (of the set or not)</h2>
 
<?php
$link_options = array(
    'title'     => 'Lightbox2-image',
    'slidename' => 'image_link_to_lightbox_slideshow',
);
 
echo light_slide_image(
  'http://gallery.coilblog.com/d/16-2/big_eyes_cat.jpg',
  $images,
  $link_options);
?>
 
<br/><br/>
<br/>
<h2>&nbsp;&nbsp;&raquo; On a text link</h2>
 
<?php
 
$link_options = array(
    'title'     => 'Lightbox2-tewt',
    'slidename' => 'text_link_to_lightbox_slideshow',
);
 
echo light_slide_text('Click me to show the slide !!', $images, $link_options);

4 - To display a modal box with the content of the result of a symfony action

Check the _modalbox.php template inside the plugin module.

<hr/>
<br/><br/><br/>
<h1>MODAL BOX</h1>
<hr/>
 
<?php
// Modal Lightbox plugin test
$link_options = array(
    'title' => 'sfLightboxPlugin',
    'size'  => '550x200',
    'speed' => '6'
);
 
// or
//$link_options='title=sfLightboxPlugin size=450x180 speed=5';
//$link_options='title="sfLightboxPlugin" class=resizespeed_5 blocksize_450x180';
 
echo light_modallink(
  '&raquo; Link to test the modal box &laquo;',
  'sfLightboxPlugin/modal',
  $link_options
);

Of course here i use external images, but you can put path related to your images directory as you would do with the standard symfony image_tag function.

You can change the class or options to adjust the wanted size or speed. You can use a route instead of a 'module/action'. Moreover the plugin includes a demo as a module, just enable the sfLightbox module in your settings.yml file then call the demo in your application http://www.domain.com/sfLightbox. You can also check the live demo on my symfony blog.

Be careful, if you have deleted the default symfony route you'll need to add one like the following to be able to view the demo included in the plugin:

sfLightbox:
  url:   /sfLightbox/:action
  param: { module: sfLightbox, action: test }

That's all, have fun, COil ;)

Versions

(check the changelog TAB since the 1.0.7 version)

• 1.0.6

  • Updated lightbox library to v2.03.3
  • 3 new new helpers (light_image_text, light_slide_image, light_slide_text)
  • Slideshow navigation with the keyboard (left, right, ESC)

• 1.0.5

  • Added a demo as a symfony module that does the excalty the same as the official demo page of the library
  • Change options handling for light_modallink to allow 3 different syntaxes

• 1.0.4

  • LightboxHelper.php: When creating a slideshow the caption of the images are now taken from the title attribute of each images if it exists whereas it is taken from the title attribute of the link if not (before it was always taken from the title link attribute)

• 1.0.3

  • modalbox.js now allows to call initModalbox several times (in case a modal link is created dynamically, after page load). Don't forget to call initModalbox() again when you create a new modal link.
  • config.php: corrected wrong paths stored in config

• 1.0.2

  • Helpers enhancements, options are now parsed so they can be scalar or array, just like the link_to helper light_modallink : added 'speed' and 'size' options (using regular classes is still allowed to keep BC)
  • modalbox.js fixes: removed some unused, unitialized variables that could cause JS errors in IE6 in some cases.
  • File structure changes:
  • Removed the 'lightbox' folder in web/css, web/js and web/images
  • Prepared for next release in web/images, as closelabel.gif will be culture-dependent

• 1.0.1

  • Some bug fixes in modalbox.js and also modalbox.css which affected IE6/7 and Opera.
  • Renaiming of some html identifiers in modalbox to allow use of modalbox and lightbox in the same document. (more info in modalbox.js file)
  • Modified default close image from 'closelabel.gif' which was culture dependent to 'close.gif' (only a close cross).

• 1.0.0

  • First version

---

This plugin is sponsored by SQL Technologies