Controller

// When a specific timer of a socket is tapped the view TimerEdit will show up
    onTimerListItemTap: function(view, index, target, record, event){
        if(!MINUTES){
            MINUTES = [];
            for (var j = 0; j < 60; j++) {
                var text;
                text = (j < 10) ? ('0' + j) : j; //Add leading zero
                MINUTES.push({text:text, value:j});
            }
        }

        if(!HOURS){
            HOURS = [];
            for (var j = 0; j < 24; j++) {
                var text;
                text = (j < 10) ? ('0' + j) : j; //Add leading zero
                HOURS.push({text:text, value:j});
            }
        }

        editForm = Ext.create('Ext.picker.Picker',{
                name: 'timerEditPanel',
                doneButton: {
                    docked: 'right',
                    text: 'ok',
                    cls: 'annehmen'
                 },
                cancelButton: false,
                modal: true,
                hideOnMaskTap: true,
                scrollable:false,
                draggable: false,
                scroll: false,
                indicators: false,
                slots: [
                    {
                        xtype: 'pickerslot',
                        name: 'startTimeHours',
                        itemId: 'startTimeHours',
                        align: 'right',
                        title: 'H',
                        data: HOURS
                    },
                    {
                        xtype: 'pickerslot',
                        name: 'seperator',
                        align: 'center',
                        title: ' ',
                        data: [
                            {
                                text: ':',
                                value: ':'
                            }
                        ]
                    },
                    {
                        xtype: 'pickerslot',
                        name: 'startTimeMinutes',
                        itemId: 'startTimeMinutes',
                        align: 'left',
                        title: 'm',
                        data: MINUTES
                    },
                    {
                        xtype: 'pickerslot',
                        name: 'endTimeHours',
                        align: 'right',
                        title: 'H',
                        data: HOURS
                    },
                    {
                        xtype: 'pickerslot',
                        name: 'seperator',
                        align: 'center',
                        title: ' ',
                        data: [
                            {
                                text: ':',
                                value: ':'
                            }
                        ]
                    },
                    {
                        xtype: 'pickerslot',
                        name: 'endTimeMinutes',
                        itemId: 'endTimeMinutes',
                        align: 'left',
                        title: 'm',
                        data: MINUTES
                    }
                ],
                toolbar: {
                    xtype: 'toolbar',
                    docked: 'bottom',
                    items: [
                        {
                            xtype: 'container',
                            docked: 'bottom',
                            layout: {
                                type: 'hbox',
                                pack: 'justify'
                            },
                            defaults: {
                                xtype: 'checkboxfield',
                                labelAlign:'top',
                                flex:1,
                            },
                            items: [
                                {label:'Mo', itemId:'Mo'},{label:'Di', itemId:'Di'},{label:'Mi', itemId:'Mi'},{label:'Do', itemId:'Do'},{label:'Fr', itemId:'Fr'},{label:'Sa', itemId:'Sa'},{label:'So', itemId:'So'}
                            ]
                        },
                        {
                            xtype: 'checkboxfield',
                            labelAlign: 'left',
                            label: 'aktiv',
                            itemId: 'aktiv',
                            docked: 'left'
                        }
                    ]
                }
        });

        editForm.on('change', function(picker, button){
            var startTimeHours = picker.getValue()['startTimeHours'];
            var startTimeMinutes = picker.getValue()['startTimeMinutes'];

            var endTimeHours = picker.getValue()['endTimeHours'];
            var endTimeMinutes = picker.getValue()['endTimeMinutes'];

            var startTime = ((startTimeHours < 10) ? ('0' + startTimeHours) : startTimeHours) +':'+ ((startTimeMinutes < 10) ? ('0' + startTimeMinutes): startTimeMinutes); //Add leading zero
            var endTime = ((endTimeHours < 10) ? ('0' + endTimeHours) : endTimeHours) +':'+ ((endTimeMinutes < 10) ? ('0' + endTimeMinutes): endTimeMinutes); //Add leading zero

            record.set({startTime:startTime});
            record.set({endTime:endTime});

            var days = record.data.days;

            if(!picker.down('#Mo').isChecked()){
                record.set({MO:'noWdhDay'});
                days = days.replace('1','');
            }else{
                record.set({MO:'wdhDay'});
                days = days.replace('1','');
                days = days + '1';
            }

            if(!picker.down('#Di').isChecked()){
                record.set({DI:'noWdhDay'});
                days = days.replace('2','');
            }else{
                record.set({DI:'wdhDay'});
                days = days.replace('2','');
                days = days + '2';
            }

            if(!picker.down('#Mi').isChecked()){
                record.set({MI:'noWdhDay'});
                days = days.replace('3','');
            }else{
                record.set({MI:'wdhDay'});
                days = days.replace('3','');
                days = days + '3';
            }

            if(!picker.down('#Do').isChecked()){
                record.set({DO:'noWdhDay'});
                days = days.replace('4','');
            }else{
                record.set({DO:'wdhDay'});
                days = days.replace('4','');
                days = days + '4';
            }

            if(!picker.down('#Fr').isChecked()){
                record.set({FR:'noWdhDay'});
                days = days.replace('5','');
            }else{
                record.set({FR:'wdhDay'});
                days = days.replace('5','');
                days = days + '5';
            }

            if(!picker.down('#Sa').isChecked()){
                record.set({SA:'noWdhDay'});
                days = days.replace('6','');
            }else{
                record.set({SA:'wdhDay'});
                days = days.replace('6','');
                days = days + '6';
            }

            if(!picker.down('#So').isChecked()){
                record.set({SO:'noWdhDay'});
                days = days.replace('7','');
            }else{
                record.set({SO:'wdhDay'});
                days = days.replace('7','');
                days = days + '7';
            }
            record.set({days:days});

            if(!picker.down('#aktiv').isChecked()){
                record.set({checked:'unchecked'});
            }else{
                record.set({checked:'checked'});
            }

            Ext.getStore(steckdosenIndex+"D"+dosenId).sync();
        });
        var startTime = (record.data.startTime).split(':');
        var endTime = (record.data.endTime).split(':');
        editForm.setValue({startTimeHours:parseInt(startTime[0])});
        editForm.setValue({startTimeMinutes:parseInt(startTime[1])});
        editForm.setValue({endTimeHours:parseInt(endTime[0])});
        editForm.setValue({endTimeMinutes:parseInt(endTime[1])});

        editForm.down('#Mo').setChecked(false);
        editForm.down('#Di').setChecked(false);
        editForm.down('#Mi').setChecked(false);
        editForm.down('#Do').setChecked(false);
        editForm.down('#Fr').setChecked(false);
        editForm.down('#Sa').setChecked(false);
        editForm.down('#So').setChecked(false);

        var days = (record.data.days).split('');
        for(var i in days){
            var day = days[i];
            switch(day){
                case "1":
                    editForm.down('#Mo').setChecked(true);
                    break;
                case "2":
                    editForm.down('#Di').setChecked(true);
                    break;
                case "3":
                    editForm.down('#Mi').setChecked(true);
                    break;
                case "4":
                    editForm.down('#Do').setChecked(true);
                    break;
                case "5":
                    editForm.down('#Fr').setChecked(true);
                    break;
                case "6":
                    editForm.down('#Sa').setChecked(true);
                    break;
                case "7":
                    editForm.down('#So').setChecked(true);
                    break;
            }
        }
        // Apply checkbox status from list into selection
        if(record.data.checked == 'checked'){
            editForm.down('#aktiv').setChecked(true);
        }else{
            editForm.down('#aktiv').setChecked(false);
        }

        // Show selection
        editForm.show();
    },