X-Git-Url: http://source.bookstackapp.com/bookstack/blobdiff_plain/08c4b9ac7c56ae34a350643da5d0fada2cbef2cc..refs/pull/261/head:/resources/assets/js/global.js diff --git a/resources/assets/js/global.js b/resources/assets/js/global.js index 0f2bbbf20..dc6802e12 100644 --- a/resources/assets/js/global.js +++ b/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,8 +8,36 @@ window.baseUrl = function(path) { return basePath + '/' + path; }; +const Vue = require("vue"); +const axios = require("axios"); + +let axiosInstance = axios.create({ + headers: { + 'X-CSRF-TOKEN': document.querySelector('meta[name=token]').getAttribute('content'), + 'baseURL': window.baseUrl('') + } +}); + +Vue.prototype.$http = axiosInstance; + +require("./vues/vues"); + + +// AngularJS - Create application and load components +const angular = require("angular"); +require("angular-resource"); +require("angular-animate"); +require("angular-sanitize"); +require("angular-ui-sortable"); + let ngApp = angular.module('bookStack', ['ngResource', 'ngAnimate', 'ngSanitize', 'ui.sortable']); +// Translation setup +// Creates a global function with name 'trans' to be used in the same way as Laravel's translation system +const Translations = require("./translations"); +let translator = new Translations(window.translations); +window.trans = translator.get.bind(translator); + // Global Event System class EventManager { constructor() { @@ -41,11 +62,12 @@ class EventManager { } window.Events = new EventManager(); +Vue.prototype.$events = window.Events; // Load in angular specific items -import Services from './services'; -import Directives from './directives'; -import Controllers from './controllers'; +const Services = require('./services'); +const Directives = require('./directives'); +const Controllers = require('./controllers'); Services(ngApp, window.Events); Directives(ngApp, window.Events); Controllers(ngApp, window.Events); @@ -55,10 +77,9 @@ Controllers(ngApp, window.Events); // Smooth scrolling jQuery.fn.smoothScrollTo = function () { if (this.length === 0) return; - let scrollElem = document.documentElement.scrollTop === 0 ? document.body : document.documentElement; - $(scrollElem).animate({ + $('html, body').animate({ scrollTop: this.offset().top - 60 // Adjust to change final scroll position top margin - }, 800); // Adjust to change animations speed (ms) + }, 300); // Adjust to change animations speed (ms) return this; }; @@ -70,93 +91,83 @@ jQuery.expr[":"].contains = $.expr.createPseudo(function (arg) { }); // Global jQuery Elements -$(function () { - - let notifications = $('.notification'); - let successNotification = notifications.filter('.pos'); - let errorNotification = notifications.filter('.neg'); - let warningNotification = notifications.filter('.warning'); - // Notification Events - window.Events.listen('success', function (text) { - successNotification.hide(); - successNotification.find('span').text(text); +let notifications = $('.notification'); +let successNotification = notifications.filter('.pos'); +let errorNotification = notifications.filter('.neg'); +let warningNotification = notifications.filter('.warning'); +// Notification Events +window.Events.listen('success', function (text) { + successNotification.hide(); + successNotification.find('span').text(text); + setTimeout(() => { + successNotification.show(); + }, 1); +}); +window.Events.listen('warning', function (text) { + warningNotification.find('span').text(text); + warningNotification.show(); +}); +window.Events.listen('error', function (text) { + errorNotification.find('span').text(text); + errorNotification.show(); +}); + +// Notification hiding +notifications.click(function () { + $(this).fadeOut(100); +}); + +// Chapter page list toggles +$('.chapter-toggle').click(function (e) { + e.preventDefault(); + $(this).toggleClass('open'); + $(this).closest('.chapter').find('.inset-list').slideToggle(180); +}); + +// Back to top button +$('#back-to-top').click(function() { + $('#header').smoothScrollTo(); +}); +let scrollTopShowing = false; +let scrollTop = document.getElementById('back-to-top'); +let scrollTopBreakpoint = 1200; +window.addEventListener('scroll', function() { + let scrollTopPos = document.documentElement.scrollTop || document.body.scrollTop || 0; + if (!scrollTopShowing && scrollTopPos > scrollTopBreakpoint) { + scrollTop.style.display = 'block'; + scrollTopShowing = true; setTimeout(() => { - successNotification.show(); + scrollTop.style.opacity = 0.4; }, 1); - }); - window.Events.listen('warning', function (text) { - warningNotification.find('span').text(text); - warningNotification.show(); - }); - window.Events.listen('error', function (text) { - errorNotification.find('span').text(text); - errorNotification.show(); - }); - - // Notification hiding - notifications.click(function () { - $(this).fadeOut(100); - }); - - // Chapter page list toggles - $('.chapter-toggle').click(function (e) { - e.preventDefault(); - $(this).toggleClass('open'); - $(this).closest('.chapter').find('.inset-list').slideToggle(180); - }); - - // Back to top button - $('#back-to-top').click(function() { - $('#header').smoothScrollTo(); - }); - let scrollTopShowing = false; - let scrollTop = document.getElementById('back-to-top'); - let scrollTopBreakpoint = 1200; - window.addEventListener('scroll', function() { - let scrollTopPos = document.documentElement.scrollTop || document.body.scrollTop || 0; - if (!scrollTopShowing && scrollTopPos > scrollTopBreakpoint) { - scrollTop.style.display = 'block'; - scrollTopShowing = true; - setTimeout(() => { - scrollTop.style.opacity = 0.4; - }, 1); - } else if (scrollTopShowing && scrollTopPos < scrollTopBreakpoint) { - scrollTop.style.opacity = 0; - scrollTopShowing = false; - setTimeout(() => { - scrollTop.style.display = 'none'; - }, 500); - } - }); - - // Common jQuery actions - $('[data-action="expand-entity-list-details"]').click(function() { - $('.entity-list.compact').find('p').not('.empty-text').slideToggle(240); - }); - - // Popup close - $('.popup-close').click(function() { - $(this).closest('.overlay').fadeOut(240); - }); - $('.overlay').click(function(event) { - if (!$(event.target).hasClass('overlay')) return; - $(this).fadeOut(240); - }); - - // Prevent markdown display link click redirect - $('.markdown-display').on('click', 'a', function(event) { - event.preventDefault(); - window.open($(this).attr('href')); - }); - - // Detect IE for css - if(navigator.userAgent.indexOf('MSIE')!==-1 - || navigator.appVersion.indexOf('Trident/') > 0 - || navigator.userAgent.indexOf('Safari') !== -1){ - $('body').addClass('flexbox-support'); + } else if (scrollTopShowing && scrollTopPos < scrollTopBreakpoint) { + scrollTop.style.opacity = 0; + scrollTopShowing = false; + setTimeout(() => { + scrollTop.style.display = 'none'; + }, 500); } +}); + +// Common jQuery actions +$('[data-action="expand-entity-list-details"]').click(function() { + $('.entity-list.compact').find('p').not('.empty-text').slideToggle(240); +}); +// Popup close +$('.popup-close').click(function() { + $(this).closest('.overlay').fadeOut(240); }); +$('.overlay').click(function(event) { + if (!$(event.target).hasClass('overlay')) return; + $(this).fadeOut(240); +}); + +// Detect IE for css +if(navigator.userAgent.indexOf('MSIE')!==-1 + || navigator.appVersion.indexOf('Trident/') > 0 + || navigator.userAgent.indexOf('Safari') !== -1){ + $('body').addClass('flexbox-support'); +} // Page specific items -import "./pages/page-show"; +require("./pages/page-show");