@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") }}
        <div class="row">
            <div class="grey-bg curve_container">
                <div class="row">
                    @include('website._website_sidebar', compact('website_request'))
                    {{ Form::open(['url' => $save_url,'autocomplete' => 'off','files' => true]) }}
                        <div class="col-md-9 col-xs-9 detail-right-side design-plan-detail-right-side">
                            <div class="white-bg">
                                {{-- Design Plan Section --}}
                                {{ Form::label_ex('Design Plan', \App\Helpers\FormComponentHelper::SIZE_EXLARGE) }}
                                {{ Form::separator_row_bottom('grey-divider') }}

                                {{-- General Section --}}
                                {{ Form::label_ex('General', \App\Helpers\FormComponentHelper::SIZE_EXLARGE) }}
                                {{ Form::row_select_inline('look_feel', 'Overall Look & Feel', $website_request->look_feel, \App\Models\Website_Request::$look_feel_map, 3, 8,\App\Helpers\FormComponentHelper::SIZE_MEDIUM) }}
                                {{ Form::row_textarea_inline('impact_area', 'Impact Area', $design_plan->impact_area, 3, 8, \App\Helpers\FormComponentHelper::SIZE_MEDIUM) }}
                                {{ Form::row_textarea_inline('visual_flow', 'Visual Flow', $design_plan->visual_flow, 3, 8, \App\Helpers\FormComponentHelper::SIZE_MEDIUM) }}
                                {{ Form::row_textarea_inline('structure', 'Structure', $design_plan->structure, 3, 8, \App\Helpers\FormComponentHelper::SIZE_MEDIUM) }}
                                {{ Form::separator_row_bottom('grey-divider') }}

                                {{-- Layout Section --}}
                                {{ Form::label_ex('Layout', \App\Helpers\FormComponentHelper::SIZE_EXLARGE) }}
                                <div class="row">
                                    {{ Form::row_select_inline('layout_type', 'Layout Choice', $design_plan->layout_type, \App\Models\Design_Plan::$layout_type_map, 3, 8,\App\Helpers\FormComponentHelper::SIZE_MEDIUM) }}
                                    <div class="no-left-pad col-md-3 col-xs-4">
                                        {{ Form::label_title('Layout / Theme',\App\Helpers\FormComponentHelper::SIZE_MEDIUM) }}
                                    </div>
                                    <div class="no-left-pad col-md-5 col-xs-4">
                                        {{ Form::label_title('DESIGN DIRECTION',\App\Helpers\FormComponentHelper::SIZE_TINY) }}
                                        {{ Form::textarea_ex('layout_design_direction', $design_plan->layout_design_direction, 20) }}
                                        {{ Form::label_title('DEVELOPER NOTES',\App\Helpers\FormComponentHelper::SIZE_TINY) }}
                                        {{ Form::textarea_ex('layout_dev_direction', $design_plan->layout_dev_direction, 20) }}
                                    </div>
                                    <div class="no-left-pad col-md-4 col-xs-4">
                                        {{ Form::label_title('CUSTOMER SELECTIONS',\App\Helpers\FormComponentHelper::SIZE_TINY) }}
                                        @if(!empty($business_design_package_review['selected_'.\App\Models\Design_Plan::DESIGN_PLAN_TYPE_LAYOUT_THEME]))
                                            @foreach($business_design_package_review['selected_'.\App\Models\Design_Plan::DESIGN_PLAN_TYPE_LAYOUT_THEME] as $layout)
                                                {{ Form::image($layout['url'], 'customer image', [
                                                    'class'=>'design_image'.($layout['pivot']['selected'] == 1 ? ' selected_image' : ''),
                                                    'data-vp_atom'=>$layout['pivot']['visual_personality'],
                                                    'data-select_url'=>action('DesignPlanController@select_visual_personality', [$layout['pivot']['visual_personality']]),
                                                    'data-deselect_url'=>action('DesignPlanController@deselect_visual_personality', [$layout['pivot']['visual_personality']]),
                                                    ])
                                                }}
                                            @endforeach
                                        @else
                                            {{ Form::image(null, 'customer image', ['class'=>'design_image'])}}
                                        @endif
                                    </div>
                                </div>
                                {{ Form::separator_row_bottom('grey-divider') }}

                                {{-- Visual Archetype Section --}}
                                {{ Form::label_ex('Design Elements', \App\Helpers\FormComponentHelper::SIZE_EXLARGE) }}
                                <div class="row">
                                    <div class="no-left-pad col-md-3 col-xs-4">
                                        {{ Form::label_title('Visual Archetype',\App\Helpers\FormComponentHelper::SIZE_MEDIUM) }}
                                    </div>
                                    <div class="no-left-pad col-md-5 col-xs-4">
                                        {{ Form::label_title('DESIGN DIRECTION',\App\Helpers\FormComponentHelper::SIZE_TINY) }}
                                        {{ Form::textarea_ex('archetype_design_direction', $design_plan->archetype_design_direction, 20) }}
                                        {{ Form::label_title('DEVELOPER NOTES',\App\Helpers\FormComponentHelper::SIZE_TINY) }}
                                        {{ Form::textarea_ex('archetype_dev_direction', $design_plan->archetype_dev_direction, 20) }}
                                        {{ Form::separator_row_bottom('grey-divider') }}
                                        @if(!$design_plan_links[\App\Models\Design_Plan::DESIGN_PLAN_TYPE_ARCHETYPE]->isEmpty())
                                            {{ Form::label_title('DESIGNER LINKS',\App\Helpers\FormComponentHelper::SIZE_TINY) }}
                                            @foreach($design_plan_links[\App\Models\Design_Plan::DESIGN_PLAN_TYPE_ARCHETYPE] as $archetype)
                                                <div class="designer-link-url  no-left-pad col-md-12 col-xs-12" id="block-{{ $archetype['design_plan_link'] }}">
                                                    @if(preg_match("#\.(jpg|jpeg|gif|png|bmp|tiff)$# i", $archetype['url']))
                                                        <input src="{{ $archetype['url'] }}" class="design_plan_links" name="customer image" type="image" value="{{ $archetype['url'] }}">
                                                    @else
                                                        <a class="bt-label link-label bt-label-small" href="{{ $archetype['url'] }}" target="_blank">{{ $archetype['url'] }}</a>
                                                    @endif
                                                    {{ Form::image("img/remove_image.png", 'customer image', ['class'=>'design_link_remove_icon', 'id'=>$archetype['design_plan_link'], 'data-type' => $archetype['design_plan_type']])}}
                                                </div>
                                            @endforeach
                                        @endif
                                        {{ Form::button_ex('ADD A LINK', 'event.preventDefault(); designer_link_form(0, "archetype")', 'archetype') }}
                                    </div>
                                    <div class="no-left-pad col-md-4 col-xs-4">
                                        {{ Form::label_title('CUSTOMER SELECTIONS',\App\Helpers\FormComponentHelper::SIZE_TINY) }}
                                        @if(!empty($business_design_package_review['selected_'.\App\Models\Design_Plan::DESIGN_PLAN_TYPE_ARCHETYPE]))
                                            @foreach($business_design_package_review['selected_'.\App\Models\Design_Plan::DESIGN_PLAN_TYPE_ARCHETYPE] as $archetype)
                                                <div style="float:left; width: 120px">
                                                    {{ Form::image($archetype['url'], 'customer image', [
                                                        'class'=>'design_image'.($archetype['pivot']['selected'] == 1 ? ' selected_image' : ''),
                                                        'data-vp_atom'=>$archetype['pivot']['visual_personality'],
                                                        'data-select_url'=>action('DesignPlanController@select_visual_personality', [$archetype['pivot']['visual_personality']]),
                                                        'data-deselect_url'=>action('DesignPlanController@deselect_visual_personality', [$archetype['pivot']['visual_personality']]),
                                                        ])
                                                    }}
                                                    {{ Form::label_title($archetype['visual_personality_source_name'],\App\Helpers\FormComponentHelper::SIZE_TINY) }}
                                                </div>
                                            @endforeach
                                        @else
                                            {{ Form::image(null, 'customer image', ['class'=>'design_image'])}}
                                        @endif
                                    </div>
                                </div>
                                {{ Form::separator_row_bottom('grey-divider') }}

                                {{-- Color Section --}}
                                <div class="row">
                                    <div class="no-left-pad col-md-3 col-xs-4">
                                        {{ Form::label_title('Color Palette',\App\Helpers\FormComponentHelper::SIZE_MEDIUM) }}
                                    </div>
                                    <div class="no-left-pad col-md-5 col-xs-4">
                                        {{ Form::label_title('DESIGN DIRECTION',\App\Helpers\FormComponentHelper::SIZE_TINY) }}
                                        {{ Form::textarea_ex('color_design_direction', $design_plan->color_design_direction, 20) }}
                                        {{ Form::label_title('DEVELOPER NOTES',\App\Helpers\FormComponentHelper::SIZE_TINY) }}
                                        {{ Form::textarea_ex('color_dev_direction', $design_plan->color_dev_direction, 20) }}
                                        {{ Form::separator_row_bottom('grey-divider') }}
                                        @if(!$design_plan_links[\App\Models\Design_Plan::DESIGN_PLAN_TYPE_COLOR]->isEmpty())
                                            {{ Form::label_title('DESIGNER LINKS',\App\Helpers\FormComponentHelper::SIZE_TINY) }}
                                            @foreach($design_plan_links[\App\Models\Design_Plan::DESIGN_PLAN_TYPE_COLOR] as $colors)
                                                <div class="designer-link-url  no-left-pad col-md-12 col-xs-12" id="block-{{ $colors['design_plan_link'] }}">
                                                    @if(preg_match("#\.(jpg|jpeg|gif|png|bmp|tiff)$# i", $colors['url']))
                                                        <input src="{{ $colors['url'] }}" class="design_plan_links" name="customer image" type="image" value="{{ $colors['url'] }}">
                                                    @else
                                                        <a class="bt-label link-label bt-label-small" href="{{ $colors['url'] }}" target="_blank">{{ $colors['url'] }}</a>
                                                    @endif
                                                    {{ Form::image("img/remove_image.png", 'customer image', ['class'=>'design_link_remove_icon', 'id'=>$colors['design_plan_link'], 'data-type' => $colors['design_plan_type']])}}
                                                </div>
                                            @endforeach
                                        @endif
                                        {{ Form::button_ex('ADD A LINK', 'event.preventDefault(); designer_link_form(3, "color")', 'color') }}
                                    </div>
                                    <div class="no-left-pad col-md-4 col-xs-4">
                                        {{ Form::label_title('CUSTOMER SELECTIONS',\App\Helpers\FormComponentHelper::SIZE_TINY) }}
                                        @if(!empty($business_design_package_review['selected_'.\App\Models\Design_Plan::DESIGN_PLAN_TYPE_COLOR]))
                                            @foreach($business_design_package_review['selected_'.\App\Models\Design_Plan::DESIGN_PLAN_TYPE_COLOR] as $colors)
                                                {{ Form::image($colors['url'], 'customer image', [
                                                    'class'=>'design_image'.($colors['pivot']['selected'] == 1 ? ' selected_image' : ''),
                                                    'data-vp_atom'=>$colors['pivot']['visual_personality'],
                                                    'data-select_url'=>action('DesignPlanController@select_visual_personality', [$colors['pivot']['visual_personality']]),
                                                    'data-deselect_url'=>action('DesignPlanController@deselect_visual_personality', [$colors['pivot']['visual_personality']]),
                                                    ])
                                                }}
                                            @endforeach
                                        @else
                                            {{ Form::image(null, 'customer image', ['class'=>'design_image'])}}
                                        @endif
                                    </div>
                                </div>
                                {{ Form::separator_row_bottom('grey-divider') }}

                                {{-- Photos Section --}}
                                <div class="row">
                                    <div class="no-left-pad col-md-3 col-xs-4">
                                        {{ Form::label_title('Photos',\App\Helpers\FormComponentHelper::SIZE_MEDIUM) }}
                                    </div>
                                    <div class="no-left-pad col-md-5 col-xs-4">
                                        {{ Form::label_title('DESIGN DIRECTION',\App\Helpers\FormComponentHelper::SIZE_TINY) }}
                                        {{ Form::textarea_ex('photo_design_direction', $design_plan->photo_design_direction, 20) }}
                                        {{ Form::label_title('DEVELOPER NOTES',\App\Helpers\FormComponentHelper::SIZE_TINY) }}
                                        {{ Form::textarea_ex('photo_dev_direction', $design_plan->photo_dev_direction, 20) }}
                                        {{ Form::separator_row_bottom('grey-divider') }}
                                        @if(!$design_plan_links[\App\Models\Design_Plan::DESIGN_PLAN_TYPE_PHOTOS]->isEmpty())
                                            {{ Form::label_title('DESIGNER LINKS',\App\Helpers\FormComponentHelper::SIZE_TINY) }}
                                            @foreach($design_plan_links[\App\Models\Design_Plan::DESIGN_PLAN_TYPE_PHOTOS] as $photos)
                                                <div class="designer-link-url  no-left-pad col-md-12 col-xs-12" id="block-{{ $photos['design_plan_link'] }}">
                                                    @if(preg_match("#\.(jpg|jpeg|gif|png|bmp|tiff)$# i", $photos['url']))
                                                        <input src="{{ $photos['url'] }}" class="design_plan_links" name="customer image" type="image" value="{{ $photos['url'] }}">
                                                    @else
                                                        <a class="bt-label link-label bt-label-small" href="{{ $photos['url'] }}" target="_blank">{{ $photos['url'] }}</a>
                                                    @endif
                                                    {{ Form::image("img/remove_image.png", 'customer image', ['class'=>'design_link_remove_icon', 'id'=>$photos['design_plan_link'], 'data-type' => $photos['design_plan_type']])}}
                                                </div>
                                            @endforeach
                                        @endif
                                        {{ Form::button_ex('ADD A LINK', 'event.preventDefault(); designer_link_form(4, "photo")', 'photo') }}
                                    </div>
                                    <div class="no-left-pad col-md-4 col-xs-4">
                                        {{ Form::label_title('CUSTOMER SELECTIONS',\App\Helpers\FormComponentHelper::SIZE_TINY) }}
                                        @if(!empty($business_design_package_review['selected_'.\App\Models\Design_Plan::DESIGN_PLAN_TYPE_PHOTOS]))
                                            @foreach($business_design_package_review['selected_'.\App\Models\Design_Plan::DESIGN_PLAN_TYPE_PHOTOS] as $photos)
                                                {{ Form::image($photos['url'], 'customer image', [
                                                    'class'=>'design_image'.($photos['pivot']['selected'] == 1 ? ' selected_image' : ''),
                                                    'data-vp_atom'=>$photos['pivot']['visual_personality'],
                                                    'data-select_url'=>action('DesignPlanController@select_visual_personality', [$photos['pivot']['visual_personality']]),
                                                    'data-deselect_url'=>action('DesignPlanController@deselect_visual_personality', [$photos['pivot']['visual_personality']]),
                                                    ])
                                                }}
                                            @endforeach
                                        @else
                                            {{ Form::image(null, 'customer image', ['class'=>'design_image'])}}
                                        @endif
                                    </div>
                                </div>
                                {{ Form::separator_row_bottom('grey-divider') }}

                                {{-- Icons Section --}}
                                <div class="row">
                                    <div class="no-left-pad col-md-3 col-xs-4">
                                        {{ Form::label_title('Icons',\App\Helpers\FormComponentHelper::SIZE_MEDIUM) }}
                                    </div>
                                    <div class="no-left-pad col-md-5 col-xs-4">
                                        {{ Form::label_title('DESIGN DIRECTION',\App\Helpers\FormComponentHelper::SIZE_TINY) }}
                                        {{ Form::textarea_ex('icon_design_direction', $design_plan->icon_design_direction, 20) }}
                                        {{ Form::label_title('DEVELOPER NOTES',\App\Helpers\FormComponentHelper::SIZE_TINY) }}
                                        {{ Form::textarea_ex('icon_dev_direction', $design_plan->icon_dev_direction, 20) }}
                                        {{ Form::separator_row_bottom('grey-divider') }}
                                        @if(!$design_plan_links[\App\Models\Design_Plan::DESIGN_PLAN_TYPE_ICONS]->isEmpty())
                                            {{ Form::label_title('DESIGNER LINKS',\App\Helpers\FormComponentHelper::SIZE_TINY) }}
                                            @foreach($design_plan_links[\App\Models\Design_Plan::DESIGN_PLAN_TYPE_ICONS] as $icons)
                                                <div class="designer-link-url  no-left-pad col-md-12 col-xs-12" id="block-{{ $icons['design_plan_link'] }}">
                                                    @if(preg_match("#\.(jpg|jpeg|gif|png|bmp|tiff)$# i", $icons['url']))
                                                        <input src="{{ $icons['url'] }}" class="design_plan_links" name="customer image" type="image" value="{{ $icons['url'] }}">
                                                    @else
                                                        <a class="bt-label link-label bt-label-small" href="{{ $icons['url'] }}" target="_blank">{{ $icons['url'] }}</a>
                                                    @endif
                                                    {{ Form::image("img/remove_image.png", 'customer image', ['class'=>'design_link_remove_icon', 'id'=>$icons['design_plan_link'], 'data-type' => $icons['design_plan_type']])}}
                                                </div>
                                            @endforeach
                                        @endif
                                        {{ Form::button_ex('ADD A LINK', 'event.preventDefault(); designer_link_form(5, "icon")', 'icon') }}
                                    </div>
                                    <div class="no-left-pad col-md-4 col-xs-4">
                                        {{ Form::label_title('CUSTOMER SELECTIONS',\App\Helpers\FormComponentHelper::SIZE_TINY) }}
                                        @if(!empty($business_design_package_review['selected_'.\App\Models\Design_Plan::DESIGN_PLAN_TYPE_ICONS]))
                                            @foreach($business_design_package_review['selected_'.\App\Models\Design_Plan::DESIGN_PLAN_TYPE_ICONS] as $icons)
                                                {{ Form::image($icons['url'], 'customer image', [
                                                    'class'=>'design_image'.($icons['pivot']['selected'] == 1 ? ' selected_image' : ''),
                                                    'data-vp_atom'=>$icons['pivot']['visual_personality'],
                                                    'data-select_url'=>action('DesignPlanController@select_visual_personality', [$icons['pivot']['visual_personality']]),
                                                    'data-deselect_url'=>action('DesignPlanController@deselect_visual_personality', [$icons['pivot']['visual_personality']]),
                                                    ])
                                                }}
                                            @endforeach
                                        @else
                                            {{ Form::image(null, 'customer image', ['class'=>'design_image'])}}
                                        @endif
                                    </div>
                                </div>
                                {{ Form::separator_row_bottom('grey-divider') }}

                                {{-- Patterns Section --}}
                                <div class="row">
                                    <div class="no-left-pad col-md-3 col-xs-4">
                                        {{ Form::label_title('Patterns',\App\Helpers\FormComponentHelper::SIZE_MEDIUM) }}
                                    </div>
                                    <div class="no-left-pad col-md-5 col-xs-4">
                                        {{ Form::label_title('DESIGN DIRECTION',\App\Helpers\FormComponentHelper::SIZE_TINY) }}
                                        {{ Form::textarea_ex('pattern_design_direction', $design_plan->pattern_design_direction, 20) }}
                                        {{ Form::label_title('DEVELOPER NOTES',\App\Helpers\FormComponentHelper::SIZE_TINY) }}
                                        {{ Form::textarea_ex('pattern_dev_direction', $design_plan->pattern_dev_direction, 20) }}
                                        {{ Form::separator_row_bottom('grey-divider') }}
                                        @if(!$design_plan_links[\App\Models\Design_Plan::DESIGN_PLAN_TYPE_PATTERNS]->isEmpty())
                                            {{ Form::label_title('DESIGNER LINKS',\App\Helpers\FormComponentHelper::SIZE_TINY) }}
                                            @foreach($design_plan_links[\App\Models\Design_Plan::DESIGN_PLAN_TYPE_PATTERNS] as $patterns)
                                                <div class="designer-link-url  no-left-pad col-md-12 col-xs-12" id="block-{{ $patterns['design_plan_link'] }}">
                                                    @if(preg_match("#\.(jpg|jpeg|gif|png|bmp|tiff)$# i", $patterns['url']))
                                                        <input src="{{ $patterns['url'] }}" class="design_plan_links" name="customer image" type="image" value="{{ $patterns['url'] }}">
                                                    @else
                                                        <a class="bt-label link-label bt-label-small" href="{{ $patterns['url'] }}" target="_blank">{{ $patterns['url'] }}</a>
                                                    @endif
                                                    {{ Form::image("img/remove_image.png", 'customer image', ['class'=>'design_link_remove_icon', 'id'=>$patterns['design_plan_link'], 'data-type' => $patterns['design_plan_type']])}}
                                                </div>
                                            @endforeach
                                        @endif
                                        {{ Form::button_ex('ADD A LINK', 'event.preventDefault(); designer_link_form(6, "pattern")', 'pattern') }}
                                    </div>
                                    <div class="no-left-pad col-md-4 col-xs-4">
                                        {{ Form::label_title('CUSTOMER SELECTIONS',\App\Helpers\FormComponentHelper::SIZE_TINY) }}
                                        @if(!empty($business_design_package_review['selected_'.\App\Models\Design_Plan::DESIGN_PLAN_TYPE_PATTERNS]))
                                            @foreach($business_design_package_review['selected_'.\App\Models\Design_Plan::DESIGN_PLAN_TYPE_PATTERNS] as $patterns)
                                                {{ Form::image($patterns['url'], 'customer image', [
                                                    'class'=>'design_image'.($patterns['pivot']['selected'] == 1 ? ' selected_image' : ''),
                                                    'data-vp_atom'=>$patterns['pivot']['visual_personality'],
                                                    'data-select_url'=>action('DesignPlanController@select_visual_personality', [$patterns['pivot']['visual_personality']]),
                                                    'data-deselect_url'=>action('DesignPlanController@deselect_visual_personality', [$patterns['pivot']['visual_personality']]),
                                                    ])
                                                }}
                                            @endforeach
                                        @else
                                            {{ Form::image(null, 'customer image', ['class'=>'design_image'])}}
                                        @endif
                                    </div>
                                </div>
                                {{ Form::separator_row_bottom('grey-divider') }}

                                {{-- Texture Section --}}
                                <div class="row">
                                    <div class="no-left-pad col-md-3 col-xs-4">
                                        {{ Form::label_title('Textures',\App\Helpers\FormComponentHelper::SIZE_MEDIUM) }}
                                    </div>
                                    <div class="no-left-pad col-md-5 col-xs-4">
                                        {{ Form::label_title('DESIGN DIRECTION',\App\Helpers\FormComponentHelper::SIZE_TINY) }}
                                        {{ Form::textarea_ex('texture_design_direction', $design_plan->texture_design_direction, 20) }}
                                        {{ Form::label_title('DEVELOPER NOTES',\App\Helpers\FormComponentHelper::SIZE_TINY) }}
                                        {{ Form::textarea_ex('texture_dev_direction', $design_plan->texture_dev_direction, 20) }}
                                        {{ Form::separator_row_bottom('grey-divider') }}
                                        @if(!$design_plan_links[\App\Models\Design_Plan::DESIGN_PLAN_TYPE_TEXTURES]->isEmpty())
                                            {{ Form::label_title('DESIGNER LINKS',\App\Helpers\FormComponentHelper::SIZE_TINY) }}
                                            @foreach($design_plan_links[\App\Models\Design_Plan::DESIGN_PLAN_TYPE_TEXTURES] as $textures)
                                                <div class="designer-link-url  no-left-pad col-md-12 col-xs-12" id="block-{{ $textures['design_plan_link'] }}">
                                                    @if(preg_match("#\.(jpg|jpeg|gif|png|bmp|tiff)$# i", $textures['url']))
                                                        <input src="{{ $textures['url'] }}" class="design_plan_links" name="customer image" type="image" value="{{ $textures['url'] }}">
                                                    @else
                                                        <a class="bt-label link-label bt-label-small" href="{{ $textures['url'] }}" target="_blank">{{ $textures['url'] }}</a>
                                                    @endif
                                                    {{ Form::image("img/remove_image.png", 'customer image', ['class'=>'design_link_remove_icon', 'id'=>$textures['design_plan_link'], 'data-type' => $textures['design_plan_type']])}}
                                                </div>
                                            @endforeach
                                        @endif
                                        {{ Form::button_ex('ADD A LINK', 'event.preventDefault(); designer_link_form(7, "texture")', 'texture') }}
                                    </div>
                                    <div class="no-left-pad col-md-4 col-xs-4">
                                        {{ Form::label_title('CUSTOMER SELECTIONS',\App\Helpers\FormComponentHelper::SIZE_TINY) }}
                                        @if(!empty($business_design_package_review['selected_'.\App\Models\Design_Plan::DESIGN_PLAN_TYPE_TEXTURES]))
                                            @foreach($business_design_package_review['selected_'.\App\Models\Design_Plan::DESIGN_PLAN_TYPE_TEXTURES] as $textures)
                                                {{ Form::image($textures['url'], 'customer image', [
                                                    'class'=>'design_image'.($textures['pivot']['selected'] == 1 ? ' selected_image' : ''),
                                                    'data-vp_atom'=>$textures['pivot']['visual_personality'],
                                                    'data-select_url'=>action('DesignPlanController@select_visual_personality', [$textures['pivot']['visual_personality']]),
                                                    'data-deselect_url'=>action('DesignPlanController@deselect_visual_personality', [$textures['pivot']['visual_personality']]),
                                                    ])
                                                }}
                                            @endforeach
                                        @else
                                            {{ Form::image(null, 'customer image', ['class'=>'design_image'])}}
                                        @endif
                                    </div>
                                </div>
                                {{ Form::separator_row_bottom('grey-divider') }}

                                {{-- Typography Section --}}
                                <div class="row">
                                    <div class="no-left-pad col-md-3 col-xs-4">
                                        {{ Form::label_title('TYPOGRAPHY',\App\Helpers\FormComponentHelper::SIZE_MEDIUM) }}
                                    </div>
                                    <div class="no-left-pad col-md-5 col-xs-4">
                                        {{ Form::label_title('DESIGN DIRECTION',\App\Helpers\FormComponentHelper::SIZE_TINY) }}
                                        {{ Form::textarea_ex('typography_design_direction', $design_plan->typography_design_direction, 20) }}
                                        {{ Form::label_title('DEVELOPER NOTES',\App\Helpers\FormComponentHelper::SIZE_TINY) }}
                                        {{ Form::textarea_ex('typography_dev_direction', $design_plan->typography_dev_direction, 20) }}
                                        {{ Form::separator_row_bottom('grey-divider') }}
                                        @if(!$design_plan_links[\App\Models\Design_Plan::DESIGN_PLAN_TYPE_TYPOGRAPHY]->isEmpty())
                                            {{ Form::label_title('DESIGNER LINKS',\App\Helpers\FormComponentHelper::SIZE_TINY) }}
                                            @foreach($design_plan_links[\App\Models\Design_Plan::DESIGN_PLAN_TYPE_TYPOGRAPHY] as $typography)
                                                <div class="designer-link-url  no-left-pad col-md-12 col-xs-12" id="block-{{ $typography['design_plan_link'] }}">
                                                    @if(preg_match("#\.(jpg|jpeg|gif|png|bmp|tiff)$# i", $typography['url']))
                                                        <input src="{{ $typography['url'] }}" class="design_plan_links" name="customer image" type="image" value="{{ $typography['url'] }}">
                                                    @else
                                                        <a class="bt-label link-label bt-label-small" href="{{ $typography['url'] }}" target="_blank">{{ $typography['url'] }}</a>
                                                    @endif
                                                    {{ Form::image("img/remove_image.png", 'customer image', ['class'=>'design_link_remove_icon', 'id'=>$typography['design_plan_link'], 'data-type' => $typography['design_plan_type']])}}
                                                </div>
                                            @endforeach
                                        @endif
                                        {{ Form::button_ex('ADD A LINK', 'designer_link_form(10, "typography")', 'typography') }}
                                    </div>
                                    <div class="no-left-pad col-md-4 col-xs-4"></div>
                                </div>
                                <div class="row">
                                    <div class="no-left-pad col-md-3 col-xs-4"></div>
                                    <div class="no-left-pad col-md-8 col-xs-4">
                                        {{ Form::separator_row_bottom('grey-divider') }}
                                        {{ Form::label_title('DESIGNER FONT SELECTIONS',\App\Helpers\FormComponentHelper::SIZE_TINY) }}
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="no-left-pad col-md-3 col-xs-4"></div>
                                    <div class="no-left-pad col-md-8 col-xs-4">
                                        {{ Form::row_text_inline('heading_1', 'Heading 1', $design_plan->heading_1, 4, 8, \App\Helpers\FormComponentHelper::SIZE_MEDIUM) }}
                                        {{ Form::row_text_inline('heading_2', 'Heading 2', $design_plan->heading_2, 4, 8, \App\Helpers\FormComponentHelper::SIZE_MEDIUM) }}
                                        {{ Form::row_text_inline('heading_3', 'Heading 3', $design_plan->heading_3, 4, 8, \App\Helpers\FormComponentHelper::SIZE_MEDIUM) }}
                                        {{ Form::row_text_inline('body_text', 'Body Text', $design_plan->body_text, 4, 8, \App\Helpers\FormComponentHelper::SIZE_MEDIUM) }}
                                        {{ Form::row_text_inline('navigation', 'Navigation', $design_plan->navigation, 4, 8, \App\Helpers\FormComponentHelper::SIZE_MEDIUM) }}
                                        {{ Form::row_text_inline('links', 'Links', $design_plan->links, 4, 8, \App\Helpers\FormComponentHelper::SIZE_MEDIUM) }}
                                        {{ Form::row_text_inline('link_hover', 'Link Hover', $design_plan->link_hover, 4, 8, \App\Helpers\FormComponentHelper::SIZE_MEDIUM) }}
                                        {{ Form::hidden('business', $business->business) }}
                                    </div>
                                </div>
                                {{ Form::separator_row_bottom('grey-divider') }}

                                {{-- Inspiration Sites Section --}}
                                {{ Form::label_ex('Inspiration Sites', \App\Helpers\FormComponentHelper::SIZE_EXLARGE) }}
                                {{ Form::button_save('ADD A SITE', 'add_site', 'add_site') }}
                                <div class="row">
                                    <div class="no-left-pad col-md-3 col-xs-4"></div>
                                    <div class="no-left-pad col-md-8 col-xs-4" id="inspiration-site-list">
                                        @if(!empty($inspiration_sites))
                                            @foreach($inspiration_sites as $inspiration_site)
                                                {{ Form::separator_row_bottom('grey-divider separator_'.$inspiration_site->inspiration_site) }}
                                                <div class="added-site-display inspiration-site-list_{{ $inspiration_site->inspiration_site }}">
                                                    <div class="row">
                                                        <div class="no-left-pad col-md-4 col-xs-4">
                                                            {{ Form::label_title('Link', \App\Helpers\FormComponentHelper::SIZE_MEDIUM) }}
                                                        </div>
                                                        <div class="no-left-pad col-md-8 col-xs-8">
                                                            <a id="link_{{ $inspiration_site->inspiration_site }}" class="bt-label link-label bt-label-small" href="{{ $inspiration_site['url'] }}" target="_blank">{{ $inspiration_site['url'] }}</a>
                                                        </div>
                                                    </div>
                                                    <div class="row">
                                                        <div class="no-left-pad col-md-4 col-xs-4">
                                                            {{ Form::label_title('Characteristic', \App\Helpers\FormComponentHelper::SIZE_MEDIUM) }}
                                                        </div>
                                                        <div class="no-left-pad col-md-8 col-xs-8" id="characteristics_{{ $inspiration_site->inspiration_site }}">
                                                            {{ $inspiration_site->characteristics }}
                                                        </div>
                                                    </div>
                                                    <div class="row">
                                                        {{ Form::label_styled('Comments', null, \App\Helpers\FormComponentHelper::SIZE_MEDIUM, 4) }}
                                                        {{ Form::textarea_styled('saved_comments', $inspiration_site->comments, 'design-plan-textarea', true, 8, null, 'comments_'.$inspiration_site->inspiration_site) }}
                                                    </div>
                                                    <div class="row">
                                                        <div class="no-left-pad col-md-4 col-xs-4"></div>
                                                        <div class="no-left-pad col-md-8 col-xs-8">
                                                            {{ Form::button_tiny('EDIT', 'event.preventDefault(); show_edit_form("'.$inspiration_site->inspiration_site.'")','edit_site_'.$inspiration_site->inspiration_site) }}
                                                            {{ Form::button_tiny('DELETE', 'event.preventDefault(); post_delete_inspiration("'.$inspiration_site->inspiration_site.'")','delete_site_'.$inspiration_site->inspiration_site) }}
                                                        </div>
                                                    </div>
                                                    {{ Form::separator_row_empty() }}
                                                </div>
                                            @endforeach
                                        @endif
                                        <div class="add-site-form">
                                            {{ Form::row_text_inline('url', 'Link', null, 4, 8, \App\Helpers\FormComponentHelper::SIZE_MEDIUM) }}
                                            <div class="row">
                                            <div class="no-left-pad col-md-4 col-xs-4">
                                                {{ Form::label_title('Characteristic', \App\Helpers\FormComponentHelper::SIZE_MEDIUM) }}
                                            </div>
                                            @foreach(\App\Models\Inspiration_Site::$inspiration_site_charateristic_map as $key => $value)
                                                @if($key != 'impact_area')
                                                    <div class="no-left-pad col-md-4 col-xs-4"></div>
                                                @endif
                                                {{ Form::checkbox_row($key.'_check_option', null, $value, null, $key.'_checkbox', 4) }}
                                            @endforeach
                                            </div>
                                            {{ Form::row_textarea_inline('comments', 'Comments', null, 4, 8, \App\Helpers\FormComponentHelper::SIZE_MEDIUM) }}
                                            <div class="row bt-button-row text-right" style="margin-right: 15px">
                                                @if(\App\Providers\AuthServiceProvider::user_has_permission([\App\Providers\AuthServiceProvider::CSMCCT,\App\Providers\AuthServiceProvider::GATE_DESIGN_MANAGER]))
                                                    {{ Form::button_safe_save('Save', null, 'save-inspiration', \App\Helpers\FormComponentHelper::SIZE_SMALL) }}
                                                    {{ Form::button_link('Cancel', $cancel_url, 'cancel-inspiration', \App\Helpers\FormComponentHelper::SIZE_SMALL) }}
                                                @endif
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                {{ Form::separator_row_bottom('grey-divider') }}

                                {{-- Requested Features Section --}}
                                {{ Form::label_ex('Requested Features', \App\Helpers\FormComponentHelper::SIZE_EXLARGE) }}
                                <div class="row">
                                    <div class="no-left-pad col-md-3 col-xs-4">
                                        {{ Form::label_title('',\App\Helpers\FormComponentHelper::SIZE_MEDIUM) }}
                                    </div>
                                    <div class="no-left-pad col-md-8 col-xs-4">
                                        @include('shared._website_functionality_edit', ['data' => $sales_prep, 'title' => 'Website Functionality List',
                                        'other_title' => 'Features Requested', 'is_edit' => true])
                                        {{ Form::hidden('redirect', null, ['class' => 'promo_input input-field-default'])}}
                                        {{ Form::label_title('DEVELOPER NOTES',\App\Helpers\FormComponentHelper::SIZE_TINY) }}
                                        {{ Form::textarea_ex('feature_dev_direction', $design_plan->feature_dev_direction, 20) }}
                                    </div>
                                </div>
                            </div>
                            <div class="row bt-button-row text-right">
                                @if(\App\Providers\AuthServiceProvider::user_has_permission([\App\Providers\AuthServiceProvider::CSMCCT,\App\Providers\AuthServiceProvider::GATE_DESIGN_MANAGER]))
                                    {{ Form::button_save('Save', 'save') }}
                                    {{ Form::button_link('Cancel', $cancel_url) }}
                                @endif
                            </div>
                        </div>
                    {{ Form::close() }}
                </div>
            </div>
        </div>
    </div>
@endsection

@section('page_script')
    @include('shared_script._website_sidebar_script')
    <script>
        function designer_link_form(type, id)
        {
            design_plan_update_ajax('{{ $save_url }}', $('form').serialize());
            var append_form = '' +
                '<div class="row" id="'+id+'-block">' +
                    '<div class="no-left-pad col-md-10 col-xs-4">' +
                        '<div class="no-left-pad col-md-medium col-xs-medium">' +
                            '<input id="'+ id +'_text" class="bt-input bt-text " placeholder="Add the URL to an image." name="'+ id +'_text" type="text">' +
                        '</div>' +
                    '</div>' +
                    '<div class="no-left-pad col-md-2 col-xs-4">' +
                        '<input id="save_'+ id +'" onclick="this.disabled = true; event.preventDefault(); post_design_link('+type+',\''+id+'\')" class="bt-btn-medium uppercase bt-button design-link-btn" value="save" name="save-'+ id +'" type="submit">' +
                    '</div>' +
                '</div>';
            $('#'+id).parent().append(append_form);
            $('#'+id).hide();
        }

        function post_design_link(type, id)
        {
            var url = $('#'+id+'_text').val();
            if(/^(?:(ftp|http|https):\/\/)?[a-z0-9]+([\-\.]{1}[a-z0-9]+)*\.[a-z]{2,5}(:[0-9]{1,5})?(\/.*)?$/i.test(url)) {

                if(url.indexOf('http://') >= 0 || url.indexOf('https://') >= 0 || url.indexOf('ftp://') >= 0)
                {
                    //do nothing
                }
                else // append "http://"
                    url = 'http://' + url;

                $.ajax({
                    url: '{{ action('DesignPlanLinkController@post_create', compact('website_request', 'design_plan')) }}',
                    method: 'POST',
                    data: {
                        'link': url,
                        'type': type
                    },
                    success: function(data) {
                        var append_image = '<div class="designer-link-url  no-left-pad col-md-12 col-xs-12" id="block-' + data.design_plan_link + '">';
                        if(checkImageURL(url))
                            append_image = append_image + '<input src="' + url + '" class="design_plan_links" name="customer image" type="image" value="' + url + '"> ';
                        else
                            append_image = append_image + '<a class="bt-label link-label bt-label-small" href="' + url + '" target="_blank"> '+ url + '</a>';
                        append_image = append_image + '<input class="design_link_remove_icon" onclick="event.preventDefault(); delete_design_link(' + data.design_plan_link + ',' + type +')" src="{{URL::to('/')}}/img/remove_image.png" name="customer image" type="image" id="' + data.design_plan_link + '"></div>';
                        $(append_image).insertBefore($('#'+id));
                        $('#'+id+'-error').remove();
                        $('#'+id+'-block').remove();
                        $('#'+id).show();
                    },
                    error: function(data) {
                        // todo
                    }
                });
            }
            else {
                $('#'+id+'-error').remove();
                $('<label class="error-lbl" id=\''+id+'-error\'>Invalid URL.</label>').insertBefore($('#'+id+'-block'));
                $('#'+id+'_text').addClass('error');
                $('#save_'+id).prop('disabled', false);
            }
        }

        function delete_design_link(design_plan_link, type)
        {
            $.ajax({
                url: '{{ action('DesignPlanLinkController@delete', compact('website_request', 'design_plan')) }}',
                method: 'POST',
                data: {
                    'design_plan_link': design_plan_link,
                    'type' : type
                },
                success: function(data) {
                    $('#block-'+design_plan_link).remove();
                },
                error: function(data) {
                    // todo
                }
            });
        }

        function visual_personality_update(url)
        {
            $.ajax({
                url: url,
                method: 'POST',
                data: {
                    business: '{{ $business->business }}'
                },
                success: function(data) {
                    // todo
                },
                error: function(data) {
                    // todo
                }
            });
        }

        function checkImageURL(url) {
            return(url.match(/\.(jpeg|jpg|gif|png|bmp|tiff)$/) != null);
        }


        function design_plan_update_ajax(url, form_data)
        {
            $.ajax({
                url: url,
                method: 'POST',
                data: $('form').serialize(),
                success: function(data) {
                },
                error: function(data) {
                    // todo
                }
            });
        }

        $(document).ready(function() {
            $('#view-documentation').children().addClass('overwrite-text-color');
            $('.design_link_remove_icon').click(function(e){
                e.preventDefault();
                var id = $(this).attr('id');
                var type = $(this).data('type');
                delete_design_link(id, type);
            });
            items_autoheight('.design-plan-textarea');

            $('.design_plan_links').click(function (e) {
                e.preventDefault();
            });
            $('.design_plan_links').css('cursor','default');

            $('#parent_theme').change(function(){
                $.ajax({
                    url: '{{ action('DesignPlanController@show_child_theme') }}',
                    method: 'POST',
                    data: {
                        parent_theme: $(this).val()
                    },
                    success: function(data) {
                        console.log(data);
                        $('#child_theme').empty();
                        $.each(data.data, function (i, item) {
                            $('#child_theme').append($('<option>', {
                                value: item.child_theme,
                                text : item.child_theme_name
                            }));
                        });
                    },
                    error: function(data) {
                        // todo
                    }
                });
            });
            $('#parent_theme').change();
            $('input[type="image"]').val('');

            $('#add_site').click(function(e) {
                $('#save-inspiration').prop('disabled', false);
                e.preventDefault();
                design_plan_update_ajax('{{ $save_url }}', $('form').serialize());
                $(this).hide();
                $('.add-site-form').show();
                $('#url-error').remove();
                $('#url').removeClass('error');
                $('.add-site-form .bt-checkbox').prop('checked',false);
                $('.add-site-form #url').val('');
                $('.add-site-form #comments').val('');
            });

            $('#cancel-inspiration').click(function(e) {
                e.preventDefault();
                $('.add-site-form').hide();
                $('#add_site').show();
            });

            $('#save-inspiration').click(function(e) {
                $('#save-inspiration').prop('disabled', true);
                e.preventDefault();
                var url = $('#url').val();
                if(/^(?:(ftp|http|https):\/\/)?[a-z0-9]+([\-\.]{1}[a-z0-9]+)*\.[a-z]{2,5}(:[0-9]{1,5})?(\/.*)?$/i.test(url))
                {
                    if(url.indexOf('http://') >= 0 || url.indexOf('https://') >= 0 || url.indexOf('ftp://') >= 0)
                    {
                        //do nothing
                    }
                    else // append "http://"
                        url = 'http://' + url;
                    do_action(url, null);
                }
                else
                {
                    $('#url-error').remove();
                    $('<label class="error-lbl" id="url-error">Invalid URL.</label>').insertBefore($('#url'));
                    $('#url').addClass('error');
                    $('#save-inspiration').prop('disabled', false);
                }
            });
        });

        $('.design-plan-remove-row').remove();
        $('.design-plan-remove-separator-row').parent().remove();
        $('.col-md-6').addClass('no-left-pad');

        var addclass = 'selected_image';
        $('.design_image').click(function(e) {
            e.preventDefault();
            if ($( this ).hasClass( "selected_image" ))
            {
                visual_personality_update($(this).data('deselect_url'));
                $(this).removeClass(addclass);
            }
            else
            {
                visual_personality_update($(this).data('select_url'));
                $(this).addClass(addclass);
            }
        });

        function do_action(url, inspiration_site)
        {
            var post_url = '{{ action('DesignPlanController@post_create_inspiration_site', compact('design_plan')) }}';
            if(inspiration_site)
                post_url = '{{ action('DesignPlanController@post_update_inspiration_site') }}';
            $.ajax({
                url: post_url,
                method: 'POST',
                data: {
                    inspiration_site:inspiration_site,
                    url : url,
                    impact_area : $('.add-site-form'+(inspiration_site ? inspiration_site : '') +' #impact_area_checkbox').is(":checked") ? 1 : 0,
                    structure : $('.add-site-form'+(inspiration_site ? inspiration_site : '') +' #structure_checkbox').is(":checked") ? 1 : 0,
                    colors : $('.add-site-form'+(inspiration_site ? inspiration_site : '') +' #colors_checkbox').is(":checked") ? 1 : 0,
                    images : $('.add-site-form'+(inspiration_site ? inspiration_site : '') +' #images_checkbox').is(":checked") ? 1 : 0,
                    visual_flow : $('.add-site-form'+(inspiration_site ? inspiration_site : '') +' #visual_flow_checkbox').is(":checked") ? 1 : 0,
                    comments : $('.add-site-form'+(inspiration_site ? inspiration_site : '') +' #comments').val()
                },
                success: function(data) {
                    var characteristics = new Array();
                    var inspiration_added =
                            '<div class="row separator-row separator-row-bottom">' +
                                '<hr class="grey-divider separator_'+data.inspiration_site.inspiration_site+'">' +
                            '</div>'+
                            '<div class="added-site-display inspiration-site-list_'+data.inspiration_site.inspiration_site+'">' +
                                '<div class="row">' +
                                    '<div class="no-left-pad col-md-4 col-xs-4">' +
                                        '<div class="no-left-pad col-md-12 col-xs-12 ">' +
                                            '<label class="bt-label bt-label-medium" for="">Link</label>' +
                                        '</div>' +
                                    '</div>' +
                                    '<div class="no-left-pad col-md-8 col-xs-8">' +
                                        '<a class="bt-label link-label bt-label-small" id="link_'+data.inspiration_site.inspiration_site+'" href="'+data.inspiration_site.url+'" target="_blank">'+data.inspiration_site.url+'</a>' +
                                    '</div>' +
                                '</div>' +
                                '<div class="row">' +
                                    '<div class="no-left-pad col-md-4 col-xs-4">' +
                                        '<div class="no-left-pad col-md-12 col-xs-12 ">' +
                                            '<label class="bt-label bt-label-medium" for="">Characteristic</label>' +
                                        '</div>' +
                                    '</div>' +
                                    '<div class="no-left-pad col-md-8 col-xs-8" id="characteristics_'+data.inspiration_site.inspiration_site+'"> '+ data.inspiration_site.characteristics +' </div>' +
                                '</div>' +
                                '<div class="row">' +
                                    '<div class="no-left-pad col-md-4 col-xs-4">' +
                                        '<div class="no-left-pad col-md-12 col-xs-12 ">' +
                                            '<label class="bt-label bt-label-medium" for="">Comments</label>' +
                                        '</div>' +
                                    '</div>' +
                                    '<div class="no-left-pad col-md-8 col-xs-8"> <textarea class="design-plan-textarea" disabled="disabled" id="comments_'+data.inspiration_site.inspiration_site+'">'+data.inspiration_site.comments+' </textarea> </div>' +
                                '</div>' +
                                '<div class="row">' +
                                    '<div class="no-left-pad col-md-4 col-xs-4"></div>'+
                                    '<div class="no-left-pad col-md-8 col-xs-8">' +
                                    '<input id="edit_site_"'+data.inspiration_site.inspiration_site+' class="bt-btn-tiny uppercase bt-button" value="EDIT" style="width: auto;white-space: inherit;" onclick="event.preventDefault(); show_edit_form(\''+data.inspiration_site.inspiration_site+'\')" type="button">&nbsp;'+
                                    '<input id="delete_site_"'+data.inspiration_site.inspiration_site+' class="bt-btn-tiny uppercase bt-button" value="DELETE" style="width: auto;white-space: inherit;" onclick="event.preventDefault(); post_delete_inspiration(\''+data.inspiration_site.inspiration_site+'\')" type="button">'+
                                    '</div>' +
                                '</div>' +
                                '<div class="row separator-row spacer-row "> </div> ' +
                            '</div>';
                    if(data.new_record == 1)
                        $(inspiration_added).insertBefore($('.add-site-form'));
                    else
                    {
                        $('#link_'+inspiration_site).text(data.inspiration_site.url);
                        $('#characteristics_'+inspiration_site).text(data.inspiration_site.characteristics);
                        $('#comments_'+inspiration_site).text(data.inspiration_site.comments);
                        $('.inspiration-site-list_'+data.inspiration_site.inspiration_site).show();
                    }
                    $('.add-site-form').hide();
                    $('#add_site').show();
                    $('.add-site-form .bt-checkbox').prop('checked',false);
                    $('.add-site-form #url').val('');
                    $('.add-site-form #comments').val('');
                    $('.add-site-form'+inspiration_site).remove();

                    items_autoheight('.design-plan-textarea');
                },
                error: function(data) {
                    // todo
                }
            });
        }

        function close_edit_form(inspiration_site)
        {
            $('.add-site-form'+inspiration_site).hide();
            $('.inspiration-site-list_'+inspiration_site).show();
        }

        function post_edit_form(inspiration_site)
        {
            var url = $('.add-site-form'+inspiration_site+' #url').val();
            if(/^(?:(ftp|http|https):\/\/)?[a-z0-9]+([\-\.]{1}[a-z0-9]+)*\.[a-z]{2,5}(:[0-9]{1,5})?(\/.*)?$/i.test(url))
            {
                if(url.indexOf('http://') >= 0 || url.indexOf('https://') >= 0 || url.indexOf('ftp://') >= 0)
                {
                    //do nothing
                }
                else // append "http://"
                    url = 'http://' + url;
                do_action(url, inspiration_site);
                $('.add-site-form'+inspiration_site).remove();
            }
            else
            {
                $('.add-site-form'+inspiration_site+' #url-error').remove();
                $('<label class="error-lbl" id="url-error">Invalid URL.</label>').insertBefore($('.add-site-form'+inspiration_site+' #url'));
                $('.add-site-form'+inspiration_site+' #url').addClass('error');
            }

        }

        function show_edit_form(inspiration_site)
        {
            $.ajax({
                url: '{{ action('DesignPlanController@get_inspiration_site_details') }}',
                method: 'POST',
                data: { 'inspiration_site':inspiration_site },
                success: function (data) {
                    var addsite = $('.add-site-form').html();
                    var add_site_form = '<div class="add-site-form'+data.inspiration_site.inspiration_site+'">'+addsite+'</div>';
                    $(add_site_form).insertAfter($('.inspiration-site-list_'+data.inspiration_site.inspiration_site));
                    $('.add-site-form'+data.inspiration_site.inspiration_site+' #cancel-inspiration').attr('id', 'cancel_'+data.inspiration_site.inspiration_site);
                    $('.add-site-form'+data.inspiration_site.inspiration_site+' #cancel_'+data.inspiration_site.inspiration_site).attr('onclick','event.preventDefault(); close_edit_form('+data.inspiration_site.inspiration_site+');');
                    $('.add-site-form'+data.inspiration_site.inspiration_site+' #save-inspiration').attr('id', 'save_'+data.inspiration_site.inspiration_site);
                    $('.add-site-form'+data.inspiration_site.inspiration_site+' #save_'+data.inspiration_site.inspiration_site).attr('onclick','event.preventDefault(); post_edit_form('+data.inspiration_site.inspiration_site+');');
                    $('.inspiration-site-list_'+data.inspiration_site.inspiration_site).hide();
                    $('.add-site-form'+data.inspiration_site.inspiration_site+' #url').removeClass('error');
                    $('.add-site-form'+data.inspiration_site.inspiration_site+' #impact_area_checkbox').prop('checked', data.inspiration_site.impact_area ? true : false);
                    $('.add-site-form'+data.inspiration_site.inspiration_site+' #structure_checkbox').prop('checked', data.inspiration_site.structure ? true : false);
                    $('.add-site-form'+data.inspiration_site.inspiration_site+' #colors_checkbox').prop('checked', data.inspiration_site.colors ? true : false);
                    $('.add-site-form'+data.inspiration_site.inspiration_site+' #images_checkbox').prop('checked', data.inspiration_site.images ? true : false);
                    $('.add-site-form'+data.inspiration_site.inspiration_site+' #visual_flow_checkbox').prop('checked', data.inspiration_site.visual_flow ? true : false);
                    $('.add-site-form'+data.inspiration_site.inspiration_site+' #comments').val(data.inspiration_site.comments);
                    $('.add-site-form'+data.inspiration_site.inspiration_site+' #url').val(data.inspiration_site.url);
                    $('.add-site-form'+data.inspiration_site.inspiration_site+' #url-error').remove();
                }
            });
        }

        function post_delete_inspiration(inspiration_site)
        {
            $.ajax({
                url: '{{ action('DesignPlanController@post_delete_inspiration_site') }}',
                method: 'POST',
                data: { 'inspiration_site':inspiration_site },
                success: function (data) {
                    $('.separator_'+data.inspiration_site).parent().remove();
                    $('.inspiration-site-list_'+data.inspiration_site).remove();
                }
            });
        }

    </script>
@endsection

@section('page_style')
    <style>
        .design-plan-detail-right-side .white-bg .row:first-child{
            padding-top: 0;
        }

        .design-plan-detail-right-side .white-bg .row:last-child {
            padding-bottom: 0;
        }

        .design-plan-detail-right-side .white-bg .row{
            padding: 5px 0;
        }

        .design-plan-detail-right-side {
            font-size: 14px !important;
            font-weight: 300;
        }

        .separator-row-bottom {
            padding-bottom: 20px!important;
        }

        .overwrite-text-color {
            color: #000000!important;
            font-weight: bold!important;
        }

        .design_image {
            width:110px;
            height:83.44px;
            border:none;
            padding:0;
        }

        .design_plan_links {
            width:100%;
            border:none;
            padding:0;
            font-size:14px;
        }

        .design_link_remove_icon {
            width:23px;
            border:none;
            padding:0;
            position:absolute;
            right: 25px;
            top:10px
        }

        .design-link-btn {
            height: 43px!important;
            margin-left: -11px!important;
            padding: 0!important;
            text-align: center!important;
            width: 53px!important;
        }

        .selected_image {
            border: 3px solid #cb2236;
        }

        .error {
            border: 1px solid #cc0000;
        }

        .error-lbl {
            font-family: "Open Sans Light","Open Sans",sans-serif;
            font-size: 14px;
            margin-bottom: -10px;
            margin-left: 0;
            white-space: nowrap;
            color: #cc0000;
        }

        .design_image:focus {
            border-color: #cb2236!important;
        }

        .link-label {
            color: #949494!important;
        }

        .link-label:hover {
            color: #595959!important;
        }

        .designer-link-url {
            position: relative;
            float:left;
        }

        #add_site {
            margin-left: 47px;
        }

        .add-site-form {
            display: none;
            border: 2px solid #F0F0F0;
            padding: 10px;
        }

        .design-plan-textarea {
            border: none;
            resize: none;
            padding-left: 0;
            color: #424242;
            margin-bottom: 0;
        }

    </style>
@endsection