TbEditable.php

Go to the documentation of this file.

<?php
class TbEditable extends CWidget
{
    //note: only most usefull options are on first level of config.

    // --- start of X-editable options ----
    public $type = null;
    public $url = null;
    public $pk = null; 
    public $name = null;        
    public $params = null;
    public $inputclass = null;
    public $mode = null;
    public $text = null;
    public $value = null;
    public $placement = null;

    public $emptytext = null;

    public $showbuttons = null;   
    
    public $send = null;  
    
    public $disabled = false;

    //list
    public $source = null;

    //date
    public $format = null;
    public $viewformat = null;
    public $template = null;        
    public $combodate = null;    
    public $viewseparator = null;        
    public $select2 = null;    
    
    //methods
    public $validate = null;
    public $success = null;
    public $display = null;
    
    public $liveTarget = null;
    public $liveSelector = null;

    // --- X-editable events ---
    public $onInit;
    public $onShown;
    public $onSave;
    public $onHidden;

    public $options = array();

    public $htmlOptions = array();

    public $encode = true;

    public $apply = null;

    public $title = null;

    //themeUrl, theme and cssFile copied from CJuiWidget to allow include custom theme for jQuery UI
    public $themeUrl;
    public $theme='base';
    public $cssFile='jquery-ui.css';

    protected $_prepareToAutotext = false;

    public function init()
    {
        parent::init();

        if (!$this->name) {
            throw new CException('Parameter "name" should be provided for TbEditable widget');
        }
                
        /*
        If set this flag to true --> element content will stay empty 
        and value will be rendered to data-value attribute to apply autotext afterwards.
        */
        $this->_prepareToAutotext = self::isAutotext($this->options, $this->type);
        
        /*
        For `date` and `datetime` we need format to be on php side to make conversions.
        But we can not set default format as datepicker and combodate has different formats.
        So do it here:
        */
        if (!$this->format && $this->type == 'date') {
            $this->format = 'yyyy-mm-dd';
        }
        if (!$this->format && $this->type == 'datetime') {
            $this->format = 'yyyy-mm-dd hh:ii:ss';
        }
    }

    public function buildHtmlOptions()
    {
        //html options
        $htmlOptions = array(
            'href'      => '#',
            'rel'       => $this->liveSelector ? $this->liveSelector : $this->getSelector(),
        );

        //set data-pk 
        if($this->pk !== null) {
           $htmlOptions['data-pk'] = is_array($this->pk) ? CJSON::encode($this->pk) : $this->pk; 
        }

        //if input type assumes autotext (e.g. select) we define value directly in data-value 
        //and do not fill element contents
        if ($this->_prepareToAutotext) {
            //for date we use 'format' to put it into value (if text not defined)
            if ($this->type == 'date' || $this->type == 'datetime') {
                //if date comes as object OR timestamp, format it to string
                if($this->value instanceOf DateTime || is_long($this->value) || (is_string($this->value) && ctype_digit($this->value))) {
                    /*
                    * unfortunatly bootstrap datepicker's format does not match 
                    * Yii locale dateFormat, we need replacements below to convert 
                    * date correctly.
                    * 
                    * Yii format: 
                    * http://www.unicode.org/reports/tr35/tr35-dates.html#Date_Format_Patterns
                    * 
                    * Datepicker format: 
                    * https://github.com/eternicode/bootstrap-datepicker#format
                    * 
                    * Datetimepicker format: 
                    * https://github.com/smalot/bootstrap-datetimepicker#format 
                    */
                    //months: M --> MMM, m --> M
                    $count = 0;
                    $format = str_replace('MM', 'MMMM', $this->format, $count);
                    if(!$count) $format = str_replace('M', 'MMM', $format, $count);
                    if(!$count) $format = str_replace('m', 'M', $format);
                    if($this->type == 'datetime') {
                        //minutes: i --> m
                        $format = str_replace('i', 'm', $format); 
                        //hours: h --> H, H --> h
                        $count = 0;
                        $format = str_replace('h', 'H', $format, $count);
                        if(!$count) {
                            $format = str_replace('H', 'h', $format);                        
                        }
                    }
                                        
                    if($this->value instanceof DateTime) {
                        $timestamp = $this->value->getTimestamp();
                    } else {
                        $timestamp = $this->value;
                    }

                    $this->value = Yii::app()->dateFormatter->format($format, $timestamp);
                }
            } 

            if(is_scalar($this->value)) {
                $this->htmlOptions['data-value'] = $this->value;
            }
            //if not scalar, value will be added to js options instead of html options
        }

        //merging options
        $this->htmlOptions = CMap::mergeArray($this->htmlOptions, $htmlOptions);
        
        //convert arrays to json string, otherwise yii can not render it: 
        //"htmlspecialchars() expects parameter 1 to be string, array given"  
        foreach($this->htmlOptions as $k => $v) {
            $this->htmlOptions[$k] = is_array($v) ? CJSON::encode($v) : $v;
        }
    }

    public function buildJsOptions()
    {
        //normalize url from array
        $this->url = CHtml::normalizeUrl($this->url);

        $options = array(
            'name'  => $this->name,
            'title' => CHtml::encode($this->title),
        );
        
        //if value needed for autotext and it's not scalar --> add it to js options
        if ($this->_prepareToAutotext && !is_scalar($this->value)) {
            $options['value'] = $this->value; 
        }
        
        //support of CSRF out of box, see https://github.com/vitalets/x-editable-yii/issues/38
        if (Yii::app()->request->enableCsrfValidation) {
            $csrfTokenName = Yii::app()->request->csrfTokenName;
            $csrfToken = Yii::app()->request->csrfToken;
            if(!isset($this->params[$csrfTokenName])) {
                $this->params[$csrfTokenName] = $csrfToken;
            }
        }        

        //simple options set directly from config
        foreach(array(
            'url', 
            'type', 
            'mode', 
            'placement', 
            'emptytext', 
            'params', 
            'inputclass', 
            'format', 
            'viewformat', 
            'template',
            'combodate', 
            'select2', 
            'viewseparator', 
            'showbuttons',
            'send',
               ) as $option) {
            if ($this->$option !== null) {
                $options[$option] = $this->$option;
            }
        }

        if ($this->source) {
            //if source is array --> convert it to x-editable format.
            //Since 1.1.0 source as array with one element is NOT treated as Yii route!
            if(is_array($this->source)) {
                //if first elem is array assume it's normal x-editable format, so just pass it
                if(isset($this->source[0]) && is_array($this->source[0])) {
                    $options['source'] = $this->source;
                } else { //else convert to x-editable source format {value: 1, text: 'abc'}
                    $options['source'] = array();
                    foreach($this->source as $value => $text) {
                        $options['source'][] = array('value' => $value, 'text' => $text);
                    }
                }
            } else { //source is url string (or js function)
                $options['source'] = CHtml::normalizeUrl($this->source);
            }
        }

        //callbacks
        foreach(array('validate', 'success', 'display') as $method) {
            if(isset($this->$method)) {
                $options[$method]=(strpos($this->$method, 'js:') !== 0 ? 'js:' : '') . $this->$method;
            }
        }
        
        //merging options
        $this->options = CMap::mergeArray($this->options, $options);
        
        //i18n for `clear` in date and datetime
        if($this->type == 'date' || $this->type == 'datetime') {
            if(!isset($this->options['clear'])) {
                $this->options['clear'] = Yii::t('TbEditableField.editable', 'x clear');
            }
        }
    }

    public function registerClientScript()
    {
        $selector = "a[rel=\"{$this->htmlOptions['rel']}\"]"; 
        if($this->liveTarget) {
            $selector = '#'.$this->liveTarget.' '.$selector;
        }
        $script = "$('".$selector."')";

        //attach events
        foreach(array('init', 'shown', 'save', 'hidden') as $event) {
            $eventName = 'on'.ucfirst($event);
            if (isset($this->$eventName)) {
                // CJavaScriptExpression appeared only in 1.1.11, will turn to it later
                //$event = ($this->onInit instanceof CJavaScriptExpression) ? $this->onInit : new CJavaScriptExpression($this->onInit);
                $eventJs = (strpos($this->$eventName, 'js:') !== 0 ? 'js:' : '') . $this->$eventName;
                $script .= "\n.on('".$event."', ".CJavaScript::encode($eventJs).")";
            }
        }

        //apply editable
        $options = CJavaScript::encode($this->options);
        $script .= ".editable($options);";

        //wrap in anonymous function for live update
        if($this->liveTarget) {
            $script .= "\n $('body').on('ajaxUpdate.editable', function(e){ if(e.target.id == '".$this->liveTarget."') yiiEditable(); });";
            $script = "(function yiiEditable() {\n ".$script."\n}());";
        }
        
        Yii::app()->getClientScript()->registerScript(__CLASS__ . '-' . $selector, $script);

        return $script;
    }

    public function registerAssets() {
        
        $booster = Booster::getBooster();
        
                if ($this->type == 'date' || $this->type == 'combodate') {
            $widget = Yii::app()->widgetFactory->createWidget(
                $this->getOwner(),
                'booster.widgets.TbDatePicker',
                array('options' => isset($this->options['datepicker']) ? $this->options['datepicker'] : array())
            );
            $widget->registerLanguageScript();
        } elseif ($this->type == 'datetime') {
            $booster->registerPackage('datetimepicker');

            $widget = Yii::app()->widgetFactory->createWidget(
                $this->getOwner(),
                'booster.widgets.TbDateTimePicker',
                array('options' => $this->options['datetimepicker'])
            );
            $widget->registerLanguageScript();
        }
        
        if ($this->type == 'combodate') { // include moment.js if needed
            $booster->registerPackage('moment');
        } elseif ($this->type == 'select2') { //include select2 if needed
            $booster->registerPackage('select2');
        }
        
        $booster->registerPackage('x-editable');
        
        return;
        
        /* TODO original */
        $am = Yii::app()->getAssetManager();
        $cs = Yii::app()->getClientScript();
        $form = yii::app()->editable->form;
        $mode = $this->mode ? $this->mode : yii::app()->editable->defaults['mode'];

        // bootstrap
        if($form === EditableConfig::FORM_BOOTSTRAP) {
            if (($bootstrap = yii::app()->getComponent('bootstrap'))) {
                $bootstrap->registerCoreCss();
                $bootstrap->registerCoreScripts();
            } else {
                throw new CException('You need to setup Yii-bootstrap extension first.');
            }

            $assetsUrl = $am->publish(Yii::getPathOfAlias('editable.assets.bootstrap-editable'));
            $js = 'bootstrap-editable.js';
            $css = 'bootstrap-editable.css';
        // jqueryui
        } elseif($form === EditableConfig::FORM_JQUERYUI) {
            if($mode === EditableConfig::POPUP && Yii::getVersion() < '1.1.13' ) {
                throw new CException('jQuery UI editable popup supported from Yii 1.1.13+');
            }

            //register jquery ui
            $this->registerJQueryUI();

            $assetsUrl = $am->publish(Yii::getPathOfAlias('editable.assets.jqueryui-editable'));
            $js = 'jqueryui-editable.js';
            $css = 'jqueryui-editable.css';
        // plain jQuery
        } else {
            $assetsUrl = $am->publish(Yii::getPathOfAlias('editable.assets.jquery-editable'));
            $js = 'jquery-editable-poshytip.js';
            $css = 'jquery-editable.css';

            //publish & register poshytip for popup version
            if($mode === EditableConfig::POPUP) {
                $poshytipUrl = $am->publish(Yii::getPathOfAlias('editable.assets.poshytip'));
                $cs->registerScriptFile($poshytipUrl . '/jquery.poshytip.js');
                $cs->registerCssFile($poshytipUrl . '/tip-yellowsimple/tip-yellowsimple.css');
            }

            //register jquery ui for datepicker
            if($this->type == 'date' || $this->type == 'dateui') {
                $this->registerJQueryUI();
            }
        }

        //register assets
        $cs->registerCssFile($assetsUrl.'/css/'.$css);
        $cs->registerScriptFile($assetsUrl.'/js/'.$js, CClientScript::POS_END);

        //include moment.js for combodate 
        if($this->type == 'combodate') {
            $momentUrl = $am->publish(Yii::getPathOfAlias('editable.assets.moment'));
            $cs->registerScriptFile($momentUrl.'/moment.min.js');          
        }
        
        //include select2 lib for select2 type
        if($this->type == 'select2') {
            $select2Url = $am->publish(Yii::getPathOfAlias('editable.assets.select2'));
            $cs->registerScriptFile($select2Url.'/select2.min.js');  
            $cs->registerCssFile($select2Url.'/select2.css');        
        }  
        
        //include bootstrap-datetimepicker
        if($this->type == 'datetime') {
            $url = $am->publish(Yii::getPathOfAlias('editable.assets.bootstrap-datetimepicker'));
            $cs->registerScriptFile($url.'/js/bootstrap-datetimepicker.js');  
            $cs->registerCssFile($url.'/css/datetimepicker.css');        
        }               
        
        //TODO: include locale for datepicker
        //may be do it manually?
        /*
        if ($this->type == 'date' && $this->language && substr($this->language, 0, 2) != 'en') {
             //todo: check compare dp locale name with yii's
             $localesUrl = Yii::app()->getAssetManager()->publish(Yii::getPathOfAlias('ext.editable.assets.js.locales'));
             Yii::app()->clientScript->registerScriptFile($localesUrl . '/bootstrap-datepicker.'. str_replace('_', '-', $this->language).'.js', CClientScript::POS_END);
        }
        */
    }

    public function run()
    {
        //Register script (even if apply = false to support live update)
        if($this->apply !== false || $this->liveTarget) {
            $this->buildHtmlOptions();
            $this->buildJsOptions();
            $this->registerAssets();               
            $this->registerClientScript();
        }
        
        if($this->apply !== false) {
            $this->renderLink();
        } else {
            $this->renderText();
        }
    }

    public function renderLink()
    {
        echo CHtml::openTag('a', $this->htmlOptions);
        $this->renderText();
        echo CHtml::closeTag('a');
    }

    public function renderText()
    {
        echo $this->encode ? CHtml::encode($this->text) : $this->text;
    }

    public function getSelector()
    {
        //for live updates selector should not contain pk
        if($this->liveTarget) {
            return $this->name;
        }
        
        $pk = $this->pk;
        if($pk === null) {
            $pk = 'new';
        } else {
            //support of composite keys: convert to string: e.g. 'id-1_lang-ru'
            if(is_array($pk)) {
                //below not works in PHP < 5.3, see https://github.com/vitalets/x-editable-yii/issues/39
                //$pk = join('_', array_map(function($k, $v) { return $k.'-'.$v; }, array_keys($pk), $pk));
                $buffer = array();
                foreach($pk as $k => $v) {
                    $buffer[] = $k.'-'.$v;
                }
                $pk = join('_', $buffer);
            }       
        }
        
        
        return $this->name.'_'.$pk;
    }
    
    public static function isAutotext($options, $type) 
    {
         return (!isset($options['autotext']) || $options['autotext'] !== 'never') 
         && in_array($type, array(
            'select', 
            'checklist', 
            'date', 
            'datetime', 
            'dateui', 
            'combodate', 
            'select2'
         ));
    }
    
    public static function source($models, $valueField='', $textField='', $groupField='', $groupTextField='')
    {
        $listData=array();
        
        $first = reset($models);
        
        //simple 1-dimensional array: 0 => 'text 0', 1 => 'text 1'
        if($first && (is_string($first) || is_numeric($first))) {
            foreach($models as $key => $text) {
                $listData[] = array('value' => $key, 'text' => $text);
            }
            return $listData;
        } 
        
        // 2-dimensional array or dataset
        if($groupField === '') {
            foreach($models as $model) {
                $value = CHtml::value($model, $valueField);
                $text = CHtml::value($model, $textField);
                $listData[] = array('value' => $value, 'text' => $text);
            }
        } else {
            if(!$groupTextField) {
                $groupTextField = $groupField;
            }
            $groups = array();
            foreach($models as $model) {
                $group=CHtml::value($model,$groupField);
                $groupText=CHtml::value($model,$groupTextField);
                $value=CHtml::value($model,$valueField);
                $text=CHtml::value($model,$textField);
                if($group === null) {
                    $listData[] = array('value' => $value, 'text' => $text);
                } else {
                    if(!isset($groups[$group])) {
                        $groups[$group] = array('value' => $group, 'text' => $groupText, 'children' => array(), 'index' => count($listData));
                        $listData[] = 'group'; //placeholder, will be replaced in future
                    }
                    $groups[$group]['children'][] = array('value' => $value, 'text' => $text);
                }
            }
 
            //fill placeholders with group data           
            foreach($groups as $group) {
                $index = $group['index'];
                unset($group['index']);
                $listData[$index] = $group;                      
            }
        }
        
        return $listData;
    }

    public static function attachAjaxUpdateEvent($widget)
    {
        $trigger = '$("#'.$widget->id.'").trigger("ajaxUpdate.editable");';

        //check if trigger already inserted by another column
        if(strpos($widget->afterAjaxUpdate, $trigger) !== false) return;

        //inserting trigger
        if(strlen($widget->afterAjaxUpdate)) {
            $orig = $widget->afterAjaxUpdate;
            if(strpos($orig, 'js:')===0) $orig = substr($orig,3);
            $orig = "\n($orig).apply(this, arguments);";
        } else {
            $orig = '';
        }
        $widget->afterAjaxUpdate = "js: function(id, data) {
            $trigger $orig
        }";

        $widget->registerClientScript();
    }    
    

    protected function registerJQueryUI()
    {
        $cs=Yii::app()->getClientScript();
        if($this->themeUrl===null) {
            $this->themeUrl=$cs->getCoreScriptUrl().'/jui/css';
        }
        $cs->registerCssFile($this->themeUrl.'/'.$this->theme.'/'.$this->cssFile);
        $cs->registerPackage('jquery.ui');
    }
}