[FEATURE] Add a value slider as wizard to tceforms
authorSteffen Kamper <info@sk-typo3.de>
Sun, 13 Mar 2011 21:32:12 +0000 (22:32 +0100)
committerAndreas Wolf <andreas.wolf@ikt-werk.de>
Tue, 12 Jul 2011 22:10:07 +0000 (00:10 +0200)
It can be useful to enter values with a slider. This change
renders values of type time, integer, double or custom items.
A demo extension can be found in the issue tracker.

Change-Id: Ib01f6668058385901c10ec0b1ed1bb79cbc951b3
Resolves: #25315
Reviewed-on: http://review.typo3.org/1164
Reviewed-by: Andreas Wolf
Tested-by: Andreas Wolf
t3lib/class.t3lib_tceforms.php
t3lib/core_autoload.php
t3lib/js/extjs/components/slider/ValueSlider.js [new file with mode: 0644]
t3lib/tceforms/class.t3lib_tceforms_valueslider.php [new file with mode: 0644]

index 19a2f74..f0922e8 100644 (file)
@@ -3789,6 +3789,7 @@ class t3lib_TCEforms {
                $fName = '[' . $table . '][' . $row['uid'] . '][' . $field . ']';
                $md5ID = 'ID' . t3lib_div::shortmd5($itemName);
                $listFlag = '_list';
+               $fieldConfig = $PA['fieldConf']['config'];
 
                $prefixOfFormElName = 'data[' . $table . '][' . $row['uid'] . '][' . $field . ']';
                if (t3lib_div::isFirstPartOfStr($PA['itemFormElName'], $prefixOfFormElName)) {
@@ -3829,10 +3830,12 @@ class t3lib_TCEforms {
                                                case 'script':
                                                case 'popup':
                                                case 'colorbox':
-                                                       if (!$wConf['notNewRecords'] || t3lib_utility_Math::canBeInterpretedAsInteger($row['uid'])) {
+                                               case 'slider':
+                                                       if (!$wConf['notNewRecords'] || t3lib_div::testInt($row['uid'])) {
 
                                                                        // Setting &P array contents:
                                                                $params = array();
+                                                               $params['fieldConfig'] = $fieldConfig;
                                                                $params['params'] = $wConf['params'];
                                                                $params['exampleImg'] = $wConf['exampleImg'];
                                                                $params['table'] = $table;
@@ -3899,6 +3902,17 @@ class t3lib_TCEforms {
                                                                                        $params['row'] = $row;
                                                                                        $outArr[] = t3lib_div::callUserFunction($wConf['userFunc'], $params, $this);
                                                                                break;
+                                                                               case 'slider':
+                                                                                       $params['item'] = &$item; // Reference set!
+                                                                                       $params['icon'] = $icon;
+                                                                                       $params['iTitle'] = $iTitle;
+                                                                                       $params['wConf'] = $wConf;
+                                                                                       $params['row'] = $row;
+                                                                                       $wizard = t3lib_div::makeInstance('t3lib_TCEforms_ValueSlider');
+                                                                                       $outArr[] = call_user_func_array(
+                                                                                               array(&$wizard, 'renderWizard'),
+                                                                                               array(&$params, &$this)
+                                                                                       );
                                                                        }
                                                                }
 
index 390ddea..d5d60a4 100644 (file)
@@ -60,6 +60,7 @@ $t3libClasses = array(
        't3lib_parsehtml' => PATH_t3lib . 'class.t3lib_parsehtml.php',
        't3lib_parsehtml_proc' => PATH_t3lib . 'class.t3lib_parsehtml_proc.php',
        't3lib_tceforms_flexforms' => PATH_t3lib . 'tceforms/class.t3lib_tceforms_flexforms.php',
+       't3lib_tceforms_valueslider' => PATH_t3lib . 'tceforms/class.t3lib_tceforms_valueslider.php',
        't3lib_positionmap' => PATH_t3lib . 'class.t3lib_positionmap.php',
        't3lib_querygenerator' => PATH_t3lib . 'class.t3lib_querygenerator.php',
        't3lib_readmail' => PATH_t3lib . 'class.t3lib_readmail.php',
diff --git a/t3lib/js/extjs/components/slider/ValueSlider.js b/t3lib/js/extjs/components/slider/ValueSlider.js
new file mode 100644 (file)
index 0000000..46d466b
--- /dev/null
@@ -0,0 +1,146 @@
+/***************************************************************
+ *  Copyright notice
+ *
+ *  (c) 2010-2011 Steffen Kamper <steffen@typo3.org>
+ *  All rights reserved
+ *
+ *  This script is part of the TYPO3 project. The TYPO3 project is
+ *  free software; you can redistribute it and/or modify
+ *  it under the terms of the GNU General Public License as published by
+ *  the Free Software Foundation; either version 2 of the License, or
+ *  (at your option) any later version.
+ *
+ *  The GNU General Public License can be found at
+ *  http://www.gnu.org/copyleft/gpl.html.
+ *  A copy is found in the textfile GPL.txt and important notices to the license
+ *  from the author is found in LICENSE.txt distributed with these scripts.
+ *
+ *
+ *  This script is distributed in the hope that it will be useful,
+ *  but WITHOUT ANY WARRANTY; without even the implied warranty of
+ *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ *  GNU General Public License for more details.
+ *
+ *  This copyright notice MUST APPEAR in all copies of the script!
+ ***************************************************************/
+
+Ext.ns('TYPO3.Components');
+
+TYPO3.Components.TcaValueSlider = Ext.extend(Ext.slider.SingleSlider, {
+       itemName: null,
+       getField: null,
+       changeCallback: null,
+       valueItems: null,
+       itemElement: null,
+       elementType: null,
+
+       initComponent: function() {
+               var items, step, n;
+               var step = this.increment || 1;
+               if (step < 1) {
+                       this.type = 'float';
+                       this.increment = 1;
+                       this.floatValue = 1 / step;
+                       this.maxValue *= this.floatValue;
+               }
+
+               Ext.apply(this, {
+                       minValue: this.minValue || 0,
+                       maxValue: this.maxValue || 10000,
+                       keyIncrement: step,
+                       increment: step,
+                       type: this.type,
+                       plugins: new Ext.slider.Tip({
+                               getText: function(thumb) {
+                                       return thumb.slider.renderValue(thumb.value);
+                               }
+                       }),
+                       listeners: {
+                               beforerender: function(slider) {
+                                       var items = Ext.query(this.elementType);
+                                       items.each(function(item) {
+                                               var n = item.getAttribute('name');
+                                               if (n == this.itemName) {
+                                                       this.itemElement = item;
+                                               }
+                                       }, this);
+
+                                       if (this.elementType == 'select') {
+                                               this.minValue = 0;
+                                               this.maxValue = this.itemElement.options.length - 1;
+                                               step = 1;
+                                       }
+                               },
+                               changecomplete: function(slider, newValue, thumb) {
+                                       if (slider.itemName) {
+                                               if (slider.elementType == 'input') {
+                                                       slider.itemElement.value = slider.renderValue(thumb.value);
+                                               }
+                                               if (slider.elementType == 'select') {
+                                                       slider.itemElement.options[thumb.value].selected = '1';
+                                               }
+                                       }
+                                       if (slider.getField) {
+                                               eval(slider.getField);
+                                       }
+                                       if (slider.changeCallback) {
+                                               eval(slider.changeCallback);
+                                       }
+                               },
+                               scope: this
+                       }
+               });
+               TYPO3.Components.TcaValueSlider.superclass.initComponent.call(this);
+       },
+
+       /**
+       * Render value for tooltip
+       *
+       * @param {string} value
+       * @return string
+       */
+       renderValue: function(value) {
+               switch (this.type) {
+                       case 'array':
+                               return this.itemElement.options[value].text;
+                       break;
+                       case 'time':
+                               return this.renderValueFromTime(value);
+                       break;
+                       case 'float':
+                               return this.renderValueFromFloat(value);
+                       break;
+                       case 'int':
+                       default:
+                               return value;
+               }
+       },
+
+       /**
+       * Render value for tooltip as float
+       *
+       * @param {string} value
+       * @return string
+       */
+       renderValueFromFloat: function(value) {
+               var v = value / this.floatValue;
+               return v;
+       },
+
+       /**
+       * Render value for tooltip as time
+       *
+       * @param {string} value
+       * @return string
+       */
+       renderValueFromTime: function(value) {
+               var hours = Math.floor(value / 3600);
+               var rest = value - (hours * 3600);
+               var minutes = Math.round(rest / 60);
+               minutes = minutes < 10 ? '0' + minutes : minutes;
+               return hours + ':' + minutes;
+       }
+
+});
+
+Ext.reg('TYPO3.Components.TcaValueSlider', TYPO3.Components.TcaValueSlider);
\ No newline at end of file
diff --git a/t3lib/tceforms/class.t3lib_tceforms_valueslider.php b/t3lib/tceforms/class.t3lib_tceforms_valueslider.php
new file mode 100644 (file)
index 0000000..c50ac92
--- /dev/null
@@ -0,0 +1,107 @@
+<?php
+/***************************************************************
+ *  Copyright notice
+ *
+ *  (c) 2010-2011 Steffen Ritter <info@steffen-ritter.net>
+ *  (c) 2010-2011 Steffen Kamper <steffen@typo3.org>
+ *  All rights reserved
+ *
+ *  This script is part of the TYPO3 project. The TYPO3 project is
+ *  free software; you can redistribute it and/or modify
+ *  it under the terms of the GNU General Public License as published by
+ *  the Free Software Foundation; either version 2 of the License, or
+ *  (at your option) any later version.
+ *
+ *  The GNU General Public License can be found at
+ *  http://www.gnu.org/copyleft/gpl.html.
+ *  A copy is found in the textfile GPL.txt and important notices to the license
+ *  from the author is found in LICENSE.txt distributed with these scripts.
+ *
+ *
+ *  This script is distributed in the hope that it will be useful,
+ *  but WITHOUT ANY WARRANTY; without even the implied warranty of
+ *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ *  GNU General Public License for more details.
+ *
+ *  This copyright notice MUST APPEAR in all copies of the script!
+ ***************************************************************/
+/**
+ * TCEforms wizard for rendering an AJAX selector for records
+ *
+ * @author Steffen Kamper <steffen@typo3.org>
+ */
+
+class t3lib_TCEforms_ValueSlider {
+
+       /**
+        * Renders the slider value wizard
+        *
+        * @param array $params
+        * @param t3lib_TCEforms $pObj
+        * @return string
+        */
+       function renderWizard(&$params, &$pObj) {
+
+               $jsPath = '../t3lib/js/extjs/components/slider/';
+               $pObj->loadJavascriptLib($jsPath . 'ValueSlider.js');
+
+               $field = $params['field'];
+               $value = $params['row'][$field];
+               $itemName = $params['itemName'];
+               $min = intval($params['fieldConfig']['min']);
+               $max = intval($params['fieldConfig']['max']);
+               $elementType = $params['fieldConfig']['type'];
+               $step =  $params['wConf']['step'] ? $params['wConf']['step'] : 1;
+               $width = intval($params['wConf']['width']) ? intval($params['wConf']['width']) : 400;
+
+               $type = 'null';
+               if (isset($params['fieldConfig']['eval'])) {
+                       $eval = t3lib_div::trimExplode(',', $params['fieldConfig']['eval'], TRUE);
+                       if (in_array('time', $eval)) {
+                               $type = 'time';
+                               $value = (int)$value;
+                       } elseif (in_array('int', $eval)) {
+                               $type = 'int';
+                               $value = (int)$value;
+                       } elseif (in_array('double2', $eval)) {
+                               $type = 'double';
+                               $value = (double)$value;
+                       }
+               }
+               if (isset($params['fieldConfig']['items'])) {
+                       $type = 'array';
+                       $value = (int)$value;
+               }
+               $callback = $params['fieldChangeFunc']['TBE_EDITOR_fieldChanged'];
+               $getField = $params['fieldChangeFunc']['typo3form.fieldGet'];
+               $id = 'slider-' . $params['md5ID'];
+               $contents = '<div id="' . $id . '"></div>';
+               $js = '
+               new TYPO3.Components.TcaValueSlider({
+                       minValue: ' . $min . ',
+                       maxValue: ' . $max . ',
+                       value: ' . $value . ',
+                       increment: ' . $step . ',
+                       renderTo: "' . $id . '",
+                       itemName: "' . $itemName . '",
+                       changeCallback: "' . $callback . '",
+                       getField: "' . $getField . '",
+                       width: "' . $width . '",
+                       type: "' . $type . '",
+                       elementType: "' . $elementType . '"
+               });
+               ';
+               /** @var $pageRenderer t3lib_pageRenderer */
+               $pageRenderer = $GLOBALS['SOBE']->doc->getPageRenderer();
+               $pageRenderer->addExtOnReadyCode($js);
+
+               return $contents;
+       }
+}
+
+
+if (defined('TYPO3_MODE') && isset($GLOBALS['TYPO3_CONF_VARS'][TYPO3_MODE]['XCLASS']['classes/t3lib/tceforms/class.t3lib_tceforms_valueslider.php'])) {
+       include_once($GLOBALS['TYPO3_CONF_VARS'][TYPO3_MODE]['XCLASS']['classes/t3lib/tceforms/class.t3lib_tceforms_valueslider.php']);
+}
+
+?>
\ No newline at end of file