Brak opisu

rubrics-old.blade.php 35KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957
  1. @extends('layouts.master')
  2. @section('navigation')
  3. @if(Auth::user()->role==1)
  4. @include('local.managers.admins._navigation')
  5. @elseif(Auth::user()->role==2)
  6. @include('local.managers.sCoords._navigation')
  7. @elseif(Auth::user()->role==3)
  8. @include('local.managers.pCoords._navigation')
  9. @endif
  10. @stop
  11. @section('main')
  12. <!-- Update Rubric Modal -->
  13. <div class="modal fade" id="modal-confirm-update">
  14. <div class="modal-dialog modal-sm">
  15. <div class="modal-content">
  16. <div class="modal-header">
  17. <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
  18. <h4 class="modal-title">Update Rubric</h4>
  19. </div>
  20. <div class="modal-body">
  21. <p>Speak to any coordinators and/or professors in your School or
  22. Program that may be affected when you update this rubric. Professors
  23. that have already used this rubric will keep a copy of it as
  24. they used it, not an updated one.</p>
  25. <p>Do you want to update this rubric?</p>
  26. </div>
  27. <div class="modal-footer">
  28. <button type="button" class="btn btn-default" data-dismiss="modal">No</button>
  29. <button id="button-update-rubric" class="btn btn-primary save">Update</button>
  30. </div>
  31. </div><!-- /.modal-content -->
  32. </div><!-- /.modal-dialog -->
  33. </div><!-- /.modal -->
  34. <!-- Delete Rubric Modal -->
  35. <div class="modal fade" id="modal-confirm-delete">
  36. <div class="modal-dialog modal-sm">
  37. <div class="modal-content">
  38. <div class="modal-header">
  39. <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
  40. <h4 class="modal-title">Delete Rubric</h4>
  41. </div>
  42. <div class="modal-body">
  43. <p>Please note: By deleting this rubric, it will no longer be available
  44. to your school's or program's professors. However, professors that
  45. have already used it will keep a copy in their activities. Speak to
  46. any coordinators and/or professors in your School or Program that may be affected.</p>
  47. <p>Are you sure you want to delete this rubric?</p>
  48. </div>
  49. <div class="modal-footer">
  50. <button type="button" class="btn btn-default" data-dismiss="modal">No</button>
  51. <button id="button-delete-rubric" class="btn btn-primary">Delete</button>
  52. </div>
  53. </div><!-- /.modal-content -->
  54. </div><!-- /.modal-dialog -->
  55. </div><!-- /.modal -->
  56. <div class="row">
  57. <div class="col-md-12">
  58. <div class="panel panel-default">
  59. <div class="panel-heading">
  60. <span class="glyphicon glyphicon-triangle-bottom"></span>
  61. General Information
  62. </div>
  63. <div class="panel-body">
  64. <form>
  65. <div class="form-group">
  66. <label>Select a template, or create your own rubric</label>
  67. <select id="select-template" class="form-control">
  68. <option data-template-id="0">Custom</option>
  69. @foreach ($templates as $template)
  70. @if($template->school_id==NULL && $template->program_id==NULL)
  71. <option
  72. data-template-id="{{ $template->id }}"
  73. data-template-program-id="{{ $template->program_id }}"
  74. data-admin="1"
  75. >
  76. {{{ $template->name }}}
  77. </option>
  78. @elseif($template->school_id!=NULL && $template->program_id==NULL)
  79. <option
  80. data-template-id="{{ $template->id }}"
  81. data-template-program-id="{{ $template->program_id }}"
  82. >
  83. {{{ $template->name }}}
  84. </option>
  85. @else
  86. <option
  87. data-template-id="{{ $template->id }}"
  88. data-template-program-id="{{ $template->program_id }}"
  89. class="bg-success"
  90. >
  91. {{{ $template->name }}}
  92. </option>
  93. @endif
  94. @endforeach
  95. </select>
  96. </div>
  97. <!-- If user is admin s/he can pick which schools can view the rubric -->
  98. @if(Auth::user()->role==1)
  99. <div class="form-group">
  100. <label>Select the School this rubric will be visible from</label>
  101. <select id="select-school" class="form-control">
  102. <option data-school-id="0">All</option>
  103. @foreach ($schools as $school)
  104. <option data-school-id="{{ $school->id }}">
  105. {{ $school->name }}
  106. </option>
  107. @endforeach
  108. </select>
  109. </div>
  110. @endif
  111. <!-- If user is admin or school coordinator, s/he can pick which programs -->
  112. @if(Auth::user()->role==1 || Auth::user()->role==2)
  113. <div class="form-group">
  114. <label>Select the Program this rubric belongs to</label>
  115. <select id="select-program" class="form-control">
  116. <option data-program-id="0">All</option>
  117. @foreach ($programs as $program)
  118. <option
  119. data-program-id="{{ $program->id }}"
  120. data-program-program-id="{{ $program->program_id }}"
  121. >
  122. {{ $program->name }}
  123. </option>
  124. @endforeach
  125. </select>
  126. </div>
  127. @endif
  128. </form>
  129. <label for="">Select the lower bound for passing criteria</label>
  130. <form class="form-inline">
  131. <div class="form-group">
  132. <!-- Select percentage. If there is a rubric, select the saved value -->
  133. <select id="expected_percentage" class="form-control">
  134. @for($i = 50; $i <= 100; $i++)
  135. @if($i==70)
  136. <option selected="selected" value="{{ $i }}">{{ $i }}</option>
  137. @else
  138. <option value="{{ $i }}">{{ $i }}</option>
  139. @endif
  140. @endfor
  141. </select>
  142. % of all students must score at least
  143. <!-- Select points. If there is a rubric, select the saved value -->
  144. <select id="expected_points" class="form-control">
  145. @for($i = 5; $i <= 8; $i++)
  146. @if($i==5)
  147. <option selected="selected" value="{{ $i }}">{{ $i }}</option>
  148. @else
  149. <option value="{{ $i }}">{{ $i }}</option>
  150. @endif
  151. @endfor
  152. </select>
  153. point(s) in a criterion for it to pass.
  154. </div>
  155. </form>
  156. <br>
  157. <form>
  158. <div class="form-group">
  159. <label>Select Status (you can change this later)</label>
  160. <div class="radio">
  161. <label>
  162. <input type="radio" name="is_visible" id="is_visible0" value="0" checked>
  163. This rubric is <strong>not complete</strong> yet and will not be available to professors.
  164. </label>
  165. </div>
  166. <div class="radio">
  167. <label>
  168. <input type="radio" name="is_visible" id="is_visible1" value="1">
  169. This rubric is <strong>complete</strong> and will be available to professors.
  170. </label>
  171. </div>
  172. </div>
  173. </form>
  174. <div>
  175. <p class="small">Note: You can hide or show this section by clicking on its heading. You may want to hide it to have more space. </p>
  176. </div>
  177. </div>
  178. </div>
  179. <div class="well">
  180. <form>
  181. <div class="form-group">
  182. <label>Select a Learning Outcome</label>
  183. <select id="select-outcome" class="form-control">
  184. @foreach ($outcomes as $outcome)
  185. <option data-outcome-id="{{ $outcome->id }}">{{ $outcome->name }}</option>
  186. @endforeach
  187. </select>
  188. </div>
  189. @if(Auth::user()->role != '1')
  190. <label>Filter Criteria</label>
  191. <div class="form-group">
  192. <label class="radio-inline">
  193. <input type="radio" checked name="criteria-filter" id="criteria-all" value="all"> All Criteria
  194. </label>
  195. <label class="radio-inline">
  196. <input type="radio" name="criteria-filter" id="criteria-school" value="school"> Criteria from my School
  197. </label>
  198. @if(Auth::user()->role == '3')
  199. <label class="radio-inline">
  200. <input type="radio" name="criteria-filter" id="criteria-program" value="program"> Criteria from my Program(s)
  201. </label>
  202. @endif
  203. </div>
  204. @endif
  205. <div class="form-group">
  206. <label>Select a Criterion</label><span id="updated-text" class="text-success small"> updated</span>
  207. <select id="select-criterion" class="form-control">
  208. </select>
  209. </div>
  210. <button id="button-add-criterion" class="btn btn-md btn-primary center-block"> <span class="glyphicon glyphicon-plus"></span> Add Criterion to Rubric</button>
  211. </form>
  212. </div>
  213. </div>
  214. </div>
  215. <div id="rubric-container" class="row">
  216. <div class="col-md-12">
  217. <table class="table table-striped table-condensed">
  218. <thead><tr><th colspan="6 "><input id="rubric-name" type="text" class="form-control input-lg" placeholder="Rubric Name"></th></tr></thead>
  219. <thead>
  220. <tr>
  221. <th></th>
  222. <th>Criterion</th>
  223. <th>Beginning (1-2)</th>
  224. <th>In Progress (3-4)</th>
  225. <th>Good (5-6)</th>
  226. <th>Excellent (7-8)</th>
  227. <th></th>
  228. </tr>
  229. </thead>
  230. <tbody>
  231. </tbody>
  232. </table>
  233. <div id="copyright-info">
  234. <hr>
  235. <p class="small"><strong>Copyright Information</strong></p>
  236. <ul id="copyright-list" class="list-unstyled small">
  237. </ul>
  238. <hr>
  239. </div>
  240. <div class="text-center">
  241. <div class="btn-group" role="group" aria-label="...">
  242. <button id="button-create-rubric" class="btn btn-lg btn-primary save">
  243. <span class="glyphicon glyphicon-floppy-disk"></span>
  244. Create
  245. </button>
  246. <button id="button-confirm-update-rubric" data-toggle="modal" data-target="#modal-confirm-update" class="btn btn-lg btn-primary">
  247. <span class="glyphicon glyphicon-pencil"></span>
  248. Update
  249. </button>
  250. <button id="button-confirm-delete-rubric" data-toggle="modal" data-target="#modal-confirm-delete" class="btn btn-lg btn-primary">
  251. <span class="glyphicon glyphicon-remove"></span>
  252. Delete
  253. </button>
  254. <button id="button-print-rubric" class="btn btn-lg btn-primary"><span class="glyphicon glyphicon-print"></span> Print <span class="small">(saved version)</span></button>
  255. </div>
  256. </div>
  257. </div>
  258. </div>
  259. @stop
  260. @section('included-js')
  261. <!-- jQuery Sortable Tables -->
  262. <script src="{{ asset('vendor/jQuerySortable/jquery-sortable-min.js') }}"></script>
  263. <!-- X-Editable js -->
  264. <script src="{{ asset('vendor/xeditable/bootstrap-editable.min.js') }}"></script>
  265. @stop
  266. @section('javascript')
  267. // --------------------------------------------------------------------------
  268. // Page load
  269. // --------------------------------------------------------------------------
  270. $('#updated-text').hide();
  271. // Enable/disable program selection depending on school selection if user is
  272. // admin
  273. if({{Auth::user()->role}}==1)
  274. toggleProgramSelect($('#select-school'));
  275. // Fetch criteria of first outcome
  276. fetchCriteria($('#select-outcome'));
  277. // Hide table
  278. $('#rubric-container').hide();
  279. // Disable Update and Delete Buttons by default
  280. $('#button-confirm-update-rubric').prop('disabled', true);
  281. $('#button-confirm-delete-rubric').prop('disabled', true);
  282. $('#button-print-rubric').prop('disabled', true);
  283. // Sortable rows
  284. $('.table').sortable({
  285. handle: 'span.glyphicon.glyphicon-move',
  286. containerSelector: 'table',
  287. itemPath: '> tbody',
  288. itemSelector: 'tr',
  289. placeholder: '<tr class="placeholder"><th><span class="glyphicon glyphicon-arrow-right"></span></th></tr>'
  290. });
  291. // --------------------------------------------------------------------------
  292. // Functions
  293. // --------------------------------------------------------------------------
  294. // Fetch criteria associated to a specific learning outcome
  295. function fetchCriteria(outcome)
  296. {
  297. $.post
  298. (
  299. "{{ URL::route('fetchCriteria') }}",
  300. {
  301. id: outcome.find(':selected').data('outcome-id'),
  302. filter: $('input[name=criteria-filter]:checked').val()
  303. },
  304. function(data)
  305. {
  306. $('#select-criterion').empty();
  307. // Append criteria
  308. data.forEach( function (arrayItem)
  309. {
  310. $('#select-criterion')
  311. .append('<option data-criterion-id="'+arrayItem.id+'" >'+arrayItem.name+'</option>');
  312. });
  313. // If there are no criteria assigned to the selected outcome, disable the
  314. // input and the button used to add criteria.
  315. if(!$('#select-criterion').children().length)
  316. {
  317. $('#select-criterion').prop('disabled', true);
  318. $('#button-add-criterion').prop('disabled', true);
  319. }
  320. // Otherwise, enable both the input and the button
  321. else
  322. {
  323. $('#select-criterion').prop('disabled', false);
  324. $('#button-add-criterion').prop('disabled', false);
  325. }
  326. $('#updated-text').fadeIn('slow').fadeOut('slow');
  327. }
  328. );
  329. }
  330. // Add a new criterion to the rubric
  331. function addCriterion()
  332. {
  333. // Show the rubric container
  334. if(!$('tbody').children().length)
  335. {
  336. $('#rubric-container').show();
  337. }
  338. // Get the selected criterion's id
  339. var id= parseInt($('#select-criterion').find(':selected').data('criterion-id'));
  340. // Check for duplicates
  341. var duplicates=false;
  342. $('tbody tr').each(function()
  343. {
  344. if ($(this).data('criterion-id') == id)
  345. {
  346. duplicates=true;
  347. }
  348. });
  349. // If there are any, display an error
  350. if(duplicates)
  351. {
  352. $('#js-error-row').show();
  353. $('#js-error-row').find('#error-message').text('Error: The selected criterion was already added.');
  354. return;
  355. }
  356. // Otherwise, hide the error container
  357. else
  358. {
  359. $('#js-error-row').hide();
  360. }
  361. // Fetch information of the criterion selected
  362. $.post
  363. (
  364. "{{ URL::route('fetchCriterion') }}",
  365. { id: id},
  366. function(data)
  367. {
  368. // Append the fetched data
  369. var str ='<tr data-assoc-outcome-id="'+data.outcome_id+'"'
  370. +'data-criterion-id="'+data.id+'" data-criterion-copyright="'+data.copyright+'" data-criterion-notes="'+data.notes+'"><th><span class="glyphicon glyphicon-move"></span></th><td>';
  371. if(data.notes)
  372. {
  373. str+='<span><em data-toggle="tooltip" data-placement="top" title="'+data.notes+'">'+data.name+'</em></span><sup></sup>';
  374. }
  375. else
  376. {
  377. str+='<span>'+data.name+'</span><sup></sup>';
  378. }
  379. str+='</td><td class="editable" data-type="textarea">'+data.description12+'</td>'
  380. +'<td class="editable" data-type="textarea">'+data.description34+'</td>'
  381. +'<td class="editable" data-type="textarea">'+data.description56+'</td>'
  382. +'<td class="editable" data-type="textarea">'+data.description78+'</td>'
  383. +'<th><span class="glyphicon glyphicon-remove icon-btn" aria-hidden="true"></span></th></tr>';
  384. $('table tbody').append(str);
  385. // Build copyright list
  386. buildCopyrightList();
  387. // Enable X-Edtable on this new row
  388. $('.editable').editable({
  389. unsavedclass: null,
  390. rows: 4
  391. });
  392. // Turn on tooltips again (because content is dynamic)
  393. $('[data-toggle="tooltip"]').tooltip();
  394. // Sortable rows
  395. $('.table').sortable({
  396. handle: 'span.glyphicon.glyphicon-move',
  397. containerSelector: 'table',
  398. itemPath: '> tbody',
  399. itemSelector: 'tr',
  400. placeholder: '<tr class="placeholder"><th><span class="glyphicon glyphicon-arrow-right"></span></th></tr>'
  401. });
  402. }
  403. );
  404. }
  405. // Fetch single criterion
  406. function fetchCriterion(criterion)
  407. {
  408. $.post
  409. (
  410. "{{ URL::route('fetchCriterion') }}",
  411. { id: outcome.find(':selected').data('outcome-id')},
  412. function(data)
  413. {
  414. $('#select-criterion').empty();
  415. data.forEach( function (arrayItem)
  416. {
  417. $('#select-criterion')
  418. .append('<option data-criterion-id="'+arrayItem.id+'" >'+arrayItem.name+'</option>');
  419. });
  420. $('#select-criterion').append('<option data-criterion-id="0">Custom</option>');
  421. }
  422. );
  423. }
  424. // Build list from copyright info in rubric
  425. function buildCopyrightList()
  426. {
  427. // Empty the copyright list
  428. $('#copyright-list').empty();
  429. $('tbody tr').each(function( index )
  430. {
  431. var criterion = $(this);
  432. // If there's copyright info
  433. if(criterion.data('criterion-copyright')!=null)
  434. {
  435. var copyright = criterion.data('criterion-copyright');
  436. // If there is anything in the copyright list
  437. if($('#copyright-list li').length>0)
  438. {
  439. // Check copyright list for the same copyright text
  440. var found = false;
  441. $('#copyright-list li').each(function()
  442. {
  443. // If found, give the string its number
  444. if(copyright==$(this).find('span').text())
  445. {
  446. copyrightNumber = Number.parseInt($(this).find('sup').text());
  447. criterion.children('td:nth-child(1)').find('sup').text(copyrightNumber);
  448. found =true;
  449. //to break
  450. return false;
  451. }
  452. });
  453. // Otherwise, give it the next number and append a new item to the
  454. // list
  455. if(!found)
  456. {
  457. var copyrightNumber = $('#copyright-list li').length+1;
  458. criterion.children('td:nth-child(1)').find('sup').text(copyrightNumber);
  459. $('#copyright-list').append('<li><sup>'+copyrightNumber+' </sup><span>'+copyright+'<span></li>');
  460. }
  461. }
  462. // Otherwise, give it number 1 and append it
  463. else
  464. {
  465. criterion.children('td:nth-child(1)').find('sup').text('1');
  466. $('#copyright-list').append('<li><sup>1 </sup><span>'+copyright+'<span></li>');
  467. }
  468. }
  469. });
  470. if($('#copyright-info li').length>0)
  471. {
  472. $('#copyright-info').show();
  473. }
  474. else
  475. {
  476. $('#copyright-info').hide();
  477. }
  478. }
  479. // Fetch programs associated to a specific school
  480. function fetchPrograms(school)
  481. {
  482. $.ajax({
  483. type: 'POST',
  484. url: "{{ URL::action('ProgramsController@fetch') }}",
  485. data: { id: school.find(':selected').data('school-id')},
  486. success: function(data)
  487. {
  488. $('#select-program').empty();
  489. $('#select-program').append('<option data-program-id="0">All</option>');
  490. data.forEach( function (program)
  491. {
  492. $('#select-program')
  493. .append('<option data-program-id="'+program.id+'" >'+program.name+'</option>');
  494. });
  495. },
  496. async:false
  497. });
  498. if($('#select-school').find(':selected').data('school-id')!=0)
  499. $('#select-program').prop('disabled', false);
  500. else
  501. $('#select-program').prop('disabled', true);
  502. }
  503. // Load a template. This function is different from the one for professors
  504. function loadTemplate()
  505. {
  506. $.post
  507. (
  508. "{{ URL::to('loadTemplate') }}",
  509. { id: $('#select-template').find(':selected').data('template-id')},
  510. function(data)
  511. {
  512. // Show the container and empty all rows
  513. $('#rubric-container').show();
  514. $('tbody').empty();
  515. //Set the name of the rubric
  516. $('#rubric-name').val(data.name);
  517. // Set school id to 0, then to the saved value if it exists
  518. $('#select-school option[data-school-id="0"]').prop('selected', true);
  519. $('#select-school option[data-school-id="'+data.school_id+'"]').prop('selected', true);
  520. // Fetch programs associated to that school
  521. fetchPrograms($('#select-school'));
  522. // Set program id to 0, then to the saved value if it exists
  523. $('#select-program option[data-program-id="0"]').prop('selected', true);
  524. $('#select-program option[data-program-id="'+data.program_id+'"]').prop('selected', true);
  525. // Set expected values
  526. $('#expected_percentage option[value="'+data.expected_percentage+'"]').prop('selected', true);
  527. $('#expected_points option[value="'+data.expected_points+'"]').prop('selected', true);
  528. // Set visibility
  529. var is_visible = JSON.parse(data.is_visible);
  530. if(is_visible)
  531. {
  532. $('#is_visible0').prop('checked', false);
  533. $('#is_visible1').prop('checked', true);
  534. }
  535. else
  536. {
  537. $('#is_visible1').prop('checked', false);
  538. $('#is_visible0').prop('checked', true);
  539. }
  540. // Set the contents of the rubric
  541. var contents = JSON.parse(data.contents);
  542. contents.forEach(function (data)
  543. {
  544. // Append the fetched data
  545. var str ='<tr data-assoc-outcome-id="'+data.outcome_id+'"'
  546. +'data-criterion-id="'+data.id+'" data-criterion-copyright="'+data.copyright+'" data-criterion-notes="'+data.notes+'"><th><span class="glyphicon glyphicon-move"></span></th><td>';
  547. if(data.notes)
  548. {
  549. str+='<span><em data-toggle="tooltip" data-placement="top" title="'+data.notes+'">'+data.name+'</em></span><sup></sup>';
  550. }
  551. else
  552. {
  553. str+='<span>'+data.name+'</span><sup></sup>';
  554. }
  555. str+='</td><td class="editable" data-type="textarea">'+data.description12+'</td>'
  556. +'<td class="editable" data-type="textarea">'+data.description34+'</td>'
  557. +'<td class="editable" data-type="textarea">'+data.description56+'</td>'
  558. +'<td class="editable" data-type="textarea">'+data.description78+'</td>'
  559. +'<th><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></th></tr>';
  560. $('table tbody').append(str);
  561. // Build copyright list
  562. buildCopyrightList();
  563. // Enable X-Edtable on this new row
  564. $('.editable').editable({
  565. unsavedclass: null,
  566. rows: 4
  567. });
  568. // Turn on tooltips again (because content is dynamic)
  569. $('[data-toggle="tooltip"]').tooltip();
  570. });
  571. // Sortable rows
  572. $('.table').sortable({
  573. handle: 'span.glyphicon.glyphicon-move',
  574. containerSelector: 'table',
  575. itemPath: '> tbody',
  576. itemSelector: 'tr',
  577. placeholder: '<tr class="placeholder"><th><span class="glyphicon glyphicon-arrow-right"></span></th></tr>'
  578. });
  579. // Build Copyright List
  580. buildCopyrightList();
  581. }
  582. );
  583. }
  584. // Checks whether the user wants to save a rubric with a name that already exists
  585. function nameExists()
  586. {
  587. var duplicates = false;
  588. $('#select-template option').each(function()
  589. {
  590. var optionName = $(this).text().trim();
  591. if($('#rubric-name').val().trim()===optionName)
  592. {
  593. duplicates = true;
  594. }
  595. });
  596. return duplicates;
  597. }
  598. //Enable disable program select
  599. function toggleProgramSelect(school)
  600. {
  601. if(school.find(':selected').data('school-id')<1)
  602. {
  603. $('#select-program option[data-program-id="0"]').prop('selected', true);
  604. $('#select-program').prop('disabled', true);
  605. }
  606. else
  607. {
  608. fetchPrograms(school);
  609. $('#select-program').prop('disabled', false);
  610. }
  611. }
  612. // --------------------------------------------------------------------------
  613. // Events
  614. // --------------------------------------------------------------------------
  615. // Toggle visibility for accordion panels
  616. $('.panel-heading').on('click', function()
  617. {
  618. if($(this).find('.glyphicon').hasClass('glyphicon-triangle-right'))
  619. {
  620. $(this).find('.glyphicon').removeClass('glyphicon-triangle-right');
  621. $(this).find('.glyphicon').addClass('glyphicon-triangle-bottom');
  622. }
  623. else if($(this).find('.glyphicon').hasClass('glyphicon-triangle-bottom'))
  624. {
  625. $(this).find('.glyphicon').removeClass('glyphicon-triangle-bottom');
  626. $(this).find('.glyphicon').addClass('glyphicon-triangle-right');
  627. }
  628. $(this).siblings('.panel-body').stop().slideToggle();
  629. });
  630. // When trying to change the template, ask the user to confirm and reset the
  631. // rubric if s/he does
  632. $('#select-template').on('change', function()
  633. {
  634. // If changing to custom template, reset
  635. if($('#select-template').find(':selected').data('template-id')=='0')
  636. {
  637. $('#rubric-container').hide();
  638. $('#rubric-name').val('');
  639. $('tbody').empty();
  640. // Disable delete, update and print buttons
  641. $('#button-confirm-delete-rubric').prop('disabled', true);
  642. $('#button-confirm-update-rubric').prop('disabled', true);
  643. $('#button-print-rubric').prop('disabled', true);
  644. }
  645. // Otherwise, load the selected template
  646. else
  647. {
  648. loadTemplate();
  649. //If user is admin, or the templates id matches user's, or the template
  650. // id's school matches user, allow editing
  651. var selected = $('#select-template').find(':selected');
  652. var program = '{{ Auth::user()->program_id }}';
  653. if(
  654. {{ Auth::user()->role }}==1
  655. || ({{ Auth::user()->role }}==2 && selected.data('admin')!=1)
  656. || ({{ Auth::user()->role }}==3
  657. && selected.data('template-program-id')== program
  658. && selected.data('admin')!=1
  659. )
  660. )
  661. {
  662. $('#button-confirm-delete-rubric').prop('disabled', false);
  663. $('#button-confirm-update-rubric').prop('disabled', false);
  664. }
  665. else
  666. {
  667. // Disable update and edit
  668. $('#button-confirm-delete-rubric').prop('disabled', true);
  669. $('#button-confirm-update-rubric').prop('disabled', true);
  670. }
  671. // Enable print button
  672. $('#button-print-rubric').prop('disabled', false);
  673. }
  674. });
  675. // When a school changes, update its programs. If all is selected, disable
  676. $('#select-school').on('change', function()
  677. {
  678. toggleProgramSelect($(this));
  679. });
  680. // When a learning outcome changes, update its criteria
  681. $('#select-outcome, input[name=criteria-filter]').on('change', function()
  682. {
  683. fetchCriteria($('#select-outcome'));
  684. });
  685. // When the add button is clicked
  686. $('#button-add-criterion').on('click', function(e)
  687. {
  688. //Prevent page refresh
  689. e.preventDefault();
  690. //Add new criterion
  691. addCriterion();
  692. });
  693. // When the create or update buttons are clicked (.save)
  694. $('.save').on('click', function(e)
  695. {
  696. //Prevent page refresh
  697. e.preventDefault();
  698. // Empty field validation
  699. var emptyFields=false;
  700. $('td').each(function()
  701. {
  702. if ($(this).text() == "" || $(this).text() == "Empty")
  703. {
  704. emptyFields=true;
  705. }
  706. });
  707. // If any fields are empty, display error
  708. if(emptyFields || $.trim($('#rubric-name').val())=='')
  709. {
  710. $('#js-error-row').show();
  711. $('#js-error-row').find('#error-message').text('Error: Please fill all the fields. Make sure your rubric has a name.');
  712. return;
  713. }
  714. else
  715. {
  716. $('#js-error-row').hide();
  717. }
  718. // Check whether a rubric with the written name already exists
  719. if($(this).attr('id')=='button-create-rubric' && nameExists())
  720. {
  721. $('#js-error-row').show();
  722. $('#js-error-row').find('#error-message').text('Error: A template with that name already exists.');
  723. return;
  724. }
  725. else
  726. {
  727. $('#js-error-row').hide();
  728. }
  729. var criterionObject = new Object();
  730. var criteriaArray = new Array();
  731. // For each criterion in the rubric, get its value and put it into an array
  732. $('tbody tr').each(function( index )
  733. {
  734. criterionObject.id = $(this).data('criterion-id');
  735. criterionObject.outcome_id = $(this).data('assoc-outcome-id');
  736. criterionObject.name = $(this).children('td:nth-child(2)').find('span').text();
  737. criterionObject.description12 = $(this).children('td:nth-child(3)').text();
  738. criterionObject.description34 = $(this).children('td:nth-child(4)').text();
  739. criterionObject.description56 = $(this).children('td:nth-child(5)').text();
  740. criterionObject.description78 = $(this).children('td:nth-child(6)').text();
  741. criterionObject.copyright = $(this).data('criterion-copyright');
  742. criterionObject.notes = $(this).data('criterion-notes');
  743. // Clone the object and push it into the array
  744. var clone = jQuery.extend({}, criterionObject);
  745. criteriaArray.push(clone);
  746. //console.log(JSON.stringify(clone));
  747. });
  748. //console.log('school', $('#select-school').find(':selected').data('school-id') );
  749. //console.log('program', $('#select-program').find(':selected').data('program-id') );
  750. if($(this).attr('id')=='button-create-rubric')
  751. {
  752. // Create
  753. $.post
  754. (
  755. "{{ URL::to('saveTemplate') }}",
  756. {
  757. name: $('#rubric-name').val(),
  758. contents: JSON.stringify(criteriaArray),
  759. school_id: $('#select-school').find(':selected').data('school-id'),
  760. program_id: $('#select-program').find(':selected').data('program-id'),
  761. expected_percentage: $('#expected_percentage').find(':selected').val(),
  762. expected_points: $('#expected_points').find(':selected').val(),
  763. is_visible: $('input[name=is_visible]:checked').val()
  764. },
  765. function(data)
  766. {
  767. location.reload(true);
  768. }
  769. );
  770. }
  771. else
  772. {
  773. console.log('school', $('#select-school').find(':selected').data('school-id') );
  774. console.log('program', $('#select-program').find(':selected').data('program-id') );
  775. // Update database
  776. $.post
  777. (
  778. "{{ URL::to('updateTemplate') }}",
  779. {
  780. id: $('#select-template').find(':selected').data('template-id'),
  781. name: $('#rubric-name').val(),
  782. contents: JSON.stringify(criteriaArray),
  783. school_id: $('#select-school').find(':selected').data('school-id'),
  784. program_id: $('#select-program').find(':selected').data('program-id'),
  785. expected_percentage: $('#expected_percentage').find(':selected').val(),
  786. expected_points: $('#expected_points').find(':selected').val(),
  787. is_visible: $('input[name=is_visible]:checked').val()
  788. },
  789. function(data)
  790. {
  791. location.reload(true);
  792. }
  793. );
  794. }
  795. });
  796. // When the confirm delete button is clicked
  797. $('#button-delete-rubric').on('click', function(e)
  798. {
  799. $('#modal-confirm-delete').modal('hide');
  800. // Delete from database
  801. $.post
  802. (
  803. "{{ URL::to('deleteTemplate') }}",
  804. {
  805. id: $('#select-template').find(':selected').data('template-id')
  806. },
  807. function(data)
  808. {
  809. location.reload();
  810. }
  811. );
  812. });
  813. // Remove a criterion and hide the table if it was the only one
  814. $('table').on('click', '.glyphicon-remove', function(e)
  815. {
  816. $(this).closest('tr').remove();
  817. if(!$('tbody').children().length)
  818. {
  819. $('#rubric-container').hide();
  820. }
  821. buildCopyrightList();
  822. });
  823. // When print button is clicked, redirect to print page
  824. $('#button-print-rubric').on('click', function(e)
  825. {
  826. e.preventDefault();
  827. window.location = "printRubric/"+$('#select-template').find(':selected').data('template-id');
  828. });
  829. @stop