@extends("layouts.dashboard.app")

@section("page-nav-title")
<div class="app-title">
    <div>
        <h1><i class="fa fa-dashboard"></i>{{__('spin-wheel-game')}}</h1>
        <p>{{__('Control and view all Spin Wheel Game')}}</p>
    </div>
    <ul class="app-breadcrumb breadcrumb">
        <li class="breadcrumb-item"><i class="fa fa-home fa-lg"></i></li>
        <li class="breadcrumb-item"><a href="{{route("spin_wheel_game.index")}}">{{__('spin-wheel-game')}}</a></li>
        <li class="breadcrumb-item"><a href="#">Edit</a></li>
    </ul>
</div>
@endsection
@section("content")

<div class="row">
    <div class="col-lg-10 m-auto">
        <div class="tile">
            <h3 class="tile-title">{{__('edit-spin-wheel-game-item')}}</h3>
            <div class="tile-body">
                <form method="post" action="{{route("spin_wheel_game.update", $game->id)}}"
                    enctype="multipart/form-data">
                    @csrf
                    @method("put")
                    <div class="row">


                        <div class="col-lg-6">
                            <div class="form-group">
                                <label class="control-label">{{__('English name')}}</label>
                                <input class="form-control @if($errors->has('name_en')) is-invalid @endif" type="text"
                                    name="name_en" placeholder="{{__('Enter English name')}}" value="{{inputValue("
                                    name_en", $game, "name_en" )}}">
                            </div>
                            @error("name_en")
                            <div class="input-error">{{$message}}</div>
                            @enderror
                        </div>

                        <div class="col-lg-6">
                            <div class="form-group">
                                <label class="control-label">{{__('Arabic name')}}</label>
                                <input class="form-control @if($errors->has('name_ar')) is-invalid @endif" type="text"
                                    name="name_ar" placeholder="{{__('Enter Arabic name')}}" value="{{inputValue("
                                    name_ar", $game, "name_ar" )}}">
                            </div>
                            @error("name_ar")
                            <div class="input-error">{{$message}}</div>
                            @enderror
                        </div>
                        <div class="col-lg-6">
                            <div class="form-group">
                                <label class="control-label">{{__('qty')}}</label>
                                <input class="form-control @if($errors->has('quantity')) is-invalid @endif"
                                    type="number" name="quantity" id="quantity" min="{{$game->wined_qty}}"
                                    placeholder="{{__('Enter Quantity')}}" value="{{$game->qty}}"
                                    oninput="validity.valid||(value='');" onfocusout="getProfitPercentage()">
                            </div>
                            @error("quantity")
                            <div class="input-error">{{$message}}</div>
                            @enderror
                        </div>
                        <div class="col-lg-6">
                            <div class="form-group">
                                <label class="control-label">{{__('wined-qty')}}</label>
                                <input class="form-control" readonly type="number" name="wined_qty" id="wined_qty"
                                    value="{{$game->wined_qty}}">
                            </div>
                        </div>
                        <div class="col-lg-6">
                            <div class="form-group">
                                <label class="control-label">{{__('balance')}}</label>
                                <input class="form-control" readonly type="number" id="balance"
                                    value="{{$game->balance}}">
                            </div>
                        </div>
                        <div class="col-lg-6">
                            <div class="form-group">
                                <label class="control-label">{{__('winning-factor')}}</label>
                                <input class="form-control @if($errors->has('winning_factor')) is-invalid @endif"
                                    type="number" step="any" name="winning_factor" id="winning_factor" min="0"
                                    oninput="validity.valid||(value='');" placeholder="{{__('enter-winning-factor')}}"
                                    value="{{$game->win_factor}}" onfocusout="getProfitPercentage()">
                            </div>
                            @error("winning_factor")
                            <div class="input-error">{{$message}}</div>
                            @enderror
                        </div>
                        <div class="col-lg-6">
                            <div class="form-group">
                                <label for="exampleSelect1">{{__('Type')}}</label>
                                <select class="form-control" name="type" id="type" onchange="getProfitPercentage()">
                                    <option value="">{{__('select-type')}}</option>
                                    @foreach($types as $type)
                                    <option value="{{$type->id}}" @if($type->id == $game->type_id) selected
                                        @endif>{{$type->name_en}} ( {{$type->name_ar}} )</option>
                                    @endforeach
                                </select>
                            </div>
                            @error("type")
                            <div class="input-error">{{$message}}</div>
                            @enderror
                        </div>
                        {{-- <div class="col-lg-6">
                            <div class="form-group">
                                <label class="control-label">{{__('color')}}</label>
                                <input class="form-control @if($errors->has('color')) is-invalid @endif" type="color"
                                    name="color" value="{{inputValue(" color", $game, "color" )}}">
                            </div>
                            @error("color")
                            <div class="input-error">{{$message}}</div>
                            @enderror
                        </div> --}}
                        <div class="col-lg-6">
                            <div class="form-group">
                                <label class="control-label">{{__('color')}}</label>
                                <select class="form-control @if($errors->has('color')) is-invalid @endif " name="color"
                                    id="color" onchange="changeColor()"
                                    style="background-color: {{$game->color}};  color:'#ffffff'">
                                    <option value="">{{__('select-color')}}</option>
                                    <option value="#4e613f" style="background-color: #4e613f; color:white" @if($game->
                                        color == "#4e613f") selected @endif>
                                        {{__('green')}}</option>
                                    <option value="#ffffff" style="background-color: #ffffff; color:#000000" @if($game->
                                        color == "#ffffff") selected @endif>{{__('white')}}</option>
                                </select>
                            </div>
                            @error("color")
                            <div class="input-error">{{$message}}</div>
                            @enderror
                        </div>
                        <div class="col-lg-6">
                            <label for="">{{__('profit-percentage')}}</label>
                            <div style="display: flex">
                                <div class="input-group">
                                    <input class="form-control @if($errors->has('profit_percentage')) is-invalid @endif"
                                        type="number" step="any" readonly name="profit_percentage"
                                        id="profit_percentage" placeholder="{{__('enter-profit-percentage')}}"
                                        value="{{$game->profit_percentage}}">
                                    <div class="input-group-append"><span class="input-group-text">%</span></div>
                                </div>
                            </div>
                            @error("profit_percentage")
                            <div class="input-error">{{$message}}</div>
                            @enderror
                        </div>
                        <div class="col-lg-6">
                            <label for="">{{__('sector-percentage')}}</label>
                            <div style="display: flex">
                                <div class="input-group">
                                    <input class="form-control @if($errors->has('sector_percentage')) is-invalid @endif"
                                        type="number" step="any" name="sector_percentage" min="0"
                                        oninput="validity.valid||(value='');"
                                        placeholder="{{__('enter-sector-percentage')}}"
                                        value="{{$game->sector_percentage}}">
                                    <div class="input-group-append"><span class="input-group-text">%</span></div>
                                </div>
                            </div>
                            @error("sector_percentage")
                            <div class="input-error">{{$message}}</div>
                            @enderror
                        </div>

                    </div>
                    <div class="row" style="padding-top: 20px">
                        <div class="col-lg-6">
                            <div class="form-group">
                                <label class="control-label">{{__('Description in English')}}</label>
                                <input class="form-control" type="text" name="description_en"
                                    placeholder="{{__('Enter English Description')}}" value="{{inputValue("
                                    description_en", $game, "description_en" )}}">
                            </div>
                        </div>

                        <div class="col-lg-6">
                            <div class="form-group">
                                <label class="control-label">{{__('Description in Arabic')}}</label>
                                <input class="form-control" type="text" name="description_ar"
                                    placeholder="{{__('Enter Arabic Description')}}" value="{{inputValue("
                                    description_ar", $game, "description_ar" )}}">
                            </div>
                        </div>
                        <div class="col-lg-6">
                            <label class="control-label">{{__('Status')}}</label>
                            <div class="toggle-flip">
                                <label>
                                    <input type="checkbox" name="status" {{checked("status", 1, $game)}}><span
                                        class="flip-indecator" data-toggle-on="ON" data-toggle-off="OFF"></span>
                                </label>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-lg-6">
                            <div class="form-group">
                                <label class="control-label">{{__('Image')}}</label>
                                <div>
                                    <button class="btn btn-primary form-control button-upload-file">
                                        <input class="input-file" type="file" name="img" onchange="uploadImg(event)">
                                        <span class="upload-file-content">
                                            <i class="fas fa-upload fa-lg upload-file-content-icon left"></i>
                                            <span class="upload-file-content-text">{{__('Upload Image')}}</span>
                                        </span>
                                    </button>
                                </div>
                            </div>
                            @error("img")
                            <div class="input-error">{{$message}}</div>
                            @enderror
                        </div>
                        <div class="col-lg-6">
                            <img style="padding: 10px" src="{{$game->img}}" height="150" width="150" id="preview" />
                        </div>
                    </div>

                    <div class="tile-footer">
                        <button class="btn btn-primary" type="submit"><i
                                class="fa fa-fw fa-lg fa-check-circle"></i>{{__('Save')}}</button>
                    </div>
                </form>
            </div>

        </div>
    </div>
</div>
@endsection
@section("scripts")
<script type="text/javascript">
    if(document.location.hostname == 'pratikborsadiya.in') {
            (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
                (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
                m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
            })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
            ga('create', 'UA-72504830-1', 'auto');
            ga('send', 'pageview');
        }
</script>
<script type="text/javascript">
    var uploadImg = function(event) {
            var output = document.getElementById('preview');
            output.src = URL.createObjectURL(event.target.files[0]);
            output.onload = function() {
                $("#preview").css({ 'display' : '' });
                URL.revokeObjectURL(output.src)
            }
        };

        function getProfitPercentage(){
            $("#balance").val($("#quantity").val() - $("#wined_qty").val());
        if($("#quantity").val() != "" && $("#winning_factor").val() != "" && $("#type").val()){
            $.ajax({
                type: "POST",
                url:"https://dashoard.nosdarzan.digisolapps.com/api/spin-wheel-game/get-profit-percentage",
                data:{
                    qty: $("#quantity").val(),
                   factor: $("#winning_factor").val(),
                   type: $("#type").val()
                }, // serializes the form's elements.
                success: function(response)
                {
                    if(response["status"]){
                        $("#profit_percentage").val(response["data"])
                    }
                },
                error:function(){
                    console.error("you have error");
                }
            });
        }
        }
        function changeColor(){
            if($("#color").val() == "#4e613f"){
            $("#color").css({"background-color": $("#color").val(), "color": "white"});
            }
        else{
        $("#color").css({"background-color": $("#color").val(), "color": "black"});
        }
        }
</script>
@endsection