Add logger function for page views

src/assets/js/logger.js

@@ -0,0 +1,26 @@
+import axios from 'axios'
+
+module.exports = function (route, resourceId) {
+	//In which case resourceId is really the username
+	if(route === 'userPosts' || route === 'userThreads') {
+		axios
+			.get('/api/v1/user/' + resourceId)
+			.then(res => {
+				return axios
+					.post('/api/v1/log', {
+						route,
+						resourceId: res.data.id
+					})
+			})
+			.catch(console.log)
+	} else {
+		axios
+			.post('/api/v1/log', {
+				route,
+				resourceId
+			})
+			.catch(console.log)
+	}
+
+
+}

src/components/ThreadPost.vue

@@ -16,7 +16,7 @@
 			@click.stop='toggleSelected'
 		></span>
 
-		<modal-window v-model='showShareModal'>
+		<modal-window v-model='showShareModal' @click.stop='() => {}'>
 			<div style='padding: 0rem 1rem 1rem 1rem;'>
 				<p>Copy this URL to share the post</p>
 				<fancy-input placeholder='Post URL' :value='postURL' width='100%'></fancy-input>
@@ -28,7 +28,10 @@
 
 		<div class='post__meta_data'>
 			<avatar-icon :user='post.User' class='post__avatar'></avatar-icon>
-			<div class='post__thread' v-if='showThread' @click.stop='goToThread'>{{post.Thread.name}}</div>
+			<div class='post__thread' v-if='showThread' @click.stop='goToThread'>
+				In thread <span class='post__thread__name'>{{post.Thread.name}}</span>
+				&nbsp;&middot;&nbsp;
+			</div>
 			<div class='post__user' v-else>{{username}}</div>
 			<replying-to
 				style='margin-right: 0.5rem;'
@@ -252,12 +255,15 @@
 			margin-right: 0.5rem;
 		}
 		@at-root #{&}__thread {
-			@include text($font--role-default, 1rem, 400);
-			margin-right: 0.5rem;
-			cursor: pointer;
+			color: $color__text--secondary;
+		
+			@at-root #{&}__name {
+				cursor: pointer;
+				@include text($font--role-default, 1rem, 600);
 
-			&:hover {
-				color: $color__darkgray--primary;
+				&:hover {
+					color: $color__darkgray--primary;
+				}
 			}
 		}
 		@at-root #{&}__date {

src/components/routes/Index.vue

@@ -77,6 +77,7 @@
 	import SelectOptions from '../SelectOptions'
 
 	import AjaxErrorHandler from '../../assets/js/errorHandler'
+	import logger from '../../assets/js/logger'
 
 	export default {
 		name: 'index',
@@ -230,6 +231,8 @@
 				this.$store.commit('setAccountTabs', 0)
 				this.$store.commit('setAccountModalState', true)
 			}
+
+			logger('index')
 		},
 		destroyed () {
 			socket.emit('leave', 'index')

src/components/routes/Search.vue

@@ -48,6 +48,7 @@
 	import ThreadPostPlaceholder from '../ThreadPostPlaceholder'
 
 	import AjaxErrorHandler from '../../assets/js/errorHandler'
+	import logger from '../../assets/js/logger'
 
 	export default {
 		name: 'Search',
@@ -123,6 +124,8 @@
 		mounted () {
 			this.$store.dispatch('setTitle', 'Search | ' + this.$route.params.q)
 			this.getResults()
+
+			logger('search')
 		}
 	}
 </script>

src/components/routes/SettingsAccount.vue

@@ -54,6 +54,7 @@
 	import ConfirmModal from '../ConfirmModal'
 
 	import AjaxErrorHandler from '../../assets/js/errorHandler'
+	import logger from '../../assets/js/logger'
 
 	export default {
 		name: 'settingsAccount',
@@ -140,6 +141,8 @@
 		},
 		mounted () {
 			this.$store.dispatch('setTitle', 'account settings')
+
+			logger('settingsAccount')
 		}
 	}
 </script>

src/components/routes/SettingsGeneral.vue

@@ -28,6 +28,7 @@
 	import LoadingButton from '../LoadingButton'
 
 	import AjaxErrorHandler from '../../assets/js/errorHandler'
+	import logger from '../../assets/js/logger'
 
 	export default {
 		name: 'settingsGeneral',
@@ -79,6 +80,8 @@
 						AjaxErrorHandler(this.$store)(e)
 					})
 			})
+
+			logger('settingsGeneral')
 		}
 	}
 </script>

src/components/routes/Thread.vue

@@ -128,6 +128,7 @@
 	import LoadingButton from '../LoadingButton'
 
 	import AjaxErrorHandler from '../../assets/js/errorHandler'
+	import logger from '../../assets/js/logger'
 
 	import throttle from 'lodash.throttle'
 
@@ -246,30 +247,32 @@
 				}
 			},
 			scrollTo (postNumber, cb) {
-				let getScrollTopPosition = i => {
-					let postTop = this.$refs.posts[i].$el.getBoundingClientRect().top
-					let header = this.$refs.title.getBoundingClientRect().height
-					
-					return window.pageYOffset + postTop - header - 32
-				}
+				this.$nextTick(() => {
+					let getScrollTopPosition = i => {
+						let postTop = this.$refs.posts[i].$el.getBoundingClientRect().top
+						let header = this.$refs.title.getBoundingClientRect().height
+						
+						return window.pageYOffset + postTop - header - 32
+					}
 
-				let scroll = (i) => {
-					let post = this.posts[i]
-					window.scrollTo(0, getScrollTopPosition(i))
-					if(cb) cb(i, post)
-				}
+					let scroll = (i) => {
+						let post = this.posts[i]
+						window.scrollTo(0, getScrollTopPosition(i))
+						if(cb) cb(i, post)
+					}
 
-				for(var i = 0; i < this.posts.length; i++) {
-					if(this.posts[i].postNumber === postNumber) {
-						if(this.$refs.posts) {
-							scroll(i)
-						} else {
-							this.$nextTick(_ => scroll(i))
-						}
+					for(var i = 0; i < this.posts.length; i++) {
+						if(this.posts[i].postNumber === postNumber) {
+							if(this.$refs.posts) {
+								scroll(i)
+							} else {
+								this.$nextTick(_ => scroll(i))
+							}
 
-						break;
+							break;
+						}
 					}
-				}
+				})
 			},
 			highlightPost (postNumber) {
 				this.scrollTo(postNumber, (i) => {
@@ -340,6 +343,8 @@
 				this.showPostNotification(post)
 				this.$store.dispatch('loadNewPostsSinceLoad', post)
 			})
+
+			logger('thread', this.$route.params.id)
 		},
 		destroyed () {
 			socket.emit('leave', 'thread/' + this.$route.params.id)

src/components/routes/ThreadNew.vue

@@ -45,6 +45,7 @@
 	import LoadingButton from '../LoadingButton'
 
 	import AjaxErrorHandler from '../../assets/js/errorHandler'
+	import logger from '../../assets/js/logger'
 	
 	export default {
 		name: 'ThreadNew',
@@ -129,6 +130,7 @@
 		},
 		mounted () {
 			this.$store.dispatch('setTitle', 'new thread')
+			logger('threadNew')
 		},
 		beforeRouteEnter (to, from, next) {
 			next(vm => {

src/components/routes/UserPosts.vue

@@ -34,6 +34,7 @@
 	import ThreadPostPlaceholder from '../ThreadPostPlaceholder'
 
 	import AjaxErrorHandler from '../../assets/js/errorHandler'
+	import logger from '../../assets/js/logger'
 
 	export default {
 		name: 'user',
@@ -90,6 +91,8 @@
 					this.nextPostsCount = res.data.meta.nextPostsCount
 				})
 				.catch(AjaxErrorHandler(this.$store))
+
+			logger('userPosts', this.$route.params.username)
 		}
 	}
 </script>

src/components/routes/UserThreads.vue

@@ -32,6 +32,7 @@
 	import ThreadDisplayPlaceholder from '../ThreadDisplayPlaceholder'
 
 	import AjaxErrorHandler from '../../assets/js/errorHandler'
+	import logger from '../../assets/js/logger'
 
 	export default {
 		name: 'userThreads',
@@ -84,6 +85,8 @@
 					this.nextThreadsCount = res.data.meta.nextThreadsCount
 				})
 				.catch(AjaxErrorHandler(this.$store))
+
+			logger('userThreads', this.$route.params.username)
 		}
 	}
 </script>