WebSocket server + Search index + indexable content parser

client/js/app.js

@@ -52,6 +52,32 @@ jQuery( document ).ready(function( $ ) {
 
 	}
 
+	// ====================================
+	// Establish WebSocket connection
+	// ====================================
+
+	var socket = io(ioHost);
+
+	var vueHeader = new Vue({
+		el: '#header-container',
+		data: {
+			searchq: '',
+			searchres: []
+		},
+		watch: {
+			searchq: (val, oldVal) => {
+				if(val.length >= 3) {
+					socket.emit('search', { terms: val }, (data) => {
+						vueHeader.$set('searchres', data);
+					});
+				}
+			}
+		},
+		methods: {
+			
+		}
+	});
+
 	// ====================================
 	// Pages logic
 	// ====================================

client/scss/layout/_content.scss

@@ -1,4 +1,12 @@
 
+#page-type-view > section {
+	transition: background-color .5s ease;
+
+	&.blurred {
+		background-color: $grey-lighter;
+	}
+
+}
 
 .sd-menus {
 

client/scss/layout/_header.scss

@@ -25,4 +25,15 @@ h2.nav-item {
 		opacity: 1;
 	}
 
+}
+
+.searchresults {
+	position: fixed;
+	top: 45px;
+	left: 0;
+	right: 0;
+	margin: 0 auto;
+	width: 500px;
+	z-index: 1;
+	//display: none;
 }