설명 없음

view-three-year-plan.blade.php 47KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978
  1. @extends('layouts.master')
  2. @section('navigation')
  3. @if (Auth::user()->role == 2)
  4. @include('local.managers.sCoords._new_navigation')
  5. @elseif(Auth::user()->role == 3)
  6. @include('local.managers.pCoords._new_navigation')
  7. @endif
  8. @stop
  9. @section('main')
  10. <script type="text/javascript">
  11. function filterCycles() {
  12. // Declare variables
  13. var input, filter, div, li, i, cycleText;
  14. input = document.getElementById('userInput');
  15. filter = input.value.toUpperCase();
  16. div = document.getElementById("list");
  17. li = div.getElementsByTagName('li');
  18. // Loop through all list items, and hide those who don't match the search query
  19. for (i = 0; i < li.length; i++) {
  20. cycleText = li[i].textContent;
  21. if (cycleText.toUpperCase().indexOf(filter) > -1) {
  22. li[i].style.display = "";
  23. } else {
  24. li[i].style.display = "none";
  25. }
  26. }
  27. }
  28. // onChange, update selected outcomes-semesters
  29. function update_outcome_semesters() {
  30. var outcomeSemesterArray = new Array();
  31. // For each learning outcome, get selected boxes and put it into an array
  32. $('#outcome-semesters-body tr').each(function(index) {
  33. var outcomeObject = new Object();
  34. outcomeObject.id = $(this).data('id');
  35. var semesters = new Array();
  36. var temp = new Array();
  37. temp.push($(this).children(".sem1-box").find("input").attr('name'));
  38. temp.push($(this).children(".sem1-box").find("input").prop("checked"));
  39. semesters.push(temp);
  40. temp = new Array();
  41. temp.push($(this).children(".sem2-box").find("input").attr('name'));
  42. temp.push($(this).children(".sem2-box").find("input").prop("checked"));
  43. semesters.push(temp);
  44. temp = new Array();
  45. temp.push($(this).children(".sem3-box").find("input").attr('name'));
  46. temp.push($(this).children(".sem3-box").find("input").prop("checked"));
  47. semesters.push(temp);
  48. temp = new Array();
  49. temp.push($(this).children(".sem4-box").find("input").attr('name'));
  50. temp.push($(this).children(".sem4-box").find("input").prop("checked"));
  51. semesters.push(temp);
  52. temp = new Array();
  53. temp.push($(this).children(".sem5-box").find("input").attr('name'));
  54. temp.push($(this).children(".sem5-box").find("input").prop("checked"));
  55. semesters.push(temp);
  56. temp = new Array();
  57. temp.push($(this).children(".sem6-box").find("input").attr('name'));
  58. temp.push($(this).children(".sem6-box").find("input").prop("checked"));
  59. semesters.push(temp);
  60. outcomeObject.semesters = semesters;
  61. var clone = jQuery.extend({}, outcomeObject);
  62. outcomeSemesterArray.push(clone);
  63. });
  64. var id = $('#table-cycles').data('typ-id');
  65. $.post(
  66. "{{ URL::action('ThreeYearPlanController@update_typ_outcomes_semesters') }}", {
  67. outcomeSemesterArray: JSON.stringify(outcomeSemesterArray),
  68. typ_id: (id),
  69. program_id: {{ $program_id }}
  70. },
  71. function(data) {
  72. //;
  73. }
  74. );
  75. }
  76. </script>
  77. <div class="row">
  78. <div id="alert_placeholder">
  79. </div>
  80. <div class="col-md-3">
  81. <input class="form-control" type="text" id="userInput" onkeyup="filterCycles()"
  82. placeholder="Search for Cycles..">
  83. <div class="list-group" id='list'>
  84. @foreach ($typs as $typ)
  85. <li data-cycle-id="{{ $typ->id }}" class="list-group-item">
  86. {{ $typ->year_start }}-{{ $typ->year_end }}</li>
  87. @endforeach
  88. </div>
  89. <br>
  90. <!--<button type="button" class="btn btn-secondary" id = "three_year_button" data-toggle="modal" data-target="#three_year">Create Three Year Cycle</button>
  91. -->
  92. </div>
  93. <!-- Modal -->
  94. <div id="three_year" class="modal fade" role="dialog">
  95. <div class="modal-dialog">
  96. <!-- Modal content-->
  97. <div class="modal-content">
  98. <div class="modal-header">
  99. <button type="button" class="close" data-dismiss="modal">&times;</button>
  100. <h4 class="modal-title">Create New Cycle</h4>
  101. </div>
  102. <div class="modal-body">
  103. {{ Form::open(['action' => 'ThreeYearPlanController@create']) }}
  104. <p>Select a new cycle. You cannot choose a cycle that has been created before</p>
  105. <input type='hidden' name='program_id' value='{{ $program_id }}'>
  106. <select name='years' class="form-control selectpicker">
  107. <option value='{{ $last_year }}'>{{ $last_year }} - {{ $last_year + 3 }} </option>
  108. <option value='{{ $last_year + 3 }}'>{{ $last_year + 3 }} - {{ $last_year + 6 }}
  109. </option>
  110. </select>
  111. </div>
  112. <div class="modal-footer">
  113. <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
  114. {{ Form::submit('Create Cycle', ['class' => 'btn btn-primary']) }}
  115. {{ Form::close() }}
  116. </div>
  117. </div>
  118. </div>
  119. </div>
  120. <div class="col-md-9">
  121. <div class="btn-group pull-right">
  122. <a href="" id="print_button" class="btn btn-default" target="_blank" rel="noopener noreferrer">Print</a>
  123. </div>
  124. <div id="cycle-display" class="panel panel-default">
  125. <div class="panel-heading">
  126. <h4 class=" panel-title" style="cursor:auto!important;">
  127. </h4>
  128. </div>
  129. <div class="panel-body" id="section1">
  130. <p class="section1-description">Select two or more Semesters that will be evaluated by a Learning
  131. Outcome.</p>
  132. <div class="table-responsive">
  133. {{-- <table class="table table-striped table-condensed datatable"> --}}
  134. <table data-typ-id="0" class="table table-striped table-condensed" id="table-cycles">
  135. <style media="screen">
  136. input[type=checkbox] {
  137. transform: scale(2);
  138. }
  139. </style>
  140. <thead>
  141. <tr style="background-color:#FDD8B5;">
  142. <th rowspan="0" style="background-color:#F5DEDD;" class="text-center">Learning
  143. Outcomes</th>
  144. <th colspan="2" class="text-center" id="cycle1"></th>
  145. <th colspan="2" class="text-center" id="cycle2"></th>
  146. <th colspan="2" class="text-center" id="cycle3"></th>
  147. </tr>
  148. <tr class="">
  149. <th class="text-center">1er sem</th>
  150. <th class="text-center">2do sem</th>
  151. <th class="text-center">1er sem</th>
  152. <th class="text-center">2do sem</th>
  153. <th class="text-center">1er sem</th>
  154. <th class="text-center">2do sem</th>
  155. </tr>
  156. </thead>
  157. <tfoot>
  158. </tfoot>
  159. <input type="text" id="cycle_id" name="cycle_id" value="getsReplacedWithJS" hidden>
  160. <tbody id="outcome-semesters-body" onchange="update_outcome_semesters()">
  161. @foreach ($outcomes as $outcome)
  162. <tr data-id="{{ $outcome->id }}">
  163. <th>{{ $outcome->name }}</th>
  164. <th class="text-center sem1-box"><input type="checkbox"
  165. id="{{ $outcome->id }}-sem1" name="{{ $outcome->id }}-sem1"
  166. value="checked" /></th>
  167. <th class="text-center sem2-box"><input type="checkbox"
  168. id="{{ $outcome->id }}-sem2" name="{{ $outcome->id }}-sem2"
  169. value="checked" /></th>
  170. <th class="text-center sem3-box"><input type="checkbox"
  171. id="{{ $outcome->id }}-sem3" name="{{ $outcome->id }}-sem3"
  172. value="checked" /></th>
  173. <th class="text-center sem4-box"><input type="checkbox"
  174. id="{{ $outcome->id }}-sem4" name="{{ $outcome->id }}-sem4"
  175. value="checked" /></th>
  176. <th class="text-center sem5-box"><input type="checkbox"
  177. id="{{ $outcome->id }}-sem5" name="{{ $outcome->id }}-sem5"
  178. value="checked" /></th>
  179. <th class="text-center sem6-box"><input type="checkbox"
  180. id="{{ $outcome->id }}-sem6" name="{{ $outcome->id }}-sem6"
  181. value="checked" /></th>
  182. </tr>
  183. @endforeach
  184. </tbody>
  185. </table>
  186. <hr>
  187. <div class="">
  188. <button class="btn-lg btn-primary pull-right go-to-2" style="margin:5px;">Select
  189. Objectives</button>
  190. </div>
  191. </div>
  192. </div>
  193. <div class="panel-body" id="section2">
  194. <p class="section2-description">Select one or more Objectives that will be evaluated in a given
  195. Semester.</p>
  196. <div>
  197. <div class="objectives-section-0">
  198. </div>
  199. <div class="objectives-section">
  200. </div>
  201. <hr>
  202. <div class="">
  203. <button class="btn-lg btn-primary pull-right go-to-3" style="margin:5px;">Go to Course
  204. Selection</button>
  205. <button class="btn-lg btn-primary pull-right back-to-1" style="margin:5px;">Back to Semester
  206. Selection</button>
  207. </div>
  208. </div>
  209. </div>
  210. <div class="panel-body" id="section3">
  211. <p class="section3-description">Select one or more Courses that will be evaluated by an Objective in a
  212. given Semester.</p>
  213. <div>
  214. <div class="courses-main-clone-0" hidden>
  215. <div class="title-course-selection-0">
  216. <button class="btn btn-md btn-secondary pull-right hide-course-selection"><span
  217. class="glyphicon glyphicon-minus"></span> Hide Learning Outcome Options</button>
  218. <button class="btn btn-md btn-secondary pull-right show-course-selection"><span
  219. class="glyphicon glyphicon-plus"></span> Show Learning Outcome Options</button>
  220. <p class="h3" style="width:100%;max-width:80%;"><b> Learning Outcome:
  221. example</b></p>
  222. </div>
  223. <div class="semester-course-selection-0" style="margin-left:30px;">
  224. <label class="semester-label-course-selection-0" for="">First Semester of 2000-2000</label>
  225. <div class="select-course-selection-0" style="margin-left:30px;">
  226. <div class="objective-selector-0">
  227. <label for="">OBJECTIVE TEMP</label>
  228. <select class="select-0" name="" style="width:100%;max-width:55%;">
  229. <option class="default-option" value="nothing_selected">Select a course</option>
  230. </select>
  231. <button class="btn btn-md btn-primary delete-selection-0"
  232. style="margin:5px;"><span></span> X</button>
  233. </div>
  234. <div class="clone-objective-course-select-0">
  235. <button class="btn btn-md btn-secondary add-objective-course"
  236. style="margin:5px;"><span class="glyphicon glyphicon-plus"></span> Choose more
  237. Courses</button>
  238. </div>
  239. </div>
  240. </div>
  241. <div class="footer-course-selection-0" style="margin-left:30px;" hidden>
  242. <p><b>Course selection for this Learning Outcome is currently hidden</b></p>
  243. </div>
  244. </div>
  245. <div class="courses-section-0">
  246. </div>
  247. <div class="courses-section">
  248. </div>
  249. <hr>
  250. <div class="">
  251. <button class="btn-lg btn-primary pull-right go-to-temp" style="margin:5px;">Save & Create
  252. Annual Plans</button>
  253. <button class="btn-lg btn-primary pull-right back-to-2" style="margin:5px;">Back to Objective
  254. Selection</button>
  255. </div>
  256. </div>
  257. </div>
  258. </div>
  259. </div>
  260. <div class="col-md-9">
  261. <div class="no-cycle alert alert-info">
  262. <p>Select a Three year cycle to start</p>
  263. </div>
  264. </div>
  265. </div>
  266. <script>
  267. $(document).ready(function() {
  268. // --------------------------------------------------------------------------
  269. // Page load
  270. // --------------------------------------------------------------------------
  271. // Hide accordion panel contents by default
  272. var outcomes = {{ json_encode($outcomes) }};
  273. $('.panel-group .panel-body').hide();
  274. $('#cycle-display').parent().hide();
  275. $("#clonedOutcome0").hide();;
  276. $('.show-course-selection').hide();
  277. // --------------------------------------------------------------------------
  278. // Functions
  279. // --------------------------------------------------------------------------
  280. (function() {
  281. var previous;
  282. $("select").on('focus', function() {
  283. // Store the current value on focus and on change
  284. previous = this.value;
  285. }).change(function() {
  286. //comienzo
  287. var options_values = $(this).parent().find('select').val().split('-');
  288. //ifs
  289. if (options_values.length == 3) {
  290. var typ_id = $('#table-cycles').data('typ-id');
  291. var previous_objective_id = previous.split('-')[2];
  292. var options_values = this.value.split('-');
  293. var outcome_id = options_values[0];
  294. var semester_id = options_values[1];
  295. var new_objective_id = options_values[2];
  296. if (new_objective_id == 'n') {
  297. new_objective_id = 'nothing_selected';
  298. }
  299. if (previous_objective_id == 'n') {
  300. previous_objective_id = 'nothing_selected';
  301. }
  302. $.post(
  303. "{{ URL::action('ThreeYearPlanController@section2_on_change') }}", {
  304. typ_id: (typ_id),
  305. previous_objective_id: (previous_objective_id),
  306. outcome_id: (outcome_id),
  307. semester_id: (semester_id),
  308. new_objective_id: (new_objective_id),
  309. program_id: {{ $program_id }}
  310. },
  311. function(data) {
  312. //
  313. }
  314. );
  315. previous = this.value;
  316. } else if (options_values.length == 4) {
  317. var typ_id = $('#table-cycles').data('typ-id');
  318. var previous_course_id = previous.split('-')[3];
  319. var options_values = this.value.split('-');
  320. var outcome_id = options_values[0];
  321. var semester_id = options_values[1];
  322. var objective_id = options_values[2];
  323. var new_course_id = options_values[3];
  324. if (new_course_id == 'n') {
  325. new_course_id = 'nothing_selected';
  326. }
  327. if (previous_course_id == 'n') {
  328. previous_course_id = 'nothing_selected';
  329. }
  330. $.post(
  331. "{{ URL::action('ThreeYearPlanController@section3_on_change') }}", {
  332. typ_id: (typ_id),
  333. previous_course_id: (previous_course_id),
  334. outcome_id: (outcome_id),
  335. semester_id: (semester_id),
  336. objective_id: (objective_id),
  337. new_course_id: (new_course_id),
  338. program_id: {{ $program_id }}
  339. },
  340. function(data) {
  341. //
  342. }
  343. );
  344. previous = this.value;
  345. }
  346. });
  347. })();
  348. // --------------------------------------------------------------------------
  349. // Events
  350. // --------------------------------------------------------------------------
  351. $('.go-to-temp').on('click', function() {
  352. $.post(
  353. "{{ URL::action('ThreeYearPlanController@createAnnualPlan', [$program_id]) }}", {
  354. typ_id: $('#table-cycles').data('typ-id')
  355. });
  356. window.location.href =
  357. "{{ URL::action('AnnualPlansController@showPlan', [$program_id]) }}";
  358. });
  359. // When list item is clicked, load corresponding info
  360. //section 1
  361. $('.list-group-item').on('click', function() {
  362. $('#three_year_button').hide();
  363. var id = $(this).data('cycle-id');
  364. $('#table-cycles').data('typ-id', id);
  365. $('#print_button').show();
  366. $('#print_button').attr("href",
  367. "{{ URL::action('ThreeYearPlanController@printPlan', [$program_id]) }}" +
  368. '/' + $(this).data('cycle-id'));
  369. $('#section1').show();
  370. $('#section2').hide();
  371. $('#section3').hide();
  372. var outcome_id_semester_code_program_id_box_id_typ_id = new Object();
  373. var outcome_id_semester_code_program_id_box_id_typ_id = Array();
  374. $.post(
  375. "{{ URL::action('ThreeYearPlanController@fetchThreeYears') }}", {
  376. id: id
  377. },
  378. function(json) {
  379. // Retrieve datatable instance
  380. var table = $('#table-cycles');
  381. var typ = json.typ;
  382. var year_start = json.typ.year_start;
  383. var year_end = json.typ.year_end;
  384. var semesters = json.typ.semesters;
  385. var program_id = {{ $program_id }};
  386. // var outcomes = already defined
  387. $('#cycle-display').parent().show();
  388. $('.no-cycle').parent().hide();
  389. //Display title and definition
  390. $('#cycle-display .panel-title').html('Planning for the years of ' +
  391. year_start + '-' + year_end);
  392. $('#cycle-display .cycle-definition').html(
  393. "Select the semesters which you would like to review an outcome in the three year plan of " +
  394. year_start + '-' + year_end + ".");
  395. //Empty table
  396. //table.clear();
  397. // Add new semesters
  398. //if(typ.length>0)
  399. //{
  400. $('table').show();
  401. $('#cycle1').html((parseInt(year_start)) + "-" + (parseInt(year_start) + 1));
  402. $('#cycle2').html((parseInt(year_start) + 1) + "-" + (parseInt(year_end) - 1));
  403. $('#cycle3').html((parseInt(year_end) - 1) + "-" + (parseInt(year_end)));
  404. $('#cycle_id').val(typ.id);
  405. //resets the checkboxes' name, clears marked, and disables them by default.
  406. $.each(outcomes, function(index, outcome) {
  407. $.each([1, 2, 3, 4, 5, 6], function(index, semester) {
  408. var id = outcome.id + "-sem" + semester;
  409. var new_name = id;
  410. document.getElementById(id).setAttribute("name",
  411. new_name);
  412. $("#" + id).attr("disabled", true);
  413. $("#" + id).prop("checked", false);
  414. });
  415. });
  416. var i = 1;
  417. $.each(outcomes, function(index, outcome) {
  418. $.each(semesters, function(index, semester) {
  419. var id = outcome.id + "-sem" + i;
  420. var new_name = outcome.id + "-sem" + semester.code;
  421. var checkbox = document.getElementById(id);
  422. checkbox.setAttribute("name", new_name);
  423. //enable the check box
  424. $("#" + id).removeAttr("disabled");
  425. //store checkboxes info in an array to later lookup which are marked
  426. var temp = Array(outcome.id, semester.code, program_id,
  427. id, typ.id);
  428. outcome_id_semester_code_program_id_box_id_typ_id.push(
  429. temp);
  430. i++;
  431. });
  432. i = 1;
  433. });
  434. //search which boxes are marked in the data-base
  435. $.post(
  436. "{{ URL::action('ThreeYearPlanController@lookup_typ_semester_outcome') }}", {
  437. info: (outcome_id_semester_code_program_id_box_id_typ_id)
  438. },
  439. function(data) {
  440. $.each(data.box_value, function(index, box_id_value) {
  441. var box_id = box_id_value[0];
  442. var value = box_id_value[1];
  443. if (1 == value) {
  444. $("#" + box_id).prop("checked", true);
  445. }
  446. });
  447. }
  448. );
  449. },
  450. 'json'
  451. );
  452. });
  453. });
  454. // go back to section 1
  455. $('.back-to-1').on('click', function(e) {
  456. window.scrollTo(0, 0);
  457. $(".panel-body").hide();
  458. $("#section1").show();
  459. });
  460. // go back to section 2
  461. $('.back-to-2').on('click', function(e) {
  462. window.scrollTo(0, 0);
  463. $(".panel-body").hide();
  464. $("#section2").show();
  465. });
  466. // go to section 2
  467. $('.go-to-2').on('click', function(e) {
  468. var not_enough = false;
  469. var i = 0;
  470. $('#table-cycles tbody tr').each(function() {
  471. $(this).find('th').each(function() {
  472. if ($(this).find('input').is(':checked')) {
  473. i = i + 1;
  474. }
  475. });
  476. if (i < 2) {
  477. not_enough = true;
  478. }
  479. i = 0;
  480. });
  481. if (not_enough == true) {
  482. alert("Each Learning Outcome must be evaluated in at least 2 semesters.");
  483. return true;
  484. }
  485. $(".panel-body").hide();;
  486. $("#section2").show();;
  487. var typ_id = $('#table-cycles').data('typ-id');
  488. $.post(
  489. "{{ URL::action('ThreeYearPlanController@section2_arrive') }}", {
  490. typ_id: (typ_id),
  491. program_id: {{ $program_id }}
  492. },
  493. function(data) {
  494. $('.objectives-section').empty();
  495. $.each(data, function(index, outcome) {
  496. var outcome_name = outcome.name;
  497. var outcome_id = outcome.id;
  498. $('.objectives-section').append('<hr>');
  499. var area = $('.courses-section-0').clone(true);
  500. area.attr('class', '');
  501. var title = outcome_name;
  502. //var title = 'Learning Outcome: ' + outcome_name;
  503. var title_area = $('.title-course-selection-0').clone(true);
  504. title_area.attr('class', 'title-course-selection h3');
  505. title_area.find('p').html(title);
  506. area.append(title_area);
  507. $.each(outcome.selected_semesters, function(index, semester) {
  508. var semester_name = semester.name;
  509. var semester_id = semester.semester_id;
  510. var select_area = $('.semester-course-selection-0').clone(true);
  511. select_area.attr('class', 'semester-course-selection');
  512. select_area.attr('style', ' ');
  513. select_area.find('.semester-label-course-selection-0').html(
  514. semester_name + "'s Objectives");
  515. var no_option = outcome_id + '-' + semester_id + '-n';
  516. select_area.find('option').val(no_option).html(
  517. 'Select an Objective');
  518. select_area.find('.add-objective-course').html(
  519. '<span class="glyphicon glyphicon-plus"></span> Choose more Objectives'
  520. );
  521. if (semester.available_objectives.length != 0) {
  522. select_area.find('.objective-selector-0 label').hide();
  523. $.each(semester.available_objectives, function(index,
  524. objective) {
  525. var objective_id = objective.id;
  526. var option_value = outcome_id + '-' + semester_id +
  527. '-' + objective_id;
  528. var option_name = objective.text;
  529. var new_option = select_area.find('.default-option')
  530. .clone(true);
  531. new_option.html(option_name);
  532. new_option.val(option_value);
  533. new_option.attr('class', 'select_objective');
  534. select_area.find('select').append(new_option);
  535. });
  536. }
  537. if (semester.available_objectives.length == 0) {
  538. select_area.find('select').prop('disabled', 'disabled');
  539. select_area.find('.objective-selector-0 label').html(
  540. 'There are no Objectives available for this Learning Outcome and Semester combination'
  541. );
  542. select_area.find('.objective-selector-0 select').hide();
  543. select_area.find('button').prop('disabled', 'disabled');
  544. }
  545. $.each(semester.selected_objectives, function(index, objective) {
  546. select_area.find('.objective-selector-0').hide();
  547. //si hay objetivos previamente seleccionados, escribirlos
  548. var objective_id = objective.id;
  549. var option_value = outcome_id + '-' + semester_id +
  550. '-' + objective_id;
  551. var new_select = select_area.find(
  552. '.objective-selector-0').clone(true);
  553. new_select.attr('class', 'objective-selector');
  554. new_select.find('select').val(option_value);
  555. select_area.find('.clone-objective-course-select-0')
  556. .before(new_select);
  557. select_area.find('.objective-selector').show();
  558. });
  559. area.append(select_area);
  560. });
  561. var footer = $('.footer-course-selection-0').clone(true);
  562. footer.attr('class', 'footer-course-selection');
  563. footer.find('p').html(
  564. '<b>Objective selection for this Learning Outcome is currently hidden.</b>'
  565. );
  566. area.append(footer);
  567. area.append('<br>');
  568. area.show(true);
  569. $('.objectives-section').append(area);
  570. });
  571. }
  572. );
  573. });
  574. // hide the options of an outcome in section 2 and 3
  575. $('.hide-course-selection').on('click', function(e) {
  576. $(this).parent().find('.show-course-selection').show();;
  577. $(this).hide();;
  578. $(this).parent().parent().find('.semester-course-selection').hide(333);
  579. $(this).parent().parent().find('.footer-course-selection').show(333);
  580. });
  581. // show the options of an outcome in section 2 and 3
  582. $('.show-course-selection').on('click', function(e) {
  583. $(this).parent().find('.hide-course-selection').show();
  584. $(this).hide();
  585. $(this).parent().parent().find('.semester-course-selection').show(333);
  586. $(this).parent().parent().find('.footer-course-selection').hide(333);
  587. });
  588. // in section 2 and 3, add selects for choosing more objectives and courses, respectively
  589. $('.add-objective-course').on('click', function(e) {
  590. var new_select = $(this).parent().parent().find('.objective-selector-0').clone(true);
  591. new_select.attr('class', 'objective-selector');
  592. new_select.show();
  593. $(this).parent().before(new_select);
  594. });
  595. // go to section 3
  596. $('.go-to-3').on('click', function(e) {
  597. window.scrollTo(0, 0);
  598. $(".panel-body").hide();;
  599. $("#section3").show();;
  600. var typ_id = $('#table-cycles').data('typ-id');
  601. $.post(
  602. "{{ URL::action('ThreeYearPlanController@section3_arrive') }}", {
  603. typ_id: (typ_id),
  604. program_id: {{ $program_id }}
  605. },
  606. function(data) {
  607. $('.courses-section').empty();
  608. $.each(data, function(index, outcome) {
  609. var outcome_name = outcome.name;
  610. var outcome_id = outcome.id;
  611. $('.courses-section').append('<hr>');
  612. var area = $('.courses-section-0').clone(true);
  613. area.attr('class', '');
  614. //var title = 'Outcome: ' + outcome_name;
  615. var title = outcome_name;
  616. var title_area = $('.title-course-selection-0').clone(true);
  617. title_area.attr('class', 'title-course-selection h3');
  618. title_area.find('p').html(title);
  619. area.append(title_area);
  620. $.each(outcome.selected_semesters, function(index, semester) {
  621. var semester_name = semester.name;
  622. var semester_id = semester.semester_id;
  623. var select_area = $('.semester-course-selection-0').clone(true);
  624. select_area.attr('class', 'semester-course-selection');
  625. select_area.attr('style', ' ');
  626. select_area.find('.semester-label-course-selection-0').html(
  627. semester_name);
  628. $.each(semester.selected_objectives, function(index, objective) {
  629. var objective_id = objective.objective_id;
  630. var objective_text = objective.text;
  631. var new_select = select_area.find(
  632. '.select-course-selection-0').clone(true);
  633. new_select.attr('class', 'select-course-selection');
  634. new_select.find('label').html('');
  635. new_select.find('.objective-selector-0').before(
  636. '<p>Objective: <b>' + objective_text +
  637. '</b></p>');
  638. {{-- new_select.find('.objective-selector-0 select').attr('style','width:100%;max-width:25%;'); --}}
  639. $.each(objective.available_courses, function(index,
  640. course) {
  641. var course_id = course.course_id;
  642. var option_value = outcome_id + '-' +
  643. semester_id + '-' + objective_id + '-' +
  644. course_id;
  645. var option_name = '[' + course.code + course
  646. .number + '] ' + course.name;
  647. var new_option = new_select.find(
  648. '.default-option').clone(true);
  649. new_option.html(option_name);
  650. new_option.val(option_value);
  651. new_option.attr('class', 'select_course');
  652. new_select.find('select').append(
  653. new_option);
  654. });
  655. if (objective.available_courses.length == 0) {
  656. new_select.find('.select-course-selection-0')
  657. .hide();
  658. new_select.find('select').prop('disabled',
  659. 'disabled');
  660. new_select.find('select label').html(
  661. ' Objective "' + objective_text +
  662. '" has no courses available for selection');
  663. new_select.find('button').prop('disabled',
  664. 'disabled');
  665. }
  666. $.each(objective.selected_courses, function(index,
  667. course) {
  668. new_select.find('.objective-selector-0')
  669. .hide();
  670. //si hay objetivos previamente seleccionados, escribirlos
  671. var course_id = course.course_id;
  672. var option_value = outcome_id + '-' +
  673. semester_id + '-' + objective_id + '-' +
  674. course_id;
  675. var new_selected_course = new_select.find(
  676. '.objective-selector-0').clone(true);
  677. new_selected_course.attr('class',
  678. 'objective-selector');
  679. new_selected_course.find('select').val(
  680. option_value);
  681. {{-- new_selected_course.find('label').html(''); --}}
  682. new_selected_course.show();
  683. new_select.find(
  684. '.clone-objective-course-select-0')
  685. .before(new_selected_course);
  686. });
  687. select_area.find('.select-course-selection-0').after(
  688. new_select);
  689. });
  690. if (semester.selected_objectives.length != 0) {
  691. select_area.find('.select-course-selection-0').hide();
  692. } else {
  693. select_area.find('select').prop('disabled', 'disabled');
  694. select_area.find('.objective-selector-0').html(
  695. 'There are no objectives selected for this semester');
  696. select_area.find('button').prop('disabled', 'disabled');
  697. }
  698. area.append(select_area);
  699. });
  700. var footer = $('.footer-course-selection-0').clone(true);
  701. footer.attr('class', 'footer-course-selection');
  702. area.append(footer);
  703. area.append('<br>');
  704. area.show(true);
  705. $('.courses-section').append(area);
  706. });
  707. }
  708. );
  709. });
  710. // remove an
  711. // remove an
  712. $('.delete-selection-0').on('click', function(e) {
  713. var options_values = $(this).parent().find('select').val().split('-');
  714. //if == 3 then we are in the objective selector
  715. if (options_values.length == 3) {
  716. //get count of all objective-selectors in the same semester, plus objective-selector-0
  717. var count_objective_selectors = $(this).parent().parent().find('.objective-selector').length;
  718. var count_objective_selectors_0 = $(this).parent().parent().find('.objective-selector-0').length;
  719. var count_objective_selectors_total = count_objective_selectors + count_objective_selectors_0;
  720. //view count of all objective-selectors in the same semester, plus objective-selector-0
  721. console.log(count_objective_selectors_total);
  722. //variable that holds value of wether the objective-selector-0 is hidden or not
  723. var objective_selector_0_hidden = $(this).parent().parent().find('.objective-selector-0').is(
  724. ':hidden');
  725. if (count_objective_selectors_total == 1 || (count_objective_selectors_total == 2 &&
  726. objective_selector_0_hidden)) {
  727. //if there is only one objective-selector,throw an alert and do nothing
  728. //html alert with dismiss button in the alert_placeholder div
  729. $('#alert_placeholder').html(
  730. '<div class="alert alert-danger alert-dismissible" role="alert"> <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button> <strong>Warning!</strong>You must have at least one Objective per Semester </div>'
  731. );
  732. return true;
  733. }
  734. //subtract 1 from count_objective_selectors_total
  735. var typ_id = $('#table-cycles').data('typ-id');
  736. var outcome_id = options_values[0];
  737. var semester_id = options_values[1];
  738. var new_objective_id = "nothing_selected";
  739. var previous_objective_id = options_values[2];
  740. if (previous_objective_id == 'n') {
  741. previous_objective_id = "nothing_selected";
  742. // with the next return, the post shouldnt excecute.
  743. // im leaving the assignment in the line before this one just in case.
  744. //check to see if parent is objective-selector-0
  745. var x = $(this).parent().parent().attr('class');
  746. if ($(this).parent().attr('class') == 'objective-selector-0') {
  747. // if it is then hide it
  748. $(this).parent().parent().hide();
  749. return true;
  750. }
  751. $(this).parent().remove();;
  752. return true;
  753. }
  754. $.post(
  755. "{{ URL::action('ThreeYearPlanController@section2_on_change') }}", {
  756. typ_id: (typ_id),
  757. previous_objective_id: (previous_objective_id),
  758. outcome_id: (outcome_id),
  759. semester_id: (semester_id),
  760. new_objective_id: (new_objective_id)
  761. },
  762. function(data) {
  763. //
  764. }
  765. );
  766. }
  767. //if == 4 then we are in the course selector
  768. else if (options_values.length == 4 || options_values == "nothing_selected") {
  769. //get count of all objective-selectors in the same semester, plus objective-selector-0
  770. var count_objective_selectors = $(this).parent().parent().find('.objective-selector').length;
  771. var count_objective_selectors_0 = $(this).parent().parent().find('.objective-selector-0').length;
  772. var count_objective_selectors_total = count_objective_selectors + count_objective_selectors_0;
  773. //view count of all objective-selectors in the same semester, plus objective-selector-0
  774. console.log(count_objective_selectors_total);
  775. //variable that holds value of wether the objective-selector-0 is hidden or not
  776. var objective_selector_0_hidden = $(this).parent().parent().find('.objective-selector-0').is(
  777. ':hidden');
  778. if (count_objective_selectors_total == 1 || (count_objective_selectors_total == 2 &&
  779. objective_selector_0_hidden)) {
  780. //if there is only one objective-selector,throw an alert and do nothing
  781. //html alert with dismiss button in the alert-placeholder div
  782. $('#alert_placeholder').html(
  783. '<div class="alert alert-danger alert-dismissible" role="alert"> <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button> <strong>Warning!</strong>You must have at least one Course </div>'
  784. );
  785. return true;
  786. }
  787. //subtract 1 from count_objective_selectors_total
  788. var typ_id = $('#table-cycles').data('typ-id');
  789. var outcome_id = options_values[0];
  790. var semester_id = options_values[1];
  791. var objective_id = options_values[2];
  792. var previous_course_id = options_values[3];
  793. var new_course_id = 'nothing_selected';
  794. $.post(
  795. "{{ URL::action('ThreeYearPlanController@section3_on_change') }}", {
  796. typ_id: (typ_id),
  797. previous_course_id: (previous_course_id),
  798. outcome_id: (outcome_id),
  799. semester_id: (semester_id),
  800. objective_id: (objective_id),
  801. new_course_id: (new_course_id)
  802. },
  803. function(data) {
  804. //
  805. }
  806. );
  807. }
  808. var x = $(this).parent().attr('class');
  809. if ($(this).parent().attr('class') == 'objective-selector-0') {
  810. // if it is then hide it
  811. $(this).parent().parent().hide();
  812. return;
  813. }
  814. //remove the select
  815. $(this).parent().remove();;
  816. });
  817. </script>
  818. @stop
  819. @section('included-js')
  820. @include('global._datatables_js')
  821. @stop
  822. @stop