@coolon/angular-ui-powerups 12.4.0-alpha.32 → 12.4.0-alpha.34

package/fesm2015/coolon-angular-ui-powerups.js

@@ -5732,12 +5732,28 @@ PopupActivityTriggerComponent.propDecorators = {
     _interactionContext: [{ type: ViewChild, args: [PopupInteractionContextComponent, { static: true },] }]
 };
 
-class InlineEditorModel {
+class InlineEditorModel extends GarbageCollector {
     constructor(valueModel, saveCallback) {
+        super();
         this.valueModel = valueModel;
         this.saveCallback = saveCallback;
         this.editing = new MutableValueModel(false);
         this._validators = new MutableListModel();
+        this._editingEnabled = this.registerDisposable(new DelegatingValueModel().withDefault(true));
+        const { when } = Dsl.disposeWith(this);
+        when(this.editingEnabled).becomesFalsey(() => this.cancelEdit());
+    }
+    get editingEnabled() {
+        return this._editingEnabled.readonly;
+    }
+    disableWhile(condition) {
+        const { chain } = Dsl.disposeWith(this);
+        this.enableWhile(chain(condition).isFalsey());
+        return this;
+    }
+    enableWhile(condition) {
+        this._editingEnabled.setDelegate(condition);
+        return this;
     }
     get validators() {
         return this._validators.readonly;
@@ -5786,6 +5802,7 @@ TrackExternal.oneTimeBinding(InlineEditorModel);
 class InlineStringEditorComponent extends DisposableComponent {
     constructor(interactionService) {
         super();
+        this.editingEnabled = this.registerDisposable(new DelegatingValueModel());
         const { chain, when, valueOf } = Dsl.disposeWith(this);
         const modalIC = interactionService.createModalInteractionContextDisposedWith(this);
         const resolvedFacesModel = chain(this.facesModel).map(userFaces => {
@@ -5801,12 +5818,12 @@ class InlineStringEditorComponent extends DisposableComponent {
                 yield this.interactionContext.startActivity(StringInputActivity, this.createInputActivityData());
             }
             catch (e) {
-                // don't care, just hiding the console errors
+                // don't care if they cancelled, just hiding the console errors
             }
             finally {
                 this.editorModel.editing.value = false;
             }
-        }));
+        })).enableWhile(this.editingEnabled);
         this.onDispose(() => this.cancelEdit());
     }
     ngOnInit() {
@@ -5816,6 +5833,7 @@ class InlineStringEditorComponent extends DisposableComponent {
         if (!this.editorModel) {
             lang$1.illegalState('editorModel is required');
         }
+        this.editingEnabled.setDelegate(this.editorModel.editingEnabled);
         when(this.editorModel.editing).becomesTruthy(() => {
             this.editCommand.execute();
         }, { asLongAs: this.editCommand.enabled });
@@ -5863,7 +5881,7 @@ class InlineStringEditorComponent extends DisposableComponent {
 InlineStringEditorComponent.decorators = [
     { type: Component, args: [{
                 selector: 'aup-inline-string-editor',
-                template: "<ng-container *ngIf=\"!editorModel.isEditing()\">\n  <div class=\"content\" [class.editable]=\"editCommand.enabled.value\">\n    <label>{{label}}</label>\n    <p [class.place-holder]=\"empty.value\" (click)=\"editCommand.execute()\">{{displayValue.value}}</p>\n    <aup-command *ngIf=\"editCommand.enabled.value\" [command]=\"editCommand\" [faceModel]=\"editFaceModel\"></aup-command>\n  </div>\n</ng-container>\n<aup-in-place-interaction-context #interactionContext [animateFirstActivity]=\"false\"></aup-in-place-interaction-context>\n\n"
+                template: "<ng-container *ngIf=\"!editorModel.isEditing()\">\n  <div class=\"content\" [class.editable]=\"editCommand.enabled.value\">\n    <label>{{label}}</label>\n    <p [class.place-holder]=\"empty.value\" [class.editing-enabled]=\"editingEnabled.value\" (click)=\"editCommand.execute()\">{{displayValue.value}}</p>\n    <aup-command *ngIf=\"editCommand.enabled.value\" [command]=\"editCommand\" [faceModel]=\"editFaceModel\"></aup-command>\n  </div>\n</ng-container>\n<aup-in-place-interaction-context #interactionContext [animateFirstActivity]=\"false\"></aup-in-place-interaction-context>\n\n"
             },] }
 ];
 InlineStringEditorComponent.ctorParameters = () => [
@@ -6251,16 +6269,27 @@ class PlaceComponent extends DisposableComponent {
         when(this._active).becomesTruthy(() => this._notifyPlaceReady());
         this.childPlaces = this.placeDefinition.children.map(d => d.component);
     }
-    // @Trace()
     initialiseVisit(visit, notifyVisitChanged) {
         assert.isNil(this.visitModel.value);
         const { when } = Dsl.disposeWith(this);
         this.visitModel.value = visit;
         DebugContext.getOrCreate(this.visitModel).tag(`${this.placeDefinition.component.name}.visitModel`);
-        this.placeDefinition.getVisitParameterDefs().forEach(parameterDef => this.installBinding(parameterDef));
+        // we track if the any of the bindings updated the route.  If so we remember it and update the
+        // route in one go at the end.
+        this.placeDefinition
+            .getVisitParameterDefs()
+            .forEach(parameterDef => this.installAndInitialiseBinding(visit, parameterDef));
         when(this.visitModel).changes((current, previous) => {
             notifyVisitChanged(current, previous);
         }, { unless: this._inVisitUpdate });
+        // TODO: this needs to do a replace url option so that the new url isn't put in the history.... for
+        //       now we're not doing it as it's a fair bit of effort and will only affect people if they're
+        //       cutting and pasting urls to each other.
+        // // the binding process can update the visit (e.g. if a selection model has already selected during
+        // // component construction) and there was no value specified in the route
+        // if (visit.hasRoutingChangedFrom(this.visitModel.value)) {
+        //   notifyVisitChanged(this.visitModel.value, visit)
+        // }
     }
     updateVisit(visit) {
         assert.isTruthy(this.isInitialised());
@@ -6273,7 +6302,12 @@ class PlaceComponent extends DisposableComponent {
         return !!this.visitModel.value;
     }
     // @Trace()
-    installBinding(parameterDef) {
+    /**
+     * Initialised the component bindings.  If any binding has an initial model value (e.g. a selection model
+     * initialised during the constructor) and the route has nothing, then the visit will be udpated and this
+     * method will return ture to nofiy the the visit has changed.
+     */
+    installAndInitialiseBinding(initialVisit, parameterDef) {
         const model = this[parameterDef.propertyName];
         DebugContext.tag(model, `${this.placeDefinition.component.name}.${parameterDef.propertyName}`);
         const binding = this.registerDisposable(new Binding(this.visitModel, model, {
@@ -6287,7 +6321,17 @@ class PlaceComponent extends DisposableComponent {
                 return currentVisit.replace(parameterDef, value);
             }
         }));
-        binding.writeRight();
+        // Now we need to initialise the binding direction.  If we have a value in the Url then we should always push
+        // that to the view.  If we don't and the view already has a value (e.g. a selection model has already initialised in the
+        // component constructor) then we should push that to the route.
+        const isInVisit = !_.isNil(initialVisit.getParameterValue(parameterDef));
+        const isInModel = !_.isNil(model.value);
+        if (!isInVisit && isInModel) {
+            binding.writeLeft(); // push it to the route
+        }
+        else {
+            binding.writeRight(); // push it to the model
+        }
     }
     get placeDefinition() {
         const definition = PlaceComponent.getDefinition(this.constructor);
@@ -7407,9 +7451,13 @@ class Visit {
         });
         return new Visit(this.placeDefinition, params);
     }
+    // @Trace()
     hasRoutingChangedFrom(other) {
         const samePlace = other.placeDefinition === this.placeDefinition;
-        const sameRouteParameters = _.isEqual(this.placeDefinition.getFormattedRouteParameters(this, true), this.placeDefinition.getFormattedRouteParameters(other, true));
+        const currentParams = this.placeDefinition.getFormattedRouteParameters(this, true);
+        const otherParams = this.placeDefinition.getFormattedRouteParameters(other, true);
+        // console.log({currentParams, otherParams});
+        const sameRouteParameters = _.isEqual(currentParams, otherParams);
         return !samePlace || !sameRouteParameters;
     }
     hasChangedFrom(other) {