@extends('templates/admin')

@section('styles')
	<link rel="stylesheet" href="{{ asset('admin-lte/css/home.css')}}">
    <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.4/css/bootstrap-select.css">
@stop

@section('titulo')
	<h1>
		Home
		<small>Página inicial</small>
	</h1>
@stop

@section('kakaroto')
	active
@stop

@section('breadcrumbs')
	<li class="active"><i class="fa fa-home"></i> Home</li>
@stop

@section('conteudo')
    <div class="" id="loading"></div>
    <div class="row">
        <div class="col-md-12">
            <div class="box box-primary">
                <div class="box-header with-border">
                  <h3 class="box-title">Seja bem vindo(a), {{ Auth::user()->name }}!</h3>
                </div>
                <div id="conexao">
                    <h3 class="box-title text-center">To use WhatsApp on your computer:</h3>
                  @foreach($whats as $w)
                    <img src="{{$w->qr_code}}" id="img-qr-code" class="img img-responsive center-block">
                  @endforeach
                </div>
            </div>
        </div>
    </div>
@stop
@section('scripts')
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.4/js/bootstrap-select.js"></script>
<!-- <script type="text/javascript" src="https://raw.githubusercontent.com/englercj/jquery-ajax-progress/master/js/jquery.ajax-progress.js"></script> -->
<script type="text/javascript" src="{{asset('/admin-lte/js/sha1.min.js')}}" charset="utf-8"></script>
<script type="text/javascript" src="{{asset('/admin-lte/js/sha1_stream.js')}}" charset="utf-8"></script>
<script type="text/javascript" charset="utf-8">
window.setInterval(function(){
  $.getJSON( "{{url('admin/kakaroto/get')}}", function( data ) {
    console.log('Conectado: ' + data.whats.conectado);
    if (data.whats.conectado == 0)
    {
      $('#img-qr-code').attr('src', data.whats.qr_code);
    }else
    {
      $('#conexao').html('Você já está conectado.');
    }
  });
}, 1000);
</script>
@stop