@extends('admintemplate')

@section('headscripts')

    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script type="text/javascript">
        function setActionDivColor(){
            var actionDiv=document.getElementById('actionDiv');
            if(document.getElementById('actionCreate').checked){
                actionDiv.style.backgroundColor = "#00FF00";
            }
            if(document.getElementById('actionUpdate').checked){
                actionDiv.style.backgroundColor = "#FFFF00";
            }
            if(document.getElementById('actionDelete').checked){
                actionDiv.style.backgroundColor = "#FF0000";
            }
            if(document.getElementById('actionViewOrganizer').checked){
                actionDiv.style.backgroundColor = "#BBBBFF";
            }
        }
        function changeSelectIcon(categorySelect){
            var category = categorySelect.id;
            var categoryLogo=document.getElementById(category + 'logo');
            categoryLogo.setAttribute('src', '{{ asset('img/siteicons') }}' + '/' + category + categorySelect.value + '.png');
        }
        function displayLanguage (wantedLanguage){
            @foreach ($languages as $language)
            document.getElementById("summaryAndDescription{{ $language }}").style.display = "none";
            @endforeach
            document.getElementById("summaryAndDescription"+wantedLanguage).style.display = "block";
        }
        function translate (sourceLanguage, targetLanguage){
            var sourcetitre = document.getElementById("titre_"+sourceLanguage).value;
            var sourcedescription = document.getElementById("description_"+sourceLanguage).value;
            var translateUrl = "https://translation.googleapis.com/language/translate/v2?key=AIzaSyDT3eL-Jpn94bRVvSC3rWCGrxmiXgHVmIw";
            translateUrl += "&source=" + sourceLanguage;
            translateUrl += "&target=" + targetLanguage;
            translateUrl += "&format=text";
            translateUrl += "&q=" + encodeURIComponent(sourcetitre);
            translateUrl += "&q=" + encodeURIComponent(sourcedescription);
            $.get(translateUrl, function (data, status) {
                $("#titre_"+targetLanguage).val(decodeURIComponent(data.data.translations[0].translatedText));
                $("#description_"+targetLanguage).text(decodeURIComponent(data.data.translations[1].translatedText));
            });
        }

        function autoTranslate(){
            if (document.getElementById('autoTranslateCheck').checked) {
                @foreach ($languages as $language)
                @if ($language == session('locale'))
                document.getElementById("titre_{{ $language }}").readOnly = false ;
                document.getElementById("description_{{ $language }}").readOnly = false ;
                @else
                translate('{{ session('locale') }}', '{{ $language }}');
                document.getElementById("titre_{{ $language }}").readOnly = true ;
                document.getElementById("description_{{ $language }}").readOnly = true ;
                @endif
                @endforeach
            }else{
                @foreach ($languages as $language)
                document.getElementById("titre_{{ $language }}").readOnly = false ;
                document.getElementById("description_{{ $language }}").readOnly = false ;
                @endforeach
            }
        }

        function translateall (sourceLanguage){
            translate (sourceLanguage, 'de');
            translate (sourceLanguage, 'en');
            translate (sourceLanguage, 'es');
            translate (sourceLanguage, 'fr');
            translate (sourceLanguage, 'it');
            translate (sourceLanguage, 'nl');
            translate (sourceLanguage, 'pt');
        }

    </script>
@endsection

@section('content')
    <h1>{{ __($pagetitle) }}</h1>
    <br>
    <div class="divTexte">
        <form action="{{ asset('/admin-video/'.$currentVideo->id) }}" method="post">
            {{ csrf_field() }}
            <input type="text" name="videoid" id="videoid" value="{{ $currentVideo->id }}" style="width: 45px">
            <label for="videoid">videoid</label> <br />
            <select name="type" id="type" style="width: 150px" >
                <option value="-" {{ $currentVideo->type == '-' ? "selected":"" }}>-</option>
                <option value="0-homepage" {{ $currentVideo->type == '0-homepage' ? "selected":"" }}>0-homepage</option>
                <option value="1-racetrack" {{ $currentVideo->type == '1-racetrack' ? "selected":"" }}>1-racetrack</option>
                <option value="2-organizer" {{ $currentVideo->type == '2-organizer' ? "selected":"" }}>2-organizer</option>
                <option value="3-trackday" {{ $currentVideo->type == '3-trackday' ? "selected":"" }}>3-trackday</option>
                <option value="4-coaching" {{ $currentVideo->type == '4-coaching' ? "selected":"" }}>4-coaching</option>
                <option value="Z-homepageold" {{ $currentVideo->type == 'Z-homepageold' ? "selected":"" }}>Z-homepageold</option>
            </select>
            <input type="text" name="idcircuit" id="idcircuit" value="{{ $currentVideo->idcircuit }}" style="width: 45px">
            <label for="idcircuit">idcircuit</label>
            &nbsp;&nbsp;&nbsp;
            <input type="text" name="idorganisateur" id="idorganisateur" value="{{ $currentVideo->idorganisateur }}" style="width: 45px">
            <label for="idorganisateur">idorganisateur</label>
            &nbsp;&nbsp;&nbsp;
            <input type="text" name="idtrackday" id="idtrackday" value="{{ $currentVideo->idtrackday }}" style="width: 45px">
            <label for="idtrackday">idtrackday</label> <br />
            <input type="text" name="idyoutube" id="idyoutube" value="{{ $currentVideo->idyoutube }}" style="width: 45px">
            <label for="idyoutube">idyoutube</label> <br />
            <div style="float: right; width: 300px" >
                <div style="background-color: #00FF00;" id="actionDiv" >
                    <input type="radio" name="action" id="actionCreate" value="create" onchange="setActionDivColor()" {{ $nextAction=='create' ? 'checked':'' }} >
                    <label for="actionCreate">{{ __('Create') }}</label><br />
                    <input type="radio" name="action" id="actionUpdate" value="update" onchange="setActionDivColor()" {{ $nextAction=='update' ? 'checked':'' }} >
                    <label for="actionUpdate">{{ __('Update') }}</label><br />
                    <input type="radio" name="action" id="actionDelete" value="delete" onchange="setActionDivColor()" {{ $nextAction=='delete' ? 'checked':'' }} >
                    <label for="actionDelete">{{ __('Delete') }}</label><br />
                    <input type="radio" name="action" id="actionViewOrganizer" value="viewOrganizer" onchange="setActionDivColor()" {{ $nextAction=='viewOrganizer' ? 'checked':'' }} >
                    <label for="actionViewOrganizer">{{ __('View Organizer') }}</label>
                </div>
                <button type="submit" id="submitbutton" >Ok</button>
                <br /><br />
                <div class="alignRight">
                    <img src="{{ asset('/img/videosscreenshots/videoscreenshot'.$currentVideo->idVideoScreenshot.'s.jpg') }}" width="120px"/><br />
                    <input type="file" name="screenshot" multiple accept="image/jpeg" style="width: 120px" />
                </div>
            </div>
            <br /><br />
            <input type="checkbox" name="autoTranslateCheck" id="autoTranslateCheck" onchange="autoTranslate();" checked>
            <label for="autoTranslateCheck">{{ __('Automatic translation from English') }}</label>
            <br />
            @foreach ($languages as $language)
                <a href="javascript:displayLanguage('{{ $language }}');" >{{ $language }}</a>&nbsp;&nbsp;&nbsp;
            @endforeach
            @foreach ($languages as $language)
                <div id="summaryAndDescription{{$language}}" style="display: {{ $language == session ('locale') ? "block" : "none" }};">
                    {{ $language }}
                    <input type="text" name="titre_{{ $language }}" id="titre_{{ $language }}"
                           value="{{ $currentVideo->{'titre_'.$language} }}"
                           {!! $language == session ('locale') ? 'onfocusout="autoTranslate();"' : '' !!}
                           style="width: 400px">
                    <a href="javascript:translate('fr', '{{ $language }}')" class="lien">{{ __('Translate from French') }}</a>
                    &nbsp;&nbsp;-&nbsp;&nbsp;
                    <a href="javascript:translateall('{{ $language }}')" class="lien">{{ __('All') }}</a>&nbsp;&nbsp;&nbsp;
                    <br />
                    <br />
                    <textarea name="description_{{ $language }}" id="description_{{ $language }}"
                              {!! $language == session ('locale') ? 'onfocusout="autoTranslate();"' : '' !!}
                              style="width: 640px; height: 260px;">{{ $currentVideo->{'description_'.$language} }}</textarea>
                </div>
            @endforeach
            <input type="text" name="auteur" id="auteur" value="{{ $currentVideo->auteur }}" size="62">
            <label for="auteur">Auteur</label>
            <br />
            <input type="text" name="email" id="email" value="{{ $currentVideo->email }}" size="62">
            <label for="email">email</label>
            <br />
            <input type="text" name="url" id="url" value="{{ $currentVideo->url }}" size="62">
            <label for="url">URL</label>
            <br />
        </form>
    </div>
    <br /><br />
    <hr class="separateurRubriques"/>
    <br /><br />

    @foreach ($videos as $video)
        <div style="vertical-align: top;">
            <div style="display: inline-block; width: 520px; vertical-align: top;">
                <a href="{{ asset('/admin-video/'.$video->id) }}">
                    {{ $video->id }} &nbsp;
                </a>
                {{ $video->titre }}
                <br />
                <img src="https://i1.ytimg.com/vi/{{ $video->idyoutube }}/default.jpg" itemprop="image" alt="{{ $video->titre }}" style="float: left; margin-right: 10px;">
                {{ $video->type }}<br />
                idcircuit : {{ $video->idcircuit }}&nbsp;&nbsp;&nbsp;&nbsp;idorganisateur : {{ $video->idorganisateur }}&nbsp;&nbsp;&nbsp;&nbsp;idtrackday : {{ $video->idtrackday }}&nbsp;&nbsp;&nbsp;&nbsp;
                <br />
                {{ $video->auteur }}<br />
                {{ $video->email }}<br />
                <a href="{{ $video->url }}" class="texte7">{{ $video->url }}</a><br />
            </div>
            <div style="display: inline-block; width: 425px;">
                <br />
                <textarea name="description" style="width: 425px; height: 100px;">{{ $video->description }}</textarea>
            </div>
        </div>
        <br /><hr /><br />
    @endforeach

@endsection

@section('footerscripts')
@endsection