@extends('layouts.master')
@section('page_title', 'Edit Mosaic Metros')
@section('content')
    {!! Form::open(['url' => action('MosaicController@post_business_metro', compact('business'))]) !!}
    <div class="container campaign edit-campaign">
        {{ Form::page_header("Edit Mosaic Metros", "paper_stack") }}
        <div class="row">
            <div class="col-md-12 grey-bg curve_container">
                @include('shared._message_all')
                <div class="error-container-mosaic_metro"></div>
                <div class="error-container-primary_metro"></div>
                {{ Form::label_styled2('Mosaic Metro', 'grid-header', null, null, \App\Helpers\FormComponentHelper::SIZE_EXLARGE) }}

                <div id="campaign-wrapper col-md-12 text-center">
                    @include('search._search_grid_table')
                </div>

                <div class="row bt-button-row text-right">
                    {{ Form::button_save() }}
                    {{ Form::button_link('Cancel', action('MosaicController@mosaic_setup', compact('business'))) }}
                </div>
            </div>
        </div>
    </div>
    {!! Form::close() !!}
@endsection
@section('page_script')
    @include('shared_script._check_all')

    <script>
        $(function () {
            $('input[type=radio]').click(function () {
                var selected_metro = [];
                $('input[type=checkbox]:checked').each(function () {
                    selected_metro.push(this.value)
                });
                if (jQuery.inArray($('input[type=radio]:checked').val(), selected_metro) == -1) {
                    presentModalAlert('Alert', 'Primary must be from the selected metro areas.');
                    $(this).prop('checked', false);
                }
            })
        });

        function validate_metro(val) {
            document.getElementById("metro_" + val).checked = true;
            presentModalAlert('Alert', 'Unable to delete metro. Category related to the metro is currently selected by the business.');
        }
    </script>
@endsection

@section('page_style')
    <style>
        #grid_body {
            font-size: 14px;
            font-weight: 200;
        }

        .radio span {
            margin-left: 25px;
        }
    </style>
@endsection