EGalleria ¶
Version: 0.2 Author: Dimitrios Meggidis <tydeas.dr (at) gmail.com>
Description ¶
Yii extension to support the Galleria Javascript image gallery. The galleria files that are included are from commit: 373a3a77e83eef919046.
Install ¶
Extract the zip file under the extension folder and should look like. ~~~
./webapp/protected/extension/EGalleria
or use the github.com and clone the repository under the extension folder.
git clone https://github.com/dmtra/EGalleria
###Configuration
Add import of EGalleria extension in your config/main.php file:
```php
'imports'=>array(
...
'application.extensions.EGalleria.*'
...
),
```
###Use
You can use the widget in 2 diff ways. You can attach a dataProvider and the images will
be rendered from that provider or you can create the dom structure need for the galleria
plugin your own.
####With Dataprovider
To bind a dataprovider with the widget you need to specify at least which of the model attributes
is the url for the image.
This can be achieved in 2 ways:
- By passing "binding" attribute at the initialization of widget.
- Or adding EGalleriaBehavior in your model behaviors() function.
"Behavior" feature is usefull when you want to use same model for more than 1 EGalleria widget
so you don't have to define binding again and again.
#####Behavior definition
In your model (lets call it **ImageModel** ) behaviors() function add:
```php
class ImageModel extends CActiveRecord
{
...
public function behaviors()
{
...
'egalleria'=>array(
'class'=>'application.extensions.EGalleria.EGalleriaBehavior',
'image'=>'image_field_name', //This is a required binding and will be the src of image element
'description'=>'image_description', //Optional
'title'=>'image_title', //Optional
'link'=>'image_link', //NOT SUPPORTED IN CURRENT VERSION
'author'=>'image's_author' //NOT SUPPORTED IN CURRENT VERSION
),
...
}
...
}
```
#####Binding in initialization of widget
Check later in example. The available attributes are the same with the behavior above.
####Examples
In your view file add.
1. Use of dataprovider with behavior defined in model.
```php
$data = new CActiveDataProvider('ImageModel');
$this->widget('EGalleria', array(
'dataProvider'=>$data,
));
```
2. Define binding in init with no model behavior
```php
$data = new CActiveDataProvider('ImageModel');
$this->widget('EGalleria', array(
'dataProvider'=>$data,
'binding'=>array(
'image'=>'model_image_src_field',
),
));
```
####Without a Dataprovider
You can use EGalleria widget without dataprovider like:
```php
<?php
$this->beginWidget('EGalleria');
?>
<ul>
<img src"/testo.png" alt="Description of image" title="Title of image" />
<img src"/test1.png" />
<img src"/test2.png" />
<img src"/test3.png" />
<?php
$this->endWidget();
?>
```
For more information on basic dom structure, [check.](http://galleria.aino.se/getting_started/beginners_guide/)
###More options
There are more options that can be applied to the widget at definition.
- "galleria"=>array(..) An associative array with all the [options of the galleria plugin.](http://galleria.aino.se/doc/1.2/options/)
- "srcPrefix"=>"protected/data/..", If this property is defined then it will be preappened in each image src url. $src = $srcPrefix.$image;
###Ending
I have not tested all the galleria options, so i need some help on this by you :). Callback,themes and api features of galleria are not yet
implemented, will be under request.
Any suggestions or contributions are welcome, but please use the repository of github.com for such thinks.
Please report bugs or leave comments.
###Links
- [Repository](http://www.github.com/dmtrs/EGalleria)
- [Galleria repository](https://github.com/aino/galleria)
- [Galleria official site](http://galleria.aino.se/)
wrong link
the link to the official galleria site is wrong
other that
thanks for sharing the extension, it looks great
DIRECTORY_SEPARATOR
Hi,
First of all - thank you for a great extensions. Looks superb! :)
However, I noticed strange thing only partially related to your extension, but to PHP in general.
You're using DIRECTORY_SEPARATOR, as I was doing and as I was told to do. But I found out that under Windows and XAMPP, DIRECTORY_SEPARATOR is being changed to Windows-like slash () and - if I'm not mistaken - this is not acceptable by Windows (XAMPP) version of Apache (strange), because this causes images, CSS files and JS scripts NOT to be loaded.
For example, your extension has generated such code for me:
<script type="text/javascript" src="/burdzy/assets/e8a2fa9c\galleria.js"></script> <script type="text/javascript" src="/burdzy/assets/e8a2fa9c\galleria.classic.js"></script>
Which is wrong and is NOT WORKING under Windows + XAMPP. Have you (or any other developer using this great extension) noticed something similar?
DIRECTORY_SEPARATOR 2.0
@trejder You are right, I had the same issue.
I believe DIRECTORY_SEPARATOR should only be used on file system directories and not URL's.
In a URL it should always be / (forward slash)
Btw awesome extensions, I might use it in my project.
require...
you might want to change
$this->avOptions = require_once(dirname(__FILE__).DIRECTORY_SEPARATOR."galleria.options.php");
to
$this->avOptions = require(dirname(__FILE__).DIRECTORY_SEPARATOR."galleria.options.php");
otherwise only first egalleria widget on the page will accept options
Extension not loading for the first time
Hi,
Firstly I would like to thank you for that great extension. But I've got a problem. Galleria widget used on some page and when I open it for the first time, it doesn't show the gallery itself. It's shown only on page reload. What might be a problem of this?
Thanks in advance,
Sobit
@Sobit
Hello there Sobit,
Thank you. Can you provide with more information related to your problem. Some code snippets of what you are doing and screenshots would be ideal. BUT please don't do it here, use pastebin.com or similar tool and share the link.
Friendly and geeky,
Tydeas
@tydeas_dr
Hi again. Here's where I'm getting the problem.
Opera works perfect. Chrome doesn't open it until you refresh the page. Mozilla opens it only once and nothing helps to show it again until you restart the browser. Here's the code:
Update link in the description
Also update please a link to the beginners guide. It doesn't work.
http://galleria.aino.se/getting_started/beginners_guide/
@Sobit
Hello there, There is something must be wrong with your local setup. I have checked it with:
On a linux Fedora 14 versions and everything looks fine. Pretty good pictures over there :)
The code is pretty much simple to give you this trouble.
@tydeas_dr
I'm getting the same problem on Google Chrome 17 on Mac OS X and on Google Chrome 15 on Windows. Please do the following steps to view the problem:
With your Google Chrome:
@tydeas_dr
Hi again. Didn't you tried this?
DIRECTORY SEPERATOR
Just a heads up to tydeas & any Windows users. I was having an issue getting the JS & CSS to register. Turns out it was DIRECTORY_SEPARATOR messing up the path. Here's the changed code:
private function registerScripts() { $cs = Yii::app()->clientScript; if($this->css===null) { $cssFolder = dirname(__FILE__).'/'.$this->themePath.'/'; $cssFolder .= $this->themeName.'/'; $cssAssetPath = Yii::app()->getAssetManager()->publish($cssFolder); foreach($this->cssFiles as $file) { $cs->registerCssFile($cssAssetPath.'/'.$file); } } if($this->js===null) { $jsPath = dirname(__FILE__).'/'.$this->jsPath.'/'; if(!$cs->isScriptRegistered('jquery')) { $cs->registerCoreScript('jquery'); } $this->jsAssetPath = Yii::app()->getAssetManager()->publish($jsPath); foreach($this->jsFiles as $file) { $cs->registerScriptFile($this->jsAssetPath.'/'.$file, CClientScript::POS_HEAD); } } $galleriaScript = "var jsn = eval(".CJSON::encode($this->galleriaOptions)."); $('#egalleria_".$this->id."').galleria(jsn);"; $cs->registerScript("egalleria_script_".$this->id, $galleriaScript, CClientScript::POS_READY); } public function init() { $this->avOptions = require_once(dirname(__FILE__).'/'."galleria.options.php"); $this->initGalleria(); $this->registerScripts(); echo "<div id='egalleria_".$this->id."' >"; parent::init();
Anyways, thanks for the excellent extension!
@tydeas_dr
I figured the problem by myself. If someone got the same problem, here's the solution.
In the EGalleria.php file change line 101 from:
$cs->registerScript("egalleria_script_".$this->id, $galleriaScript, CClientScript::POS_READY);
to:
$cs->registerScript("egalleria_script_".$this->id, $galleriaScript, CClientScript::POS_END);
error in install instruction
Update install instruction, link to github is wrong, correct link:
git clone https://github.com/dmtr**s**/EGalleria
working fine after few changes.
Changed for Mozilla window users,working fine for rest of the browsers.
$cs->registerScriptFile($this->jsAssetPath.DIRECTORY_SEPARATOR.$file, CClientScript::POS_HEAD);
to
$cs->registerScriptFile($this->jsAssetPath."/".$file, CClientScript::POS_HEAD);
If you have any questions, please ask in the forum instead.
Signup or Login in order to comment.