@include('includes.main.header')
<style>
    .editable-text-border
    {
        width : 30px;
    }
</style>
	<!--Work-Starts-Here-->
	 <!-- content-section-starts -->
	 <div class="gallery-content">
	 <div class="container" style="background-color:white; opacity:0.9;">
		<div class="gallery-content-head text-left">
			<h3>BUY PERCENTAGES OF THE PLAYERS VALUE</h3>
                     
                        <p>Do you believe in the potential and talent of a player? Buy procentages of his value and get the same procentages of the selling value.
                        </p>
                        <p style="color:red; col-xs-12">This function is unavailable for the moment, because it's against the rules to be operated by a football club, but we will try to get a derogation or to outsource this function in the future.
                        </p>
		</div>
			<div class="section group">
				<div class="col-xs-12 no-padding margin-t-5">
                                    
                                    <div class="col-xs-12 margin-t-10 table-responsive">
                                    <table class="table table-bordered  table-striped table-condensed">
                                        <thead>
                                            <tr>
                                                <th>
                                                    Player Details
                                                </th>
                                                <th> Player Value in Euro</th>
                                                
                                                <th>0.1% Value</th> 
                                                <th>Buy % of players value</th>
                                                <th>Total</th>
                                                
                                            </tr>
                                        </thead>
                                        <tbody>
                                            @if($players->count() > 0)
                                                @foreach($players AS $player)
                                                <tr>
                                                    <td>
                                                        {{$player['name']}}
                                                    </td>
                                                    <td class='data-value'>
                                                        {{$player['value']}}
                                                    </td>
                                                    <td >
                                                        {{$player['value'] / 1000}}
                                                    </td>
                                                    
                                                    <td>
                                                        <span class='percentage-value editable-text-border pull-left' contenteditable="true">0.1</span>&nbsp;%
                                                    </td>
                                                    <td>
                                                        <button type='button' class='btn btn-success btn-buy'>Buy {{$player['value'] / 1000}} €</button>
                                                    </td>
                                                </tr>
                                                @endforeach
                                            @endif
                                        </tbody>
                                        
                                         
                                    </table>
                                    </div>
				</div>
				
			</div> 	
			
   </div>
</div>
         
         <script>
             $(document).ready(function(){
                 $('.percentage-value').blur(function(){
                    var percentage = $(this).text();
                    var parent = $(this).parents('tr').first();
                    var value = $(parent).find('.data-value').text();
                    var finalValue = Number(value) * (Number(percentage)/100);
                    $(parent).find('.btn-buy').text('Buy ' + finalValue + ' €');
                 });
             });
             </script>
	 <!-- content-section-ends -->
	<!--Work-Ends-Here-->
@include('includes.main.footer')