--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/app/view/widget/base/DateTimeField.js	Wed Mar 18 13:54:18 2015 +0100
@@ -0,0 +1,64 @@
+Ext.define('Lada.view.widget.base.DateTimeField', {
+    extend: 'Ext.form.field.Date',
+    alias: 'widget.datetimefield',
+    requires: [
+        'Lada.view.widget.base.DateTimePicker'
+    ],
+
+    format: 'm/d/Y H:i',
+
+    mimicBlur: function(e) {
+        var me = this,
+        picker = me.picker;
+
+        // ignore mousedown events within the picker element
+        if (!picker ||
+            !e.within(picker.el, false, true)
+        ) {
+            me.callParent(arguments);
+        }
+    },
+
+    collapseIf: function(e) {
+        var me = this;
+
+        if (Ext.getVersion().major === 4
+            && !me.isDestroyed
+            && !e.within(me.bodyEl, false, true)
+            && !e.within(me.picker.el, false, true)
+        ) {
+            me.collapse();
+        }
+    },
+
+    createPicker: function() {
+        var me = this;
+
+        return new Lada.view.widget.base.DateTimePicker({
+            pickerField: me,
+            floating: true,
+            hidden: true,
+            focusable: true,
+            focusOnShow: true,
+            minDate: me.minValue,
+            maxDate: me.maxDate,
+            disabledDatesRE: me.disabledDatesRE,
+            disabledDatesText: me.disabledDatesText,
+            disabledDays: me.disabledDays,
+            disabledDatesText: me.disabledDaysText,
+            format: me.format,
+            startDay: me.startDay,
+            minText: Ext.String.format(me.minText, me.formatDate(me.minValue)),
+            maxText: Ext.String.format(me.maxText, me.formatDate(me.maxValue)),
+            listeners: {
+                scope: me,
+                select: me.onSelect
+            },
+            keyNavConfig: {
+                esc: function() {
+                    me.collapse();
+                }
+            }
+        });
+    }
+});

--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/app/view/widget/base/DateTimePicker.js	Wed Mar 18 13:54:18 2015 +0100
@@ -0,0 +1,267 @@
+Ext.define('Lada.view.widget.base.DateTimePicker', {
+    extend: 'Ext.picker.Date',
+    alias: 'widget.datetimepicker',
+    requires: [
+        'Ext.picker.Date',
+        'Ext.form.field.Number'
+    ],
+
+    todayText: 'Jetzt',
+
+    renderTpl: [
+        '<div id="{id}-innerEl" role="grid">',
+            '<div role="presentation" class="{baseCls}-header">',
+                 // the href attribute is required for the :hover selector to work in IE6/7/quirks
+                '<a id="{id}-prevEl" class="{baseCls}-prev {baseCls}-arrow" href="#" role="button" title="{prevText}" hidefocus="on" ></a>',
+                '<div class="{baseCls}-month" id="{id}-middleBtnEl">{%this.renderMonthBtn(values, out)%}</div>',
+                 // the href attribute is required for the :hover selector to work in IE6/7/quirks
+                '<a id="{id}-nextEl" class="{baseCls}-next {baseCls}-arrow" href="#" role="button" title="{nextText}" hidefocus="on" ></a>',
+            '</div>',
+            '<table id="{id}-eventEl" class="{baseCls}-inner" cellspacing="0" role="grid">',
+                '<thead role="presentation"><tr role="row">',
+                    '<tpl for="dayNames">',
+                        '<th role="columnheader" class="{parent.baseCls}-column-header" title="{.}">',
+                            '<div class="{parent.baseCls}-column-header-inner">{.:this.firstInitial}</div>',
+                        '</th>',
+                    '</tpl>',
+                '</tr></thead>',
+                '<tbody role="presentation"><tr role="row">',
+                    '<tpl for="days">',
+                        '{#:this.isEndOfWeek}',
+                        '<td role="gridcell" id="{[Ext.id()]}">',
+                            // the href attribute is required for the :hover selector to work in IE6/7/quirks
+                            '<a role="presentation" hidefocus="on" class="{parent.baseCls}-date" href="#"></a>',
+                        '</td>',
+                    '</tpl>',
+                '</tr></tbody>',
+            '</table>',
+            '<div id="{id}-timeEl" role="presentation" class="{baseCls}-footer">',
+            '<table cellspacing="0">',
+                '<colgroup><col width="70"><col width="40"><col width="40"></colgroup>',
+                '<tr>',
+                    '<td>',
+                        '<div id="{id}-timeLabelEl" role="presentation">{%this.renderTimeLabel(values, out)%}</div>',
+                    '</td><td>',
+                        '<div id="{id}-timeHourEl" role="presentation">{%this.renderTimeHour(values, out)%}</div>',
+                    '</td><td>',
+                        '<div id="{id}-timeMinuteEl" role="presentation">{%this.renderTimeMinute(values, out)%}</div>',
+                    '</td>',
+                '</tr>',
+            '</table>',
+            '<table cellspacing="0">',
+                '<colgroup width="75"></colgroup>',
+                '<tr>',
+                    '<td>',
+                        '<div id="{id}-footerNowEl" role="presentation">{%this.renderTodayBtn(values, out)%}</div>',
+                    '</td><td>',
+                        '<div id="{id}-footerAcceptEl" role="presentation">{%this.renderAcceptBtn(values, out)%}</div>',
+                    '</td>',
+                '</tr>',
+            '</table>',
+            '</div>',
+        '</div>',
+        {
+            firstInitial: function(value) {
+                return Ext.picker.Date.prototype.getDayInitial(value);
+            },
+            isEndOfWeek: function(value) {
+                // convert from 1 based index to 0 based
+                // by decrementing value once.
+                value--;
+                var end = value % 7 === 0 && value !== 0;
+                return end ? '</tr><tr role="row">' : '';
+            },
+            renderTodayBtn: function(values, out) {
+                Ext.DomHelper.generateMarkup(values.$comp.todayBtn.getRenderTree(), out);
+            },
+            renderMonthBtn: function(values, out) {
+                Ext.DomHelper.generateMarkup(values.$comp.monthBtn.getRenderTree(), out);
+            },
+            renderTimeLabel: function(values, out) {
+                Ext.DomHelper.generateMarkup(values.$comp.timeLabel.getRenderTree(), out);
+            },
+            renderTimeHour: function(values, out) {
+                Ext.DomHelper.generateMarkup(values.$comp.hourField.getRenderTree(), out);
+            },
+            renderTimeMinute: function(values, out) {
+                Ext.DomHelper.generateMarkup(values.$comp.minuteField.getRenderTree(), out);
+            },
+            renderAcceptBtn: function(values, out) {
+                Ext.DomHelper.generateMarkup(values.$comp.acceptBtn.getRenderTree(), out);
+            }
+        }
+    ],
+
+    beforeRender: function () {
+        var me = this;
+        me.hourField = new Ext.form.field.Number({
+            ownerCt: me,
+            ownerLayout: me.getComponentLayout(),
+            value: 0,
+            increment: 1,
+            minValue: 0,
+            maxValue: 23,
+            listeners: {
+                change: me.changeTimeValue,
+                scope: me
+            }
+        });
+
+        me.minuteField = new Ext.form.field.Number({
+            ownerCt: me,
+            ownerLayout: me.getComponentLayout(),
+            value: 0,
+            increment: 1,
+            minValue: 0,
+            maxValue: 59,
+            listeners: {
+                change: me.changeTimeValue,
+                scope: me
+            }
+        });
+
+        me.timeLabel = new Ext.form.Label({
+            ownerCt: me,
+            ownerLayout: me.getComponentLayout(),
+            text: 'Zeit'
+        });
+        me.acceptBtn = new Ext.button.Button({
+            ownerCt: me,
+            ownerLayout: me.getComponentLayout(),
+            text: 'Übernehmen',
+            handler: me.acceptDate,
+            scope: me
+        });
+        me.callParent();
+    },
+
+    finishRenderChildren: function() {
+        var me = this;
+        me.callParent();
+        me.timeLabel.finishRender();
+        me.hourField.finishRender();
+        me.minuteField.finishRender();
+        me.acceptBtn.finishRender();
+    },
+
+    showTimePicker: function() {
+        var me = this;
+        var el = me.el;
+        Ext.defer(function() {
+            var xPos = el.getX();
+            var yPos = el.getY() + el.getHeight();
+            me.timePicker.setHeight(30);
+            me.timePicker.setWidth(el.getWidth());
+            me.timePicker.setPosition(xPos, yPos);
+            me.timePicker.show();
+        },1);
+    },
+
+    beforeDestroy: function() {
+        var me = this;
+        if (me.rendered) {
+            Ext.destroy(
+                me.minuteField,
+                me.hourField
+            );
+        }
+        me.callParent();
+    },
+
+    changeTimeValue: function (field, nValue, oValue) {
+    },
+
+    setValue: function(value) {
+        value.setSeconds(0);
+        this.value = new Date(value);
+        return this.update(this.value);
+    },
+
+    selectToday: function() {
+        var me = this;
+        var btn = me.todayBtn;
+        var handler = me.handler;
+        var auxDate = new Date();
+
+        if (btn && !btn.disabled) {
+            me.pickerField.setValue(new Date(auxDate.setSeconds(0)));
+            me.setValue(new Date(auxDate.setSeconds(0)));
+            if (handler) {
+                handler.call(me.scope || me, me, me.value);
+            }
+            me.onSelect();
+        }
+        return me;
+    },
+
+    acceptDate: function() {
+        var me = this;
+        var hourSet = me.hourField.getValue();
+        var minuteSet = me.minuteField.getValue();
+        var currentDate = me.value;
+        currentDate.setHours(hourSet);
+        currentDate.setMinutes(minuteSet);
+        me.setValue(currentDate);
+        me.fireEvent('select', me, currentDate);
+    },
+
+    handleDateClick: function(e, t) {
+        var me = this;
+        var handler = me.handler;
+        var hourSet = me.hourField.getValue();
+        var minuteSet = me.minuteField.getValue();
+        var auxDate = new Date(t.dateValue);
+        e.stopEvent();
+        if (!me.disabled &&
+            t.dateValue &&
+            !Ext.fly(t.parentNode).hasCls(me.disabledCellCls)
+        ) {
+            me.doCancelFocus = me.focusOnSelect === false;
+            auxDate.setHours(hourSet, minuteSet, 0);
+            me.setValue(new Date(auxDate));
+            delete me.doCancelFocus;
+            if (handler) {
+                handler.call(me.scope || me, me, me.value);
+            }
+            // event handling is turned off on hide
+            // when we are using the picker in a field
+            // therefore onSelect comes AFTER the select
+            // event.
+            me.onSelect();
+        }
+    },
+
+    selectedUpdate: function(date) {
+        var me = this;
+        var dateOnly = Ext.Date.clearTime(date, true);
+        var t = dateOnly.getTime();
+        var currentDate = (me.pickerField && me.pickerField.getValue()) || new Date();
+        var cells = me.cells;
+        var cls = me.selectedCls;
+        var cellItems = cells.elements;
+        var c;
+        var cLen = cellItems.length;
+        var cell;
+
+        cells.removeCls(cls);
+
+        for (c = 0; c < cLen; c++) {
+            cell = Ext.fly(cellItems[c]);
+
+            if (cell.dom.firstChild.dateValue == t) {
+                me.fireEvent('highlightitem', me, cell);
+                cell.addCls(cls);
+
+                if (me.isVisible() && !me.doCancelFocus) {
+                    Ext.fly(cell.dom.firstChild).focus(50);
+                }
+
+                break;
+            }
+        }
+        if (currentDate) {
+            me.hourField.setValue(currentDate.getHours());
+            me.minuteField.setValue(currentDate.getMinutes());
+        }
+    }
+});