From 04fb039ab6e840515fa0c306efa1f99944036abc Mon Sep 17 00:00:00 2001
From: Michael Mayer <michael@liquidbytes.net>
Date: Fri, 3 Aug 2018 15:17:13 +0200
Subject: [PATCH] Implemented navigation

---
 .gitignore                                    |   1 +
 config.example.yml                            |   2 +-
 frontend/css/alerts.css                       |  26 +++---
 frontend/css/app.css                          |  80 ++++++++++++------
 frontend/package.json                         |  10 ++-
 frontend/src/app/pages/albums.vue             |  36 ++++++++
 frontend/src/app/pages/export.vue             |  36 ++++++++
 frontend/src/app/pages/import.vue             |  36 ++++++++
 .../src/app/pages/{welcome.vue => photos.vue} |  19 +----
 frontend/src/app/pages/settings.vue           |  52 ++++++++++++
 frontend/src/app/routes.js                    |  16 +++-
 frontend/src/component/app-navigation.vue     |  25 ++----
 frontend/yarn.lock                            |  27 ++++++
 indexer.go                                    |   8 +-
 photo.go                                      |   4 +-
 server/assets/favicon.ico                     | Bin 1406 -> 1150 bytes
 server/assets/img/logo.png                    | Bin 0 -> 5409 bytes
 server/server.go                              |  21 +++++
 server/templates/index.tmpl                   |  20 ++++-
 tag.go                                        |   2 +-
 20 files changed, 331 insertions(+), 90 deletions(-)
 create mode 100644 frontend/src/app/pages/albums.vue
 create mode 100644 frontend/src/app/pages/export.vue
 create mode 100644 frontend/src/app/pages/import.vue
 rename frontend/src/app/pages/{welcome.vue => photos.vue} (58%)
 create mode 100644 frontend/src/app/pages/settings.vue
 create mode 100644 server/assets/img/logo.png

diff --git a/.gitignore b/.gitignore
index 2d6862c3d..45622e2c6 100644
--- a/.gitignore
+++ b/.gitignore
@@ -36,5 +36,6 @@ Thumbs.db
 .settings
 .swp
 .tmp
+/photos/
 /vendor/
 node_modules/
\ No newline at end of file
diff --git a/config.example.yml b/config.example.yml
index 582a89aa0..ccf0d0013 100644
--- a/config.example.yml
+++ b/config.example.yml
@@ -1,4 +1,4 @@
-darktable-cli: /Applications/darktable.app/Contents/MacOS/darktable-cli
+darktable-cli: /usr/bin/darktable-cli
 originals-path: photos/originals
 thumbnails-path: photos/thumbnails
 import-path: photos/import
diff --git a/frontend/css/alerts.css b/frontend/css/alerts.css
index c872b5f79..2c259013a 100644
--- a/frontend/css/alerts.css
+++ b/frontend/css/alerts.css
@@ -1,50 +1,50 @@
 #alerts {
     position: fixed;
     z-index: 1051;
-    left: 20%;
-    top: 10px;
-    right: 20%;
+    top: 50px;
+    left: 0;
+    right: 0;
     height: auto;
     display: block;
+    opacity: 0.7;
 }
 
 #alerts .success {
-    background-color: #71D774;
+    background-color: #c8e5ff;
 }
 
 #alerts .success:after {
 }
 
 #alerts .error {
-    background-color: #FF5A5A;
+    background-color: #ffcaca;
 }
 
 #alerts .error:before {
 }
 
 #alerts .warning {
-    background-color: #FCBD39;
+    background-color: #ffedc1;
 }
 
 #alerts .warning:before {
 }
 
 #alerts .info {
-    color: #49AFF5;
-    background-color: #49AFF5;
+    background-color: #feffb8;
 }
 
 #alerts .alert {
-    color: #FFF;
+    color: #333;
     display: block;
     left: 0;
     right: 0;
-    min-height: 14px;
-    padding: 8px 10px 8px 10px;
-    font-size: 14px;
+    min-height: 13px;
+    padding: 4px 10px 4px 10px;
+    font-size: 13px;
     font-weight: bold;
     opacity: 1;
-    border-radius: 0;
+    border-radius: 0px;
     margin: 1px 0 0 0;
 }
 
diff --git a/frontend/css/app.css b/frontend/css/app.css
index 8f5ebefe2..c8722db8d 100644
--- a/frontend/css/app.css
+++ b/frontend/css/app.css
@@ -19,36 +19,66 @@
     background-color: rgba(0,0,0,0.2);
 }
 
+body {
+    background: #333333;
+    color: rgba(255,255,255,0.9);
+}
 
 main {
-    margin: 10px 20px;
-}
-/*
-nav {
-    background-color: #616161;
+    padding: 0;
+    margin: 0;
 }
 
-nav a:hover {
-    text-decoration: none !important;
-    color: rgba(255, 255, 255, .87) !important;
+main div.page {
+    padding: 2rem;
 }
 
-nav a {
-    font-size: 14px;
-    font-weight: bold !important;
-    text-transform: uppercase;
-    display: inline-block;
-    text-align: center;
-    width: 120px;
-    background: #616161;
-    padding: 10px;
-    text-decoration: none;
-    border-bottom: 3px solid #616161;
-    color: rgba(255, 255, 255, .54) !important;
+.navbar {
+    padding: 3px 2rem 3px 2rem;
+    background: black !important;
 }
 
-nav a.router-link-active {
-    font-weight: bold !important;
-    border-bottom: 3px solid #E64A19;
-    color: rgba(255, 255, 255, .87) !important;
-}*/
\ No newline at end of file
+.navbar .nav-item-photos .nav-link.active,
+.navbar .nav-item-photos .nav-link:hover {
+    color: #c8e5ff;
+}
+
+main div.page-photos {
+    border-top: 2px solid #c8e5ff;
+}
+
+.navbar .nav-item-albums .nav-link.active,
+.navbar .nav-item-albums .nav-link:hover {
+    color: #c4ffcb;
+}
+
+main div.page-albums {
+    border-top: 2px solid #c4ffcb;
+}
+
+.navbar .nav-item-import .nav-link.active,
+.navbar .nav-item-import .nav-link:hover {
+    color: #feffb8;
+}
+
+main div.page-import {
+    border-top: 2px solid #feffb8;
+}
+
+.navbar .nav-item-export .nav-link.active,
+.navbar .nav-item-export .nav-link:hover {
+    color: #ffedc1;
+}
+
+main div.page-export {
+    border-top: 2px solid #ffedc1;
+}
+
+.navbar .nav-item-settings .nav-link.active,
+.navbar .nav-item-settings .nav-link:hover {
+    color: #f5c5c5;
+}
+
+main div.page-settings {
+    border-top: 2px solid #f5c5c5;
+}
\ No newline at end of file
diff --git a/frontend/package.json b/frontend/package.json
index fb8db75bf..c3f7a97ba 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -15,7 +15,9 @@
     "axios-mock-adapter": "^1.8.1",
     "chart.js": "^2.5.0",
     "font-awesome": "^4.7.0",
+    "justified-gallery": "^0.1.0",
     "vue": "^2.4.4",
+    "vue-justified-layout": "^0.1.0",
     "vue-router": "^2.7.0",
     "vue-template-compiler": "^2.4.4"
   },
@@ -31,16 +33,14 @@
     "babel-preset-es2015": "^6.24.1",
     "babel-preset-stage-2": "^6.22.0",
     "babel-register": "^6.22.0",
-    "bootstrap-vue": "^2.0.0-rc.11",
     "bootstrap": "^4.1.3",
+    "bootstrap-vue": "^2.0.0-rc.11",
     "chai": "^3.5.0",
     "chalk": "^1.1.3",
     "connect-history-api-fallback": "^1.3.0",
     "copy-webpack-plugin": "^4.0.1",
     "cross-env": "^3.1.4",
     "css-loader": "^0.28.11",
-    "node-sass": "^4.9.2",
-    "sass-loader": "^7.0.3",
     "eslint": "^3.14.1",
     "eslint-config-standard": "^6.2.1",
     "eslint-friendly-formatter": "^2.0.7",
@@ -65,11 +65,13 @@
     "karma-webpack": "^2.0.3",
     "lodash": "^4.17.4",
     "mocha": "^3.3.0",
+    "node-sass": "^4.9.2",
     "optimize-css-assets-webpack-plugin": "^1.3.0",
     "ora": "^1.1.0",
     "phantomjs-prebuilt": "^2.1.14",
     "pluralize": "^4.0.0",
     "pubsub-js": "^1.5.6",
+    "sass-loader": "^7.0.3",
     "style-loader": "^0.16.1",
     "svg-url-loader": "^2.0.2",
     "url-loader": "^0.5.8",
@@ -91,4 +93,4 @@
     "last 2 versions",
     "not ie <= 8"
   ]
-}
\ No newline at end of file
+}
diff --git a/frontend/src/app/pages/albums.vue b/frontend/src/app/pages/albums.vue
new file mode 100644
index 000000000..96aa4459e
--- /dev/null
+++ b/frontend/src/app/pages/albums.vue
@@ -0,0 +1,36 @@
+<template>
+    <div class="page page-albums">
+        <h1 class="md-display-1">Albums</h1>
+        <p class="md-subheading">
+            A user-friendly tool for importing, filtering and archiving large amounts of JPEG and RAW files
+        </p>
+    </div>
+</template>
+
+<script>
+    export default {
+        name: 'browse',
+        data() {
+            return {
+            };
+        },
+        methods: {
+        }
+    };
+</script>
+
+<style scoped>
+    h1, h2 {
+        font-weight: normal;
+    }
+
+    ul {
+        list-style-type: none;
+        padding: 0;
+    }
+
+    li {
+        display: inline-block;
+        margin: 0 10px;
+    }
+</style>
diff --git a/frontend/src/app/pages/export.vue b/frontend/src/app/pages/export.vue
new file mode 100644
index 000000000..32740e905
--- /dev/null
+++ b/frontend/src/app/pages/export.vue
@@ -0,0 +1,36 @@
+<template>
+    <div class="page page-export">
+        <h1 class="md-display-1">Export</h1>
+        <p class="md-subheading">
+            A user-friendly tool for importing, filtering and archiving large amounts of JPEG and RAW files
+        </p>
+    </div>
+</template>
+
+<script>
+    export default {
+        name: 'browse',
+        data() {
+            return {
+            };
+        },
+        methods: {
+        }
+    };
+</script>
+
+<style scoped>
+    h1, h2 {
+        font-weight: normal;
+    }
+
+    ul {
+        list-style-type: none;
+        padding: 0;
+    }
+
+    li {
+        display: inline-block;
+        margin: 0 10px;
+    }
+</style>
diff --git a/frontend/src/app/pages/import.vue b/frontend/src/app/pages/import.vue
new file mode 100644
index 000000000..e6948e7ba
--- /dev/null
+++ b/frontend/src/app/pages/import.vue
@@ -0,0 +1,36 @@
+<template>
+    <div class="page page-import">
+        <h1>Import</h1>
+        <p class="md-subheading">
+            A user-friendly tool for importing, filtering and archiving large amounts of JPEG and RAW files
+        </p>
+    </div>
+</template>
+
+<script>
+    export default {
+        name: 'import',
+        data() {
+            return {
+            };
+        },
+        methods: {
+        }
+    };
+</script>
+
+<style scoped>
+    h1, h2 {
+        font-weight: normal;
+    }
+
+    ul {
+        list-style-type: none;
+        padding: 0;
+    }
+
+    li {
+        display: inline-block;
+        margin: 0 10px;
+    }
+</style>
diff --git a/frontend/src/app/pages/welcome.vue b/frontend/src/app/pages/photos.vue
similarity index 58%
rename from frontend/src/app/pages/welcome.vue
rename to frontend/src/app/pages/photos.vue
index 64a7e8f71..1329d62d2 100644
--- a/frontend/src/app/pages/welcome.vue
+++ b/frontend/src/app/pages/photos.vue
@@ -1,7 +1,5 @@
 <template>
-
-
-    <div class="dashboard">
+    <div class="page page-photos">
         <h1 class="md-display-1">Welcome to PhotoPrism</h1>
         <p class="md-subheading">
             A user-friendly tool for importing, filtering and archiving large amounts of JPEG and RAW files
@@ -11,25 +9,12 @@
 
 <script>
     export default {
-        name: 'dashboard',
+        name: 'photos',
         data() {
             return {
-                msg: 'Welcome to PhotoPrism',
-                username: this.$session.getFullName(),
             };
         },
         methods: {
-            open() {
-                this.$refs.snackbar.open();
-            },
-
-            showNotification() {
-                this.$alert.success('Yeah wuwuwu');
-            },
-
-            logout() {
-                this.$session.logout();
-            },
         }
     };
 </script>
diff --git a/frontend/src/app/pages/settings.vue b/frontend/src/app/pages/settings.vue
new file mode 100644
index 000000000..4c406c5f8
--- /dev/null
+++ b/frontend/src/app/pages/settings.vue
@@ -0,0 +1,52 @@
+<template>
+    <div class="page page-settings">
+        <h1 class="md-display-1">Settings</h1>
+        <p class="md-subheading">
+
+        </p>
+        <button v-on:click="showSuccess()">Show Success</button>
+        <button v-on:click="showInfo()">Show Info</button>
+        <button v-on:click="showError()">Show Error</button>
+        <button v-on:click="showWarning()">Show Warning</button>
+    </div>
+</template>
+
+<script>
+    export default {
+        name: 'dashboard',
+        data() {
+            return {
+            };
+        },
+        methods: {
+            showSuccess() {
+                this.$alert.success('Action successfully completed');
+            },
+            showInfo() {
+                this.$alert.info('This is an info');
+            },
+            showError() {
+                this.$alert.error('An error has occurred - please check logs');
+            },
+            showWarning() {
+                this.$alert.warning('This is a warning');
+            },
+        }
+    };
+</script>
+
+<style scoped>
+    h1, h2 {
+        font-weight: normal;
+    }
+
+    ul {
+        list-style-type: none;
+        padding: 0;
+    }
+
+    li {
+        display: inline-block;
+        margin: 0 10px;
+    }
+</style>
diff --git a/frontend/src/app/routes.js b/frontend/src/app/routes.js
index 8ea298e61..bd3c75164 100644
--- a/frontend/src/app/routes.js
+++ b/frontend/src/app/routes.js
@@ -1,7 +1,15 @@
-import Welcome from 'app/pages/welcome.vue';
+import Photos from 'app/pages/photos.vue';
+import Albums from 'app/pages/albums.vue';
+import Import from 'app/pages/Import.vue';
+import Export from 'app/pages/Export.vue';
+import Settings from 'app/pages/settings.vue';
 
 export default [
-    { path: '/', redirect: '/welcome' },
-    { path: '/welcome', component: Welcome },
-    { path: '*', redirect: '/welcome' },
+    { path: '/', redirect: '/photos' },
+    { path: '/photos', component: Photos },
+    { path: '/albums', component: Albums },
+    { path: '/import', component: Import },
+    { path: '/export', component: Export },
+    { path: '/settings', component: Settings },
+    { path: '*', redirect: '/photos' },
 ];
diff --git a/frontend/src/component/app-navigation.vue b/frontend/src/component/app-navigation.vue
index 287fc0ef0..971c3eb45 100644
--- a/frontend/src/component/app-navigation.vue
+++ b/frontend/src/component/app-navigation.vue
@@ -4,14 +4,16 @@
 
             <b-navbar-toggle target="nav_collapse"></b-navbar-toggle>
 
-            <b-navbar-brand href="#">PhotoPrism</b-navbar-brand>
+            <b-navbar-brand href="/"><img src="/assets/img/logo.png" alt="PhotoPrism"></b-navbar-brand>
 
             <b-collapse is-nav id="nav_collapse">
 
                 <b-navbar-nav>
-                    <b-nav-item href="#">Browse</b-nav-item>
-                    <b-nav-item href="#">Import</b-nav-item>
-                    <b-nav-item href="#">Export</b-nav-item>
+                    <b-nav-item to="/photos" class="nav-item-photos">Photos</b-nav-item>
+                    <b-nav-item to="/albums" class="nav-item-albums">Albums</b-nav-item>
+                    <b-nav-item to="/import" class="nav-item-import">Import</b-nav-item>
+                    <b-nav-item to="/export" class="nav-item-export">Export</b-nav-item>
+                    <b-nav-item to="/settings" class="nav-item-settings">Settings</b-nav-item>
                 </b-navbar-nav>
 
                 <!-- Right aligned nav items -->
@@ -22,21 +24,6 @@
                         <b-button size="sm" class="my-2 my-sm-0" type="submit">Search</b-button>
                     </b-nav-form>
 
-                    <b-nav-item-dropdown text="Lang" right>
-                        <b-dropdown-item href="#">EN</b-dropdown-item>
-                        <b-dropdown-item href="#">ES</b-dropdown-item>
-                        <b-dropdown-item href="#">RU</b-dropdown-item>
-                        <b-dropdown-item href="#">FA</b-dropdown-item>
-                    </b-nav-item-dropdown>
-
-                    <b-nav-item-dropdown right>
-                        <!-- Using button-content slot -->
-                        <template slot="button-content">
-                            User
-                        </template>
-                        <b-dropdown-item href="#">Profile</b-dropdown-item>
-                        <b-dropdown-item href="#">Signout</b-dropdown-item>
-                    </b-nav-item-dropdown>
                 </b-navbar-nav>
 
             </b-collapse>
diff --git a/frontend/yarn.lock b/frontend/yarn.lock
index 62369958f..35afb3124 100644
--- a/frontend/yarn.lock
+++ b/frontend/yarn.lock
@@ -3917,6 +3917,10 @@ istanbul-lib-instrument@^1.4.2:
     istanbul-lib-coverage "^1.2.0"
     semver "^5.3.0"
 
+jquery@^3.1.0:
+  version "3.3.1"
+  resolved "https://registry.yarnpkg.com/jquery/-/jquery-3.3.1.tgz#958ce29e81c9790f31be7792df5d4d95fc57fbca"
+
 js-base64@^2.1.8, js-base64@^2.1.9:
   version "2.4.8"
   resolved "https://registry.yarnpkg.com/js-base64/-/js-base64-2.4.8.tgz#57a9b130888f956834aa40c5b165ba59c758f033"
@@ -4021,6 +4025,18 @@ jsprim@^1.2.2:
     json-schema "0.2.3"
     verror "1.10.0"
 
+justified-gallery@^0.1.0:
+  version "0.1.0"
+  resolved "https://registry.yarnpkg.com/justified-gallery/-/justified-gallery-0.1.0.tgz#b4b861accd5641e47d223e649ea493bf05dc2794"
+  dependencies:
+    jquery "^3.1.0"
+
+justified-layout@^2.1.1:
+  version "2.1.1"
+  resolved "https://registry.yarnpkg.com/justified-layout/-/justified-layout-2.1.1.tgz#22da0c296d3a95b7a3d5fb7f48dbbe0e6539b7f1"
+  dependencies:
+    merge "1.2.0"
+
 karma-chrome-launcher@^2.1.1:
   version "2.2.0"
   resolved "https://registry.yarnpkg.com/karma-chrome-launcher/-/karma-chrome-launcher-2.2.0.tgz#cf1b9d07136cc18fe239327d24654c3dbc368acf"
@@ -4427,6 +4443,10 @@ merge-descriptors@1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/merge-descriptors/-/merge-descriptors-1.0.1.tgz#b00aaa556dd8b44568150ec9d1b953f3f90cbb61"
 
+merge@1.2.0:
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/merge/-/merge-1.2.0.tgz#7531e39d4949c281a66b8c5a6e0265e8b05894da"
+
 methods@~1.1.2:
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/methods/-/methods-1.1.2.tgz#5529a4d67654134edcc5266656835b0f851afcee"
@@ -7057,6 +7077,13 @@ vue-hot-reload-api@^2.0.11:
   version "2.3.0"
   resolved "https://registry.yarnpkg.com/vue-hot-reload-api/-/vue-hot-reload-api-2.3.0.tgz#97976142405d13d8efae154749e88c4e358cf926"
 
+vue-justified-layout@^0.1.0:
+  version "0.1.0"
+  resolved "https://registry.yarnpkg.com/vue-justified-layout/-/vue-justified-layout-0.1.0.tgz#f26b606614719697aeff98f26b68795b926ae013"
+  dependencies:
+    justified-layout "^2.1.1"
+    vue "^2.4.4"
+
 vue-loader@^11.1.4:
   version "11.3.4"
   resolved "https://registry.yarnpkg.com/vue-loader/-/vue-loader-11.3.4.tgz#65e10a44ce092d906e14bbc72981dec99eb090d2"
diff --git a/indexer.go b/indexer.go
index 911ba56fb..d227f5c82 100644
--- a/indexer.go
+++ b/indexer.go
@@ -34,7 +34,13 @@ func (i *Indexer) GetImageTags(jpeg *MediaFile) (result []Tag) {
 
 		for _, tag := range tags {
 			if tag.Probability > 0.2 {
-				result = append(result, Tag{Label: tag.Label})
+				var tagModel Tag
+
+				if res := i.db.First(&tagModel, "label = ?", tag.Label); res.Error != nil {
+					tagModel.Label = tag.Label
+				}
+
+				result = append(result, tagModel)
 			}
 		}
 	}
diff --git a/photo.go b/photo.go
index 6b936ad54..2ec6287c4 100644
--- a/photo.go
+++ b/photo.go
@@ -6,9 +6,11 @@ import (
 
 type Photo struct {
 	gorm.Model
+	Title          string
+	Description    string  `gorm:"type:text;"`
 	CanonicalName  string
 	PerceptualHash string
-	Tags           []Tag `gorm:"many2many:photo_tags;"`
+	Tags           []Tag   `gorm:"many2many:photo_tags;"`
 	Files          []File
 	Albums         []Album `gorm:"many2many:album_photos;"`
 	Author         string
diff --git a/server/assets/favicon.ico b/server/assets/favicon.ico
index 5eac6cd54dab52ea8c762bd30b3a12cf33212ae3..0ce1d41288d734379aa2077ec204922d1e7eaab7 100644
GIT binary patch
literal 1150
zcmeIyF=_%q6o>H_NG)4gr?d{1N~(|(cmPdMtJDEc5Su^<IYAVytu15&ijX4J20elD
zf8an;zkEb;fmj7(nHhGLA1up!Yj(nwWyXAF-BYu&nN=8Uv9sT2G2>ZY+K-=mrjJE$
zJ)5+A{Cwe0qlUNhJ8#bK{i=BN%i_)J#i!Tazx@0$d9|PX;dbjUosAD}mOi|muJJp3
z-~%7{zz06?fe(D(10VRn2R`sSybka>`s4Te=jSIK@cxPOzru_DM1P_`(Vyr~^e6fg
X{fYiWf1*FppXg8YxBC4L{B`{Xb9&8L

literal 1406
zcmZQzU<5(|0R}M0U}azs1F|%L7$l?s#Ec9aKoZP=&`50MEwx}V<zsyeDl2js6wl3P
zP+649puD4rL9NGwL3K_ngYxl74DyF3Gw^jeGsqq3Vo=+f!=QAuk3s3w3<kyH(-~BD
zl`^Pr&1R50+RGqzYbS%^`GpKhhbJ;<FY#hfIx&Sow8@1*b#@Gc^7=9ct<_-+YE%4y
zY8Ei4?yg`^JUf>`quP)`WnVpm+Rjo2rPH$*RA)vo$X{5@pt3ZbLH@{O2E|je8I<;S
zGDuz9$e^^Zn?ZF?HPD?47?id(FsLlcW>7pfl|dfpezhsV2>*?;MnhmU1PF!zBUT`Z
zCd!S*S4HEa%d0D*C{Sc%H)chMaL6)BF*E4E1Ps{>7^U^aH02-y+M>K%jEn+WqH-c&
z0e*3igqj|of(nQ)&m#dAX3<dM6aurLgdmfVE;65yQCV09RR9a`|9=LCzi9XmkpIh`
jf#H)p1H&VJ28P4z3=GGCxWAc!;s0SE{s_cCH6RQCM~G!5

diff --git a/server/assets/img/logo.png b/server/assets/img/logo.png
new file mode 100644
index 0000000000000000000000000000000000000000..2e97f881e67fb8df21aba4aa26f18ff9b24eaf41
GIT binary patch
literal 5409
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

literal 0
HcmV?d00001

diff --git a/server/server.go b/server/server.go
index 0a4fb6159..24b0afee6 100644
--- a/server/server.go
+++ b/server/server.go
@@ -4,6 +4,7 @@ import (
 	"github.com/gin-gonic/gin"
 	"fmt"
 	"net/http"
+	"github.com/photoprism/photoprism"
 )
 
 func Start(address string, port int) {
@@ -14,11 +15,31 @@ func Start(address string, port int) {
 	router.StaticFile("/favicon.ico", "./server/assets/favicon.ico")
 	router.StaticFile("/robots.txt", "./server/assets/robots.txt")
 
+	// JSON-REST API Version 1
+	v1 := router.Group("/v1")
+	{
+		v1.GET("/photos", func(c *gin.Context) {
+
+			photos := []*photoprism.Photo{ &photoprism.Photo{Title: "Bar"}, &photoprism.Photo{ Title: "Foo" } }
+
+			c.JSON(http.StatusOK, photos)
+		})
+
+		v1.GET("/albums", func(c *gin.Context) {
+			c.JSON(http.StatusOK, gin.H{"status": "ok"})
+		})
+
+		v1.GET("/tags", func(c *gin.Context) {
+			c.JSON(http.StatusOK, gin.H{"status": "ok"})
+		})
+	}
+
 	router.Static("/assets", "./server/assets")
 
 	router.NoRoute(func(c *gin.Context) {
 		c.HTML(http.StatusOK, "index.tmpl", gin.H{
 			"title": "PhotoPrism",
+			"debug": true,
 		})
 	})
 
diff --git a/server/templates/index.tmpl b/server/templates/index.tmpl
index 9cdda4322..0646e038a 100644
--- a/server/templates/index.tmpl
+++ b/server/templates/index.tmpl
@@ -1,20 +1,32 @@
-<!doctype html>
-<html class="no-js" lang="">
+<!DOCTYPE html>
+<html lang="en">
 <head>
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
-    <title></title>
+    <title>{{ .title }}</title>
     <meta name="description" content="">
+    <meta name="author" content="">
     <meta name="viewport" content="width=device-width, initial-scale=1">
-    <link rel="apple-touch-icon" href="apple-touch-icon.png">
+    <link rel="apple-touch-icon" href="/apple-touch-icon.png">
+    <link rel="shortcut icon" href="/favicon.ico">
 
     <link rel="stylesheet" href="/assets/build/app.css">
+
+    <script>
+        window.appConfig = {
+            appName: "{{ .title }}",
+            appVersion: "1.0.0",
+            debug: {{ .debug }}
+        };
+    </script>
 </head>
 <body>
 <!--[if lt IE 8]>
 <p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
 <![endif]-->
 
+<div id="alerts"></div>
+
 <div id="app" class="container">
     <div class="loading">
         <img src="/assets/img/ajax-loader.gif">
diff --git a/tag.go b/tag.go
index c8022c93f..6a64a05fd 100644
--- a/tag.go
+++ b/tag.go
@@ -6,5 +6,5 @@ import (
 
 type Tag struct {
 	gorm.Model
-	Label string
+	Label string `gorm:"type:varchar(100);unique_index"`
 }