// Javascript rendered views
  // @author Clark Van Oyen & David Baldwin
(function(){
  
  
var render_history = function(rsp, render_fn){

  var history_data = eval('('+rsp+')'), n=0;
  for (x in history_data) {
    history_data[x] = new KMC.History(history_data[x]);
  }
  var dates = KMC.UTIL.sorted_keys(history_data,'date','si_format');
  
  var h = '',history;
  for (k in dates) {
    history = history_data[dates[k]];
    if(n < KMC.num_per_page){
          h += render_fn(history);
    }
    n ++;
  }
  return {html:h, num_records: n};
}
  
KMC.VIEWS = {
      
      day_view: function (day) {
        
        KMC.CALENDAR.date.setDate(day);
        var $view = KMC.$view.empty().show();
        KMC.$view2.hide();
        
        //The day of the month 
        var date = new Date(KMC.CALENDAR.date.getFullYear(),KMC.CALENDAR.date.getMonth(),day);
        $view.append("<p>" + date.print() + "</p> <br class = 'clear'/>");
        
        // draw the timeline.
        var $timeline = $('<div id="timeline"></div>').appendTo($view);
        for (x=0; x<25; x++) {
          $cell = $('<div>' + KMC.UTIL.zero_pad(x,2) + '</div>');
          if($.browser.msie)
              $cell.width(30);
          $timeline.append($cell); 
        }
        
        // draw the shifts.
        var shift, start_px, width;
        var $shift_list = $("<div id='shift_list'></div>");
        for (x in KMC.shifts) {
          shift = KMC.shifts[x];
          start_px = Math.floor(shift.start_time.getHours()*30 + shift.start_date.getMinutes()*0.5);
          width = Math.floor((shift.end_time.getHours()*30 + shift.end_time.getMinutes()*0.5) - start_px - 6);
          if (width < 0) {
          width = 24*30 - start_px;
          }
          // if the shift occurs today, then render it.
          if (KMC.CALENDAR.date.showShift(shift)) {
            $shift = $("<div class='shift_view shift-display' id='shift_" + shift.id + "_display'>"+shift.doctor.last_name+"</div>")
              .css('margin-left', start_px + 'px')
              .css('width', width + 'px' );
            $shift_list.append($shift);           
          }
        }
        $view.append($shift_list);
        if (KMC.auth()) {
        $view.append('<input type = "button" value = "new shift" class = "btn" />');
        }
      },
      
      // Draw only the history for specific shift
      shift_history_view: function(){
        $.get('/ajax/history/?shift_id='+KMC.shift.id+'&page='+KMC.page, function(rsp) {
          var hi = render_history(rsp,function(history){
            return "<h5>On "+history.date.printMonth()+" "+history.date.printDate()+"</h5>" 
                + "<p>"+history.notes.replace(/\,/g,".<br/>")+".</p>";
          });
          var h = hi.html;
          if (KMC.page > 0) {
            h += "<a href = '#' class='shift_history_view'>previous</a> | ";
          }
          if (hi.num_records > KMC.num_per_page){
            h += "<a href = '#' class='shift_history_view'>next</a>";
          }
          $('#shift_history_link').parent().html(h);
        });
      },

      // Draw full history
      history_view: function() {
        KMC.$view2.hide();
        $.get('/ajax/history/?page='+KMC.page, function(rsp) {
          var hi = render_history(rsp,function(history){
              return '<tr><td>' + history.shift_id + '</td><td><small>'
                + history.date.si_format({seconds:false})
                + '</small></td><td>' + history.notes + '</td></tr>';
          });
          var h = '<h1>History</h1><br/><table class = "history_list"> <thead><th>Shift id</th>'+
                '<th>Date</th><th>Description (of what was changed)</th></thead>' + hi.html + '</table>';
          if(KMC.page > 0){
            h += "<a href = '#' class='history_view'>previous</a> | ";
          } 
          if (hi.num_records > KMC.num_per_page){
            h += "<a href = '#' class='history_view'>next</a>";
          }
          KMC.$view.empty().show().html(h);
        });
      },
      
      shift_view: function(shift, day_of_month) {
        KMC.shift = shift;
        if (day_of_month) {
        // get the shift id from the element id.       
          KMC.CALENDAR.date.setDate(day_of_month);
          this.day_view(KMC.CALENDAR.date.getDate());
        }
        
        // This is a shift view
        $('.shift-display-selected').removeClass('shift-display-selected');
        $('#shift_'+shift.id+'_display').addClass('shift-display-selected');
         
        if (KMC.auth()) {
          KMC.$view2.show().html("<div id='view2_left' class='block'><form>"+shift.id+"<table id = 'shift_table'>"
            +"<tr><td>Start Date    </td><td>" + shift.start_date.inputDate('start') + " </td></tr>"
            +"<tr><td>End Date    </td><td>" + KMC.UTIL.input_date_or_null(shift.end_date,shift.id) + " </td></tr>"
            +"<tr><td>Time    </td><td>" + shift.start_time.inputTime('start') + "-" + shift.end_time.inputTime('end')  + "</td></tr>"
            +"<tr><td>Type    </td><td>" + shift.shift_type.input() +   "</td></tr>" 
            +"<tr><td>Doctors </td><td>" + shift.doctor.input() + "</td></tr>"
            +"<tr><td>Notes   </td><td><textarea name='notes'>" + shift.notes + "</textarea></td></tr>"
            +"<tr><td>Notify Doctors?</td><td><input type='checkbox' name='sendEmail' id='sendEmail'> "
            +"</table><input value='save' class='btn' type='button' id='shift_submit'/>"
            +"<input value='send reminder' class='btn' type='button' id='shift_remind' />"
            +"<input value='delete' class='btn' type='button' style='float:right;display:block' id='shift_del' /> </form></div>"
            + (shift.id ? "<div id= 'view2_right' class='block'> <a class='shift_history_view' href='#' id = 'shift_history_link'>shift history (<u>show</u>) </a> </div>" : "" )
            );
        } else {
            //If shift is for one week only print day of shift, else print "all 'day's"
            if(shift.end_date != 'None'){
                KMC.$view2.show().html("<div id='view2_left' class='block'><table id = 'shift_table'>"
                    +"<tr><td>Date    </td><td>" + shift.start_date.print() + " </td></tr>"
                    +"<tr><td>Time    </td><td>" + shift.start_time.printTime() + "-" + shift.end_time.printTime()  + "</td></tr>"
                    +"<tr><td>Type    </td><td>" + shift.shift_type + "</td></tr>" 
                    +"<tr><td>Doctors </td><td>" + shift.doctor.first_name + " " + shift.doctor.last_name + "</td></tr>"
                    +"<tr><td>Notes   </td><td>" + shift.notes + "</td></tr></table></div>"
                    );
            }
            else{
                KMC.$view2.show().html("<div id='view2_left' class='block'><table id = 'shift_table'>"
                    +"<tr><td>Date    </td><td>" +"All "+ shift.start_date.printDay()+"s"+ " </td></tr>"
                    +"<tr><td>Time    </td><td>" + shift.start_time.printTime() + "-" + shift.end_time.printTime()  + "</td></tr>"
                    +"<tr><td>Type    </td><td>" + shift.shift_type + "</td></tr>" 
                    +"<tr><td>Doctors </td><td>" + shift.doctor.first_name + " " + shift.doctor.last_name + "</td></tr>"
                    +"<tr><td>Notes   </td><td>" + shift.notes + "</td></tr></table></div>"
                    );
            }
        }
      },
      
      // switch from a recurring date input to a static date input
      date_type_toggle: function($link) {
        if (KMC.shift.end_date === 'None') {
            KMC.shift.end_date = KMC.CALENDAR.date.clone();
        } else {
            KMC.shift.end_date = 'None';
        }
        $link.parent().parent().html( KMC.UTIL.input_date_or_null(KMC.shift.end_date));
      }
      
    };
    
})(); //end module