// änderungen / 090521:
// OK beim einlesen im american mode zeit umrechnen
// OK datum einlesen
// OK beim ändern des input feldes widget anpassen / neu einlesen
// OK >> wenn keine stunde/minute angegeben ist 00 angeben
// OK sprache datepicker
// OK sprache durch parameter reingeben
// OK mehrere felder bedienen
// OK datepicker als klickbar machen

/** fixes / 090521:
- convert widget time to am/pm if american mode is on
- show correct date from input
- on change at input field modify widget
- if there is no hour/minute given in input, show 00
- start datepicker in given language
- new parameter for language
- able to work on many fields
- write date from datepicker
*/
jQuery.fn.datetime = function() {

    var userLang = arguments[0]['userLang'] || 'en';
    var dateFormat = arguments[0]['dateFormat'] || 'dd/mm/yy';
    var showDateTime = arguments[0]['showDateTime'] || 'both';
    var b24Hour = !(arguments[0]['americanMode'] || false);
    var markerClass = 'hasDateTime';


    return this.each(function() {

        var datepicker_def = {
            changeMonth: true,
            changeYear: true,
            dateFormat: dateFormat,
            showButtonPanel: true,
            onSelect: writeDate
        };

        var lang = {};

        lang['en'] = {
            time: 'Time',
            hour: 'Hour',
            minute: 'Minute',
            close: 'Close'
        };

        lang['de'] = {
            time: 'Zeit',
            hour: 'Stunde',
            minute: 'Minute',
            close: 'Schließen'
        };

        $(this).data('sets', datepicker_def);
        $(this).data('userLang', userLang);
        $(this).data('b24Hour', b24Hour);


        function renderPickerPlug(b24Hour_, lang_) 
        {
            var loadedLang = lang[lang_] || lang['en'];

            if ($('#pickerplug').length > 0) {
                $('#pickerplug').remove(0);
                //$('#pickerplug')[0].innerHTML = ($('#pickerplug')[0].innerHTML.replace($('#pickerplug')[0].innerHTML, ""));
            }


            var htmlins = '<ul id="pickerplug">';
            htmlins = htmlins + '<li>';
            htmlins = htmlins + '<div id="datepicker"></div>';
            htmlins = htmlins + '</li>';
            htmlins = htmlins + '<li>';
            htmlins = htmlins + '<div id="timepicker">';
            htmlins = htmlins + '<h3 id="tpSelectedTime">' + loadedLang['time'];
            htmlins = htmlins + '	<span class="selHrs" >00</span>';
            htmlins = htmlins + '	<span class="delim" >:</span>';
            htmlins = htmlins + '	<span class="selMins">00</span>';
            if (!b24Hour_) {
                htmlins = htmlins + '	<span class="dayPeriod">AM</span>';
            }
            htmlins = htmlins + '</h3>';
            htmlins = htmlins + '<ul id="sliderContainer">';
            htmlins = htmlins + '	<li>';
            htmlins = htmlins + '        <h4>' + loadedLang['hour'] + '</h4>';
            htmlins = htmlins + '        <div id="hourSlider" class="slider"></div>';
            htmlins = htmlins + '	</li>';
            htmlins = htmlins + '	<li>';
            htmlins = htmlins + '        <h4>' + loadedLang['minute'] + '</h4>';
            htmlins = htmlins + '        <div id="minuteSlider" class="slider"></div>';
            htmlins = htmlins + '	</li>';
            htmlins = htmlins + '</ul>';
            htmlins = htmlins + '</div>';
            htmlins = htmlins + '<button type="button" class="ui-datepicker-close ui-state-default ui-priority-primary ui-corner-all">' + loadedLang['close'] + '</button>';
            htmlins = htmlins + '</li>';
            htmlins = htmlins + '</ul>';
            //            $('body').remove('#pickerplug');
            $('body').append(htmlins);


            $('#datepicker').datepicker();
            $(document).mousedown(closePickPlug);
            $('#pickerplug .ui-datepicker-close').click(closePickPlug);
            $('#pickerplug').data('userLang', lang_);
            $('#pickerplug').data('b24Hour', b24Hour_);

            var hourMinValue = 0;
            var hourMaxValue = 23;
            if (!$('#pickerplug').data('b24Hour')) {
                hourMinValue = 1;
                hourMaxValue = 24;
            }
            // Slider
            $('#hourSlider').slider({
                orientation: "vertical",
                range: 'min',
                min: hourMinValue,
                max: hourMaxValue,
                step: 1,
                slide: function(event, ui) {
                    writeDate(writeTime(ui.value, 'hour'), 'time');

                },
                change: function(event, ui) {
                    //	$('#tpSelectedTime .selHrs').effect('highlight', 1000);
                }
            });
            // Slider
            $('#minuteSlider').slider({
                orientation: "vertical",
                range: 'min',
                min: 0,
                max: 55,
                step: 5,
                slide: function(event, ui) {
                    writeDate(writeTime(ui.value, 'minute'), 'time');
                },
                change: function(event, ui) {
                    //	$('#tpSelectedTime .selMins').effect('highlight', 1000);
                }
            });
          

            //Inline editor bind
            $('#tpSelectedTime .selHrs').keyup(function(e) {
                if ((e.which <= 57 && e.which >= 48) && ($(this).text() >= 1 && $(this).text() <= 12)) {
                    //console.log("Which: "+e.which);
                    $('#hourSlider').slider('value', parseInt($(this).text()));
                    //console.log("Val: "+parseInt($(this).val()))
                } else {
                    $(this).val($(this).text().slice(0, -1));
                }
                //if($(this).val() < 1){
                //    $(this).val(1);
                //}
            });

            //Inline editor bind
            $('#tpSelectedTime .selMins').keyup(function(e) {
                if ((e.which <= 57 && e.which >= 48) && ($(this).text() >= 0 && $(this).text() <= 59)) {
                    //console.log("Which: "+e.which);
                    $('#minuteSlider').slider('value', parseInt($(this).text()));
                    //console.log("Val: "+parseInt($(this).val()))
                } else {
                    $(this).text($(this).text().slice(0, -1));
                }
                //if($(this).val() < 1){
                //    $(this).val(1);
                //}
            });
        }


        //renderPickerPlug(b24Hour, userLang);

        $(this).bind('focus', function() {

            var top = $(this).offset().top + $(this).outerHeight();
            var left = $(this).offset().left;

            if ($(this).data('userLang') != $('#pickerplug').data('userLang') ||
						$(this).data('b24Hour') != $('#pickerplug').data('userLang')) {
                renderPickerPlug($(this).data('b24Hour'), $(this).data('userLang'));
            }

            $('#pickerplug').css({
                left: left + 'px',
                top: top + 'px'
            }).show('normal');

            if ($(this).data('userLang') != 'en' && lang[$(this).data('userLang')]) {
                $('#datepicker').datepicker('option', $.extend({},
												$.datepicker.regional[$(this).data('userLang')]));
                $('#datepicker').datepicker('option', $.extend($(this).data('sets')));
            } else {
                $('#datepicker').datepicker('option', $.extend({},
												$.datepicker.regional['']));
                $('#datepicker').datepicker('option', $.extend($(this).data('sets')));
            }

            parseTime(this);

            if ($('#pickerplug').css('display') == 'none') {
                $('#pickerplug').show('normal');
            }

            $(this).bind('keyup', parseTime);
            //$(this).bind('slider',writeTime);

            $(this).addClass(markerClass);

            $('#pickerplug').data('inputfield', this);

            if (showDateTime == 'date') {
                $('#datepicker').show();
                $('#timepicker').hide();
            }
            else if (showDateTime == 'time') {
                $('#datepicker').hide();
                $('#timepicker').show();
            }
            $(this).blur();

        });

        function parseTime(obj) {

            var time = ($(obj).val() || $(this).val()).split(" ");
            var ampm = "AM";
            if (time.length < 2) {
                time = [time[0], ''];
            }

            $('#pickerplug').data('lastdate', time[0]); //lastdate = time[0];
            if (time.length > 2) {
                $('#pickerplug').data('lasttime', time[1] + " " + time[2]);
                ampm = time[2];
            }
            else
                $('#pickerplug').data('lasttime', time[1]);    	//lasttime = time[1];

            time = time[1].split(":");

            if (time.length < 2) {
                time = ['00', '00', '00'];
            }

            var hour = time[0] || '00';
            var minute = time[1] || '00';


            if (ampm == "PM") {
                hour = (hour - 0) + 12;
            }

            writeTime(hour, 'hour');
            writeTime(minute, 'minute');

            $('#hourSlider').slider('option', 'value', hour);
            $('#minuteSlider').slider('option', 'value', minute);

            $('#datepicker').datepicker(
											'setDate',
											$.datepicker.parseDate(
													datepicker_def['dateFormat'],
													$('#pickerplug').data('lastdate')
												));

        }

        function writeTime(fragment, type) {
            var time = '';

            switch (type) {
                case 'hour':
                    var hours = parseInt(fragment, 10);
                    //&& hours > 12 it was a condition in the if below
                    //hour er value change kora jabe na ar previous state store korte hobe
                    if (!$('#pickerplug').data('b24Hour')) {
                        var realHour = hours;

                        if (hours < 12) {
                            $('.dayPeriod').text('AM');
                        }
                        else if (hours > 12) {
                            hours -= 12;
                            $('.dayPeriod').text('PM');


                        }
                        else if (hours == 12 && $('.dayPeriod').text() == 'PM') {
                            $('.dayPeriod').text('PM');
                        }
                        //                        else if (hours == 12 && $('.dayPeriod').text() == 'AM') {
                        //                            hours -= 12;
                        //                            $('.dayPeriod').text('AM');
                        //                        }

                    } else if ($('#pickerplug').data('b24Hour')) {
                        if (hours < 12)
                            $('.dayPeriod').text('AM');
                        else
                            $('.dayPeriod').text('PM');
                    }

                    if (hours < 10) {
                        hours = '0'.concat(hours);
                    }
                    if (fragment < 10) {
                        fragment = '0'.concat(parseInt(fragment));
                    }

                    $('#tpSelectedTime .selHrs').text(hours);

                    //var mint = $('#tpSelectedTime .selMins').text().substring(0,2);
                    //time = fragment+':'+$('#tpSelectedTime .selMins').text();	
                    //time = fragment+':'+ mint;

                    if ($('#pickerplug').data('b24Hour')) {
                        time = fragment + ':' + $('#tpSelectedTime .selMins')[0].innerHTML;
                    }
                    else {
                        time = $('#tpSelectedTime .selHrs')[0].innerHTML + ':' + $('#tpSelectedTime .selMins')[0].innerHTML + " " + $('.dayPeriod')[0].innerHTML;
                    }
                    break;
                case 'minute':
                    minutes = ((fragment < 10) ? '0' : '') + parseInt(fragment, 10);
                    $('#tpSelectedTime .selMins').text(minutes);

                    //time = $('#hourSlider').slider('option', 'value')+':'+minutes;
                    if ($('#pickerplug').data('b24Hour')) {
                        time = $('#tpSelectedTime .selHrs')[0].innerHTML + ':' + minutes;
                    }
                    else {
                        time = $('#tpSelectedTime .selHrs')[0].innerHTML + ':' + $('#tpSelectedTime .selMins')[0].innerHTML + " " + $('.dayPeriod')[0].innerHTML;
                    }
                    break;
            }
            return time;
        }

        function writeDate(text, type) {

            switch (type) {
                case 'time':
                    $('#pickerplug').data('lasttime', text);
                    break;
                default:
                    $('#pickerplug').data('lastdate', text);
            }

            $($('#pickerplug').data('inputfield')).val(
								$('#pickerplug').data('lastdate') + ' ' + $('#pickerplug').data('lasttime')
					);
        }

        function closePickPlug(event) {

            if (($(event.target).parents('#pickerplug').length ||
						$(event.target).hasClass(markerClass)) &&
						!$(event.target).hasClass('ui-datepicker-close')) {
                return;
            }

            $('#pickerplug').hide('normal');
            $(this).unbind('click', closePickPlug);
            $(this).unbind('keyup', parseTime);
            $(this).removeClass(markerClass);
        }

    });

}