@extends('admin.layouts.master') 
@section('content')
<div class="content-header">
      <div class="container-fluid">
        <div class="row mb-2">
          <div class="col-sm-6">
            <h1 class="m-0 text-dark">Add Translation</h1>
          </div><!-- /.col -->
          <div class="col-sm-6">
            <ol class="breadcrumb float-sm-right">
              <li class="breadcrumb-item"><a href="{{asset('/')}}">Home</a></li>
              <li class="breadcrumb-item active"><a href="{{asset(route('translations.index'))}}">Translations</a></li>
            </ol>
          </div><!-- /.col -->
        </div><!-- /.row -->
      </div><!-- /.container-fluid -->
    </div>
  <div class="container-fluid">
    @if(session()->has('success'))
      <div class="alert alert-success">
        {{ session()->get('success') }}
       </div>
       <div class="alert alert-success">
        <input id="copy_cmd" onClick="this.select();" type="text" value="{{session()->get('cmd')}}" style="width:500px;font-size:16px;"> <input type="button" class="btn btn-danger" value="copy" onClick="copyCmd()"> 
        <br><span class="copy_status"></span>
       </div>
    @endif
    @if(session()->has('error'))
      <div class="alert alert-success">
        {{ session()->get('error') }}
      </div>
    @endif
        <div class="row">
          <div class="col-md-12">
            <div class="card card-primary">
              <div class="card-header">
                <h3 class="card-title">Add Trans</h3>
              </div>
              <form role="form" method="post" action="{{!isset($translations['id']) ? route('translations.store') : route('translations.update',$translations['id'])}}">
                @csrf
                @if(isset($translations['id']))
                   {{ method_field('PUT') }}
                @endif
                <div class="card-body">
                  <div class="form-group">
                    <label for="identifier">Identifier</label>
                    <input type="text" class="form-control" id="identifier" name="identifier" required placeholder="Enter identifier" value="{{ old('identifier', $translations['identifier']) }}">
                  </div>

                  <div class="form-group">
                    <label for="english">English</label>
                    <input type="text" class="form-control" id="english" name="english" required placeholder="Enter English Translation" value="{{ old('english', $translations['english']) }}">
                  </div>
                  
                </div>
                <div class="card-footer">
                  <button type="submit" class="btn btn-primary">Submit</button>
                </div>
              </form>
            </div>
          </div>
        </div>
      </div>
  @endsection
  @section('script')
  <script>
    function copyCmd(){
      var copy    = document.getElementById("copy_cmd");
     

          // Select some text (you could also create a range)
        copy.select(); 

        // Use try & catch for unsupported browser
        try {

            // The important part (copy selected text)
            var ok = document.execCommand('copy');

            if (ok){
              $('.copy_status').text('copied');
            }
            else{
              $('.copy_status').text('Unable to copy!');
            }
        } catch (err) {
          $('.copy_status').text('Unsupported Browser!');
        }
    }
    $(document).ready(function(){

      if($('#copy_cmd').length){
        setTimeout(copyCmd, 1000);
      }

      $('#identifier').on('keyup', function(){
          $('#identifier').addClass('typed');
      });

      $('#english').on('blur', function(){
          if(!$('#identifier').hasClass('typed') || $('#identifier').val() == ''){
            var txt = $(this).val().replace(/ /g, '_').toLowerCase();
            $('#identifier').val(txt);
          }
      });

    }); 
    </script>
@endsection