@extends('layouts.layout-2')

@section('content')

    <style>
        body {
        }
        .btn-xs {
            line-height: 1.3em;
        }
        .table tbody + tbody {
            border-top: 1px solid #9c9c9c;
        }
        .table th, .table td {
            border-top: none;
        }
        .table tr.border-none td, .table tr.border-none th  {
            border-top: none;
        }
        .table .thead-dark th {
            color: #4E5155;
            background-color: rgba(24, 28, 33, 0.1);
            border-color: rgba(63, 69, 74, 0.1);
        }

        .input-group-text {
            padding: 0.438rem 0.475rem;
        }
    </style>

    <h4 class="font-weight-bold py-3 mb-1">
        Reiseprogramm @if($id == "new") <span class="text-primary">anlegen</span> @else verwalten {{"(ID: ".$id.")"}}  @endif
        <div class="float-right">
            <a href="{{route('travel_programs')}}" class="btn btn-default btn-sm">{{ __('zur Übersicht') }}</a>
        </div>
    </h4>
    <div class="clearfix"></div>

    <ul class="nav nav-sm nav-tabs nav-justified tabs-alt mb-3" id="top-nav-quick-jump">
        <li class="nav-item">
            <a class="nav-link" href="javascript:void(0)" data-collapse="#collapseTravelProgramGeneral">
                Allgemein 
            </a>
        </li>
        <li class="nav-item">
            <a class="nav-link" href="javascript:void(0)" data-collapse="#collapseTravelProgramDetails">
                Details
            </a>
        </li>
        <li class="nav-item">
            <a class="nav-link" href="javascript:void(0)" data-collapse="#collapseTravelProgramClasses">
                Klassen
            </a>
        </li>
        <li class="nav-item">
            <a class="nav-link" href="javascript:void(0)" data-collapse="#collapseTravelProgramDrafts">
                Vorlagen
            </a>
        </li>
    </ul>

    {!! Form::open(['url' => route('travel_program_detail', [$id]), 'class' => 'form-horizontal']) !!}
    <input type="hidden" name="id" id="id" value="{{$id}}">

    @include('travel.program._general')

    @if($id !== "new" && $program)
        @include('travel.program._details')
        @include('travel.program._classes')
        @include('travel.program._drafts')
    @endif

    <div class="float-right mt-3">
        <a href="{{route('travel_programs')}}" class="btn btn-sm btn-default">{{ __('zur Übersicht') }}</a>
        <a href="{{ make_v2_url("/acp/travel_program/show/".$program->id."/") }}" class="btn btn-sm btn-default float-right">{{ __('zurück ins v2 Programm') }}</a>
    </div>
    {!! Form::close() !!}

    @if($id !== "new" && $program)
         @include('travel.program._modals')
    @endif  

    <script>
        $(document).ready(function() {

            var collapseHashValue = null;
            $('[rel="tooltip"]').tooltip({trigger: "hover", html: true});

            $('#top-nav-quick-jump .nav-link').on('click', function (e) {
                e.preventDefault();
                $('#top-nav-quick-jump .nav-link').removeClass('active');
                $(this).addClass('active');
                var collapse_id = $(this).data('collapse');
                //console.log(collapse_id);
                $(collapse_id).collapse('show');
                // animate
                $('html, body').animate({
                    scrollTop: $(collapse_id).parent('.card').offset().top
                }, 300, function(){
                    // when done, add hash to url
                    // (default click behaviour)
                    window.location.hash = collapse_id;
                });

            });

            $(".collapse").on('shown.bs.collapse', function (){
                if(collapseHashValue){
                    $('a[data-collapse="#'+collapseHashValue+'"]').click();
                    collapseHashValue = null;
                }
                CookiesAddJSONValue('travel_program_collapse', $(this).attr('id'));
                window.location.hash = "#"+$(this).attr('id');

            });

            $(".collapse").on('hidden.bs.collapse', function (){
                CookiesRemoveJSONValue('travel_program_collapse', $(this).attr('id'));
            });

            function init_site(){
                if(window.location.hash){
                    value = $(window.location.hash).attr('id');
                    if(value){
                        collapseHashValue = value;
                        CookiesAddJSONValue('travel_program_collapse', value);
                    }
                }
                var travel_program_collapses = Cookies.get('travel_program_collapse');
                if (travel_program_collapses != null)
                {
                    travel_program_collapses =  JSON.parse(travel_program_collapses);
                    for (var travel_program_collapse in travel_program_collapses){
                        $("#"+travel_program_collapses[travel_program_collapse]).collapse("show");
                    }
                }
            }
            init_site();
        });
    </script>





   


@endsection