@extends('layouts.header')

@section('content')

<div class="breadcrumb-wrap mt-n4">
	<nav aria-label="breadcrumb">
	  <ol class="breadcrumb">
		<li class="breadcrumb-item"><a href="/home">Home</a></li>
	  </ol>
	</nav>
</div>

<div class="row mt-4">

@if(count($result) > 0)    
        @foreach($result as $menu)
           
            @if($menu->type == 'FOLDER')
            <div class="col-12 mb-4">
                <!-- <a href="/menu/open-header/{{ $menu->id }}"><button type="button" class="btn btn-outline-primary btn-lg" onclick="appendMenu({{$menu->id}},'{{ $menu->text }}')">{{ $menu->text}} <i class="fa fa-angle-right ml-4" aria-hidden="true"></i></button></a> -->
                <a href="/menu/open-header/{{ $menu->id }}"onclick="appendMenu({{$menu->id}},'{{ $menu->text }}')" style="color:black;">
                    <i class="fa fa-folder" style="color:orange;font-size:35px;"></i>
                    &nbsp;{{ $menu->text}}
                </a>
            </div>
            @else

            <div class="col-12 mb-4">
                <!-- <a href="/menu/open-file/{{ $menu->id }}"><button type="button" class="btn btn-outline-primary btn-lg" onclick="appendMenu({{$menu->id}},'{{ $menu->file_name }}')">{{ $menu->file_name}} <i class="fa fa-angle-right ml-4" aria-hidden="true"></i></button></a> -->
                <a href="/menu/open-file/{{ $menu->id }}" onclick="appendMenu({{$menu->id}},'{{ $menu->file_name }}')" style="color:black;">
                <i class="fa fa-file-o" style="color:darkgray;font-size:35px;"></i>
                 &nbsp;{{ $menu->file_name}} 
                 </a>

            </div>
            
            @endif

        @endforeach
@else
<div class="text-center">
            <label>No data found!</label>
        </div>

    @endif
       
 
</div>
<style>
    /* .loginoptions:hover{
        background: silver!important;
      } */

  .loginoptions{
    color:black;
    background-color: #FFFFFF;
    margin-top: auto;
    margin-bottom: auto;
    position: relative;
    display: flex;
    justify-content: center;
    flex-direction: column;
    padding:20px 0 0px 0;
}
		
</style>
@endsection

@section('append')
<script src="/assets/js/jquery.min.js"></script>
<script>
    var breadcrumb = "";
    var text = "";

    $(document).ready(function(){ 
        breadcrumb = $('.breadcrumb').html(); 
        sessionStorage.setItem('breadcrumb',breadcrumb);
    });

    function appendMenu(id,name){
        if(sessionStorage.breadcrumb != undefined){
         sessionStorage.breadcrumb +="<li class='breadcrumb-item' id='bread_"+id+"' onclick='currentChild("+id+")'><a href='/menu/open-header/"+id+"'>"+name+"</a></li>";
        }
    }

    function currentChild(id){
        var after = $('#bread_'+id).nextAll().remove();
        breadcrumb = $('.breadcrumb').html();
        sessionStorage.setItem('breadcrumb',breadcrumb);
    }

    $('#backArrow').on('click',function(){ 
        $('.breadcrumb li:last-child').remove();
        breadcrumb = $('.breadcrumb').html();
        sessionStorage.setItem('breadcrumb',breadcrumb);
        history.back();
    });


</script>

@endsection