Separate core and theme js

_layouts/website/page.html

@@ -15,7 +15,8 @@
 {% endblock %}
 
 {% block javascript %}
-    <script src="{{ "app.js"|resolveAsset }}"></script>
+    <script src="{{ "gitbook.js"|resolveAsset }}"></script>
+    <script src="{{ "theme.js"|resolveAsset }}"></script>
     {% for resource in plugins.resources.js %}
         {% if resource.url %}
         <script src="{{ resource.url }}"></script>
@@ -23,11 +24,6 @@
         <script src="{{ resource.path|resolveAsset }}"></script>
         {% endif %}
     {% endfor %}
-    <script>
-    require(["gitbook"], function(gitbook) {
-        gitbook.start({{ config.pluginsConfig|dump|safe }});
-    });
-    </script>
 {% endblock %}
 
 {% block body %}
@@ -108,6 +104,15 @@
         {% endblock %}
     {% endblock %}
     </div>
+
+    <script>
+    (function() {
+        gitbook.page.hasChanged({
+            page: {{ page|dump|safe }},
+            config: {{ config|dump|safe }},
+        })
+    })();
+    </script>
 </div>
 {% endblock %}
 

src/build.sh

@@ -8,7 +8,8 @@ mkdir -p _assets/website/
 mkdir -p _assets/ebook/
 
 # Compile JS
-browserify src/js/main.js | uglifyjs -mc > _assets/website/app.js
+browserify src/js/core/index.js | uglifyjs -mc > _assets/website/gitbook.js
+browserify src/js/theme/index.js | uglifyjs -mc > _assets/website/theme.js
 
 # Compile Website CSS
 lessc -clean-css src/less/website.less _assets/website/style.css

src/js/core/index.js

-module.exports = {
-    events:  require('./events'),
-    state:   require('./state'),
-    storage: require('./storage')
-};
\ No newline at end of file
+var $ = require('jquery');
+
+var events  = require('./events');
+var storage = require('./storage');
+var page = require('./page');
+
+console.log('GitBook is starting...');
+
+// Export APIs for plugins
+var gitbook = {
+    events:   events,
+    page:     page,
+
+    // Deprecated
+    state:    page.getState(),
+
+    // Read/Write the localstorage
+    storage: storage
+};
+
+
+// Modules mapping for plugins
+var MODULES = {
+    'gitbook': gitbook,
+    'jquery':  $
+};
+
+window.gitbook = gitbook;
+window.$ = $;
+window.jQuery = $;
+window.require = function(mods, fn) {
+    mods = mods.map(function(mod) {
+        mod = mod.toLowerCase();
+        if (!MODULES[mod]) {
+            throw new Error('GitBook module '+mod+' doesn\'t exist');
+        }
+
+        return MODULES[mod];
+    });
+
+    fn.apply(null, mods);
+};
+
+console.log('GitBook is started');

src/js/core/page.js

+var $ = require('jquery');
+var url = require('url');
+var path = require('path');
+var events = require('./events');
+var started = false;
+
+var state = {};
+
+
+/*
+    Signal that page has changed, this function must be called by
+    themes after page is loaded and when navigation changed
+*/
+function hasChanged(ctx) {
+    console.log('page has changed', ctx);
+    setState(ctx);
+
+    if (!started) {
+        // Notify that gitbook is ready
+        started = true;
+        events.trigger('start', ctx.config);
+    }
+
+    events.trigger('page.change');
+}
+
+/*
+    Update current state
+
+data-level="{{ page.level }}"
+    data-chapter-title="{{ page.title }}"
+    data-filepath="{{ file.path }}"
+    data-basepath="{{ './'|resolveFile }}"
+    data-revision="{{ gitbook.time }}"
+    data-innerlanguage="{{ innerlanguage }}">
+*/
+function setState(newState) {
+    // API since GitBook v3
+    state.page = newState.page;
+    state.file = newState.file;
+    state.gitbook = newState.gitbook;
+    state.config = newState.config;
+    state.basePath = newState.basePath;
+
+    // Deprecated
+    state.$book = $('.book');
+    state.innerLanguage = ''; // todo
+    state.revision = state.gitbook.time;
+    state.level = state.page.level;
+    state.filepath = state.file.path;
+    state.chapterTitle = state.page.title;
+
+    // Absolute url to the root of the book (inner book)
+    state.root = url.resolve(
+        location.protocol+'//'+location.host,
+        path.dirname(path.resolve(location.pathname.replace(/\/$/, '/index.html'), state.basePath))
+    ).replace(/\/?$/, '/');
+
+    // Absolute root to the language (for multilingual book)
+    state.bookRoot = state.innerLanguage? url.resolve(state.root, '..') : state.root;
+}
+
+/*
+    Return state of current page
+*/
+function getState() {
+    return state;
+}
+
+
+module.exports = {
+    hasChanged: hasChanged,
+    setState: setState,
+    getState: getState
+};

src/js/core/state.js

-var $ = require('jquery');
-var url = require('url');
-var path = require('path');
-
-var state = {};
-
-state.update = function(dom) {
-    var $book = $(dom.find('.book'));
-
-    state.$book = $book;
-    state.level = $book.data('level');
-    state.basePath = $book.data('basepath');
-
-    // If book is multilingual, language of this book
-    state.innerLanguage = $book.data('innerlanguage');
-
-    // Date of build
-    state.revision = $book.data('revision');
-
-    // Original path of the file
-    state.filepath = $book.data('filepath');
-
-    // Title of the chapter
-    state.chapterTitle = $book.data('chapter-title');
-
-    // Absolute url to the root of the book (inner book)
-    state.root = url.resolve(
-        location.protocol+'//'+location.host,
-        path.dirname(path.resolve(location.pathname.replace(/\/$/, '/index.html'), state.basePath))
-    ).replace(/\/?$/, '/');
-
-    // Absolute root to the language (for multilingual book)
-    state.bookRoot = state.innerLanguage? url.resolve(state.root, '..') : state.root;
-};
-
-state.update($);
-
-module.exports = state;

src/js/main.js

-var $ = require('jquery');
-
-var events  = require('./core').events;
-var state   = require('./core').state;
-var storage = require('./core').storage;
-
-var theme = require('./theme');
-
-function start(config) {
-    // Init theme
-    theme.init();
-
-    // Notify that gitbook is ready
-    events.trigger('start', config);
-    theme.navigation.notify();
-}
-
-// Export APIs for plugins
-var gitbook = {
-    start:    start,
-    events:   events,
-    state:    state,
-
-    // Read/Write the localstorage
-    storage: storage,
-
-    // UI sections
-    toolbar: theme.toolbar,
-    sidebar: theme.sidebar,
-
-    // Create keyboard shortcuts
-    keyboard: theme.keyboard
-};
-
-
-// Modules mapping for plugins
-var MODULES = {
-    'gitbook': gitbook,
-    'jquery':  $
-};
-
-window.gitbook = gitbook;
-window.$ = $;
-window.jQuery = $;
-window.require = function(mods, fn) {
-    mods = mods.map(function(mod) {
-        mod = mod.toLowerCase();
-        if (!MODULES[mod]) {
-            throw new Error('GitBook module '+mod+' doesn\'t exist');
-        }
-
-        return MODULES[mod];
-    });
-
-    fn.apply(null, mods);
-};
-
-module.exports = {};
-

src/js/theme/index.js

@@ -4,6 +4,8 @@ var navigation = require('./navigation');
 var sidebar =    require('./sidebar');
 var toolbar =    require('./toolbar');
 
+var gitbook = window.gitbook;
+
 function init() {
     // Init sidebar
     sidebar.init();
@@ -26,12 +28,13 @@ function init() {
             sidebar.toggle();
         }
     });
+
+    navigation.notify();
 }
 
-module.exports = {
-    init:       init,
-    keyboard:   require('./keyboard'),
-    navigation: require('./navigation'),
-    sidebar:    require('./sidebar'),
-    toolbar:    require('./toolbar')
-};
\ No newline at end of file
+gitbook.events.on('start', init);
+
+gitbook.keyboard = keyboard;
+gitbook.navigation = navigation;
+gitbook.sidebar = sidebar;
+gitbook.toolbar = toolbar;

src/js/theme/loading.js

-var state = require('../core').state;
+var state = gitbook.state;
 
 function showLoading(p) {
     state.$book.addClass('is-loading');

src/js/theme/navigation.js

 var $ = require('jquery');
 var url = require('url');
 
-var events  = require('../core').events;
-var state   = require('../core').state;
 var loading = require('./loading');
 
+var state   = gitbook.state;
 
 var usePushState = (typeof history.pushState !== 'undefined');
 
@@ -75,10 +74,6 @@ function updateNavigationPosition() {
     $('.navigation-next').css('margin-right', (bodyInnerWidth - pageWrapperWidth) + 'px');
 }
 
-function notifyPageChange() {
-    events.trigger('page.change');
-}
-
 function preparePage(notify) {
     var $bookBody = $('.book-body');
     var $bookInner = $bookBody.find('.body-inner');
@@ -93,9 +88,6 @@ function preparePage(notify) {
     // Reset scroll
     $bookInner.scrollTop(0);
     $bookBody.scrollTop(0);
-
-    // Notify
-    if (notify !== false) notifyPageChange();
 }
 
 function isLeftClickEvent(e) {
@@ -160,6 +152,5 @@ function init() {
 module.exports = {
     init: init,
     goNext: goNext,
-    goPrev: goPrev,
-    notify: notifyPageChange
+    goPrev: goPrev
 };

src/js/theme/sidebar.js

 var $ = require('jquery');
 
-var storage  = require('../core').storage;
-var state    = require('../core').state;
+var storage  = gitbook.storage;
+var state    = gitbook.state;
 var platform = require('./platform');
 
 

src/js/theme/toolbar.js

 var $ = require('jquery');
 
-var events = require('../core').events;
+var events = gitbook.events;
 
 // List of created buttons
 var buttons = [];