@extends('layouts.app')

@section('content')

<div class="alert alert-danger loaderwowza">
    <p>Videos are synching with wowza server please wait .. </p>
</div>

<div class="row">
    <div class="col-lg-12 col-md-2 margin-tb">
        <div class="pull-left">
            <h3>pLive Management</h3>
        </div>
        <div class="pull-right">
            @if(count($videos) < 1)
            <a class="btn btn-success btn-sm" href="{{ route('videos.lsvod_add') }}">Add Schedule</a>
            @endif
        </div>
    </div>
</div>

@if ($message = Session::get('success'))
<div class="alert alert-success">
    <p>{{ $message }}</p>
</div>
@endif

<table class="table table-bordered table-striped">
    <tr>
        <th>ID</th>
        <th>Name</th>
        <th>Action</th>
    </tr>

    @if($videos)
    @foreach ($videos as $key => $video)
        <tr>
        <td>{{ $video->id }}</td>
        <td>{{ $video->name }}</td>
        <td class="col-md-2">
            <a class="btn btn-success btn-sm btn-block space_buttons watch_smil" data-id="{{ $video->id }}" data-src="@if($smilPath){{ (new \App\Http\Helper)->read_xml($smilPath) }}@else {{ 'File not exist'}}@endif">View</a>

            <a class="btn btn-primary btn-sm btn-block space_buttons" href="{{ route('plives.edit',$video->id) }}">Edit</a>

            @if($video->status == 'published')
            <a class="btn btn-warning btn-sm btn-block space_buttons unpublish" href="#" data-id="{{ $video->id }}" data-status="unpublished" data-channel="">Publish to wowza</a>
            @else
            <a class="btn btn-warning btn-sm btn-block space_buttons unpublish" href="#" data-id="{{ $video->id }}" data-status="published" data-channel="">Publish to wowza</a>
            @endif

<!-- <a class="btn btn-primary btn-sm btn-block space_buttons btnABR" href="#" data-plive_id="{{ $video->id }}"><img id="loading-image" style="display: none;" src="../../ajax-loader.gif"/> Publish smil for ABR</a> -->
        </td>
    </tr>
    @endforeach
    @else
    <tr> <td colspan="5">No record available. </td></tr>
    @endif
</table>

<div class="well well-lg" style="height: 300px">
    <div class="col-lg-12 "> 
        <p>Please load schedule after publishing to wowza by copy and paste rtmp path</p>
        <iframe scrolling="no" style="width: 100%; height: 200px;" src="http://padmin.msgnaa.info/ModuleScheduleClient/LoadSchedule.html">
            <p>Your browser does not support iframes.</p>
        </iframe>
        <p>rtmp://103.95.132.59:1935/plive</p>
    </div>
</div>

<div class="modal fade" id="modalWatchSmil" role="dialog">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title" id="add-modal-label">pLiveSmil.smil</h4>
            </div>
            <div class="modal-body">
                <div class="form-group" style="text-align:center;">
                    <textarea id="watchSmil" rows="20" cols="65" style="border:none;"></textarea>
                </div>
            </div>
            <div class="modal-footer"></div> 
        </div>
    </div>
</div>

<script type="text/javascript">

    $('.loaderwowza').hide();
    //Watch smil popup
    $(document).on('click', '.watch_smil', function (e) {
        e.preventDefault();

        $('#watchSmil').html($(this).attr('data-src'));
        //$('#add-modal-label').html('pLiveSmil_'+$(this).attr('data-id')+'.smil');
        $('#add-modal-label').html('pLiveSmil.smil');
        $('#modalWatchSmil').modal('show');
    });

    //unpublished button click
    $(document).on('click', '.unpublish', function (e) {
        e.preventDefault();

        var that = $(this);
        $.ajax({
            type: "POST",
            url: '/videos/change_plive_status',
            beforeSend: function () {
                $('.loaderwowza').show();
                $('.unpublish').addClass('disabled');
            },
            data: {"_token": "{{ csrf_token() }}", "id": $(this).data('id'), "status": $(this).data('status'), "channel": $(this).data('channel')},
            success: function (json) {
                if (json.status == 'success') {
                    $('.loaderwowza').hide();

                    $('.unpublish').removeClass('disabled');
                    if (json.message == 'published') {
                        // that.text('Publish');
                        //that.data('status', 'unpublished');
                        //that.removeClass( "btn-danger" ).addClass( "btn-success" );
                    } else if (json.message == 'unpublished') {
                        //that.text('Publish');
                        that.data('status', 'published');
                        //that.removeClass( "btn-success" ).addClass( "btn-danger" );
                    }

                } else if (json.status == 'failure') {
                    //that.css("display", "block");
                }
            }
        });
    });

    //Get data for ABR smil
    $(document).on('click', '.btnABR', function (e) {
        e.preventDefault();

        $('#loading-image').show();
        $.ajax({
            url: '/videos/abr_video_details',
            type: "POST",
            data: {'_token': '{{ csrf_token() }}', 'pliveId': $(this).data('plive_id')},
            success: function (data) {
                $('#loading-image').hide();
            }
        });
    });
</script>
@endsection