@extends('layouts.sidebar')
@section('title', 'Nomadic-CMS')
@section('content')
<div class="pagetitle">
  <h1>{{$page}} Page</h1>
</div>

<section class="section profile">
  <div class="col-xl-12">
    @if(session('success'))
    <div class="alert alert-success p-2">{{session('success')}}</div>
    @endif
    <input type="hidden" id="page_name" value="{{$page}}" readonly>    
    <div class="row">
      <div class="col-xl-4">
        <div class="card">
          <div class="card-body profile-card pt-4 pl-0 d-flex flex-column">
            <label class="lblprofile">Hero Section</label>
          </div>
        </div>
      </div>
      <div class="col-xl-8 mt-4">
        <div class="card">
          <div class="card-body pt-3">
            <div class="row">
              <div class="col-md-7 mb-2 position-relative">
                <form action="{{url('save-file')}}" method="post" enctype="multipart/form-data" id="cms_files_{{$files[0]->id}}" class="dropzone" @if($files[0]->video_path) data-video="true" @endif>
                  @csrf
                  <input type="hidden" name="file_id" value="{{$files[0]->id}}" readonly>
                </form>
                <div align="center" class="mt-2">
                  @if($files[0]->video_path)
                  <video id="file_cont_{{$files[0]->id}}" width="330px" controls>
                    <source src="{{asset($files[0]->video_path)}}" type="video/mp4">
                    Your browser does not support the video tag.
                  </video>
                  @else
                  <img id="file_cont_{{$files[0]->id}}" src="{{asset($files[0]->image_path)}}" width="330px" class="rounded" />
                  @endif
                </div>
                <div class="col-md-12">
                  <label class="lblprofile">Heading</label>
                  <input type="text" name="heading[{{$files[0]->id}}]" class="form-control mb-2" placeholder="Heading" value="{{$files[0]->heading}}" />
                </div>
                <div class="col-md-12">
                  <label class="lblprofile">Description</label>
                  <textarea name="description[{{$files[0]->id}}]" class="form-control mb-2" placeholder="Description">{{$files[0]->description}}</textarea>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>

    <div class="row">
      <div class="col-xl-4">
        <div class="card">
          <div class="card-body profile-card pt-4 pl-0 d-flex flex-column">
            <label class="lblprofile">Section Two</label>
          </div>
        </div>
      </div>
      <div class="col-xl-8 mt-4">
        <div class="card">
          <div class="card-body pt-3">
            <div class="row">
              <div class="col-md-7">
                <label class="lblprofile">Heading</label>
                <input type="text" name="heading[{{$files[1]->id}}]" class="form-control mb-2" placeholder="Heading" value="{{$files[1]->heading}}" />
              </div>
              <div class="col-md-7">
                <label class="lblprofile">Sub Heading</label>
                <input type="text" name="subheading[{{$files[1]->id}}]" class="form-control mb-2" placeholder="Sub Heading" value="{{$files[1]->subheading}}" />
              </div>
            </div>
            <div class="row">
              <div class="col-md-7 mb-2 position-relative">
                <form action="{{url('save-file')}}" method="post" enctype="multipart/form-data" id="cms_files_{{$files[2]->id}}" class="dropzone">
                  @csrf
                  <input type="hidden" name="file_id" value="{{$files[2]->id}}" readonly>
                </form>
                <div align="center" class="mt-2">
                  <img id="file_cont_{{$files[2]->id}}" src="{{asset($files[2]->image_path)}}" width="330px" class="rounded" />
                </div>
                <div class="col-md-12">
                  <label class="lblprofile">Heading</label>
                  <input type="text" name="heading[{{$files[2]->id}}]" class="form-control mb-2" placeholder="Heading" value="{{$files[2]->heading}}" />
                </div>
                <div class="col-md-12">
                  <label class="lblprofile">Description</label>
                  <textarea name="description[{{$files[2]->id}}]" class="form-control mb-2" placeholder="Description">{{$files[2]->description}}</textarea>
                </div>
              </div>
            </div>
            <div class="row">
              <div class="col-md-7 mb-2 position-relative">
                <form action="{{url('save-file')}}" method="post" enctype="multipart/form-data" id="cms_files_{{$files[3]->id}}" class="dropzone">
                  @csrf
                  <input type="hidden" name="file_id" value="{{$files[3]->id}}" readonly>
                </form>
                <div align="center" class="mt-2">
                  <img id="file_cont_{{$files[3]->id}}" src="{{asset($files[3]->image_path)}}" width="330px" class="rounded" />
                </div>
                <div class="col-md-12">
                  <label class="lblprofile">Heading</label>
                  <input type="text" name="heading[{{$files[3]->id}}]" class="form-control mb-2" placeholder="Heading" value="{{$files[3]->heading}}" />
                </div>
                <div class="col-md-12">
                  <label class="lblprofile">Description</label>
                  <textarea name="description[{{$files[3]->id}}]" class="form-control mb-2" placeholder="Description">{{$files[3]->description}}</textarea>
                </div>
              </div>
            </div>
            <div class="row">
              <div class="col-md-7 mb-2 position-relative">
                <form action="{{url('save-file')}}" method="post" enctype="multipart/form-data" id="cms_files_{{$files[4]->id}}" class="dropzone">
                  @csrf
                  <input type="hidden" name="file_id" value="{{$files[4]->id}}" readonly>
                </form>
                <div align="center" class="mt-2">
                  <img id="file_cont_{{$files[4]->id}}" src="{{asset($files[4]->image_path)}}" width="330px" class="rounded" />
                </div>
                <div class="col-md-12">
                  <label class="lblprofile">Heading</label>
                  <input type="text" name="heading[{{$files[4]->id}}]" class="form-control mb-2" placeholder="Heading" value="{{$files[4]->heading}}" />
                </div>
                <div class="col-md-12">
                  <label class="lblprofile">Description</label>
                  <textarea name="description[{{$files[4]->id}}]" class="form-control mb-2" placeholder="Description">{{$files[4]->description}}</textarea>
                </div>
              </div>
            </div>
            <div class="row">
              <div class="col-md-7 mb-2 position-relative">
                <form action="{{url('save-file')}}" method="post" enctype="multipart/form-data" id="cms_files_{{$files[5]->id}}" class="dropzone">
                  @csrf
                  <input type="hidden" name="file_id" value="{{$files[5]->id}}" readonly>
                </form>
                <div align="center" class="mt-2">
                  <img id="file_cont_{{$files[5]->id}}" src="{{asset($files[5]->image_path)}}" width="330px" class="rounded" />
                </div>
                <div class="col-md-12">
                  <label class="lblprofile">Heading</label>
                  <input type="text" name="heading[{{$files[5]->id}}]" class="form-control mb-2" placeholder="Heading" value="{{$files[5]->heading}}" />
                </div>
                <div class="col-md-12">
                  <label class="lblprofile">Description</label>
                  <textarea name="description[{{$files[5]->id}}]" class="form-control mb-2" placeholder="Description">{{$files[5]->description}}</textarea>
                </div>
              </div>
            </div>
            <div class="row">
              <div class="col-md-7 mb-2 position-relative">
                <form action="{{url('save-file')}}" method="post" enctype="multipart/form-data" id="cms_files_{{$files[6]->id}}" class="dropzone">
                  @csrf
                  <input type="hidden" name="file_id" value="{{$files[6]->id}}" readonly>
                </form>
                <div align="center" class="mt-2">
                  <img id="file_cont_{{$files[6]->id}}" src="{{asset($files[6]->image_path)}}" width="330px" class="rounded" />
                </div>
                <div class="col-md-12">
                  <label class="lblprofile">Heading</label>
                  <input type="text" name="heading[{{$files[6]->id}}]" class="form-control mb-2" placeholder="Heading" value="{{$files[6]->heading}}" />
                </div>
                <div class="col-md-12">
                  <label class="lblprofile">Description</label>
                  <textarea name="description[{{$files[6]->id}}]" class="form-control mb-2" placeholder="Description">{{$files[6]->description}}</textarea>
                </div>
              </div>
            </div>
            <div class="row">
              <div class="col-md-7 mb-2 position-relative">
                <form action="{{url('save-file')}}" method="post" enctype="multipart/form-data" id="cms_files_{{$files[7]->id}}" class="dropzone">
                  @csrf
                  <input type="hidden" name="file_id" value="{{$files[7]->id}}" readonly>
                </form>
                <div align="center" class="mt-2">
                  <img id="file_cont_{{$files[7]->id}}" src="{{asset($files[7]->image_path)}}" width="330px" class="rounded" />
                </div>
                <div class="col-md-12">
                  <label class="lblprofile">Heading</label>
                  <input type="text" name="heading[{{$files[7]->id}}]" class="form-control mb-2" placeholder="Heading" value="{{$files[7]->heading}}" />
                </div>
                <div class="col-md-12">
                  <label class="lblprofile">Description</label>
                  <textarea name="description[{{$files[7]->id}}]" class="form-control mb-2" placeholder="Description">{{$files[7]->description}}</textarea>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>

    <div class="row">
      <div class="col-xl-4">
        <div class="card">
          <div class="card-body profile-card pt-4 pl-0 d-flex flex-column">
            <label class="lblprofile">Section Three</label>
          </div>
        </div>
      </div>
      <div class="col-xl-8 mt-4">
        <div class="card">
          <div class="card-body pt-3">
            <div class="row">
              <div class="col-md-7">
                <label class="lblprofile">Heading</label>
                <input type="text" name="heading[{{$files[8]->id}}]" class="form-control mb-2" placeholder="Heading" value="{{$files[8]->heading}}" />
              </div>
              <div class="col-md-7">
                <label class="lblprofile">Sub Heading</label>
                <input type="text" name="subheading[{{$files[8]->id}}]" class="form-control mb-2" placeholder="Sub Heading" value="{{$files[8]->subheading}}" />
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>

    <div class="row">
      <div class="col-xl-4">
        <div class="card">
          <div class="card-body profile-card pt-4 pl-0 d-flex flex-column">
            <label class="lblprofile">Section Four</label>
          </div>
        </div>
      </div>
      <div class="col-xl-8 mt-4">
        <div class="card">
          <div class="card-body pt-3">
            <div class="row">
              <div class="col-md-7">
                <label class="lblprofile">Heading</label>
                <input type="text" name="heading[{{$files[9]->id}}]" class="form-control mb-2" placeholder="Heading" value="{{$files[9]->heading}}" />
              </div>
              <div class="col-md-7">
                <label class="lblprofile">Sub Heading</label>
                <input type="text" name="subheading[{{$files[9]->id}}]" class="form-control mb-2" placeholder="Sub Heading" value="{{$files[9]->subheading}}" />
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>

    <div class="row">
      <div class="col-xl-4">
        <div class="card">
          <div class="card-body profile-card pt-4 pl-0 d-flex flex-column">
            <label class="lblprofile">Section Five</label>
          </div>
        </div>
      </div>
      <div class="col-xl-8 mt-4">
        <div class="card">
          <div class="card-body pt-3">
            <div class="row">
              <div class="col-md-7">
                <label class="lblprofile">Heading</label>
                <input type="text" name="heading[{{$files[10]->id}}]" class="form-control mb-2" placeholder="Heading" value="{{$files[10]->heading}}" />
              </div>
              <div class="col-md-7">
                <label class="lblprofile">Sub Heading</label>
                <input type="text" name="subheading[{{$files[10]->id}}]" class="form-control mb-2" placeholder="Sub Heading" value="{{$files[10]->subheading}}" />
              </div>
            </div>
            <div class="row">
              <div class="col-md-7 mb-2 position-relative">
                <form action="{{url('save-file')}}" method="post" enctype="multipart/form-data" id="cms_files_{{$files[10]->id}}" class="dropzone">
                  @csrf
                  <input type="hidden" name="file_id" value="{{$files[10]->id}}" readonly>
                </form>
                <div align="center" class="mt-2">
                  <img id="file_cont_{{$files[10]->id}}" src="{{asset($files[10]->image_path)}}" width="330px" class="rounded" />
                </div>
              </div>
            </div>
            <div class="row">
              <div class="col-md-7">
                <label class="lblprofile">Heading</label>
                <input type="text" name="heading[{{$files[11]->id}}]" class="form-control mb-2" placeholder="Heading" value="{{$files[11]->heading}}" />
              </div>
              <div class="col-md-7">
                <label class="lblprofile">Description</label>
                <textarea name="description[{{$files[11]->id}}]" class="form-control mb-2" placeholder="Description">{{$files[11]->description}}</textarea>
              </div>
            </div>
            <div class="row">
              <div class="col-md-7">
                <label class="lblprofile">Heading</label>
                <input type="text" name="heading[{{$files[12]->id}}]" class="form-control mb-2" placeholder="Heading" value="{{$files[12]->heading}}" />
              </div>
              <div class="col-md-7">
                <label class="lblprofile">Description</label>
                <textarea name="description[{{$files[12]->id}}]" class="form-control mb-2" placeholder="Description">{{$files[12]->description}}</textarea>
              </div>
            </div>
            <div class="row">
              <div class="col-md-7">
                <label class="lblprofile">Heading</label>
                <input type="text" name="heading[{{$files[13]->id}}]" class="form-control mb-2" placeholder="Heading" value="{{$files[13]->heading}}" />
              </div>
              <div class="col-md-7">
                <label class="lblprofile">Description</label>
                <textarea name="description[{{$files[13]->id}}]" class="form-control mb-2" placeholder="Description">{{$files[13]->description}}</textarea>
              </div>
            </div>
            <div class="row">
              <div class="col-md-7">
                <label class="lblprofile">Heading</label>
                <input type="text" name="heading[{{$files[14]->id}}]" class="form-control mb-2" placeholder="Heading" value="{{$files[14]->heading}}" />
              </div>
              <div class="col-md-7">
                <label class="lblprofile">Description</label>
                <textarea name="description[{{$files[14]->id}}]" class="form-control mb-2" placeholder="Description">{{$files[14]->description}}</textarea>
              </div>
            </div>
            <div class="row">
              <div class="col-md-7">
                <label class="lblprofile">Heading</label>
                <input type="text" name="heading[{{$files[15]->id}}]" class="form-control mb-2" placeholder="Heading" value="{{$files[15]->heading}}" />
              </div>
              <div class="col-md-7">
                <label class="lblprofile">Description</label>
                <textarea name="description[{{$files[15]->id}}]" class="form-control mb-2" placeholder="Description">{{$files[15]->description}}</textarea>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>

    <div class="row">
      <div class="col-xl-4">
        <div class="card">
          <div class="card-body profile-card pt-4 pl-0 d-flex flex-column">
            <label class="lblprofile">Section Six</label>
          </div>
        </div>
      </div>
      <div class="col-xl-8 mt-4">
        <div class="card">
          <div class="card-body pt-3">
            <div class="row">
              <div class="col-md-7">
                <label class="lblprofile">Heading</label>
                <input type="text" name="heading[{{$files[16]->id}}]" class="form-control mb-2" placeholder="Heading" value="{{$files[16]->heading}}" />
              </div>
              <div class="col-md-7">
                <label class="lblprofile">Sub Heading</label>
                <input type="text" name="subheading[{{$files[16]->id}}]" class="form-control mb-2" placeholder="Sub Heading" value="{{$files[16]->subheading}}" />
              </div>
              <div class="col-md-7">
                <label class="lblprofile">Description</label>
                <textarea name="description[{{$files[16]->id}}]" class="form-control mb-2" placeholder="Description">{{$files[16]->description}}</textarea>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>

    <div class="row">
      <div class="col-xl-4">
        <div class="card">
          <div class="card-body profile-card pt-4 pl-0 d-flex flex-column">
            <label class="lblprofile">Section Seven</label>
          </div>
        </div>
      </div>
      <div class="col-xl-8 mt-4">
        <div class="card">
          <div class="card-body pt-3">
            <div class="row">
              <div class="col-md-7">
                <label class="lblprofile">Heading</label>
                <input type="text" name="heading[{{$files[17]->id}}]" class="form-control mb-2" placeholder="Heading" value="{{$files[17]->heading}}" />
              </div>
              <div class="col-md-7">
                <label class="lblprofile">Sub Heading</label>
                <input type="text" name="subheading[{{$files[17]->id}}]" class="form-control mb-2" placeholder="Sub Heading" value="{{$files[17]->subheading}}" />
              </div>
              <div class="col-md-7">
                <label class="lblprofile">Description</label>
                <textarea name="description[{{$files[17]->id}}]" class="form-control mb-2" placeholder="Description">{{$files[17]->description}}</textarea>
              </div>
            </div>
            <div class="row">
              <div class="col-md-7">
                <label class="lblprofile">Heading</label>
                <input type="text" name="heading[{{$files[18]->id}}]" class="form-control mb-2" placeholder="Heading" value="{{$files[18]->heading}}" />
              </div>
              <div class="col-md-7">
                <label class="lblprofile">Description</label>
                <textarea name="description[{{$files[18]->id}}]" class="form-control mb-2" placeholder="Description">{{$files[18]->description}}</textarea>
              </div>
            </div>
            <div class="row">
              <div class="col-md-7">
                <label class="lblprofile">Heading</label>
                <input type="text" name="heading[{{$files[19]->id}}]" class="form-control mb-2" placeholder="Heading" value="{{$files[19]->heading}}" />
              </div>
              <div class="col-md-7">
                <label class="lblprofile">Description</label>
                <textarea name="description[{{$files[19]->id}}]" class="form-control mb-2" placeholder="Description">{{$files[19]->description}}</textarea>
              </div>
            </div>
            <div class="row">
              <div class="col-md-7">
                <label class="lblprofile">Heading</label>
                <input type="text" name="heading[{{$files[20]->id}}]" class="form-control mb-2" placeholder="Heading" value="{{$files[20]->heading}}" />
              </div>
              <div class="col-md-7">
                <label class="lblprofile">Description</label>
                <textarea name="description[{{$files[20]->id}}]" class="form-control mb-2" placeholder="Description">{{$files[20]->description}}</textarea>
              </div>
            </div>
            <div class="row">
              <div class="col-md-7">
                <label class="lblprofile">Heading</label>
                <input type="text" name="heading[{{$files[21]->id}}]" class="form-control mb-2" placeholder="Heading" value="{{$files[21]->heading}}" />
              </div>
              <div class="col-md-7">
                <label class="lblprofile">Description</label>
                <textarea name="description[{{$files[21]->id}}]" class="form-control mb-2" placeholder="Description">{{$files[21]->description}}</textarea>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>

    
    <div align="center">
      <input type="button" id="save_text" class="btn btn-primary" value="Save Changes" />
    </div>
  </div>
</section>
@endsection
@section('footer_scripts')
<link href="{{asset('css/dropzone.min.css')}}" rel="stylesheet">
<link href="{{asset('css/dropzone.custom.css')}}" rel="stylesheet">
<script src="{{asset('js/dropzone.js')}}"></script>
<script src="{{asset('js/cropper.js')}}"></script>
<link href="{{asset('css/cropper.css')}}" rel="stylesheet">
<script>
  cms_editor();
</script>
@endsection