Split table.view to multiple files

resources/views/table/_action-buttons.blade.php

@@ -0,0 +1,57 @@
+{{--
+  args: $table
+--}}
+
+<nav aria-label="Table action buttons">
+  @sr(Table actions)
+
+  @if(guest() || user()->ownsTable($table))
+    <a href="" class="btn btn-outline-primary py-1 btn-sm" title="Forks"
+       data-toggle="tooltip" data-placement="top">
+      {{ $table->forks_count ?: '–' }}&nbsp;
+      @icon(fa-code-fork, sr:Forks)
+    </a>
+
+    <a href="#" class="btn btn-outline-primary py-1 btn-sm"
+       title="Favourites" data-toggle="tooltip" data-placement="top">
+      {{ $table->favourites_count ?: '–' }}&nbsp;
+      @icon(fa-star, sr:Favourites)
+    </a>
+  @else
+    <div class="btn-group" role="group" aria-label="Fork">
+      <a href="" class="btn btn-outline-primary py-1 btn-sm btn-square" title="Fork"
+         data-toggle="tooltip" data-placement="top">
+        @icon(fa-code-fork, sr:Fork)
+      </a>
+      <a href="" class="btn btn-outline-primary py-1 btn-sm" title="Fork Count"
+         data-toggle="tooltip" data-placement="top">
+        {{ $table->forks_count ?: '–' }}
+      </a>
+    </div>
+
+    <div class="btn-group" role="group" aria-label="Favourite">
+      @if(user()->favouritesTable($table))
+        <a href="" class="btn btn-outline-primary py-1 btn-sm btn-square" title="Un-favourite"
+           data-toggle="tooltip" data-placement="top">
+          @icon(fa-star, sr:Un-favourite)
+        </a>
+      @else
+        <a href="" class="btn btn-outline-primary py-1 btn-sm btn-square" title="Favourite"
+           data-toggle="tooltip" data-placement="top">
+          @icon(fa-star-o, sr:Favourite)
+        </a>
+      @endif
+
+      <a href="" class="btn btn-outline-primary py-1 btn-sm" title="Favourite Count"
+         data-toggle="tooltip" data-placement="top">
+        {{ $table->favourites_count ?: '–' }}
+      </a>
+    </div>
+  @endif
+
+  <a href="" class="btn btn-outline-primary py-1 btn-sm" title="Comments"
+     data-toggle="tooltip" data-placement="top">
+    {{ $table->comments_count ?: '–' }}&nbsp;
+    @icon(fa-comment, sr:Comments)
+  </a>
+</nav>

resources/views/table/_panel-metadata.blade.php

@@ -0,0 +1,81 @@
+{{--
+  args: $table
+--}}
+
+<div class="row">
+
+  {{-- Description field --}}
+  <div class="col-md-8 pl-md-0">
+    <b>Description</b>
+    @if($table->description)
+      {!! Widget::collapsible($table->description, 400, '8em') !!}
+      @if($table->origin)
+        <div class="mt-2"></div>{{-- spacer --}}
+      @endif
+    @else
+      <p>
+        <i>No description.</i>
+      </p>
+    @endif
+
+    @if($table->origin)
+      <p>
+        <b>Adapted From</b><br>
+        {!! Widget::tryLink($table->origin) !!}
+      </p>
+    @endif
+  </div>
+
+  {{-- Info table --}}
+  <div class="col-md-4 border-left my-md-0 my-2 pr-md-0 mobile-no-border">
+    <table>
+      <tbody>
+
+      <tr>
+        <th class="text-right pr-2">Author</th>
+        <td>
+          {{ $table->owner->title }}
+          (<a href="{{route('profile.view', $table->owner->name)}}">{{ $table->owner->handle }}</a>)
+        </td>
+      </tr>
+
+      <tr>
+        <th class="text-right pr-2">License</th>
+        <td>{{ $table->license ?: 'CC0' }}</td>
+      </tr>
+
+      <tr>
+        <th class="text-right pr-2">Created</th>
+        <td>
+          <span class="pr-1" data-toggle="tooltip" data-placement="right"
+                title="{{ $table->created_at->format("M n, Y \\a\\t G:i") }}">
+          {{ $table->created_at->diffForHumans() }}
+          </span>
+        </td>
+      </tr>
+
+      <tr>
+        <th class="text-right pr-2">Updated</th>
+        <td>
+          <span class="pr-1" data-toggle="tooltip" data-placement="right"
+                title="{{ $table->updated_at->format("M n, Y \\a\\t G:i") }}">
+          {{ $table->updated_at->diffForHumans() }}
+          </span>
+        </td>
+      </tr>
+
+      <tr>
+        <th class="text-right pr-2">Revisions</th>
+        <td>{{ $table->revisions_count }}</td>
+      </tr>
+
+      <tr>
+        <th class="text-right pr-2">Visits</th>
+        <td>{{ $table->visits }}&nbsp;&nbsp;{!! Widget::help('Visitors counted once per day') !!}</td>
+      </tr>
+
+      </tbody>
+    </table>
+  </div>
+
+</div>{{-- inner row --}}

resources/views/table/_rows.blade.php

@@ -0,0 +1,23 @@
+{{--
+  args: $rows, $cols
+--}}
+
+<table class="table table-hover table-sm">
+  <thead>
+  <tr>
+    @foreach($columns as $col)
+      <th>{{ $col->title }}</th>
+    @endforeach
+  </tr>
+  </thead>
+  <tbody>
+  @foreach($rows as $row)
+    <tr>
+      @php($rdata = json_decode($row['data'], true))
+      @foreach($columns as $col)
+        <td data-id="{{ $row->id }}">{{ $rdata[$col->name] }}</td>
+      @endforeach
+    </tr>
+  @endforeach
+  </tbody>
+</table>

resources/views/table/view.blade.php

@@ -17,144 +17,19 @@
 
       <h1 class="mx-3">{{ $table->title }}</h1>
 
-      <nav>
+      @include('table._action-buttons')
-        @sr(Table actions)
-
-        @if(guest() || user()->ownsTable($table))
-          <a href="" class="btn btn-outline-primary py-1 btn-sm" title="Forks"
-             data-toggle="tooltip" data-placement="top">
-            {{ $table->forks_count ?: '–' }}&nbsp;
-            @icon(fa-code-fork, sr:Forks)
-          </a>
-
-          <a href="#" class="btn btn-outline-primary py-1 btn-sm"
-             title="Favourites" data-toggle="tooltip" data-placement="top">
-            {{ $table->favourites_count ?: '–' }}&nbsp;
-            @icon(fa-star, sr:Favourites)
-          </a>
-        @else
-          <div class="btn-group" role="group" aria-label="Fork">
-            <a href="" class="btn btn-outline-primary py-1 btn-sm btn-square" title="Fork"
-               data-toggle="tooltip" data-placement="top">
-              @icon(fa-code-fork, sr:Fork)
-            </a>
-            <a href="" class="btn btn-outline-primary py-1 btn-sm" title="Fork Count"
-               data-toggle="tooltip" data-placement="top">
-              {{ $table->forks_count ?: '–' }}
-            </a>
-          </div>
-
-          <div class="btn-group" role="group" aria-label="Favourite">
-            @if(user()->favouritesTable($table))
-              <a href="" class="btn btn-outline-primary py-1 btn-sm btn-square" title="Un-favourite"
-                 data-toggle="tooltip" data-placement="top">
-                @icon(fa-star, sr:Un-favourite)
-              </a>
-            @else
-              <a href="" class="btn btn-outline-primary py-1 btn-sm btn-square" title="Favourite"
-                 data-toggle="tooltip" data-placement="top">
-                @icon(fa-star-o, sr:Favourite)
-              </a>
-            @endif
-
-            <a href="" class="btn btn-outline-primary py-1 btn-sm" title="Favourite Count"
-               data-toggle="tooltip" data-placement="top">
-              {{ $table->favourites_count ?: '–' }}
-            </a>
-          </div>
-        @endif
-
-        <a href="" class="btn btn-outline-primary py-1 btn-sm" title="Comments"
-           data-toggle="tooltip" data-placement="top">
-          {{ $table->comments_count ?: '–' }}&nbsp;
-          @icon(fa-comment, sr:Comments)
-        </a>
-      </nav>
     </div>
   </div>
 
 <div class="row mx-auto col-md-12 justify-content-center mb-1 border rounded px-0 py-2 box-shadow mb-3">
+
+  {{-- Tab panels wrapper --}}
   <div class="col-md-10 tab-content order-1" id="infobox-tabContent">
 
-  {{-- Tab pane --}}
     <div class="tab-pane show active container" id="infobox-home" role="tabpanel" aria-labelledby="infobox-home-tab">
-    <div class="row">
+      @include('table._panel-metadata')
-
-      {{-- Description field --}}
-      <div class="col-md-8 pl-md-0">
-        <b>Description</b>
-        @if($table->description)
-          {!! Widget::collapsible($table->description, 400, '8em') !!}
-          @if($table->origin)
-            <div class="mt-2"></div>{{-- spacer --}}
-          @endif
-        @else
-          <p>
-            <i>No description.</i>
-          </p>
-        @endif
-
-        @if($table->origin)
-          <p>
-            <b>Adapted From</b><br>
-            {!! Widget::tryLink($table->origin) !!}
-          </p>
-        @endif
     </div>
 
-      {{-- Info table --}}
-      <div class="col-md-4 border-left my-md-0 my-2 pr-md-0 mobile-no-border">
-        <table>
-          <tbody>
-
-          <tr>
-            <th class="text-right pr-2">Author</th>
-            <td>
-              {{ $table->owner->title }}
-              (<a href="{{route('profile.view', $table->owner->name)}}">{{ $table->owner->handle }}</a>)
-            </td>
-          </tr>
-
-          <tr>
-            <th class="text-right pr-2">License</th>
-            <td>{{ $table->license ?: 'CC0' }}</td>
-          </tr>
-
-          <tr>
-            <th class="text-right pr-2">Created</th>
-            <td>
-              <span class="pr-1" data-toggle="tooltip" data-placement="right" title="{{ $table->created_at->format("M n, Y \\a\\t G:i") }}">
-                {{ $table->created_at->diffForHumans() }}
-              </span>
-            </td>
-          </tr>
-
-          <tr>
-            <th class="text-right pr-2">Updated</th>
-            <td>
-              <span class="pr-1" data-toggle="tooltip" data-placement="right" title="{{ $table->updated_at->format("M n, Y \\a\\t G:i") }}">
-                {{ $table->updated_at->diffForHumans() }}
-              </span>
-            </td>
-          </tr>
-
-          <tr>
-            <th class="text-right pr-2">Revisions</th>
-            <td>{{ $table->revisions_count }}</td>
-          </tr>
-
-          <tr>
-            <th class="text-right pr-2">Visits</th>
-            <td>{{ $table->visits }}&nbsp;&nbsp;{!! Widget::help('Visitors counted once per day') !!}</td>
-          </tr>
-
-          </tbody>
-        </table>
-      </div>
-
-    </div>{{-- inner row --}}
-  </div>{{-- Tab container --}}
-
     <div class="tab-pane container" id="infobox-columns" role="tabpanel" aria-labelledby="infobox-columns-tab">
       Column toggles, sort, filtering … coming soon
     </div>
@@ -163,34 +38,32 @@
       Export … coming soon
     </div>
 
-</div>{{-- Tab panel --}}
+  </div>{{-- End of tab panels wrapper --}}
 
   {{-- Right column with menu --}}
   <div class="col-md-2 border-left order-md-2 order-0 mb-md-0 mb-2">
+    <div class="nav flex-md-column flex-row nav-pills pt-1" role="tablist"
+         aria-label="Tabs for the table info box" id="infobox-tab">
 
-  <div class="nav flex-md-column flex-row nav-pills pt-1" id="infobox-tab" role="tablist" aria-orientation="vertical">
+      <a class="nav-link active" data-toggle="pill" role="tab" aria-selected="true"
-    <a class="nav-link active"
+         id="infobox-home-tab" href="#infobox-home" aria-controls="infobox-home">
-       id="infobox-home-tab"
+        Table Info
-       data-toggle="pill" href="#infobox-home"
+      </a>
-       role="tab" aria-controls="infobox-home"
-       aria-selected="true">Table Info</a>
 
-    <a class="nav-link"
+      <a class="nav-link" data-toggle="pill" role="tab" aria-selected="false"
-       id="infobox-columns-tab"
+         id="infobox-columns-tab" href="#infobox-columns" aria-controls="infobox-columns">
-       data-toggle="pill" href="#infobox-columns"
+        Columns
-       role="tab" aria-controls="infobox-columns"
+      </a>
-       aria-selected="false">Columns</a>
 
-    <a class="nav-link"
+      <a class="nav-link" data-toggle="pill" role="tab" aria-selected="false"
-       id="infobox-export-tab"
+         id="infobox-export-tab" href="#infobox-export" aria-controls="infobox-export">
-       data-toggle="pill" href="#infobox-export"
+        Export
-       role="tab" aria-controls="infobox-export"
+      </a>
-       aria-selected="false">Export</a>
-  </div>
 
     </div>
+  </div>{{-- end of menu column --}}
 
-</div>
+</div>{{-- End of row --}}
 
 <div class="row justify-content-center mb-2">
   <div class="col-md-12 d-flex">
@@ -198,29 +71,20 @@
       {{ $rows->links(null, ['ulClass' => 'mb-0']) }}
     </nav>
   </div>
-</div>
+</div>{{-- End of row --}}
 
 <div class="row justify-content-center">
   <div class="col-12">
-  <table class="table table-hover table-sm">
+    @include('table._rows')
-    <thead>
-    <tr>
-      @foreach($columns as $col)
-        <th>{{ $col->title }}</th>
-      @endforeach
-    </tr>
-    </thead>
-    <tbody>
-      @foreach($rows as $row)
-        <tr>
-          @php($rdata = json_decode($row['data'], true))
-          @foreach($columns as $col)
-            <td data-id="{{ $row->id }}">{{ $rdata[$col->name] }}</td>
-          @endforeach
-        </tr>
-      @endforeach
-    </tbody>
-  </table>
   </div>
+</div>{{-- End of row --}}
+
+<div class="row justify-content-center mb-2">
+  <div class="col-md-12 d-flex">
+    <nav class="text-center" aria-label="Pages of the table">
+      {{ $rows->links(null, ['ulClass' => 'mb-0']) }}
+    </nav>
   </div>
+</div>{{-- End of row --}}
+
 @endsection