Merge pull request #228 from 10gen/INT-793-help-windows-squash

INT-793 Added help window

Author: kangas

gulpfile.js

@@ -95,6 +95,7 @@ gulp.task('watch', function() {
   gulp.watch(['src/*.jade'], ['build:pages']);
   gulp.watch('images/{*,**/*}', ['copy:images']);
   gulp.watch('fonts/*', ['copy:fonts']);
+  gulp.watch('src/help/entries/*.md', ['copy:text']);
   gulp.watch(['src/electron/{*,**/*}'], ['copy:js']);
   gulp.watch('package.json', function() {
     gutil.log('package.json changed!');
@@ -232,8 +233,12 @@ gulp.task('copy:package.json', function() {
 });
 
 gulp.task('copy:text', function() {
-  return gulp.src(['README.md'])
-    .pipe(gulp.dest('build/'));
+  return merge(
+    gulp.src('README.md')
+      .pipe(gulp.dest('build/')),
+    gulp.src('src/help/entries/*.md')
+      .pipe(gulp.dest('build/src/help/entries'))
+  );
 });
 
 // Copy non-UI js into the build.

images/help/dev/view_hierarchy.png

@@ -77,7 +77,9 @@
     "debug": "^2.2.0",
     "electron-squirrel-startup": "^0.1.4",
     "keytar": "mongodb-js/node-keytar",
+    "highlight.js": "^8.9.1",
     "localforage": "^1.3.0",
+    "marky-mark": "^1.2.1",
     "mongodb-collection-model": "^0.1.1",
     "mongodb-connection-model": "^3.0.7",
     "mongodb-instance-model": "^1.0.2",

images/help/schema/sampling-results-full.png

@@ -28,6 +28,7 @@ var MongoDBInstance = require('./models/mongodb-instance');
 var User = require('./models/user');
 var Router = require('./router');
 var Statusbar = require('./statusbar');
+var $ = require('jquery');
 
 var debug = require('debug')('scout:app');
 
@@ -119,7 +120,12 @@ var Application = View.extend({
     user: User
   },
   events: {
-    'click a': 'onLinkClick'
+    'click a': 'onLinkClick',
+    'click i.help': 'onHelpClicked'
+  },
+  onHelpClicked: function(evt) {
+    var id = $(evt.target).attr('data-hook');
+    app.sendMessage('show help window', id);
   },
   onClientReady: function() {
     debug('Client ready! Took %dms to become readable',
@@ -284,12 +290,12 @@ app.extend({
   setFeature: function(id, bool) {
     FEATURES[id] = bool;
   },
-  sendMessage: function(msg, arg1) {
-    ipc.send('message', msg, arg1);
+  sendMessage: function(msg, arg) {
+    ipc.send('message', msg, arg);
   },
-  onMessageReceived: function(msg) {
-    debug('message received from main process:', msg);
-    this.trigger(msg);
+  onMessageReceived: function(msg, arg) {
+    debug('message received from main process:', msg, arg);
+    this.trigger(msg, arg);
   },
   metrics: metrics,
   init: function() {

images/help/schema/sampling-results-sample.png

@@ -38,8 +38,9 @@ var MONGODB = {
     new InputView({
       template: inputTemplate,
       name: 'mongodb_database_name',
-      label: 'Database Name',
+      label: 'Authentication Database',
       placeholder: 'admin',
+      helpEntry: 'connect-userpass-auth-db',
       required: false
     })
   ]
@@ -57,6 +58,7 @@ var KERBEROS = {
       name: 'kerberos_principal',
       label: 'Principal',
       placeholder: '',
+      helpEntry: 'connect-kerberos-principal',
       required: true,
       tests: [
         function(value) {

package.json

@@ -187,6 +187,7 @@ var ConnectFormView = FormView.extend({
         name: 'name',
         label: 'Favorite Name',
         placeholder: 'e.g. Shared Dev, QA Box, PRODUCTION',
+        helpEntry: 'connect-favorite-name',
         required: false
       })
     ];

src/app.js

@@ -1,5 +1,8 @@
 .form-item 
-  label(data-hook='label')= label
+  label
+    span(data-hook='label')= label
+    if helpEntry
+      i.help(data-hook='#{helpEntry}')
   .message.message-below.message-error(data-hook='message-container')
     p(data-hook='message-text')
   .form-item-file

src/connect/authentication.js

@@ -30,6 +30,10 @@ module.exports = InputView.extend({
       type: 'boolean',
       required: true,
       default: false
+    },
+    helpEntry: {
+      type: 'string',
+      default: null
     }
   },
   derived: {
@@ -91,6 +95,9 @@ module.exports = InputView.extend({
     _.defaults(spec, {
       value: []
     });
+    if (spec.helpEntry) {
+      this.helpEntry = spec.helpEntry;
+    }
     this.invalidClass = 'has-error';
     this.validityClassSelector = '.form-item-file';
     InputView.prototype.initialize.call(this, spec);