function loadupdatetimetable() {
  $("#page_main_div").load(
    "../html_modules/updatetimetable.html?",
    function () {
      document.getElementById("display_module_name").innerHTML =
        "Class Timetable";
      document.getElementById("module_name_for_save").value = "Class Timetable";
      getDefaultHeadFooterLinks("Class Timetable");
    }
  );
  loadtimetabledegree();
}

function viewTimeTableData() {
  let degree = document.getElementById("degree").value;
  let sem = document.getElementById("sem").value;
  let section = document.getElementById("section").value;

  if (degree == "") {
    alert("Select Degree");
    return;
  }

  if (sem == "") {
    alert("Select Semester");
    return;
  }

  if (window.db !== "jssu") {
    if (section == "") {
      alert("Select Section");
      return;
    }
  }

  let param = "&degree=" + degree + "&sem=" + sem + "&section=" + section;

  $.ajax({
    type: "POST",
    data: param,
    url: $host_url + "viewTimeTableData",
    success: function (response) {
      var res = JSON.parse(response);

      var tabledata = `<table align="center" width="100%" cellspacing="0" cellpadding="1" border="1" style="border-radius:5px">
      <tbody>
        <tr class="ui-state-default ui-jqgrid-hdiv">
        <th align="center" style="width:100px; font-size:12px; 
         border-left:1px solid #C5DBEC;border-right:1px solid #C5DBEC; 
         border-bottom:1px solid #C5DBEC;">Day</th>

         <th align="center" style="width:100px; font-size:12px; padding:5px 5px; 
         border-right:1px solid #C5DBEC; border-bottom:1px solid #C5DBEC;">Period</th>

         <th align="center" style="width:100px; font-size:12px; padding:5px 5px; 
         border-right:1px solid #C5DBEC; border-bottom:1px solid #C5DBEC;">No. of Classes</th>
         
         <th align="center" style="width:100px; font-size:12px; padding:5px 5px; 
         border-right:1px solid #C5DBEC; border-bottom:1px solid #C5DBEC;">Time</th>

         <th align="center" style="width:60; font-size:12px; padding:5px 5px; 
         border-right:1px solid #C5DBEC; border-bottom:1px solid #C5DBEC;">Subject</th>

         <th align="center" style="width:70px; font-size:12px; padding:5px 5px; 
         border-right:1px solid #C5DBEC; border-bottom:1px solid #C5DBEC;">Teacher</th>

         <th align="center" style="width:70px; font-size:12px; padding:5px 5px; 
         border-right:1px solid #C5DBEC; border-bottom:1px solid #C5DBEC;">Action</th>

        </tr>`;

      if (res.error_code == 0) {
        tabledata += `<tr class="ui-widget-content jqgrow">
            <td class="tbl_row_new" style="border-left:1px solid #C5DBEC; border-right:1px solid #C5DBEC; padding:2px; font-size:12px;text-align:center;"><select
            id="day"
            class="InputTextEnabled"
            style="width: 100%; height: 25px"
          >
            <option value="">--Select--</option>
            <option value="Monday">Monday</option>
            <option value="Tuesday">Tuesday</option>
            <option value="Wednesday">Wednesday</option>
            <option value="Thursday">Thursday</option>
            <option value="Friday">Friday</option>
            <option value="Saturday">Saturday</option>
            <option value="Sunday">Sunday</option>
          </select></td>

            <td class="tbl_row_new" style=" text-align:initial; border-right:1px solid #C5DBEC; padding:2px; font-size:12px;"><select
            id="period"
            class="InputTextEnabled"
            style="width: 100%; height: 25px"
          >
            <option value="">--Select--</option>
            <option value="1">1</option>
            <option value="2">2</option>
            <option value="3">3</option>
            <option value="4">4</option>
            <option value="5">5</option>
            <option value="6">6</option>
            <option value="7">7</option>
            <option value="8">8</option>
          </select></td>

            <td class="tbl_row_new" style="text-align:center !important; border-right:1px solid #C5DBEC; padding:2px; font-size:12px;"><select
            id="noclass"
            class="InputTextEnabled"
            style="width: 100%; height: 25px"
          >
            <option value="">--Select--</option>
            <option value="1">1</option>
            <option value="2">2</option>
            <option value="3">3</option>
            <option value="4">4</option>
            <option value="5">5</option>
          </select></td>

          <td class="tbl_row_new" style="text-align:center !important; text-align:initial; border-right:1px solid #C5DBEC; padding:2px; font-size:12px;">
            <input type = 'text' id="time" style="width: 100px; height: 25px"></td>

            <td class="tbl_row_new" style="text-align:center !important; text-align:initial; border-right:1px solid #C5DBEC; padding:2px; font-size:12px;">
            <select id="subject" style="width: 200px; height: 25px"></select></td>

            <td class="tbl_row_new" style="text-align:center !important;border-right:1px solid #C5DBEC; padding:2px; font-size:12px;">
            <select id="teacher" style="width: 200px; height: 25px"></select></td>

            <td class="tbl_row_new" style="text-align:center; border-right:1px solid #C5DBEC; padding:2px; font-size:12px;">
              <span
            style="
              background-color: #008cba;
              border: none;
              color: white;
              padding: 5px 20px;
              text-align: center;
              text-decoration: none;
              display: inline-block;
              font-size: 12px;
              cursor: pointer;
            "
            onclick="saveClassTimeTable()"
            >Save</span>
            </td>`;
        tabledata += `</tr>`;

        tabledata += `</table>`;
        $("#dettab").html(tabledata);

        var suboptions = "";
        suboptions = "<option value=''>---Select Subject---</option>";

        for (var i = 0; i < res.data.sub.length; i++) {
          suboptions += `<option value='${res.data.sub[i].fsubcode}'>${res.data.sub[i].fsubcode} - ${res.data.sub[i].fsubname}</option>`;
        }
        $("#subject").html(suboptions);

        var teachoptions = "";
        teachoptions = "<option value=''>---Select Teacher---</option>";

        for (var i = 0; i < res.data.teach.length; i++) {
          teachoptions += `<option value='${res.data.teach[i].fteachcode}'>${res.data.teach[i].fteachcode} - ${res.data.teach[i].fteachname}</option>`;
        }
        $("#teacher").html(teachoptions);
      }

      var slno = 1;

      var table = `<table align="center" width="100%" cellspacing="0" cellpadding="1" border="1" style="border-radius:5px">
      <tbody>
        <tr>
        <th align="left" colspan="10" class="ui-jqgrid-titlebar ui-widget-header ui-corner-tl ui-corner-tr ui-helper" 
        style="font-size:12px; padding-left:6px; height:24px;">Class Timetable</th>
        </tr>

        <tr class="ui-state-default ui-jqgrid-hdiv">
        <th align="center" style="width:30px; font-size:12px; 
         border-left:1px solid #C5DBEC;border-right:1px solid #C5DBEC; 
         border-bottom:1px solid #C5DBEC;">Sl. No.</th>

         <th align="center" style="width:350px; font-size:12px; padding:5px 5px; 
         border-right:1px solid #C5DBEC; border-bottom:1px solid #C5DBEC;">Teacher</th>

         <th align="center" style="width:350px; font-size:12px; padding:5px 5px; 
         border-right:1px solid #C5DBEC; border-bottom:1px solid #C5DBEC;">Subject</th>

         <th align="center" style="width:60; font-size:12px; padding:5px 5px; 
         border-right:1px solid #C5DBEC; border-bottom:1px solid #C5DBEC;">Degree</th>

         <th align="center" style="width:70px; font-size:12px; padding:5px 5px; 
         border-right:1px solid #C5DBEC; border-bottom:1px solid #C5DBEC;">Semester</th>

        <th align="center" style="width:30px; font-size:12px; 
        border-right:1px solid #C5DBEC; border-bottom:1px solid #C5DBEC;">Section</th>

        <th align="center" style="width:30px; font-size:12px; padding:5px 5px; 
         border-right:1px solid #C5DBEC; border-bottom:1px solid #C5DBEC;">Day</th>

        <th align="center" style="width:30px; font-size:12px;  
        border-right:1px solid #C5DBEC; border-bottom:1px solid #C5DBEC;">Period</th>
        <th align="center" style="width:30px; font-size:12px;  
        border-right:1px solid #C5DBEC; border-bottom:1px solid #C5DBEC;">No. of Class</th>
        <th align="center" style="width:30px; font-size:12px;  
        border-right:1px solid #C5DBEC; border-bottom:1px solid #C5DBEC;">Action</th>
        </tr>`;

      if (res.data.tab.length != 0) {
        for (var i = 0; i < res.data.tab.length; i++) {
          table += `<tr class="ui-widget-content jqgrow">
            <td class="tbl_row_new" style="border-left:1px solid #C5DBEC; border-right:1px solid #C5DBEC; padding:2px; font-size:12px;text-align:center;">${slno++}</td>

            <td class="tbl_row_new" style=" text-align:initial; border-right:1px solid #C5DBEC; padding:2px; font-size:12px;">${
              res.data.tab[i].fteachcode
            } - ${res.data.tab[i].fteachname}</td>

            <td class="tbl_row_new" style="text-align:center !important; border-right:1px solid #C5DBEC; padding:2px; font-size:12px;">${
              res.data.tab[i].fsubcode
            } - ${res.data.tab[i].fsubname}</td>

            <td class="tbl_row_new" style="text-align:center !important; text-align:initial; border-right:1px solid #C5DBEC; padding:2px; font-size:12px;">${
              res.data.tab[i].fdegree
            }</td>

            <td class="tbl_row_new" style="text-align:center !important;border-right:1px solid #C5DBEC; padding:2px; font-size:12px;">${
              res.data.tab[i].fsem
            }</td>

            <td class="tbl_row_new" style="text-align:initial;border-right:1px solid #C5DBEC; padding:2px; font-size:12px;text-align:center;">${
              res.data.tab[i].fsection
            }</td>


            <td class="tbl_row_new" style="text-align:center; border-right:1px solid #C5DBEC; padding:2px; font-size:12px;">${
              res.data.tab[i].fday
            }</td>
            <td class="tbl_row_new" style="text-align:center; border-right:1px solid #C5DBEC; padding:2px; font-size:12px;">${
              res.data.tab[i].fperiod
            }</td>
            <td class="tbl_row_new" style="text-align:center; border-right:1px solid #C5DBEC; padding:2px; font-size:12px;">${
              res.data.tab[i].fnoclass
            }</td>
            <td class="tbl_row_new" style="text-align:center; border-right:1px solid #C5DBEC; padding:2px; font-size:12px;">
              <span
            style="
              background-color: red;
              border: none;
              color: white;
              padding: 5px 20px;
              text-align: center;
              text-decoration: none;
              display: inline-block;
              font-size: 12px;
              cursor: pointer;
            "
            onclick="deleteClassTimeTable('${res.data.tab[i].fdegree}','${
            res.data.tab[i].fsem
          }','${res.data.tab[i].fsection}','${res.data.tab[i].fday}','${
            res.data.tab[i].fperiod
          }','${res.data.tab[i].fnoclass}')"
            >Delete</span>
            <span
            style="
              background-color: green;
              border: none;
              color: white;
              padding: 5px 20px;
              text-align: center;
              text-decoration: none;
              display: inline-block;
              font-size: 12px;
              cursor: pointer;
            "
            onclick="editClassTimeTable('${res.data.tab[i].fdegree}','${
            res.data.tab[i].fsem
          }','${res.data.tab[i].fsection}','${res.data.tab[i].fday}','${
            res.data.tab[i].fperiod
          }','${res.data.tab[i].fnoclass}',
              '${res.data.tab[i].fteachcode}','${res.data.tab[i].fsubcode}','${
            res.data.tab[i].ftime
          }')"
            >Edit</span>
            </td>`;
          table += `</tr>`;
        }
      } else {
        table += `<tr  class="ui-widget-content jqgrow">
        <td colspan="10" class="tbl_row_new" style="border-left:1px solid #C5DBEC; border-right:1px solid #C5DBEC; padding:2px; font-size:12px;text-align:center;">
        No Data Found</td></tr>`;
      }
      table += `</table>`;
      $("#classtab").html(table);
    },
  });
}

function loadtimetabledegree() {
  $.ajax({
    type: "POST",
    url: $host_url + "loadtimetabledegree",
    success: function (response) {
      var res = JSON.parse(response);
      console.log(res);
      var degreeoptions = "";
      degreeoptions = "<option value=''>---Select Degree---</option>";

      for (var i = 0; i < res.data.deg.length; i++) {
        degreeoptions += `<option value='${res.data.deg[i].fdegree}'>${res.data.deg[i].fdegree} - ${res.data.deg[i].fdescpn}</option>`;
      }
      $("#degree").html(degreeoptions);
    },
  });
}

function loadtimetablesem() {
  let degree = document.getElementById("degree").value;
  $.ajax({
    type: "POST",
    data: "&degree=" + degree,
    url: $host_url + "loadtimetablesemname",
    success: function (response) {
      var res = JSON.parse(response);
      var semoptions = "";
      semoptions = "<option value=''>---Select Semester---</option>";

      for (var i = 0; i < res.data.length; i++) {
        semoptions += `<option value='${res.data[i].fexamno}'>${res.data[i].fexamno} - ${res.data[i].fexamname}</option>`;
      }
      $("#sem").html(semoptions);
    },
  });
}

function loadtimetablesection() {
  let degree = document.getElementById("degree").value;
  let sem = document.getElementById("sem").value;

  $.ajax({
    type: "POST",
    data: "&degree=" + degree + "&sem=" + sem,
    url: $host_url + "loadtimetablesection",
    success: function (response) {
      var res = JSON.parse(response);

      var secoptions = "";
      secoptions = "<option value=''>---Select Section---</option>";

      for (var i = 0; i < res.data.length; i++) {
        secoptions += `<option value='${res.data[i].fsection}'>${res.data[i].fsection}</option>`;
      }
      $("#section").html(secoptions);
    },
  });
}

function saveClassTimeTable() {
  let degree = document.getElementById("degree").value;
  let sem = document.getElementById("sem").value;
  let section = document.getElementById("section").value;
  let day = document.getElementById("day").value;
  let period = document.getElementById("period").value;
  let noclass = document.getElementById("noclass").value;
  let subject = document.getElementById("subject").value;
  let teacher = document.getElementById("teacher").value;
  let time = document.getElementById("time").value;

  if (degree == "") {
    alert("Select Degree");
    return;
  }

  if (sem == "") {
    alert("Select Semester");
    return;
  }

  if (section == "") {
    alert("Select Section");
    return;
  }

  if (day == "") {
    alert("Select Day");
    return;
  }

  if (period == "") {
    alert("Select Period");
    return;
  }

  if (noclass == "") {
    alert("Select No. of Classes");
    return;
  }

  if (time == "") {
    alert("Enter Time");
    return;
  }

  if (subject == "") {
    alert("Select Subject");
    return;
  }

  if (teacher == "") {
    alert("Select Teacher");
    return;
  }

  let param =
    "&degree=" +
    degree +
    "&sem=" +
    sem +
    "&section=" +
    section +
    "&day=" +
    day +
    "&period=" +
    period +
    "&noclass=" +
    noclass +
    "&subject=" +
    subject +
    "&teacher=" +
    teacher +
    "&time=" +
    time;

  $.ajax({
    type: "POST",
    data: param,
    url: $host_url + "saveClassTimeTable",
    success: function (response) {
      var res = JSON.parse(response);
      if (res.error_code == 0) {
        alert(res.data.msg);
        viewTimeTableData();
      } else {
        alert(res.data.msg);
        return;
      }
    },
  });
}

function deleteClassTimeTable(degree, sem, section, day, period, noclass) {
  let param =
    "&degree=" +
    degree +
    "&sem=" +
    sem +
    "&section=" +
    section +
    "&day=" +
    day +
    "&period=" +
    period +
    "&noclass=" +
    noclass;

  if (confirm("Are You Sure....!!") == true) {
    $.ajax({
      type: "POST",
      data: param,
      url: $host_url + "deleteClassTimeTable",
      success: function (response) {
        var res = JSON.parse(response);
        if (res.error_code == 0) {
          alert(res.data.msg);
          viewTimeTableData();
        } else {
          alert(res.data.msg);
          return;
        }
      },
    });
  } else {
    return;
  }
}

function editClassTimeTable(
  degree,
  sem,
  section,
  day,
  period,
  noclass,
  teach,
  sub,
  time
) {
  $("#degree").val(degree);
  $("#sem").val(sem);
  $("#section").val(section);
  $("#day").val(day);
  $("#period").val(period);
  $("#noclass").val(noclass);
  $("#subject").val(sub);
  $("#teacher").val(teach);
  $("#time").val(time);

  $("#degree").attr("disabled", "disabled");
  $("#sem").attr("disabled", "disabled");
  $("#section").attr("disabled", "disabled");
  $("#day").attr("disabled", "disabled");
  $("#period").attr("disabled", "disabled");
  $("#noclass").attr("disabled", "disabled");
}

function reportcount() {
  var d = new Date();

  var strDate = d.getFullYear() + "-" + (d.getMonth() + 1) + "-" + d.getDate();

  var parameters = "&strDate=" + strDate;

  window.open($host_url + "reportAttCount" + parameters);
}