@extends('layouts.master')

@section('navigation')
    @if(Auth::user()->role==1)
        @include('local.managers.admins._navigation')
    @elseif(Auth::user()->role==2)
        @include('local.managers.sCoords._new_navigation')
    @elseif(Auth::user()->role==3)
        @include('local.managers.pCoords._new_navigation')
    @endif
@stop

@section('main')

    <div class="row">
        <div class="col-md-12">
            <p>Click on the values you want to change. Invalid values will be rejected automatically. To save your changes, click the 'Save' button at the bottom of the page.</p>
            <table class="table table-striped table-condensed editable-table" id='outcomes_table'>
                <thead><tr class="center-text">
                    <th class="col-md-4">Learning Outcome</th>
                    <th class="col-md-7">Definition</th>
                    <th class="col-md-1">Expected Value</th>
                    <th class="col-md-2">Activation date</th>
                    <th class="col-md-2">Deactivation date</th>
                    <th class="col-md-1">Level</th>

                </thead>
                <tbody>
                  @foreach ($outcomes as $outcome)
                    {{-- @foreach ($semesters as $semester) --}}
                      {{-- display an outcome only if it is part of a currently selected semester --}}
                      @if ((($outcome->deactivation_date == '0000-00-00') or ($outcome->deactivation_date == ''))
                            // and ($outcome->activation_date >= $semester->start && $outcome->activation_date <= $semester->end)
                            )
                            <tr data-id="{{ $outcome->id }}">
                                <td contenteditable="true" class="name col-md-4" >{{ $outcome->name }}</td>
                                <td contenteditable="true" data-type="textarea" class="definition col-md-6" >{{ $outcome->definition }}</td>
                                <td contenteditable="true" class="expected-outcome col-md-1" >{{ $outcome->expected_outcome }}</td>
                                <td contenteditable="true" class="activation-date col-md-2" >{{ $outcome->activation_date }}</td>
                                <td contenteditable="true" class="deactivation-date col-md-2" >{{ $outcome->deactivation_date }}</td>
                                <td contenteditable="true" class="level col-md-1" >{{ $outcome->level }}</td>
                            </tr>
                      @endif
                    {{-- @endforeach --}}
                  @endforeach
                  @foreach ($outcomes as $outcome)
                    {{-- @foreach ($semesters as $semester) --}}
                      {{-- display an outcome only if it is part of a currently selected semester --}}
                      @if ((($outcome->deactivation_date != '0000-00-00') and ($outcome->deactivation_date != ''))
                            // and ($outcome->deactivation_date != '0000-00-00') and ($outcome->deactivation_date != '')
                            )
                            <tr data-id="{{ $outcome->id }}">
                                <td contenteditable="true" class="name col-md-4" >{{ $outcome->name }}</td>
                                <td contenteditable="true" data-type="textarea" class="definition col-md-6" >{{ $outcome->definition }}</td>
                                <td contenteditable="true" class="expected-outcome col-md-1" >{{ $outcome->expected_outcome }}</td>
                                <td contenteditable="true" class="activation-date col-md-2" >{{ $outcome->activation_date }}</td>
                                <td contenteditable="true" class="deactivation-date col-md-2" >{{ $outcome->deactivation_date }}</td>
                                <td contenteditable="true" class="level col-md-1" >{{ $outcome->level }}</td>
                            </tr>
                      @endif
                    {{-- @endforeach --}}
                  @endforeach
                </tbody>
            </table>
        </div>
    </div>
    <div class="row">
      <div class="col-md-6"><button class="btn btn-lg btn-secondary center-block" id='show'>New Outcome</button></div>
      <div class="col-md-6"><button class="btn btn-lg btn-primary center-block" id='save'>Save</button></div>
    </div>

  <div class="" id='new_outcome_form'>
    <h2>Add a new Learning Outcomes</h2>
    {{-- For for adding a new outcome --}}
    {{ Form::open(array('action' => 'OutcomesController@create')) }}
      <div class="form-group">
          {{ Form::label('name', 'Name') }}
          {{ Form::text('name', '', array('class' => 'form-control', 'id'=>'outcome_name')) }}
      </div>
      <div class="form-group">
          {{ Form::label('definition', 'Definition') }}
          {{ Form::textarea('definition', 'At least 10 characters long', array('class' => 'form-control', 'id'=>'outcome_definition')) }}
      </div>
      Due to technical limitationss, the following must be edited after adding the new Outcome:
      {{-- the technical limitation is: the Outcome Model has to be edited --}}
      <ul>
       <li>Expected Outcome</li>
       <li>Activation Date</li>
       <li>Deactivation Date</li>
       <li>Level</li>
      </ul>

      <div class="row">
        <div class="col-md-6"><button type="reset" class="btn btn-lg btn-secondary center-block" id='hide'>Hide Form</button></div>
        <div class="col-md-6"><button type="submit" class="btn btn-lg btn-primary center-block">Submit New Outcome</button></div>
      </div>
      {{ Form::close() }}

    <hr>
  </div>
@stop

@section('javascript')

        $('#new_outcome_form').hide();

        //show form
        $('#show').on('click', function(e)
        {
          $('#new_outcome_form').show();
          $('#show').hide();
        });

        //hide form
        $('#hide').on('click', function(e)
        {
          $('#new_outcome_form').hide();
          $('#show').show();
        });

        $('#save').on('click', function(e)
        {
            e.preventDefault();

            var outcomeArray= new Array();

            // For each learning outcome, get its value and put it into an array
            $('tbody tr').each(function( index )
            {
                var outcomeObject = new Object();

                outcomeObject.id= $(this).data('id');
                outcomeObject.name= $(this).children('.name').text();
                outcomeObject.definition= $(this).children('.definition').text();
                outcomeObject.expected_outcome= $(this).children('.expected-outcome').text();
                outcomeObject.activation_date= $(this).children('.activation-date').text();
                outcomeObject.deactivation_date= $(this).children('.deactivation-date').text();
                outcomeObject.level= $(this).children('.level').text();

                if($(this).find('.glyphicon-eye-close').length>0)
                {
                    outcomeObject.delete=1;
                }

                else
                    outcomeObject.delete=0;

                var clone = jQuery.extend({}, outcomeObject);
                outcomeArray.push(clone);
            });

            $.post(
                "{{ URL::action('OutcomesController@updateMore') }}",
                { outcomeArray: JSON.stringify(outcomeArray)},
                function(data)
                {
                    location.reload();
                }
            );
        });

        $('span').on('click', function()
        {
            if($(this).hasClass('glyphicon-eye-open'))
                $(this).removeClass('glyphicon-eye-open').addClass('glyphicon-eye-close');
            else
                $(this).removeClass('glyphicon-eye-close').addClass('glyphicon-eye-open');

        });
@stop