@extends('layouts.admin')
@section('content')

<div class="card">
    <div class="card-header">
        {{ trans('global.create') }} {{ trans('cruds.schedule.title_singular') }}
    </div>

    <div class="card-body">
        <form method="POST" action="{{ route("admin.schedules.store") }}" enctype="multipart/form-data">
            @csrf
            <input type="text" name="status" value="active" hidden>
            <div class="form-group">
                <label class="required" for="command">Set Brightness (%)</label>
                <!-- <label class="required" for="command">{{ trans('cruds.schedule.fields.command') }}</label> -->
                <!-- <textarea class="form-control {{ $errors->has('command') ? 'is-invalid' : '' }}" name="command" id="command" required>{{ old('command') }}</textarea> -->
                <!-- <select class="form-control {{ $errors->has('command') ? 'is-invalid' : '' }}" name="command" id="command" required>
                    <option value disabled {{ old('command', null) === null ? 'selected' : '' }}>{{ trans('global.pleaseSelect') }}</option>
                    <option value='{"setValue":100}'>LAMP ON</option>
                    <option value='{"setValue":0}'>LAMP OFF</option>
                    
                </select> -->
                <input class="form-control {{ $errors->has('start_datetime') ? 'is-invalid' : '' }}" type="number" name="value" id="value" value="{{ old('value') }}" required>
                @if($errors->has('command'))
                    <div class="invalid-feedback">
                        {{ $errors->first('command') }}
                    </div>
                @endif
                <span class="help-block">{{ trans('cruds.schedule.fields.command_helper') }}</span>
            </div>            
            <div class="form-group">
                <label class="required" for="start_datetime">{{ trans('cruds.schedule.fields.start_datetime') }}</label>
                <input class="form-control datetime {{ $errors->has('start_datetime') ? 'is-invalid' : '' }}" type="text" name="start_datetime" id="start_datetime" value="{{ old('start_datetime') }}" required>
                @if($errors->has('start_datetime'))
                    <div class="invalid-feedback">
                        {{ $errors->first('start_datetime') }}
                    </div>
                @endif
                <span class="help-block">{{ trans('cruds.schedule.fields.start_datetime_helper') }}</span>
            </div>
            <div class="form-group">
                <div class="form-check">
                    <input class="form-check-input" type="checkbox" value="" id="flexCheckDefault">
                    <label class="form-check-label" for="flexCheckDefault">
                        Repeat
                    </label>                 
                </div>
            </div>
            <div class="row d-none" id="repeatForm">
                <div class="col-md-0">
                </div>
                <div class="col-md-3">
                    <div class="form-group">
                        <label class="required">{{ trans('cruds.schedule.fields.repeat') }}</label>
                        <select class="form-control {{ $errors->has('repeat') ? 'is-invalid' : '' }}" name="repeat" id="repeat" required>
                            <option value disabled {{ old('repeat', null) === null ? 'selected' : '' }}>{{ trans('global.pleaseSelect') }}</option>
                            @foreach(App\Models\Schedule::REPEAT_SELECT as $key => $label)
                                <option value="{{ $key }}" {{ old('repeat', 'norepeat') === (string) $key ? 'selected' : '' }}>{{ $label }}</option>
                            @endforeach
                        </select>
                        @if($errors->has('repeat'))
                            <div class="invalid-feedback">
                                {{ $errors->first('repeat') }}
                            </div>
                        @endif
                        <span class="help-block">{{ trans('cruds.schedule.fields.repeat_helper') }}</span>
                    </div>
                </div>
                <div class="col-md-3">
                    <div class="form-group">
                        <label for="stop_datetime">{{ trans('cruds.schedule.fields.stop_datetime') }}</label>
                        <input class="form-control datetime {{ $errors->has('stop_datetime') ? 'is-invalid' : '' }}" type="text" name="stop_datetime" id="stop_datetime" value="{{ old('stop_datetime') }}">
                        @if($errors->has('stop_datetime'))
                            <div class="invalid-feedback">
                                {{ $errors->first('stop_datetime') }}
                            </div>
                        @endif
                        <span class="help-block">{{ trans('cruds.schedule.fields.stop_datetime_helper') }}</span>
                    </div>
                </div>
                {{-- <div class="col-md-3">
                    <div class="form-group">
                        <label for="repeat_number">{{ trans('cruds.schedule.fields.repeat_number') }}</label>
                        <input class="form-control {{ $errors->has('repeat_number') ? 'is-invalid' : '' }}" type="number" name="repeat_number" id="repeat_number" value="{{ old('repeat_number', '1') }}" step="1">
                        @if($errors->has('repeat_number'))
                            <div class="invalid-feedback">
                                {{ $errors->first('repeat_number') }}
                            </div>
                        @endif
                        <span class="help-block">{{ trans('cruds.schedule.fields.repeat_number_helper') }}</span>
                    </div>
                </div> --}}
            </div>               

            <div class="form-group">
                <label for="tags">{{ trans('cruds.schedule.fields.tag') }}</label>
                <div style="padding-bottom: 4px">
                    <span class="btn btn-info btn-xs select-all" style="border-radius: 0">{{ trans('global.select_all') }}</span>
                    <span class="btn btn-info btn-xs deselect-all" style="border-radius: 0">{{ trans('global.deselect_all') }}</span>
                </div>
                <select class="form-control select2 {{ $errors->has('tags') ? 'is-invalid' : '' }}" name="tags[]" id="tags" multiple>
                    @foreach($tags as $id => $tag)
                        <option value="{{ $id }}" {{ in_array($id, old('tags', [])) ? 'selected' : '' }}>{{ $tag }}</option>
                    @endforeach
                </select>
                @if($errors->has('tags'))
                    <div class="invalid-feedback">
                        {{ $errors->first('tags') }}
                    </div>
                @endif
                <span class="help-block">{{ trans('cruds.schedule.fields.tag_helper') }}</span>
            </div>
            <!-- <div class="form-group">
                <label>{{ trans('cruds.schedule.fields.status') }}</label>
                <select class="form-control {{ $errors->has('status') ? 'is-invalid' : '' }}" name="status" id="status">
                    <option value disabled {{ old('status', null) === null ? 'selected' : '' }}>{{ trans('global.pleaseSelect') }}</option>
                    @foreach(App\Models\Schedule::STATUS_SELECT as $key => $label)
                        <option value="{{ $key }}" {{ old('status', 'active') === (string) $key ? 'selected' : '' }}>{{ $label }}</option>
                    @endforeach
                </select>
                @if($errors->has('status'))
                    <div class="invalid-feedback">
                        {{ $errors->first('status') }}
                    </div>
                @endif
                <span class="help-block">{{ trans('cruds.schedule.fields.status_helper') }}</span>
            </div> -->
            <div class="form-group">
                <button class="btn btn-danger" type="submit">
                    {{ trans('global.save') }}
                </button>
            </div>
        </form>
    </div>
</div>

@endsection

@section('scripts')
<script>
    var repeatForm = document.getElementById("repeatForm");
    $('#flexCheckDefault').on('click', function() {
        if ($(this).is(':checked')) {
            repeatForm.classList.remove("d-none");
        } else {
            repeatForm.classList.add("d-none");
        }
    });
    $(document).ready(function () {
  window._token = $('meta[name="csrf-token"]').attr('content')

  moment.updateLocale('en', {
    week: {dow: 1} // Monday is the first day of the week
  })

  $('.date').datetimepicker({
    format: 'DD-MM-YYYY',
    locale: 'en',
    icons: {
      up: 'fas fa-chevron-up',
      down: 'fas fa-chevron-down',
      previous: 'fas fa-chevron-left',
      next: 'fas fa-chevron-right'
    }
  })

  $('.datetime').datetimepicker({
    format: 'DD-MM-YYYY HH:mm:ss',
    locale: 'en',
    sideBySide: true,
    icons: {
      up: 'fas fa-chevron-up',
      down: 'fas fa-chevron-down',
      previous: 'fas fa-chevron-left',
      next: 'fas fa-chevron-right'
    }
  })

  $('.timepicker').datetimepicker({
    format: 'HH:mm:ss',
    icons: {
      up: 'fas fa-chevron-up',
      down: 'fas fa-chevron-down',
      previous: 'fas fa-chevron-left',
      next: 'fas fa-chevron-right'
    }
  })

  $('.select-all').click(function () {
    let $select2 = $(this).parent().siblings('.select2')
    $select2.find('option').prop('selected', 'selected')
    $select2.trigger('change')
  })
  $('.deselect-all').click(function () {
    let $select2 = $(this).parent().siblings('.select2')
    $select2.find('option').prop('selected', '')
    $select2.trigger('change')
  })

  $('.select2').select2()

  $('.treeview').each(function () {
    var shouldExpand = false
    $(this).find('li').each(function () {
      if ($(this).hasClass('active')) {
        shouldExpand = true
      }
    })
    if (shouldExpand) {
      $(this).addClass('active')
    }
  })

$('button.sidebar-toggler').click(function () {
    setTimeout(function() {
      $($.fn.dataTable.tables(true)).DataTable().columns.adjust();
    }, 275);
  })
})

</script>
@endsection