From ef7c175814fc4ea20909be0d19ab93cf23454f38 Mon Sep 17 00:00:00 2001
From: ralf <rb@egroupware.org>
Date: Fri, 29 Apr 2022 17:05:43 +0200
Subject: [PATCH] remove jQueryUI DateTime picker and splitter and use them
 also for eTemplates marked as legacy

---
 api/etemplate.php                            |  333 ++-
 api/js/etemplate/Et2Widget/Et2Widget.ts      |   12 +-
 api/js/etemplate/et2_widget_date.ts          | 1503 +-----------
 api/js/etemplate/et2_widget_split.ts         |  463 ----
 api/js/etemplate/etemplate2.ts               |    1 -
 api/js/jquery/jquery-ui-timepicker-addon.css |   30 -
 api/js/jquery/jquery-ui-timepicker-addon.js  | 2263 ------------------
 api/js/jquery/splitter.js                    |  338 ---
 api/src/Header/ContentSecurityPolicy.php     |    4 +-
 9 files changed, 207 insertions(+), 4740 deletions(-)
 delete mode 100644 api/js/etemplate/et2_widget_split.ts
 delete mode 100644 api/js/jquery/jquery-ui-timepicker-addon.css
 delete mode 100644 api/js/jquery/jquery-ui-timepicker-addon.js
 delete mode 100644 api/js/jquery/splitter.js

diff --git a/api/etemplate.php b/api/etemplate.php
index 227ecbe8db..88fd0034d4 100644
--- a/api/etemplate.php
+++ b/api/etemplate.php
@@ -13,8 +13,8 @@
 use EGroupware\Api;
 
 // add et2- prefix to following widgets/tags
-const ADD_ET2_PREFIX_REGEXP = '#<((/?)([vh]?box|textbox|textarea|button|colorpicker|description|image|url(-email|-phone|-fax)?))(/?|\s[^>]*)>#m';
-const ADD_ET2_PREFIX_LAST_GROUP = 5;
+const ADD_ET2_PREFIX_REGEXP = '#<((/?)([vh]?box|date(-time[^\s]*|-duration)?|textbox|textarea|button|colorpicker|description|image|url(-email|-phone|-fax)?))(/?|\s[^>]*)>#m';
+const ADD_ET2_PREFIX_LAST_GROUP = 6;
 
 // switch evtl. set output-compression off, as we cant calculate a Content-Length header with transparent compression
 ini_set('zlib.output_compression', 0);
@@ -52,201 +52,198 @@ function send_template()
 		http_response_code(404);
 		exit;
 	}
-	/* disable caching for now, as you need to delete the cache, once you change ADD_ET2_PREFIX_REGEXP
-	$cache = $GLOBALS['egw_info']['server']['temp_dir'].'/egw_cache/eT2-Cache-'.$GLOBALS['egw_info']['server']['install_id'].$_SERVER['PATH_INFO'];
-	if (file_exists($cache) && filemtime($cache) > filemtime($path) &&
+	$cache = $GLOBALS['egw_info']['server']['temp_dir'].'/egw_cache/eT2-Cache-'.
+		$GLOBALS['egw_info']['server']['install_id'].'-'.str_replace('/', '-', $_SERVER['PATH_INFO']);
+	if (file_exists($cache) && filemtime($cache) > max(filemtime($path), filemtime(__FILE__)) &&
 		($str = file_get_contents($cache)) !== false)
 	{
 		$cache_read = microtime(true);
 	}
-	else*/
-	if(($str = file_get_contents($path)) !== false &&
-		// eTemplate marked as legacy, return unchanged template without web-components / et2-prefix
-		!preg_match('/<overlay[^>]* legacy="true"/', $str))
+	elseif(($str = file_get_contents($path)) !== false)
 	{
 		// fix <menulist...><menupopup type="select-*"/></menulist> --> <select type="select-*" .../>
 		$str = preg_replace('#<menulist([^>]*)>[\r\n\s]*<menupopup([^>]+>)[\r\n\s]*</menulist>#', '<select$1$2', $str);
 
-		// fix legacy options, so new client-side has not to deal with them
-		$str = preg_replace_callback('#<([^- />]+)(-[^ ]+)?[^>]* (options="([^"]+)")[ />]#', static function($matches)
-		{
-			// take care of (static) type attribute, if used
-			if (preg_match('/ type="([a-z-]+)"/', $matches[0], $type))
-			{
-				str_replace('<'.$matches[1].$matches[2], '<'.$type[1], $matches[0]);
-				str_replace($type[0], '', $matches[0]);
-				list($matches[1], $matches[2]) = explode('-', $type[1], 2);
-			}
-			static $legacy_options = array( // use "ignore" to ignore further comma-sep. values, otherwise they are all in last attribute
-				'select'       => 'empty_label,ignore',
-				'select-account' => 'empty_label,account_type,ignore',
-				'box'          => ',cellpadding,cellspacing,keep',
-				'hbox'         => 'cellpadding,cellspacing,keep',
-				'vbox'         => 'cellpadding,cellspacing,keep',
-				'groupbox'     => 'cellpadding,cellspacing,keep',
-				'checkbox'     => 'selected_value,unselected_value,ro_true,ro_false',
-				'radio'        => 'set_value,ro_true,ro_false',
-				'customfields' => 'sub-type,use-private,field-names',
-				'date'         => 'data_format,ignore', // Legacy option "mode" was never implemented in et2
-				'description'  => 'bold-italic,link,activate_links,label_for,link_target,link_popup_size,link_title',
-				'button'       => 'image,ro_image',
-				'buttononly'   => 'image,ro_image',
-			);
-			// prefer more specific type-subtype over just type
-			$names = $legacy_options[$matches[1].$matches[2]] ?? $legacy_options[$matches[1]] ?? null;
-			if (isset($names))
-			{
-				$names = explode(',', $names);
-				$values = Api\Etemplate\Widget::csv_split($matches[4], count($names));
-				if (count($values) < count($names))
-				{
-					$values = array_merge($values, array_fill(count($values), count($names)-count($values), ''));
-				}
-				$attrs = array_diff(array_combine($names, $values), ['', null]);
-				unset($attrs['ignore']);
-				// fix select options can be either multiple or empty_label
-				if ($matches[1] === 'select' && !empty($attrs['empty_label']) && (int)$attrs['empty_label'] > 0)
-				{
-					$attrs['multiple'] = (int)$attrs['empty_label'];
-					unset($matches['empty_label']);
-				}
-				$options = '';
-				foreach($attrs as $attr => $value)
-				{
-					$options .= $attr.'="'.$value.'" ';
-				}
-				return str_replace($matches[3], $options, $matches[0]);
-			}
-			return $matches[0];
-		}, $str);
-
-		// fix deprecated attributes: needed, blur, ...
-		static $deprecated = [
-			'needed' => 'required',
-			'blur'   => 'placeholder',
-		];
-		$str = preg_replace_callback('#<[^ ]+[^>]* ('.implode('|', array_keys($deprecated)).')="([^"]+)"[ />]#',
-			static function($matches) use ($deprecated)
-		{
-			return str_replace($matches[1].'="', $deprecated[$matches[1]].'="', $matches[0]);
-		}, $str);
-
-		// fix <textbox multiline="true" .../> --> <textarea .../> (et2-prefix and self-closing is handled below)
-		$str = preg_replace('#<textbox(.*?)\smultiline="true"(.*?)/>#u', '<textarea$1$2/>', $str);
-
-		// fix <(textbox|int(eger)?|float) precision="int(eger)?|float" .../> --> <et2-number precision=...></et2-number>
-		$str = preg_replace_callback('#<(textbox|int(eger)?|float|number).*?\s(type="(int(eger)?|float)")?.*?/>#u',
-			static function($matches)
-		{
-			if ($matches[1] === 'textbox' && !in_array($matches[4], ['float', 'int', 'integer'], true))
-			{
-				return $matches[0]; // regular textbox --> nothing to do
-			}
-			$type =  $matches[1] === 'float' || $matches[4] === 'float' ? 'float' : 'int';
-			$tag = str_replace('<'.$matches[1], '<et2-number', substr($matches[0], 0, -2));
-			if (!empty($matches[3])) $tag = str_replace($matches[3], '', $tag);
-			if ($type !== 'float') $tag .= ' precision="0"';
-			return $tag.'></et2-number>';
-		}, $str);
-
-		// fix <button(only)?.../> --> <et2-button(-image)? noSubmit="true".../>
-		$str = preg_replace_callback('#<button(only)?\s(.*?)/>#u', function($matches) use ($name)
-		{
-			$tag = 'et2-button';
-			preg_match_all('/(^| )([a-z0-9_-]+)="([^"]+)"/', $matches[2], $attrs, PREG_PATTERN_ORDER);
-			$attrs = array_combine($attrs[2], $attrs[3]);
-			// replace buttononly tag with noSubmit="true" attribute
-			if(!empty($matches[1]))
-			{
-				$attrs['noSubmit'] = 'true';
-			}
-			// novalidation --> noValidation
-			if(!empty($attrs['novalidation']) && in_array($attrs['novalidation'], ['true', '1'], true))
-			{
-				unset($attrs['novalidation']);
-				$attrs['noValidation'] = 'true';
-			}
-			// replace not set background_image attribute with et2-image tag, if not in NM / lists
-			if(!empty($attrs['image']) && (empty($attrs['background_image']) || $attrs['background_image'] === 'false') &&
-				!preg_match('/^(index|list)/', $name))
-			{
-				$tag = 'et2-image';
-				$attrs['src'] = $attrs['image'];
-				unset($attrs['image']);
-				// Was expected to submit.  Images don't have noValidation, so add directly
-				if(!array_key_exists('onclick', $attrs) && empty($attrs['noSubmit']))
-				{
-					$attrs['onclick'] = 'this.getInstanceManager().submit(this, undefined, ' . $attrs['noValidation'] . ')';
-				}
-			}
-			unset($attrs['background_image']);
-			return "<$tag ".implode(' ', array_map(function($name, $value)
-				{
-					return $name.'="'.$value.'"';
-				}, array_keys($attrs), $attrs)).'></'.$tag.'>';
-		}, $str);
-
-		$str = preg_replace_callback(ADD_ET2_PREFIX_REGEXP, static function (array $matches)
-		{
-			return '<' . $matches[2] . 'et2-' . $matches[3] .
-				// web-components must not be self-closing (no "<et2-button .../>", but "<et2-button ...></et2-button>")
-				(substr($matches[ADD_ET2_PREFIX_LAST_GROUP], -1) === '/' ? substr($matches[ADD_ET2_PREFIX_LAST_GROUP], 0, -1) .
-					'></et2-' . $matches[3] : $matches[ADD_ET2_PREFIX_LAST_GROUP]) . '>';
-		}, $str);
-
-		// handling of date and partially implemented select widget (no search or tags attribute), incl. removing of type attribute
-		$str = preg_replace_callback('#<(select|date)(-[^ ]+)? ([^>]+)/>#', static function (array $matches)
-		{
-			preg_match_all('/(^| )([a-z0-9_-]+)="([^"]+)"/', $matches[3], $attrs, PREG_PATTERN_ORDER);
-			$attrs = array_combine($attrs[2], $attrs[3]);
-
-			// add et2-prefix for <date-* and <select-* without search or tags attribute
-			if ($matches[1] === 'date' || $matches[1] === 'select' && !isset($attrs['search']) && !isset($attrs['tags']))
-			{
-				// type attribute need to go in widget type <select type="select-account" --> <et2-select-account
-				if(empty($matches[2]) && isset($attrs['type']))
-				{
-					$matches[1] = $attrs['type'];
-					$matches[3] = str_replace('type="' . $attrs['type'] . '"', '', $matches[3]);
-				}
-				return '<et2-' . $matches[1] . $matches[2] . ' ' . $matches[3] . '></et2-' . $matches[1] . $matches[2] . '>';
-			}
-			return $matches[0];
-		},                           $str);
-
 		// Change splitter dockside -> primary + vertical
-		$str = preg_replace_callback('#<split([^>]*?)>(.*)</split>#su', function ($matches) use ($name)
-		{
+		$str = preg_replace_callback('#<split([^>]*?)>(.*)</split>#su', static function ($matches) use ($name) {
 			$tag = 'et2-split';
 			preg_match_all('/(^| )([a-z0-9_-]+)="([^"]+)"/', $matches[1], $attrs, PREG_PATTERN_ORDER);
 			$attrs = array_combine($attrs[2], $attrs[3]);
 
-			$attrs['vertical'] = $attrs['orientation'] == 'h' ? "true" : "false";
-			if(str_contains($attrs['dock_side'], 'top') || str_contains($attrs['dock_side'], 'left'))
+			$attrs['vertical'] = $attrs['orientation'] === 'h' ? "true" : "false";
+			if (str_contains($attrs['dock_side'], 'top') || str_contains($attrs['dock_side'], 'left'))
 			{
 				$attrs['primary'] = "end";
 			}
-			elseif(str_contains($attrs['dock_side'], 'bottom') || str_contains($attrs['dock_side'], 'right'))
+			elseif (str_contains($attrs['dock_side'], 'bottom') || str_contains($attrs['dock_side'], 'right'))
 			{
 				$attrs['primary'] = "start";
 			}
 			unset($attrs['dock_side']);
 
-			return "<$tag " . implode(' ', array_map(function ($name, $value)
-										 {
-											 return $name . '="' . $value . '"';
-										 }, array_keys($attrs), $attrs)
+			return "<$tag " . implode(' ', array_map(function ($name, $value) {
+						return $name . '="' . $value . '"';
+					}, array_keys($attrs), $attrs)
 				) . '>' . $matches[2] . "</$tag>";
-		},                           $str);
+		}, $str);
 
+		// ^^^^^^^^^^^^^^^^ above widgets get transformed independent of legacy="true" set in overlay ^^^^^^^^^^^^^^^^^^
+
+		// eTemplate marked as legacy --> replace only some widgets (eg. requiring jQueryUI) with web-components
+		if (preg_match('/<overlay[^>]* legacy="true"/', $str))
+		{
+			$str = preg_replace('#<date(-time[^\s]*|-duration)?\s([^>]+)/>#', '<et2-date$1 $2></et2-date$1>', $str);
+		}
+		else
+		{
+			// fix legacy options, so new client-side has not to deal with them
+			$str = preg_replace_callback('#<([^- />]+)(-[^ ]+)?[^>]* (options="([^"]+)")[ />]#', static function ($matches) {
+				// take care of (static) type attribute, if used
+				if (preg_match('/ type="([a-z-]+)"/', $matches[0], $type))
+				{
+					str_replace('<' . $matches[1] . $matches[2], '<' . $type[1], $matches[0]);
+					str_replace($type[0], '', $matches[0]);
+					list($matches[1], $matches[2]) = explode('-', $type[1], 2);
+				}
+				static $legacy_options = array( // use "ignore" to ignore further comma-sep. values, otherwise they are all in last attribute
+					'select' => 'empty_label,ignore',
+					'select-account' => 'empty_label,account_type,ignore',
+					'box' => ',cellpadding,cellspacing,keep',
+					'hbox' => 'cellpadding,cellspacing,keep',
+					'vbox' => 'cellpadding,cellspacing,keep',
+					'groupbox' => 'cellpadding,cellspacing,keep',
+					'checkbox' => 'selected_value,unselected_value,ro_true,ro_false',
+					'radio' => 'set_value,ro_true,ro_false',
+					'customfields' => 'sub-type,use-private,field-names',
+					'date' => 'data_format,ignore', // Legacy option "mode" was never implemented in et2
+					'description' => 'bold-italic,link,activate_links,label_for,link_target,link_popup_size,link_title',
+					'button' => 'image,ro_image',
+					'buttononly' => 'image,ro_image',
+				);
+				// prefer more specific type-subtype over just type
+				$names = $legacy_options[$matches[1] . $matches[2]] ?? $legacy_options[$matches[1]] ?? null;
+				if (isset($names))
+				{
+					$names = explode(',', $names);
+					$values = Api\Etemplate\Widget::csv_split($matches[4], count($names));
+					if (count($values) < count($names))
+					{
+						$values = array_merge($values, array_fill(count($values), count($names) - count($values), ''));
+					}
+					$attrs = array_diff(array_combine($names, $values), ['', null]);
+					unset($attrs['ignore']);
+					// fix select options can be either multiple or empty_label
+					if ($matches[1] === 'select' && !empty($attrs['empty_label']) && (int)$attrs['empty_label'] > 0)
+					{
+						$attrs['multiple'] = (int)$attrs['empty_label'];
+						unset($matches['empty_label']);
+					}
+					$options = '';
+					foreach ($attrs as $attr => $value)
+					{
+						$options .= $attr . '="' . $value . '" ';
+					}
+					return str_replace($matches[3], $options, $matches[0]);
+				}
+				return $matches[0];
+			}, $str);
+
+			// fix deprecated attributes: needed, blur, ...
+			static $deprecated = [
+				'needed' => 'required',
+				'blur' => 'placeholder',
+			];
+			$str = preg_replace_callback('#<[^ ]+[^>]* (' . implode('|', array_keys($deprecated)) . ')="([^"]+)"[ />]#',
+				static function ($matches) use ($deprecated) {
+					return str_replace($matches[1] . '="', $deprecated[$matches[1]] . '="', $matches[0]);
+				}, $str);
+
+			// fix <textbox multiline="true" .../> --> <textarea .../> (et2-prefix and self-closing is handled below)
+			$str = preg_replace('#<textbox(.*?)\smultiline="true"(.*?)/>#u', '<textarea$1$2/>', $str);
+
+			// fix <(textbox|int(eger)?|float) precision="int(eger)?|float" .../> --> <et2-number precision=...></et2-number>
+			$str = preg_replace_callback('#<(textbox|int(eger)?|float|number).*?\s(type="(int(eger)?|float)")?.*?/>#u',
+				static function ($matches) {
+					if ($matches[1] === 'textbox' && !in_array($matches[4], ['float', 'int', 'integer'], true))
+					{
+						return $matches[0]; // regular textbox --> nothing to do
+					}
+					$type = $matches[1] === 'float' || $matches[4] === 'float' ? 'float' : 'int';
+					$tag = str_replace('<' . $matches[1], '<et2-number', substr($matches[0], 0, -2));
+					if (!empty($matches[3])) $tag = str_replace($matches[3], '', $tag);
+					if ($type !== 'float') $tag .= ' precision="0"';
+					return $tag . '></et2-number>';
+				}, $str);
+
+			// fix <button(only)?.../> --> <et2-button(-image)? noSubmit="true".../>
+			$str = preg_replace_callback('#<button(only)?\s(.*?)/>#u', function ($matches) use ($name) {
+				$tag = 'et2-button';
+				preg_match_all('/(^| )([a-z0-9_-]+)="([^"]+)"/', $matches[2], $attrs, PREG_PATTERN_ORDER);
+				$attrs = array_combine($attrs[2], $attrs[3]);
+				// replace buttononly tag with noSubmit="true" attribute
+				if (!empty($matches[1]))
+				{
+					$attrs['noSubmit'] = 'true';
+				}
+				// novalidation --> noValidation
+				if (!empty($attrs['novalidation']) && in_array($attrs['novalidation'], ['true', '1'], true))
+				{
+					unset($attrs['novalidation']);
+					$attrs['noValidation'] = 'true';
+				}
+				// replace not set background_image attribute with et2-image tag, if not in NM / lists
+				if (!empty($attrs['image']) && (empty($attrs['background_image']) || $attrs['background_image'] === 'false') &&
+					!preg_match('/^(index|list)/', $name))
+				{
+					$tag = 'et2-image';
+					$attrs['src'] = $attrs['image'];
+					unset($attrs['image']);
+					// Was expected to submit.  Images don't have noValidation, so add directly
+					if (!array_key_exists('onclick', $attrs) && empty($attrs['noSubmit']))
+					{
+						$attrs['onclick'] = 'this.getInstanceManager().submit(this, undefined, ' . $attrs['noValidation'] . ')';
+					}
+				}
+				unset($attrs['background_image']);
+				return "<$tag " . implode(' ', array_map(function ($name, $value) {
+						return $name . '="' . $value . '"';
+					}, array_keys($attrs), $attrs)) . '></' . $tag . '>';
+			}, $str);
+
+			$str = preg_replace_callback(ADD_ET2_PREFIX_REGEXP, static function (array $matches) {
+				return '<' . $matches[2] . 'et2-' . $matches[3] .
+					// web-components must not be self-closing (no "<et2-button .../>", but "<et2-button ...></et2-button>")
+					(substr($matches[ADD_ET2_PREFIX_LAST_GROUP], -1) === '/' ? substr($matches[ADD_ET2_PREFIX_LAST_GROUP], 0, -1) .
+						'></et2-' . $matches[3] : $matches[ADD_ET2_PREFIX_LAST_GROUP]) . '>';
+			}, $str);
+
+			// handling of date and partially implemented select widget (no search or tags attribute), incl. removing of type attribute
+			$str = preg_replace_callback('#<(select)(-[^ ]+)? ([^>]+)/>#', static function (array $matches) {
+				preg_match_all('/(^| )([a-z0-9_-]+)="([^"]+)"/', $matches[3], $attrs, PREG_PATTERN_ORDER);
+				$attrs = array_combine($attrs[2], $attrs[3]);
+
+				// add et2-prefix for <date-* and <select-* without search or tags attribute
+				if (!isset($attrs['search']) && !isset($attrs['tags']))
+				{
+					// type attribute need to go in widget type <select type="select-account" --> <et2-select-account
+					if (empty($matches[2]) && isset($attrs['type']))
+					{
+						$matches[1] = $attrs['type'];
+						$matches[3] = str_replace('type="' . $attrs['type'] . '"', '', $matches[3]);
+					}
+					return '<et2-' . $matches[1] . $matches[2] . ' ' . $matches[3] . '></et2-' . $matches[1] . $matches[2] . '>';
+				}
+				return $matches[0];
+			}, $str);
+		}
 		$processing = microtime(true);
 
-		if(isset($cache) && (file_exists($cache_dir = dirname($cache)) || mkdir($cache_dir, 0755, true)))
+		if (isset($cache) && (file_exists($cache_dir = dirname($cache)) || mkdir($cache_dir, 0755, true) || is_dir($cache_dir)))
 		{
 			file_put_contents($cache, $str);
 		}
 	}
-	// stop here for not existing file path-traversal for both file and cache here
+	// stop here for not existing file or path-traversal for both file and cache here
 	if(empty($str) || strpos($path, '..') !== false)
 	{
 		http_response_code(404);
diff --git a/api/js/etemplate/Et2Widget/Et2Widget.ts b/api/js/etemplate/Et2Widget/Et2Widget.ts
index ec9d0682d0..536f785ff5 100644
--- a/api/js/etemplate/Et2Widget/Et2Widget.ts
+++ b/api/js/etemplate/Et2Widget/Et2Widget.ts
@@ -1249,8 +1249,18 @@ export const Et2Widget = dedupeMixin(Et2WidgetMixin);
  * @param parent Parent widget
  */
 // @ts-ignore Et2Widget is I guess not the right type
-export function loadWebComponent(_nodeName : string, _template_node, parent : Et2Widget | et2_widget) : HTMLElement
+export function loadWebComponent(_nodeName : string, _template_node : Element|{[index: string]: any}, parent : Et2Widget | et2_widget) : HTMLElement
 {
+	// support attributes object instead of an Element
+	if (typeof _template_node.getAttribute === 'undefined')
+	{
+		const _names = Object.keys(_template_node);
+		_template_node.getAttributeNames = () => _names;
+		_template_node.getAttribute = attr => _template_node[attr];
+		_template_node.querySelectorAll = () => [];
+		(<any>_template_node).nodeName = _nodeName;
+		(<any>_template_node).childNodes = [];
+	}
 	// Try to find the class for the given node
 	let widget_class = window.customElements.get(_nodeName);
 	if(!widget_class)
diff --git a/api/js/etemplate/et2_widget_date.ts b/api/js/etemplate/et2_widget_date.ts
index a07ab85f91..70935718c8 100644
--- a/api/js/etemplate/et2_widget_date.ts
+++ b/api/js/etemplate/et2_widget_date.ts
@@ -1,5 +1,5 @@
 /**
- * EGroupware eTemplate2 - JS Date object
+ * EGroupware eTemplate2 - Stubs for no longer existing legacy date-widget
  *
  * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
  * @package etemplate
@@ -9,1487 +9,42 @@
  * @copyright Nathan Gray 2011
  */
 
-import {et2_csvSplit, et2_no_init} from "./et2_core_common";
 import {ClassWithAttributes} from "./et2_core_inheritance";
-import {et2_createWidget, et2_register_widget, et2_widget, WidgetConfig} from "./et2_core_widget";
-import {et2_valueWidget} from './et2_core_valueWidget'
+import {et2_register_widget, et2_widget, WidgetConfig} from "./et2_core_widget";
 import {et2_inputWidget} from './et2_core_inputWidget'
-import {et2_selectbox} from './et2_widget_selectbox'
-import {et2_DOMWidget} from "./et2_core_DOMWidget";
-import {et2_IDetachedDOM} from "./et2_core_interfaces";
-import {egw} from "../jsapi/egw_global";
 import {date} from "./lib/date.js";
-import {egwIsMobile,sprintf} from "../egw_action/egw_action_common.js";
 
-// all calls to jQueryUI.datetimepicker as jQuery.datepicker give errors which are currently suppressed with @ts-ignore
-// adding npm package @types/jquery.ui.datetimepicker did NOT help :(
+import {Et2Date} from "./Et2Date/Et2Date";
+import {Et2DateDuration} from "./Et2Date/Et2DateDuration";
+import {Et2DateDurationReadonly} from "./Et2Date/Et2DateDurationReadonly";
+import {Et2DateReadonly} from "./Et2Date/Et2DateReadonly";
+import {loadWebComponent} from "./Et2Widget/Et2Widget";
+import {Et2Select} from "./Et2Select/Et2Select";
 
 /**
- * Class which implements the "date" XET-Tag
- *
- * Dates are passed to the server in ISO8601 format ("Y-m-d\TH:i:sP"), and data_format is
- * handled server-side.
- *
- * Widgets uses jQuery date- and time-picker for desktop browsers and
- * HTML5 input fields for mobile devices to get their native UI for date/time entry.
+ * @deprecated use Et2Date
  */
-export class et2_date extends et2_inputWidget
-{
-	static readonly _attributes: any = {
-		"value": {
-			"type": "any"
-		},
-		"type": {
-			"ignore": false
-		},
-		"blur": {
-			"name": "Placeholder",
-			"type": "string",
-			"default": "",
-			"description": "This text get displayed if an input-field is empty and does not have the input-focus (blur). It can be used to show a default value or a kind of help-text."
-		},
-		"data_format": {
-			"ignore": true,
-			"description": "Date/Time format. Can be set as an options to date widget",
-			"default": ''
-		},
-		year_range: {
-			name: "Year range",
-			type: "string",
-			default: "c-10:c+10",
-			description: "The range of years displayed in the year drop-down: either relative to today's year (\"-nn:+nn\"), relative to the currently selected year (\"c-nn:c+nn\"), absolute (\"nnnn:nnnn\"), or combinations of these formats (\"nnnn:-nn\"). Note that this option only affects what appears in the drop-down, to restrict which dates may be selected use the min and/or max options."
-		},
-		min: {
-			"name": "Minimum",
-			"type": "any",
-			"default": et2_no_init,
-			"description": 'Minimum allowed date.  Multiple types supported:\
-Date: A date object containing the minimum date.\
-Number: A number of days from today. For example 2 represents two days from today and -1 represents yesterday.\
-String: A string in the user\'s date format, or a relative date. Relative dates must contain value and period pairs; valid periods are "y" for years, "m" for months, "w" for weeks, and "d" for days. For example, "+1m +7d" represents one month and seven days from today.'
-		},
-		max: {
-			"name": "Maximum",
-			"type": "any",
-			"default": et2_no_init,
-			"description": 'Maximum allowed date.   Multiple types supported:\
-Date: A date object containing the maximum date.\
-Number: A number of days from today. For example 2 represents two days from today and -1 represents yesterday.\
-String: A string in the user\'s date format, or a relative date. Relative dates must contain value and period pairs; valid periods are "y" for years, "m" for months, "w" for weeks, and "d" for days. For example, "+1m +7d" represents one month and seven days from today.'
-		},
-		inline: {
-			"name": "Inline",
-			"type": "boolean",
-			"default": false,
-			"description": "Instead of an input field with a popup calendar, the calendar is displayed inline, with no input field"
-		}
-	};
-
-	public static readonly legacyOptions: string[] = ["data_format"];
-	date: Date;
-	span: JQuery;
-	input_date: JQuery = null;
-	is_mobile: boolean = false;
-	dateFormat: string;
-	timeFormat: string;
-
-	/**
-	 * Constructor
-	 */
-	constructor(_parent, _attrs? : WidgetConfig, _child? : object)
-	{
-		// Call the inherited constructor
-		super(_parent, _attrs, ClassWithAttributes.extendAttributes(et2_date._attributes, _child || {}));
-
-		this.date = new Date();
-		this.date.setUTCHours(0);
-		this.date.setMinutes(0);
-		this.date.setSeconds(0);
-	
-		this.createInputWidget();
-	}
-
-	createInputWidget()
-	{
-		this.span = jQuery(document.createElement(this.options.inline ? 'div' : "span")).addClass("et2_date");
-
-		this.input_date = jQuery(document.createElement(this.options.inline ? "div" : "input"));
-		if (this.options.blur) this.input_date.attr('placeholder', this.egw().lang(this.options.blur));
-		this.input_date.addClass("et2_date").attr("type", "text")
-			.attr("size", 7)	// strlen("10:00pm")=7
-			.appendTo(this.span);
-
-		this.setDOMNode(this.span[0]);
-
-		// inline calendar is not existing in html5, so allways use datepicker instead
-		this.is_mobile = egwIsMobile() && !this.options.inline;
-
-		if (this.is_mobile)
-		{
-			this.dateFormat = 'yy-mm-dd';
-			this.timeFormat = 'HH:mm';
-			switch(this.getType())
-			{
-				case 'date':
-					this.input_date.attr('type', 'date');
-					break;
-				case 'date-time':
-					this.input_date.attr('type', 'datetime-local');
-					break;
-				case 'date-timeonly':
-					this.input_date.addClass("et2_time");
-					this.input_date.attr('type', 'time');
-					break;
-			}
-		}
-		else
-		{
-			this.dateFormat = this.egw().dateTimeFormat(this.egw().preference("dateformat"));
-			this.timeFormat = this.egw().preference("timeformat") == 12 ? "h:mmtt" : "HH:mm";
-			// jQuery-UI date picker
-			if(this.getType() != 'date-timeonly')
-			{
-				this.egw().calendar(this.input_date, this.getType() == "date-time");
-			}
-			else
-			{
-				this.input_date.addClass("et2_time");
-				this.egw().time(this.input_date);
-			}
-
-			// Avoid collision of datepicker dialog with input field
-			var widget = this;
-			this.input_date.datepicker('option', 'beforeShow', function(input, inst){
-				var cal = inst.dpDiv;
-				setTimeout(function () {
-					var $input = jQuery(input);
-					var inputOffset = $input.offset();
-					// position the datepicker in freespace zone
-					// avoid datepicker calendar collision with input field
-					if (cal.height() + inputOffset.top > window.innerHeight)
-					{
-						cal.position({
-							my: "left center",
-							at: 'right bottom',
-							collision: 'flip fit',
-							of: input
-						});
-					}
-					// Add tooltip to Today/Now button
-					jQuery('[data-handler="today"]',cal).attr('title',
-						widget.getType() == 'date' ? egw.lang('Today') : egw.lang('Now')
-					);
-
-				},0);
-			})
-			.datepicker('option','onClose', function(dateText, inst) {
-				// Lose focus, avoids an issue with focus
-				// not allowing datepicker to re-open
-				inst.input.blur();
-			});
-		}
-
-		// Update internal value when changed
-		var self = this;
-		this.input_date.bind('change', function(e){
-			self.set_value(this.value);
-			return false;
-		});
-
-		// Framewok skips nulls, but null needs to be processed here
-		if(this.options.value == null)
-		{
-			this.set_value(null);
-		}
-	}
-
-	/**
-	 * Calendar popup sets the ID of the input, we can't change that like other inputWidgets can
-	 *
-	 * @param _value
-	 */
-	set_id(_value)
-	{
-		this.id = _value;
-		this.dom_id = _value && this.getInstanceManager() ? this.getInstanceManager().uniqueId+'_'+this.id : _value;
-
-		var node = this.getDOMNode(this);
-		if (node)
-		{
-			if (_value != "")
-			{
-				node.setAttribute("id", this.dom_id);
-			}
-			else
-			{
-				node.removeAttribute("id");
-			}
-		}
-	}
-
-	getInputNode(): HTMLElement
-	{
-		return this.options.inline ? super.getInputNode() : this.input_date[0];
-	}
-
-	set_type(_type)
-	{
-		if(_type != this.getType())
-		{
-			super.setType(_type);
-			this.createInputWidget();
-		}
-	}
-
-	/**
-	 * Dynamic disable or enable datepicker
-	 *
-	 * @param {boolean} _ro
-	 */
-	set_readonly(_ro)
-	{
-		if (this.input_date && !this.input_date.attr('disabled') != !_ro)
-		{
-			this.input_date.prop('disabled', !!_ro)
-				.datepicker('option', 'disabled', !!_ro);
-		}
-	}
-
-	/**
-	 * Set (full) year of current date
-	 *
-	 * @param {number} _value 4-digit year
-	 */
-	set_year(_value)
-	{
-		this.date.setUTCFullYear(_value);
-		this.set_value(this.date);
-	}
-	/**
-	 * Set month (1..12) of current date
-	 *
-	 * @param {number} _value 1..12
-	 */
-	set_month(_value)
-	{
-		this.date.setUTCMonth(_value-1);
-		this.set_value(this.date);
-	}
-	/**
-	 * Set day of current date
-	 *
-	 * @param {number} _value 1..31
-	 */
-	set_date(_value)
-	{
-		this.date.setUTCDate(_value);
-		this.set_value(this.date);
-	}
-	/**
-	 * Set hour (0..23) of current date
-	 *
-	 * @param {number} _value 0..23
-	 */
-	set_hours(_value)
-	{
-		this.date.setUTCHours(_value);
-		this.set_value(this.date);
-	}
-	/**
-	 * Set minute (0..59) of current date
-	 *
-	 * @param {number} _value 0..59
-	 */
-	set_minutes(_value)
-	{
-		this.date.setUTCMinutes(_value);
-		this.set_value(this.date);
-	}
-	/**
-	 * Get (full) year of current date
-	 *
-	 * @return {number|null} 4-digit year or null for empty
-	 */
-	get_year()
-	{
-		return this.input_date.val() == "" ? null : this.date.getUTCFullYear();
-	}
-	/**
-	 * Get month (1..12) of current date
-	 *
-	 * @return {number|null} 1..12 or null for empty
-	 */
-	get_month()
-	{
-		return this.input_date.val() == "" ? null : this.date.getUTCMonth()+1;
-	}
-	/**
-	 * Get day of current date
-	 *
-	 * @return {number|null} 1..31 or null for empty
-	 */
-	get_date()
-	{
-		return this.input_date.val() == "" ? null : this.date.getUTCDate();
-	}
-	/**
-	 * Get hour (0..23) of current date
-	 *
-	 * @return {number|null} 0..23 or null for empty
-	 */
-	get_hours()
-	{
-		return this.input_date.val() == "" ? null : this.date.getUTCHours();
-	}
-	/**
-	 * Get minute (0..59) of current date
-	 *
-	 * @return {number|null} 0..59 or null for empty
-	 */
-	get_minutes()
-	{
-		return this.input_date.val() == "" ? null : this.date.getUTCMinutes();
-	}
-	/**
-	 * Get timestamp
-	 *
-	 * You can use set_value to set a timestamp.
-	 *
-	 * @return {number|null} timestamp (seconds since 1970-01-01)
-	 */
-	get_time()
-	{
-		return this.input_date.val() == "" ? null : this.date.getTime();
-	}
-
-	/**
-	 * The range of years displayed in the year drop-down: either relative
-	 * to today's year ("-nn:+nn"), relative to the currently selected year
-	 * ("c-nn:c+nn"), absolute ("nnnn:nnnn"), or combinations of these formats
-	 * ("nnnn:-nn"). Note that this option only affects what appears in the
-	 * drop-down, to restrict which dates may be selected use the min_date
-	 * and/or max_date options.
-	 * @param {string} _value
-	 */
-	set_year_range(_value)
-	{
-		if(this.input_date && this.getType() == 'date' && !this.is_mobile)
-		{
-			this.input_date.datepicker('option','yearRange',_value);
-		}
-		this.options.year_range = _value;
-	}
-
-	/**
-	 * Set the minimum allowed date
-	 *
-	 * The minimum selectable date. When set to null, there is no minimum.
-	 *	Multiple types supported:
-	 *	Date: A date object containing the minimum date.
-	 *	Number: A number of days from today. For example 2 represents two days
-	 *		from today and -1 represents yesterday.
-	 *	String: A string in the format defined by the dateFormat option, or a
-	 *		relative date. Relative dates must contain value and period pairs;
-	 *		valid periods are "y" for years, "m" for months, "w" for weeks, and
-	 *		"d" for days. For example, "+1m +7d" represents one month and seven
-	 *		days from today.
-	 * @param {Date|Number|String} _value
-	 */
-	set_min(_value)
-	{
-		// minDate option checks the type, so make sure we're passing numbers as numbers (0, not "0")
-		// @ts-ignore
-		if(typeof _value === "string" && !isNaN(_value) && "" + parseInt(_value) == _value)
-		{
-			_value = parseInt(_value);
-		}
-		if(this.input_date)
-		{
-			if(this.is_mobile)
-			{
-				this.input_date.attr('min', this._relativeDate(_value));
-			}
-			else
-			{
-				// Check for full timestamp
-				if(typeof _value == 'string' && _value.match(/(\d{4})-(\d{2})-(\d{2})T(\d{2})\:(\d{2})\:(\d{2})(?:\.\d{3})?(?:Z|[+-](\d{2})\:(\d{2}))/))
-				{
-					_value = new Date(_value);
-					// Add timezone offset back in, or formatDate will lose those hours
-					var formatDate = new Date(_value.valueOf() + this.date.getTimezoneOffset() * 60 * 1000);
-					if(this.getType() == 'date')
-					{
-						_value = jQuery.datepicker.formatDate(this.dateFormat, formatDate);
-					}
-				}
-				this.input_date.datepicker('option','minDate',_value);
-			}
-		}
-		this.options.min = _value;
-	}
-
-	/**
-	 * Convert non html5 min or max attributes described above to timestamps
-	 *
-	 * @param {string|Date} _value
-	 */
-	_relativeDate(_value)
-	{
-		if (typeof _value == 'string' && _value.match(/^\d{4}-\d{2}-\d{2}T\d{2}:\d{2}/)) return _value;
-
-		// @ts-ignore
-		return jQuery.datepicker._determineDate(jQuery.datepicker, _value, this.date).toJSON();
-	}
-
-	/**
-	 * Set the maximum allowed date
-	 *
-	 * The maximum selectable date. When set to null, there is no maximum.
-	 *	Multiple types supported:
-	 *	Date: A date object containing the maximum date.
-	 *	Number: A number of days from today. For example 2 represents two days
-	 *		from today and -1 represents yesterday.
-	 *	String: A string in the format defined by the dateFormat option, or a
-	 *		relative date. Relative dates must contain value and period pairs;
-	 *		valid periods are "y" for years, "m" for months, "w" for weeks, and
-	 *		"d" for days. For example, "+1m +7d" represents one month and seven
-	 *		days from today.
-	 * @param {Date|Number|String} _value
-	 */
-	set_max(_value)
-	{
-		// maxDate option checks the type, so make sure we're passing numbers as numbers (0, not "0")
-		// @ts-ignore
-		if(typeof _value === "string" && !isNaN(_value) && "" + parseInt(_value) == _value)
-		{
-			_value = parseInt(_value);
-		}
-		if(this.input_date)
-		{
-			if(this.is_mobile)
-			{
-				this.input_date.attr('max', this._relativeDate(_value));
-			}
-			else
-			{
-				// Check for full timestamp
-				if(typeof _value == 'string' && _value.match(/(\d{4})-(\d{2})-(\d{2})T(\d{2})\:(\d{2})\:(\d{2})(?:\.\d{3})?(?:Z|[+-](\d{2})\:(\d{2}))/))
-				{
-					_value = new Date(_value);
-					// Add timezone offset back in, or formatDate will lose those hours
-					var formatDate = new Date(_value.valueOf() + this.date.getTimezoneOffset() * 60 * 1000);
-					if(this.getType() == 'date')
-					{
-						_value = jQuery.datepicker.formatDate(this.dateFormat, formatDate);
-					}
-				}
-				this.input_date.datepicker('option','maxDate',_value);
-			}
-		}
-		this.options.max = _value;
-	}
-
-	/**
-	 * Setting date
-	 *
-	 * @param {string|number|Date} _value supported are the following formats:
-	 * - Date object with usertime as UTC value
-	 * - string like Date.toJSON()
-	 * - string or number with timestamp in usertime like server-side uses it
-	 * - string starting with + or - to add/substract given number of seconds from current value, "+600" to add 10 minutes
-	 */
-	set_value(_value)
-	{
-		var old_value = this._oldValue;
-		if(_value === null || _value === "" || _value === undefined ||
-			// allow 0 as empty-value for date and date-time widgets, as that is used a lot eg. in InfoLog
-			_value == 0 && (this.getType() == 'date-time' || this.getType() == 'date'))
-		{
-			if(this.input_date)
-			{
-				this.input_date.val("");
-			}
-			if(this._oldValue !== et2_no_init && old_value !== _value)
-			{
-				this.change(this.input_date);
-			}
-			this._oldValue = _value;
-			return;
-		}
-
-		// timestamp in usertime, convert to 'Y-m-d\\TH:i:s\\Z', as we do on server-side with equivalent of PHP date()
-		if (typeof _value == 'number' || typeof _value == 'string' && !isNaN(<number><unknown>_value) && _value[0] != '+' && _value[0] != '-')
-		{
-			_value = date('Y-m-d\\TH:i:s\\Z', _value);
-		}
-		// Check for full timestamp
-		if(typeof _value == 'string' && _value.match(/^(\d{4})-(\d{2})-(\d{2})T(\d{2})\:(\d{2})\:(\d{2})(?:\.\d{3})?(?:Z|[+-](\d{2})\:(\d{2})|)$/))
-		{
-			_value = new Date(_value);
-		}
-		// Handle just time as a string in the form H:i
-		if(typeof _value == 'string' && isNaN(<number><unknown>_value))
-		{
-			try {
-				// silently fix skiped minutes or times with just one digit, as parser is quite pedantic ;-)
-				var fix_reg = new RegExp((this.getType() == "date-timeonly"?'^':' ')+'([0-9]+)(:[0-9]*)?( ?(a|p)m?)?$','i');
-				var matches = _value.match(fix_reg);
-				if (matches && (matches[1].length < 2 || matches[2] === undefined || matches[2].length < 3 ||
-					matches[3] && matches[3] != 'am' && matches[3] != 'pm'))
-				{
-					if (matches[1].length < 2 && !matches[3]) matches[1] = '0'+matches[1];
-					if (matches[2] === undefined) matches[2] = ':00';
-					while (matches[2].length < 3) matches[2] = ':0'+matches[2].substr(1);
-					_value = _value.replace(fix_reg, (this.getType() == "date-timeonly"?'':' ')+matches[1]+matches[2]+matches[3]);
-					if (matches[4] !== undefined) matches[3] = matches[4].toLowerCase() == 'a' ? 'am' : 'pm';
-				}
-				switch(this.getType())
-				{
-					case "date-timeonly":
-						// @ts-ignore
-						var parsed = jQuery.datepicker.parseTime(this.timeFormat, _value);
-						if (!parsed)	// parseTime returns false
-						{
-							this.set_validation_error(this.egw().lang("'%1' has an invalid format !!!",_value));
-							return;
-						}
-						this.set_validation_error(false);
-						// this.date is on current date, changing it in get_value() to 1970-01-01, gives a time-difference, if we are currently on DST
-						this.date.setDate(1);
-						this.date.setMonth(0);
-						this.date.setFullYear(1970);
-						// Avoid javascript timezone offset, hour is in 'user time'
-						this.date.setUTCHours(parsed.hour);
-						this.date.setMinutes(parsed.minute);
-						if(this.input_date.val() != _value)
-						{
-							this.input_date.val(_value);
-							// @ts-ignore
-							this.input_date.timepicker('setTime',_value);
-							if (this._oldValue !== et2_no_init)
-							{
-								this.change(this.input_date);
-							}
-						}
-						this._oldValue = this.date.toJSON();
-						return;
-					default:
-						// Parse customfields's date with storage data_format to date object
-						// Or generally any date widgets with fixed date/time format
-						if (this.id.match(/^#/g) && this.options.value == _value || (this.options.data_format && this.options.value == _value))
-						{
-							switch (this.getType())
-							{
-								case 'date':
-									var parsed = jQuery.datepicker.parseDate(this.egw().dateTimeFormat(this.options.data_format), _value);
-									break;
-								case 'date-time':
-									var DTformat = this.options.data_format.split(' ');
-									// @ts-ignore
-									var parsed = jQuery.datepicker.parseDateTime(this.egw().dateTimeFormat(DTformat[0]),this.egw().dateTimeFormat(DTformat[1]), _value);
-							}
-						}
-						else  // Parse other date widgets date with timepicker date/time format to date onject
-						{
-							// @ts-ignore
-							var parsed = jQuery.datepicker.parseDateTime(this.dateFormat,
-									this.timeFormat, _value.replace('T', ' '));
-							if(!parsed)
-							{
-								this.set_validation_error(this.egw().lang("%1' han an invalid format !!!",_value));
-								return;
-							}
-						}
-						// Update local variable, but remove the timezone offset that
-						// javascript adds when we parse
-						if(parsed)
-						{
-							this.date = new Date(parsed.valueOf() - parsed.getTimezoneOffset() * 60000);
-						}
-
-						this.set_validation_error(false);
-				}
-			}
-			// catch exception from unparsable date and display it empty instead
-			catch(e) {
-				return this.set_value(null);
-			}
-		} else if (typeof _value == 'object' && _value.date) {
-			this.date = _value.date;
-		} else if (typeof _value == 'object' && _value.valueOf) {
-			this.date = _value;
-		} else
-		// string starting with + or - --> add/substract number of seconds from current value
-		{
-			this.date.setTime(this.date.getTime()+1000*parseInt(_value));
-		}
-
-		// Update input - popups do, but framework doesn't
-		_value = '';
-		// Add timezone offset back in, or formatDate will lose those hours
-		var formatDate = new Date(this.date.valueOf() + this.date.getTimezoneOffset() * 60 * 1000);
-		if(this.getType() != 'date-timeonly')
-		{
-			_value = jQuery.datepicker.formatDate(this.dateFormat, formatDate);
-		}
-		if(this.getType() != 'date')
-		{
-			if(this.getType() != 'date-timeonly') _value += this.is_mobile ? 'T' : ' ';
-
-			// @ts-ignore TypeScript can't find formatTime(), but it's there
-			_value += jQuery.datepicker.formatTime(this.timeFormat, {
-				hour: formatDate.getHours(),
-				minute: formatDate.getMinutes(),
-				seconds: 0,
-				timezone: 0
-			});
-		}
-		if(this.options.inline )
-		{
-			this.input_date.datepicker("setDate",formatDate);
-		}
-		else
-		{
-			this.input_date.val(_value);
-		}
-		if(this._oldValue !== et2_no_init && old_value != this.getValue())
-		{
-			this.change(this.input_date);
-		}
-		this._oldValue = _value;
-	}
-
-	getValue()
-	{
-		if(this.input_date.val() == "")
-		{
-			// User blanked the box
-			return null;
-		}
-		// date-timeonly returns just the seconds, without any date!
-		if (this.getType() == 'date-timeonly')
-		{
-			this.date.setUTCDate(1);
-			this.date.setUTCMonth(0);
-			this.date.setUTCFullYear(1970);
-		}
-		else if (this.getType() == 'date')
-		{
-			this.date.setUTCHours(0);
-			this.date.setUTCMinutes(0);
-		}
-
-		// Convert to timestamp - no seconds
-		this.date.setSeconds(0,0);
-		return (this.date && typeof this.date.toJSON != 'undefined' && this.date.toJSON())?this.date.toJSON().replace(/\.\d{3}Z$/, 'Z'):this.date;
-	}
-}
-et2_register_widget(et2_date, ["date", "date-time", "date-timeonly"]);
+export class et2_date extends Et2Date {}
 
 /**
- * Class which implements the "date-duration" XET-Tag
+ * @deprecated use Et2Date
  */
-export class et2_date_duration extends et2_date
-{
-	static readonly _attributes: any = {
-		"data_format": {
-			"name": "Data format",
-			"default": "m",
-			"type": "string",
-			"description": "Units to read/store the data.  'd' = days (float), 'h' = hours (float), 'm' = minutes (int), 's' = seconds (int)."
-		},
-		"display_format": {
-			"name": "Display format",
-			"default": "dhm",
-			"type": "string",
-			"description": "Permitted units for displaying the data.  'd' = days, 'h' = hours, 'm' = minutes, 's' = seconds.  Use combinations to give a choice.  Default is 'dh' = days or hours with selectbox."
-		},
-		"select_unit": {
-			"name": "Select unit or input per unit",
-			"default": true,
-			"type": "boolean",
-			"description": "Display a unit-selection for multiple units, or an input field per unit."
-		},
-		"percent_allowed": {
-			"name": "Percent allowed",
-			"default": false,
-			"type": "boolean",
-			"description": "Allows to enter a percentage."
-		},
-		"hours_per_day": {
-			"name": "Hours per day",
-			"default": 8,
-			"type": "integer",
-			"description": "Number of hours in a day, for converting between hours and (working) days."
-		},
-		"empty_not_0": {
-			"name": "0 or empty",
-			"default": false,
-			"type": "boolean",
-			"description": "Should the widget differ between 0 and empty, which get then returned as NULL"
-		},
-		"short_labels": {
-			"name": "Short labels",
-			"default": false,
-			"type": "boolean",
-			"description": "use d/h/m instead of day/hour/minute"
-		},
-		"step" : {
-			"name": "Step limit",
-			"default": 'any',
-			"type": "string",
-			"description": "Works with the min and max attributes to limit the increments at which a numeric or date-time value can be set."
-		}
-	};
-
-	public static readonly legacyOptions: string[] = ["data_format","display_format", "hours_per_day", "empty_not_0", "short_labels"];
-
-	time_formats: {d:"d", h:"h", m:"m", s:"s"};
-
-	// @ts-ignore baseWidget defines node as HTMLElement
-	node: JQuery;
-	duration: JQuery;
-	format: JQuery = null;
-
-	/**
-	 * Constructor
-	 */
-	constructor(_parent, _attrs? : WidgetConfig, _child? : object)
-	{
-		// Call the inherited constructor
-		super(_parent, _attrs, ClassWithAttributes.extendAttributes(et2_date_duration._attributes, _child || {}));
-
-		// Legacy option put percent in with display format
-		if(this.options.display_format.indexOf("%") != -1)
-		{
-			this.options.percent_allowed = true;
-			this.options.display_format = this.options.display_format.replace("%","");
-		}
-
-		// Clean formats
-		this.options.display_format = this.options.display_format.replace(/[^dhms]/g,'');
-		if(!this.options.display_format)
-		{
-			// @ts-ignore
-			this.options.display_format = this.attributes.display_format["default"];
-		}
-
-		// Get translations
-		this.time_formats = {
-			d: this.options.short_labels ? this.egw().lang("d") : this.egw().lang("Days"),
-			h: this.options.short_labels ? this.egw().lang("h") : this.egw().lang("Hours"),
-			m: this.options.short_labels ? this.egw().lang("m") : this.egw().lang("Minutes"),
-			s: this.options.short_labels ? this.egw().lang("s") : this.egw().lang("Seconds")
-		},
-		this.createInputWidget();
-	}
-
-	createInputWidget()
-	{
-		// Create nodes
-		this.node = jQuery(document.createElement("span"))
-						.addClass('et2_date_duration');
-		let inputs = [];
-		for (let i=this.options.select_unit?1:this.options.display_format.length; i > 0; --i)
-		{
-			let input = document.createElement("input");
-			inputs.push(input);
-			if (!this.options.select_unit)
-			{
-				let attr :any = {min : 0};
-				switch(this.options.display_format[this.options.display_format.length-i])
-				{
-					case 's':
-						attr.max = 60;
-						attr.title = this.egw().lang('Seconds');
-						break;
-					case 'm':
-						attr.max = 60;
-						attr.title = this.egw().lang('Minutes');
-						break;
-					case 'h':
-						attr.max = 24;
-						attr.title = this.egw().lang('Hours');
-						break;
-					case 'd':
-						attr.title = this.egw().lang('Days');
-						break;
-				}
-				jQuery(input).attr(attr);
-			}
-		}
-		this.duration = jQuery(inputs)
-						.addClass('et2_date_duration')
-						.attr({
-							type: 'number',
-							size: 3,
-							step:this.options.step,
-							lang: this.egw().preference('number_format')[0] === "," ? "en-150": "en-001"
-						});
-		this.node.append(this.duration);
-
-		var self = this;
-		// seems the 'invalid' event doesn't work in all browsers, eg. FF therefore
-		// we use focusout event to check the valifdity of input right after user
-		// enters the value.
-		this.duration.on('focusout', function() {
-			if(!(<HTMLInputElement>self.duration[0]).checkValidity())
-				return self.duration.change();
-		});
-	}
-
-	/**
-	 * Clientside validation
-	 *
-	 * @param {array} _messages
-	 */
-	isValid(_messages)
-	{
-		var ok = true;
-		// if we have a html5 validation error, show it, as this.input.val() will be empty!
-		for(let i=0; this.duration && i < this.duration.length; ++i)
-		{
-			if (this.duration[i] &&
-				(<HTMLInputElement>this.duration[i]).validationMessage &&
-				!(<HTMLInputElement>this.duration[i]).validity.stepMismatch)
-			{
-				_messages.push((<HTMLInputElement>this.duration[i]).validationMessage);
-				ok = false;
-			}
-		}
-		return super.isValid(_messages) && ok;
-	}
-
-	attachToDOM()
-	{
-		if (this.duration)
-		{
-			for(let i=0; i < this.duration.length; ++i)
-			{
-				let node = this.duration[i];
-				jQuery(node).bind("change.et2_inputWidget", this, function(e) {
-					e.data.change(this);
-				});
-			}
-		}
-		return et2_DOMWidget.prototype.attachToDOM.apply(this, arguments);
-	}
-
-	getDOMNode()
-	{
-		return this.node[0];
-	}
-
-	getInputNode()
-	{
-		return this.duration[0];
-	}
-
-	/**
-	 * Use id on node, same as DOMWidget
-	 *
-	 * @param {string} _value id to set
-	 */
-	set_id(_value)
-	{
-		this.id = _value;
-
-		var node = this.getDOMNode();
-		if (node)
-		{
-			if (_value != "")
-			{
-				node.setAttribute("id", this.getInstanceManager().uniqueId+'_'+this.id);
-			}
-			else
-			{
-				node.removeAttribute("id");
-			}
-		}
-	}
-
-	private _unit2seconds(_unit)
-	{
-		switch(_unit)
-		{
-			case 's':
-				return 1;
-			case 'm':
-				return 60;
-			case 'h':
-				return 3600;
-			case 'd':
-				return 3600 * this.options.hours_per_day;
-		}
-	}
-
-	private _unit_from_value(_value, _unit, _highest)
-	{
-		_value *= this._unit2seconds(this.data_format);
-		// get value for given _unit
-		switch(_unit)
-		{
-			case 's':
-				return _highest ? _value : _value % 60;
-			case 'm':
-				_value = Math.floor(_value / 60);
-				return _highest ? _value : _value % 60;
-			case 'h':
-				_value = Math.floor(_value / 3600);
-				return _highest ? _value : _value % this.options.hours_per_day;
-			case 'd':
-				return Math.floor(_value / 3600 / this.options.hours_per_day);
-		}
-	}
-
-	set_value(_value)
-	{
-		this.options.value = _value;
-
-		if (!this.options.select_unit && this.options.display_format.length > 1)
-		{
-			for (let i = this.options.display_format.length; --i >= 0;)
-			{
-				jQuery(this.duration[i]).val(this._unit_from_value(_value, this.options.display_format[i], !i));
-			}
-			return;
-		}
-
-		var display = this._convert_to_display(parseFloat(_value));
-
-		// Set display
-		if(this.duration[0].nodeName == "INPUT")
-		{
-			this.duration.val(display.value);
-		}
-		else
-		{
-			this.duration.text(display.value + " ");
-		}
-
-		// Set unit as figured for display
-		if(display.unit && display.unit != this.options.display_format)
-		{
-			if(this.format && this.format.children().length > 1) {
-				jQuery("option[value='"+display.unit+"']",this.format).attr('selected','selected');
-			}
-			else
-			{
-				this.format.text(display.unit ? this.time_formats[display.unit] : '');
-			}
-		}
-	}
-
-	set_display_format(format)
-    {
-        if (format.length < 1)
-        {
-            this.node.remove('select.et2_date_duration');
-            this.format.remove();
-            this.format = null;
-        }
-        this.options.display_format = format;
-        if((this.format == null || this.format.is('select')) &&
-			(this.options.display_format.length <= 1 || this.options.readonly || !this.options.select_unit))
-        {
-			if (this.format)
-			{
-				this.format.remove();
-			}
-        	this.format = jQuery(document.createElement('span')).appendTo(this.node);
-		}
-        if (!this.options.select_unit && this.options.display_format.length > 1)
-		{
-			// no unit selection or display
-			this.format.hide();
-		}
-        else if(this.options.display_format.length > 1 && !this.options.readonly)
-		{
-			if(this.format && !this.format.is('select')) {
-				this.format.remove();
-				this.format = null;
-			}
-			if(!this.format)
-			{
-				this.format = jQuery(document.createElement("select"))
-							.addClass('et2_date_duration');
-				this.node.append(this.format);
-			}
-
-			this.format.empty();
-			for(var i = 0; i < this.options.display_format.length; i++) {
-				this.format.append("<option value='"+this.options.display_format[i]+"'>"+this.time_formats[this.options.display_format[i]]+"</option>");
-			}
-		}
-		else if (this.time_formats[this.options.display_format])
-		{
-			this.format.text(this.time_formats[this.options.display_format]);
-		}
-		else
-		{
-			this.format.text(this.time_formats["m"]);
-		}
-    }
-
-	/**
-	 * Converts the value in data format into value in display format.
-	 *
-	 * @param _value int/float Data in data format
-	 *
-	 * @return Object {value: Value in display format, unit: unit for display}
-	 */
-	_convert_to_display(_value)
-	{
-		if (!this.options.select_unit)
-		{
-			let vals = [];
-			for (let i=0; i < this.options.display_format.length; ++i)
-			{
-				let unit = this.options.display_format[i];
-				let val = this._unit_from_value(_value, unit, i === 0);
-				if (unit === 's' || unit === 'm' || unit === 'h' && this.options.display_format[0] === 'd' )
-				{
-					vals.push(sprintf('%02d', val));
-				}
-				else
-				{
-					vals.push(val);
-				}
-			}
-			return {value: vals.join(':'), unit: ''};
-		}
-		if (_value)
-		{
-			// Put value into minutes for further processing
-			switch(this.options.data_format)
-			{
-				case 'd':
-					_value *= this.options.hours_per_day;
-					// fall-through
-				case 'h':
-					_value *= 60;
-					break;
-				case 's':
-					_value /= 60.0;
-					break;
-			}
-		}
-
-		// Figure out best unit for display
-		var _unit = this.options.display_format == "d" ? "d" : "h";
-		if (this.options.display_format.indexOf('m') > -1 && _value && _value < 60)
-		{
-			_unit = 'm';
-		}
-		else if (this.options.display_format.indexOf('d') > -1 && _value >= 60*this.options.hours_per_day)
-		{
-			_unit = 'd';
-		}
-		_value = this.options.empty_not_0 && _value === '' || !this.options.empty_not_0 && !_value ? '' :
-			(_unit == 'm' ? parseInt( _value) : (Math.round((_value / 60.0 / (_unit == 'd' ? this.options.hours_per_day : 1))*100)/100));
-
-		if(_value === '') _unit = '';
-
-		// use decimal separator from user prefs
-		var format = this.egw().preference('number_format');
-		var sep = format ? format[0] : '.';
-		if (typeof _value == 'string' && format && sep && sep != '.')
-		{
-			_value = _value.replace('.',sep);
-		}
-
-		return {value: _value, unit:_unit};
-	}
-
-	/**
-	 * Change displayed value into storage value and return
-	 */
-	getValue()
-	{
-		if (!this.options.select_unit && this.options.display_format.length > 1)
-		{
-			let value = 0;
-			for(let i=this.options.display_format.length; --i >= 0; )
-			{
-				value += parseInt(<string>jQuery(this.duration[i]).val()) * this._unit2seconds(this.options.display_format[i]);
-			}
-			if (this.options.data_format !== 's')
-			{
-				value /= this._unit2seconds(this.options.data_format);
-			}
-			return this.options.data_format === 'm' ? Math.round(value) : value;
-		}
-		var value = this.duration.val().replace(',', '.');
-		if(value === '')
-		{
-			return this.options.empty_not_0 ? '' : 0;
-		}
-		// Put value into minutes for further processing
-		switch(this.format && this.format.val() ? this.format.val() : this.options.display_format)
-		{
-			case 'd':
-				value *= this.options.hours_per_day;
-				// fall-through
-			case 'h':
-				value *= 60;
-				break;
-		}
-		// Minutes should be an integer.  Floating point math.
-		if (this.options.data_format !== 's')
-		{
-			value = Math.round(value);
-		}
-		switch(this.options.data_format)
-		{
-			case 'd':
-				value /= this.options.hours_per_day;
-				// fall-through
-			case 'h':
-				value /= 60.0;
-				break;
-			case 's':
-				value = Math.round(value * 60.0);
-				break;
-		}
-		return value;
-	}
-}
-et2_register_widget(et2_date_duration, ["date-duration"]);
+export class et2_date_duration extends Et2DateDuration {}
 
 /**
- * r/o date-duration
+ * @deprecated use Et2Date
  */
-export class et2_date_duration_ro extends et2_date_duration implements et2_IDetachedDOM
-{
-	createInputWidget()
-	{
-		this.node = jQuery(document.createElement("span"));
-		this.duration = jQuery(document.createElement("span")).appendTo(this.node);
-		this.format = jQuery(document.createElement("span")).appendTo(this.node);
-	}
-
-	/**
-	 * Code for implementing et2_IDetachedDOM
-	 * Fast-clonable read-only widget that only deals with DOM nodes, not the widget tree
-	 */
-
-	/**
-	 * Build a list of attributes which can be set when working in the
-	 * "detached" mode in the _attrs array which is provided
-	 * by the calling code.
-	 *
-	 * @param {array} _attrs array to add further attributes to
-	 */
-	getDetachedAttributes(_attrs)
-	{
-		_attrs.push("value");
-	}
-
-	/**
-	 * Returns an array of DOM nodes. The (relativly) same DOM-Nodes have to be
-	 * passed to the "setDetachedAttributes" function in the same order.
-	 *
-	 * @return {array}
-	 */
-	getDetachedNodes()
-	{
-		return [this.duration[0], this.format[0]];
-	}
-
-	/**
-	 * Sets the given associative attribute->value array and applies the
-	 * attributes to the given DOM-Node.
-	 *
-	 * @param _nodes is an array of nodes which has to be in the same order as
-	 *      the nodes returned by "getDetachedNodes"
-	 * @param _values is an associative array which contains a subset of attributes
-	 *      returned by the "getDetachedAttributes" function and sets them to the
-	 *      given values.
-	 */
-	setDetachedAttributes(_nodes, _values)
-	{
-		for(var i = 0; i < _nodes.length; i++) {
-			// Clear the node
-			for (var j = _nodes[i].childNodes.length - 1; j >= 0; j--)
-			{
-				_nodes[i].removeChild(_nodes[i].childNodes[j]);
-			}
-		}
-		if(typeof _values.value !== 'undefined')
-		{
-			_values.value = parseFloat(_values.value);
-		}
-		if(_values.value)
-		{
-			var display = this._convert_to_display(_values.value);
-			_nodes[0].appendChild(document.createTextNode(display.value));
-			_nodes[1].appendChild(document.createTextNode(display.unit));
-		}
-	}
-
-}
-et2_register_widget(et2_date_duration_ro, ["date-duration_ro"]);
+export class et2_date_duration_ro extends Et2DateDurationReadonly {}
 
 /**
- * et2_date_ro is the readonly implementation of some date widget.
+ * @deprecated use Et2Date
  */
-export class et2_date_ro extends et2_valueWidget implements et2_IDetachedDOM
-{
-	/**
-	 * Ignore all more advanced attributes.
-	 */
-	static readonly _attributes: any = {
-		"value": {
-			"type": "string"
-		},
-		"type": {
-			"ignore": false
-		},
-		"data_format": {
-			"ignore": true,
-			"description": "Format data is in.  This is not used client-side because it's always a timestamp client side."
-		},
-		units: {
-			"type": "string",
-			"descriptions": "Used units for date-since, default 'YmdHis', e.g. 'd' to display a value in days"
-		},
-		min: {ignore: true},
-		max: {ignore: true},
-		year_range: {ignore: true}
-	};
-
-	public static readonly legacyOptions: ["data_format"];
-
-	/**
-	 * Internal container for working easily with dates
-	 */
-	date: Date = new Date();
-	value: string = "";
-	span: JQuery;
-
-	/**
-	 * Constructor
-	 */
-	constructor(_parent, _attrs? : WidgetConfig, _child? : object)
-	{
-		// Call the inherited constructor
-		super(_parent, _attrs, ClassWithAttributes.extendAttributes(et2_date_ro._attributes, _child || {}));
-
-		this._labelContainer = jQuery(document.createElement("label"))
-			.addClass("et2_label");
-
-		this.span = jQuery(document.createElement(this.getType() == "date-since" || this.getType() == "date-time_today" ? "span" : "time"))
-			.addClass("et2_date_ro et2_label")
-			.appendTo(this._labelContainer);
-
-		this.setDOMNode(this._labelContainer[0]);
-	}
-
-	set_value(_value)
-	{
-		if(typeof _value == 'undefined') _value = 0;
-
-		this.value = _value;
-
-		if(_value == 0 || _value == null)
-		{
-			this.span.attr("datetime", "").text("");
-			return;
-		}
-
-		if(typeof _value == 'string' && _value.match(/(\d{4})-(\d{2})-(\d{2})T(\d{2})\:(\d{2})\:(\d{2})(?:\.\d{3})?(?:Z|[+-](\d{2})\:(\d{2}))/))
-		{
-			this.date = new Date(_value);
-			this.date = new Date(this.date.valueOf() + (this.date.getTimezoneOffset()*60*1000));
-		}
-		else if(typeof _value == 'string' && (isNaN(<number><unknown>_value) ||
-			this.options.data_format && this.options.data_format.substr(0,3) === 'Ymd'))
-		{
-			try {
-				// data_format is not handled server-side for custom-fields in nextmatch
-				// as parseDateTime requires a separate between date and time, we fix the value here
-				switch (this.options.data_format)
-				{
-					case 'Ymd':
-					case 'YmdHi':
-					case 'YmdHis':
-						_value = _value.substr(0, 4)+'-'+_value.substr(4, 2)+'-'+_value.substr(6, 2)+' '+
-							(_value.substr(8, 2) || '00')+':'+(_value.substr(10, 2) || '00')+':'+(_value.substr(12, 2) || '00');
-						break;
-				}
-				// parseDateTime to handle string PHP: DateTime local date/time format
-				// @ts-ignore
-				var parsed = (typeof jQuery.datepicker.parseDateTime("yy-mm-dd","hh:mm:ss", _value) !='undefined')?
-					// @ts-ignore
-					jQuery.datepicker.parseDateTime("yy-mm-dd","hh:mm:ss", _value):
-					// @ts-ignore
-					jQuery.datepicker.parseDateTime(this.egw().preference('dateformat'),this.egw().preference('timeformat') == '24' ? 'H:i' : 'g:i a', _value);
-			}
-			// display unparsable dates as empty
-			catch(e) {
-				this.span.attr("datetime", "").text("");
-				return;
-			}
-			var text = new Date(parsed);
-
-			// Update local variable, but remove the timezone offset that javascript adds
-			if(parsed)
-			{
-				this.date = new Date(text.valueOf() - (text.getTimezoneOffset()*60*1000));
-			}
-
-			// JS dates use milliseconds
-			this.date.setTime(text.valueOf());
-		}
-		else
-		{
-			// _value is timestamp in usertime, ready to be used with date() function identical to PHP date()
-			this.date = _value;
-		}
-		var display = this.date.toString();
-
-		switch(this.getType()) {
-			case "time_or_date":
-			case "date-time_today":
-				// Today - just the time
-				if(date('Y-m-d', this.date) == date('Y-m-d'))
-				{
-					display = date(this.egw().preference('timeformat') == '24' ? 'H:i' : 'g:i a', this.date);
-				}
-				else if (this.getType() === "time_or_date")
-				{
-					display = date(this.egw().preference('dateformat'), this.date);
-				}
-				// Before today - date and time
-				else
-				{
-					display = date(this.egw().preference('dateformat') + " " +
-						(this.egw().preference('timeformat') == '24' ? 'H:i' : 'g:i a'), this.date);
-				}
-				break;
-			case "date":
-				display = date(this.egw().preference('dateformat'), this.date);
-				break;
-			case "date-timeonly":
-				display = date(this.egw().preference('timeformat') == '24' ? 'H:i' : 'g:i a', this.date);
-				break;
-			case "date-time":
-				display = date(this.egw().preference('dateformat') + " " +
-					(this.egw().preference('timeformat') == '24' ? 'H:i' : 'g:i a'), this.date);
-				break;
-			case "date-since":
-				var unit2label = {
-					'Y': 'years',
-					'm': 'month',
-					'd': 'days',
-					'H': 'hours',
-					'i': 'minutes',
-					's': 'seconds'
-				};
-				var unit2s : Object = {
-					'Y': 31536000,
-					'm': 2628000,
-					'd': 86400,
-					'H': 3600,
-					'i': 60,
-					's': 1
-				};
-				var d = new Date();
-				var diff = Math.round(d.valueOf() / 1000) - Math.round(this.date.valueOf()/1000);
-				display = '';
-
-				// limit units used to display
-				let smallest = 's';
-				if (this.options.units)
-				{
-					const valid = Object.entries(unit2s).filter((e) => (<string>this.options.units).includes(e[0]));
-					unit2s = Object.fromEntries(valid);
-					smallest = (valid.pop() || [])[0];
-				}
-
-				for(var unit in unit2s)
-				{
-					var unit_s = unit2s[unit];
-					if (diff >= unit_s || unit === smallest)
-					{
-						display = Math.round(diff/unit_s)+' '+this.egw().lang(unit2label[unit]);
-						break;
-					}
-				}
-				break;
-		}
-		this.span.attr("datetime", date("Y-m-d H:i:s",this.date)).text(display);
-	}
-
-	set_label(label)
-	{
-		// Remove current label
-		this._labelContainer.contents()
-			.filter(function(){ return this.nodeType == 3; }).remove();
-
-		var parts = et2_csvSplit(label, 2, "%s");
-		this._labelContainer.prepend(parts[0]);
-		this._labelContainer.append(parts[1]);
-		this.label = label;
-
-		// add class if label is empty
-		this._labelContainer.toggleClass('et2_label_empty', !label || !parts[0]);
-	}
-
-	/**
-	 * Creates a list of attributes which can be set when working in the
-	 * "detached" mode. The result is stored in the _attrs array which is provided
-	 * by the calling code.
-	 *
-	 * @param {array} _attrs array to add further attributes to
-	 */
-	getDetachedAttributes(_attrs)
-	{
-		_attrs.push("label", "value","class");
-	}
-
-	/**
-	 * Returns an array of DOM nodes. The (relatively) same DOM-Nodes have to be
-	 * passed to the "setDetachedAttributes" function in the same order.
-	 *
-	 * @return {array}
-	 */
-	getDetachedNodes()
-	{
-		return [this._labelContainer[0], this.span[0]];
-	}
-
-	/**
-	 * Sets the given associative attribute->value array and applies the
-	 * attributes to the given DOM-Node.
-	 *
-	 * @param _nodes is an array of nodes which have to be in the same order as
-	 *      the nodes returned by "getDetachedNodes"
-	 * @param _values is an associative array which contains a subset of attributes
-	 *      returned by the "getDetachedAttributes" function and sets them to the
-	 *      given values.
-	 */
-	setDetachedAttributes(_nodes, _values)
-	{
-		this._labelContainer = jQuery(_nodes[0]);
-		this.span = jQuery(_nodes[1]);
-
-		this.set_value(_values["value"]);
-		if(_values["label"])
-		{
-			this.set_label(_values["label"]);
-		}
-		if(_values["class"])
-		{
-			this.span.addClass(_values["class"]);
-		}
-	}
-}
-et2_register_widget(et2_date_ro, ["date_ro", "date-time_ro", "date-since", "date-time_today", "time_or_date", "date-timeonly_ro"]);
-
+export class et2_date_ro extends Et2DateReadonly {}
 
 /**
  * Widget for selecting a date range
+ *
+ * @todo port to web-component
  */
 export class et2_date_range extends et2_inputWidget
 {
@@ -1506,9 +61,9 @@ export class et2_date_range extends et2_inputWidget
 	};
 
 	div: JQuery;
-	from: et2_date;
-	to: et2_date;
-	select: et2_selectbox;
+	from: Et2Date;
+	to: Et2Date;
+	select: Et2Select;
 
 	/**
 	 * Constructor
@@ -1538,28 +93,28 @@ export class et2_date_range extends et2_inputWidget
 	{
 		var widget = this;
 
-		this.from = <et2_date>et2_createWidget('date',{
+		this.from = <Et2Date><any>loadWebComponent('et2-date', {
 			id: this.id+'[from]',
 			blur: egw.lang('From'),
 			onchange(_node,_widget) {
 				widget.to.set_min(widget.from.getValue());
-				if (_node instanceof jQuery) widget.onchange.call(widget, _widget, widget);
+				if (_node instanceof Event) widget.onchange.call(widget, _widget, widget);
 			}
-		},this);
-		this.to = <et2_date>et2_createWidget('date',{
+		}, this);
+		this.to = <Et2Date><any>loadWebComponent('et2-date',{
 			id: this.id+'[to]',
 			blur: egw.lang('To'),
 			onchange(_node,_widget) {
 				widget.from.set_max(widget.to.getValue());
-				if (_node instanceof jQuery) widget.onchange.call(widget, _widget,widget);
+				if (_node instanceof Event) widget.onchange.call(widget, _widget,widget);
 			}
-		},this);
-		this.select = <et2_selectbox><unknown>et2_createWidget('select',{
+		}, this);
+		this.select = <Et2Select><any>loadWebComponent('et2-select',{
 			id: this.id+'[relative]',
 			select_options: et2_date_range.relative_dates,
 			empty_label: this.options.blur || 'All'
 		},this);
-		this.select.loadingFinished();
+		//this.select.loadingFinished();
 	}
 
 	/**
diff --git a/api/js/etemplate/et2_widget_split.ts b/api/js/etemplate/et2_widget_split.ts
deleted file mode 100644
index 642236e6f5..0000000000
--- a/api/js/etemplate/et2_widget_split.ts
+++ /dev/null
@@ -1,463 +0,0 @@
-/**
-* EGroupware eTemplate2 - Split panel
-*
-* @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
-* @package etemplate
-* @subpackage api
-* @link https://www.egroupware.org
-* @author Nathan Gray
-* @copyright Nathan Gray 2013
-*/
-
-/*egw:uses
-/vendor/bower-asset/jquery/dist/jquery.js;
-jquery.splitter;
-    et2_core_baseWidget;
-*/
-
-import {et2_DOMWidget} from "./et2_core_DOMWidget";
-import {et2_register_widget, WidgetConfig} from "./et2_core_widget";
-import {ClassWithAttributes} from "./et2_core_inheritance";
-import {et2_IPrint, et2_IResizeable} from "./et2_core_interfaces";
-import {et2_no_init} from "./et2_core_common";
-import {et2_dynheight} from "./et2_widget_dynheight";
-import "../jquery/splitter.js";
-
-/**
-* A container widget that accepts 2 children, and puts a resize bar between them.
-*
-* This is the etemplate2 implementation of the traditional split pane / split panel.
-* The split can be horizontal or vertical, and can be limited in size.  You can also
-* turn on double-click docking to minimize one of the children.
-*
-* @see http://methvin.com/splitter/ Uses Splitter
-* @augments et2_DOMWidget
-*/
-export class et2_split extends et2_DOMWidget implements et2_IResizeable, et2_IPrint
-{
-	static readonly _attributes : any = {
-		"orientation": {
-			"name": "Orientation",
-			"description": "Horizontal or vertical (v or h)",
-			"default": "v",
-			"type": "string"
-		},
-		"outline": {
-			"name":	"Outline",
-			"description": "Use a 'ghosted' copy of the splitbar and does not resize the panes until the mouse button is released.  Reduces flickering or unwanted re-layout during resize",
-			"default": false,
-			"type": "boolean"
-		},
-		"dock_side": {
-			"name": "Dock",
-			"description": "Allow the user to 'Dock' the splitbar to one side of the splitter, essentially hiding one pane and using the entire splitter area for the other pane.  One of leftDock, rightDock, topDock, bottomDock.",
-			"default": et2_no_init,
-			"type": "string"
-		},
-		"width": {
-			"default": "100%"
-		},
-		// Not needed
-		"overflow": {"ignore": true},
-		"no_lang": {"ignore": true},
-		"rows": {"ignore": true},
-		"cols": {"ignore": true}
-	};
-
-	public static readonly DOCK_TOLERANCE : number = 15;
-
-	div : JQuery = null;
-	dynheight : et2_dynheight = null;
-	left : JQuery;
-	right : JQuery;
-	loading : JQueryDeferred<void>;
-	stop_resize : boolean;
-	orientation : "v" | "h";
-	dock_side : "leftDock" | "rightDock" | "topDock" | "bottomDock";
-	prefSize : number;
-	outline : boolean;
-
-	constructor(_parent, _attrs? : WidgetConfig, _child? : object)
-	{
-		// Call the inherited constructor
-		super(_parent, _attrs, ClassWithAttributes.extendAttributes(et2_split._attributes, _child || {}));
-
-		this.div = jQuery(document.createElement("div"))
-			.addClass('et2_split');
-
-		// Create the dynheight component which dynamically scales the inner
-		// container.
-		this.dynheight = new et2_dynheight(
-			(<et2_DOMWidget><unknown>this.getParent()).getDOMNode() || this.getInstanceManager().DOMContainer,
-			this.div, 100
-		);
-
-		// Add something so we can see it - will be replaced if there's children
-		this.left = jQuery("<div>Top / Left</div>").appendTo(this.div);
-		this.right = jQuery("<div>Bottom / Right</div>").appendTo(this.div);
-
-		// Flag to temporarily ignore resizing
-		this.stop_resize = false;
-	}
-
-	destroy()
-	{
-		// Stop listening
-		this.left.next().off("mouseup");
-
-		// Destroy splitter, restore children
-		this.div.trigger("destroy");
-
-		// Destroy dynamic full-height
-		this.dynheight.destroy();
-
-		super.destroy();
-
-		// Remove placeholder children
-		if(this._children.length == 0)
-		{
-			this.div.empty();
-		}
-		this.div.remove();
-	}
-
-	/**
-	 * Tap in here to check if we have real children, because all children should be created
-	 * by this point.  If there are, replace the placeholders.
-	 */
-	loadFromXML(_node)
-	{
-		super.loadFromXML(_node);
-		if(this._children.length > 0)
-		{
-			if(this._children[0])
-			{
-				this.left.detach();
-				this.left = jQuery(this._children[0].getDOMNode(this._children[0]))
-					.appendTo(this.div);
-			}
-			if(this._children[1])
-			{
-				this.right.detach();
-				this.right = jQuery(this._children[1].getDOMNode(this._children[1]))
-					.appendTo(this.div);
-			}
-		}
-
-		// Nextmatches (and possibly other "full height" widgets) need to be adjusted
-		// Trigger the dynamic height thing to re-initialize
-		for(var i = 0; i < this._children.length; i++)
-		{
-			if(this._children[i].dynheight)
-			{
-				this._children[i].dynheight.outerNode = (i == 0 ? this.left : this.right);
-				this._children[i].dynheight.initialized = false;
-			}
-		}
-	}
-
-	doLoadingFinished()
-	{
-		super.doLoadingFinished();
-
-		// Not done yet, but widget will let you know
-		let p = new Promise((resolve) =>
-		{
-			// Use a timeout to give the children a chance to finish
-			window.setTimeout(() => this._init_splitter(resolve), 1);
-		});
-		return p;
-	}
-
-	/**
-	 * Initialize the splitter UI
-	 * Internal.
-	 */
-	private _init_splitter(resolve? : Function)
-	{
-		if(!this.isAttached()) return;
-
-		// Avoid trying to do anything while hidden - it ruins all the calculations
-		// Try again in resize()
-		if(!this.div.is(':visible')) return;
-
-		let options = {
-			type:	this.orientation,
-			dock:	this.dock_side,
-			splitterClass: "et2_split",
-			outline: true,
-			eventNamespace: '.et2_split.'+this.id,
-
-			// Default sizes, in case the preference doesn't work
-			// Splitter would normally just go to 50%, but our deferred loading
-			// ruins sizing for it
-			sizeTop: this.dynheight.outerNode.height() / 2,
-			sizeLeft: this.dynheight.outerNode.width() / 2
-		};
-
-		let widget = this;
-
-		//Convert pixel size to percent
-		let pix2per = function (_size)
-		{
-			let per;
-			if (widget.orientation == "v")
-			{
-				per = _size * 100 / widget.dynheight.outerNode.width();
-			}
-			else
-			{
-				per = _size * 100 / widget.dynheight.outerNode.height();
-			}
-			return per.toFixed(2) + "%";
-		};
-
-		// Check for position preference, load it in
-		if(this.id)
-		{
-			let pref = this.egw().preference('splitter-size-' + this.id, this.egw().getAppName());
-			if(pref)
-			{
-				// Change from percent back to numeric
-				if(typeof pref.sizeLeft !== "undefined")
-				{
-					pref.sizeLeft = ((parseFloat(pref.sizeLeft) / 100) * widget.dynheight.outerNode.width());
-				}
-				if(typeof pref.sizeTop !== "undefined")
-				{
-					pref.sizeTop = ((parseFloat(pref.sizeTop) / 100) * widget.dynheight.outerNode.height());
-				}
-				options = jQuery.extend(options, pref);
-				this.prefSize = pref[this.orientation == "v" ? 'sizeLeft' : 'sizeTop'];
-			}
-			// If there is no preference yet, set it to half size
-			// Otherwise the right pane gets the fullsize
-			if (typeof this.prefSize == 'undefined' || !this.prefSize)
-			{
-				this.prefSize = this.orientation == "v" ? options.sizeLeft: options.sizeTop;
-			}
-		}
-
-		// Avoid double init
-		if(this.div.hasClass(options.splitterClass))
-		{
-			this.div.trigger("destroy");
-		}
-
-		// Initialize splitter
-		this.div.splitter(options);
-
-		this.div.trigger('resize',[options.sizeTop || options.sizeLeft || 0]);
-
-		// Start docked?
-		if(options.dock)
-		{
-			if(options.dock == "bottomDock" && Math.abs(options.sizeTop - this.div.height()) < et2_split.DOCK_TOLERANCE ||
-				options.dock == "topDock" && options.sizeTop == 0 ||
-				!this.div.is(':visible')  // Starting docked if hidden simplifies life when resizing
-			)
-			{
-				this.dock();
-			}
-		}
-
-		// Add icon to splitter bar
-		let icon = "ui-icon-grip-"
-			+ (this.dock_side ? "solid" : "dotted") + "-"
-			+ (this.orientation == "h" ? "horizontal" : "vertical");
-
-		jQuery(document.createElement("div"))
-			.addClass("ui-icon")
-			.addClass(icon)
-			.appendTo(this.left.next());
-
-		// Save preference when size changed
-		if(this.id && this.egw().getAppName())
-		{
-			let self = this;
-			this.left.on("resize"+options.eventNamespace, function(e) {
-
-				// Force immediate layout, so proper layout & sizes are available
-				// for resize().  Chrome defers layout, so current DOM node sizes
-				// are not available to widgets if they ask.
-				var display = this.style.display;
-				this.style.display = 'none';
-				this.offsetHeight;
-				this.style.display = display;
-
-				if(e.namespace == options.eventNamespace.substr(1) && !self.isDocked())
-				{
-					// Store current position in preferences
-					var size = self.orientation == "v" ? {sizeLeft: self.left.width()} : {sizeTop: self.left.height()};
-					self.prefSize = size[self.orientation == "v" ?'sizeLeft' : 'sizeTop'];
-					var prefInPercent = self.orientation == "v" ?{sizeLeft:pix2per(size.sizeLeft)}:{sizeTop:pix2per(size.sizeTop)};
-					if(parseInt(self.orientation == 'v' ? prefInPercent.sizeLeft : prefInPercent.sizeTop) < 100)
-					{
-						self.egw().set_preference(self.egw().getAppName(), 'splitter-size-' + self.id, prefInPercent);
-					}
-				}
-
-				// Ok, update children
-				self.iterateOver(function(widget) {
-					// Extra resize would cause stalling chrome
-					// as resize might conflict with bottom download bar
-					// in chrome which does a window resize, so better to not
-					// trigger second resize and leave that to an application
-					// if it is necessary.
-
-					// Above forcing is not enough for Firefox, defer
-					window.setTimeout(jQuery.proxy(function() {this.resize();}, widget),200);
-				},self,et2_IResizeable);
-			});
-		}
-
-		if (resolve) resolve();
-	}
-
-	/**
-	 * Implement the et2_IResizable interface to resize
-	 */
-	resize()
-	{
-		// Avoid doing anything while hidden - check here, and init if needed
-		if(this.div.children().length <= 2)
-		{
-			this._init_splitter();
-		}
-		if(this.dynheight && !this.stop_resize )
-		{
-			let old = {w: this.div.width(), h: this.div.height()};
-			this.dynheight.update(function(w,h) {
-				if(this.orientation == "v")
-				{
-					this.left.height(h);
-					this.right.height(h);
-					if(this.left.width() + this.right.width() + this.div.find('.splitter-bar').outerWidth() < this.div.width() ||
-						this.left.width() + this.right.width()- this.div.find('.splitter-bar').outerWidth() > this.div.width())
-						this.div.trigger('resize.et2_split.'+this.id, this.prefSize);
-				}
-				if(this.orientation == "h")
-				{
-					this.left.width(w);
-					this.right.width(w);
-					if(this.isDocked()) {
-						if(this.dock_side == "topDock")
-						{
-							this.right.height(h);
-							this.left.height(0);
-						}
-						else
-						{
-							this.left.height(h);
-							this.right.height(0);
-						}
-					}
-				}
-				if(w != old.w || h != old.h)
-				{
-					this.div.trigger('resize.et2_split.'+this.id, this.prefSize);
-				}
-			}, this);
-		}
-	}
-
-	getDOMNode()
-	{
-		return this.div[0];
-	}
-
-	/**
-	 * Set splitter orientation
-	 *
-	 * @param orient String "v" or "h"
-	 */
-	set_orientation(orient)
-	{
-		this.orientation = orient;
-
-		this._init_splitter();
-	}
-
-	/**
-	 * Set the side for docking
-	 *
-	 * @param dock String One of leftDock, rightDock, topDock, bottomDock
-	 */
-	set_dock_side(dock)
-	{
-		this.dock_side = dock;
-
-		this._init_splitter();
-	}
-
-	/**
-	 * Turn on or off resizing while dragging
-	 *
-	 * @param outline boolean
-	 */
-	set_outline(outline)
-	{
-		this.outline = outline;
-		this._init_splitter();
-	}
-
-	/**
-	 * If the splitter has a dock direction set, dock it.
-	 * Docking requires the dock attribute to be set.
-	 */
-	dock()
-	{
-		if(this.isDocked()) return;
-		this.div.trigger("dock");
-	}
-
-	/**
-	 * If the splitter is docked, restore it to previous size
-	 * Docking requires the dock attribute to be set.
-	 */
-	undock()
-	{
-		this.div.trigger("undock");
-	}
-
-	/**
-	 * Determine if the splitter is docked
-	 * @return boolean
-	 */
-	isDocked()
-	{
-		var bar = jQuery('.splitter-bar',this.div);
-		return bar.hasClass('splitter-bar-horizontal-docked') || bar.hasClass('splitter-bar-vertical-docked');
-	}
-
-	/**
-	 * Toggle the splitter's docked state.
-	 * Docking requires the dock attribute to be set.
-	 */
-	toggleDock()
-	{
-		this.div.trigger("toggleDock");
-	}
-
-	// Printing
-	/**
-	 * Prepare for printing by stopping all the fuss
-	 *
-	 */
-	beforePrint()
-	{
-		// Resizing causes preference changes & relayouts.  Don't do it.
-		this.stop_resize = true;
-
-		// Add the class, if needed
-		this.div.addClass('print');
-
-		// Don't return anything, just work normally
-	}
-	afterPrint()
-	{
-		this.div.removeClass('print');
-		this.stop_resize = false;
-	}
-}
-et2_register_widget(et2_split, ["split"]);
\ No newline at end of file
diff --git a/api/js/etemplate/etemplate2.ts b/api/js/etemplate/etemplate2.ts
index cda144f19a..02b274ac07 100644
--- a/api/js/etemplate/etemplate2.ts
+++ b/api/js/etemplate/etemplate2.ts
@@ -65,7 +65,6 @@ import './et2_widget_grid';
 import './et2_widget_box';
 import './et2_widget_hbox';
 import './et2_widget_groupbox';
-import './et2_widget_split';
 import './et2_widget_button';
 import './et2_widget_color';
 import './et2_widget_description';
diff --git a/api/js/jquery/jquery-ui-timepicker-addon.css b/api/js/jquery/jquery-ui-timepicker-addon.css
deleted file mode 100644
index 95a22420cf..0000000000
--- a/api/js/jquery/jquery-ui-timepicker-addon.css
+++ /dev/null
@@ -1,30 +0,0 @@
-.ui-timepicker-div .ui-widget-header { margin-bottom: 8px; }
-.ui-timepicker-div dl { text-align: left; }
-.ui-timepicker-div dl dt { float: left; clear:left; padding: 0 0 0 5px; }
-.ui-timepicker-div dl dd { margin: 0 10px 10px 40%; }
-.ui-timepicker-div td { font-size: 90%; }
-.ui-tpicker-grid-label { background: none; border: none; margin: 0; padding: 0; }
-.ui-timepicker-div .ui_tpicker_unit_hide{ display: none; }
-
-.ui-timepicker-div .ui_tpicker_time .ui_tpicker_time_input { background: none; color: inherit; border: none; outline: none; border-bottom: solid 1px #555; width: 95%; }
-.ui-timepicker-div .ui_tpicker_time .ui_tpicker_time_input:focus { border-bottom-color: #aaa; }
-
-.ui-timepicker-rtl{ direction: rtl; }
-.ui-timepicker-rtl dl { text-align: right; padding: 0 5px 0 0; }
-.ui-timepicker-rtl dl dt{ float: right; clear: right; }
-.ui-timepicker-rtl dl dd { margin: 0 40% 10px 10px; }
-
-/* Shortened version style */
-.ui-timepicker-div.ui-timepicker-oneLine { padding-right: 2px; }
-.ui-timepicker-div.ui-timepicker-oneLine .ui_tpicker_time, 
-.ui-timepicker-div.ui-timepicker-oneLine dt { display: none; }
-.ui-timepicker-div.ui-timepicker-oneLine .ui_tpicker_time_label { display: block; padding-top: 2px; }
-.ui-timepicker-div.ui-timepicker-oneLine dl { text-align: right; }
-.ui-timepicker-div.ui-timepicker-oneLine dl dd, 
-.ui-timepicker-div.ui-timepicker-oneLine dl dd > div { display:inline-block; margin:0; }
-.ui-timepicker-div.ui-timepicker-oneLine dl dd.ui_tpicker_minute:before,
-.ui-timepicker-div.ui-timepicker-oneLine dl dd.ui_tpicker_second:before { content:':'; display:inline-block; }
-.ui-timepicker-div.ui-timepicker-oneLine dl dd.ui_tpicker_millisec:before,
-.ui-timepicker-div.ui-timepicker-oneLine dl dd.ui_tpicker_microsec:before { content:'.'; display:inline-block; }
-.ui-timepicker-div.ui-timepicker-oneLine .ui_tpicker_unit_hide,
-.ui-timepicker-div.ui-timepicker-oneLine .ui_tpicker_unit_hide:before{ display: none; }
\ No newline at end of file
diff --git a/api/js/jquery/jquery-ui-timepicker-addon.js b/api/js/jquery/jquery-ui-timepicker-addon.js
deleted file mode 100644
index 1f67c320bc..0000000000
--- a/api/js/jquery/jquery-ui-timepicker-addon.js
+++ /dev/null
@@ -1,2263 +0,0 @@
-/*! jQuery Timepicker Addon - v1.6.1 - 2015-11-14
-* http://trentrichardson.com/examples/timepicker
-* Copyright (c) 2015 Trent Richardson; Licensed MIT */
-(function (factory) {
-	if (typeof define === 'function' && define.amd) {
-		define(['jquery', 'jquery-ui'], factory);
-	} else {
-		factory(jQuery);
-	}
-}(function ($) {
-
-	/*
-	* Lets not redefine timepicker, Prevent "Uncaught RangeError: Maximum call stack size exceeded"
-	*/
-	$.ui.timepicker = $.ui.timepicker || {};
-	if ($.ui.timepicker.version) {
-		return;
-	}
-
-	/*
-	* Extend jQueryUI, get it started with our version number
-	*/
-	$.extend($.ui, {
-		timepicker: {
-			version: "1.6.1"
-		}
-	});
-
-	/* 
-	* Timepicker manager.
-	* Use the singleton instance of this class, $.timepicker, to interact with the time picker.
-	* Settings for (groups of) time pickers are maintained in an instance object,
-	* allowing multiple different settings on the same page.
-	*/
-	var Timepicker = function () {
-		this.regional = []; // Available regional settings, indexed by language code
-		this.regional[''] = { // Default regional settings
-			currentText: 'Now',
-			closeText: 'Done',
-			amNames: ['AM', 'A'],
-			pmNames: ['PM', 'P'],
-			timeFormat: 'HH:mm',
-			timeSuffix: '',
-			timeOnlyTitle: 'Choose Time',
-			timeText: 'Time',
-			hourText: 'Hour',
-			minuteText: 'Minute',
-			secondText: 'Second',
-			millisecText: 'Millisecond',
-			microsecText: 'Microsecond',
-			timezoneText: 'Time Zone',
-			isRTL: false
-		};
-		this._defaults = { // Global defaults for all the datetime picker instances
-			showButtonPanel: true,
-			timeOnly: false,
-			timeOnlyShowDate: false,
-			showHour: null,
-			showMinute: null,
-			showSecond: null,
-			showMillisec: null,
-			showMicrosec: null,
-			showTimezone: null,
-			showTime: true,
-			stepHour: 1,
-			stepMinute: 1,
-			stepSecond: 1,
-			stepMillisec: 1,
-			stepMicrosec: 1,
-			hour: 0,
-			minute: 0,
-			second: 0,
-			millisec: 0,
-			microsec: 0,
-			timezone: null,
-			hourMin: 0,
-			minuteMin: 0,
-			secondMin: 0,
-			millisecMin: 0,
-			microsecMin: 0,
-			hourMax: 23,
-			minuteMax: 59,
-			secondMax: 59,
-			millisecMax: 999,
-			microsecMax: 999,
-			minDateTime: null,
-			maxDateTime: null,
-			maxTime: null,
-			minTime: null,
-			onSelect: null,
-			hourGrid: 0,
-			minuteGrid: 0,
-			secondGrid: 0,
-			millisecGrid: 0,
-			microsecGrid: 0,
-			alwaysSetTime: true,
-			separator: ' ',
-			altFieldTimeOnly: true,
-			altTimeFormat: null,
-			altSeparator: null,
-			altTimeSuffix: null,
-			altRedirectFocus: true,
-			pickerTimeFormat: null,
-			pickerTimeSuffix: null,
-			showTimepicker: true,
-			timezoneList: null,
-			addSliderAccess: false,
-			sliderAccessArgs: null,
-			controlType: 'slider',
-			oneLine: false,
-			defaultValue: null,
-			parse: 'strict',
-			afterInject: null
-		};
-		$.extend(this._defaults, this.regional['']);
-	};
-
-	$.extend(Timepicker.prototype, {
-		$input: null,
-		$altInput: null,
-		$timeObj: null,
-		inst: null,
-		hour_slider: null,
-		minute_slider: null,
-		second_slider: null,
-		millisec_slider: null,
-		microsec_slider: null,
-		timezone_select: null,
-		maxTime: null,
-		minTime: null,
-		hour: 0,
-		minute: 0,
-		second: 0,
-		millisec: 0,
-		microsec: 0,
-		timezone: null,
-		hourMinOriginal: null,
-		minuteMinOriginal: null,
-		secondMinOriginal: null,
-		millisecMinOriginal: null,
-		microsecMinOriginal: null,
-		hourMaxOriginal: null,
-		minuteMaxOriginal: null,
-		secondMaxOriginal: null,
-		millisecMaxOriginal: null,
-		microsecMaxOriginal: null,
-		ampm: '',
-		formattedDate: '',
-		formattedTime: '',
-		formattedDateTime: '',
-		timezoneList: null,
-		units: ['hour', 'minute', 'second', 'millisec', 'microsec'],
-		support: {},
-		control: null,
-
-		/* 
-		* Override the default settings for all instances of the time picker.
-		* @param  {Object} settings  object - the new settings to use as defaults (anonymous object)
-		* @return {Object} the manager object
-		*/
-		setDefaults: function (settings) {
-			extendRemove(this._defaults, settings || {});
-			return this;
-		},
-
-		/*
-		* Create a new Timepicker instance
-		*/
-		_newInst: function ($input, opts) {
-			var tp_inst = new Timepicker(),
-				inlineSettings = {},
-				fns = {},
-				overrides, i;
-
-			for (var attrName in this._defaults) {
-				if (this._defaults.hasOwnProperty(attrName)) {
-					var attrValue = $input.attr('time:' + attrName);
-					if (attrValue) {
-						try {
-							inlineSettings[attrName] = eval(attrValue);
-						} catch (err) {
-							inlineSettings[attrName] = attrValue;
-						}
-					}
-				}
-			}
-
-			overrides = {
-				beforeShow: function (input, dp_inst) {
-					if ($.isFunction(tp_inst._defaults.evnts.beforeShow)) {
-						return tp_inst._defaults.evnts.beforeShow.call($input[0], input, dp_inst, tp_inst);
-					}
-				},
-				onChangeMonthYear: function (year, month, dp_inst) {
-					// Update the time as well : this prevents the time from disappearing from the $input field.
-					// tp_inst._updateDateTime(dp_inst);
-					if ($.isFunction(tp_inst._defaults.evnts.onChangeMonthYear)) {
-						tp_inst._defaults.evnts.onChangeMonthYear.call($input[0], year, month, dp_inst, tp_inst);
-					}
-				},
-				onClose: function (dateText, dp_inst) {
-					if (tp_inst.timeDefined === true && $input.val() !== '') {
-						tp_inst._updateDateTime(dp_inst);
-					}
-					if ($.isFunction(tp_inst._defaults.evnts.onClose)) {
-						tp_inst._defaults.evnts.onClose.call($input[0], dateText, dp_inst, tp_inst);
-					}
-				}
-			};
-			for (i in overrides) {
-				if (overrides.hasOwnProperty(i)) {
-					fns[i] = opts[i] || this._defaults[i] || null;
-				}
-			}
-
-			tp_inst._defaults = $.extend({}, this._defaults, inlineSettings, opts, overrides, {
-				evnts: fns,
-				timepicker: tp_inst // add timepicker as a property of datepicker: $.datepicker._get(dp_inst, 'timepicker');
-			});
-			tp_inst.amNames = $.map(tp_inst._defaults.amNames, function (val) {
-				return val.toUpperCase();
-			});
-			tp_inst.pmNames = $.map(tp_inst._defaults.pmNames, function (val) {
-				return val.toUpperCase();
-			});
-
-			// detect which units are supported
-			tp_inst.support = detectSupport(
-					tp_inst._defaults.timeFormat + 
-					(tp_inst._defaults.pickerTimeFormat ? tp_inst._defaults.pickerTimeFormat : '') +
-					(tp_inst._defaults.altTimeFormat ? tp_inst._defaults.altTimeFormat : ''));
-
-			// controlType is string - key to our this._controls
-			if (typeof(tp_inst._defaults.controlType) === 'string') {
-				if (tp_inst._defaults.controlType === 'slider' && typeof($.ui.slider) === 'undefined') {
-					tp_inst._defaults.controlType = 'select';
-				}
-				tp_inst.control = tp_inst._controls[tp_inst._defaults.controlType];
-			}
-			// controlType is an object and must implement create, options, value methods
-			else {
-				tp_inst.control = tp_inst._defaults.controlType;
-			}
-
-			// prep the timezone options
-			var timezoneList = [-720, -660, -600, -570, -540, -480, -420, -360, -300, -270, -240, -210, -180, -120, -60,
-					0, 60, 120, 180, 210, 240, 270, 300, 330, 345, 360, 390, 420, 480, 525, 540, 570, 600, 630, 660, 690, 720, 765, 780, 840];
-			if (tp_inst._defaults.timezoneList !== null) {
-				timezoneList = tp_inst._defaults.timezoneList;
-			}
-			var tzl = timezoneList.length, tzi = 0, tzv = null;
-			if (tzl > 0 && typeof timezoneList[0] !== 'object') {
-				for (; tzi < tzl; tzi++) {
-					tzv = timezoneList[tzi];
-					timezoneList[tzi] = { value: tzv, label: $.timepicker.timezoneOffsetString(tzv, tp_inst.support.iso8601) };
-				}
-			}
-			tp_inst._defaults.timezoneList = timezoneList;
-
-			// set the default units
-			tp_inst.timezone = tp_inst._defaults.timezone !== null ? $.timepicker.timezoneOffsetNumber(tp_inst._defaults.timezone) :
-							((new Date()).getTimezoneOffset() * -1);
-			tp_inst.hour = tp_inst._defaults.hour < tp_inst._defaults.hourMin ? tp_inst._defaults.hourMin :
-							tp_inst._defaults.hour > tp_inst._defaults.hourMax ? tp_inst._defaults.hourMax : tp_inst._defaults.hour;
-			tp_inst.minute = tp_inst._defaults.minute < tp_inst._defaults.minuteMin ? tp_inst._defaults.minuteMin :
-							tp_inst._defaults.minute > tp_inst._defaults.minuteMax ? tp_inst._defaults.minuteMax : tp_inst._defaults.minute;
-			tp_inst.second = tp_inst._defaults.second < tp_inst._defaults.secondMin ? tp_inst._defaults.secondMin :
-							tp_inst._defaults.second > tp_inst._defaults.secondMax ? tp_inst._defaults.secondMax : tp_inst._defaults.second;
-			tp_inst.millisec = tp_inst._defaults.millisec < tp_inst._defaults.millisecMin ? tp_inst._defaults.millisecMin :
-							tp_inst._defaults.millisec > tp_inst._defaults.millisecMax ? tp_inst._defaults.millisecMax : tp_inst._defaults.millisec;
-			tp_inst.microsec = tp_inst._defaults.microsec < tp_inst._defaults.microsecMin ? tp_inst._defaults.microsecMin :
-							tp_inst._defaults.microsec > tp_inst._defaults.microsecMax ? tp_inst._defaults.microsecMax : tp_inst._defaults.microsec;
-			tp_inst.ampm = '';
-			tp_inst.$input = $input;
-
-			if (tp_inst._defaults.altField) {
-				tp_inst.$altInput = $(tp_inst._defaults.altField);
-				if (tp_inst._defaults.altRedirectFocus === true) {
-					tp_inst.$altInput.css({
-						cursor: 'pointer'
-					}).focus(function () {
-						$input.trigger("focus");
-					});
-				}
-			}
-
-			if (tp_inst._defaults.minDate === 0 || tp_inst._defaults.minDateTime === 0) {
-				tp_inst._defaults.minDate = new Date();
-			}
-			if (tp_inst._defaults.maxDate === 0 || tp_inst._defaults.maxDateTime === 0) {
-				tp_inst._defaults.maxDate = new Date();
-			}
-
-			// datepicker needs minDate/maxDate, timepicker needs minDateTime/maxDateTime..
-			if (tp_inst._defaults.minDate !== undefined && tp_inst._defaults.minDate instanceof Date) {
-				tp_inst._defaults.minDateTime = new Date(tp_inst._defaults.minDate.getTime());
-			}
-			if (tp_inst._defaults.minDateTime !== undefined && tp_inst._defaults.minDateTime instanceof Date) {
-				tp_inst._defaults.minDate = new Date(tp_inst._defaults.minDateTime.getTime());
-			}
-			if (tp_inst._defaults.maxDate !== undefined && tp_inst._defaults.maxDate instanceof Date) {
-				tp_inst._defaults.maxDateTime = new Date(tp_inst._defaults.maxDate.getTime());
-			}
-			if (tp_inst._defaults.maxDateTime !== undefined && tp_inst._defaults.maxDateTime instanceof Date) {
-				tp_inst._defaults.maxDate = new Date(tp_inst._defaults.maxDateTime.getTime());
-			}
-			tp_inst.$input.bind('focus', function () {
-				tp_inst._onFocus();
-			});
-
-			return tp_inst;
-		},
-
-		/*
-		* add our sliders to the calendar
-		*/
-		_addTimePicker: function (dp_inst) {
-			var currDT = $.trim((this.$altInput && this._defaults.altFieldTimeOnly) ? this.$input.val() + ' ' + this.$altInput.val() : this.$input.val());
-
-			this.timeDefined = this._parseTime(currDT);
-			this._limitMinMaxDateTime(dp_inst, false);
-			this._injectTimePicker();
-			this._afterInject();
-		},
-
-		/*
-		* parse the time string from input value or _setTime
-		*/
-		_parseTime: function (timeString, withDate) {
-			if (!this.inst) {
-				this.inst = $.datepicker._getInst(this.$input[0]);
-			}
-
-			if (withDate || !this._defaults.timeOnly) {
-				var dp_dateFormat = $.datepicker._get(this.inst, 'dateFormat');
-				try {
-					var parseRes = parseDateTimeInternal(dp_dateFormat, this._defaults.timeFormat, timeString, $.datepicker._getFormatConfig(this.inst), this._defaults);
-					if (!parseRes.timeObj) {
-						return false;
-					}
-					$.extend(this, parseRes.timeObj);
-				} catch (err) {
-					$.timepicker.log("Error parsing the date/time string: " + err +
-									"\ndate/time string = " + timeString +
-									"\ntimeFormat = " + this._defaults.timeFormat +
-									"\ndateFormat = " + dp_dateFormat);
-					return false;
-				}
-				return true;
-			} else {
-				var timeObj = $.datepicker.parseTime(this._defaults.timeFormat, timeString, this._defaults);
-				if (!timeObj) {
-					return false;
-				}
-				$.extend(this, timeObj);
-				return true;
-			}
-		},
-
-		/*
-		* Handle callback option after injecting timepicker
-		*/
-		_afterInject: function() {
-			var o = this.inst.settings;
-			if ($.isFunction(o.afterInject)) {
-				o.afterInject.call(this);
-			}
-		},
-
-		/*
-		* generate and inject html for timepicker into ui datepicker
-		*/
-		_injectTimePicker: function () {
-			var $dp = this.inst.dpDiv,
-				o = this.inst.settings,
-				tp_inst = this,
-				litem = '',
-				uitem = '',
-				show = null,
-				max = {},
-				gridSize = {},
-				size = null,
-				i = 0,
-				l = 0;
-
-			// Prevent displaying twice
-			if ($dp.find("div.ui-timepicker-div").length === 0 && o.showTimepicker) {
-				var noDisplay = ' ui_tpicker_unit_hide',
-					html = '<div class="ui-timepicker-div' + (o.isRTL ? ' ui-timepicker-rtl' : '') + (o.oneLine && o.controlType === 'select' ? ' ui-timepicker-oneLine' : '') + '"><dl>' + '<dt class="ui_tpicker_time_label' + ((o.showTime) ? '' : noDisplay) + '">' + o.timeText + '</dt>' +
-								'<dd class="ui_tpicker_time '+ ((o.showTime) ? '' : noDisplay) + '"><input class="ui_tpicker_time_input" ' + (o.timeInput ? '' : 'disabled') + '/></dd>';
-
-				// Create the markup
-				for (i = 0, l = this.units.length; i < l; i++) {
-					litem = this.units[i];
-					uitem = litem.substr(0, 1).toUpperCase() + litem.substr(1);
-					show = o['show' + uitem] !== null ? o['show' + uitem] : this.support[litem];
-
-					// Added by Peter Medeiros:
-					// - Figure out what the hour/minute/second max should be based on the step values.
-					// - Example: if stepMinute is 15, then minMax is 45.
-					max[litem] = parseInt((o[litem + 'Max'] - ((o[litem + 'Max'] - o[litem + 'Min']) % o['step' + uitem])), 10);
-					gridSize[litem] = 0;
-
-					html += '<dt class="ui_tpicker_' + litem + '_label' + (show ? '' : noDisplay) + '">' + o[litem + 'Text'] + '</dt>' +
-								'<dd class="ui_tpicker_' + litem + (show ? '' : noDisplay) + '"><div class="ui_tpicker_' + litem + '_slider' + (show ? '' : noDisplay) + '"></div>';
-
-					if (show && o[litem + 'Grid'] > 0) {
-						html += '<div style="padding-left: 1px"><table class="ui-tpicker-grid-label"><tr>';
-
-						if (litem === 'hour') {
-							for (var h = o[litem + 'Min']; h <= max[litem]; h += parseInt(o[litem + 'Grid'], 10)) {
-								gridSize[litem]++;
-								var tmph = $.datepicker.formatTime(this.support.ampm ? 'hht' : 'HH', {hour: h}, o);
-								html += '<td data-for="' + litem + '">' + tmph + '</td>';
-							}
-						}
-						else {
-							for (var m = o[litem + 'Min']; m <= max[litem]; m += parseInt(o[litem + 'Grid'], 10)) {
-								gridSize[litem]++;
-								html += '<td data-for="' + litem + '">' + ((m < 10) ? '0' : '') + m + '</td>';
-							}
-						}
-
-						html += '</tr></table></div>';
-					}
-					html += '</dd>';
-				}
-				
-				// Timezone
-				var showTz = o.showTimezone !== null ? o.showTimezone : this.support.timezone;
-				html += '<dt class="ui_tpicker_timezone_label' + (showTz ? '' : noDisplay) + '">' + o.timezoneText + '</dt>';
-				html += '<dd class="ui_tpicker_timezone' + (showTz ? '' : noDisplay) + '"></dd>';
-
-				// Create the elements from string
-				html += '</dl></div>';
-				var $tp = $(html);
-
-				// if we only want time picker...
-				if (o.timeOnly === true) {
-					$tp.prepend('<div class="ui-widget-header ui-helper-clearfix ui-corner-all">' + '<div class="ui-datepicker-title">' + o.timeOnlyTitle + '</div>' + '</div>');
-					$dp.find('.ui-datepicker-header, .ui-datepicker-calendar').hide();
-				}
-				
-				// add sliders, adjust grids, add events
-				for (i = 0, l = tp_inst.units.length; i < l; i++) {
-					litem = tp_inst.units[i];
-					uitem = litem.substr(0, 1).toUpperCase() + litem.substr(1);
-					show = o['show' + uitem] !== null ? o['show' + uitem] : this.support[litem];
-
-					// add the slider
-					tp_inst[litem + '_slider'] = tp_inst.control.create(tp_inst, $tp.find('.ui_tpicker_' + litem + '_slider'), litem, tp_inst[litem], o[litem + 'Min'], max[litem], o['step' + uitem]);
-
-					// adjust the grid and add click event
-					if (show && o[litem + 'Grid'] > 0) {
-						size = 100 * gridSize[litem] * o[litem + 'Grid'] / (max[litem] - o[litem + 'Min']);
-						$tp.find('.ui_tpicker_' + litem + ' table').css({
-							width: size + "%",
-							marginLeft: o.isRTL ? '0' : ((size / (-2 * gridSize[litem])) + "%"),
-							marginRight: o.isRTL ? ((size / (-2 * gridSize[litem])) + "%") : '0',
-							borderCollapse: 'collapse'
-						}).find("td").click(function (e) {
-								var $t = $(this),
-									h = $t.html(),
-									n = parseInt(h.replace(/[^0-9]/g), 10),
-									ap = h.replace(/[^apm]/ig),
-									f = $t.data('for'); // loses scope, so we use data-for
-
-								if (f === 'hour') {
-									if (ap.indexOf('p') !== -1 && n < 12) {
-										n += 12;
-									}
-									else {
-										if (ap.indexOf('a') !== -1 && n === 12) {
-											n = 0;
-										}
-									}
-								}
-								
-								tp_inst.control.value(tp_inst, tp_inst[f + '_slider'], litem, n);
-
-								tp_inst._onTimeChange();
-								tp_inst._onSelectHandler();
-							}).css({
-								cursor: 'pointer',
-								width: (100 / gridSize[litem]) + '%',
-								textAlign: 'center',
-								overflow: 'hidden'
-							});
-					} // end if grid > 0
-				} // end for loop
-
-				// Add timezone options
-				this.timezone_select = $tp.find('.ui_tpicker_timezone').append('<select></select>').find("select");
-				$.fn.append.apply(this.timezone_select,
-				$.map(o.timezoneList, function (val, idx) {
-					return $("<option />").val(typeof val === "object" ? val.value : val).text(typeof val === "object" ? val.label : val);
-				}));
-				if (typeof(this.timezone) !== "undefined" && this.timezone !== null && this.timezone !== "") {
-					var local_timezone = (new Date(this.inst.selectedYear, this.inst.selectedMonth, this.inst.selectedDay, 12)).getTimezoneOffset() * -1;
-					if (local_timezone === this.timezone) {
-						selectLocalTimezone(tp_inst);
-					} else {
-						this.timezone_select.val(this.timezone);
-					}
-				} else {
-					if (typeof(this.hour) !== "undefined" && this.hour !== null && this.hour !== "") {
-						this.timezone_select.val(o.timezone);
-					} else {
-						selectLocalTimezone(tp_inst);
-					}
-				}
-				this.timezone_select.change(function () {
-					tp_inst._onTimeChange();
-					tp_inst._onSelectHandler();
-					tp_inst._afterInject();
-				});
-				// End timezone options
-				
-				// inject timepicker into datepicker
-				var $buttonPanel = $dp.find('.ui-datepicker-buttonpane');
-				if ($buttonPanel.length) {
-					$buttonPanel.before($tp);
-				} else {
-					$dp.append($tp);
-				}
-
-				this.$timeObj = $tp.find('.ui_tpicker_time_input');
-				this.$timeObj.change(function () {
-					var timeFormat = tp_inst.inst.settings.timeFormat;
-					var parsedTime = $.datepicker.parseTime(timeFormat, this.value);
-					var update = new Date();
-					if (parsedTime) {
-						update.setHours(parsedTime.hour);
-						update.setMinutes(parsedTime.minute);
-						update.setSeconds(parsedTime.second);
-						$.datepicker._setTime(tp_inst.inst, update);
-					} else {
-						this.value = tp_inst.formattedTime;
-						this.blur();
-					}
-				});
-
-				if (this.inst !== null) {
-					var timeDefined = this.timeDefined;
-					this._onTimeChange();
-					this.timeDefined = timeDefined;
-				}
-
-				// slideAccess integration: http://trentrichardson.com/2011/11/11/jquery-ui-sliders-and-touch-accessibility/
-				if (this._defaults.addSliderAccess) {
-					var sliderAccessArgs = this._defaults.sliderAccessArgs,
-						rtl = this._defaults.isRTL;
-					sliderAccessArgs.isRTL = rtl;
-						
-					setTimeout(function () { // fix for inline mode
-						if ($tp.find('.ui-slider-access').length === 0) {
-							$tp.find('.ui-slider:visible').sliderAccess(sliderAccessArgs);
-
-							// fix any grids since sliders are shorter
-							var sliderAccessWidth = $tp.find('.ui-slider-access:eq(0)').outerWidth(true);
-							if (sliderAccessWidth) {
-								$tp.find('table:visible').each(function () {
-									var $g = $(this),
-										oldWidth = $g.outerWidth(),
-										oldMarginLeft = $g.css(rtl ? 'marginRight' : 'marginLeft').toString().replace('%', ''),
-										newWidth = oldWidth - sliderAccessWidth,
-										newMarginLeft = ((oldMarginLeft * newWidth) / oldWidth) + '%',
-										css = { width: newWidth, marginRight: 0, marginLeft: 0 };
-									css[rtl ? 'marginRight' : 'marginLeft'] = newMarginLeft;
-									$g.css(css);
-								});
-							}
-						}
-					}, 10);
-				}
-				// end slideAccess integration
-
-				tp_inst._limitMinMaxDateTime(this.inst, true);
-			}
-		},
-
-		/*
-		* This function tries to limit the ability to go outside the
-		* min/max date range
-		*/
-		_limitMinMaxDateTime: function (dp_inst, adjustSliders) {
-			var o = this._defaults,
-				dp_date = new Date(dp_inst.selectedYear, dp_inst.selectedMonth, dp_inst.selectedDay);
-
-			if (!this._defaults.showTimepicker) {
-				return;
-			} // No time so nothing to check here
-
-			if ($.datepicker._get(dp_inst, 'minDateTime') !== null && $.datepicker._get(dp_inst, 'minDateTime') !== undefined && dp_date) {
-				var minDateTime = $.datepicker._get(dp_inst, 'minDateTime'),
-					minDateTimeDate = new Date(minDateTime.getFullYear(), minDateTime.getMonth(), minDateTime.getDate(), 0, 0, 0, 0);
-
-				if (this.hourMinOriginal === null || this.minuteMinOriginal === null || this.secondMinOriginal === null || this.millisecMinOriginal === null || this.microsecMinOriginal === null) {
-					this.hourMinOriginal = o.hourMin;
-					this.minuteMinOriginal = o.minuteMin;
-					this.secondMinOriginal = o.secondMin;
-					this.millisecMinOriginal = o.millisecMin;
-					this.microsecMinOriginal = o.microsecMin;
-				}
-
-				if (dp_inst.settings.timeOnly || minDateTimeDate.getTime() === dp_date.getTime()) {
-					this._defaults.hourMin = minDateTime.getHours();
-					if (this.hour <= this._defaults.hourMin) {
-						this.hour = this._defaults.hourMin;
-						this._defaults.minuteMin = minDateTime.getMinutes();
-						if (this.minute <= this._defaults.minuteMin) {
-							this.minute = this._defaults.minuteMin;
-							this._defaults.secondMin = minDateTime.getSeconds();
-							if (this.second <= this._defaults.secondMin) {
-								this.second = this._defaults.secondMin;
-								this._defaults.millisecMin = minDateTime.getMilliseconds();
-								if (this.millisec <= this._defaults.millisecMin) {
-									this.millisec = this._defaults.millisecMin;
-									this._defaults.microsecMin = minDateTime.getMicroseconds();
-								} else {
-									if (this.microsec < this._defaults.microsecMin) {
-										this.microsec = this._defaults.microsecMin;
-									}
-									this._defaults.microsecMin = this.microsecMinOriginal;
-								}
-							} else {
-								this._defaults.millisecMin = this.millisecMinOriginal;
-								this._defaults.microsecMin = this.microsecMinOriginal;
-							}
-						} else {
-							this._defaults.secondMin = this.secondMinOriginal;
-							this._defaults.millisecMin = this.millisecMinOriginal;
-							this._defaults.microsecMin = this.microsecMinOriginal;
-						}
-					} else {
-						this._defaults.minuteMin = this.minuteMinOriginal;
-						this._defaults.secondMin = this.secondMinOriginal;
-						this._defaults.millisecMin = this.millisecMinOriginal;
-						this._defaults.microsecMin = this.microsecMinOriginal;
-					}
-				} else {
-					this._defaults.hourMin = this.hourMinOriginal;
-					this._defaults.minuteMin = this.minuteMinOriginal;
-					this._defaults.secondMin = this.secondMinOriginal;
-					this._defaults.millisecMin = this.millisecMinOriginal;
-					this._defaults.microsecMin = this.microsecMinOriginal;
-				}
-			}
-
-			if ($.datepicker._get(dp_inst, 'maxDateTime') !== null && $.datepicker._get(dp_inst, 'maxDateTime') !== undefined && dp_date) {
-				var maxDateTime = $.datepicker._get(dp_inst, 'maxDateTime'),
-					maxDateTimeDate = new Date(maxDateTime.getFullYear(), maxDateTime.getMonth(), maxDateTime.getDate(), 0, 0, 0, 0);
-
-				if (this.hourMaxOriginal === null || this.minuteMaxOriginal === null || this.secondMaxOriginal === null || this.millisecMaxOriginal === null) {
-					this.hourMaxOriginal = o.hourMax;
-					this.minuteMaxOriginal = o.minuteMax;
-					this.secondMaxOriginal = o.secondMax;
-					this.millisecMaxOriginal = o.millisecMax;
-					this.microsecMaxOriginal = o.microsecMax;
-				}
-
-				if (dp_inst.settings.timeOnly || maxDateTimeDate.getTime() === dp_date.getTime()) {
-					this._defaults.hourMax = maxDateTime.getHours();
-					if (this.hour >= this._defaults.hourMax) {
-						this.hour = this._defaults.hourMax;
-						this._defaults.minuteMax = maxDateTime.getMinutes();
-						if (this.minute >= this._defaults.minuteMax) {
-							this.minute = this._defaults.minuteMax;
-							this._defaults.secondMax = maxDateTime.getSeconds();
-							if (this.second >= this._defaults.secondMax) {
-								this.second = this._defaults.secondMax;
-								this._defaults.millisecMax = maxDateTime.getMilliseconds();
-								if (this.millisec >= this._defaults.millisecMax) {
-									this.millisec = this._defaults.millisecMax;
-									this._defaults.microsecMax = maxDateTime.getMicroseconds();
-								} else {
-									if (this.microsec > this._defaults.microsecMax) {
-										this.microsec = this._defaults.microsecMax;
-									}
-									this._defaults.microsecMax = this.microsecMaxOriginal;
-								}
-							} else {
-								this._defaults.millisecMax = this.millisecMaxOriginal;
-								this._defaults.microsecMax = this.microsecMaxOriginal;
-							}
-						} else {
-							this._defaults.secondMax = this.secondMaxOriginal;
-							this._defaults.millisecMax = this.millisecMaxOriginal;
-							this._defaults.microsecMax = this.microsecMaxOriginal;
-						}
-					} else {
-						this._defaults.minuteMax = this.minuteMaxOriginal;
-						this._defaults.secondMax = this.secondMaxOriginal;
-						this._defaults.millisecMax = this.millisecMaxOriginal;
-						this._defaults.microsecMax = this.microsecMaxOriginal;
-					}
-				} else {
-					this._defaults.hourMax = this.hourMaxOriginal;
-					this._defaults.minuteMax = this.minuteMaxOriginal;
-					this._defaults.secondMax = this.secondMaxOriginal;
-					this._defaults.millisecMax = this.millisecMaxOriginal;
-					this._defaults.microsecMax = this.microsecMaxOriginal;
-				}
-			}
-
-			if (dp_inst.settings.minTime!==null) {				
-				var tempMinTime=new Date("01/01/1970 " + dp_inst.settings.minTime);				
-				if (this.hour<tempMinTime.getHours()) {
-					this.hour=this._defaults.hourMin=tempMinTime.getHours();
-					this.minute=this._defaults.minuteMin=tempMinTime.getMinutes();							
-				} else if (this.hour===tempMinTime.getHours() && this.minute<tempMinTime.getMinutes()) {
-					this.minute=this._defaults.minuteMin=tempMinTime.getMinutes();
-				} else {						
-					if (this._defaults.hourMin<tempMinTime.getHours()) {
-						this._defaults.hourMin=tempMinTime.getHours();
-						this._defaults.minuteMin=tempMinTime.getMinutes();					
-					} else if (this._defaults.hourMin===tempMinTime.getHours()===this.hour && this._defaults.minuteMin<tempMinTime.getMinutes()) {
-						this._defaults.minuteMin=tempMinTime.getMinutes();						
-					} else {
-						this._defaults.minuteMin=0;
-					}
-				}				
-			}
-			
-			if (dp_inst.settings.maxTime!==null) {				
-				var tempMaxTime=new Date("01/01/1970 " + dp_inst.settings.maxTime);
-				if (this.hour>tempMaxTime.getHours()) {
-					this.hour=this._defaults.hourMax=tempMaxTime.getHours();						
-					this.minute=this._defaults.minuteMax=tempMaxTime.getMinutes();
-				} else if (this.hour===tempMaxTime.getHours() && this.minute>tempMaxTime.getMinutes()) {							
-					this.minute=this._defaults.minuteMax=tempMaxTime.getMinutes();						
-				} else {
-					if (this._defaults.hourMax>tempMaxTime.getHours()) {
-						this._defaults.hourMax=tempMaxTime.getHours();
-						this._defaults.minuteMax=tempMaxTime.getMinutes();					
-					} else if (this._defaults.hourMax===tempMaxTime.getHours()===this.hour && this._defaults.minuteMax>tempMaxTime.getMinutes()) {
-						this._defaults.minuteMax=tempMaxTime.getMinutes();						
-					} else {
-						this._defaults.minuteMax=59;
-					}
-				}						
-			}
-			
-			if (adjustSliders !== undefined && adjustSliders === true) {
-				var hourMax = parseInt((this._defaults.hourMax - ((this._defaults.hourMax - this._defaults.hourMin) % this._defaults.stepHour)), 10),
-					minMax = parseInt((this._defaults.minuteMax - ((this._defaults.minuteMax - this._defaults.minuteMin) % this._defaults.stepMinute)), 10),
-					secMax = parseInt((this._defaults.secondMax - ((this._defaults.secondMax - this._defaults.secondMin) % this._defaults.stepSecond)), 10),
-					millisecMax = parseInt((this._defaults.millisecMax - ((this._defaults.millisecMax - this._defaults.millisecMin) % this._defaults.stepMillisec)), 10),
-					microsecMax = parseInt((this._defaults.microsecMax - ((this._defaults.microsecMax - this._defaults.microsecMin) % this._defaults.stepMicrosec)), 10);
-
-				if (this.hour_slider) {
-					this.control.options(this, this.hour_slider, 'hour', { min: this._defaults.hourMin, max: hourMax, step: this._defaults.stepHour });
-					this.control.value(this, this.hour_slider, 'hour', this.hour - (this.hour % this._defaults.stepHour));
-				}
-				if (this.minute_slider) {
-					this.control.options(this, this.minute_slider, 'minute', { min: this._defaults.minuteMin, max: minMax, step: this._defaults.stepMinute });
-					this.control.value(this, this.minute_slider, 'minute', this.minute - (this.minute % this._defaults.stepMinute));
-				}
-				if (this.second_slider) {
-					this.control.options(this, this.second_slider, 'second', { min: this._defaults.secondMin, max: secMax, step: this._defaults.stepSecond });
-					this.control.value(this, this.second_slider, 'second', this.second - (this.second % this._defaults.stepSecond));
-				}
-				if (this.millisec_slider) {
-					this.control.options(this, this.millisec_slider, 'millisec', { min: this._defaults.millisecMin, max: millisecMax, step: this._defaults.stepMillisec });
-					this.control.value(this, this.millisec_slider, 'millisec', this.millisec - (this.millisec % this._defaults.stepMillisec));
-				}
-				if (this.microsec_slider) {
-					this.control.options(this, this.microsec_slider, 'microsec', { min: this._defaults.microsecMin, max: microsecMax, step: this._defaults.stepMicrosec });
-					this.control.value(this, this.microsec_slider, 'microsec', this.microsec - (this.microsec % this._defaults.stepMicrosec));
-				}
-			}
-
-		},
-
-		/*
-		* when a slider moves, set the internal time...
-		* on time change is also called when the time is updated in the text field
-		*/
-		_onTimeChange: function () {
-			if (!this._defaults.showTimepicker) {
-                                return;
-			}
-			var hour = (this.hour_slider) ? this.control.value(this, this.hour_slider, 'hour') : false,
-				minute = (this.minute_slider) ? this.control.value(this, this.minute_slider, 'minute') : false,
-				second = (this.second_slider) ? this.control.value(this, this.second_slider, 'second') : false,
-				millisec = (this.millisec_slider) ? this.control.value(this, this.millisec_slider, 'millisec') : false,
-				microsec = (this.microsec_slider) ? this.control.value(this, this.microsec_slider, 'microsec') : false,
-				timezone = (this.timezone_select) ? this.timezone_select.val() : false,
-				o = this._defaults,
-				pickerTimeFormat = o.pickerTimeFormat || o.timeFormat,
-				pickerTimeSuffix = o.pickerTimeSuffix || o.timeSuffix;
-
-			if (typeof(hour) === 'object') {
-				hour = false;
-			}
-			if (typeof(minute) === 'object') {
-				minute = false;
-			}
-			if (typeof(second) === 'object') {
-				second = false;
-			}
-			if (typeof(millisec) === 'object') {
-				millisec = false;
-			}
-			if (typeof(microsec) === 'object') {
-				microsec = false;
-			}
-			if (typeof(timezone) === 'object') {
-				timezone = false;
-			}
-
-			if (hour !== false) {
-				hour = parseInt(hour, 10);
-			}
-			if (minute !== false) {
-				minute = parseInt(minute, 10);
-			}
-			if (second !== false) {
-				second = parseInt(second, 10);
-			}
-			if (millisec !== false) {
-				millisec = parseInt(millisec, 10);
-			}
-			if (microsec !== false) {
-				microsec = parseInt(microsec, 10);
-			}
-			if (timezone !== false) {
-				timezone = timezone.toString();
-			}
-
-			var ampm = o[hour < 12 ? 'amNames' : 'pmNames'][0];
-
-			// If the update was done in the input field, the input field should not be updated.
-			// If the update was done using the sliders, update the input field.
-			var hasChanged = (
-						hour !== parseInt(this.hour,10) || // sliders should all be numeric
-						minute !== parseInt(this.minute,10) || 
-						second !== parseInt(this.second,10) || 
-						millisec !== parseInt(this.millisec,10) || 
-						microsec !== parseInt(this.microsec,10) || 
-						(this.ampm.length > 0 && (hour < 12) !== ($.inArray(this.ampm.toUpperCase(), this.amNames) !== -1)) || 
-						(this.timezone !== null && timezone !== this.timezone.toString()) // could be numeric or "EST" format, so use toString()
-					);
-
-			if (hasChanged) {
-
-				if (hour !== false) {
-					this.hour = hour;
-				}
-				if (minute !== false) {
-					this.minute = minute;
-				}
-				if (second !== false) {
-					this.second = second;
-				}
-				if (millisec !== false) {
-					this.millisec = millisec;
-				}
-				if (microsec !== false) {
-					this.microsec = microsec;
-				}
-				if (timezone !== false) {
-					this.timezone = timezone;
-				}
-
-				if (!this.inst) {
-					this.inst = $.datepicker._getInst(this.$input[0]);
-				}
-
-				this._limitMinMaxDateTime(this.inst, true);
-			}
-			if (this.support.ampm) {
-				this.ampm = ampm;
-			}
-
-			// Updates the time within the timepicker
-			this.formattedTime = $.datepicker.formatTime(o.timeFormat, this, o);
-			if (this.$timeObj) {
-				var sPos = this.$timeObj[0].selectionStart;
-				var ePos = this.$timeObj[0].selectionEnd;
-				if (pickerTimeFormat === o.timeFormat) {
-					this.$timeObj.val(this.formattedTime + pickerTimeSuffix);
-				}
-				else {
-					this.$timeObj.val($.datepicker.formatTime(pickerTimeFormat, this, o) + pickerTimeSuffix);
-				}
-				//this.$timeObj[0].setSelectionRange(sPos, ePos);
-			}
-
-			this.timeDefined = true;
-			if (hasChanged) {
-				this._updateDateTime();
-				//this.$input.focus(); // may automatically open the picker on setDate
-			}
-		},
-
-		/*
-		* call custom onSelect.
-		* bind to sliders slidestop, and grid click.
-		*/
-		_onSelectHandler: function () {
-			var onSelect = this._defaults.onSelect || this.inst.settings.onSelect;
-			var inputEl = this.$input ? this.$input[0] : null;
-			if (onSelect && inputEl) {
-				onSelect.apply(inputEl, [this.formattedDateTime, this]);
-			}
-		},
-
-		/*
-		* update our input with the new date time..
-		*/
-		_updateDateTime: function (dp_inst) {
-			dp_inst = this.inst || dp_inst;
-			var dtTmp = (dp_inst.currentYear > 0? 
-							new Date(dp_inst.currentYear, dp_inst.currentMonth, dp_inst.currentDay) : 
-							new Date(dp_inst.selectedYear, dp_inst.selectedMonth, dp_inst.selectedDay)),
-				dt = $.datepicker._daylightSavingAdjust(dtTmp),
-				//dt = $.datepicker._daylightSavingAdjust(new Date(dp_inst.selectedYear, dp_inst.selectedMonth, dp_inst.selectedDay)),
-				//dt = $.datepicker._daylightSavingAdjust(new Date(dp_inst.currentYear, dp_inst.currentMonth, dp_inst.currentDay)),
-				dateFmt = $.datepicker._get(dp_inst, 'dateFormat'),
-				formatCfg = $.datepicker._getFormatConfig(dp_inst),
-				timeAvailable = dt !== null && this.timeDefined;
-			this.formattedDate = $.datepicker.formatDate(dateFmt, (dt === null ? new Date() : dt), formatCfg);
-			var formattedDateTime = this.formattedDate;
-			
-			// if a slider was changed but datepicker doesn't have a value yet, set it
-			if (dp_inst.lastVal === "") {
-                dp_inst.currentYear = dp_inst.selectedYear;
-                dp_inst.currentMonth = dp_inst.selectedMonth;
-                dp_inst.currentDay = dp_inst.selectedDay;
-            }
-
-			/*
-			* remove following lines to force every changes in date picker to change the input value
-			* Bug descriptions: when an input field has a default value, and click on the field to pop up the date picker. 
-			* If the user manually empty the value in the input field, the date picker will never change selected value.
-			*/
-			//if (dp_inst.lastVal !== undefined && (dp_inst.lastVal.length > 0 && this.$input.val().length === 0)) {
-			//	return;
-			//}
-
-			if (this._defaults.timeOnly === true && this._defaults.timeOnlyShowDate === false) {
-				formattedDateTime = this.formattedTime;
-			} else if ((this._defaults.timeOnly !== true && (this._defaults.alwaysSetTime || timeAvailable)) || (this._defaults.timeOnly === true && this._defaults.timeOnlyShowDate === true)) {
-				formattedDateTime += this._defaults.separator + this.formattedTime + this._defaults.timeSuffix;
-			}
-
-			this.formattedDateTime = formattedDateTime;
-
-			if (!this._defaults.showTimepicker) {
-				this.$input.val(this.formattedDate);
-			} else if (this.$altInput && this._defaults.timeOnly === false && this._defaults.altFieldTimeOnly === true) {
-				this.$altInput.val(this.formattedTime);
-				this.$input.val(this.formattedDate);
-			} else if (this.$altInput) {
-				this.$input.val(formattedDateTime);
-				var altFormattedDateTime = '',
-					altSeparator = this._defaults.altSeparator !== null ? this._defaults.altSeparator : this._defaults.separator,
-					altTimeSuffix = this._defaults.altTimeSuffix !== null ? this._defaults.altTimeSuffix : this._defaults.timeSuffix;
-				
-				if (!this._defaults.timeOnly) {
-					if (this._defaults.altFormat) {
-						altFormattedDateTime = $.datepicker.formatDate(this._defaults.altFormat, (dt === null ? new Date() : dt), formatCfg);
-					}
-					else {
-						altFormattedDateTime = this.formattedDate;
-					}
-
-					if (altFormattedDateTime) {
-						altFormattedDateTime += altSeparator;
-					}
-				}
-
-				if (this._defaults.altTimeFormat !== null) {
-					altFormattedDateTime += $.datepicker.formatTime(this._defaults.altTimeFormat, this, this._defaults) + altTimeSuffix;
-				}
-				else {
-					altFormattedDateTime += this.formattedTime + altTimeSuffix;
-				}
-				this.$altInput.val(altFormattedDateTime);
-			} else {
-				this.$input.val(formattedDateTime);
-			}
-
-			this.$input.trigger("change");
-		},
-
-		_onFocus: function () {
-			if (!this.$input.val() && this._defaults.defaultValue) {
-				this.$input.val(this._defaults.defaultValue);
-				var inst = $.datepicker._getInst(this.$input.get(0)),
-					tp_inst = $.datepicker._get(inst, 'timepicker');
-				if (tp_inst) {
-					if (tp_inst._defaults.timeOnly && (inst.input.val() !== inst.lastVal)) {
-						try {
-							$.datepicker._updateDatepicker(inst);
-						} catch (err) {
-							$.timepicker.log(err);
-						}
-					}
-				}
-			}
-		},
-
-		/*
-		* Small abstraction to control types
-		* We can add more, just be sure to follow the pattern: create, options, value
-		*/
-		_controls: {
-			// slider methods
-			slider: {
-				create: function (tp_inst, obj, unit, val, min, max, step) {
-					var rtl = tp_inst._defaults.isRTL; // if rtl go -60->0 instead of 0->60
-					return obj.prop('slide', null).slider({
-						orientation: "horizontal",
-						value: rtl ? val * -1 : val,
-						min: rtl ? max * -1 : min,
-						max: rtl ? min * -1 : max,
-						step: step,
-						slide: function (event, ui) {
-							tp_inst.control.value(tp_inst, $(this), unit, rtl ? ui.value * -1 : ui.value);
-							tp_inst._onTimeChange();
-						},
-						stop: function (event, ui) {
-							tp_inst._onSelectHandler();
-						}
-					});	
-				},
-				options: function (tp_inst, obj, unit, opts, val) {
-					if (tp_inst._defaults.isRTL) {
-						if (typeof(opts) === 'string') {
-							if (opts === 'min' || opts === 'max') {
-								if (val !== undefined) {
-									return obj.slider(opts, val * -1);
-								}
-								return Math.abs(obj.slider(opts));
-							}
-							return obj.slider(opts);
-						}
-						var min = opts.min, 
-							max = opts.max;
-						opts.min = opts.max = null;
-						if (min !== undefined) {
-							opts.max = min * -1;
-						}
-						if (max !== undefined) {
-							opts.min = max * -1;
-						}
-						return obj.slider(opts);
-					}
-					if (typeof(opts) === 'string' && val !== undefined) {
-						return obj.slider(opts, val);
-					}
-					return obj.slider(opts);
-				},
-				value: function (tp_inst, obj, unit, val) {
-					if (tp_inst._defaults.isRTL) {
-						if (val !== undefined) {
-							return obj.slider('value', val * -1);
-						}
-						return Math.abs(obj.slider('value'));
-					}
-					if (val !== undefined) {
-						return obj.slider('value', val);
-					}
-					return obj.slider('value');
-				}
-			},
-			// select methods
-			select: {
-				create: function (tp_inst, obj, unit, val, min, max, step) {
-					var sel = '<select class="ui-timepicker-select ui-state-default ui-corner-all" data-unit="' + unit + '" data-min="' + min + '" data-max="' + max + '" data-step="' + step + '">',
-						format = tp_inst._defaults.pickerTimeFormat || tp_inst._defaults.timeFormat;
-
-					for (var i = min; i <= max; i += step) {
-						sel += '<option value="' + i + '"' + (i === val ? ' selected' : '') + '>';
-						if (unit === 'hour') {
-							sel += $.datepicker.formatTime($.trim(format.replace(/[^ht ]/ig, '')), {hour: i}, tp_inst._defaults);
-						}
-						else if (unit === 'millisec' || unit === 'microsec' || i >= 10) { sel += i; }
-						else {sel += '0' + i.toString(); }
-						sel += '</option>';
-					}
-					sel += '</select>';
-
-					obj.children('select').remove();
-
-					$(sel).appendTo(obj).change(function (e) {
-						tp_inst._onTimeChange();
-						tp_inst._onSelectHandler();
-						tp_inst._afterInject();
-					});
-
-					return obj;
-				},
-				options: function (tp_inst, obj, unit, opts, val) {
-					var o = {},
-						$t = obj.children('select');
-					if (typeof(opts) === 'string') {
-						if (val === undefined) {
-							return $t.data(opts);
-						}
-						o[opts] = val;	
-					}
-					else { o = opts; }
-					return tp_inst.control.create(tp_inst, obj, $t.data('unit'), $t.val(), o.min>=0 ? o.min : $t.data('min'), o.max || $t.data('max'), o.step || $t.data('step'));
-				},
-				value: function (tp_inst, obj, unit, val) {
-					var $t = obj.children('select');
-					if (val !== undefined) {
-						return $t.val(val);
-					}
-					return $t.val();
-				}
-			}
-		} // end _controls
-
-	});
-
-	$.fn.extend({
-		/*
-		* shorthand just to use timepicker.
-		*/
-		timepicker: function (o) {
-			o = o || {};
-			var tmp_args = Array.prototype.slice.call(arguments);
-
-			if (typeof o === 'object') {
-				tmp_args[0] = $.extend(o, {
-					timeOnly: true
-				});
-			}
-
-			return $(this).each(function () {
-				$.fn.datetimepicker.apply($(this), tmp_args);
-			});
-		},
-
-		/*
-		* extend timepicker to datepicker
-		*/
-		datetimepicker: function (o) {
-			o = o || {};
-			var tmp_args = arguments;
-
-			if (typeof(o) === 'string') {
-				if (o === 'getDate'  || (o === 'option' && tmp_args.length === 2 && typeof (tmp_args[1]) === 'string')) {
-					return $.fn.datepicker.apply($(this[0]), tmp_args);
-				} else {
-					return this.each(function () {
-						var $t = $(this);
-						$t.datepicker.apply($t, tmp_args);
-					});
-				}
-			} else {
-				return this.each(function () {
-					var $t = $(this);
-					$t.datepicker($.timepicker._newInst($t, o)._defaults);
-				});
-			}
-		}
-	});
-
-	/*
-	* Public Utility to parse date and time
-	*/
-	$.datepicker.parseDateTime = function (dateFormat, timeFormat, dateTimeString, dateSettings, timeSettings) {
-		var parseRes = parseDateTimeInternal(dateFormat, timeFormat, dateTimeString, dateSettings, timeSettings);
-		if (parseRes.timeObj) {
-			var t = parseRes.timeObj;
-			parseRes.date.setHours(t.hour, t.minute, t.second, t.millisec);
-			parseRes.date.setMicroseconds(t.microsec);
-		}
-
-		return parseRes.date;
-	};
-
-	/*
-	* Public utility to parse time
-	*/
-	$.datepicker.parseTime = function (timeFormat, timeString, options) {
-		var o = extendRemove(extendRemove({}, $.timepicker._defaults), options || {}),
-			iso8601 = (timeFormat.replace(/\'.*?\'/g, '').indexOf('Z') !== -1);
-
-		// Strict parse requires the timeString to match the timeFormat exactly
-		var strictParse = function (f, s, o) {
-
-			// pattern for standard and localized AM/PM markers
-			var getPatternAmpm = function (amNames, pmNames) {
-				var markers = [];
-				if (amNames) {
-					$.merge(markers, amNames);
-				}
-				if (pmNames) {
-					$.merge(markers, pmNames);
-				}
-				markers = $.map(markers, function (val) {
-					return val.replace(/[.*+?|()\[\]{}\\]/g, '\\$&');
-				});
-				return '(' + markers.join('|') + ')?';
-			};
-
-			// figure out position of time elements.. cause js cant do named captures
-			var getFormatPositions = function (timeFormat) {
-				var finds = timeFormat.toLowerCase().match(/(h{1,2}|m{1,2}|s{1,2}|l{1}|c{1}|t{1,2}|z|'.*?')/g),
-					orders = {
-						h: -1,
-						m: -1,
-						s: -1,
-						l: -1,
-						c: -1,
-						t: -1,
-						z: -1
-					};
-
-				if (finds) {
-					for (var i = 0; i < finds.length; i++) {
-						if (orders[finds[i].toString().charAt(0)] === -1) {
-							orders[finds[i].toString().charAt(0)] = i + 1;
-						}
-					}
-				}
-				return orders;
-			};
-
-			var regstr = '^' + f.toString()
-					.replace(/([hH]{1,2}|mm?|ss?|[tT]{1,2}|[zZ]|[lc]|'.*?')/g, function (match) {
-							var ml = match.length;
-							switch (match.charAt(0).toLowerCase()) {
-							case 'h':
-								return ml === 1 ? '(\\d?\\d)' : '(\\d{' + ml + '})';
-							case 'm':
-								return ml === 1 ? '(\\d?\\d)' : '(\\d{' + ml + '})';
-							case 's':
-								return ml === 1 ? '(\\d?\\d)' : '(\\d{' + ml + '})';
-							case 'l':
-								return '(\\d?\\d?\\d)';
-							case 'c':
-								return '(\\d?\\d?\\d)';
-							case 'z':
-								return '(z|[-+]\\d\\d:?\\d\\d|\\S+)?';
-							case 't':
-								return getPatternAmpm(o.amNames, o.pmNames);
-							default:    // literal escaped in quotes
-								return '(' + match.replace(/\'/g, "").replace(/(\.|\$|\^|\\|\/|\(|\)|\[|\]|\?|\+|\*)/g, function (m) { return "\\" + m; }) + ')?';
-							}
-						})
-					.replace(/\s/g, '\\s?') +
-					o.timeSuffix + '$',
-				order = getFormatPositions(f),
-				ampm = '',
-				treg;
-
-			treg = s.match(new RegExp(regstr, 'i'));
-
-			var resTime = {
-				hour: 0,
-				minute: 0,
-				second: 0,
-				millisec: 0,
-				microsec: 0
-			};
-
-			if (treg) {
-				if (order.t !== -1) {
-					if (treg[order.t] === undefined || treg[order.t].length === 0) {
-						ampm = '';
-						resTime.ampm = '';
-					} else {
-						ampm = $.inArray(treg[order.t].toUpperCase(), $.map(o.amNames, function (x,i) { return x.toUpperCase(); })) !== -1 ? 'AM' : 'PM';
-						resTime.ampm = o[ampm === 'AM' ? 'amNames' : 'pmNames'][0];
-					}
-				}
-
-				if (order.h !== -1) {
-					if (ampm === 'AM' && treg[order.h] === '12') {
-						resTime.hour = 0; // 12am = 0 hour
-					} else {
-						if (ampm === 'PM' && treg[order.h] !== '12') {
-							resTime.hour = parseInt(treg[order.h], 10) + 12; // 12pm = 12 hour, any other pm = hour + 12
-						} else {
-							resTime.hour = Number(treg[order.h]);
-						}
-					}
-				}
-
-				if (order.m !== -1) {
-					resTime.minute = Number(treg[order.m]);
-				}
-				if (order.s !== -1) {
-					resTime.second = Number(treg[order.s]);
-				}
-				if (order.l !== -1) {
-					resTime.millisec = Number(treg[order.l]);
-				}
-				if (order.c !== -1) {
-					resTime.microsec = Number(treg[order.c]);
-				}
-				if (order.z !== -1 && treg[order.z] !== undefined) {
-					resTime.timezone = $.timepicker.timezoneOffsetNumber(treg[order.z]);
-				}
-
-
-				return resTime;
-			}
-			return false;
-		};// end strictParse
-
-		// First try JS Date, if that fails, use strictParse
-		var looseParse = function (f, s, o) {
-			try {
-				var d = new Date('2012-01-01 ' + s);
-				if (isNaN(d.getTime())) {
-					d = new Date('2012-01-01T' + s);
-					if (isNaN(d.getTime())) {
-						d = new Date('01/01/2012 ' + s);
-						if (isNaN(d.getTime())) {
-							throw "Unable to parse time with native Date: " + s;
-						}
-					}
-				}
-
-				return {
-					hour: d.getHours(),
-					minute: d.getMinutes(),
-					second: d.getSeconds(),
-					millisec: d.getMilliseconds(),
-					microsec: d.getMicroseconds(),
-					timezone: d.getTimezoneOffset() * -1
-				};
-			}
-			catch (err) {
-				try {
-					return strictParse(f, s, o);
-				}
-				catch (err2) {
-					$.timepicker.log("Unable to parse \ntimeString: " + s + "\ntimeFormat: " + f);
-				}				
-			}
-			return false;
-		}; // end looseParse
-		
-		if (typeof o.parse === "function") {
-			return o.parse(timeFormat, timeString, o);
-		}
-		if (o.parse === 'loose') {
-			return looseParse(timeFormat, timeString, o);
-		}
-		return strictParse(timeFormat, timeString, o);
-	};
-
-	/**
-	 * Public utility to format the time
-	 * @param {string} format format of the time
-	 * @param {Object} time Object not a Date for timezones
-	 * @param {Object} [options] essentially the regional[].. amNames, pmNames, ampm
-	 * @returns {string} the formatted time
-	 */
-	$.datepicker.formatTime = function (format, time, options) {
-		options = options || {};
-		options = $.extend({}, $.timepicker._defaults, options);
-		time = $.extend({
-			hour: 0,
-			minute: 0,
-			second: 0,
-			millisec: 0,
-			microsec: 0,
-			timezone: null
-		}, time);
-
-		var tmptime = format,
-			ampmName = options.amNames[0],
-			hour = parseInt(time.hour, 10);
-
-		if (hour > 11) {
-			ampmName = options.pmNames[0];
-		}
-
-		tmptime = tmptime.replace(/(?:HH?|hh?|mm?|ss?|[tT]{1,2}|[zZ]|[lc]|'.*?')/g, function (match) {
-			switch (match) {
-			case 'HH':
-				return ('0' + hour).slice(-2);
-			case 'H':
-				return hour;
-			case 'hh':
-				return ('0' + convert24to12(hour)).slice(-2);
-			case 'h':
-				return convert24to12(hour);
-			case 'mm':
-				return ('0' + time.minute).slice(-2);
-			case 'm':
-				return time.minute;
-			case 'ss':
-				return ('0' + time.second).slice(-2);
-			case 's':
-				return time.second;
-			case 'l':
-				return ('00' + time.millisec).slice(-3);
-			case 'c':
-				return ('00' + time.microsec).slice(-3);
-			case 'z':
-				return $.timepicker.timezoneOffsetString(time.timezone === null ? options.timezone : time.timezone, false);
-			case 'Z':
-				return $.timepicker.timezoneOffsetString(time.timezone === null ? options.timezone : time.timezone, true);
-			case 'T':
-				return ampmName.charAt(0).toUpperCase();
-			case 'TT':
-				return ampmName.toUpperCase();
-			case 't':
-				return ampmName.charAt(0).toLowerCase();
-			case 'tt':
-				return ampmName.toLowerCase();
-			default:
-				return match.replace(/'/g, "");
-			}
-		});
-
-		return tmptime;
-	};
-
-	/*
-	* the bad hack :/ override datepicker so it doesn't close on select
-	// inspired: http://stackoverflow.com/questions/1252512/jquery-datepicker-prevent-closing-picker-when-clicking-a-date/1762378#1762378
-	*/
-	$.datepicker._base_selectDate = $.datepicker._selectDate;
-	$.datepicker._selectDate = function (id, dateStr) {
-		var inst = this._getInst($(id)[0]),
-			tp_inst = this._get(inst, 'timepicker'),
-			was_inline;
-
-		if (tp_inst && inst.settings.showTimepicker) {
-			tp_inst._limitMinMaxDateTime(inst, true);
-			was_inline = inst.inline;
-			inst.inline = inst.stay_open = true;
-			//This way the onSelect handler called from calendarpicker get the full dateTime
-			this._base_selectDate(id, dateStr);
-			inst.inline = was_inline;
-			inst.stay_open = false;
-			this._notifyChange(inst);
-			this._updateDatepicker(inst);
-		} else {
-			this._base_selectDate(id, dateStr);
-		}
-	};
-
-	/*
-	* second bad hack :/ override datepicker so it triggers an event when changing the input field
-	* and does not redraw the datepicker on every selectDate event
-	*/
-	$.datepicker._base_updateDatepicker = $.datepicker._updateDatepicker;
-	$.datepicker._updateDatepicker = function (inst) {
-
-		// don't popup the datepicker if there is another instance already opened
-		var input = inst.input[0];
-		if ($.datepicker._curInst && $.datepicker._curInst !== inst && $.datepicker._datepickerShowing && $.datepicker._lastInput !== input) {
-			return;
-		}
-
-		if (typeof(inst.stay_open) !== 'boolean' || inst.stay_open === false) {
-
-			this._base_updateDatepicker(inst);
-
-			// Reload the time control when changing something in the input text field.
-			var tp_inst = this._get(inst, 'timepicker');
-			if (tp_inst) {
-				tp_inst._addTimePicker(inst);
-			}
-		}
-	};
-
-	/*
-	* third bad hack :/ override datepicker so it allows spaces and colon in the input field
-	*/
-	$.datepicker._base_doKeyPress = $.datepicker._doKeyPress;
-	$.datepicker._doKeyPress = function (event) {
-		var inst = $.datepicker._getInst(event.target),
-			tp_inst = $.datepicker._get(inst, 'timepicker');
-
-		if (tp_inst) {
-			if ($.datepicker._get(inst, 'constrainInput')) {
-				var ampm = tp_inst.support.ampm,
-					tz = tp_inst._defaults.showTimezone !== null ? tp_inst._defaults.showTimezone : tp_inst.support.timezone,
-					dateChars = $.datepicker._possibleChars($.datepicker._get(inst, 'dateFormat')),
-					datetimeChars = tp_inst._defaults.timeFormat.toString()
-											.replace(/[hms]/g, '')
-											.replace(/TT/g, ampm ? 'APM' : '')
-											.replace(/Tt/g, ampm ? 'AaPpMm' : '')
-											.replace(/tT/g, ampm ? 'AaPpMm' : '')
-											.replace(/T/g, ampm ? 'AP' : '')
-											.replace(/tt/g, ampm ? 'apm' : '')
-											.replace(/t/g, ampm ? 'ap' : '') + 
-											" " + tp_inst._defaults.separator + 
-											tp_inst._defaults.timeSuffix + 
-											(tz ? tp_inst._defaults.timezoneList.join('') : '') + 
-											(tp_inst._defaults.amNames.join('')) + (tp_inst._defaults.pmNames.join('')) + 
-											dateChars,
-					chr = String.fromCharCode(event.charCode === undefined ? event.keyCode : event.charCode);
-				return event.ctrlKey || (chr < ' ' || !dateChars || datetimeChars.indexOf(chr) > -1);
-			}
-		}
-
-		return $.datepicker._base_doKeyPress(event);
-	};
-
-	/*
-	* Fourth bad hack :/ override _updateAlternate function used in inline mode to init altField
-	* Update any alternate field to synchronise with the main field.
-	*/
-	$.datepicker._base_updateAlternate = $.datepicker._updateAlternate;
-	$.datepicker._updateAlternate = function (inst) {
-		var tp_inst = this._get(inst, 'timepicker');
-		if (tp_inst) {
-			var altField = tp_inst._defaults.altField;
-			if (altField) { // update alternate field too
-				var altFormat = tp_inst._defaults.altFormat || tp_inst._defaults.dateFormat,
-					date = this._getDate(inst),
-					formatCfg = $.datepicker._getFormatConfig(inst),
-					altFormattedDateTime = '', 
-					altSeparator = tp_inst._defaults.altSeparator ? tp_inst._defaults.altSeparator : tp_inst._defaults.separator, 
-					altTimeSuffix = tp_inst._defaults.altTimeSuffix ? tp_inst._defaults.altTimeSuffix : tp_inst._defaults.timeSuffix,
-					altTimeFormat = tp_inst._defaults.altTimeFormat !== null ? tp_inst._defaults.altTimeFormat : tp_inst._defaults.timeFormat;
-				
-				altFormattedDateTime += $.datepicker.formatTime(altTimeFormat, tp_inst, tp_inst._defaults) + altTimeSuffix;
-				if (!tp_inst._defaults.timeOnly && !tp_inst._defaults.altFieldTimeOnly && date !== null) {
-					if (tp_inst._defaults.altFormat) {
-						altFormattedDateTime = $.datepicker.formatDate(tp_inst._defaults.altFormat, date, formatCfg) + altSeparator + altFormattedDateTime;
-					}
-					else {
-						altFormattedDateTime = tp_inst.formattedDate + altSeparator + altFormattedDateTime;
-					}
-				}
-				$(altField).val( inst.input.val() ? altFormattedDateTime : "");
-			}
-		}
-		else {
-			$.datepicker._base_updateAlternate(inst);	
-		}
-	};
-
-	/*
-	* Override key up event to sync manual input changes.
-	*/
-	$.datepicker._base_doKeyUp = $.datepicker._doKeyUp;
-	$.datepicker._doKeyUp = function (event) {
-		var inst = $.datepicker._getInst(event.target),
-			tp_inst = $.datepicker._get(inst, 'timepicker');
-
-		if (tp_inst) {
-			if (tp_inst._defaults.timeOnly && (inst.input.val() !== inst.lastVal)) {
-				try {
-					$.datepicker._updateDatepicker(inst);
-				} catch (err) {
-					$.timepicker.log(err);
-				}
-			}
-		}
-
-		return $.datepicker._base_doKeyUp(event);
-	};
-
-	/*
-	* override "Today" button to also grab the time and set it to input field.
-	*/
-	$.datepicker._base_gotoToday = $.datepicker._gotoToday;
-	$.datepicker._gotoToday = function (id) {
-		var inst = this._getInst($(id)[0]);
-		this._base_gotoToday(id);
-		var tp_inst = this._get(inst, 'timepicker');
-		var tzoffset = $.timepicker.timezoneOffsetNumber(tp_inst.timezone);
-		var now = new Date();
-		now.setMinutes(now.getMinutes() + now.getTimezoneOffset() + tzoffset);
-		this._setTime(inst, now);
-		this._setDate(inst, now);
-		tp_inst._onSelectHandler();
-	};
-
-	/*
-	* Disable & enable the Time in the datetimepicker
-	*/
-	$.datepicker._disableTimepickerDatepicker = function (target) {
-		var inst = this._getInst(target);
-		if (!inst) {
-			return;
-		}
-
-		var tp_inst = this._get(inst, 'timepicker');
-		$(target).datepicker('getDate'); // Init selected[Year|Month|Day]
-		if (tp_inst) {
-			inst.settings.showTimepicker = false;
-			tp_inst._defaults.showTimepicker = false;
-			tp_inst._updateDateTime(inst);
-		}
-	};
-
-	$.datepicker._enableTimepickerDatepicker = function (target) {
-		var inst = this._getInst(target);
-		if (!inst) {
-			return;
-		}
-
-		var tp_inst = this._get(inst, 'timepicker');
-		$(target).datepicker('getDate'); // Init selected[Year|Month|Day]
-		if (tp_inst) {
-			inst.settings.showTimepicker = true;
-			tp_inst._defaults.showTimepicker = true;
-			tp_inst._addTimePicker(inst); // Could be disabled on page load
-			tp_inst._updateDateTime(inst);
-		}
-	};
-
-	/*
-	* Create our own set time function
-	*/
-	$.datepicker._setTime = function (inst, date) {
-		var tp_inst = this._get(inst, 'timepicker');
-		if (tp_inst) {
-			var defaults = tp_inst._defaults;
-
-			// calling _setTime with no date sets time to defaults
-			tp_inst.hour = date ? date.getHours() : defaults.hour;
-			tp_inst.minute = date ? date.getMinutes() : defaults.minute;
-			tp_inst.second = date ? date.getSeconds() : defaults.second;
-			tp_inst.millisec = date ? date.getMilliseconds() : defaults.millisec;
-			tp_inst.microsec = date ? date.getMicroseconds() : defaults.microsec;
-
-			//check if within min/max times.. 
-			tp_inst._limitMinMaxDateTime(inst, true);
-
-			tp_inst._onTimeChange();
-			tp_inst._updateDateTime(inst);
-		}
-	};
-
-	/*
-	* Create new public method to set only time, callable as $().datepicker('setTime', date)
-	*/
-	$.datepicker._setTimeDatepicker = function (target, date, withDate) {
-		var inst = this._getInst(target);
-		if (!inst) {
-			return;
-		}
-
-		var tp_inst = this._get(inst, 'timepicker');
-
-		if (tp_inst) {
-			this._setDateFromField(inst);
-			var tp_date;
-			if (date) {
-				if (typeof date === "string") {
-					tp_inst._parseTime(date, withDate);
-					tp_date = new Date();
-					tp_date.setHours(tp_inst.hour, tp_inst.minute, tp_inst.second, tp_inst.millisec);
-					tp_date.setMicroseconds(tp_inst.microsec);
-				} else {
-					tp_date = new Date(date.getTime());
-					tp_date.setMicroseconds(date.getMicroseconds());
-				}
-				if (tp_date.toString() === 'Invalid Date') {
-					tp_date = undefined;
-				}
-				this._setTime(inst, tp_date);
-			}
-		}
-
-	};
-
-	/*
-	* override setDate() to allow setting time too within Date object
-	*/
-	$.datepicker._base_setDateDatepicker = $.datepicker._setDateDatepicker;
-	$.datepicker._setDateDatepicker = function (target, _date) {
-		var inst = this._getInst(target);
-		var date = _date;
-		if (!inst) {
-			return;
-		}
-
-		if (typeof(_date) === 'string') {
-			date = new Date(_date);
-			if (!date.getTime()) {
-				this._base_setDateDatepicker.apply(this, arguments);
-				date = $(target).datepicker('getDate');
-			}
-		}
-
-		var tp_inst = this._get(inst, 'timepicker');
-		var tp_date;
-		if (date instanceof Date) {
-			tp_date = new Date(date.getTime());
-			tp_date.setMicroseconds(date.getMicroseconds());
-		} else {
-			tp_date = date;
-		}
-		
-		// This is important if you are using the timezone option, javascript's Date 
-		// object will only return the timezone offset for the current locale, so we 
-		// adjust it accordingly.  If not using timezone option this won't matter..
-		// If a timezone is different in tp, keep the timezone as is
-		if (tp_inst && tp_date) {
-			// look out for DST if tz wasn't specified
-			if (!tp_inst.support.timezone && tp_inst._defaults.timezone === null) {
-				tp_inst.timezone = tp_date.getTimezoneOffset() * -1;
-			}
-			date = $.timepicker.timezoneAdjust(date, tp_inst.timezone);
-			tp_date = $.timepicker.timezoneAdjust(tp_date, tp_inst.timezone);
-		}
-
-		this._updateDatepicker(inst);
-		this._base_setDateDatepicker.apply(this, arguments);
-		this._setTimeDatepicker(target, tp_date, true);
-	};
-
-	/*
-	* override getDate() to allow getting time too within Date object
-	*/
-	$.datepicker._base_getDateDatepicker = $.datepicker._getDateDatepicker;
-	$.datepicker._getDateDatepicker = function (target, noDefault) {
-		var inst = this._getInst(target);
-		if (!inst) {
-			return;
-		}
-
-		var tp_inst = this._get(inst, 'timepicker');
-
-		if (tp_inst) {
-			// if it hasn't yet been defined, grab from field
-			if (inst.lastVal === undefined) {
-				this._setDateFromField(inst, noDefault);
-			}
-
-			var date = this._getDate(inst);
-			var currDT = $.trim((tp_inst.$altInput && tp_inst._defaults.altFieldTimeOnly) ? tp_inst.$input.val() + ' ' + tp_inst.$altInput.val() : tp_inst.$input.val());
-			if (date && tp_inst._parseTime(currDT, !inst.settings.timeOnly)) {
-				date.setHours(tp_inst.hour, tp_inst.minute, tp_inst.second, tp_inst.millisec);
-				date.setMicroseconds(tp_inst.microsec);
-
-				// This is important if you are using the timezone option, javascript's Date 
-				// object will only return the timezone offset for the current locale, so we 
-				// adjust it accordingly.  If not using timezone option this won't matter..
-				if (tp_inst.timezone != null) {
-					// look out for DST if tz wasn't specified
-					if (!tp_inst.support.timezone && tp_inst._defaults.timezone === null) {
-						tp_inst.timezone = date.getTimezoneOffset() * -1;
-					}
-					date = $.timepicker.timezoneAdjust(date, tp_inst.timezone);
-				}
-			}
-			return date;
-		}
-		return this._base_getDateDatepicker(target, noDefault);
-	};
-
-	/*
-	* override parseDate() because UI 1.8.14 throws an error about "Extra characters"
-	* An option in datapicker to ignore extra format characters would be nicer.
-	*/
-	$.datepicker._base_parseDate = $.datepicker.parseDate;
-	$.datepicker.parseDate = function (format, value, settings) {
-		var date;
-		try {
-			date = this._base_parseDate(format, value, settings);
-		} catch (err) {
-			// Hack!  The error message ends with a colon, a space, and
-			// the "extra" characters.  We rely on that instead of
-			// attempting to perfectly reproduce the parsing algorithm.
-			if (err.indexOf(":") >= 0) {
-				date = this._base_parseDate(format, value.substring(0, value.length - (err.length - err.indexOf(':') - 2)), settings);
-				$.timepicker.log("Error parsing the date string: " + err + "\ndate string = " + value + "\ndate format = " + format);
-			} else {
-				throw err;
-			}
-		}
-		return date;
-	};
-
-	/*
-	* override formatDate to set date with time to the input
-	*/
-	$.datepicker._base_formatDate = $.datepicker._formatDate;
-	$.datepicker._formatDate = function (inst, day, month, year) {
-		var tp_inst = this._get(inst, 'timepicker');
-		if (tp_inst) {
-			tp_inst._updateDateTime(inst);
-			return tp_inst.$input.val();
-		}
-		return this._base_formatDate(inst);
-	};
-
-	/*
-	* override options setter to add time to maxDate(Time) and minDate(Time). MaxDate
-	*/
-	$.datepicker._base_optionDatepicker = $.datepicker._optionDatepicker;
-	$.datepicker._optionDatepicker = function (target, name, value) {
-		var inst = this._getInst(target),
-			name_clone;
-		if (!inst) {
-			return null;
-		}
-
-		var tp_inst = this._get(inst, 'timepicker');
-		if (tp_inst) {
-			var min = null,
-				max = null,
-				onselect = null,
-				overrides = tp_inst._defaults.evnts,
-				fns = {},
-				prop,
-				ret,
-				oldVal,
-				$target;
-			if (typeof name === 'string') { // if min/max was set with the string
-				if (name === 'minDate' || name === 'minDateTime') {
-					min = value;
-				} else if (name === 'maxDate' || name === 'maxDateTime') {
-					max = value;
-				} else if (name === 'onSelect') {
-					onselect = value;
-				} else if (overrides.hasOwnProperty(name)) {
-					if (typeof (value) === 'undefined') {
-						return overrides[name];
-					}
-					fns[name] = value;
-					name_clone = {}; //empty results in exiting function after overrides updated
-				}
-			} else if (typeof name === 'object') { //if min/max was set with the JSON
-				if (name.minDate) {
-					min = name.minDate;
-				} else if (name.minDateTime) {
-					min = name.minDateTime;
-				} else if (name.maxDate) {
-					max = name.maxDate;
-				} else if (name.maxDateTime) {
-					max = name.maxDateTime;
-				}
-				for (prop in overrides) {
-					if (overrides.hasOwnProperty(prop) && name[prop]) {
-						fns[prop] = name[prop];
-					}
-				}
-			}
-			for (prop in fns) {
-				if (fns.hasOwnProperty(prop)) {
-					overrides[prop] = fns[prop];
-					if (!name_clone) { name_clone = $.extend({}, name); }
-					delete name_clone[prop];
-				}
-			}
-			if (name_clone && isEmptyObject(name_clone)) { return; }
-			if (min) { //if min was set
-				if (min === 0) {
-					min = new Date();
-				} else {
-					min = new Date(min);
-				}
-				tp_inst._defaults.minDate = min;
-				tp_inst._defaults.minDateTime = min;
-			} else if (max) { //if max was set
-				if (max === 0) {
-					max = new Date();
-				} else {
-					max = new Date(max);
-				}
-				tp_inst._defaults.maxDate = max;
-				tp_inst._defaults.maxDateTime = max;
-			} else if (onselect) {
-				tp_inst._defaults.onSelect = onselect;
-			}
-
-			// Datepicker will override our date when we call _base_optionDatepicker when 
-			// calling minDate/maxDate, so we will first grab the value, call 
-			// _base_optionDatepicker, then set our value back.
-			if(min || max){
-				$target = $(target);
-				oldVal = $target.datetimepicker('getDate');
-				ret = this._base_optionDatepicker.call($.datepicker, target, name_clone || name, value);
-				$target.datetimepicker('setDate', oldVal);
-				return ret;
-			}
-		}
-		if (value === undefined) {
-			return this._base_optionDatepicker.call($.datepicker, target, name);
-		}
-		return this._base_optionDatepicker.call($.datepicker, target, name_clone || name, value);
-	};
-	
-	/*
-	* jQuery isEmptyObject does not check hasOwnProperty - if someone has added to the object prototype,
-	* it will return false for all objects
-	*/
-	var isEmptyObject = function (obj) {
-		var prop;
-		for (prop in obj) {
-			if (obj.hasOwnProperty(prop)) {
-				return false;
-			}
-		}
-		return true;
-	};
-
-	/*
-	* jQuery extend now ignores nulls!
-	*/
-	var extendRemove = function (target, props) {
-		$.extend(target, props);
-		for (var name in props) {
-			if (props[name] === null || props[name] === undefined) {
-				target[name] = props[name];
-			}
-		}
-		return target;
-	};
-
-	/*
-	* Determine by the time format which units are supported
-	* Returns an object of booleans for each unit
-	*/
-	var detectSupport = function (timeFormat) {
-		var tf = timeFormat.replace(/'.*?'/g, '').toLowerCase(), // removes literals
-			isIn = function (f, t) { // does the format contain the token?
-					return f.indexOf(t) !== -1 ? true : false;
-				};
-		return {
-				hour: isIn(tf, 'h'),
-				minute: isIn(tf, 'm'),
-				second: isIn(tf, 's'),
-				millisec: isIn(tf, 'l'),
-				microsec: isIn(tf, 'c'),
-				timezone: isIn(tf, 'z'),
-				ampm: isIn(tf, 't') && isIn(timeFormat, 'h'),
-				iso8601: isIn(timeFormat, 'Z')
-			};
-	};
-
-	/*
-	* Converts 24 hour format into 12 hour
-	* Returns 12 hour without leading 0
-	*/
-	var convert24to12 = function (hour) {
-		hour %= 12;
-
-		if (hour === 0) {
-			hour = 12;
-		}
-
-		return String(hour);
-	};
-
-	var computeEffectiveSetting = function (settings, property) {
-		return settings && settings[property] ? settings[property] : $.timepicker._defaults[property];
-	};
-
-	/*
-	* Splits datetime string into date and time substrings.
-	* Throws exception when date can't be parsed
-	* Returns {dateString: dateString, timeString: timeString}
-	*/
-	var splitDateTime = function (dateTimeString, timeSettings) {
-		// The idea is to get the number separator occurrences in datetime and the time format requested (since time has
-		// fewer unknowns, mostly numbers and am/pm). We will use the time pattern to split.
-		var separator = computeEffectiveSetting(timeSettings, 'separator'),
-			format = computeEffectiveSetting(timeSettings, 'timeFormat'),
-			timeParts = format.split(separator), // how many occurrences of separator may be in our format?
-			timePartsLen = timeParts.length,
-			allParts = dateTimeString.split(separator),
-			allPartsLen = allParts.length;
-
-		if (allPartsLen > 1) {
-			return {
-				dateString: allParts.splice(0, allPartsLen - timePartsLen).join(separator),
-				timeString: allParts.splice(0, timePartsLen).join(separator)
-			};
-		}
-
-		return {
-			dateString: dateTimeString,
-			timeString: ''
-		};
-	};
-
-	/*
-	* Internal function to parse datetime interval
-	* Returns: {date: Date, timeObj: Object}, where
-	*   date - parsed date without time (type Date)
-	*   timeObj = {hour: , minute: , second: , millisec: , microsec: } - parsed time. Optional
-	*/
-	var parseDateTimeInternal = function (dateFormat, timeFormat, dateTimeString, dateSettings, timeSettings) {
-		var date,
-			parts,
-			parsedTime;
-
-		parts = splitDateTime(dateTimeString, timeSettings);
-		date = $.datepicker._base_parseDate(dateFormat, parts.dateString, dateSettings);
-
-		if (parts.timeString === '') {
-			return {
-				date: date
-			};
-		}
-
-		parsedTime = $.datepicker.parseTime(timeFormat, parts.timeString, timeSettings);
-
-		if (!parsedTime) {
-			throw 'Wrong time format';
-		}
-
-		return {
-			date: date,
-			timeObj: parsedTime
-		};
-	};
-
-	/*
-	* Internal function to set timezone_select to the local timezone
-	*/
-	var selectLocalTimezone = function (tp_inst, date) {
-		if (tp_inst && tp_inst.timezone_select) {
-			var now = date || new Date();
-			tp_inst.timezone_select.val(-now.getTimezoneOffset());
-		}
-	};
-
-	/*
-	* Create a Singleton Instance
-	*/
-	$.timepicker = new Timepicker();
-
-	/**
-	 * Get the timezone offset as string from a date object (eg '+0530' for UTC+5.5)
-	 * @param {number} tzMinutes if not a number, less than -720 (-1200), or greater than 840 (+1400) this value is returned
-	 * @param {boolean} iso8601 if true formats in accordance to iso8601 "+12:45"
-	 * @return {string}
-	 */
-	$.timepicker.timezoneOffsetString = function (tzMinutes, iso8601) {
-		if (isNaN(tzMinutes) || tzMinutes > 840 || tzMinutes < -720) {
-			return tzMinutes;
-		}
-
-		var off = tzMinutes,
-			minutes = off % 60,
-			hours = (off - minutes) / 60,
-			iso = iso8601 ? ':' : '',
-			tz = (off >= 0 ? '+' : '-') + ('0' + Math.abs(hours)).slice(-2) + iso + ('0' + Math.abs(minutes)).slice(-2);
-		
-		if (tz === '+00:00') {
-			return 'Z';
-		}
-		return tz;
-	};
-
-	/**
-	 * Get the number in minutes that represents a timezone string
-	 * @param  {string} tzString formatted like "+0500", "-1245", "Z"
-	 * @return {number} the offset minutes or the original string if it doesn't match expectations
-	 */
-	$.timepicker.timezoneOffsetNumber = function (tzString) {
-		var normalized = tzString.toString().replace(':', ''); // excuse any iso8601, end up with "+1245"
-
-		if (normalized.toUpperCase() === 'Z') { // if iso8601 with Z, its 0 minute offset
-			return 0;
-		}
-
-		if (!/^(\-|\+)\d{4}$/.test(normalized)) { // possibly a user defined tz, so just give it back
-			return tzString;
-		}
-
-		return ((normalized.substr(0, 1) === '-' ? -1 : 1) * // plus or minus
-					((parseInt(normalized.substr(1, 2), 10) * 60) + // hours (converted to minutes)
-					parseInt(normalized.substr(3, 2), 10))); // minutes
-	};
-
-	/**
-	 * No way to set timezone in js Date, so we must adjust the minutes to compensate. (think setDate, getDate)
-	 * @param  {Date} date
-	 * @param  {string} toTimezone formatted like "+0500", "-1245"
-	 * @return {Date}
-	 */
-	$.timepicker.timezoneAdjust = function (date, toTimezone) {
-		var toTz = $.timepicker.timezoneOffsetNumber(toTimezone);
-		if (!isNaN(toTz)) {
-			date.setMinutes(date.getMinutes() + -date.getTimezoneOffset() - toTz);
-		}
-		return date;
-	};
-
-	/**
-	 * Calls `timepicker()` on the `startTime` and `endTime` elements, and configures them to
-	 * enforce date range limits.
-	 * n.b. The input value must be correctly formatted (reformatting is not supported)
-	 * @param  {Element} startTime
-	 * @param  {Element} endTime
-	 * @param  {Object} options Options for the timepicker() call
-	 * @return {jQuery}
-	 */
-	$.timepicker.timeRange = function (startTime, endTime, options) {
-		return $.timepicker.handleRange('timepicker', startTime, endTime, options);
-	};
-
-	/**
-	 * Calls `datetimepicker` on the `startTime` and `endTime` elements, and configures them to
-	 * enforce date range limits.
-	 * @param  {Element} startTime
-	 * @param  {Element} endTime
-	 * @param  {Object} options Options for the `timepicker()` call. Also supports `reformat`,
-	 *   a boolean value that can be used to reformat the input values to the `dateFormat`.
-	 * @param  {string} method Can be used to specify the type of picker to be added
-	 * @return {jQuery}
-	 */
-	$.timepicker.datetimeRange = function (startTime, endTime, options) {
-		$.timepicker.handleRange('datetimepicker', startTime, endTime, options);
-	};
-
-	/**
-	 * Calls `datepicker` on the `startTime` and `endTime` elements, and configures them to
-	 * enforce date range limits.
-	 * @param  {Element} startTime
-	 * @param  {Element} endTime
-	 * @param  {Object} options Options for the `timepicker()` call. Also supports `reformat`,
-	 *   a boolean value that can be used to reformat the input values to the `dateFormat`.
-	 * @return {jQuery}
-	 */
-	$.timepicker.dateRange = function (startTime, endTime, options) {
-		$.timepicker.handleRange('datepicker', startTime, endTime, options);
-	};
-
-	/**
-	 * Calls `method` on the `startTime` and `endTime` elements, and configures them to
-	 * enforce date range limits.
-	 * @param  {string} method Can be used to specify the type of picker to be added
-	 * @param  {Element} startTime
-	 * @param  {Element} endTime
-	 * @param  {Object} options Options for the `timepicker()` call. Also supports `reformat`,
-	 *   a boolean value that can be used to reformat the input values to the `dateFormat`.
-	 * @return {jQuery}
-	 */
-	$.timepicker.handleRange = function (method, startTime, endTime, options) {
-		options = $.extend({}, {
-			minInterval: 0, // min allowed interval in milliseconds
-			maxInterval: 0, // max allowed interval in milliseconds
-			start: {},      // options for start picker
-			end: {}         // options for end picker
-		}, options);
-
-		// for the mean time this fixes an issue with calling getDate with timepicker()
-		var timeOnly = false;
-		if(method === 'timepicker'){
-			timeOnly = true;
-			method = 'datetimepicker';
-		}
-
-		function checkDates(changed, other) {
-			var startdt = startTime[method]('getDate'),
-				enddt = endTime[method]('getDate'),
-				changeddt = changed[method]('getDate');
-
-			if (startdt !== null) {
-				var minDate = new Date(startdt.getTime()),
-					maxDate = new Date(startdt.getTime());
-
-				minDate.setMilliseconds(minDate.getMilliseconds() + options.minInterval);
-				maxDate.setMilliseconds(maxDate.getMilliseconds() + options.maxInterval);
-
-				if (options.minInterval > 0 && minDate > enddt) { // minInterval check
-					endTime[method]('setDate', minDate);
-				}
-				else if (options.maxInterval > 0 && maxDate < enddt) { // max interval check
-					endTime[method]('setDate', maxDate);
-				}
-				else if (startdt > enddt) {
-					other[method]('setDate', changeddt);
-				}
-			}
-		}
-
-		function selected(changed, other, option) {
-			if (!changed.val()) {
-				return;
-			}
-			var date = changed[method].call(changed, 'getDate');
-			if (date !== null && options.minInterval > 0) {
-				if (option === 'minDate') {
-					date.setMilliseconds(date.getMilliseconds() + options.minInterval);
-				}
-				if (option === 'maxDate') {
-					date.setMilliseconds(date.getMilliseconds() - options.minInterval);
-				}
-			}
-			
-			if (date.getTime) {
-				other[method].call(other, 'option', option, date);
-			}
-		}
-
-		$.fn[method].call(startTime, $.extend({
-			timeOnly: timeOnly,
-			onClose: function (dateText, inst) {
-				checkDates($(this), endTime);
-			},
-			onSelect: function (selectedDateTime) {
-				selected($(this), endTime, 'minDate');
-			}
-		}, options, options.start));
-		$.fn[method].call(endTime, $.extend({
-			timeOnly: timeOnly,
-			onClose: function (dateText, inst) {
-				checkDates($(this), startTime);
-			},
-			onSelect: function (selectedDateTime) {
-				selected($(this), startTime, 'maxDate');
-			}
-		}, options, options.end));
-
-		checkDates(startTime, endTime);
-		
-		selected(startTime, endTime, 'minDate');
-		selected(endTime, startTime, 'maxDate');
-
-		return $([startTime.get(0), endTime.get(0)]);
-	};
-
-	/**
-	 * Log error or data to the console during error or debugging
-	 * @param  {Object} err pass any type object to log to the console during error or debugging
-	 * @return {void}
-	 */
-	$.timepicker.log = function () {
-		if (window.console) {
-			window.console.log.apply(window.console, Array.prototype.slice.call(arguments));
-		}
-	};
-
-	/*
-	 * Add util object to allow access to private methods for testability.
-	 */
-	$.timepicker._util = {
-		_extendRemove: extendRemove,
-		_isEmptyObject: isEmptyObject,
-		_convert24to12: convert24to12,
-		_detectSupport: detectSupport,
-		_selectLocalTimezone: selectLocalTimezone,
-		_computeEffectiveSetting: computeEffectiveSetting,
-		_splitDateTime: splitDateTime,
-		_parseDateTimeInternal: parseDateTimeInternal
-	};
-
-	/*
-	* Microsecond support
-	*/
-	if (!Date.prototype.getMicroseconds) {
-		Date.prototype.microseconds = 0;
-		Date.prototype.getMicroseconds = function () { return this.microseconds; };
-		Date.prototype.setMicroseconds = function (m) {
-			this.setMilliseconds(this.getMilliseconds() + Math.floor(m / 1000));
-			this.microseconds = m % 1000;
-			return this;
-		};
-	}
-
-	/*
-	* Keep up with the version
-	*/
-	$.timepicker.version = "1.6.1";
-
-}));
diff --git a/api/js/jquery/splitter.js b/api/js/jquery/splitter.js
deleted file mode 100644
index d2724ac6ee..0000000000
--- a/api/js/jquery/splitter.js
+++ /dev/null
@@ -1,338 +0,0 @@
-/*
- * jQuery.splitter.js - two-pane splitter window plugin
- *
- * version 1.6 (2010/01/03) 
- * 
- * Dual licensed under the MIT and GPL licenses: 
- *   http://www.opensource.org/licenses/mit-license.php 
- *   http://www.gnu.org/licenses/gpl.html 
- */
- 
-/**
- * The splitter() plugin implements a two-pane resizable splitter window.
- * The selected elements in the jQuery object are converted to a splitter;
- * each selected element should have two child elements, used for the panes
- * of the splitter. The plugin adds a third child element for the splitbar.
- * 
- * For more details see: http://methvin.com/jquery/splitter/
- *
- *
- * @example $('#MySplitter').splitter();
- * @desc Create a vertical splitter with default settings 
- *
- * @example $('#MySplitter').splitter({type: 'h', accessKey: 'M'});
- * @desc Create a horizontal splitter resizable via Alt+Shift+M
- *
- * @name splitter
- * @type jQuery
- * @param Object options Options for the splitter (not required)
- * @cat Plugins/Splitter
- * @return jQuery
- * @author Dave Methvin (dave.methvin@gmail.com)
- */
- ;(function($){
-
-var splitterCounter = 0;
-
- $.fn.splitter = function(args){
-	args = args || {};
-	return this.each(function() {
-		if ( $(this).is(".splitter") )	// already a splitter
-			return;
-		var zombie;		// left-behind splitbar for outline resizes
-		function setBarState(state) {
-			bar.removeClass(opts.barStateClasses).addClass(state);
-		}
-		function startSplitMouse(evt) {
-			if ( evt.which != 1 )
-				return;		// left button only
-			bar.removeClass(opts.barHoverClass);
-			if ( opts.outline ) {
-				zombie = zombie || bar.clone(false).insertAfter(A);
-				bar.removeClass(opts.barDockedClass);
-			}
-			setBarState(opts.barActiveClass)
-			// Safari selects A/B text on a move; iframes capture mouse events so hide them
-			panes.css("-webkit-user-select", "none").find("iframe").andSelf().filter("iframe").addClass(opts.iframeClass);
-			A._posSplit = A[0][opts.pxSplit] - evt[opts.eventPos];
-			$(document)
-				.bind("mousemove"+opts.eventNamespace, doSplitMouse)
-				.bind("mouseup"+opts.eventNamespace, endSplitMouse);
-		}
-		function doSplitMouse(evt) {
-			var pos = A._posSplit+evt[opts.eventPos],
-				range = Math.max(0, Math.min(pos, splitter._DA - bar._DA)),
-				limit = Math.max(A._min, splitter._DA - B._max, 
-						Math.min(pos, A._max, splitter._DA - bar._DA - B._min));
-			if ( opts.outline ) {
-				// Let docking splitbar be dragged to the dock position, even if min width applies
-				if ( (opts.dockPane == A && pos < Math.max(A._min, bar._DA))  || 
-					 (opts.dockPane == B && pos > Math.min(pos, A._max, splitter._DA - bar._DA - B._min)) ) {
-					bar.addClass(opts.barDockedClass).css(opts.origin, range);
-				}
-				else {
-					bar.removeClass(opts.barDockedClass).css(opts.origin, limit);
-				}
-				bar._DA = bar[0][opts.pxSplit];
-			} else 
-				resplit(pos);
-			setBarState(pos == limit? opts.barActiveClass : opts.barLimitClass);
-		}
-		function endSplitMouse(evt) {
-			setBarState(opts.barNormalClass);
-			bar.addClass(opts.barHoverClass);
-			var pos = A._posSplit+evt[opts.eventPos];
-			if ( opts.outline ) {
-				zombie.remove(); zombie = null;
-				resplit(pos);
-			}
-			panes.css("-webkit-user-select", "text").find("iframe").andSelf().filter("iframe").removeClass(opts.iframeClass);
-			$(document)
-				.unbind("mousemove"+opts.eventNamespace+" mouseup"+opts.eventNamespace);
-		}
-		function resplit(pos) {
-			bar._DA = bar[0][opts.pxSplit];		// bar size may change during dock
-			// Constrain new splitbar position to fit pane size and docking limits
-			if ( (opts.dockPane == A && pos < Math.max(A._min, bar._DA)) ||
-				 (opts.dockPane == B && pos > Math.min(pos, A._max, splitter._DA - bar._DA - B._min)) ) {
-				bar.addClass(opts.barDockedClass);
-				bar._DA = bar[0][opts.pxSplit];
-				pos = opts.dockPane == A? 0 : splitter._DA - bar._DA;
-				if ( bar._pos == null )
-					bar._pos = A[0][opts.pxSplit];
-			}
-			else {
-				bar.removeClass(opts.barDockedClass);
-				bar._DA = bar[0][opts.pxSplit];
-				bar._pos = null;
-				pos = Math.max(A._min, splitter._DA - B._max, 
-						Math.min(pos, A._max, splitter._DA - bar._DA - B._min));
-			}
-			// Resize/position the two panes
-			bar.css(opts.origin, pos).css(opts.fixed, splitter._DF);
-			A.css(opts.origin, 0).css(opts.split, pos).css(opts.fixed,  splitter._DF);
-			B.css(opts.origin, pos+bar._DA)
-				.css(opts.split, splitter._DA-bar._DA-pos).css(opts.fixed,  splitter._DF);
-			panes.trigger("resize"+opts.eventNamespace);
-		}
-		function dimSum(jq, dims) {
-			// Opera returns -1 for missing min/max width, turn into 0
-			var sum = 0;
-			for ( var i=1; i < arguments.length; i++ )
-				sum += Math.max(parseInt(jq.css(arguments[i]),10) || 0, 0);
-			return sum;
-		}
-		
-		// Determine settings based on incoming opts, element classes, and defaults
-		var vh = (args.splitHorizontal? 'h' : args.splitVertical? 'v' : args.type) || 'v';
-		var opts = $.extend({
-			// Defaults here allow easy use with ThemeRoller
-			splitterClass:	"splitter ui-widget ui-widget-content",
-			paneClass:		"splitter-pane",
-			barClass:		"splitter-bar",
-			barNormalClass: "ui-state-default",			// splitbar normal
-			barHoverClass:  "ui-state-hover",			// splitbar mouse hover
-			barActiveClass: "ui-state-highlight",		// splitbar being moved
-			barLimitClass:  "ui-state-error",			// splitbar at limit
-			iframeClass:	"splitter-iframe-hide",		// hide iframes during split
-			eventNamespace:	".splitter"+(++splitterCounter),
-			pxPerKey: 8,			// splitter px moved per keypress
-			tabIndex: 0,			// tab order indicator
-			accessKey: ''			// accessKey for splitbar
-		},{
-			// user can override
-			v: {					// Vertical splitters:
-				keyLeft: 39, keyRight: 37, cursor: "e-resize",
-				barStateClass: "splitter-bar-vertical", 
-				barDockedClass: "splitter-bar-vertical-docked"
-			},
-			h: {					// Horizontal splitters:
-				keyTop: 40, keyBottom: 38,  cursor: "n-resize",
-				barStateClass: "splitter-bar-horizontal",
-				barDockedClass: "splitter-bar-horizontal-docked"
-			}
-		}[vh], args, {
-			// user cannot override
-			v: {					// Vertical splitters:
-				type: 'v', eventPos: "pageX", origin: "left",
-				split: "width",  pxSplit: "offsetWidth",  side1: "Left", side2: "Right",
-				fixed: "height", pxFixed: "offsetHeight", side3: "Top",  side4: "Bottom"
-			},
-			h: {					// Horizontal splitters:
-				type: 'h', eventPos: "pageY", origin: "top",
-				split: "height", pxSplit: "offsetHeight", side1: "Top",  side2: "Bottom",
-				fixed: "width",  pxFixed: "offsetWidth",  side3: "Left", side4: "Right"
-			}
-		}[vh]);
-		opts.barStateClasses = [opts.barNormalClass, opts.barHoverClass, opts.barActiveClass, opts.barLimitClass].join(' ');
-
-		// Create jQuery object closures for splitter and both panes
-		var splitter = $(this).css({position: "relative"}).addClass(opts.splitterClass);
-		var panes = $(">*", splitter[0]).addClass(opts.paneClass).css({
-			position: "absolute", 			// positioned inside splitter container
-			"z-index": "1",					// splitbar is positioned above
-			"-moz-outline-style": "none"	// don't show dotted outline
-		});
-		var A = $(panes[0]), B = $(panes[1]);	// A = left/top, B = right/bottom
-		opts.dockPane = opts.dock && (/right|bottom/.test(opts.dock)? B:A);
-
-		// Focuser element, provides keyboard support; title is shown by Opera accessKeys
-		var focuser = $('<a href="javascript:void(0)"></a>')
-			.attr({accessKey: opts.accessKey, tabIndex: opts.tabIndex, title: opts.splitbarClass})
-			.bind(("focus")+opts.eventNamespace, 
-				function(){ this.focus(); bar.addClass(opts.barActiveClass) })
-			.bind("keydown"+opts.eventNamespace, function(e){
-				var key = e.which || e.keyCode;
-				var dir = key==opts["key"+opts.side1]? 1 : key==opts["key"+opts.side2]? -1 : 0;
-				if ( dir )
-					resplit(A[0][opts.pxSplit]+dir*opts.pxPerKey, false);
-			})
-			.bind("blur"+opts.eventNamespace, 
-				function(){ bar.removeClass(opts.barActiveClass) });
-			
-		// Splitbar element
-		var bar = $('<div></div>')
-			.insertAfter(A).addClass(opts.barClass).addClass(opts.barStateClass)
-			.append(focuser).attr({unselectable: "on"})
-			.css({position: "absolute",	"user-select": "none", "-webkit-user-select": "none",
-				"-khtml-user-select": "none", "-moz-user-select": "none", "z-index": "100"})
-			.bind("mousedown"+opts.eventNamespace, startSplitMouse)
-			.bind("mouseover"+opts.eventNamespace, function(){
-				$(this).addClass(opts.barHoverClass);
-			})
-			.bind("mouseout"+opts.eventNamespace, function(){
-				$(this).removeClass(opts.barHoverClass);
-			});
-		// Use our cursor unless the style specifies a non-default cursor
-		if ( /^(auto|default|)$/.test(bar.css("cursor")) )
-			bar.css("cursor", opts.cursor);
-
-		// Cache several dimensions for speed, rather than re-querying constantly
-		// These are saved on the A/B/bar/splitter jQuery vars, which are themselves cached
-		// DA=dimension adjustable direction, PBF=padding/border fixed, PBA=padding/border adjustable
-		bar._DA = bar[0][opts.pxSplit];
-		splitter._PBF = dimSum(splitter, "border"+opts.side3+"Width", "border"+opts.side4+"Width");
-		splitter._PBA = dimSum(splitter, "border"+opts.side1+"Width", "border"+opts.side2+"Width");
-		A._pane = opts.side1;
-		B._pane = opts.side2;
-		$.each([A,B], function(){
-			this._splitter_style = this.style;
-			this._min = opts["min"+this._pane] || dimSum(this, "min-"+opts.split);
-			this._max = opts["max"+this._pane] || dimSum(this, "max-"+opts.split) || 9999;
-			this._init = opts["size"+this._pane]===true ?
-				parseInt($.curCSS(this[0],opts.split),10) : opts["size"+this._pane];
-		});
-		
-		// Determine initial position, get from cookie if specified
-		var initPos = A._init;
-		if ( !isNaN(B._init) )	// recalc initial B size as an offset from the top or left side
-			initPos = splitter[0][opts.pxSplit] - splitter._PBA - B._init - bar._DA;
-		if ( opts.cookie ) {
-			if ( !$.cookie )
-				alert('jQuery.splitter(): jQuery cookie plugin required');
-			initPos = parseInt($.cookie(opts.cookie),10);
-			$(window).bind("unload"+opts.eventNamespace, function(){
-				var state = String(bar.css(opts.origin));	// current location of splitbar
-				$.cookie(opts.cookie, state, {expires: opts.cookieExpires || 365, 
-					path: opts.cookiePath || document.location.pathname});
-			});
-		}
-		if ( isNaN(initPos) )	// King Solomon's algorithm
-			initPos = Math.round((splitter[0][opts.pxSplit] - splitter._PBA - bar._DA)/2);
-
-		// Resize event propagation and splitter sizing
-		if ( opts.anchorToWindow )
-			opts.resizeTo = window;
-		if ( opts.resizeTo ) {
-			splitter._hadjust = dimSum(splitter, "borderTopWidth", "borderBottomWidth", "marginBottom");
-			splitter._hmin = Math.max(dimSum(splitter, "minHeight"), 20);
-			$(window).bind("resize"+opts.eventNamespace, function(){
-				var top = splitter.offset().top;
-				var eh = $(opts.resizeTo).height();
-				splitter.css("height", Math.max(eh-top-splitter._hadjust, splitter._hmin)+"px");
-				splitter.trigger("resize");
-			}).trigger("resize"+opts.eventNamespace);
-		}
-		else if ( opts.resizeToWidth ) {
-			$(window).bind("resize"+opts.eventNamespace, function(){
-				splitter.trigger("resize");
-			});
-		}
-
-		// Docking support
-		if ( opts.dock ) {
-			splitter
-				.bind("toggleDock"+opts.eventNamespace, function() {
-					var pw = opts.dockPane[0][opts.pxSplit];
-					splitter.trigger(pw?"dock":"undock");
-				})
-				.bind("dock"+opts.eventNamespace, function(){
-					var pw = A[0][opts.pxSplit]; 
-					if ( !pw ) return;
-					// Don't try to dock twice
-					if (bar.hasClass("splitter-bar-horizontal-docked") || bar.hasClass("splitter-bar-vertical-docked"))
-						return;
-					bar._pos = pw;
-					var x={}; 
-					x[opts.origin] = opts.dockPane==A? 0 :
-						splitter[0][opts.pxSplit] - splitter._PBA - bar[0][opts.pxSplit];
-					bar.animate(x, opts.dockSpeed||1, opts.dockEasing, function(){
-						bar.addClass(opts.barDockedClass);
-						resplit(x[opts.origin]+1);
-					});
-				})
-				.bind("undock"+opts.eventNamespace, function(){
-					var pw = opts.dockPane[0][opts.pxSplit];
-					if ( pw ) return;
-					// 20px away is too close, reset to 50%
-					if(bar._pos == null || Math.abs(bar._pos - splitter._DA - bar._DA) < 20) bar._pos =  splitter._DA / 2;
-					var x={}; x[opts.origin]=bar._pos+"px";
-					bar.removeClass(opts.barDockedClass)
-						.animate(x, opts.undockSpeed||opts.dockSpeed||1, opts.undockEasing||opts.dockEasing, function(){
-							resplit(bar._pos);
-							bar._pos = null;
-						});
-				});
-			if ( opts.dockKey )
-				$('<a title="'+opts.splitbarClass+' toggle dock" href="javascript:void(0)"></a>')
-					.attr({accessKey: opts.dockKey, tabIndex: -1}).appendTo(bar)
-					.bind("focus", function(){ 
-						splitter.trigger("toggleDock"); this.blur();
-					});
-			bar.bind("dblclick", function(){ splitter.trigger("toggleDock"); })
-		}
-
-		
-		// Resize event handler; triggered immediately to set initial position
-		splitter
-			.bind("destroy"+opts.eventNamespace, function(){
-				$([window, document]).unbind(opts.eventNamespace);
-				bar.unbind().remove();
-				panes.removeClass(opts.paneClass);
-				splitter
-					.removeClass(opts.splitterClass)
-					.add(panes)
-						.unbind(opts.eventNamespace)
-						.attr("style", function(el){
-							return this._splitter_style||"";	//TODO: save style
-						});
-				splitter = bar = focuser = panes = A = B = opts = args = null;
-			})
-			.bind("resize"+opts.eventNamespace, function(e, size){
-				// Custom events bubble in jQuery 1.3; avoid recursion
-				if ( e.target != this ) return;
-				// Determine new width/height of splitter container
-				splitter._DF = splitter[0][opts.pxFixed] - splitter._PBF;
-				splitter._DA = splitter[0][opts.pxSplit] - splitter._PBA;
-				// Bail if splitter isn't visible or content isn't there yet
-				if ( splitter._DF <= 0 || splitter._DA <= 0 ) return;
-				// Re-divvy the adjustable dimension; maintain size of the preferred pane
-				resplit(!isNaN(size)? size : (!(opts.sizeRight||opts.sizeBottom)? A[0][opts.pxSplit] :
-					splitter._DA-B[0][opts.pxSplit]-bar._DA));
-				setBarState(opts.barNormalClass);
-			})
-			.trigger("resize" , [initPos]);
-	});
-};
-
-})(jQuery);
diff --git a/api/src/Header/ContentSecurityPolicy.php b/api/src/Header/ContentSecurityPolicy.php
index bffd95dc76..a23227caba 100644
--- a/api/src/Header/ContentSecurityPolicy.php
+++ b/api/src/Header/ContentSecurityPolicy.php
@@ -35,7 +35,7 @@ class ContentSecurityPolicy
 	 * @var array
 	 */
 	private static $sources = array(				// our dhtmlxcommon version (not the current) uses eval,
-		'script-src'  => array("'unsafe-eval'"),	// sidebox javascript links, et2_widget_date / jQueryUI datepicker, maybe more
+		'script-src'  => array("'unsafe-eval'"),	// sidebox javascript links, maybe more
 		'style-src'   => array("'unsafe-inline'"),	// eTemplate styles and custom framework colors
 		'connect-src' => null,	// NOT array(), to call the hook
 		'frame-src'   => null,	// NOT array(), to call the hook
@@ -219,4 +219,4 @@ class ContentSecurityPolicy
 			header("Content-Security-Policy: $csp");
 		}
 	}
-}
+}
\ No newline at end of file