/**
 * @author Terry Wooton extended by Jürgen Freundel
 * @desc transforms a text input box into a dropdown style analog clock
 * @version 1.2
 * @example
 * $("#element").clock({displayFormat:'12',defaultHour:'12',defaultMinute:'00',defaultAM:'AM',seconds:false,intervalMinutes: 5});
 * @license free
 *
 */

$(document).ready(function() {
  var clockNumber = 0;
  $.fn.clock = function(params) {

    $(this).each(function() {
      var s = $(this).extend({displayFormat:12,defaultHour:'12',defaultMinute:'00',defaultAM:'AM',seconds:false,defaultSeconds:'00',intervalMinutes:10},params || {});
      var time = $(this).val();
      var parts = time.split(':');
      s.defaultHour = parts[0];
      s.defaultMinute = parts[1];

      var clockTemplate  = '<div id="clock'+ (++clockNumber) + '" class=\"clock\">';
      clockTemplate += '<select name="clockHours'+clockNumber+'" id="clockHours'+clockNumber+'" rel="'+clockNumber+'">';
      for(var i = 0; i<= (s.displayFormat-1);i++){
        j = (i<10 ? ('0'+i) : i);

        clockTemplate += '<option value="'+j+'"'+(j == s.defaultHour ? ' selected' : '')+'>'+j+'</option>';
      }
      clockTemplate += '</select>';
      clockTemplate += ':<select name="clockMinutes'+clockNumber+'" id="clockMinutes'+clockNumber+'" rel="'+clockNumber+'">';
      for(var i = 0; i < 60; i = i + s.intervalMinutes){
        j = (i<10 ? ('0'+i) : i);
        clockTemplate += '<option value="'+j+'"'+(j == s.defaultMinute ? ' selected' : '')+'>'+j+'</option>';
      }
      clockTemplate += '</select>';
      if(s.seconds){
        clockTemplate += ':<select name="clockSeconds'+clockNumber+'" id="clockSeconds'+clockNumber+'" rel="'+clockNumber+'">';
        for(var i = 0; i<60;i++){
          j = (i<10 ? ('0'+i) : i);
          clockTemplate += '<option value="'+j+'"'+(j == s.defaultSeconds ? ' selected' : '')+'>'+j+'</option>';
        }
        clockTemplate += '</select>';
      }
      if(s.displayFormat == '12'){
        clockTemplate += '&nbsp;<select name="clockAM'+clockNumber+'" id="clockAM'+clockNumber+'" rel="'+clockNumber+'">';
        clockTemplate += '<option value="AM"'+(s.defaultAM == 'AM' ? ' selected' : '')+'>AM</option>';
        clockTemplate += '<option value="PM"'+(s.defaultAM == 'PM' ? ' selected' : '')+'>PM</option>';
        clockTemplate += '</select>';
      }
      clockTemplate += '</div>';
      var t = $(this);
      $(this).css({display:'none'});
      $(this).after(clockTemplate);

      calculateClockValue(t,s,clockNumber);
      $('#clockHours'+clockNumber+', #clockMinutes'+clockNumber+', #clockSeconds'+clockNumber+', #clockAM'+clockNumber).change(function(from){
        var num = $(this).attr('rel');
        calculateClockValue(t,s,num);
      });
    });

    function calculateClockValue(t,s,num){
      var hour = $('#clockHours'+num).val();
      var minutes = $('#clockMinutes'+num).val();
      var sec = (s.seconds ? ':' + $('#clockSeconds' + num).val() : '');
      var am = (s.displayFormat == '12' ? ' ' + $('#clockAM' + num).val() : '');
      t.val(hour + ':' + minutes + sec + am);
    }
  }
});