@extends('layouts.default')

@section('content')
<div class="jumbotron jumbotron-sm jumbotron_contact jumbotron-sm-contact">
    <div class="container">
        <div class="row">
            <div class="col-sm-12 col-lg-12">
                <h1 class="h1 contact_h1 " >
                  <i class="fa fa-bar-chart-o"></i> {{Lang::get('messages.stats')}} <small></h1>
            </div>
        </div>
    </div>
</div>

  

<div class="container">

<div class="row">
<select class="form-control" id="user_product_list" style="margin-bottom:20px;">
	<option value="0">All</option>
@foreach($dataArray['totalUserProducts'] as $product)
	<option value="{{$product->id}}" @if($product->id==$dataArray['productID']) selected @endif>{{$product->name}}</option>
@endforeach
</select>

</div>

<div class="row">

	<div class="col-lg-3 col-md-4 col-sm-4 col-xs-12 view_box stats_box">
					 <i class="fa fa-eye fa-5x pull-left stats-top-section"></i> <span class="box_data">{{$dataArray['productViewCount']}} {{Lang::get('messages.view')}}</span>
				</div>

				<div class="col-lg-4 col-lg-offset-1 col-md-4 col-sm-4 col-xs-12 sale_box stats_box hidden-sm">

					<i class="fa fa-shopping-cart fa-5x pull-left icon-white stats-top-section"></i> <span class="box_data">{{$dataArray['productSaleCount']}} {{Lang::get('messages.sales')}}</span>
				</div>

				<div class="col-lg-3 col-lg-offset-1 col-md-4 col-sm-4 col-xs-12 profit_box stats_box hidden-sm">

					<i class="fa fa-money fa-5x pull-left"></i> <span class="box_data">$
					@if($dataArray['productTotalPrice'])
							{{$dataArray['productTotalPrice']}}
					@else
							0
					@endif
					</span>
				</div>

</div>


		<hr>


@if($dataArray['productQrcodeMaps']->isEmpty())

	<p class="lead">
	{{Lang::get('messages.no_qrcode_in_stats')}}
	</p>
<p>			<a class="btn btn-primary btn-lg" href="#"><i class="fa fa-qrcode"></i> Create Campaign</a></p>
@else

<div id="chart_div_1"  class="graphs col-lg-4" style="height: 200px;"></div>
<div id="chart_div_2"  class="graphs col-lg-4" style="height: 200px;"></div>
<div id="chart_div_3"  class="graphs" style="width: 350px; height: 200px;"></div>


<div class="clearfix"></div>
<hr>

<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 box stats-maps">
 <div class="Flexible-container-stats">

  <div id="map_codes" style="height:450px;"></div>

</div>

</div>

<div class="clearfix"></div>
<hr>

@if(empty($dataArray['topProductSale']))

@else


<div class="panel panel-primary">
  <div class="panel-heading">
    <h3 class="panel-title"><i class="fa fa-qrcode"></i> QrCodes</h3>
  </div>
  <div class="panel-body">
    <table class="table table-striped">
      <thead>
        <tr>
          <th>Published</th>
          <th>Title</th>
          <th>Product Type</th>
          <th>Views</th>
          <th>Sale</th>
          <th>Total Balance</th>
        </tr>
      </thead>
      <tbody>

@foreach($dataArray['topProductSale'] as $key=>$value)
  <tr>
         <td>{{$value['published']}}</td>
         <td>{{$value['productName']}}</td>
         <td>{{$value['type']}}</td>
         <td>{{$value['Views']}}</td>
         <td>{{$value['Sales']}}</td>
         <td>{{$value['topPrice']}}</td>


      </tr>
  @endforeach

     </tbody>
   </table>
 </div>
</div>




<div class="panel panel-info">
  <div class="panel-heading">
    <h3 class="panel-title"><i class="fa fa-bar-chart-o"></i> Top Selling Places</h3>
  </div>
  <div class="panel-body">
    <table class="table table-striped">
      <thead>
        <tr>
          <th>Rank</th>
          <th>City</th>
          <th>Country</th>
          <th>Views</th>
          <th>Sale</th>
          <th>Total Balance</th>
        </tr>
      </thead>
      <tbody>


  @foreach($dataArray['topProductSale'] as $key=>$value)
  <tr>
        <td>{{$key+1}}</td>
         <td>{{$value['city']}}</td>
         <td>{{$value['country']}}</td>
         <td>{{$value['Views']}}</td>
         <td>{{$value['Sales']}}</td>
         <td>{{$value['topPrice']}}</td>

      </tr>
  @endforeach


     </tbody>
   </table>
 </div>
</div>

<hr>






<div class="row">

  <div class="col-lg-6 col-md-6 col-sm-6 col-xs-6">

   <div class="panel panel-warning">
    <div class="panel-heading">
      <h3 class="panel-title"><i class="fa fa-mobile"></i> Most Popular Smart Phones</h3>
    </div>
    <div class="panel-body">
      <table class="table table-striped">
        <thead>
          <tr>
            <th>Rank</th>
            <th>Brand</th>
            <th>Browser</th>
             <th>Views</th>

          </tr>
        </thead>
        <tbody>
         @foreach($dataArray['productBrowser'] as $key=>$value)
  <tr>

          <td>{{$key+1}}</td>
         <td>{{$value->platform}}</td>
         <td>{{$value->browser}}</td>
         <td>{{$value->view}}</td>
      </tr>
  @endforeach

       </tbody>
     </table>
   </div>
 </div>


</div>

<div class="col-lg-6 col-md-6 col-sm-6 col-xs-6">

	<div class="panel panel-warning">
    <div class="panel-heading">
      <h3 class="panel-title"><i class="fa fa-clock-o"></i> Best Selling Timeline</h3>
    </div>
    <div class="panel-body">
           <table class="table table-striped">
        <thead>
          <tr>
            <th>Time</th>
            <th>Sales</th>

          </tr>
        </thead>
        <tbody>



          <tr>
           <td>Morning</td>
           <td>{{$dataArray['productTotalMorningSaleCount'][0]->morning}}</td>


         </tr>

         <tr>
           <td>Afternoon</td>
           <td>{{$dataArray['productTotalAfternoonSaleCount'][0]->morning}}</td>

         </tr>


         <tr>

           <td>Evening</td>
           <td>{{$dataArray['productTotalEveningSaleCount'][0]->morning}}</td>

         </tr>

       </tbody>
     </table>
   </div>
 </div>


</div>

</div>



</div>

@endif
@endif
</div>
@stop
@section('footer_js')


<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>


<script type="text/javascript">



var beaches = [
  ['Kadikoy', 40.9807259, 29.07294150000007],
  ['Taksim', 41.036565, 28.98690899999997],
  ['Bakirkoy', 40.977979, 28.869597],
  ['izmit',40.775986,29.948356999999987],
];



// google.setOnLoadCallback(function() {
//   $(function() {
//     // init my stuff
//   });
// });


// var beaches = '"{{$dataArray['allQrcodeMaps']}}"';





//       $.each(qrcodes,function(k,v){

// console.log(v.latitude+','+v.longitude)
// });



function initialize() {

    var qrcodes = '{{$dataArray['productQrcodeMaps']}}';
    var js  = JSON.parse(qrcodes);
    var code_arr = [];
    console.log(typeof(js));

    for(i=0; i<js.length;i++){
      code_arr[i] = new Array(js[i].title,js[i].latitude,js[i].longitude,i);
    }
    console.log(code_arr);
    // console.log(js);

    var mapOptions = {};

    var map = new google.maps.Map(document.getElementById('map_codes'),mapOptions);


  setMarkers(map, code_arr);


}


 function setMarkers(map, locations) {

  var image = {
    url: '{{ asset("/files/images_files/android_qr.png") }}',
    // This marker is 20 pixels wide by 32 pixels tall.
    size: new google.maps.Size(36, 36),
    // The origin for this image is 0,0.
    origin: new google.maps.Point(0,0),
    // The anchor for this image is the base of the flagpole at 0,32.
    anchor: new google.maps.Point(0, 36)
  };
  var shape = {
    coord: [1, 1, 1, 20, 18, 20, 18 , 1],
    type: 'poly'
  };

  var bounds = new google.maps.LatLngBounds();

  for (var i = 0; i < locations.length; i++) {
    var beach = locations[i];
    var myLatLng = new google.maps.LatLng(beach[1], beach[2]);
    var marker = new google.maps.Marker({
      position: myLatLng,
      map: map,
      icon: image,
      shape: shape,
      title: beach[0],
      zIndex: beach[3]
    });

    bounds.extend(marker.position);
  }

  map.fitBounds(bounds);

  map.panToBounds(bounds);

  var listener = google.maps.event.addListener(map, "idle", function () {
    google.maps.event.removeListener(listener);
  });

}

 google.maps.event.addDomListener(window, 'load', initialize);
 google.setOnLoadCallback(drawChart);

google.load("visualization", "1", {packages:["corechart"]});

function drawChart() {


  var today   = new Date('{{$dataArray['today']}}');
  var today_1 = new Date('{{$dataArray['today_1']}}')
  var today_2 = new Date('{{$dataArray['today_2']}}')
  var today_3 = new Date('{{$dataArray['today_3']}}')
  var today_4 = new Date('{{$dataArray['today_4']}}')
  var today_5 = new Date('{{$dataArray['today_5']}}')
  var today_6 = new Date('{{$dataArray['today_6']}}')

  var weekdays = ["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"];
  // var date = new Date(unix_timestamp*1000);
  // var dateObj;

  console.log(today);
    var myDate    =new Date(eval('"'+today+'"'))
    var myDate_1  =new Date(eval('"'+today_1+'"'))
    var myDate_2  =new Date(eval('"'+today_2+'"'))
    var myDate_3  =new Date(eval('"'+today_3+'"'))
    var myDate_4  =new Date(eval('"'+today_4+'"'))
    var myDate_5  =new Date(eval('"'+today_5+'"'))
    var myDate_6  =new Date(eval('"'+today_6+'"'))


  console.log(weekdays[myDate.getDay()]);
  console.log(weekdays[myDate_1.getDay()]);
  console.log(weekdays[myDate_2.getDay()]);



  var data_1 = google.visualization.arrayToDataTable([
    ['Week', 'Views'],
    [weekdays[myDate_6.getDay()],  parseInt({{$dataArray['productNowDay6ViewCount'][0]->view}}) || 0],
    [weekdays[myDate_5.getDay()], parseInt({{$dataArray['productNowDay5ViewCount'][0]->view}}) || 0],
    [weekdays[myDate_4.getDay()],  parseInt({{$dataArray['productNowDay4ViewCount'][0]->view}}) || 0],
    [weekdays[myDate_3.getDay()],  parseInt({{$dataArray['productNowDay3ViewCount'][0]->view}}) || 0],
    [weekdays[myDate_2.getDay()],  parseInt({{$dataArray['productNowDay2ViewCount'][0]->view}}) || 0],
    [weekdays[myDate_1.getDay()],  parseInt({{$dataArray['productNowDay1ViewCount'][0]->view}}) || 0],
    [weekdays[myDate.getDay()],  parseInt({{$dataArray['productNowDayViewCount'][0]->view}}) || 0],
    ]);



  var data_2 = google.visualization.arrayToDataTable([
    ['Week', 'Sale'],
    [weekdays[myDate_6.getDay()],  {{$dataArray['productNow6DaySaleCount'][0]->sale}}],
    [weekdays[myDate_5.getDay()],  {{$dataArray['productNow5DaySaleCount'][0]->sale}}],
    [weekdays[myDate_4.getDay()],  {{$dataArray['productNow4DaySaleCount'][0]->sale}}],
    [weekdays[myDate_3.getDay()],  {{$dataArray['productNow3DaySaleCount'][0]->sale}}],
    [weekdays[myDate_2.getDay()],  {{$dataArray['productNow2DaySaleCount'][0]->sale}}],
    [weekdays[myDate_1.getDay()],  {{$dataArray['productNow1DaySaleCount'][0]->sale}}],
    [weekdays[today.getDay()],  {{$dataArray['productNowDaySaleCount'][0]->sale}}],
    ]);

  var data_3 = google.visualization.arrayToDataTable([
    ['Week', 'Total Balance'],
    [weekdays[myDate_6.getDay()], parseInt({{$dataArray['productNow6DayBalance'][0]->price}}) || 0],
    [weekdays[myDate_5.getDay()],  parseInt({{$dataArray['productNow5DayBalance'][0]->price}}) || 0],
    [weekdays[myDate_4.getDay()],  parseInt({{$dataArray['productNow4DayBalance'][0]->price}}) || 0],
    [weekdays[myDate_3.getDay()],  parseInt({{$dataArray['productNow3DayBalance'][0]->price}}) || 0],
    [weekdays[myDate_2.getDay()],  parseInt({{$dataArray['productNow2DayBalance'][0]->price}}) || 0],
    [weekdays[myDate_1.getDay()],  parseInt({{$dataArray['productNow1DayBalance'][0]->price}}) || 0],
    [weekdays[today.getDay()],  parseInt({{$dataArray['productNowDayBalance'][0]->price}}) || 0],
    ]);

  var options_1 = {
    title: 'Views'
  };

  var options_2 = {
    title: 'Sales'
  };

  var options_3 = {
    title: 'Total Balance'
  };

  var chart_1 = new google.visualization.LineChart(document.getElementById('chart_div_1'));
  var chart_2 = new google.visualization.LineChart(document.getElementById('chart_div_2'));
  var chart_3 = new google.visualization.LineChart(document.getElementById('chart_div_3'));

  chart_1.draw(data_1, options_1);
  chart_2.draw(data_2, options_2);
  chart_3.draw(data_3, options_3);
}

</script>




<script type="text/javascript">

  $(document).ready(function () {



    $('#user_product_list').change(function(){

      var product_id = $("#user_product_list").val();
      console.log(product_id);

      if(product_id==0){
        window.location.href = "{{route('qrpay-stats')}}";
      }else{
        window.location.href = "{{route('qrpay-stats')}}/{{Lang::get('routes.detail')}}"+product_id+"";
      }
    });








  });


</script>
@stop