@extends('layouts.master')
@section('content')

    <div class="container">

        <div class="row">
            <div class="col-md-6">
                <div style="padding: 10px" class="traffic-geography-parent" id="traffic_geography_country_parent">
                    @include('shared._pie_chart', [
                        'error' => '',
                        'data' => $data['data']['traffic_geography']['by_country'],
                        'title' => "By Country",
                        'id' => 'traffic_geography_country_pie_chart',
                        'multiple_views' => [
                            'class' => $data['data']['traffic_geography']['multiple_view_class'],
                            'values' => $data['data']['traffic_geography']['multiple_view_values'],
                            'value' => \App\Helpers\GoogleAnalyticsUserFlow\GoogleAnalyticsUserFlowReportHelper::COUNTRY,
                        ]])
                </div>
                <div style="padding: 10px" class="traffic-geography-parent" id="traffic_geography_city_parent">
                    @include('shared._pie_chart', [
                        'error' => '',
                        'data' => $data['data']['traffic_geography']['by_city'],
                        'title' => "By City",
                        'id' => 'traffic_geography_city_pie_chart',
                        'multiple_views' => [
                            'class' => $data['data']['traffic_geography']['multiple_view_class'],
                            'values' => $data['data']['traffic_geography']['multiple_view_values'],
                            'value' => \App\Helpers\GoogleAnalyticsUserFlow\GoogleAnalyticsUserFlowReportHelper::CITY,
                        ]])
                </div>
            </div>
            <div class="col-md-6">
            </div>
        </div>
    </div>

@endsection

@section('page_script')
    @include('shared_script._chart_maker_script')
    <script>

        $(document).ready(function () {
            var labels = <br />
<b>Notice</b>:  Undefined variable: data in <b>/var/www/html/fuse2/resources/views/shared/forms/testing/testing_pie_chart.blade.php</b> on line <b>45</b><br />
null;
            var data = <br />
<b>Notice</b>:  Undefined variable: data in <b>/var/www/html/fuse2/resources/views/shared/forms/testing/testing_pie_chart.blade.php</b> on line <b>46</b><br />
null;
            var colors = <br />
<b>Notice</b>:  Undefined variable: data in <b>/var/www/html/fuse2/resources/views/shared/forms/testing/testing_pie_chart.blade.php</b> on line <b>47</b><br />
null;
            var legend = <br />
<b>Notice</b>:  Undefined variable: data in <b>/var/www/html/fuse2/resources/views/shared/forms/testing/testing_pie_chart.blade.php</b> on line <b>48</b><br />
null;
            make_pie_chart('traffic_geography_country_pie_chart', labels, data, colors, legend);

            var labels = <br />
<b>Notice</b>:  Undefined variable: data in <b>/var/www/html/fuse2/resources/views/shared/forms/testing/testing_pie_chart.blade.php</b> on line <b>51</b><br />
null;
            var data = <br />
<b>Notice</b>:  Undefined variable: data in <b>/var/www/html/fuse2/resources/views/shared/forms/testing/testing_pie_chart.blade.php</b> on line <b>52</b><br />
null;
            var colors = <br />
<b>Notice</b>:  Undefined variable: data in <b>/var/www/html/fuse2/resources/views/shared/forms/testing/testing_pie_chart.blade.php</b> on line <b>53</b><br />
null;
            var legend = <br />
<b>Notice</b>:  Undefined variable: data in <b>/var/www/html/fuse2/resources/views/shared/forms/testing/testing_pie_chart.blade.php</b> on line <b>54</b><br />
null;
            make_pie_chart('traffic_geography_city_pie_chart', labels, data, colors, legend);

            choose_traffic_geography_graph('{{ $data['data']['traffic_geography']['multiple_view_value'] }}')
        });

        function choose_traffic_geography_graph($value) {
            if ($value === '{{ \App\Helpers\GoogleAnalyticsUserFlow\GoogleAnalyticsUserFlowReportHelper::COUNTRY }}') {
                $('#traffic_geography_country_parent').show();
                $('#traffic_geography_city_parent').hide();
            } else {
                $('#traffic_geography_city_parent').show();
                $('#traffic_geography_country_parent').hide();
            }
        }

        $('.{{ $data['data']['traffic_geography']['multiple_view_class'] }}').change(function () {
            var current_value = $(this).val();
            // set all the selectes of this class to the new value
            $('.{{ $data['data']['traffic_geography']['multiple_view_class'] }}').val(current_value);
            choose_traffic_geography_graph(current_value);
        })

    </script>
@endsection

@section('page_style')
    @include('shared_style._pie_chart_style')
    <style>
        .traffic-geography-parent .legend-spacer-row {
            height: 5px;
        }
    </style>
@endsection