From 3b177b00e2d1a26ffb0fde64415a50c94c29f5bb Mon Sep 17 00:00:00 2001 From: Lucas Hrabovsky Date: Sat, 26 Sep 2015 11:17:26 -0400 Subject: [PATCH 1/2] :bug: Edit existing connection, fix flow control bugs --- src/connect/connect-form-view.js | 9 ++++++- src/connect/index.js | 38 +++++++++++++++-------------- src/connect/sidebar.jade | 9 +++++-- src/connect/sidebar.js | 38 +++++++++++++++++++++++------ src/models/connection-collection.js | 4 ++- 5 files changed, 69 insertions(+), 29 deletions(-) diff --git a/src/connect/connect-form-view.js b/src/connect/connect-form-view.js index cc98bfdbe6c..92084891738 100644 --- a/src/connect/connect-form-view.js +++ b/src/connect/connect-form-view.js @@ -1,4 +1,3 @@ -var app = require('ampersand-app'); var FormView = require('ampersand-form-view'); var InputView = require('./input-view'); var Connection = require('../models/connection'); @@ -9,6 +8,11 @@ require('bootstrap/js/popover'); require('bootstrap/js/tooltip'); var ConnectFormView = FormView.extend({ + props: { + connection_id: { + type: 'string' + } + }, namespace: 'ConnectFormView', /** * callback when user hits submit (or presses enter). Run some general checks here @@ -17,6 +21,9 @@ var ConnectFormView = FormView.extend({ * @param {Object} obj contains the clean()'ed up data from the form. */ submitCallback: function(obj) { + if (this.connection_id !== '') { + obj._id = this.connection_id; + } debug('form submitted', obj); this.parent.onFormSubmitted(new Connection(obj)); }, diff --git a/src/connect/index.js b/src/connect/index.js index 70221046bbd..00c38f09129 100644 --- a/src/connect/index.js +++ b/src/connect/index.js @@ -189,6 +189,14 @@ var ConnectView = View.extend({ onAuthTabClicked: function(evt) { this.authMethod = $(evt.target).data('method'); }, + createNewConnection: function() { + debug('new connection requested'); + this.reset(); + this.form.connection_id = ''; + this.form.reset(); + this.authMethod = null; + this.authOpen = false; + }, /** * Triggers when the auth methods has changed (or set back to null) @@ -221,21 +229,15 @@ var ConnectView = View.extend({ * a list item like in `./sidebar`. * * @param {Connection} model - * @param {Object} [options] - * @option {Boolean} close - Close the connect dialog on success [Default: `false`]. * @api public */ - connect: function(model, options) { - options = _.defaults(options || {}, { - close: false - }); - + connect: function(model) { app.statusbar.show(); debug('testing credentials are usable...'); model.test(function(err) { if (!err) { - this.onConnectionSuccessful(model, options); + this.onConnectionSuccessful(model); return; } @@ -256,7 +258,7 @@ var ConnectView = View.extend({ this.onError(new Error('Could not connect to MongoDB.'), model); return; } - this.onConnectionSuccessful(model, options); + this.onConnectionSuccessful(model); }.bind(this)); }.bind(this)); }, @@ -266,13 +268,12 @@ var ConnectView = View.extend({ * view using it. * * @param {Connection} model - * @param {Object} [options] * @api private */ - onConnectionSuccessful: function(model, options) { - options = _.defaults(options, { - close: true - }); + onConnectionSuccessful: function(model) { + app.statusbar.hide(); + this.form.connection_id = ''; + /** * The save method will handle calling the correct method * of the sync being used by the model, whether that's @@ -301,9 +302,7 @@ var ConnectView = View.extend({ message: '' }), 500); - if (options.close) { - setTimeout(window.close, 1000); - } + setTimeout(window.close, 1000); }, /** * If there is a validation or connection error show a nice message. @@ -350,6 +349,7 @@ var ConnectView = View.extend({ if (!model.isValid()) { this.onError(model.validationError); + return; } this.connect(model); @@ -363,7 +363,7 @@ var ConnectView = View.extend({ * @api public */ onConnectionSelected: function(model) { - // If the new model has auth, expand the auth options container + // If the new model has auth, expand the auth settings container // and select the correct tab. this.authMethod = model.auth_mechanism; @@ -385,6 +385,8 @@ var ConnectView = View.extend({ debug('Populating form fields with keys', keys); var values = _.pick(model, keys); + this.form.connection_id = model.getId(); + // Populates the form from values in the model. this.form.setValues(values); }, diff --git a/src/connect/sidebar.jade b/src/connect/sidebar.jade index c6998ea7941..353cb5ab20b 100644 --- a/src/connect/sidebar.jade +++ b/src/connect/sidebar.jade @@ -1,6 +1,11 @@ div .sidebar.panel .panel-heading(style='padding: 10px;') - .panel-title Saved Connections - ul.list-group(data-hook='connection-list', style='top: 32px;') + .panel-title Recent Connections + ul.list-group(data-hook='connection-list', style='top: 32px;position: initial;') + ul.list-group(data-hook='connection-list-controls', style='top: initial;') + li.list-group-item + a(href="#new-connection", data-hook="new-connection") + i.fa.fa-fw.fa-plus + | New Connection .sidebar-bg diff --git a/src/connect/sidebar.js b/src/connect/sidebar.js index 867212907cd..ca7dbb31b41 100644 --- a/src/connect/sidebar.js +++ b/src/connect/sidebar.js @@ -46,10 +46,10 @@ var SidebarItemView = View.extend({ }, template: require('./connection.jade'), onClick: function(event) { - this.parent.onItemClick(event, this.model); + this.parent.onItemClick(event, this); }, onDoubleClick: function(event) { - this.parent.onItemDoubleClick(event, this.model); + this.parent.onItemDoubleClick(event, this); }, onCloseClick: function(event) { event.stopPropagation(); @@ -69,20 +69,44 @@ var SidebarItemView = View.extend({ * Renders all existing connections as list in the sidebar. */ var SidebarView = View.extend({ + session: { + active_item_view: { + type: 'state' + } + }, + events: { + 'click a[data-hook=new-connection]': 'onNewConnectionClick' + }, namespace: 'SidebarView', template: require('./sidebar.jade'), render: function() { this.renderWithTemplate(); this.renderCollection(this.collection, SidebarItemView, this.queryByHook('connection-list')); }, - onItemClick: function(event, model) { + onNewConnectionClick: function(event) { event.stopPropagation(); event.preventDefault(); - this.parent.onConnectionSelected(model); + + if (this.active_item_view) { + this.active_item_view.el.classList.remove('active'); + this.active_item_view = null; + } + this.parent.createNewConnection(); + }, + onItemClick: function(event, view) { + event.stopPropagation(); + event.preventDefault(); + if (this.active_item_view) { + this.active_item_view.el.classList.remove('active'); + } + + this.active_item_view = view; + this.active_item_view.el.classList.add('active'); + this.parent.onConnectionSelected(view.model); }, - onItemDoubleClick: function(event, model) { - this.onItemClick(event, model); - this.parent.connect(model); + onItemDoubleClick: function(event, view) { + this.onItemClick(event, view); + this.parent.connect(view.model); } }); diff --git a/src/models/connection-collection.js b/src/models/connection-collection.js index 4af0c2c2709..643b78b7f59 100644 --- a/src/models/connection-collection.js +++ b/src/models/connection-collection.js @@ -7,7 +7,9 @@ var restMixin = require('ampersand-collection-rest-mixin'); module.exports = Collection.extend(lodashMixin, restMixin, { namespace: 'ConnectionCollection', model: Connection, - comparator: 'last_used', + comparator: function(model) { + return -model.last_used; + }, mainIndex: '_id', sync: connectionSync }); From 4798db94b6e63b297417bce2d86c6c2a17066e31 Mon Sep 17 00:00:00 2001 From: Lucas Hrabovsky Date: Sat, 26 Sep 2015 11:28:42 -0400 Subject: [PATCH 2/2] :bug: when connection removed, reset connect form --- src/connect/index.js | 7 +++++++ src/connect/sidebar.js | 11 +++++++++-- 2 files changed, 16 insertions(+), 2 deletions(-) diff --git a/src/connect/index.js b/src/connect/index.js index 00c38f09129..e1a655371ba 100644 --- a/src/connect/index.js +++ b/src/connect/index.js @@ -197,6 +197,13 @@ var ConnectView = View.extend({ this.authMethod = null; this.authOpen = false; }, + onConnectionDestroyed: function() { + this.reset(); + this.form.connection_id = ''; + this.form.reset(); + this.authMethod = null; + this.authOpen = false; + }, /** * Triggers when the auth methods has changed (or set back to null) diff --git a/src/connect/sidebar.js b/src/connect/sidebar.js index ca7dbb31b41..ea9306e9c17 100644 --- a/src/connect/sidebar.js +++ b/src/connect/sidebar.js @@ -19,7 +19,7 @@ var SidebarItemView = View.extend({ dblclick: 'onDoubleClick', mouseover: 'onMouseOver', mouseout: 'onMouseOut', - 'click [data-hook=close]': 'onCloseClick' + 'click [data-hook=close]': 'onRemoveClick' }, bindings: { 'model.name': { @@ -51,10 +51,11 @@ var SidebarItemView = View.extend({ onDoubleClick: function(event) { this.parent.onItemDoubleClick(event, this); }, - onCloseClick: function(event) { + onRemoveClick: function(event) { event.stopPropagation(); event.preventDefault(); this.model.destroy(); + this.parent.onRemoveClick(event, this); }, onMouseOver: function() { this.hover = true; @@ -93,6 +94,12 @@ var SidebarView = View.extend({ } this.parent.createNewConnection(); }, + onRemoveClick: function(event, view) { + event.stopPropagation(); + event.preventDefault(); + view.model.destroy(); + this.parent.onConnectionDestroyed(); + }, onItemClick: function(event, view) { event.stopPropagation(); event.preventDefault();