karmaworld/assets/js/course-detail.js

   1 $(function() {
   2   $('#flag-button').click(function(event) {
   3     event.preventDefault();
   4
   5     if (confirm('Do you wish to flag this course for deletion?')) {
   6       // disable thank button so it can't
   7       // be pressed again
   8       $(this).hide();
   9       $('#flag-button-disabled').show();
  10       $(this).unbind('click');
  11
  12       // tell server that somebody thanked
  13       // this note
  14       $.ajax({
  15         url: course_flag_url,
  16         dataType: 'json',
  17         type: 'POST'
  18       });
  19
  20     }
  21   });
  22
  23   $('#edit-course-form').dialog({
  24     autoOpen: false,
  25     modal: true,
  26     show: { effect: 'fade', duration: 500 },
  27     width: dialogWidth()
  28   });
  29
  30   $('#edit-button').click(function(event) {
  31     $('#edit-course-form').dialog("open");
  32   });
  33
  34   $('#edit-save-btn').click(function(event) {
  35     $.ajax({
  36       url: course_edit_url,
  37       dataType: 'json',
  38       data: $('#edit-course-form').children().serialize(),
  39       type: 'POST',
  40       success: function(data) {
  41         if (data.fields.new_url) {
  42           window.location.href = data.fields.new_url;
  43         }
  44
  45         // We might want to use a template here instead of rehashing logic
  46         // on both the client and server side
  47         $('.validation_error').remove()
  48         $('#course_form_errors').empty();
  49         $('#course_name').text(data.fields.name);
  50         $('#course_instructor_name').text(data.fields.instructor_name);
  51
  52         var $externalLinkSquare = $('<i>', {'class': 'fa fa-external-link-square'});
  53         $('#course_url').text(data.fields.url.slice(0, 50) + ' ');
  54         $('#course_url').append($externalLinkSquare);
  55         $('#course_url').attr('href', data.fields.url);
  56         if (data.fields.url === '') {
  57           $('#course_link').parent().hide();
  58         } else {
  59           $('#course_link').parent().show();
  60         }
  61       },
  62       error: function(resp) {
  63         var json;
  64         try {
  65           json = JSON.parse(resp.responseText);
  66         } catch(e) {
  67           json = { message: 'Unknown Error' };
  68         }
  69
  70         var errors = json.errors;
  71
  72         // Delete all errors that currently exist
  73         $('.validation_error').remove()
  74         $('#course_form_errors').empty();
  75
  76         // Failed responses with no errors -> display message
  77         if (!errors) {
  78           $('#course_form_errors').text(json.message);
  79         } else {
  80           // Ugly, be works.  Could look into backbone or something similar to make it cleaner.
  81           if (errors.__all__) {
  82             $.each(errors.__all__, function(index, value) {
  83               $('#course_form_errors').append($('<span>', { class: 'validation_error', text: value }));
  84             });
  85           }
  86
  87           if (errors.instructor_email) {
  88             $.each(errors.instructor_email, function(index, value) {
  89               $('#id_instructor_email').parent().children('legend').append($('<span>', { class: 'validation_error', text: value }));
  90             });
  91           }
  92
  93           if (errors.url) {
  94             $.each(errors.url, function(index, value) {
  95               $('#id_url').parent().children('legend').append($('<span>', { class: 'validation_error' , text: value }));
  96             });
  97           }
  98         }
  99       }
 100     });
 101   });
 102
 103   KARMAWORLD.Course.initCourseNameAutocomplete({});
 104   KARMAWORLD.Course.initInstructorNameAutocomplete({});
 105
 106   $(function() {
 107
 108     // load dataTable for course data
 109     var dataTable = $('#data_table_list').dataTable({
 110       // we will set column widths explicitly
 111       'bAutoWidth': false,
 112       // don't provide a option for the user to change the table page length
 113       'bLengthChange': false,
 114       // sepcify the number of rows in a page
 115       'iDisplayLength': 20,
 116       // Position the filter bar at the top
 117       'sDom': '<"top">rt<"bottom"p><"clear">',
 118       // Specify options for each column
 119       "aoColumnDefs": [
 120         {
 121           // 2nd element: thanks
 122           "aTargets": [ 1 ],
 123           "bSortable": true,
 124           "bVisible": true
 125         },
 126         {
 127           // 1st element: date
 128           "aTargets": [ 0 ],
 129           "bSortable": true,
 130           "bVisible": true
 131         }
 132       ],
 133       // Initial sorting
 134       'aaSorting': [[1,'desc']]
 135     });
 136
 137     // wire up sort chooser
 138     $('select.course-sort').change(function() {
 139       dataTable.fnSort([[$(this).val(), 'desc']]);
 140     });
 141
 142     // sort by current value of sort chooser, since
 143     // the browser may change this from our default
 144     dataTable.fnSort([[$('select.note-sort').val(), 'desc']]);
 145
 146   });
 147
 148 });