Yii 1.1: nivoslider

DEPRECATED. Nivo Slider, the most awesome jQuery image slider [Óutdated]
25 followers

DEPRECATED.

Yii version of Nivo Slider.

This release is an alpha version, no bugs related yet.

New features:

  • Dynamic id generation
  • Dynamic div, images, captions an links generation
  • Fixed styles sheets
  • Images assets retouched.

Please report bugs at Forum topic.

Features

  • 9 unique transition effects
  • Simple clean & valid markup
  • Loads of settings to tweak
  • Built in directional and control navigation
  • Packed version only weighs 7kb
  • Supports linking images
  • Keyboard Navigation
  • Free to use and abuse under the MIT license

Browser support

  • Internet Explorer v7+
  • Firefox v3+
  • Google Chrome v4
  • Safari v4
  • Opera v10.5

Please support the original creator.

Resources

Donate

Documentation

Requirements

  • Yii 1.0 or above

Installation

  • Extract the release file under protected/extensions

Usage

Put the follow code into your views.

$this->widget('application.extensions.nivoslider.CNivoSlider', array(
    'images'=>array( //@array images with images arrays.
        array('src'=>'path/to/image'), //only display image.
        array('src'=>'path/to/image', 'caption'=>''), //display image and nivo slider caption.
        array('src'=>'path/to/image', 'url'=>array('')), //display image with link.
        array('src'=>'path/to/image', 'url'=>array(''), 'caption'=>''), //display image with nivo slider caption and link reference.
        ),
    )
);

Try others combinations. See configuration parameters bellow.

Parameters you could set on CNivoSlider

id              =   @string, the id of the nivo slider div. Defaults set to dynamic generation.
htmlOptions     =   @array, the html options of the nivo slider div. Defaults set to null.
fancy           =   @boolean, toggle the defaults fancy style. Defaults set to true.
cssFile         =   @string, path to custom style sheet.  Defaults set to NULL.
config          =   @array, configuration parameters of nivo slider jquery. Defaults set to basic configuration.
images          =   @array containing the images arrays of the widget. Defaults set to NONE.

Goto Nivo Slider website to check nivo slider configuration parameters.

Parameters you could set inside images array

src         =   @string, the path of image,
caption     =   @string, the nivo slider caption of image,
imageOptions=   @array, the html options of image tag
url         =   @array or @string, the path of link,
linkOptions =   @array, the html options of link tag

Change Log

July 24, 2010

  • Initial release.

July 28, 2010 - 2.0 alpha

  • All class code has been rewritten to be more flexible, dynamic and elegant
  • Implemented simple usage
  • Implemented dynamic id generation
  • Implemented dynamic div, images, captions and links generation
  • Implemented dynamic set of images html options and link html options.
  • Fixed nivo-slider.css. Now images with link have cursor pointer.
  • Fixed bullets positioning on fancy-nivo-silder.css.
  • arrow.png and bullets.png have been retouched.
  • Removed the loading.gif asset.

December 06, 2010

  • Fixed some bugs.

Total 8 comments

#9470 report it
jurassic82 at 2012/08/14 09:51am
Little bug if you pretend to use two or more NivoSliders in the same page

Since the Yii script registration is being done with the class name (line 79 of ENivoSlider.php):

Yii::app()->getClientScript()->registerScript(__CLASS__, "
$('#".$this->htmlOptions['id']."').nivoSlider($config);
");

It will register just the last widget you use. To solve this, just change for example to the "id" of the htmlOptions (if you don't declare "id", line 48 will take the getId() of the class).

Yii::app()->getClientScript()->registerScript($this->htmlOptions['id'], "
$('#".$this->htmlOptions['id']."').nivoSlider($config);
");
#9073 report it
Junior - df9 at 2012/07/17 08:42pm
How to get multiple instances on the same page

Hi, thanks for the ext

I'd like to suggest that you change line 79 inside ENivoSlider to : Yii::app()->getClientScript()->registerScript(CLASS.$this->htmlOptions['id']

Adding the "id" to the script name so we can have multiple instances of the widget on the same page

Also, Usage on this page is indicating wrong class name: $this->widget('application.extensions.nivoslider.CNivoSlider', array(

should be $this->widget('application.extensions.nivoslider.ENivoSlider', array(

=))

Regards!

#7236 report it
WebDevPT at 2012/03/06 06:13am
Thank you!

Thank you very much, keep up the good work.

My suggestion to make this even better is to change it a bit so we can use a folder with images to display all images inside that folder instead of a new array with path, caption and other parameters for each image.

Keep up the good work.

#5056 report it
TomTheGeek at 2011/09/10 04:51pm
No pics problem

I could see captions rotating but no pics, turns out width and height has to be set or you see nothing.

$this->widget('application.extensions.nivoslider.ENivoSlider', array(
    // set the width and height to see the pictures.
    'htmlOptions'=>array('style'=>'width: 400px; height: 200px;'),
    'images'=>array( //@array images with images arrays.
        array('src'=>Yii::app()->request>baseUrl.'/images/image.jpg',
              'caption'=>'Picture two',
              'linkOptions'=>array(),
             ),
        ),
    )
);
#4621 report it
Asgaroth at 2011/07/26 10:17pm
@Bug

To the suggested modification i had to change line 99 to

echo CHtml::image($item['src'], $options['title'], $options)."\n";

Otherwise im forced to set a caption or get a "Undefined index: caption "

#3696 report it
jacmoe at 2011/04/29 12:18am
Great work!

Really nice extension!

I had to modify one function to make it work, though:

public function renderImages($items)
    {
        foreach($items as $item) {
                        $options=isset($item['imageOptions']) ? $item['imageOptions'] : array();
                        $link_options=isset($item['linkOptions']) ? $item['linkOptions'] : array();
 
            if (isset($item['caption'])) {
                $options['title']=$item['caption'];
            } else {
                            $options['title'] = '';
                        }
 
            if (isset($item['url'])) {
                echo CHtml::link(CHtml::image($item['src'], $item['caption'], $options), $item['url'], $link_options)."\n";
            } else {
                echo CHtml::image($item['src'], $item['caption'], $options)."\n";
            }
        }
    }
#2432 report it
DarkNSF at 2010/12/30 12:07pm
Fix for this extension

Download the latest version of NivoSlider and copy over the existing library in assets.

http://nivo.dev7studios.com/

#2427 report it
DarkNSF at 2010/12/29 05:52pm
Broken

Appears to be broken with jQuery 1.4.4 which is bundled with Yii Framework 1.1.5

Leave a comment

Please to leave your comment.

Create extension
  • Yii Version: 1.1
  • License: MIT License
  • Developed by: thiagovidal
  • Category: User Interface
  • Votes: +14 / -2
  • Downloaded: 3,955 times
  • Created on: Jul 24, 2010
  • Last updated: Sep 18, 2013