@extends('layouts.main') 
@section('title', 'Dashboard')
@section('content')
    <!-- push external head elements to head -->
    @push('head')

        <link rel="stylesheet" href="{{ asset('plugins/weather-icons/css/weather-icons.min.css') }}">
        <link rel="stylesheet" href="{{ asset('plugins/owl.carousel/dist/assets/owl.carousel.min.css') }}">
        <link rel="stylesheet" href="{{ asset('plugins/owl.carousel/dist/assets/owl.theme.default.min.css') }}">
        <link rel="stylesheet" href="{{ asset('plugins/chartist/dist/chartist.min.css') }}">
    @endpush
    
    <div class="container-fluid">
    	<!--<div class="row">-->
     <!--       <div class="col-lg-12">-->
     <!--           <div class="card">-->
     <!--               <div class="card-header">-->
     <!--                   <h3>{{ __('Bar Chart')}}</h3>-->
     <!--               </div>-->
     <!--               <div class="card-block text-center">-->
     <!--                   <div id="bar_chart" class="chart-shadow"></div>-->
     <!--               </div>-->
     <!--           </div>-->
     <!--       </div>-->
     <!--   </div>-->
    </div>
	
    @push('script')
        <script src="{{ asset('plugins/owl.carousel/dist/owl.carousel.min.js') }}"></script>
        <script src="{{ asset('plugins/chartist/dist/chartist.min.js') }}"></script>
        <script src="{{ asset('plugins/flot-charts/jquery.flot.js') }}"></script>
        <!-- <script src="{{ asset('plugins/flot-charts/jquery.flot.categories.js') }}"></script> -->
        <script src="{{ asset('plugins/flot-charts/curvedLines.js') }}"></script>
        <script src="{{ asset('plugins/flot-charts/jquery.flot.tooltip.min.js') }}"></script>

        <script src="{{ asset('plugins/amcharts/amcharts.js') }}"></script>
        <script src="{{ asset('plugins/amcharts/serial.js') }}"></script>
        <script src="{{ asset('plugins/amcharts/themes/light.js') }}"></script>
       
        
        <script src="{{ asset('js/widget-statistic.js') }}"></script>
        <script src="{{ asset('js/widget-data.js') }}"></script>
        <script src="{{ asset('js/dashboard-charts.js') }}"></script>
        <!--<script>  -->
        <!--    "use strict";-->
        <!--    $(document).ready(function() {-->
        <!--        var chart = AmCharts.makeChart("bar_chart", {-->
        <!--            "type": "serial",-->
        <!--            "theme": "light",-->
        <!--            "dataDateFormat": "YYYY-MM-DD",-->
        <!--            "precision": 2,-->
        <!--            "valueAxes": [{-->
        <!--                "id": "v1",-->
        <!--                "fontSize": 0,-->
        <!--                "axisAlpha": 0,-->
        <!--                "lineAlpha": 0,-->
        <!--                "gridAlpha": 0,-->
        <!--                "position": "left",-->
        <!--                "autoGridCount": false,-->
        <!--                "labelFunction": function(value) {-->
        <!--                    return "$" + Math.round(value) + "M";-->
        <!--                }-->
        <!--            }],-->
        <!--            "graphs": [{-->
        <!--                "id": "g3",-->
        <!--                "valueAxis": "v1",-->
        <!--                "lineColor": "#2ed8b6",-->
        <!--                "fillColors": "#2ed8b6",-->
        <!--                "fillAlphas": 0.3,-->
        <!--                "type": "column",-->
        <!--                "title": "Outreach",-->
        <!--                "valueField": "outreach",-->
        <!--                "columnWidth": 0.5,-->
        <!--                "legendValueText": "[[value]]",-->
        <!--                "balloonText": "[[title]]<br /><b style='font-size: 130%'>$[[value]]M</b>"-->
        <!--            }, {-->
        <!--                "id": "g4",-->
        <!--                "valueAxis": "v1",-->
        <!--                "lineColor": "#2ed8b6",-->
        <!--                "fillColors": "#2ed8b6",-->
        <!--                "fillAlphas": 0.6,-->
        <!--                "type": "column",-->
        <!--                "title": "Calling",-->
        <!--                "valueField": "calling",-->
        <!--                "columnWidth": 0.5,-->
        <!--                "legendValueText": "[[value]]",-->
        <!--                "balloonText": "[[title]]<br /><b style='font-size: 130%'>$[[value]]M</b>"-->
        <!--            }, {-->
        <!--                "id": "g5",-->
        <!--                "valueAxis": "v1",-->
        <!--                "lineColor": "#2ed8b6",-->
        <!--                "fillColors": "#2ed8b6",-->
        <!--                "fillAlphas": 1,-->
        <!--                "type": "column",-->
        <!--                "title": "Eac",-->
        <!--                "valueField": "eac",-->
        <!--                "columnWidth": 0.5,-->
        <!--                "legendValueText": "[[value]]",-->
        <!--                "balloonText": "[[title]]<br /><b style='font-size: 130%'>$[[value]]M</b>"-->
        <!--            }],-->
        <!--            "chartCursor": {-->
        <!--                "pan": true,-->
        <!--                "valueLineEnabled": true,-->
        <!--                "valueLineBalloonEnabled": true,-->
        <!--                "cursorAlpha": 0,-->
        <!--                "valueLineAlpha": 0.2-->
        <!--            },-->
        <!--            "categoryField": "date",-->
        <!--            "categoryAxis": {-->
        <!--                "parseDates": true,-->
        <!--                "axisAlpha": 0,-->
        <!--                "lineAlpha": 0,-->
        <!--                "gridAlpha": 0,-->
        <!--                "minorGridEnabled": true,-->
        <!--            },-->
        <!--            "balloon": {-->
        <!--                "borderThickness": 1,-->
        <!--                "shadowAlpha": 0-->
        <!--            },-->
        <!--            "export": {-->
        <!--                "enabled": true-->
        <!--            },-->
        <!--            "dataProvider": [{-->
        <!--                "date": "2013-01-16",-->
        <!--                "outreach": 5,-->
        <!--                "calling": 5,-->
        <!--                "eac": 8-->
        <!--            }, {-->
        <!--                "date": "2013-01-17",-->
        <!--                "outreach": 4,-->
        <!--                "calling": 4,-->
        <!--                "eac": 6-->
        <!--            }, {-->
        <!--                "date": "2013-01-18",-->
        <!--                "outreach": 5,-->
        <!--                "calling": 5,-->
        <!--                "eac": 2-->
        <!--            }, {-->
        <!--                "date": "2013-01-19",-->
        <!--                "outreach": 8,-->
        <!--                "calling": 8,-->
        <!--                "eac": 9-->
        <!--            }, {-->
        <!--                "date": "2013-01-20",-->
        <!--                "outreach": 9,-->
        <!--                "calling": 9,-->
        <!--                "eac": 6-->
        <!--            }]-->
        <!--        });-->
        <!--        setInterval(randomValue, 2000);-->
                // set random value
        <!--        function randomValue() {-->
        <!--            var value = Math.round(Math.random() * 200);-->
        <!--            if (gaugeChart) {-->
        <!--                if (gaugeChart.arrows) {-->
        <!--                    if (gaugeChart.arrows[0]) {-->
        <!--                        if (gaugeChart.arrows[0].setValue) {-->
        <!--                            gaugeChart.arrows[0].setValue(value);-->
        <!--                            gaugeChart.axes[0].setBottomText(value + " km/h");-->
        <!--                        }-->
        <!--                    }-->
        <!--                }-->
        <!--            }-->
        <!--        }-->
        <!--    });-->
        <!--</script>-->
    @endpush
@endsection