Started search interface, Added in vue and moved fonts

resources/assets/js/global.js

@@ -1,12 +1,5 @@
 "use strict";
 
-// AngularJS - Create application and load components
-import angular from "angular";
-import "angular-resource";
-import "angular-animate";
-import "angular-sanitize";
-import "angular-ui-sortable";
-
 // Url retrieval function
 window.baseUrl = function(path) {
     let basePath = document.querySelector('meta[name="base-url"]').getAttribute('content');
@@ -15,6 +8,28 @@ window.baseUrl = function(path) {
     return basePath + '/' + path;
 };
 
+// Vue and axios setup
+import vue from "vue/dist/vue.common";
+import axios from "axios";
+
+let axiosInstance = axios.create({
+    headers: {
+        'X-CSRF-TOKEN': document.querySelector('meta[name=token]').getAttribute('content'),
+        'baseURL': baseUrl('')
+    }
+});
+
+window.Vue = vue;
+window.axios = axiosInstance;
+Vue.prototype.$http = axiosInstance;
+
+// AngularJS - Create application and load components
+import angular from "angular";
+import "angular-resource";
+import "angular-animate";
+import "angular-sanitize";
+import "angular-ui-sortable";
+
 let ngApp = angular.module('bookStack', ['ngResource', 'ngAnimate', 'ngSanitize', 'ui.sortable']);
 
 // Translation setup
@@ -47,6 +62,7 @@ class EventManager {
 }
 
 window.Events = new EventManager();
+Vue.prototype.$events = window.Events;
 
 // Load in angular specific items
 import Services from './services';

resources/assets/js/vues/search.js

@@ -0,0 +1,66 @@
+
+let termString = document.querySelector('[name=searchTerm]').value;
+let terms = termString.split(' ');
+
+let data = {
+    terms: terms,
+        termString : termString,
+        search: {
+        type: {
+            page: true,
+            chapter: true,
+            book: true
+        }
+    }
+};
+
+let computed = {
+
+};
+
+let methods = {
+
+    appendTerm(term) {
+        if (this.termString.slice(-1) !== " ") this.termString += ' ';
+        this.termString += term;
+    },
+
+    typeParse(searchString) {
+        let typeFilter = /{\s?type:\s?(.*?)\s?}/;
+        let match = searchString.match(typeFilter);
+        let type = this.search.type;
+        if (!match) {
+            type.page = type.book = type.chapter = true;
+            return;
+        }
+        let splitTypes = match[1].replace(/ /g, '').split('|');
+        type.page = (splitTypes.indexOf('page') !== -1);
+        type.chapter = (splitTypes.indexOf('chapter') !== -1);
+        type.book = (splitTypes.indexOf('book') !== -1);
+    },
+
+    typeChange() {
+        let typeFilter = /{\s?type:\s?(.*?)\s?}/;
+        let type = this.search.type;
+        if (type.page === type.chapter && type.page === type.book) {
+            this.termString = this.termString.replace(typeFilter, '');
+            return;
+        }
+        let selectedTypes = Object.keys(type).filter(type => {return this.search.type[type];}).join('|');
+        let typeTerm = '{type:'+selectedTypes+'}';
+        if (this.termString.match(typeFilter)) {
+            this.termString = this.termString.replace(typeFilter, typeTerm);
+            return;
+        }
+        this.appendTerm(typeTerm);
+    }
+
+};
+
+function created() {
+    this.typeParse(this.termString);
+}
+
+module.exports = {
+    data, computed, methods, created
+};

resources/assets/js/vues/vues.js

@@ -0,0 +1,16 @@
+
+function exists(id) {
+    return document.getElementById(id) !== null;
+}
+
+let vueMapping = {
+    'search-system': require('./search')
+};
+
+Object.keys(vueMapping).forEach(id => {
+    if (exists(id)) {
+        let config = vueMapping[id];
+        config.el = '#' + id;
+        new Vue(config);
+    }
+});