navigation-knockout - npm Package Compare versions

Comparing version 1.0.0 to 1.1.0

lib/LinkUtility.js

 var Navigation = require('navigation');
 var ko = require('knockout');
-
 var LinkUtility = (function () {
@@ -8,53 +7,70 @@ function LinkUtility() {
     LinkUtility.setLink = function (element, linkAccessor) {
-        if (element.getAttribute('data-state-context-url') !== Navigation.StateContext.url) {
-            try  {
-                element.href = Navigation.settings.historyManager.getHref(linkAccessor());
-            } catch (e) {
-                element.removeAttribute('href');
-            }
-            element.setAttribute('data-state-context-url', Navigation.StateContext.url);
+        try {
+            element.href = Navigation.settings.historyManager.getHref(linkAccessor());
         }
+        catch (e) {
+            element.removeAttribute('href');
+        }
     };
-
     LinkUtility.getData = function (toData, includeCurrentData, currentDataKeys) {
-        var data = {};
-        toData = ko.unwrap(toData);
-        for (var key in toData) {
-            data[key] = ko.unwrap(toData[key]);
-        }
-        includeCurrentData = ko.unwrap(includeCurrentData);
-        currentDataKeys = ko.unwrap(currentDataKeys);
         if (currentDataKeys)
-            data = Navigation.StateContext.includeCurrentData(data, currentDataKeys.trim().split(/\s*,\s*/));
+            toData = Navigation.StateContext.includeCurrentData(toData, currentDataKeys.trim().split(/\s*,\s*/));
         if (includeCurrentData)
-            data = Navigation.StateContext.includeCurrentData(data);
-        return data;
+            toData = Navigation.StateContext.includeCurrentData(toData);
+        return toData;
     };
-
-    LinkUtility.addClickListener = function (element) {
-        var navigate = function (e) {
-            if (!e.ctrlKey && !e.shiftKey) {
+    LinkUtility.isActive = function (key, val) {
+        if (!Navigation.StateContext.state)
+            return false;
+        if (val != null && val.toString()) {
+            var trackTypes = Navigation.StateContext.state.trackTypes;
+            var currentVal = Navigation.StateContext.data[key];
+            return currentVal != null && (trackTypes ? val === currentVal : val.toString() == currentVal.toString());
+        }
+        return true;
+    };
+    LinkUtility.setActive = function (element, active, activeCssClass, disableActive) {
+        ko.utils.toggleDomNodeCssClass(element, activeCssClass, active);
+        if (active && disableActive)
+            element.removeAttribute('href');
+    };
+    LinkUtility.addListeners = function (element, setLink, allBindings, viewModel) {
+        var _this = this;
+        var lazy = !!allBindings.get('lazy');
+        ko.utils.registerEventHandler(element, 'click', function (e) {
+            if (lazy)
+                setLink();
+            if (!e.ctrlKey && !e.shiftKey && !e.metaKey && !e.altKey && !e.button) {
                 if (element.href) {
-                    if (e.preventDefault)
-                        e.preventDefault();
-                    else
-                        e['returnValue'] = false;
-                    Navigation.StateController.navigateLink(Navigation.settings.historyManager.getUrl(element));
+                    var link = Navigation.settings.historyManager.getUrl(element);
+                    var navigating = _this.getNavigating(allBindings, viewModel);
+                    if (navigating(e, link)) {
+                        if (e.preventDefault)
+                            e.preventDefault();
+                        else
+                            e['returnValue'] = false;
+                        Navigation.StateController.navigateLink(link);
+                    }
                 }
             }
+        });
+        if (!lazy) {
+            Navigation.StateController.onNavigate(setLink);
+            ko.utils.domNodeDisposal.addDisposeCallback(element, function () { return Navigation.StateController.offNavigate(setLink); });
+        }
+        else {
+            ko.utils.registerEventHandler(element, 'mousedown', function (e) { return setLink(); });
+            ko.utils.registerEventHandler(element, 'contextmenu', function (e) { return setLink(); });
+        }
+    };
+    LinkUtility.getNavigating = function (allBindings, viewModel) {
+        return function (e, link) {
+            var listener = ko.unwrap(allBindings.get('navigating'));
+            if (listener)
+                return listener.call(viewModel, viewModel, e, link);
+            return true;
         };
-        if (window.addEventListener)
-            element.addEventListener('click', navigate);
-        else
-            element.attachEvent('onclick', navigate);
     };
-
-    LinkUtility.addNavigateHandler = function (element, handler) {
-        Navigation.StateController.onNavigate(handler);
-        ko.utils.domNodeDisposal.addDisposeCallback(element, function () {
-            return Navigation.StateController.offNavigate(handler);
-        });
-    };
     return LinkUtility;
 })();
 module.exports = LinkUtility;

lib/NavigationBackLink.js

 var LinkUtility = require('./LinkUtility');
 var Navigation = require('navigation');
 var ko = require('knockout');
-
 var NavigationBackLink = ko.bindingHandlers['navigationBackLink'] = {
-    init: function (element, valueAccessor) {
-        LinkUtility.addClickListener(element);
-        LinkUtility.addNavigateHandler(element, function () {
-            return setNavigationBackLink(element, valueAccessor);
-        });
+    init: function (element, valueAccessor, allBindings, viewModel) {
+        LinkUtility.addListeners(element, function () { return setNavigationBackLink(element, valueAccessor); }, allBindings, viewModel);
     },
     update: function (element, valueAccessor) {
-        element.removeAttribute('data-state-context-url');
         setNavigationBackLink(element, valueAccessor);
     }
 };
-
 function setNavigationBackLink(element, valueAccessor) {
-    LinkUtility.setLink(element, function () {
-        return Navigation.StateController.getNavigationBackLink(ko.unwrap(valueAccessor()));
-    });
+    LinkUtility.setLink(element, function () { return Navigation.StateController.getNavigationBackLink(ko.unwrap(valueAccessor())); });
 }
 module.exports = NavigationBackLink;

lib/NavigationKnockout.js

 var NavigationBackLink = require('./NavigationBackLink');
 var NavigationLink = require('./NavigationLink');
 var RefreshLink = require('./RefreshLink');
-
 var NavigationKnockout = (function () {
@@ -6,0 +5,0 @@ function NavigationKnockout() {

lib/NavigationLink.js

 var LinkUtility = require('./LinkUtility');
 var Navigation = require('navigation');
 var ko = require('knockout');
-
 var NavigationLink = ko.bindingHandlers['navigationLink'] = {
-    init: function (element, valueAccessor, allBindings) {
-        LinkUtility.addClickListener(element);
-        LinkUtility.addNavigateHandler(element, function () {
-            return setNavigationLink(element, valueAccessor, allBindings);
-        });
+    init: function (element, valueAccessor, allBindings, viewModel) {
+        LinkUtility.addListeners(element, function () { return setNavigationLink(element, valueAccessor, allBindings); }, allBindings, viewModel);
     },
     update: function (element, valueAccessor, allBindings) {
-        element.removeAttribute('data-state-context-url');
         setNavigationLink(element, valueAccessor, allBindings);
     }
 };
-
 function setNavigationLink(element, valueAccessor, allBindings) {
-    LinkUtility.setLink(element, function () {
-        return Navigation.StateController.getNavigationLink(ko.unwrap(valueAccessor()), LinkUtility.getData(allBindings.get('toData'), allBindings.get('includeCurrentData'), allBindings.get('currentDataKeys')));
-    });
+    var action = ko.unwrap(valueAccessor());
+    var data = {};
+    var toData = ko.unwrap(allBindings.get('toData'));
+    var active = true;
+    for (var key in toData) {
+        var val = ko.unwrap(toData[key]);
+        data[key] = val;
+        active = active && LinkUtility.isActive(key, val);
+    }
+    LinkUtility.setLink(element, function () { return Navigation.StateController.getNavigationLink(action, LinkUtility.getData(data, ko.unwrap(allBindings.get('includeCurrentData')), ko.unwrap(allBindings.get('currentDataKeys')))); });
+    active = active && !!element.href && isActive(action);
+    LinkUtility.setActive(element, active, ko.unwrap(allBindings.get('activeCssClass')), ko.unwrap(allBindings.get('disableActive')));
 }
+function isActive(action) {
+    var nextState = Navigation.StateController.getNextState(action);
+    return nextState === nextState.parent.initial && nextState.parent === Navigation.StateContext.dialog;
+}
 module.exports = NavigationLink;

lib/RefreshLink.js

 var LinkUtility = require('./LinkUtility');
 var Navigation = require('navigation');
 var ko = require('knockout');
-
 var RefreshLink = ko.bindingHandlers['refreshLink'] = {
-    init: function (element, valueAccessor, allBindings) {
-        LinkUtility.addClickListener(element);
-        LinkUtility.addNavigateHandler(element, function () {
-            return setRefreshLink(element, valueAccessor, allBindings);
-        });
+    init: function (element, valueAccessor, allBindings, viewModel) {
+        LinkUtility.addListeners(element, function () { return setRefreshLink(element, valueAccessor, allBindings); }, allBindings, viewModel);
     },
     update: function (element, valueAccessor, allBindings) {
-        element.removeAttribute('data-state-context-url');
         setRefreshLink(element, valueAccessor, allBindings);
     }
 };
-
 function setRefreshLink(element, valueAccessor, allBindings) {
-    LinkUtility.setLink(element, function () {
-        return Navigation.StateController.getRefreshLink(LinkUtility.getData(valueAccessor(), allBindings.get('includeCurrentData'), allBindings.get('currentDataKeys')));
-    });
+    var data = {};
+    var toData = ko.unwrap(valueAccessor());
+    var active = true;
+    for (var key in toData) {
+        var val = ko.unwrap(toData[key]);
+        data[key] = val;
+        active = active && LinkUtility.isActive(key, val);
+    }
+    LinkUtility.setLink(element, function () { return Navigation.StateController.getRefreshLink(LinkUtility.getData(data, ko.unwrap(allBindings.get('includeCurrentData')), ko.unwrap(allBindings.get('currentDataKeys')))); });
+    active = active && !!element.href;
+    LinkUtility.setActive(element, active, ko.unwrap(allBindings.get('activeCssClass')), ko.unwrap(allBindings.get('disableActive')));
 }
 module.exports = RefreshLink;

package.json

 {
   "name": "navigation-knockout",
-  "version": "1.0.0",
+  "version": "1.1.0",
   "description": "A plugin for the Navigation routing library that lets you build Hyperlinks using Knockout's binding syntax",
@@ -5,0 +5,0 @@ "main": "navigation-knockout.js",

No alert changes

Improved metrics

Total package byte prevSize

8517

increased by26.97%

Lines of code

158

increased by20.61%

No dependency changes