<?php

/**
 * Description of RoyalSliderWidget
 *
 * @author Mohammed Osman  <osmancode@gmail.com>
 */
class RoyalSliderWidget extends ShortCodeWidget {

    protected $_options = array(
        array(
            'name' => 'model_id',
            'label' => 'Slider ID',
            'value' => 0,
        ),
        array(
            'name' => 'model_class',
            'label' => 'Model Class',
            'value' => 'Album',
//            'type' => 'dropdownlist',
//            'items' => array('Slider', 'Album'),
        ),
        array(
            'name' => 'layout',
            'label' => 'Widget Layout File',
            'value' => 'album',
        ),
        array(
            'name' => 'theme', 'type' => 'dropdownlist',
            'items' => array('default-inverted' => 'default-inverted',
                'default' => 'default',
                'minimal-white' => 'minimal-white',
                'preloaders' => 'preloaders',
                'universal' => 'universal',),
            'value' => 'default-inverted',
        ),
        array('name' => 'autoScaleSlider',
            'value' => 'false',
            'help' => 'Automatically updates slider height based on base width.'),
        array('name' => 'autoScaleSliderWidth',
            'value' => '800',
            'help' => 'Base slider width. Slider will autocalculate the ratio based on these values.'),
        array('name' => 'autoScaleSliderHeight',
            'value' => '400',
            'help' => 'Base slider height'),
        array('name' => 'imageScaleMode',
            'value' => 'fit-if-smaller',
            'help' => 'Scale mode for images. "fill", "fit", "fit-if-smaller" or "none". <a href="http://dimsemenov.com/private/forum.php?to=kb/royalslider-jquery-plugin-faq/how-to-change-image-scaling">Learn more</a>.'),
        array('name' => 'imageAlignCenter',
            'value' => 'true',
            'help' => 'Aligns image to center of slide.'),
        array('name' => 'imageScalePadding',
            'value' => '4',
            'help' => 'Distance between image and edge of slide (doesn\'t work with "fill" scale mode).'),
        array('name' => 'controlNavigation',
            'value' => 'bullets',
            'help' => 'Navigation type, can be "bullets", "thumbnails", "tabs" or "none"'),
        array('name' => 'arrowsNav',
            'value' => 'true',
            'help' => 'Direction arrows navigation.'),
        array('name' => 'arrowsNavAutoHide',
            'value' => 'true',
            'help' => 'Auto hide arrows.'),
        array('name' => 'arrowsNavHideOnTouch',
            'value' => 'false',
            'help' => 'Hides arrows completely on touch devices.'),
        array('name' => 'imgWidth',
            'value' => 'null',
            'help' => 'Adds base width to all images for better-looking loading. Can be specified separately for each image. Check <a href="http://dimsemenov.com/private/forum.php?to=kb/royalslider-jquery-plugin-faq/adding-width-and-height-properties-to-images">this article</a> to learn more. Available since 9.3.'),
        array('name' => 'imgHeight',
            'value' => 'null',
            'help' => 'Same as above, just for height.'),
        array('name' => 'slidesSpacing',
            'value' => '8',
            'help' => 'Spacing between slides in pixels.'),
        array('name' => 'startSlideId',
            'value' => '0',
            'help' => 'Start slide index'),
        array('name' => 'loop',
            'value' => 'false',
            'help' => 'Makes slider to go from last slide to first.'),
        array('name' => 'loopRewind',
            'value' => 'false',
            'help' => 'Makes slider to go from last slide to first with rewind. Overrides prev option'),
        array('name' => 'randomizeSlides',
            'value' => 'false',
            'help' => 'Randomizes all slides at start.'),
        array('name' => 'numImagesToPreload',
            'value' => '4',
            'help' => 'Number of slides to preload on sides. If you set it to 0, only one slide will be kept in the display list at once.'),
        array('name' => 'usePreloader',
            'value' => 'true',
            'help' => 'Enables spinning preloader, you may style it via CSS (class rsPreloader). Since 9.3 version.'),
        array('name' => 'slidesOrientation',
            'value' => 'horizontal',
            'help' => 'Can be \'vertical\' or \'horizontal\'.'),
        array('name' => 'transitionType',
            'value' => 'move',
            'help' => '\'move\' or \'fade\'. Important note about fade transition, slides must have background as only one image is animating.'),
        array('name' => 'transitionSpeed',
            'value' => '600',
            'help' => 'Slider transition speed, in ms.'),
        array('name' => 'easeInOut',
            'value' => 'easeInOutSine',
            'help' => 'Easing function for simple transition. Read more in <a href = "#easing">the easing</a> section of the documentation.'),
        array('name' => 'easeOut',
            'value' => 'easeOutSine',
            'help' => 'Easing function of animation after ending of the swipe gesture. Read more in <a href = "#easing">the easing</a> section of the documentation.'),
        array('name' => 'controlsInside',
            'value' => 'true',
            'help' => 'If set to true adds arrows and fullscreen button inside rsOverflow container, otherwise inside root slider container..'),
        array('name' => 'navigateByClick',
            'value' => 'true',
            'help' => 'Navigates forward by clicking on slide.'),
        array('name' => 'sliderDrag',
            'value' => 'true',
            'help' => 'Mouse drag navigation over slider.'),
        array('name' => 'sliderTouch',
            'value' => 'true',
            'help' => 'Touch navigation of slider.'),
        array('name' => 'keyboardNavEnabled',
            'value' => 'false',
            'help' => 'Navigate slider with keyboard left and right arrows.'),
        array('name' => 'fadeinLoadedSlide',
            'value' => 'true',
            'help' => 'Fades in slide after it\'s loaded.'),
        array('name' => 'allowCSS3',
            'value' => 'true',
            'help' => 'Allows usage of CSS3 transitions. Might be useful if you\'re experiencing font-rendering problems, or other CSS3-related bugs.'),
        array('name' => 'globalCaption',
            'value' => 'false',
            'help' => 'Adds global caption element to slider, read more in <a href = "#global-caption">the global caption section</a> of documentation.'),
        array('name' => 'addActiveClass',
            'value' => 'false',
            'help' => 'Adds <code>rsActiveSlide</code> class to current slide before transition.'),
        array('name' => 'minSlideOffset',
            'value' => '10',
            'help' => 'Minimum distance in pixels to show next slide while dragging. Added in version 9.1.7.'),
        array('name' => 'autoHeight',
            'value' => 'false',
            'help' => 'Scales and animates height based on current slide.<br><strong>Please note:</strong> if you have images in slide that don\'t have <code>rsImg</code> class) or don\'t have fixed size, use <code>$(window).load()</code> instead of <code>$(document).ready()</code> before initializing slider.<br>Also, autoHeight doesn\'t work with properties like autoScaleSlider, imageScaleMode and imageAlignCenter.'),
        array('name' => 'slides',
            'value' => 'null',
            'help' => 'Overrides HTML of slides, used for creating of slides from HTML that is not attached to DOM. More info in <a href = "http://dimsemenov.com/private/forum.php?to=kb/royalslider-javascript-api/create-slides-from-array">knowledge base</a>.'),
    );
    public $modelClass = "Album";
    public $registerCssFiles = true;
    public $shortCode = 'royalslider';
    public $layout = 'album';
    public $theme = 'default';

    function init() {
        parent::init();
        if (isset($this->_options['theme'])) {
            $this->theme = $this->_options['theme'];
        }

        $cs = Yii::app()->getClientScript();
        $id = $this->getId();
        $assets = Yii::app()->getAssetManager()->publish(dirname(__FILE__) . '/assets/royalslider/');
        if ($this->registerCssFiles == true) {
            $cs->registerCssFile($assets . '/royalSlider.css');
            $cs->registerCssFile($assets . "/skins/{$this->theme}/rs-{$this->theme}.css");
        }
        $cs->registerScriptFile($assets . '/jquery.easing-1.3.js');
        $cs->registerScriptFile($assets . '/jquery.royalslider.min.js');

        $options = CJavaScript::encode($this->_options);


        $options = str_replace("'false'", "false", $options);
        $options = str_replace("'null'", "null", $options);

        $js = "jQuery('#{$id}')";

        $js .=".royalSlider({fullscreen: {
enabled: true,
nativeFS: true
},
controlNavigation: 'thumbnails',
autoScaleSlider: true, 
autoScaleSliderWidth: 960,     
autoScaleSliderHeight: 850,
loop: false,
imageScaleMode: 'fill',
navigateByClick: true,
numImagesToPreload:2,
arrowsNav:true,
arrowsNavAutoHide: true,
arrowsNavHideOnTouch: true,
keyboardNavEnabled: true,
fadeinLoadedSlide: true,
globalCaption: true,
globalCaptionInside: false,
thumbs: {
appendSpan: true,
firstMargin: true,
paddingBottom: 4
}});";



        $cs->registerScript(__CLASS__ . '#' . $id, $js);
    }

}
