@extends('layouts.master')
@section('page_title', $website_request->website_request_name)

@section('content')

    <div class="container">
        {{ Form::page_header($website_request->website_request_name, "hours") }}
        {{ Form::hidden('post_arrange_url', action('WebsiteRequestController@update_navigation_sort', compact('website_request')), ['id' => 'post_arrange_url'] ) }}

        <div class="row">
            <div class="grey-bg curve_container">
                <div class="row">
                    @include('website._website_sidebar', compact('website_request'))
                    <div class="col-md-9 col-xs-9 detail-right-side">
                        <div class="white-bg">
                            <div class="row">{{ Form::label_title('Navigation') }}</div>
                            @foreach($website_navs as $website_nav)
                                <div class="website-nav">
                                    <div class="row">{{ Form::label_title($website_nav->display_name, \App\Helpers\FormComponentHelper::SIZE_LARGE) }}</div>
                                    @if ($website_nav->notes)
                                        <div class="row">{{ Form::label_title($website_nav->notes, \App\Helpers\FormComponentHelper::SIZE_LARGE) }}</div>
                                    @endif
                                    <ol id="plan-root" class="root {{ $can_edit ? 'sortable' : '' }}">
                                        @foreach($website_nav->get_top_level_modules() as $top_module)
                                            <li id="item-{{$top_module->website_nav_module}}" data-id="{{$top_module->website_nav_module}}">
                                                @include('website._navigation_card', ['website_nav_module' => $top_module])
                                                @if($top_module->has_children())
                                                    @include('website._navigation_card_children', ['children' => $top_module->get_children()])
                                                @endif
                                            </li>
                                        @endforeach
                                    </ol>
                                    @if ($can_edit)
                                    <div class="row bt-button-row">
                                        {{ Form::button_link('Edit', str_replace('XXX', $website_nav->website_nav, $edit_url)) }}
                                    </div>
                                    @endif
                                    @if(!$loop->last)
                                    {{ Form::separator_row_bottom("grey-divider") }}
                                    @endif
                                </div>
                            @endforeach
                        </div>
                        @if ($can_edit)
                        <div class="row bt-button-row text-right">
                            {{ Form::button_link('Create Sub Nav', $create_url) }}
                        </div>
                        @endif
                        <div class="white-bg" id="social-media">
                            <div class="row">{{ Form::label_title('Social Media') }}</div>
                            @include('website._social_media_view', compact('website_request'))
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection

@section('page_script')
    @include('shared_script._website_sidebar_script')
    @include('shared_script._nested_sortable')

    <script>
        function edit_social_media(website_request) {
            $.ajax({
                type: "POST",
                url: '{{ action('WebsiteRequestController@edit_social_media') }}',
                data: {website_request: website_request},
                success: function (result) {
                    $('div#social-media-view').remove();
                    $('div#social-media').append(result.view).hide().fadeIn();
                }
            });
        }

        function save_social_media(website_request) {
            var social_media = $('form#social-media-edit');
            $.ajax({
                type: "POST",
                url: '{{ action('WebsiteRequestController@save_social_media') }}',
                data: social_media.serialize(),
                success: function (result) {
                    $('div#social-media-edit').remove();
                    $('div#social-media').append(result.view).hide().fadeIn();
                }
            });
        }

        function cancel_edit_social_media(website_request) {
            $('div#social-media-edit').fadeOut(200, function() {
                $(this).remove();
            });
            $.ajax({
                type: "GET",
                url: '{{ action('WebsiteRequestController@cancel_edit_social_media') }}',
                data: {website_request: website_request},
                success: function (result) {
                    $('div#social-media').append(result.view).hide().fadeIn();
                }
            });
        }
    </script>

@endsection
@section('page_style')
    <style>
        .mjs-nestedSortable-error {
            background: #fbe3e4;
            border-color: transparent;
        }

        ol.root {
            list-style-type: none;
            padding-left: 0;
        }

        ol.root ol {
            padding-left: 0;
            list-style-type: none;
            margin: 0 0 0 35px;
        }

        .ui-sortable-handle .bt-label {
            cursor: move;
        }

        .website-nav {
            margin-top: 40px;
        }

        .root {
            margin-left: 40px;
        }

        .drag-drop-img-large {
            min-height: 20px;
            min-width: 20px;
            margin-right: 5px;
        }

        .white-bg .separator-row {
            margin-top: 30px !important;
        }

        #social-media {
            margin-top: 20px;
        }

        #edit-social-btn {
            margin-top: 20px;
        }
    </style>
@endsection