@extends('layouts.site')

@section('content')
<div class="within">
  <div class="bar">【<a href="/video/{{ $res->slug }}">{{ $res->mgametitle }}</a>{{ $res->gametitle }}】{{ $res->title }}</div>
  <div class="back">
    <video style="max-width: 813px; width: 100%; height: 458px;" src="{{ $res->url }}" controls></video>
  </div>
  <div class="comment">
    <div class="container-fluid">
      @if (isset($res->youtube) || isset($res->twitter) || isset($res->nicovideo) || isset($res->bitchute))
      <div class="row">
        @if (isset($res->youtube) && $res->youtube != '')
        <div class="col"><a class="btn btn-block btn-primary" href="{{ $res->youtube }}">ユーチューブで見る</a></div>
        @endif
        @if (isset($res->twitter) && $res->twitter != '')
        <div class="col"><a class="btn btn-block btn-primary" href="{{ $res->twitter }}">ツイッターで見る</a></div>
        @endif
        @if (isset($res->nicovideo) && $res->nicovideo != '')
        <div class="col"><a class="btn btn-block btn-primary" href="{{ $res->nicovideo }}">ニコ動で見る</a></div>
        @endif
        @if (isset($res->bitchute) && $res->bitchute != '')
        <div class="col"><a class="btn btn-block btn-primary" href="{{ $res->bitchute }}">ビットチューブで見る</a></div>
        @endif
        </div>
      </div>
      @endif
      <div style="margin-top: 4px;" class="row">
        <div class="col">
          <ul class="nav nav-tabs" id="commenting" role="tablist">
            <li class="nav-item" role="presentation">
              <a class="nav-link active" id="home-tab" data-toggle="tab" href="#home" role="tab" aria-controls="home" aria-selected="true">テク諏訪</a>
            </li>
            @if ($res->ytcomment)
            <li class="nav-item" role="presentation">
              <a class="nav-link" id="profile-tab" data-toggle="tab" href="#profile" role="tab" aria-controls="profile" aria-selected="false">YT</a>
            </li>
            @endif
            @if ($res->nicocomment)
            <li class="nav-item" role="presentation">
              <a class="nav-link" id="messages-tab" data-toggle="tab" href="#messages" role="tab" aria-controls="messages" aria-selected="false">ニコ動</a>
            </li>
            @endif
            @if ($res->bccomment)
            <li class="nav-item" role="presentation">
              <a class="nav-link" id="settings-tab" data-toggle="tab" href="#settings" role="tab" aria-controls="settings" aria-selected="false">Bit</a>
            </li>
            @endif
          </ul>

          <div class="tab-content">
            <div class="tab-pane active" id="home" role="tabpanel" aria-labelledby="home-tab">
              <comments slug="{{$res->pageslug}}" isvideo="t" :comments="{{json_encode($res->comments)}}" :user="{{json_encode($res->user)}}" />
            </div>
            @if ($res->ytcomment)
            <div class="tab-pane" id="profile" role="tabpanel" aria-labelledby="profile-tab">
              <comments slug="{{$res->pageslug}}" isvideo="n" :comments="{{json_encode($res->ytcomment)}}" :user="{{json_encode($res->user)}}" />
            </div>
            @endif
            @if ($res->nicocomment)
            <div class="tab-pane" id="messages" role="tabpanel" aria-labelledby="messages-tab">
              <comments slug="{{$res->pageslug}}" isvideo="n" :comments="{{json_encode($res->nicocomment)}}" :user="{{json_encode($res->user)}}" />
            </div>
            @endif
            @if ($res->bccomment)
            <div class="tab-pane" id="settings" role="tabpanel" aria-labelledby="settings-tab">
              <comments slug="{{$res->pageslug}}" isvideo="n" :comments="{{json_encode($res->bccomment)}}" :user="{{json_encode($res->user)}}" />
            </div>
            @endif
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

@endsection