@section('title', 'Spin')
@extends('layouts.main')
@section('extra-css')
    <style type="text/css">
        html {
            background-image: url("/assets/images/bg.jpg");
        }
     </style>
@endsection


@include('layouts.includes.playersession')

@section('content')

    <div class="container-fluid">
       @include('layouts.partials.errors')
       @include('layouts.partials.success')
        <div class="row">
            <div class="col-md-4"></div>
            <div class="col-md-8">
               <span onclick="showMessage();"><button class="spinBtn">SPIN NOW!</button></span>
            </div>
        </div>
        <div class="row">
            <div class="col-md-4 hidden-xs">
                <img src="{{ asset('assets/images/logo-lg.png') }}"
                     class="img-responsive animated slideInLeft" style="display: block; float: right;"/>
            </div>
        <div class="col-md-8">
                {{-- begin::spin content--}}
            <div class="spinResults">
                {{--<form>--}}
               <form  action="{{ route('entries.update')  }}" class="spinForm animated slideInUp" id="autoSubmit" name="autoSubmit">
                    @csrf
                    @method('PATCH')
                    <div class="form-group col-md-12">
                        <input type="text" name="won" class="form-control"  id="win" value="1"/>
                        <input type="text" name="prize" class="form-control"  id="prize"/>
                        <input type="text" name="entry_id" class="form-control" id="entry_id" value="{{ session()->get('entry_id') }}"/>
                    </div>
                    <div class="form-group col-md-12">
                        <input type="submit" class="btn btn-success finishGameBtn" value="FINISH GAME"/>
                    </div>
                </form>
                <div id="prize"></div>
            </div>


                <div class="wheelContainer">
                    <div class='animated flipInX' id="messagewidth" style="visibility: hidden">
                        <h2>You are a winner!!</h2>
                        <p style="color:#000;"><strong>One entry will be permitted per Bravecto® product bought.</strong></p>
                    </div>
                    <svg class="wheelSVG" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" text-rendering="optimizeSpeed">
                        <defs>
                            <filter id="shadow" x="-100%" y="-100%" width="550%" height="550%">
                                <feOffset in="SourceAlpha" dx="0" dy="0" result="offsetOut"></feOffset>
                                <feGaussianBlur stdDeviation="9" in="offsetOut" result="drop" />
                                <feColorMatrix in="drop" result="color-out" type="matrix" values="0 0 0 0   0
              0 0 0 0   0
              0 0 0 0   0
              0 0 0 .3 0" />
                                <feBlend in="SourceGraphic" in2="color-out" mode="normal" />
                            </filter>
                        </defs>
                        <g class="mainContainer">
                            <g class="wheel">

                            </g>
                        </g>
                        <g class="centerCircle" />
                        <g class="wheelOutline" />
                        <g class="pegContainer" opacity="1">
                            <path class="peg" fill="#fff" d="M22.139,0C5.623,0-1.523,15.572,0.269,27.037c3.392,21.707,21.87,42.232,21.87,42.232 s18.478-20.525,21.87-42.232C45.801,15.572,38.623,0,22.139,0z" />
                        </g>
                        <g class="valueContainer" />
                        <g class="centerCircleImageContainer"/>
                    </svg>
                    <div class="toast">
                        <p/>
                    </div>
                </div>

            </div>

        </div>

     {{-- begin::spin content--}}

 </div>
@endsection



@section('extra-js')


@endsection