Fauxton: Before unload event Build custom beforeunload event for backbone route, also add in check on editor to warn the user if they have unsaved changes in their editor.
Project: http://git-wip-us.apache.org/repos/asf/couchdb/repo Commit: http://git-wip-us.apache.org/repos/asf/couchdb/commit/14cb47e5 Tree: http://git-wip-us.apache.org/repos/asf/couchdb/tree/14cb47e5 Diff: http://git-wip-us.apache.org/repos/asf/couchdb/diff/14cb47e5 Branch: refs/heads/1744-single-config-file Commit: 14cb47e54c46662849ca3d1d40e82f014eb7cce1 Parents: f28dd6f Author: Garren Smith <[email protected]> Authored: Thu Dec 5 17:51:39 2013 +0200 Committer: Garren Smith <[email protected]> Committed: Mon Dec 9 17:33:23 2013 +0200 ---------------------------------------------------------------------- src/fauxton/app/api.js | 8 +++++++ src/fauxton/app/main.js | 6 ++---- src/fauxton/app/modules/documents/views.js | 13 ++++++++++- src/fauxton/app/modules/fauxton/components.js | 24 ++++++++++++++++++++- src/fauxton/app/router.js | 25 ++++++++++++++++++++++ src/fauxton/tasks/fauxton.js | 2 +- 6 files changed, 71 insertions(+), 7 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/couchdb/blob/14cb47e5/src/fauxton/app/api.js ---------------------------------------------------------------------- diff --git a/src/fauxton/app/api.js b/src/fauxton/app/api.js index a71c5f8..751cdd2 100644 --- a/src/fauxton/app/api.js +++ b/src/fauxton/app/api.js @@ -61,6 +61,14 @@ function(app, Fauxton) { app.router.navigate(url,options); }; + FauxtonAPI.beforeUnload = function () { + app.router.beforeUnload.apply(app.router, arguments); + }; + + FauxtonAPI.removeBeforeUnload = function () { + app.router.removeBeforeUnload.apply(app.router, arguments); + }; + FauxtonAPI.addHeaderLink = function(link) { app.masterLayout.navBar.addLink(link); }; http://git-wip-us.apache.org/repos/asf/couchdb/blob/14cb47e5/src/fauxton/app/main.js ---------------------------------------------------------------------- diff --git a/src/fauxton/app/main.js b/src/fauxton/app/main.js index 2182f2c..6fe9991 100644 --- a/src/fauxton/app/main.js +++ b/src/fauxton/app/main.js @@ -40,10 +40,8 @@ function(app, Router) { // refresh. evt.preventDefault(); - // `Backbone.history.navigate` is sufficient for all Routers and will - // trigger the correct events. The Router's internal `navigate` method - // calls this anyways. The fragment is sliced from the root. - Backbone.history.navigate(href.attr, true); + //User app navigate so that navigate goes through a central place + app.router.navigate(href.attr, true); } }); http://git-wip-us.apache.org/repos/asf/couchdb/blob/14cb47e5/src/fauxton/app/modules/documents/views.js ---------------------------------------------------------------------- diff --git a/src/fauxton/app/modules/documents/views.js b/src/fauxton/app/modules/documents/views.js index af3c4c3..64e304c 100644 --- a/src/fauxton/app/modules/documents/views.js +++ b/src/fauxton/app/modules/documents/views.js @@ -715,7 +715,7 @@ function(app, FauxtonAPI, Components, Documents, Databases, pouchdb, resizeColum _.bindAll(this); }, goback: function(){ - window.history.back(); + FauxtonAPI.navigate(this.database.url("index") + "?limit=100"); }, destroy: function(event) { if (this.model.isNewDoc()) { @@ -814,6 +814,7 @@ function(app, FauxtonAPI, Components, Documents, Databases, pouchdb, resizeColum saveDoc: function(event) { var json, notification, that = this, + editor = this.editor, validDoc = this.getDocFromEditor(); if (validDoc) { @@ -822,6 +823,7 @@ function(app, FauxtonAPI, Components, Documents, Databases, pouchdb, resizeColum notification = FauxtonAPI.addNotification({msg: "Saving document."}); this.model.save().then(function () { + editor.editSaved(); FauxtonAPI.navigate('/database/' + that.database.id + '/' + that.model.id); }).fail(function(xhr) { var responseText = JSON.parse(xhr.responseText).reason; @@ -906,6 +908,10 @@ function(app, FauxtonAPI, Components, Documents, Databases, pouchdb, resizeColum }); this.editor.render(); this.model.on("sync", this.updateValues, this); + }, + + cleanup: function () { + this.editor.remove(); } }); @@ -1560,6 +1566,11 @@ function(app, FauxtonAPI, Components, Documents, Databases, pouchdb, resizeColum //this.reduceEditor.setValue(this.langTemplates[this.defaultLang].reduce); } + }, + + cleanup: function () { + this.mapEditor && this.mapEditor.remove(); + this.reduceEditor && this.reduceEditor.remove(); } }); http://git-wip-us.apache.org/repos/asf/couchdb/blob/14cb47e5/src/fauxton/app/modules/fauxton/components.js ---------------------------------------------------------------------- diff --git a/src/fauxton/app/modules/fauxton/components.js b/src/fauxton/app/modules/fauxton/components.js index bcc9226..5255626 100644 --- a/src/fauxton/app/modules/fauxton/components.js +++ b/src/fauxton/app/modules/fauxton/components.js @@ -207,6 +207,7 @@ function(app, FauxtonAPI, ace) { this.commands = options.commands; this.theme = options.theme || 'crimson_editor'; this.couchJSHINT = options.couchJSHINT; + this.edited = false; }, afterRender: function () { @@ -224,10 +225,27 @@ function(app, FauxtonAPI, ace) { } var that = this; - this.editor.getSession().on('change', function () { that.setHeightToLineCount(); + that.edited = true; + }); + + $(window).on('beforeunload.editor', function() { + if (that.edited) { + return 'Your changes have not been saved. Click cancel to return to the document.'; + } }); + + FauxtonAPI.beforeUnload("editor", function (deferred) { + if (that.edited) { + return 'Your changes have not been saved. Click cancel to return to the document.'; + } + }); + }, + + cleanup: function () { + $(window).off('beforeunload.editor'); + FauxtonAPI.removeBeforeUnload("editor"); }, setHeightToLineCount: function () { @@ -264,6 +282,10 @@ function(app, FauxtonAPI, ace) { }); }, + editSaved: function () { + this.edited = false; + }, + setValue: function (data, lineNumber) { lineNumber = lineNumber ? lineNumber : -1; this.editor.setValue(data, lineNumber); http://git-wip-us.apache.org/repos/asf/couchdb/blob/14cb47e5/src/fauxton/app/router.js ---------------------------------------------------------------------- diff --git a/src/fauxton/app/router.js b/src/fauxton/app/router.js index 9dac80c..e3a1636 100644 --- a/src/fauxton/app/router.js +++ b/src/fauxton/app/router.js @@ -47,9 +47,34 @@ function(req, app, Initialize, FauxtonAPI, Fauxton, Layout, Databases, Documents // TODO: auto generate this list if possible var modules = [Databases, Documents]; + var beforeUnloads = {}; + var Router = app.router = Backbone.Router.extend({ routes: {}, + beforeUnload: function (name, fn) { + beforeUnloads[name] = fn; + }, + + removeBeforeUnload: function (name) { + delete beforeUnloads[name]; + }, + + navigate: function (fragment, trigger) { + var continueNav = true, + msg = _.find(_.map(beforeUnloads, function (fn) { return fn(); }), function (beforeReturn) { + if (beforeReturn) { return true; } + }); + + if (msg) { + continueNav = window.confirm(msg); + } + + if (continueNav) { + Backbone.Router.prototype.navigate(fragment, trigger); + } + }, + addModuleRouteObject: function(RouteObject) { var that = this; var masterLayout = this.masterLayout, http://git-wip-us.apache.org/repos/asf/couchdb/blob/14cb47e5/src/fauxton/tasks/fauxton.js ---------------------------------------------------------------------- diff --git a/src/fauxton/tasks/fauxton.js b/src/fauxton/tasks/fauxton.js index bb68ddb..e54bab8 100644 --- a/src/fauxton/tasks/fauxton.js +++ b/src/fauxton/tasks/fauxton.js @@ -102,7 +102,7 @@ module.exports = function(grunt) { _.defaults(app, settings.app, { root: '/', - host: '../../', + host: '../..', version: "0.0" });
