diff --git a/docs/change-log.md b/docs/change-log.md index 63550a07..cf274a09 100644 --- a/docs/change-log.md +++ b/docs/change-log.md @@ -2,6 +2,10 @@ [v0.1.16](/mithril/archive/v0.1.6) - maintenance +### News: + +- controller::onunload now receives an event parameter so that the unloading can be aborted [#135](https://github.com/lhorie/mithril.js/issues/135) + ### Bug Fixes: - prevent route change when only hash changes in non-hash mode [#107](https://github.com/lhorie/mithril.js/issues/107) diff --git a/docs/mithril.module.md b/docs/mithril.module.md index 43a88691..9f733147 100644 --- a/docs/mithril.module.md +++ b/docs/mithril.module.md @@ -129,6 +129,17 @@ m.module(document, module2); // logs "unloading module 1" This mechanism is useful to clear timers and unsubscribe event handlers. If you have a hierarchy of components, you can recursively call `onunload` on all the components in the tree or use a [pubsub](http://microjs.com/#pubsub) library to unload specific components on demand. +You can also use this event to prevent a module from being unloaded (e.g. to alert a user to save their changes before navigating away from a page) + +```javascript +var module1 = {} +module1.controller = function() { + this.onunload = function(e) { + if (!confirm("are you sure you want to leave this page?")) e.preventDefault() + } +} +``` + --- ### Signature @@ -140,7 +151,8 @@ void module(DOMElement rootElement, Module module) where: Module :: Object { Controller, void view(Object controllerInstance) } - Controller :: void controller() | void controller() { prototype: void unload() } + Controller :: void controller() | void controller() { prototype: void unload(UnloadEvent e) } + UnloadEvent :: Object {void preventDefault()} ``` - **DOMElement rootElement** diff --git a/mithril.js b/mithril.js index 6f87333b..11c92a6f 100644 --- a/mithril.js +++ b/mithril.js @@ -297,14 +297,22 @@ Mithril = m = new function app(window) { var roots = [], modules = [], controllers = [], now = 0, lastRedraw = 0, lastRedrawId = 0, computePostRedrawHook = null m.module = function(root, module) { - m.startComputation() var index = roots.indexOf(root) if (index < 0) index = roots.length - roots[index] = root - modules[index] = module - if (controllers[index] && typeof controllers[index].onunload == "function") controllers[index].onunload() - controllers[index] = new module.controller - m.endComputation() + var isPrevented = false + if (controllers[index] && typeof controllers[index].onunload == "function") { + var event = { + preventDefault: function() {isPrevented = true} + } + controllers[index].onunload(event) + } + if (!isPrevented) { + m.startComputation() + roots[index] = root + modules[index] = module + controllers[index] = new module.controller + m.endComputation() + } } m.redraw = function() { now = window.performance && window.performance.now ? window.performance.now() : new window.Date().getTime()