| 1 | import {MultistateComponent} from "./multistatecomponent";
|
| 2 |
|
| 3 | export default class cjsNavigationBar extends MultistateComponent {
|
| 4 | constructor() {
|
| 5 | super();
|
| 6 | this.componentId = "cjsNavigationBar";
|
| 7 | this.template = require("./cjs-navigation-bar.html");
|
| 8 | }
|
| 9 | isNative() {
|
| 10 | return (window.NativeNav && true) || false;
|
| 11 | }
|
| 12 | updateTransitionSettings(self, thisState, otherState, position, isActivating) {
|
| 13 | console.log("navbar updateTransitionSettings - " + position + " - " + isActivating);
|
| 14 | // console.log(thisState);
|
| 15 | // set fields for individual components
|
| 16 | // position will be 0 for active, -1 or +1 for inactive depending on transition direction
|
| 17 | thisState.isActivating = isActivating;
|
| 18 | thisState.text = "Active? " + isActivating;
|
| 19 | if (isActivating) {
|
| 20 | if (thisState.available) {
|
| 21 | if (!otherState.available) {
|
| 22 | thisState.translateY = -80 * (Math.abs(position));
|
| 23 | } else {
|
| 24 | thisState.translateY = 0;
|
| 25 | }
|
| 26 | } else {
|
| 27 | thisState.translateY = -80;
|
| 28 | }
|
| 29 | thisState.opacity = 1;
|
| 30 | } else {
|
| 31 | thisState.opacity = 0;
|
| 32 | }
|
| 33 | }
|
| 34 | updateCurrentState(self, state, active, available, data) {
|
| 35 | console.log("navbar updateCurrentState");
|
| 36 | }
|
| 37 | setNativeState(self, route, active, available, data) {
|
| 38 | if (window.NativeNav) {
|
| 39 | window.NativeNav.showNavbar(route, active, data.leftButtons, data.title, data.rightButtons, data.titleChanged);
|
| 40 | }
|
| 41 | }
|
| 42 | controller($scope) {
|
| 43 | console.log("Navbar controller");
|
| 44 | super.controller($scope);
|
| 45 | var self = $scope.componentDefinition;
|
| 46 | self.scope = $scope;
|
| 47 | $scope.globalHeaderOptions = self.globalHeaderOptions = {};
|
| 48 |
|
| 49 | $scope.handleSharedHeaderButtonClick = function(state, b, lastTap) {
|
| 50 | var routeScope = self.app.scopesForRoutes[state.route];
|
| 51 | if (routeScope && b.action) {
|
| 52 | routeScope.$eval(b.action);
|
| 53 | } else if (routeScope && b.items) {
|
| 54 |
|
| 55 | self.app.setSharedUiComponentState(routeScope, "cjs-action-sheet", true, true, {
|
| 56 | element: lastTap.element,
|
| 57 | items: b.items
|
| 58 | });
|
| 59 | }
|
| 60 | };
|
| 61 |
|
| 62 | $scope.titleChanged = function(state) {
|
| 63 | var routeScope = self.app.scopesForRoutes[state.route];
|
| 64 | if (routeScope && state.data.titleChanged) {
|
| 65 | routeScope.$eval(state.data.titleChanged)(state.data.title);
|
| 66 | }
|
| 67 | };
|
| 68 | }
|
| 69 | /*
|
| 70 | setStatePartial: function(self, initialState, finalState, progress) {
|
| 71 | if (!self.globalHeaderOptions) return;
|
| 72 | var v1 = self.globalHeaderOptions.v1;
|
| 73 | if (v1 && v1.route == initialState.route) {
|
| 74 | self.globalHeaderOptions.v1 = initialState;
|
| 75 | self.globalHeaderOptions.v2 = finalState;
|
| 76 | self.globalHeaderOptions.transitionState = progress;
|
| 77 | } else {
|
| 78 | self.globalHeaderOptions.v2 = initialState;
|
| 79 | self.globalHeaderOptions.v1 = finalState;
|
| 80 | self.globalHeaderOptions.transitionState = 1 - progress;
|
| 81 | }
|
| 82 | if (progress < 0.5) {
|
| 83 | self.route = initialState.route;
|
| 84 | self.data = initialState.data;
|
| 85 | } else {
|
| 86 | self.route = finalState.route;
|
| 87 | self.data = finalState.data;
|
| 88 | }
|
| 89 |
|
| 90 |
|
| 91 | },
|
| 92 | */
|
| 93 | /*
|
| 94 | setState2: function(self, route, active, available, data) {
|
| 95 | if (!self.globalHeaderOptions) return;
|
| 96 |
|
| 97 | self.route = route;
|
| 98 | self.data = data;
|
| 99 |
|
| 100 | if (window.NativeNav) {
|
| 101 | window.NativeNav.showNavbar(route, active, data.leftButtons, data.title, data.rightButtons, data.titleChanged);
|
| 102 | } else {
|
| 103 | var v1 = self.globalHeaderOptions.v1;
|
| 104 | if (v1 && v1.route == route) {
|
| 105 | self.globalHeaderOptions.v1 = {
|
| 106 | route: route,
|
| 107 | active: active,
|
| 108 | available: available,
|
| 109 | data: data
|
| 110 | };
|
| 111 | self.globalHeaderOptions.transitionState = 0;
|
| 112 | } else {
|
| 113 | self.globalHeaderOptions.v2 = {
|
| 114 | route: route,
|
| 115 | active: active,
|
| 116 | available: available,
|
| 117 | data: data
|
| 118 | };
|
| 119 | self.globalHeaderOptions.transitionState = 1;
|
| 120 | }
|
| 121 | }
|
| 122 |
|
| 123 | }*/
|
| 124 |
|
| 125 | }
|