mongodb-js · imlucas · Aug 31, 2016 · Aug 31, 2016
diff --git a/src/app/help.html b/src/app/help.html
@@ -0,0 +1,25 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <title>MongoDB Compass</title>
+    <meta name="viewport" content="initial-scale=1">
+    <style>
+      div#static-sidebar {
+        position: fixed;
+        top: 0;
+        left: 0;
+        width: 250px;
+        height: 100%;
+        background-color: #4c5259; /* @slate1 */
+      }
+    </style>
+  </head>
+  <body>
+    <div id="application">
+      <div data-hook="layout-container">
+        <div id="static-sidebar" class="sidebar"></div>
+      </div>
+    </div>
+    <script src="help.js" charset="UTF-8" async></script>
+  </body>
+</html>
diff --git a/src/app/help.js b/src/app/help.js
@@ -0,0 +1,194 @@
+/* eslint no-console:0 */
+var Environment = require('../environment');
+Environment.init();
+
+var path = require('path');
+var resourcePath = path.join(__dirname, '..', '..');
+
+var ModuleCache = require('hadron-module-cache');
+ModuleCache.register(resourcePath);
+ModuleCache.add(resourcePath);
+
+var pkg = require('../../package.json');
+var CompileCache = require('hadron-compile-cache');
+CompileCache.setHomeDirectory(resourcePath);
+CompileCache.digestMappings = pkg._compileCacheMappings || {};
+
+var StyleManager = require('./style-manager');
+StyleManager.writeStyles();
+
+/**
+ * The main entrypoint for the application!
+ */
+var electron = require('electron');
+var shell = electron.shell;
+var app = require('ampersand-app');
+var APP_VERSION = electron.remote.app.getVersion();
+
+var _ = require('lodash');
+var qs = require('qs');
+var ViewSwitcher = require('ampersand-view-switcher');
+var View = require('ampersand-view');
+var localLinks = require('local-links');
+var ipc = require('hadron-ipc');
+var Router = require('./help/router');
+var metrics = require('mongodb-js-metrics')();
+
+var addInspectElementMenu = require('debug-menu').install;
+
+ipc.once('app:launched', function() {
+  console.log('in app:launched');
+  if (process.env.NODE_ENV !== 'production') {
+    require('debug').enable('mon*,had*');
+    require('debug/browser');
+  }
+});
+
+var debug = require('debug')('mongodb-compass:help');
+
+var Application = View.extend({
+  template: function() {
+    return [
+      '<div id="application">',
+      '  <div data-hook="layout-container"></div>',
+      '</div>'
+    ].join('\n');
+  },
+  props: {
+    version: {
+      type: 'string',
+      default: APP_VERSION
+    }
+  },
+  session: {
+    /**
+     * Details of the MongoDB Instance we're currently connected to.
+     */
+    instance: 'state',
+    /**
+     * @see http://learn.humanjavascript.com/react-ampersand/creating-a-router-and-pages
+     */
+    router: 'object'
+  },
+  events: {
+    'click a': 'onLinkClick'
+  },
+  onClientReady: function() {
+    this.startRouter();
+  },
+  startRouter: function() {
+    this.router = new Router();
+    debug('Listening for page changes from the router...');
+    this.listenTo(this.router, 'page', this.onPageChange);
+
+    debug('Starting router...');
+    this.router.history.start({
+      pushState: false,
+      root: '/'
+    });
+  },
+  /**
+   * When you want to go to a different page in the app or just save
+   * state via the URL.
+   * @param {String} fragment - To update the location bar with.
+   * @param {Object} [options] - `silent` and `params`
+   */
+  navigate: function(fragment, options) {
+    options = _.defaults(options || {}, {
+      silent: false,
+      params: null
+    });
+    if (options.params) {
+      fragment += '?' + qs.stringify(options.params);
+    }
+
+    var hash = fragment.charAt(0) === '/' ? fragment.slice(1) : fragment;
+    this.router.history.navigate(hash, {
+      trigger: !options.silent
+    });
+  },
+  /**
+   * Called a soon as the DOM is ready so we can
+   * start showing status indicators as
+   * quickly as possible.
+   */
+  render: function() {
+    debug('Rendering app container...');
+
+    this.el = document.querySelector('#application');
+    this.renderWithTemplate(this);
+    this.pageSwitcher = new ViewSwitcher(this.queryByHook('layout-container'), {
+      show: function() {
+        document.scrollTop = 0;
+      }
+    });
+
+    if (process.env.NODE_ENV !== 'production') {
+      debug('Installing "Inspect Element" context menu');
+      addInspectElementMenu();
+    }
+  },
+  onPageChange: function(view) {
+    metrics.track('App', 'viewed', view.screenName);
+    this.pageSwitcher.set(view);
+  },
+  onLinkClick: function(event) {
+    // ignore help links, they're handled in `onHelpClicked`
+    if (event.target.className === 'help') {
+      return;
+    }
+    var pathname = localLinks.getLocalPathname(event);
+    if (pathname) {
+      event.preventDefault();
+      this.router.history.navigate(pathname);
+      return;
+    } else if (event.currentTarget.getAttribute('href') !== '#') {
+      event.preventDefault();
+      event.stopPropagation();
+      shell.openExternal(event.target.href);
+    }
+  }
+});
+
+var state = new Application({});
+
+app.extend({
+  client: null,
+  navigate: state.navigate.bind(state),
+  onDomReady: function() {
+    state.render();
+    // Not serving a part of the app which uses the client,
+    // so we can just start everything up now.
+    state.startRouter();
+    return;
+  },
+  init: function() {
+    var self = this;
+    // signal to main process that app is ready
+    ipc.call('window:renderer-ready');
+    // as soon as dom is ready, render and set up the rest
+    self.onDomReady();
+  }
+});
+
+Object.defineProperty(app, 'instance', {
+  get: function() {
+    return state.instance;
+  }
+});
+
+Object.defineProperty(app, 'router', {
+  get: function() {
+    return state.router;
+  }
+});
+
+Object.defineProperty(app, 'state', {
+  get: function() {
+    return state;
+  }
+});
+
+app.init();
+
+window.app = app;
diff --git a/...help/entries/cloning-a-single-document.md → ...help/entries/cloning-a-single-document.md b/...help/entries/cloning-a-single-document.md → ...help/entries/cloning-a-single-document.md
diff --git a/src/help/entries/connect-favorite-name.md → ...app/help/entries/connect-favorite-name.md b/src/help/entries/connect-favorite-name.md → ...app/help/entries/connect-favorite-name.md
diff --git a/...elp/entries/connect-kerberos-principal.md → ...elp/entries/connect-kerberos-principal.md b/...elp/entries/connect-kerberos-principal.md → ...elp/entries/connect-kerberos-principal.md
diff --git a/.../entries/connect-kerberos-service-name.md → .../entries/connect-kerberos-service-name.md b/.../entries/connect-kerberos-service-name.md → .../entries/connect-kerberos-service-name.md
diff --git a/...ries/connect-ssl-certificate-authority.md → ...ries/connect-ssl-certificate-authority.md b/...ries/connect-ssl-certificate-authority.md → ...ries/connect-ssl-certificate-authority.md
diff --git a/...entries/connect-ssl-client-certificate.md → ...entries/connect-ssl-client-certificate.md b/...entries/connect-ssl-client-certificate.md → ...entries/connect-ssl-client-certificate.md
diff --git a/...entries/connect-ssl-client-private-key.md → ...entries/connect-ssl-client-private-key.md b/...entries/connect-ssl-client-private-key.md → ...entries/connect-ssl-client-private-key.md
diff --git a/...tries/connect-ssl-private-key-password.md → ...tries/connect-ssl-private-key-password.md b/...tries/connect-ssl-private-key-password.md → ...tries/connect-ssl-private-key-password.md
diff --git a/src/help/entries/connect-userpass-auth-db.md → .../help/entries/connect-userpass-auth-db.md b/src/help/entries/connect-userpass-auth-db.md → .../help/entries/connect-userpass-auth-db.md
diff --git a/...elp/entries/deleting-a-single-document.md → ...elp/entries/deleting-a-single-document.md b/...elp/entries/deleting-a-single-document.md → ...elp/entries/deleting-a-single-document.md
diff --git a/src/help/entries/dev-ampersand-tips.md → src/app/help/entries/dev-ampersand-tips.md b/src/help/entries/dev-ampersand-tips.md → src/app/help/entries/dev-ampersand-tips.md
diff --git a/src/help/entries/dev-auto-updates.md → src/app/help/entries/dev-auto-updates.md b/src/help/entries/dev-auto-updates.md → src/app/help/entries/dev-auto-updates.md
diff --git a/src/help/entries/dev-how-help-works.md → src/app/help/entries/dev-how-help-works.md b/src/help/entries/dev-how-help-works.md → src/app/help/entries/dev-how-help-works.md
diff --git a/src/help/entries/dev-shrinkwrap-howto.md → src/app/help/entries/dev-shrinkwrap-howto.md b/src/help/entries/dev-shrinkwrap-howto.md → src/app/help/entries/dev-shrinkwrap-howto.md
diff --git a/src/help/entries/dev-taxonomy.md → src/app/help/entries/dev-taxonomy.md b/src/help/entries/dev-taxonomy.md → src/app/help/entries/dev-taxonomy.md
diff --git a/...help/entries/editing-a-single-document.md → ...help/entries/editing-a-single-document.md b/...help/entries/editing-a-single-document.md → ...help/entries/editing-a-single-document.md
diff --git a/...lp/entries/inserting-a-single-document.md → ...lp/entries/inserting-a-single-document.md b/...lp/entries/inserting-a-single-document.md → ...lp/entries/inserting-a-single-document.md
diff --git a/src/help/entries/schema-geo-query-builder.md → .../help/entries/schema-geo-query-builder.md b/src/help/entries/schema-geo-query-builder.md → .../help/entries/schema-geo-query-builder.md
diff --git a/...help/entries/schema-how-sampling-works.md → ...help/entries/schema-how-sampling-works.md b/...help/entries/schema-how-sampling-works.md → ...help/entries/schema-how-sampling-works.md
diff --git a/...lp/entries/schema-long-running-queries.md → ...lp/entries/schema-long-running-queries.md b/...lp/entries/schema-long-running-queries.md → ...lp/entries/schema-long-running-queries.md
diff --git a/src/help/entries/schema-sampling-results.md → ...p/help/entries/schema-sampling-results.md b/src/help/entries/schema-sampling-results.md → ...p/help/entries/schema-sampling-results.md
diff --git a/src/help/help-entry-collection.js → src/app/help/help-entry-collection.js b/src/help/help-entry-collection.js → src/app/help/help-entry-collection.js
@@ -1,9 +1,9 @@
 var Collection = require('ampersand-rest-collection');
 var HelpEntry = require('./help-entry');
 var lodashMixin = require('ampersand-collection-lodash-mixin');
-var selectableMixin = require('../app/models/selectable-collection-mixin');
+var selectableMixin = require('../models/selectable-collection-mixin');
 var filterableMixin = require('ampersand-collection-filterable');
-var withSync = require('../app/models/with-sync');
+var withSync = require('../models/with-sync');
 var debug = require('debug')('mongodb-compass:help:help-entry-collection');
 var path = require('path');
 var _ = require('lodash');

diff --git a/src/help/help-entry.js → src/app/help/help-entry.js b/src/help/help-entry.js → src/app/help/help-entry.js
diff --git a/src/help/index.js → src/app/help/help-page.js b/src/help/index.js → src/app/help/help-page.js
@@ -4,7 +4,7 @@ var debug = require('debug')('mongodb-compass:help');
 var HelpSectionCollection = require('./help-section-collection');
 var HelpEntryCollection = require('./help-entry-collection');
 var HelpEntry = require('./help-entry');
-var SidebarView = require('../app/sidebar');
+var SidebarView = require('../sidebar');
 var ViewSwitcher = require('ampersand-view-switcher');
 var app = require('ampersand-app');
 var metrics = require('mongodb-js-metrics')();
@@ -16,8 +16,6 @@ var tagsTemplate = require('./tags.jade');
 
 var entries = new HelpEntryCollection();
 
-var StatusAction = app.appRegistry.getAction('StatusAction');
-
 var HelpPage = View.extend({
   template: indexTemplate,
   screenName: 'Help',
@@ -130,12 +128,9 @@ var HelpPage = View.extend({
     if (!entry) {
       debug('Unknown help entry', entryId);
       this.viewSwitcher.clear();
-      StatusAction.setMessage('Help entry not found.');
       return;
     }
 
-    StatusAction.hide();
-
     if (!entries.select(entry)) {
       debug('already selected');
       return;

diff --git a/src/help/help-section-collection.js → src/app/help/help-section-collection.js b/src/help/help-section-collection.js → src/app/help/help-section-collection.js
diff --git a/src/help/help-section.js → src/app/help/help-section.js b/src/help/help-section.js → src/app/help/help-section.js
diff --git a/src/help/index.jade → src/app/help/index.jade b/src/help/index.jade → src/app/help/index.jade
diff --git a/src/help/index.less → src/app/help/index.less b/src/help/index.less → src/app/help/index.less
diff --git a/src/help/related.jade → src/app/help/related.jade b/src/help/related.jade → src/app/help/related.jade
diff --git a/src/app/help/router.js b/src/app/help/router.js
@@ -0,0 +1,19 @@
+var AmpersandRouter = require('ampersand-router');
+var HelpPage = require('./help-page');
+module.exports = AmpersandRouter.extend({
+  routes: {
+    '': 'index',
+    help: 'index',
+    'help/:entryId': 'index',
+    '(*path)': 'catchAll'
+  },
+  index: function(entryId) {
+    this.help(entryId);
+  },
+  help: function(entryId) {
+    this.trigger('page', new HelpPage({ entryId: entryId }));
+  },
+  catchAll: function() {
+    this.redirectTo('');
+  }
+});
diff --git a/src/help/sidebar.jade → src/app/help/sidebar.jade b/src/help/sidebar.jade → src/app/help/sidebar.jade
diff --git a/src/help/tags.jade → src/app/help/tags.jade b/src/help/tags.jade → src/app/help/tags.jade
diff --git a/src/app/index.less b/src/app/index.less
@@ -18,7 +18,7 @@
 @import "explain-plan/index.less";
 
 @import "../auto-update/index.less";
-@import "../help/index.less";
+@import "./help/index.less";
 @import "metrics/index.less";
 @import "./styles/mapbox-gl.css";
 

diff --git a/src/app/router.js b/src/app/router.js
@@ -5,8 +5,6 @@ module.exports = AmpersandRouter.extend({
     schema: 'index',
     connect: 'connect',
     'schema/:ns': 'schema',
-    help: 'help',
-    'help/:entryId': 'help',
     '(*path)': 'catchAll'
   },
   index: function() {
@@ -18,12 +16,6 @@ module.exports = AmpersandRouter.extend({
       ns: ns
     }));
   },
-  help: function(entryId) {
-    var HelpPage = require('../help');
-    this.trigger('page', new HelpPage({
-      entryId: entryId
-    }));
-  },
   catchAll: function() {
     this.redirectTo('');
   },

diff --git a/src/app/sidebar/index.js b/src/app/sidebar/index.js
@@ -159,14 +159,16 @@ var SidebarView = View.extend({
         this.queryByHook('widget-container'));
     }.bind(this));
 
-    this.listenToAndRun(app.autoUpdate, 'change:visible', function() {
-      var el = this.el.querySelector('.sidebar');
-      if (app.autoUpdate.visible) {
-        el.classList.add('auto-update-available');
-      } else {
-        el.classList.remove('auto-update-available');
-      }
-    }.bind(this));
+    if (app.autoUpdate) {
+      this.listenToAndRun(app.autoUpdate, 'change:visible', function() {
+        var el = this.el.querySelector('.sidebar');
+        if (app.autoUpdate.visible) {
+          el.classList.add('auto-update-available');
+        } else {
+          el.classList.remove('auto-update-available');
+        }
+      }.bind(this));
+    }
   },
   filterItems: function(searchString) {
     var re;

diff --git a/src/main/window-manager.js b/src/main/window-manager.js
@@ -25,7 +25,7 @@ var RESOURCES = path.resolve(__dirname, '../app/');
  * created by the `build:pages` gulp task.
  */
 var DEFAULT_URL = 'file://' + path.join(RESOURCES, 'index.html#connect');
-var HELP_URL = 'file://' + path.join(RESOURCES, 'index.html#help');
+var HELP_URL = 'file://' + path.join(RESOURCES, 'help.html#help');
 
 /**
  * We want the Connect and Help window to be special