@extends('layouts/ums_layout')
@section('title', '| New Activities')
@section('content')
<style type="text/css">
.sectionRequiredColor{border: 1px solid red;}
.capacityRequiredColor{border: 1px solid red;}
</style>

<div class="row add-data-form" id="addPanel" style="padding-bottom: 1%;">
  <div class="col-md-12">
    <div class="col-md-2"></div>
    <div class="col-md-8 fullbody">
      <div class="viewTitle" style="border-bottom: 1px solid white;">
        <a href="{{url('ums/studentCategorySettings/')}}" class="btn btn-info pull-right addViewBtn"><i class="glyphicon glyphicon-th-list viewIcon">
        </i>Section List</a>
      </div>
      <div class="panel panel-default panel-border">
        <div class="panel-heading">
          <div class="panel-title">Section Settings</div>
        </div>
        <div class="panel-body">
          <div class="row">
            <div class="col-md-12">
              <div class="col-md-8">
                {!! Form::open(array('url' => 'ums/saveSubSectionSetting', 'id' => 'sectionSettingsFrom', 'role' => 'form', 'class'=>'form-horizontal form-groups')) !!}

                <div class="form-group">
                  {!! Form::label('employeeId', 'Select Trimester:', ['class' => 'col-sm-3 control-label']) !!}
                  <div class="col-sm-9">
                    <select class ="form-control" id = "trimesterId" name="trimesterId">
                      <option value="">Select one</option>
                      @foreach($trimesters as $trimester)
                      <option value="{{$trimester->id}}">{{$trimester->name}}  {{$trimester->year}}</option>
                      @endforeach
                    </select>
                    <p id='employeeIde' style="max-height:3px;"></p>
                  </div>
                </div>

                <div class="form-group">
                  {!! Form::label('employeeId', 'Select program', ['class' => 'col-sm-3 control-label']) !!}
                  <div class="col-sm-9">
                    <select class ="form-control" id ="programtId" name="programId">
                      <option value="">Select one</option>
                      @foreach($programs as $program)
                      <option value="{{$program->id}}">{{$program->fullname}}</option>
                      @endforeach
                    </select>
                    <p id='employeeIde' style="max-height:3px;"></p>
                  </div>
                </div>
                
                <div class="form-group">
                  {!! Form::label('employeeId', 'Select Section', ['class' => 'col-sm-3 control-label']) !!}
                  <div class="col-sm-9">
                    <select class ="form-control" id ="sectionId" name="sectionId">
                      {{-- <option value="">Select one</option>
                      @foreach($sections as $section)
                      <option value="{{$section->id}}">{{$section->sectionName}}</option>
                      @endforeach --}}
                    </select>
                    <p id='employeeIde' style="max-height:3px;"></p>
                  </div>
                </div>

                <div class="form-group">
                  {!! Form::label('Total Section Students', 'Total Students:', ['class' => 'col-sm-3 control-label']) !!}
                  <div class="col-sm-9">
                    {!! Form::text('totalSectionStudent', $value = null, ['class' => 'form-control', 'id' => 'totalSectionStudent', 'disabled'=>'true','type' => 'text', 'placeholder' => 'Total Section Students']) !!}
                    <p id='namee' style="max-height:3px;"></p>
                  </div>
                </div>

                <div class="form-group sectionPart">
                  {!! Form::label('Add Sub Section Name', 'Add Sub Section Name:', ['class' => 'col-sm-3 control-label']) !!}
                  <div class="col-sm-4">
                    {!! Form::text('sectionName[]', $value = null, ['class' => 'form-control', 'id' => 'minCgpa', 'type' => 'text', 'required'=>'true', 'placeholder' => 'Section Name']) !!}
                    <p class='sectionRequiredClass' style="max-height:3px;color:red;display: none;">Please give correct input</p>
                  </div>
                  <div class="col-sm-4">
                    {!! Form::number('sectionCapacity[]', $value = null, ['class' => 'form-control', 'id' => 'minCgpa', 'type' => 'text', 'placeholder' => 'Total Capacity']) !!}
                    <p class='sectionCapacityRequiredClass' style="max-height:3px;color:red;display: none;">Please give correct input</p>
                  </div>
                </div>

                <div class="col-sm-3 AddBefore" style="float: right;">
                  <a id="addSectionButton" class="btn btn-info">Add More Section</a>
                </div>
                <div class="form-group">
                  {!! Form::label('submit', ' ', ['class' => 'col-sm-3 control-label']) !!}
                  <div class="col-sm-9 text-right">
                    {!! Form::submit('submit', ['id' => 'addStudentSettings', 'class' => 'btn btn-info']) !!}
                    {{ Form::reset('Reset', ['class' => 'btn btn-warning']) }}
                    <a href="#" class="btn btn-danger closeBtn">Close</a>
                    <span id="success" style="color:green; font-size:16px;" class="pull-right"></span>
                  </div>
                </div>
                {!! Form::close()  !!}
              </div>
              <div class="col-md-4 emptySpace vert-offset-top-4"><img src="{{ URL::to('/') }}/images/image15.png" width="90%" height="" style="float:right"></div>
            </div>
          </div>
        </div>
      </div>
      <div class="footerTitle" style="border-top:1px solid white"></div>
    </div>
    <div class="col-md-2"></div>
  </div>
</div>
@include('dataTableScript')
@endsection

<script src="{{asset('js/jquery-1.11.1.min.js')}}"></script>

<script type="text/javascript">
  $(document).ready(function(){


    $("#sectionId").change(function(){
     $.ajax({
      url: './getSectionCapacity/'+ $(this).val(),
      type: "GET",
      dataType: "json",
      success:function(data) {
       $("#totalSectionStudent").val(data);
     }
   });
   });

    $("#programtId").change(function(){
      var trimesterId = $("#trimesterId").val();
      $.ajax({
        url: './getProgramSections/'+ $(this).val() +"/"+ trimesterId,
        type: "GET",
        dataType: "json",
        success:function(data) {
          var rowHtml = '<option>Select Section</option>';
          for(var i in data)
          {
            console.log(data[i]);
            rowHtml += '<option value="'+data[i].id+'">'+data[i].sectionName+'</option>';
          }
          $("#sectionId").html(rowHtml);
        }
      });
    });


    $("#addSectionButton").click(function(){
      checkValidation();
    });

    function checkValidation()
    {
      var found = true;
      var totalStudent = $("#totalSectionStudent").val();
      var tempTotalStudent = 0;

      $('input[name="sectionName[]"]').map(function () {
        if(this.value=="")
        {
          $(this).addClass("sectionRequiredColor");
          $(this).next('p').show();
          found = false;
          return false;
        }
        else
        {
         $(this).removeClass("sectionRequiredColor");
         $(this).next('p').hide();
         found = true;
         $('input[name="sectionCapacity[]"]').map(function () {
          if(this.value=="")
          {
            $(this).addClass("capacityRequiredColor");
            $(this).next('p').show();
            found = false;
            return false;
          }
          else
          {
            $(this).removeClass("capacityRequiredColor");
            $(this).next('p').hide();
            found = true;
          }
        }).get();
       }
     }).get();

      if(found === true)
      {
       $('input[name="sectionCapacity[]"]').map(function () {
        tempTotalStudent = parseInt(tempTotalStudent)+ parseInt(this.value);
      }).get();
       if(parseInt(tempTotalStudent)>totalStudent)
       {
        swal("Total Student exceeds","Total Student Exceeds Section Students","error");
        return false;
      }
      else
      {
        var html = '<div class="form-group sectionPart"><label for="Add Section Name" class="col-sm-3 control-label"></label><div class="col-sm-4"><input class="form-control sectionControll" id="minCgpa" type="text" placeholder="Section Name" name="sectionName[]"> <p class="sectionRequiredClass" style="max-height:3px;color:red;display: none;">Please give correct input</p></div><div class="col-sm-4"><input class="form-control capacityControl" id="minCgpa" type="number" placeholder="Total Capacity" name="sectionCapacity[]"> <p class="sectionCapacityRequiredClass" style="max-height:3px;color:red;display: none;">Please give correct input</p></div><div class="col-sm-1" style="margin-top: 8px;"><a style="color:red" class="deleteIcone" href="#" data-id="2"><span class="glyphicon glyphicon-trash"></span></a></div></div>';
        $(html).insertBefore(".AddBefore");
        return true;
      }
    }
  }

  $("#sectionSettingsFrom").on('click', 'span', function(event) 
  {
    $(this).closest('.form-group').remove();
  });

  $(".edit-modal").click(function(){
     //if(hasAccess('editProgramStructure')){
      var studentCategoryId = $(this).data('id');
      $('#footer_action_button_dismis').text(" Close");
      $('#footer_action_button_dismis').addClass('glyphicon glyphicon-remove');
      $('.deleteContent').hide();
      $('.form-horizontal').show();
      $.ajax({
        url: './getStudentCategoryInfo/'+ studentCategoryId,
        type: "GET",
        dataType: "json",
        success:function(data) {
         $('select[name="studentType"]').val(data.studentType);
         $('input[name="minCgpa"]').val(data.minCgpa);
         $('input[name="activitiesName"]').val(data.activitiesName);
         $('input[name="trimesterGapCount"]').val(data.trimesterGapCount);
         $('input[name="maxFailedCount"]').val(data.maxFailedCount);
         $('input[name="requiredYearCount"]').val(data.requiredYearCount);
         $('input[name="outdatedYearCount"]').val(data.outdatedYearCount);
         var input = $('<input type="hidden" name="id" id="studentCategoryId" value="'+studentCategoryId+'">');
         $('#studentCategorySettingsFrom').append(input);
         $('#studentCategoryId').val(studentCategoryId);
         $("#studentCategorySettingsFrom").attr("action", "{{url('/ums/updateStudentCategorySettings')}}");
         $("#addStudentSettings").val('Update');
         $(".panel-title").html('Update Student Category Settings');
         $("#addPanel").show();
         $("#tableData").hide();
       }
     });
   // }
 });

  $("#addViewBtn").click(function(){
    $("#tableData").hide();
    $("#addPanel").show();
    $("#studentCategorySettingsFrom")[0].reset();
    $('#studentCategoryId').remove();
    $("#studentCategorySettingsFrom").attr("action", "{{url('/ums/SaveStudentCategorySettings')}}");
    $("#addStudentSettings").val('Submit');
    $(".panel-title").html('Save');
  });

  $("#activitiesListButton").click(function(){
    $("#tableData").show();
    $("#addPanel").hide();
  });

  $(".closeBtn").click(function(){
   $("#tableData").show();
   $("#addPanel").hide();
 });

});
</script>