Merge pull request #209 from crashbell/master

Separate GitHub and GitLab page load events

src/adapters/github.js

@@ -15,6 +15,15 @@ const GH_CONTAINERS = '.container'
 
 class GitHub extends Adapter {
 
+  constructor() {
+    super()
+    $(document)
+      .ready(() => this._detectLocationChange())
+      .on('pjax:send', () => $(document).trigger(EVENT.REQ_START))
+      .on('pjax:end', () => $(document).trigger(EVENT.REQ_END))
+      .on('pjax:timeout', (event) => event.preventDefault())
+  }
+
   // @override
   getCssClass() {
     return 'octotree_github_sidebar'
@@ -160,4 +169,33 @@ class GitHub extends Adapter {
       .done((data) => cb(null, data))
       .fail((jqXHR) => this._handleError(jqXHR, cb))
   }
+
+  /**
+   * When navigating from non-code pages (i.e. Pulls, Issues) to code page
+   * GitHub doesn't reload the page but uses pjax. Need to detect and load Octotree.
+   */
+  _detectLocationChange() {
+    let firstLoad = true, href, hash
+
+    function detect() {
+      if (location.href !== href || location.hash !== hash) {
+        href = location.href
+        hash = location.hash
+
+        // If this is the first time this is called, no need to notify change as
+        // Octotree does its own initialization after loading options.
+        if (firstLoad) {
+          firstLoad = false
+        }
+        else {
+          setTimeout(() => {
+            $(document).trigger(EVENT.LOC_CHANGE, href, hash)
+          }, 200) // Waits a bit for pjax DOM change
+        }
+      }
+
+      setTimeout(detect, 200)
+    }
+    detect()
+  }
 }

src/adapters/gitlab.js

@@ -46,10 +46,18 @@ class GitLab extends Adapter {
     $('.octotree_view_body input[type="text"], .octotree_view_body textarea')
       .addClass('form-control')
 
-    // GitLab removes DOM, add back
-    $(document).on(EVENT.LOC_CHANGE, () => {
-      $sidebar.appendTo('body')
-    })
+    /**
+     * GitLab uses Turbolinks to handle page load
+     * https://github.com/rails/turbolinks
+     */
+    $(document)
+      .on('page:update', () => {
+        // GitLab removes DOM, add back
+        $sidebar.appendTo('body')
+        $(document).trigger(EVENT.LOC_CHANGE)
+        $(document).trigger(EVENT.REQ_END)
+      })
+      .on('page:fetch', () => $(document).trigger(EVENT.REQ_START))
   }
 
   // @override
@@ -71,6 +79,7 @@ class GitLab extends Adapter {
   updateLayout(sidebarVisible, sidebarWidth) {
     const isNewDesign = $('.navbar-gitlab.header-collapsed, .navbar-gitlab.header-expanded').length > 0
     const glSidebarExpanded = $('.page-with-sidebar').hasClass('page-sidebar-expanded')
+    const toggleVisible = $('.octotree_toggle').is(":visible")
 
     if (isNewDesign) {
       const glSidebarWidth = glSidebarExpanded ? 230 : 62
@@ -88,6 +97,9 @@ class GitLab extends Adapter {
       })
     }
 
+    // reset if toggle is not visible
+    if (!toggleVisible) $(GL_SHIFTED).css('margin-left',  '')
+
     $(GL_HEADER).css({'z-index': 3, 'margin-left': sidebarVisible ? sidebarWidth : ''})
     $('.page-with-sidebar').css('padding-left', sidebarVisible ? sidebarWidth : '')
   }

src/octotree.js

@@ -37,9 +37,6 @@ $(document).ready(() => {
       .resize(layoutChanged)
       .appendTo($('body'))
 
-    adapter.init($sidebar)
-    layoutChanged()
-
     $(window).resize((event) => { // handle zoom
       if (event.target === window) layoutChanged()
     })
@@ -62,17 +59,18 @@ $(document).ready(() => {
     })
 
     $document
-      .on('pjax:send ' + EVENT.REQ_START, () => $toggler.addClass('octotree_loading'))
-      .on('pjax:end ' + EVENT.REQ_END, () => $toggler.removeClass('octotree_loading'))
-      .on('pjax:timeout', (event) => event.preventDefault())
+      .on(EVENT.REQ_START, () => $toggler.addClass('octotree_loading'))
+      .on(EVENT.REQ_END, () => $toggler.removeClass('octotree_loading'))
       .on(EVENT.LAYOUT_CHANGE, layoutChanged)
       .on(EVENT.TOGGLE, layoutChanged)
       .on(EVENT.LOC_CHANGE, () => {
-        layoutChanged()
         tryLoadRepo()
+        layoutChanged()
       })
 
-    return tryLoadRepo()
+    adapter.init($sidebar)
+    tryLoadRepo()
+    layoutChanged()
 
     function optionsChanged(event, changes) {
       let reload = false

src/util.location.js

@@ -1,27 +0,0 @@
-$(document).ready(() => {
-  // When navigating from non-code pages (i.e. Pulls, Issues) to code page
-  // GitHub/GitLab doesn't reload the page but uses pjax. Need to detect and load Octotree.
-  let firstLoad = true, href, hash
-
-  function detectLocationChange() {
-    if (location.href !== href || location.hash !== hash) {
-      href = location.href
-      hash = location.hash
-
-      // If this is the first time this is called, no need to notify change as
-      // Octotree does its own initialization after loading options.
-      if (firstLoad) {
-        firstLoad = false
-      }
-      else {
-        setTimeout(() => {
-          $(document).trigger(EVENT.LOC_CHANGE, href, hash)
-        }, 200) // Waits a bit for pjax DOM change
-      }
-    }
-
-    setTimeout(detectLocationChange, 200)
-  }
-
-  detectLocationChange()
-})