<div class="right_col mt-sm-3" role="main">
  <!-- assessment create page content starts-->
  <div class="row main_row">
    <div class="x_panel form_panel">
      <div class="x_title">
        <h2 class="title-text">Edit Homework </h2>
      </div>
      <div class="x_content">
        <form id="storeAssessment" action="/assessments/update" method="post" class="form-horizontal form-label-left assessment-main-block">
          <input type="hidden" name="assessment_id" value="<%=assessment.id%>">
          <div class="row">
            <div class="col-md-4">
              <div class="form-group">
                <label class="col-form-label label-align" for="assessment">Homework Name<span
                    class="required">*</span>
                </label>
                <div class="input-group">
                  <span class="input-group-text"><img src="/images/assessment.svg" class="mCS_img_loaded"></span>
                  <input type="text" name="name" class="form-control"  autocomplete="off" id="assessment_name" placeholder="Assessment Name" value="<%=assessment.name%>">
                </div>
              </div>
            </div>

            <% if(loggedUserInfo.role == 1) { %>
              <div class="col-md-4">
                <div class="form-group">
                  <label class="col-form-label label-align" for="tutor_id">Tutor <span class="required">*</span>
                  </label>
                  <div class="input-group">
                    <span class="input-group-text"><img src="/images/student.svg" class="mCS_img_loaded"></span>
                    <select class="form-control select2" name="tutor_id" id="tutor" tabindex="-1" single>
                      <option value="">Select Tutor</option>
                      <% for(tutor of tutors) { %>
                        <option value="<%=tutor.id%>" <% if (assessment.tutor_id == tutor.id) { %> selected <% } %>>
                          <%=tutor.first_name+' '+tutor.last_name %>
                        </option>
                        <% } %>
                    </select>
                  </div>
                </div>
              </div>
              <% } %>


            <div class="col-md-4">
              <div class="form-group">
                <label class="col-form-label label-align" for="student_id">Students <span class="required">*</span>
                </label>
                <div class="input-group">
                  <span class="input-group-text"><img src="/images/student.svg" class="mCS_img_loaded"></span>
                  <select class="form-control select2" name="student_ids[]" id="student_id" tabindex="-1" data-placeholder="Select Students" multiple>
                    <% for(student of students) { %>
                      <option value="<%=student.id%>" <% if (assessment.student_ids.includes(student._id)) { %> selected <% } %>>
                        <%=student.first_name+' '+student.last_name %>
                      </option>
                      <% } %>
                  </select>
                </div>
              </div>
            </div>

            <div class="col-md-4 col-lg-4">
              <div class="form-group">
                <label class="col-form-label label-align" for="date">Date<span class="required">*</span>
                </label>
                <div class="input-group">
                  <span class="input-group-text"><img src="/images/date.svg" class="mCS_img_loaded"></span>
                  <input type="text" name="date" class="form-control" placeholder="Enter Date" id="datepicker" value="<%=assessment.date%>">
                </div>
              </div>
            </div>
            
            <div class="col-md-4 col-lg-4">
              <div class="form-group">
                <label class="col-form-label label-align" for="assessment_type">Task Type <span
                    class="required">*</span>
                </label>
                <div class="input-group">
                  <span class="input-group-text"><img src="/images/courses.svg" class="mCS_img_loaded"></span>
                  <select class="form-control select2" id="assessment_type"   name="task_types"  tabindex="-1" multiple>
                    <option value="1" <% if (assessment.task_types.includes(1)) { %> selected <% } %>>Practices</option>
                    <option value="2" <% if (assessment.task_types.includes(2)) { %> selected <% } %>>Challenges</option>
                  </select>
                </div>
              </div>
            </div>

            <div class="col-md-4 col-lg-4">
              <div class="form-check">
                <input class="form-check-input" type="checkbox" name="apply_duration" value="1" id="flexCheckChecked"  <% if (assessment.apply_duration == true) { %> checked <% } %> >
                <label class="form-check-label" for="apply_duration">
                  Apply Duration
                </label>
              </div>
            </div>
            
          </div>
            <div class="row content_form">
                <div class="col-md-4">
                  <div class="form-group">
                    <label class="col-form-label label-align" for="select_lesson">Grade <span class="required">*</span>
                    </label>
                    <div class="input-group">
                      <span class="input-group-text"><img src="/images/courses.svg" class="mCS_img_loaded"></span>
                      <select class="form-control select2" data-placeholder="Select A Grade" id="sc_grade" tabindex="-1" single>
                        <option value="">Select Grade</option>
                        <% for(grade of activeGrades) { %>
                          <option value="<%=grade.id%>">
                            <%=grade.name%>
                          </option>
                          <% } %>
                      </select>
                    </div>
                  </div>
                </div>
                <div class="col-md-4">
                  <div class="form-group">
                    <label class="col-form-label label-align" for="select_lesson">Topic <span class="required">*</span>
                    </label>
                    <div class="input-group">
                      <span class="input-group-text"><img src="/images/courses.svg" class="mCS_img_loaded"></span>
                      <select class="form-control select2" data-placeholder="Select A Topic" id="sc_topic" tabindex="-1" single>
                        <option value="">Select Topic</option>
                        <% for(topic of activeTopics) { %>
                          <option value="<%=topic.id%>">
                            <%=topic.name%>
                          </option>
                          <% } %>
                      </select>
                    </div>
                  </div>
                </div>
                <div class="col-md-4">
                  <div class="form-group">
                    <label class="col-form-label label-align" for="select_lesson">Sub Topic<span class="required">*</span>
                    </label>
                    <div class="input-group">
                      <span class="input-group-text"><img src="/images/courses.svg" class="mCS_img_loaded"></span>
                      <select class="form-control select2" data-placeholder="Select Sub Topic" id="sc_sub_topic" tabindex="-1" single>
                        <option value="">Select A Topic</option>
                        <!-- <% for(topic of activeTopics) { %>
                          <option value="<%=topic.id%>">
                            <%=topic.name%>
                          </option>
                          <% } %> -->
                      </select>
                    </div>
                  </div>
                </div>
                <div class="col-md-4">
                  <div class="form-group">
                    <label class="col-form-label label-align" for="select_lesson">Learning Content <span class="required">*</span>
                    </label>
                    <div class="input-group">
                      <span class="input-group-text"><img src="/images/courses.svg" class="mCS_img_loaded"></span>
                      <select class="form-control select2" data-placeholder="Select Learning Content" id="assignedLearningContents" tabindex="-1" single>
                        <option value="">Select Learning Content</option>
                        <!-- <% for(learningContent of learningContents){ %>
                          <option value="<%=learningContent._id%>">
                            <%=learningContent.title%>
                          </option>
                          <% } %> -->
                      </select>
                    </div>
                  </div>
                </div>
                <div class="col-md-4">
                  <div class="form-group">
                    <label class="col-form-label label-align" for="select_lesson">Lessons<span class="required">*</span>
                    </label>
                    <div class="input-group">
                      <span class="input-group-text"><img src="/images/courses.svg" class="mCS_img_loaded"></span>
                      <select class="form-control select2" data-placeholder="Select Lessons" id="assignedLessons" tabindex="-1"
                        multiple>
                      </select>
                    </div>
                  </div>
                </div>
                <div class="col-md-4">
                  <div class="form-group">
                    <label class="col-form-label label-align" for="assessment_option">Content<span
                        class="required">*</span>
                    </label>
                    <div class="input-group">
                      <span class="input-group-text"><img src="/images/courses.svg" class="mCS_img_loaded"></span>
                      <select class="form-control select2 challenges" data-placeholder="Select Content" id="assessment_content"
                        tabindex="-1" multiple>
                        
                      </select>
                    </div>
                  </div>
                </div>
                <div class="col-md-4">
                  <label class="d-block">&nbsp;</span>
                  </label>
                  <button type="button" class="content-submit theme-btn" id="add_content">Add Content</button>
                </div>
            </div>
            <div class="row">
              <div class="col-md-12 mt-4">
                <h2 class="title-text fn-16">Homework Content</h2>
              </div>
              <div class="col-sm-12">
                <ul class="selectedcontent sortable select-assessment" id="select-assessment">
                    <% if(assessment.content.length > 0) { 
                        let contentIndex = 0;
                    %>
                    <% for(content of assessment.content) {  
                      let learningContentId = content.learning_content_id.id;
                    %>
                      <% for(let lesson of content.lessons) {  %>
                        <% if(lesson.practice_ids.length > 0 ){ %>
                              <% for(let practices of lesson.practice_ids) { %>
                                  <li class="sort-program list-<%=practices.original_id%>" data-content-position="<%=contentIndex%>">
                                    <div class="iconleft"><img src="/images/lesson.svg" alt="img"></div>
                                    <div class="content-detail-block">
                                      <ol class="breadcrumb">
                                        <li class="breadcrumb-item 3"><%=lesson.lesson_id.title%></li>
                                        <li class="breadcrumb-item 4"><%=practices.question_title%></li>
                                      </ol>
                                    </div>
                                    <div class="action-right">
                                        <a class="remove_content" href="javascript:void(0);">×</a>
                                    </div>
                                    <input type="hidden" name="original_id" class="original_id" value="<%=practices.original_id%>">
                                    <input type="hidden" name="selected_contents[]" value="<%=learningContentId%>--<%=lesson.lesson_id.id%>--practice--<%=practices.id%>">
                                  </li> 
                              <% }%>
                            <% } %>
                            <% if(lesson.challenges_ids.length > 0 ){ %>
                              <% for(let challenge of lesson.challenges_ids) { %>
                                  <li class="sort-program list-<%=challenge.original_id%>" data-content-position="<%=contentIndex%>">
                                    <div class="iconleft"><img src="/images/lesson.svg" alt="img"></div>
                                    <div class="content-detail-block">
                                      <ol class="breadcrumb">
                                        <li class="breadcrumb-item 3"><%=lesson.lesson_id.title%></li>
                                        <li class="breadcrumb-item 4"><%=challenge.title%></li>
                                      </ol>
                                    </div>
                                    <div class="action-right">
                                        <a class="remove_content" href="javascript:void(0);">×</a>
                                    </div>
                                    <input type="hidden" name="original_id" class="original_id" value="<%=challenge.original_id%>">
                                    <input type="hidden" name="selected_contents[]" value="<%=content.id%>--<%=lesson.lesson_id.id%>--challenge--<%=challenge.id%>">
                                  </li>
                                  <% }%>
                            <% } %>
                      <% }%>
                    <% } }%>
                </ul>
              </div>
            </div>
          <div class="ln_solid"></div>
          <div class="text-right">
            <button type="submit" id="storeAssessmentBtn" class="btn theme-btn" >Update</button>
          </div>
        </form>
      </div>
    </div>
  </div>
  <!-- assessment create page content end -->
</div>

<script
  src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.47/js/bootstrap-datetimepicker.min.js"></script>
  <%- include('./partials/create_script'); %>
