BookStack Code Mirror - bookstack/blob - resources/assets/js/index.js

   1 import "babel-polyfill"
   2 import "./dom-polyfills"
   3 import "./pages/page-show"
   4 import Translations from "./translations"
   5 import vues from "./vues/vues"
   6 import components from "./components"
   7
   8 import Vue from "vue"
   9 import axios from "axios"
  10
  11 // Url retrieval function
  12 window.baseUrl = function(path) {
  13     let basePath = document.querySelector('meta[name="base-url"]').getAttribute('content');
  14     if (basePath[basePath.length-1] === '/') basePath = basePath.slice(0, basePath.length-1);
  15     if (path[0] === '/') path = path.slice(1);
  16     return basePath + '/' + path;
  17 };
  18
  19 // Global Event System
  20 class EventManager {
  21     constructor() {
  22         this.listeners = {};
  23         this.stack = [];
  24     }
  25
  26     emit(eventName, eventData) {
  27         this.stack.push({name: eventName, data: eventData});
  28         if (typeof this.listeners[eventName] === 'undefined') return this;
  29         let eventsToStart = this.listeners[eventName];
  30         for (let i = 0; i < eventsToStart.length; i++) {
  31             let event = eventsToStart[i];
  32             event(eventData);
  33         }
  34         return this;
  35     }
  36
  37     listen(eventName, callback) {
  38         if (typeof this.listeners[eventName] === 'undefined') this.listeners[eventName] = [];
  39         this.listeners[eventName].push(callback);
  40         return this;
  41     }
  42 }
  43
  44 window.$events = new EventManager();
  45
  46 let axiosInstance = axios.create({
  47     headers: {
  48         'X-CSRF-TOKEN': document.querySelector('meta[name=token]').getAttribute('content'),
  49         'baseURL': window.baseUrl('')
  50     }
  51 });
  52 axiosInstance.interceptors.request.use(resp => {
  53     return resp;
  54 }, err => {
  55     if (typeof err.response === "undefined" || typeof err.response.data === "undefined") return Promise.reject(err);
  56     if (typeof err.response.data.error !== "undefined") window.$events.emit('error', err.response.data.error);
  57     if (typeof err.response.data.message !== "undefined") window.$events.emit('error', err.response.data.message);
  58 });
  59 window.$http = axiosInstance;
  60
  61 Vue.prototype.$http = axiosInstance;
  62 Vue.prototype.$events = window.$events;
  63
  64 // Translation setup
  65 // Creates a global function with name 'trans' to be used in the same way as Laravel's translation system
  66 let translator = new Translations(window.translations);
  67 window.trans = translator.get.bind(translator);
  68 window.trans_choice = translator.getPlural.bind(translator);
  69
  70 // Load vues and components
  71 vues();
  72 components();
  73
  74
  75 //Global jQuery Config & Extensions
  76
  77 /**
  78  * Scroll the view to a specific element.
  79  * @param {HTMLElement} element
  80  */
  81 window.scrollToElement = function(element) {
  82     if (!element) return;
  83     let offset = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
  84     let top = element.getBoundingClientRect().top + offset;
  85     $('html, body').animate({
  86         scrollTop: top - 60 // Adjust to change final scroll position top margin
  87     }, 300);
  88 };
  89
  90 /**
  91  * Scroll and highlight an element.
  92  * @param {HTMLElement} element
  93  */
  94 window.scrollAndHighlight = function(element) {
  95     if (!element) return;
  96     window.scrollToElement(element);
  97     let color = document.getElementById('custom-styles').getAttribute('data-color-light');
  98     let initColor = window.getComputedStyle(element).getPropertyValue('background-color');
  99     element.style.backgroundColor = color;
 100     setTimeout(() => {
 101         element.classList.add('selectFade');
 102         element.style.backgroundColor = initColor;
 103     }, 10);
 104     setTimeout(() => {
 105         element.classList.remove('selectFade');
 106         element.style.backgroundColor = '';
 107     }, 3000);
 108 };
 109
 110 // Smooth scrolling
 111 jQuery.fn.smoothScrollTo = function () {
 112     if (this.length === 0) return;
 113     window.scrollToElement(this[0]);
 114     return this;
 115 };
 116
 117 // Making contains text expression not worry about casing
 118 jQuery.expr[":"].contains = $.expr.createPseudo(function (arg) {
 119     return function (elem) {
 120         return $(elem).text().toUpperCase().indexOf(arg.toUpperCase()) >= 0;
 121     };
 122 });
 123
 124 // Detect IE for css
 125 if(navigator.userAgent.indexOf('MSIE')!==-1
 126     || navigator.appVersion.indexOf('Trident/') > 0
 127     || navigator.userAgent.indexOf('Safari') !== -1){
 128     document.body.classList.add('flexbox-support');
 129 }