No Description

rubrics.blade.php 13KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416
  1. @extends('layouts.master')
  2. @section('navigation')
  3. @if($role==1)
  4. @include('local.managers.admins._navigation')
  5. @elseif($role==2)
  6. @include('local.managers.sCoords._navigation')
  7. @elseif($role==3)
  8. @include('local.managers.pCoords._navigation')
  9. @else
  10. @include('local.professors._navigation')
  11. @endif
  12. @stop
  13. @section('main')
  14. <!-- No rubric modal -->
  15. <div class="modal fade" id="modal-no-rubric">
  16. <div class="modal-dialog modal-sm">
  17. <div class="modal-content">
  18. <div class="modal-header">
  19. <h4 class="modal-title">No Rubric Available</h4>
  20. </div>
  21. <div class="modal-body">
  22. There are no existing rubrics for your School. Please contact your Program's Coordinator. You will be redirected to the previous page.
  23. </div>
  24. <div class="modal-footer">
  25. <button id="button-redirect" class="btn btn-primary">Ok</button>
  26. </div>
  27. </div><!-- /.modal-content -->
  28. </div><!-- /.modal-dialog -->
  29. </div><!-- /.modal -->
  30. <div class="row">
  31. <div class="col-md-12">
  32. <div>
  33. {{ HTML::linkAction('ActivitiesController@show', 'Back to Activity', array($activity->id), array('class'=>'btn btn-default btn-sm pull-right')) }}
  34. <br>
  35. <br>
  36. </div>
  37. <div class="well">
  38. @if($activity->rubric_id!=NULL)
  39. <span id="assigned_rubric" class="hidden" data-assigned-rubric="{{{ $activity->rubric_id }}}"></span>
  40. @endif
  41. <input id="activity_id" type="hidden" value="{{{ $activity->id}}}">
  42. <div class="form-group">
  43. <label>Select a Rubric:</label>
  44. <select id="select-template" class="form-control selectpicker">
  45. @foreach ($templates as $template)
  46. @if($activity->rubric_id!=NULL && $template->name == Rubric::find($activity->rubric_id)->name)
  47. <option data-template-id="{{ $template->id }}" class="template" selected="selected">{{ $template->name }}</option>
  48. @else
  49. <option data-template-id="{{ $template->id }}" class="template">{{ $template->name }}</option>
  50. @endif
  51. @endforeach
  52. </select>
  53. </div>
  54. <div class="form-group">
  55. <label>Expected Criteria Outcome: </label>
  56. <!-- Select percentage. If there is a rubric, select the saved value -->
  57. <strong>
  58. <span id="expected_percentage">
  59. </span>%
  60. </strong> of all students must score at least
  61. <!-- Select points. If there is a rubric, select the saved value -->
  62. <strong>
  63. <span id="expected_points">
  64. </span>
  65. </strong>
  66. points in a criterion for it to pass.
  67. </div>
  68. </div>
  69. </div>
  70. </div>
  71. <div id="rubric-container" class="row">
  72. <div class="col-md-12">
  73. <table class="table">
  74. <thead><tr><th colspan="6 "><h3 id="rubric-name"></h3></th></tr></thead>
  75. <thead><tr><th>Criterion</th><th>Beginning (1-2)</th><th>In Progress (3-4)</th><th>Good (5-6)</th><th>Excellent (7-8)</th></tr></thead>
  76. <tbody>
  77. </tbody>
  78. </table>
  79. <div id="copyright-info">
  80. <hr>
  81. <p class="small"><strong>Copyright Information</strong></p>
  82. <ul id="copyright-list" class="list-unstyled small">
  83. </ul>
  84. <hr>
  85. </div>
  86. @if($activity->outcomes_attempted!=NULL)
  87. <div class="alert alert-info" role="alert">This activity has already been assessed. Changing the rubric will delete all saved scores.</div>
  88. @endif
  89. <div class="text-center">
  90. <button id="button-save-rubric" class="btn btn-lg btn-primary save"><span class="glyphicon glyphicon-floppy-disk"></span> Save</button>
  91. </div>
  92. </div>
  93. </div>
  94. @stop
  95. @section('javascript')
  96. // --------------------------------------------------------------------------
  97. // Page load
  98. // --------------------------------------------------------------------------
  99. console.log({{ $activity }});
  100. //If there are no rubrics to show, alert user and redirect.
  101. if($('#select-template').children().length)
  102. loadTemplate();
  103. else
  104. {
  105. $('#modal-no-rubric').modal({
  106. backdrop: 'static'
  107. });
  108. }
  109. // --------------------------------------------------------------------------
  110. // Functions
  111. // --------------------------------------------------------------------------
  112. // Fetch criteria associated to a specific learning outcome
  113. function fetchCriteria(outcome)
  114. {
  115. $.post
  116. (
  117. "{{ URL::route('fetchCriteria') }}",
  118. { id: outcome.find(':selected').data('outcome-id')},
  119. function(data)
  120. {
  121. $('#select-criterion').empty();
  122. data.forEach( function (arrayItem)
  123. {
  124. // If criterion does not belong to a user, display it
  125. if(arrayItem.user_id==null)
  126. {
  127. $('#select-criterion')
  128. .append('<option data-criterion-id="'+arrayItem.id+'" >'+arrayItem.name+'</option>');
  129. }
  130. // If it does, but the user is the one logged on, display.
  131. // Otherwise, ignore
  132. else if(arrayItem.user_id!="" && {{{Auth::id()}}}==arrayItem.user_id )
  133. {
  134. $('#select-criterion')
  135. .append('<option data-criterion-id="'+arrayItem.id+'" >'+arrayItem.name+'</option>');
  136. }
  137. });
  138. // Add custom option
  139. $('#select-criterion')
  140. .append('<option data-criterion-id="0">Custom</option>');
  141. $('#select-criterion').prop('disabled', false);
  142. $('#button-add-criterion').prop('disabled', false);
  143. }
  144. );
  145. }
  146. // Build list from copyright info in rubric
  147. function buildCopyrightList()
  148. {
  149. // Empty the copyright list
  150. $('#copyright-list').empty();
  151. $('tbody tr').each(function( index )
  152. {
  153. var criterion = $(this);
  154. // If there's copyright info
  155. if(criterion.data('criterion-copyright')!=null)
  156. {
  157. var copyright = criterion.data('criterion-copyright');
  158. // If there is anything in the copyright list
  159. if($('#copyright-list li').length>0)
  160. {
  161. // Check copyright list for the same copyright text
  162. var found = false;
  163. $('#copyright-list li').each(function()
  164. {
  165. // If found, give the string its number
  166. if(copyright==$(this).find('span').text())
  167. {
  168. copyrightNumber = Number.parseInt($(this).find('sup').text());
  169. criterion.children('td:nth-child(1)').find('sup').text(copyrightNumber);
  170. found =true;
  171. //to break
  172. return false;
  173. }
  174. });
  175. // Otherwise, give it the next number and append a new item to the
  176. // list
  177. if(!found)
  178. {
  179. var copyrightNumber = $('#copyright-list li').length+1;
  180. criterion.children('td:nth-child(1)').find('sup').text(copyrightNumber);
  181. $('#copyright-list').append('<li><sup>'+copyrightNumber+' </sup><span>'+copyright+'<span></li>');
  182. }
  183. }
  184. // Otherwise, give it number 1 and append it
  185. else
  186. {
  187. criterion.children('td:nth-child(1)').find('sup').text('1');
  188. $('#copyright-list').append('<li><sup>1 </sup><span>'+copyright+'<span></li>');
  189. }
  190. }
  191. });
  192. if($('#copyright-info li').length>0)
  193. {
  194. $('#copyright-info').show();
  195. }
  196. else
  197. {
  198. $('#copyright-info').hide();
  199. }
  200. }
  201. // Load a template
  202. function loadTemplate()
  203. {
  204. $.post
  205. (
  206. "{{ URL::to('loadTemplate') }}",
  207. { id: $('#select-template').find(':selected').data('template-id')},
  208. function(data)
  209. {
  210. //alert(JSON.stringify(data));
  211. // Show the container and empty all rows
  212. $('#rubric-container').show();
  213. $('tbody').empty();
  214. //Set the name of the rubric
  215. $('#rubric-name').val(data.name);
  216. console.log($('#expected_percentage').text());
  217. console.log($('#expected_points').text());
  218. // Set expected values
  219. $('#expected_percentage').text(data.expected_percentage);
  220. $('#expected_points').text(data.expected_points);
  221. // Set the contents of the rubric
  222. var contents = JSON.parse(data.contents);
  223. contents.forEach(function (criterion)
  224. {
  225. var str ='<tr data-assoc-outcome-id="'+criterion.outcome_id+'"'
  226. +'data-criterion-id="'+criterion.id+'" data-criterion-copyright="'+criterion.copyright+'" data-criterion-notes="'+criterion.notes+'">';
  227. var subcriteria = '';
  228. if(criterion.subcriteria){
  229. var subcriteria_array = criterion.subcriteria;
  230. subcriteria = '<ul class="subcriteria list-unstyled">';
  231. subcriteria_array.forEach(function (value) {
  232. subcriteria += '<li>'+value+'</li>';
  233. });
  234. subcriteria += '</ul>';
  235. }
  236. // If the criterion has notes, set the tooltip with them
  237. if(criterion.notes)
  238. {
  239. str+='<td><span><em data-toggle="tooltip" data-placement="top" title="'+criterion.notes+'">'+criterion.name+'</em></span><sup></sup>'+subcriteria+'</td>';
  240. }
  241. else
  242. {
  243. str+='<td><span>'+criterion.name+'</span><sup></sup>'+subcriteria+'</td>';
  244. }
  245. // Add the descriptions
  246. str+='<td>'+criterion.description12.replace(/\n/gi, '<br>')+'</td>'
  247. +'<td>'+criterion.description34.replace(/\n/gi, '<br>')+'</td>'
  248. +'<td>'+criterion.description56.replace(/\n/gi, '<br>')+'</td>'
  249. +'<td>'+criterion.description78.replace(/\n/gi, '<br>')+'</td></tr>';
  250. // Append the string to the table
  251. $('table tbody').append(str);
  252. // Turn on tooltips again (because content is dynamic)
  253. $('[data-toggle="tooltip"]').tooltip();
  254. });
  255. // Build Copyright List
  256. buildCopyrightList();
  257. }
  258. );
  259. }
  260. // --------------------------------------------------------------------------
  261. // Events
  262. // --------------------------------------------------------------------------
  263. // When trying to change the template, ask the user to confirm and reset the
  264. // rubric if s/he does
  265. $('#select-template').on('change', function()
  266. {
  267. loadTemplate();
  268. });
  269. // When a learning outcome changes, update its criteria
  270. $('#select-outcome').on('change', function()
  271. {
  272. fetchCriteria($(this));
  273. });
  274. // When save button is clicked
  275. $('#button-save-rubric').on('click', function(e)
  276. {
  277. //Prevent page refresh
  278. e.preventDefault();
  279. var criterionObject = new Object();
  280. var criteriaArray = new Array();
  281. // For each criterion in the rubric, get its value and put it into an array
  282. $('tbody tr').each(function( index )
  283. {
  284. criterionObject.id = $(this).data('criterion-id');
  285. criterionObject.outcome_id = $(this).data('assoc-outcome-id');
  286. criterionObject.name = $(this).children('td:nth-child(1)').find('span').text();
  287. var subcriteriaArray = new Array();
  288. $(this).children('td:nth-child(1)').find('.subcriteria li').each(function(index){
  289. subcriteriaArray.push($(this).text());
  290. });
  291. criterionObject.subcriteria = subcriteriaArray;
  292. criterionObject.description12 = $(this).children('td:nth-child(2)').html().replace(/<br>/gi, '\n');
  293. criterionObject.description34 = $(this).children('td:nth-child(3)').html().replace(/<br>/gi, '\n');
  294. criterionObject.description56 = $(this).children('td:nth-child(4)').html().replace(/<br>/gi, '\n');
  295. criterionObject.description78 = $(this).children('td:nth-child(5)').html().replace(/<br>/gi, '\n');
  296. criterionObject.copyright = $(this).data('criterion-copyright');
  297. criterionObject.notes = $(this).data('criterion-notes');
  298. // Clone the object and push it into the array
  299. var clone = jQuery.extend({}, criterionObject);
  300. criteriaArray.push(clone);
  301. });
  302. // If activity does not have a rubric, create it
  303. if($('#assigned_rubric').length === 0)
  304. {
  305. $('#js-error-row').hide();
  306. // Create
  307. $.post
  308. (
  309. "{{ URL::to('professor/saveRubric') }}",
  310. {
  311. name: $('#select-template').find(':selected').text(),
  312. activity_id: parseInt($('#activity_id').val()),
  313. contents: JSON.stringify(criteriaArray),
  314. expected_percentage: $('#expected_percentage').text(),
  315. expected_points: $('#expected_points').text()
  316. },
  317. function(data)
  318. {
  319. location.replace(data);
  320. }
  321. );
  322. }
  323. // Else, update it
  324. else
  325. {
  326. // Update database
  327. $.post
  328. (
  329. "{{ URL::to('professor/updateRubric') }}",
  330. {
  331. id: $('#assigned_rubric').data('assigned-rubric'),
  332. name: $('#select-template').find(':selected').text(),
  333. contents: JSON.stringify(criteriaArray),
  334. expected_percentage: $('#expected_percentage').text(),
  335. expected_points: $('#expected_points').text()
  336. },
  337. function(data)
  338. {
  339. location.replace(data);
  340. }
  341. );
  342. }
  343. });
  344. // When Ok button is clicked, redirect to previous page
  345. // When save button is clicked
  346. $('#button-redirect').on('click', function(e)
  347. {
  348. e.preventDefault();
  349. history.go(-1);
  350. });
  351. @stop