diff --git a/app/Http/Controllers/Api/VideoAnnotationController.php b/app/Http/Controllers/Api/VideoAnnotationController.php
index 619bd8aaa..f1ab24bcd 100644
--- a/app/Http/Controllers/Api/VideoAnnotationController.php
+++ b/app/Http/Controllers/Api/VideoAnnotationController.php
@@ -211,13 +211,8 @@ public function store(StoreVideoAnnotation $request)
             }
         }
 
-        // from a JSON request, the array may already be decoded
         $points = $request->input('points', []);
 
-        if (is_string($points)) {
-            $points = json_decode($points);
-        }
-
         $annotation = new VideoAnnotation([
             'video_id' => $request->video->id,
             'shape_id' => $request->input('shape_id'),
diff --git a/app/Http/Controllers/Views/Videos/VideoAnnotationController.php b/app/Http/Controllers/Views/Videos/VideoAnnotationController.php
index bd82a7c01..d5140a88f 100644
--- a/app/Http/Controllers/Views/Videos/VideoAnnotationController.php
+++ b/app/Http/Controllers/Views/Videos/VideoAnnotationController.php
@@ -18,7 +18,7 @@ public function show($id)
         $annotation = VideoAnnotation::findOrFail($id);
         $this->authorize('access', $annotation);
 
-        return redirect()->route('video', [
+        return redirect()->route('video-annotate', [
             'id' => $annotation->video_id,
             'annotation' => $annotation->id,
         ]);
diff --git a/app/Http/Controllers/Views/Volumes/VideoController.php b/app/Http/Controllers/Views/Volumes/VideoController.php
new file mode 100644
index 000000000..67dc46bc5
--- /dev/null
+++ b/app/Http/Controllers/Views/Volumes/VideoController.php
@@ -0,0 +1,36 @@
+<?php
+
+namespace Biigle\Http\Controllers\Views\Volumes;
+
+use Arr;
+use Biigle\Http\Controllers\Views\Controller;
+use Biigle\Video;
+
+class VideoController extends Controller
+{
+    /**
+     * Shows the video index page.
+     *
+     * @param int $id volume ID
+     */
+    public function index($id)
+    {
+        $video = Video::with('volume')->findOrFail($id);
+
+        $this->authorize('access', $video);
+
+        $metadataMap = [
+            'gps_altitude' => 'GPS Altitude',
+            'distance_to_ground' => 'Distance to ground',
+            'yaw' => 'Yaw/Heading',
+            'area' => 'Area',
+        ];
+
+        return view('volumes.videos.index', [
+            'video' => $video,
+            'volume' => $video->volume,
+            'metadata' => Arr::only($video->metadata, array_keys($metadataMap)),
+            'metadataMap' => $metadataMap,
+        ]);
+    }
+}
diff --git a/app/Http/Requests/StoreVideoAnnotation.php b/app/Http/Requests/StoreVideoAnnotation.php
index 1a9d18ff1..b42d2dd33 100644
--- a/app/Http/Requests/StoreVideoAnnotation.php
+++ b/app/Http/Requests/StoreVideoAnnotation.php
@@ -41,6 +41,8 @@ public function rules()
                 'required_unless:shape_id,'.Shape::wholeFrameId(),
                 'array',
             ],
+            'points.*' => 'array',
+            'points.*.*' => 'numeric',
             'frames' => 'required|array',
             'frames.*' => 'required|numeric|min:0|max:'.$this->video->duration,
             'track' => 'filled|boolean',
@@ -67,18 +69,13 @@ public function withValidator($validator)
                 $validator->errors()->add('frames', 'A new whole frame annotation must not have more than two frames.');
             }
 
-            $points = $this->input('points', []);
-            $allArrays = array_reduce($points, fn ($c, $i) => $c && is_array($i), true);
-
-            if (!$allArrays) {
-                $validator->errors()->add('points', 'The points must be an array of arrays.');
-            }
 
             if ($this->shouldTrack()) {
                 if ($frameCount !== 1) {
                     $validator->errors()->add('id', 'Only single frame annotations can be tracked.');
                 }
 
+                $points = $this->input('points', []);
                 if (count($points) !== 1) {
                     $validator->errors()->add('id', 'Only single frame annotations can be tracked.');
                 }
diff --git a/resources/assets/js/volumes/components/metadataModal.vue b/resources/assets/js/volumes/components/metadataModal.vue
new file mode 100644
index 000000000..3367f43a2
--- /dev/null
+++ b/resources/assets/js/volumes/components/metadataModal.vue
@@ -0,0 +1,81 @@
+<template>
+    <modal
+        ref="modal"
+        v-model="show"
+        size="md"
+        :title="name"
+        :footer="false"
+        >
+        <div class="panel panel-default">
+            <table class="table">
+                <thead>
+                    <tr>
+                        <th class="text-center" v-if="times">{{ "Time" }}</th>
+                        <th class="text-center" v-if="name !== 'Times'">{{ name }}</th>
+                    </tr>
+                </thead>
+                <tbody v-if="name === 'Times'">
+                    <tr v-for="time in times">
+                        <td class="text-center">{{ time }}</td>
+                    </tr>
+                </tbody>
+                <tbody v-else-if="times.length === items.length">
+                    <tr v-for="(item, index) in items">
+                        <td class="text-center">{{ times[index] }}</td>
+                        <td class="text-center">{{ item }}</td>
+                    </tr>
+                </tbody>
+            </table>
+        </div>
+    </modal>
+</template>
+
+<script>
+import { Modal } from 'uiv';
+
+export default {
+    components: {
+        modal: Modal,
+    },
+    props: {
+        showModal: {
+            required: true,
+            type: Boolean,
+        },
+        times: {
+            required: true,
+            type: Array,
+        },
+        items: {
+            required: true,
+            type: Array,
+        },
+        name: {
+            required: true,
+            type: String,
+        },
+    },
+    data() {
+        return {
+            show: false,
+        };
+    },
+    watch: {
+        // if volume-metadata-button pressed, trigger modal
+        showModal: function () {
+            if (this.showModal) {
+                this.show = true;
+            }
+        },
+        // if modal is closed, trigger the close-modal-event, which sets 'showModal' in parent container to false again
+        show: function() {
+            if (this.show === false) {
+                this.$emit('close-modal');
+            }
+        }
+    },
+    created() {
+        this.show = false;
+    }
+}
+</script>
diff --git a/resources/assets/js/volumes/main.js b/resources/assets/js/volumes/main.js
index 396be858c..2982cdba7 100644
--- a/resources/assets/js/volumes/main.js
+++ b/resources/assets/js/volumes/main.js
@@ -14,6 +14,7 @@ import MetadataUpload from './metadataUpload';
 import ProjectsBreadcrumb from './projectsBreadcrumb';
 import SearchResults from './searchResults';
 import VolumeContainer from './volumeContainer';
+import VideoMetadata from './videoMetadata.vue';
 
 biigle.$mount('annotation-session-panel', AnnotationSessionPanel);
 biigle.$mount('create-volume-form-step-1', CreateFormStep1);
@@ -30,3 +31,4 @@ biigle.$mount('search-results', SearchResults);
 biigle.$mount('volume-container', VolumeContainer);
 biigle.$mount('volume-file-count', FileCount);
 biigle.$mount('volume-metadata-upload', MetadataUpload);
+biigle.$mount('video-metadata-modal', VideoMetadata);
diff --git a/resources/assets/js/volumes/videoMetadata.vue b/resources/assets/js/volumes/videoMetadata.vue
new file mode 100644
index 000000000..afc5e59a8
--- /dev/null
+++ b/resources/assets/js/volumes/videoMetadata.vue
@@ -0,0 +1,62 @@
+<script>
+import LoaderMixin from '../core/mixins/loader';
+import Messages from '../core/messages/store';
+import metadataModal from './components/metadataModal';
+
+/**
+ * The video container for metadata.
+ */
+export default {
+    mixins: [
+        LoaderMixin,
+    ],
+    components: {
+        metadataModal: metadataModal,
+    },
+    data() {
+        return {
+            showModal: false,
+            metadata: null,
+            metadataMap: {},
+            times: [],
+            items: [],
+            name: "",
+        };
+    },
+    methods: {
+        getTimes(values) {
+            // If modal has been opened before, use cached data
+            if (this.times.length === 0) {
+                let dateStrings = [];
+                const options = { year: "numeric", month: "numeric", day: "numeric", hour: '2-digit', minute:'2-digit', second:'2-digit'}
+                values.forEach(element => {
+                    dateStrings.push(new Date(element).toLocaleDateString(undefined, options));
+                });
+                this.times = dateStrings;
+            }
+        },
+        showTimes() {
+            if (this.times.length === 0)
+                this.handleError("No times data found.");
+            this.name = "Times";
+            this.showModal = true;
+        },
+        showMetadata(field) {
+            this.name = this.metadataMap[field];
+            this.items = this.metadata[field];
+            this.showModal = true;
+        },
+        hideMetadataModal() {
+            this.showModal = false;
+        },
+        handleError(message) {
+            Messages.danger(message);
+        },
+    },
+    created() {
+        this.getTimes(biigle.$require('videos.times'));
+        this.metadata = biigle.$require('videos.metadata');
+        this.metadataMap = biigle.$require('videos.metadataMap');
+    }
+};
+</script>
diff --git a/resources/views/search/videos-content.blade.php b/resources/views/search/videos-content.blade.php
index 7e68e9711..4e036a7da 100644
--- a/resources/views/search/videos-content.blade.php
+++ b/resources/views/search/videos-content.blade.php
@@ -3,7 +3,7 @@
 <ul id="search-results" class="row volume-search-results">
     @foreach ($results as $video)
         <li class="col-xs-4">
-            <a href="{{route('video', $video->id)}}" title="Show video {{$video->filename}}">
+            <a href="{{route('video-annotate', $video->id)}}" title="Show video {{$video->filename}}">
                 <preview-thumbnail class="preview-thumbnail" :id="{{$video->id}}" thumb-uris="{{$video->thumbnailsUrl->implode(',')}}">
                     <img src="{{ $video->thumbnailUrl }}" onerror="this.src='{{ asset(config('thumbnails.empty_url')) }}'">
                     <figcaption slot="caption">{{$video->filename}}</figcaption>
diff --git a/resources/views/videos/dashboardActivityItem.blade.php b/resources/views/videos/dashboardActivityItem.blade.php
index 0eeb3a739..6245725ad 100644
--- a/resources/views/videos/dashboardActivityItem.blade.php
+++ b/resources/views/videos/dashboardActivityItem.blade.php
@@ -1,4 +1,4 @@
-<a class="activity-item" href="{{route('video', $item->id)}}" title="Show video {{$item->name}}">
+<a class="activity-item" href="{{route('video-annotate', $item->id)}}" title="Show video {{$item->name}}">
     <figure class="activity-item-image">
         <i class="icon fas fa-film fa-lg"></i>
         <img src="{{ $item->thumbnailUrl }}" onerror="this.src='{{ asset(config('thumbnails.empty_url')) }}'">
diff --git a/resources/views/volumes/show.blade.php b/resources/views/volumes/show.blade.php
index e28c73cea..1d2c9f285 100644
--- a/resources/views/volumes/show.blade.php
+++ b/resources/views/volumes/show.blade.php
@@ -16,8 +16,8 @@
             biigle.$declare('volumes.infoUri', '{{ route('image', ':id') }}');
         @else
             biigle.$declare('volumes.thumbCount', {{ config('videos.thumbnail_count') }});
-            biigle.$declare('volumes.annotateUri', '{{ route('video', ':id') }}');
-            biigle.$declare('volumes.infoUri', undefined);
+            biigle.$declare('volumes.annotateUri', '{{ route('video-annotate', ':id') }}');
+            biigle.$declare('volumes.infoUri', '{{ route('video', ':id') }}');
         @endif
 
         biigle.$declare('volumes.userId', {!! $user->id !!});
diff --git a/resources/views/volumes/videos/index.blade.php b/resources/views/volumes/videos/index.blade.php
new file mode 100644
index 000000000..68c462adc
--- /dev/null
+++ b/resources/views/volumes/videos/index.blade.php
@@ -0,0 +1,33 @@
+@extends('app')
+@section('title', $video->filename)
+
+@section('content')
+<div class="container">
+    <div class="row">
+        <h2 class="col-lg-12 clearfix file-info-title" title="{{ $video->filename }}">
+            {{ $video->filename }}
+            <span class="pull-right">
+                <a href="{{route('volume', $volume->id)}}" title="Back to {{ $volume->name }}" class="btn btn-default">back</a>
+                @mixin('imagesIndexButtons')
+            </span>
+        </h2>
+    </div>
+    <div class="row">
+        <div class="col-sm-6 col-lg-4">
+            <div class="panel panel-default panel-image">
+                <img src="{{ $video->thumbnail_url }}" onerror="this.src='{{ asset(config('thumbnails.empty_url')) }}'">
+            </div>
+            @include('volumes.videos.index.meta')
+        </div>
+    </div>
+</div>
+@endsection
+
+@section('navbar')
+<div class="navbar-text navbar-volumes-breadcrumbs">
+    @include('volumes.partials.projectsBreadcrumb', ['projects' => $volume->projects]) /
+    <a href="{{route('volume', $volume->id)}}" class="navbar-link" title="Show volume {{$volume->name}}">{{$volume->name}}</a> /
+    <strong title="{{$video->filename}}">{{$video->filename}}</strong>
+    @include('volumes.partials.annotationSessionIndicator')
+</div>
+@endsection
diff --git a/resources/views/volumes/videos/index/meta.blade.php b/resources/views/volumes/videos/index/meta.blade.php
new file mode 100644
index 000000000..bb11edc14
--- /dev/null
+++ b/resources/views/volumes/videos/index/meta.blade.php
@@ -0,0 +1,68 @@
+@push('scripts')
+   <script type="text/javascript">
+        biigle.$declare('videos.times', {!! collect($video->taken_at) !!});
+        biigle.$declare('videos.metadata', {!! collect($video->metadata) !!});
+        biigle.$declare('videos.metadataMap', {!! collect($metadataMap) !!});
+   </script>
+@endpush
+
+<div id="video-metadata-modal" class="panel panel-default">
+    <div class="panel-heading">
+        <h3 class="panel-title">Video information</h3>
+    </div>
+    <table class="table">
+        @if ($video->width && $video->height)
+            <tr>
+                <th>Dimensions</th>
+                <td>{{ $video->width }} &times; {{ $video->height }} px </td>
+            </tr>
+        @endif
+        @if ($video->size)
+            <tr>
+                <th>Size</th>
+                <td>{{ round($video->size / 1E+6, 2) }} MBytes </td>
+            </tr>
+        @endif
+        @if ($video->mimetype)
+            <tr>
+                <th>MIME</th>
+                <td><code>{{ $video->mimetype }}</code></td>
+            </tr>
+        @endif
+        @if ($video->taken_at)
+            @if (is_array($video->taken_at))
+                <metadata-modal v-bind:show-modal="showModal" v-bind:times="times" v-bind:items="items" v-bind:name="name" v-on:close-modal="hideMetadataModal"></metadata-modal>
+                <tr>
+                    <th>
+                        <a href="#" v-on:click.prevent="showTimes()">Created</a>
+                    </th>
+                    <td></td>
+                </tr>
+                @foreach ($metadata as $field => $value)
+                    <tr>
+                    @if (is_array($value))
+                        <th>
+                            <a href="#" v-on:click.prevent="showMetadata({{ json_encode($field) }})">{{ $metadataMap[$field] }}</a>
+                        </th>
+                        <td></td>
+                    @else
+                        <th>{{ $metadataMap[$field] }}</th>
+                        <td>{{ $value }}</td>
+                    @endif
+                    </tr>
+                @endforeach
+            @else
+                <tr>
+                    <th>Created</th>
+                    <td>{{ $video->taken_at }}</td>
+                </tr>
+                @foreach ($metadata as $field => $value)
+                    <tr>
+                        <th>{{ $metadataMap[$field] }}</th>
+                        <td>{{ $value }}</td>
+                    </tr>
+                @endforeach
+            @endif
+        @endif
+    </table>
+</div>
diff --git a/routes/web.php b/routes/web.php
index 6ba88def7..60149a7cd 100644
--- a/routes/web.php
+++ b/routes/web.php
@@ -343,9 +343,14 @@
         $router->redirect('annotations/{id}', '/image-annotations/{id}');
     });
 
+    $router->get('videos/{id}', [
+        'as'   => 'video',
+        'uses' => 'Volumes\VideoController@index',
+    ]);
+
     $router->group(['namespace' => 'Videos'], function ($router) {
         $router->get('videos/{id}/annotations', [
-            'as' => 'video',
+            'as' => 'video-annotate',
             'uses' => 'VideoController@show',
         ]);
 
@@ -353,9 +358,6 @@
             'as'   => 'show-video-annotation',
             'uses' => 'VideoAnnotationController@show',
         ]);
-
-        // Legacy support.
-        $router->redirect('videos/{id}', '/videos/{id}/annotations');
     });
 
 });
diff --git a/tests/php/Http/Controllers/Api/VideoAnnotationControllerTest.php b/tests/php/Http/Controllers/Api/VideoAnnotationControllerTest.php
index c23d1e1be..43e67851c 100644
--- a/tests/php/Http/Controllers/Api/VideoAnnotationControllerTest.php
+++ b/tests/php/Http/Controllers/Api/VideoAnnotationControllerTest.php
@@ -356,6 +356,19 @@ public function testStoreValidatePointsArray()
             ->assertStatus(422);
     }
 
+    public function testStoreValidatePointsArray2()
+    {
+        $this->beEditor();
+        $this
+            ->postJson("/api/v1/videos/{$this->video->id}/annotations", [
+                'shape_id' => Shape::pointId(),
+                'label_id' => $this->labelRoot()->id,
+                'points' => [[[10, 11]]],
+                'frames' => [0.0],
+            ])
+            ->assertStatus(422);
+    }
+
     public function testStoreValidateFrames()
     {
         $this->beEditor();
diff --git a/tests/php/Http/Controllers/Views/Videos/VideoControllerTest.php b/tests/php/Http/Controllers/Views/Videos/VideoControllerTest.php
index 7ff4e9619..714675547 100644
--- a/tests/php/Http/Controllers/Views/Videos/VideoControllerTest.php
+++ b/tests/php/Http/Controllers/Views/Videos/VideoControllerTest.php
@@ -20,10 +20,4 @@ public function testShow()
         $this->beGuest();
         $this->get("videos/{$video->id}/annotations")->assertStatus(200);
     }
-
-    public function testShowRedirect()
-    {
-        $this->beUser();
-        $this->get('videos/999')->assertRedirect('/videos/999/annotations');
-    }
 }
diff --git a/tests/php/Http/Controllers/Views/Volumes/VideoInfoControllerTest.php b/tests/php/Http/Controllers/Views/Volumes/VideoInfoControllerTest.php
new file mode 100644
index 000000000..b35a946b8
--- /dev/null
+++ b/tests/php/Http/Controllers/Views/Volumes/VideoInfoControllerTest.php
@@ -0,0 +1,36 @@
+<?php
+
+namespace Biigle\Tests\Http\Controllers\Views\Volumes;
+
+use Biigle\Tests\ProjectTest;
+use Biigle\Tests\UserTest;
+use Biigle\Tests\VideoTest;
+use TestCase;
+
+class VideoInfoControllerTest extends TestCase
+{
+    public function testIndex()
+    {
+        $project = ProjectTest::create();
+        $user = UserTest::create();
+        $video = VideoTest::create();
+        $project->addVolumeId($video->volume->id);
+
+        // not logged in
+        $response = $this->get('videos/'.$video->id);
+        $response->assertStatus(302);
+
+        // doesn't belong to project
+        $this->be($user);
+        $response = $this->get('videos/'.$video->id);
+        $response->assertStatus(403);
+
+        $this->be($project->creator);
+        $response = $this->get('videos/'.$video->id);
+        $response->assertStatus(200);
+
+        // doesn't exist
+        $response = $this->get('videos/-1');
+        $response->assertStatus(404);
+    }
+}