Permalink
Browse files

API CHANGE Removed 'showdropdown' option from TimeField, use custom l…

…ibraries instead
  • Loading branch information...
1 parent aa60201 commit 585a8bc784cc968d025b6b50441bb4101dcc381d @chillu chillu committed Sep 26, 2011
Showing with 1 addition and 180 deletions.
  1. +0 −43 css/TimeField_dropdown.css
  2. +1 −34 forms/TimeField.php
  3. +0 −103 javascript/TimeField_dropdown.js
View
@@ -1,43 +0,0 @@
-#right form .dropdowntime, .dropdowntime {
- position: relative;
-}
-
-#right form .dropdowntime input, .dropdowntime input {
- width: 8em;
-}
-
-.morning {
- background: #ffc;
-}
-.noon {
- background: #fcc;
-}
-.afternoon {
- background: #cff;
-}
-.evening {
- background: #ccf;
-}
-.midnight {
- background: #ccc;
-}
-
-.dropdowntime img {
- position: relative;
- top: 3px;
- cursor: pointer;
-}
-
-.dropdownpopup {
- position: absolute;
- left: 13.8em;
- top: 0.1em;
- display: none;
- z-index: 2;
-}
-.dropdownpopup.focused {
- display: block;
-}
-.dropdownpopup select option {
- font-size: 12px;
-}
View
@@ -2,9 +2,7 @@
require_once 'Zend/Date.php';
/**
- * Form field to display editable time values in an <input type="text">
- * field. Can optionally display a dropdown with predefined time ranges
- * through `setConfig('showdropdown', true)`.
+ * Form field to display editable time values in an <input type="text"> field.
*
* # Configuration
*
@@ -13,23 +11,19 @@
* through {@link Zend_Locale_Format::getTimeFormat()}.
* - 'use_strtotime' (boolean): Accept values in PHP's built-in strtotime() notation, in addition
* to the format specified in `timeformat`. Example inputs: 'now', '11pm', '23:59:59'.
- * - 'showdropdown': Show a dropdown with suggested date values.
- * CAUTION: The dropdown does not support localization.
*
* # Localization
*
* See {@link DateField}
*
* @todo Timezone support
- * @todo 'showdropdown' localization
*
* @package forms
* @subpackage fields-datetime
*/
class TimeField extends TextField {
protected $config = array(
- 'showdropdown' => false,
'timeformat' => 'HH:mm:ss',
'use_strtotime' => true,
'datavalueformat' => 'HH:mm:ss'
@@ -59,33 +53,6 @@ function __construct($name, $title = null, $value = ""){
parent::__construct($name,$title,$value);
}
- function Field() {
- $html = parent::Field();
-
- $html = $this->FieldDriver($html);
-
- return $html;
- }
-
- /**
- * Internal volatile API.
- *
- * @see DateField->FieldDriver()
- */
- protected function FieldDriver($html) {
- if($this->getConfig('showdropdown')) {
- Requirements::javascript(THIRDPARTY_DIR . '/behaviour/behaviour.js');
- Requirements::javascript(SAPPHIRE_DIR . '/javascript/TimeField_dropdown.js');
- Requirements::css(SAPPHIRE_DIR . '/css/TimeField_dropdown.css');
-
- $html .= sprintf('<img class="timeIcon" src="sapphire/images/clock-icon.gif" id="%s-icon"/>', $this->id());
- $html .= sprintf('<div class="dropdownpopup" id="%s-dropdowntime"></div>', $this->id());
- $html = '<div class="dropdowntime">' . $html . '</div>';
- }
-
- return $html;
- }
-
/**
* Sets the internal value to ISO date format.
*
@@ -1,103 +0,0 @@
-var DropdownTime = [];
-
-TimeBehaviour = {
- initialise : function () {
- this.isOpen = false;
-
- this.icon = document.getElementById( this.id + '-icon' );
-
- this.icon.onclick = this.toggle.bind( this );
-
- this.dropdowntime = document.getElementById( this.id + '-dropdowntime' );
-
- var dropdown =
- '<select id="' + this.id + '-dropdowntime' + '-select' + '" size="18">' +
- '<option value="12:00 am" class="midnight">Midnight</option>' +
- '<option value="01:00 am" class="evening">01:00 am</option>' +
- '<option value="02:00 am" class="evening">02:00 am</option>' +
- '<option value="03:00 am" class="evening">03:00 am</option>' +
- '<option value="04:00 am" class="evening">04:00 am</option>' +
- '<option value="05:00 am" class="evening">05:00 am</option>' +
- '<option value="06:00 am" class="morning">06:00 am</option>' +
- '<option value="07:00 am" class="morning">07:00 am</option>' +
- '<option value="07:30 am" class="morning">07:30 am</option>' +
- '<option value="08:00 am" class="morning" selected>08:00 am</option>' +
- '<option value="08:30 am" class="morning">08:30 am</option>' +
- '<option value="09:00 am" class="morning">09:00 am</option>' +
- '<option value="09:30 am" class="morning">09:30 am</option>' +
- '<option value="10:00 am" class="morning">10:00 am</option>' +
- '<option value="10:30 am" class="morning">10:30 am</option>' +
- '<option value="11:00 am" class="morning">11:00 am</option>' +
- '<option value="11:30 am" class="morning">11:30 am</option>' +
- '<option value="12:00 pm" class="noon">Noon</option>' +
- '<option value="12:30 pm" class="afternoon">12:30 pm</option>' +
- '<option value="01:00 pm" class="afternoon">01:00 pm</option>' +
- '<option value="01:30 pm" class="afternoon">01:30 pm</option>' +
- '<option value="02:00 pm" class="afternoon">02:00 pm</option>' +
- '<option value="02:30 pm" class="afternoon">02:30 pm</option>' +
- '<option value="03:00 pm" class="afternoon">03:00 pm</option>' +
- '<option value="03:30 pm" class="afternoon">03:30 pm</option>' +
- '<option value="04:00 pm" class="afternoon">04:00 pm</option>' +
- '<option value="04:30 pm" class="afternoon">04:30 pm</option>' +
- '<option value="05:00 pm" class="afternoon">05:00 pm</option>' +
- '<option value="05:30 pm" class="afternoon">05:30 pm</option>' +
- '<option value="06:00 pm" class="evening">06:00 pm</option>' +
- '<option value="06:30 pm" class="evening">06:30 pm</option>' +
- '<option value="07:00 pm" class="evening">07:00 pm</option>' +
- '<option value="07:30 pm" class="evening">07:30 pm</option>' +
- '<option value="08:00 pm" class="evening">08:00 pm</option>' +
- '<option value="08:30 pm" class="evening">08:30 pm</option>' +
- '<option value="09:00 pm" class="evening">09:00 pm</option>' +
- '<option value="09:30 pm" class="evening">09:30 pm</option>' +
- '<option value="10:00 pm" class="evening">10:00 pm</option>' +
- '<option value="10:30 pm" class="evening">10:30 pm</option>' +
- '<option value="11:00 pm" class="evening">11:00 pm</option>' +
- '<option value="11:30 pm" class="evening">11:30 pm</option>' +
- '</select>';
-
- this.dropdowntime.innerHTML = dropdown;
-
- DropdownTime[ DropdownTime.length ] = this.dropdowntime;
-
- this.selectTag = document.getElementById( this.id + '-dropdowntime' + '-select' );
-
- this.selectTag.onchange = this.updateValue.bind( this );
- },
-
- toggle : function() {
- if( this.isOpen )
- this.close();
- else
- this.open();
- },
-
- open : function() {
- this.isOpen = true;
- for( var i = 0; i < DropdownTime.length ; i++ ) {
- var dropdowntime = DropdownTime[i];
- if( dropdowntime == this.dropdowntime )
- Element.addClassName( dropdowntime, 'focused' );
- else
- Element.removeClassName( dropdowntime, 'focused' );
- }
- },
-
- close : function() {
- this.isOpen = false;
- Element.removeClassName( this.dropdowntime, 'focused' );
- },
-
- updateValue : function() {
- if( this.selectTag.selectedIndex != null ) {
- var timeValue = this.selectTag.options[ this.selectTag.selectedIndex ].value;
- this.value = timeValue;
- if(this.onchange) this.onchange();
- }
- this.close();
- }
-};
-
-Behaviour.register({
- 'div.dropdowntime input' : TimeBehaviour,
- 'li.dropdowntime input' : TimeBehaviour
-});

0 comments on commit 585a8bc

Please sign in to comment.