@the-liberators/ngx-scrumteamsurvey-tools 2.3.92 → 2.3.94

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -754,7 +754,7 @@ class UserSpecificSettingsDto {
754
754
  constructor() {
755
755
  this.teamFilter = new TeamListFilter();
756
756
  this.userFilter = new UserListFilter();
757
- this.modelFilter = new ModelFilter(InterventionFilterType.All);
757
+ this.modelFilter = new ModelFilter();
758
758
  this.interventionFilter = new ActionListFilter();
759
759
  this.guideSettings = new GuideSettingsDto();
760
760
  }
@@ -765,9 +765,9 @@ class GuideSettingsDto {
765
765
  }
766
766
  }
767
767
  class ModelFilter {
768
- constructor(interventionFilterType) {
768
+ constructor() {
769
769
  this.layers = [];
770
- this.interventionFilter = interventionFilterType;
770
+ this.interventionFilter = InterventionFilterType.All;
771
771
  }
772
772
  }
773
773
  class ModelVisualizationLayer {
@@ -4808,21 +4808,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImpor
4808
4808
  }] } });
4809
4809
 
4810
4810
  class ModelFactorIndicatorComponent extends ComponentWithViewStateBase {
4811
- constructor(state, userSettingsService, snackBar, arrowUpdateService) {
4811
+ constructor(state, userSettings, userSettingService, snackBar, arrowUpdateService) {
4812
4812
  super(state, snackBar);
4813
4813
  this.state = state;
4814
- this.userSettingsService = userSettingsService;
4814
+ this.userSettings = userSettings;
4815
+ this.userSettingService = userSettingService;
4815
4816
  this.snackBar = snackBar;
4816
4817
  this.arrowUpdateService = arrowUpdateService;
4817
4818
  this.expandIndicators = true;
4818
4819
  this.InterventionStateEnum = InterventionStateEnum;
4819
- this.settings = this.userSettingsService.get();
4820
4820
  }
4821
4821
  ngOnInit() {
4822
4822
  super.ngOnInit();
4823
- this.settingsSubscription = this.userSettingsService.changed.subscribe((settings) => {
4824
- this.settings = settings;
4825
- if (this.settings.user.modelFilter.advanced !== this.expandIndicators) {
4823
+ this.settingsSubscription = this.userSettingService.changed.subscribe((settings) => {
4824
+ if (this.userSettings.settings.user.modelFilter.advanced !== this.expandIndicators) {
4826
4825
  this.toggleIndicators();
4827
4826
  }
4828
4827
  this.setIsInActiveLayer();
@@ -4839,6 +4838,9 @@ class ModelFactorIndicatorComponent extends ComponentWithViewStateBase {
4839
4838
  }
4840
4839
  onDataUpdate(data) {
4841
4840
  this.factorScore = data.factorScores.factorScores.find(p => p.key == this.indicator.publicKey);
4841
+ if (this.factorScore == null) {
4842
+ return;
4843
+ }
4842
4844
  this.delta = data.factorScores.delta;
4843
4845
  this.baseUrl = data.baseUrl;
4844
4846
  this.benchmark = data.factorScores.benchmark;
@@ -4849,24 +4851,27 @@ class ModelFactorIndicatorComponent extends ComponentWithViewStateBase {
4849
4851
  }
4850
4852
  ;
4851
4853
  setIsInActiveLayer() {
4852
- if (this.settings.user.modelFilter.layers.length == 0) {
4854
+ if (this.userSettings.settings.user.modelFilter.layers.length == 0) {
4853
4855
  this.isInActiveLayer = true;
4854
4856
  return;
4855
4857
  }
4856
4858
  this.isInActiveLayer =
4857
- (this.settings.user.modelFilter.layers.find(p => p.key == "TeamMembers" && p.selected) != null && this.factorScore.points.find(p => p.name == "TeamMember") != null) ||
4858
- (this.settings.user.modelFilter.layers.find(p => p.key == "Stakeholders" && p.selected) != null && this.factorScore.points.find(p => p.name == "Stakeholder") != null) ||
4859
- (this.settings.user.modelFilter.layers.find(p => p.key == "Supporters" && p.selected) != null && this.factorScore.points.find(p => p.name == "Supporter") != null);
4859
+ (this.userSettings.settings.user.modelFilter.layers.find(p => p.key == "TeamMembers" && p.selected) != null && this.factorScore.points.find(p => p.name == "TeamMember") != null) ||
4860
+ (this.userSettings.settings.user.modelFilter.layers.find(p => p.key == "Stakeholders" && p.selected) != null && this.factorScore.points.find(p => p.name == "Stakeholder") != null) ||
4861
+ (this.userSettings.settings.user.modelFilter.layers.find(p => p.key == "Supporters" && p.selected) != null && this.factorScore.points.find(p => p.name == "Supporter") != null);
4860
4862
  }
4861
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: ModelFactorIndicatorComponent, deps: [{ token: VIEWSTATE_PROVIDER }, { token: UserSettingService }, { token: i1.MatSnackBar }, { token: ArrowUpdateService }], target: i0.ɵɵFactoryTarget.Component }); }
4862
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.0", type: ModelFactorIndicatorComponent, isStandalone: false, selector: "model-factor-indicator", inputs: { indicator: "indicator", actionStatusPosition: "actionStatusPosition", visible: "visible" }, usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"visible\">\n <div [class]=\"'factor-indicator factor-indicator-actions-' + actionStatusPosition + ' factor-indicator-' + direction\" [ngClass]=\"{'factor-fade' : !isInActiveLayer || !dataAvailable}\" [id]=\"'factor-' + indicator.publicKey\" #factorAnchor>\n <div class=\"factor-actions\" *ngIf=\"(notes.length > 0 || factorScore.interventionSummary.impeded > 0 || factorScore.interventionSummary.open > 0) && settings.user.modelFilter.advanced\">\n <div class=\"factor-actions-status\" *ngIf=\"factorScore.interventionSummary.open > 0\">\n <span [routerLink]=\"[baseUrl, 'actions']\" [queryParams]=\"{ state: InterventionStateEnum.open, expectedImpactOn: indicator.publicKey }\">{{factorScore.interventionSummary.open}}</span>/\n <span [routerLink]=\"[baseUrl, 'actions']\" [queryParams]=\"{ state: InterventionStateEnum.completed, expectedImpactOn: indicator.publicKey }\">{{factorScore.interventionSummary.completed}}</span>\n </div>\n <div class=\"factor-actions-impeded\" *ngIf=\"factorScore.interventionSummary.impeded > 0\" [routerLink]=\"[baseUrl, 'actions']\" [queryParams]=\"{ state: InterventionStateEnum.impeded, expectedImpactOn: indicator.publicKey }\">\n <img class=\"icon\" src=\"/assets/img/impeded.svg\" /> {{factorScore.interventionSummary.impeded}}\n </div>\n <div class=\"factor-warnings\" *ngIf=\"notes.length > 0\" notesDialog [notes]=\"notes\">\n <span class=\"icon ph-warning-fill\" title=\"There are some issues in the data that might influence your interpretations\"></span>\n </div>\n </div>\n\n <div class=\"factor-content\" (click)=\"popover.open()\">\n <div class=\"factor-name\">\n {{indicator.name}}\n </div>\n <progressbar [factorScore]=\"factorScore\"></progressbar>\n <div class=\"factor-details\">\n <age-indicator [lastMeasured]=\"factorScore.lastMeasured\" *ngIf=\"settings.user.modelFilter.advanced\"></age-indicator>\n <delta-arrow *ngIf=\"dataAvailable\" [factorScore]=\"factorScore\" [delta]=\"delta\" [noDataIndicator]=\"false\"></delta-arrow>\n </div>\n </div>\n <div class=\"factor-anchor\" [id]=\"'factor-' + indicator.publicKey + '-anchor'\">\n </div>\n </div>\n\n <sat-popover #popover horizontalAlign=\"after\" [anchor]=\"factorAnchor\" verticalAlign=\"center\" [hasBackdrop]=\"true\" [autoFocus]=\"false\">\n <div class=\"popover\" [id]=\"'popover-' + indicator.publicKey\">\n <div class=\"popover-container\">\n <span (click)=\"popover.close()\" class=\"close ph-x\"></span>\n <h3 factorInformationDialog [factor]=\"indicator\">\n {{indicator.name}}\n <span class=\"icon ph-info-fill\"></span>\n </h3>\n <div class=\"description\">{{indicator.description}}</div>\n\n <model-factor-benchmark [factor]=\"factorScore\" [benchmark]=\"benchmark\"></model-factor-benchmark>\n <model-factor-breakdown [factor]=\"factorScore\"></model-factor-breakdown>\n <quicktips [dimensionKey]=\"indicator.publicKey\" [extraClass]=\"'quicktips-popover'\"></quicktips>\n\n <div class=\"link\" *ngIf=\"factorScore.recommendation.available\">\n <a [routerLink]=\"[baseUrl, 'tips']\" [fragment]=\"indicator.publicKey\">discover how to improve ></a>\n </div>\n </div>\n <div class=\"arrow\"></div>\n </div>\n </sat-popover>\n</ng-container>\n", styles: [".smallTextUppercase{font-family:StevieSansThin,sans-serif;font-style:normal;font-weight:400;font-size:15px;line-height:140%;text-transform:uppercase;line-height:100%}.bigletteredbutton{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;text-decoration:none;background:#ffffff1a;margin-bottom:10px;display:flex;align-content:center;border-radius:20px;padding:15px;font-size:24px;border:2px solid #1F3F8F;border-bottom:6px solid #1F3F8F;color:#fff;align-items:center;cursor:pointer}.bigletteredbutton .free{font-family:StevieSansThin,sans-serif;font-style:normal;font-weight:400;font-size:15px;line-height:140%;background:#fff73f;color:#2f2f2f;padding:3px 5px;margin-left:20px;border-radius:10px}.bigletteredbutton .plan{font-family:StevieSansThin,sans-serif;font-style:normal;font-weight:400;font-size:15px;line-height:140%;background:#fff;color:#2f2f2f;padding:3px 5px;margin-left:20px;border-radius:10px}.bigletteredbutton:hover,.bigletteredbutton.selected{border:2px solid #fff73f;border-bottom:6px solid #fff73f}.bigletteredbutton .button-letter{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;border-radius:30px;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center;background:#fff73f;color:#1f3f8f;margin-right:20px}.bigletteredbutton .button-letter .ph{color:#1f3f8f}.bigletteredbutton .button-letter:hover{background:#1f3f8f;color:#fff73f}.bigletteredbutton .button-letter:hover .ph{color:#fff73f}.roundicon-yellow{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;border-radius:30px;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center;background:#fff73f;color:#1f3f8f}.roundicon-yellow .ph{color:#1f3f8f}.roundicon-yellow:hover{background:#1f3f8f;color:#fff73f}.roundicon-yellow:hover .ph{color:#fff73f}.roundicon{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;border-radius:30px;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center}.roundicon-large{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center;border-radius:60px;height:120px;width:120px}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: DeltaArrowComponent, selector: "delta-arrow", inputs: ["factorScore", "delta", "noDataIndicator"] }, { kind: "component", type: AgeIndicatorComponent, selector: "age-indicator", inputs: ["lastMeasured"] }, { kind: "component", type: QuickTipsComponent, selector: "quicktips", inputs: ["dimensionKey", "extraClass"] }, { kind: "component", type: ModelFactorBreakdownComponent, selector: "model-factor-breakdown", inputs: ["factor", "pageSize"] }, { kind: "directive", type: OpenNotesDialogDirective, selector: "[notesDialog]", inputs: ["notes"] }, { kind: "component", type: i11.SatPopoverComponent, selector: "sat-popover", inputs: ["anchor", "horizontalAlign", "xAlign", "verticalAlign", "yAlign", "forceAlignment", "lockAlignment", "autoFocus", "restoreFocus", "scrollStrategy", "hasBackdrop", "interactiveClose", "openTransition", "closeTransition", "openAnimationStartAtScale", "closeAnimationEndAtScale", "backdropClass", "panelClass"], outputs: ["opened", "closed", "afterOpen", "afterClose", "backdropClicked", "overlayKeydown"] }, { kind: "directive", type: OpenFactorInformationDialogDirective, selector: "[factorInformationDialog]", inputs: ["factor"] }, { kind: "component", type: ProgressbarComponent, selector: "progressbar", inputs: ["factorScore"] }, { kind: "component", type: ModelFactorBenchmarkComponent, selector: "model-factor-benchmark", inputs: ["factor", "benchmark"] }] }); }
4863
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: ModelFactorIndicatorComponent, deps: [{ token: VIEWSTATE_PROVIDER }, { token: VIEWSTATE_USERSETTINGS_STRATEGY }, { token: UserSettingService }, { token: i1.MatSnackBar }, { token: ArrowUpdateService }], target: i0.ɵɵFactoryTarget.Component }); }
4864
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.0", type: ModelFactorIndicatorComponent, isStandalone: false, selector: "model-factor-indicator", inputs: { indicator: "indicator", actionStatusPosition: "actionStatusPosition", visible: "visible" }, usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"visible\">\n <div [class]=\"'factor-indicator factor-indicator-actions-' + actionStatusPosition + ' factor-indicator-' + direction\" [ngClass]=\"{'factor-fade' : !isInActiveLayer || !dataAvailable}\" [id]=\"'factor-' + indicator.publicKey\" #factorAnchor>\n <div class=\"factor-actions\" *ngIf=\"(notes.length > 0 || factorScore.interventionSummary.impeded > 0 || factorScore.interventionSummary.open > 0) && userSettings.settings.user.modelFilter.advanced\">\n <div class=\"factor-actions-status\" *ngIf=\"factorScore.interventionSummary.open > 0\">\n <span [routerLink]=\"[baseUrl, 'actions']\" [queryParams]=\"{ state: InterventionStateEnum.open, expectedImpactOn: indicator.publicKey }\">{{factorScore.interventionSummary.open}}</span>/\n <span [routerLink]=\"[baseUrl, 'actions']\" [queryParams]=\"{ state: InterventionStateEnum.completed, expectedImpactOn: indicator.publicKey }\">{{factorScore.interventionSummary.completed}}</span>\n </div>\n <div class=\"factor-actions-impeded\" *ngIf=\"factorScore.interventionSummary.impeded > 0\" [routerLink]=\"[baseUrl, 'actions']\" [queryParams]=\"{ state: InterventionStateEnum.impeded, expectedImpactOn: indicator.publicKey }\">\n <img class=\"icon\" src=\"/assets/img/impeded.svg\" /> {{factorScore.interventionSummary.impeded}}\n </div>\n <div class=\"factor-warnings\" *ngIf=\"notes.length > 0\" notesDialog [notes]=\"notes\">\n <span class=\"icon ph-warning-fill\" title=\"There are some issues in the data that might influence your interpretations\"></span>\n </div>\n </div>\n\n <div class=\"factor-content\" (click)=\"popover.open()\">\n <div class=\"factor-name\">\n {{indicator.name}}\n </div>\n <progressbar [factorScore]=\"factorScore\"></progressbar>\n <div class=\"factor-details\">\n <age-indicator [lastMeasured]=\"factorScore.lastMeasured\" *ngIf=\"userSettings.settings.user.modelFilter.advanced\"></age-indicator>\n <delta-arrow *ngIf=\"dataAvailable\" [factorScore]=\"factorScore\" [delta]=\"delta\" [noDataIndicator]=\"false\"></delta-arrow>\n </div>\n </div>\n <div class=\"factor-anchor\" [id]=\"'factor-' + indicator.publicKey + '-anchor'\">\n </div>\n </div>\n\n <sat-popover #popover horizontalAlign=\"after\" [anchor]=\"factorAnchor\" verticalAlign=\"center\" [hasBackdrop]=\"true\" [autoFocus]=\"false\">\n <div class=\"popover\" [id]=\"'popover-' + indicator.publicKey\">\n <div class=\"popover-container\">\n <span (click)=\"popover.close()\" class=\"close ph-x\"></span>\n <h3 factorInformationDialog [factor]=\"indicator\">\n {{indicator.name}}\n <span class=\"icon ph-info-fill\"></span>\n </h3>\n <div class=\"description\">{{indicator.description}}</div>\n\n <model-factor-benchmark [factor]=\"factorScore\" [benchmark]=\"benchmark\"></model-factor-benchmark>\n <model-factor-breakdown [factor]=\"factorScore\"></model-factor-breakdown>\n <quicktips [dimensionKey]=\"indicator.publicKey\" [extraClass]=\"'quicktips-popover'\"></quicktips>\n\n <div class=\"link\" *ngIf=\"factorScore.recommendation.available\">\n <a [routerLink]=\"[baseUrl, 'tips']\" [fragment]=\"indicator.publicKey\">discover how to improve ></a>\n </div>\n </div>\n <div class=\"arrow\"></div>\n </div>\n </sat-popover>\n</ng-container>\n", styles: [".smallTextUppercase{font-family:StevieSansThin,sans-serif;font-style:normal;font-weight:400;font-size:15px;line-height:140%;text-transform:uppercase;line-height:100%}.bigletteredbutton{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;text-decoration:none;background:#ffffff1a;margin-bottom:10px;display:flex;align-content:center;border-radius:20px;padding:15px;font-size:24px;border:2px solid #1F3F8F;border-bottom:6px solid #1F3F8F;color:#fff;align-items:center;cursor:pointer}.bigletteredbutton .free{font-family:StevieSansThin,sans-serif;font-style:normal;font-weight:400;font-size:15px;line-height:140%;background:#fff73f;color:#2f2f2f;padding:3px 5px;margin-left:20px;border-radius:10px}.bigletteredbutton .plan{font-family:StevieSansThin,sans-serif;font-style:normal;font-weight:400;font-size:15px;line-height:140%;background:#fff;color:#2f2f2f;padding:3px 5px;margin-left:20px;border-radius:10px}.bigletteredbutton:hover,.bigletteredbutton.selected{border:2px solid #fff73f;border-bottom:6px solid #fff73f}.bigletteredbutton .button-letter{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;border-radius:30px;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center;background:#fff73f;color:#1f3f8f;margin-right:20px}.bigletteredbutton .button-letter .ph{color:#1f3f8f}.bigletteredbutton .button-letter:hover{background:#1f3f8f;color:#fff73f}.bigletteredbutton .button-letter:hover .ph{color:#fff73f}.roundicon-yellow{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;border-radius:30px;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center;background:#fff73f;color:#1f3f8f}.roundicon-yellow .ph{color:#1f3f8f}.roundicon-yellow:hover{background:#1f3f8f;color:#fff73f}.roundicon-yellow:hover .ph{color:#fff73f}.roundicon{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;border-radius:30px;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center}.roundicon-large{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center;border-radius:60px;height:120px;width:120px}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: DeltaArrowComponent, selector: "delta-arrow", inputs: ["factorScore", "delta", "noDataIndicator"] }, { kind: "component", type: AgeIndicatorComponent, selector: "age-indicator", inputs: ["lastMeasured"] }, { kind: "component", type: QuickTipsComponent, selector: "quicktips", inputs: ["dimensionKey", "extraClass"] }, { kind: "component", type: ModelFactorBreakdownComponent, selector: "model-factor-breakdown", inputs: ["factor", "pageSize"] }, { kind: "directive", type: OpenNotesDialogDirective, selector: "[notesDialog]", inputs: ["notes"] }, { kind: "component", type: i11.SatPopoverComponent, selector: "sat-popover", inputs: ["anchor", "horizontalAlign", "xAlign", "verticalAlign", "yAlign", "forceAlignment", "lockAlignment", "autoFocus", "restoreFocus", "scrollStrategy", "hasBackdrop", "interactiveClose", "openTransition", "closeTransition", "openAnimationStartAtScale", "closeAnimationEndAtScale", "backdropClass", "panelClass"], outputs: ["opened", "closed", "afterOpen", "afterClose", "backdropClicked", "overlayKeydown"] }, { kind: "directive", type: OpenFactorInformationDialogDirective, selector: "[factorInformationDialog]", inputs: ["factor"] }, { kind: "component", type: ProgressbarComponent, selector: "progressbar", inputs: ["factorScore"] }, { kind: "component", type: ModelFactorBenchmarkComponent, selector: "model-factor-benchmark", inputs: ["factor", "benchmark"] }] }); }
4863
4865
  }
4864
4866
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: ModelFactorIndicatorComponent, decorators: [{
4865
4867
  type: Component,
4866
- args: [{ selector: 'model-factor-indicator', standalone: false, template: "<ng-container *ngIf=\"visible\">\n <div [class]=\"'factor-indicator factor-indicator-actions-' + actionStatusPosition + ' factor-indicator-' + direction\" [ngClass]=\"{'factor-fade' : !isInActiveLayer || !dataAvailable}\" [id]=\"'factor-' + indicator.publicKey\" #factorAnchor>\n <div class=\"factor-actions\" *ngIf=\"(notes.length > 0 || factorScore.interventionSummary.impeded > 0 || factorScore.interventionSummary.open > 0) && settings.user.modelFilter.advanced\">\n <div class=\"factor-actions-status\" *ngIf=\"factorScore.interventionSummary.open > 0\">\n <span [routerLink]=\"[baseUrl, 'actions']\" [queryParams]=\"{ state: InterventionStateEnum.open, expectedImpactOn: indicator.publicKey }\">{{factorScore.interventionSummary.open}}</span>/\n <span [routerLink]=\"[baseUrl, 'actions']\" [queryParams]=\"{ state: InterventionStateEnum.completed, expectedImpactOn: indicator.publicKey }\">{{factorScore.interventionSummary.completed}}</span>\n </div>\n <div class=\"factor-actions-impeded\" *ngIf=\"factorScore.interventionSummary.impeded > 0\" [routerLink]=\"[baseUrl, 'actions']\" [queryParams]=\"{ state: InterventionStateEnum.impeded, expectedImpactOn: indicator.publicKey }\">\n <img class=\"icon\" src=\"/assets/img/impeded.svg\" /> {{factorScore.interventionSummary.impeded}}\n </div>\n <div class=\"factor-warnings\" *ngIf=\"notes.length > 0\" notesDialog [notes]=\"notes\">\n <span class=\"icon ph-warning-fill\" title=\"There are some issues in the data that might influence your interpretations\"></span>\n </div>\n </div>\n\n <div class=\"factor-content\" (click)=\"popover.open()\">\n <div class=\"factor-name\">\n {{indicator.name}}\n </div>\n <progressbar [factorScore]=\"factorScore\"></progressbar>\n <div class=\"factor-details\">\n <age-indicator [lastMeasured]=\"factorScore.lastMeasured\" *ngIf=\"settings.user.modelFilter.advanced\"></age-indicator>\n <delta-arrow *ngIf=\"dataAvailable\" [factorScore]=\"factorScore\" [delta]=\"delta\" [noDataIndicator]=\"false\"></delta-arrow>\n </div>\n </div>\n <div class=\"factor-anchor\" [id]=\"'factor-' + indicator.publicKey + '-anchor'\">\n </div>\n </div>\n\n <sat-popover #popover horizontalAlign=\"after\" [anchor]=\"factorAnchor\" verticalAlign=\"center\" [hasBackdrop]=\"true\" [autoFocus]=\"false\">\n <div class=\"popover\" [id]=\"'popover-' + indicator.publicKey\">\n <div class=\"popover-container\">\n <span (click)=\"popover.close()\" class=\"close ph-x\"></span>\n <h3 factorInformationDialog [factor]=\"indicator\">\n {{indicator.name}}\n <span class=\"icon ph-info-fill\"></span>\n </h3>\n <div class=\"description\">{{indicator.description}}</div>\n\n <model-factor-benchmark [factor]=\"factorScore\" [benchmark]=\"benchmark\"></model-factor-benchmark>\n <model-factor-breakdown [factor]=\"factorScore\"></model-factor-breakdown>\n <quicktips [dimensionKey]=\"indicator.publicKey\" [extraClass]=\"'quicktips-popover'\"></quicktips>\n\n <div class=\"link\" *ngIf=\"factorScore.recommendation.available\">\n <a [routerLink]=\"[baseUrl, 'tips']\" [fragment]=\"indicator.publicKey\">discover how to improve ></a>\n </div>\n </div>\n <div class=\"arrow\"></div>\n </div>\n </sat-popover>\n</ng-container>\n", styles: [".smallTextUppercase{font-family:StevieSansThin,sans-serif;font-style:normal;font-weight:400;font-size:15px;line-height:140%;text-transform:uppercase;line-height:100%}.bigletteredbutton{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;text-decoration:none;background:#ffffff1a;margin-bottom:10px;display:flex;align-content:center;border-radius:20px;padding:15px;font-size:24px;border:2px solid #1F3F8F;border-bottom:6px solid #1F3F8F;color:#fff;align-items:center;cursor:pointer}.bigletteredbutton .free{font-family:StevieSansThin,sans-serif;font-style:normal;font-weight:400;font-size:15px;line-height:140%;background:#fff73f;color:#2f2f2f;padding:3px 5px;margin-left:20px;border-radius:10px}.bigletteredbutton .plan{font-family:StevieSansThin,sans-serif;font-style:normal;font-weight:400;font-size:15px;line-height:140%;background:#fff;color:#2f2f2f;padding:3px 5px;margin-left:20px;border-radius:10px}.bigletteredbutton:hover,.bigletteredbutton.selected{border:2px solid #fff73f;border-bottom:6px solid #fff73f}.bigletteredbutton .button-letter{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;border-radius:30px;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center;background:#fff73f;color:#1f3f8f;margin-right:20px}.bigletteredbutton .button-letter .ph{color:#1f3f8f}.bigletteredbutton .button-letter:hover{background:#1f3f8f;color:#fff73f}.bigletteredbutton .button-letter:hover .ph{color:#fff73f}.roundicon-yellow{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;border-radius:30px;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center;background:#fff73f;color:#1f3f8f}.roundicon-yellow .ph{color:#1f3f8f}.roundicon-yellow:hover{background:#1f3f8f;color:#fff73f}.roundicon-yellow:hover .ph{color:#fff73f}.roundicon{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;border-radius:30px;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center}.roundicon-large{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center;border-radius:60px;height:120px;width:120px}\n"] }]
4868
+ args: [{ selector: 'model-factor-indicator', standalone: false, template: "<ng-container *ngIf=\"visible\">\n <div [class]=\"'factor-indicator factor-indicator-actions-' + actionStatusPosition + ' factor-indicator-' + direction\" [ngClass]=\"{'factor-fade' : !isInActiveLayer || !dataAvailable}\" [id]=\"'factor-' + indicator.publicKey\" #factorAnchor>\n <div class=\"factor-actions\" *ngIf=\"(notes.length > 0 || factorScore.interventionSummary.impeded > 0 || factorScore.interventionSummary.open > 0) && userSettings.settings.user.modelFilter.advanced\">\n <div class=\"factor-actions-status\" *ngIf=\"factorScore.interventionSummary.open > 0\">\n <span [routerLink]=\"[baseUrl, 'actions']\" [queryParams]=\"{ state: InterventionStateEnum.open, expectedImpactOn: indicator.publicKey }\">{{factorScore.interventionSummary.open}}</span>/\n <span [routerLink]=\"[baseUrl, 'actions']\" [queryParams]=\"{ state: InterventionStateEnum.completed, expectedImpactOn: indicator.publicKey }\">{{factorScore.interventionSummary.completed}}</span>\n </div>\n <div class=\"factor-actions-impeded\" *ngIf=\"factorScore.interventionSummary.impeded > 0\" [routerLink]=\"[baseUrl, 'actions']\" [queryParams]=\"{ state: InterventionStateEnum.impeded, expectedImpactOn: indicator.publicKey }\">\n <img class=\"icon\" src=\"/assets/img/impeded.svg\" /> {{factorScore.interventionSummary.impeded}}\n </div>\n <div class=\"factor-warnings\" *ngIf=\"notes.length > 0\" notesDialog [notes]=\"notes\">\n <span class=\"icon ph-warning-fill\" title=\"There are some issues in the data that might influence your interpretations\"></span>\n </div>\n </div>\n\n <div class=\"factor-content\" (click)=\"popover.open()\">\n <div class=\"factor-name\">\n {{indicator.name}}\n </div>\n <progressbar [factorScore]=\"factorScore\"></progressbar>\n <div class=\"factor-details\">\n <age-indicator [lastMeasured]=\"factorScore.lastMeasured\" *ngIf=\"userSettings.settings.user.modelFilter.advanced\"></age-indicator>\n <delta-arrow *ngIf=\"dataAvailable\" [factorScore]=\"factorScore\" [delta]=\"delta\" [noDataIndicator]=\"false\"></delta-arrow>\n </div>\n </div>\n <div class=\"factor-anchor\" [id]=\"'factor-' + indicator.publicKey + '-anchor'\">\n </div>\n </div>\n\n <sat-popover #popover horizontalAlign=\"after\" [anchor]=\"factorAnchor\" verticalAlign=\"center\" [hasBackdrop]=\"true\" [autoFocus]=\"false\">\n <div class=\"popover\" [id]=\"'popover-' + indicator.publicKey\">\n <div class=\"popover-container\">\n <span (click)=\"popover.close()\" class=\"close ph-x\"></span>\n <h3 factorInformationDialog [factor]=\"indicator\">\n {{indicator.name}}\n <span class=\"icon ph-info-fill\"></span>\n </h3>\n <div class=\"description\">{{indicator.description}}</div>\n\n <model-factor-benchmark [factor]=\"factorScore\" [benchmark]=\"benchmark\"></model-factor-benchmark>\n <model-factor-breakdown [factor]=\"factorScore\"></model-factor-breakdown>\n <quicktips [dimensionKey]=\"indicator.publicKey\" [extraClass]=\"'quicktips-popover'\"></quicktips>\n\n <div class=\"link\" *ngIf=\"factorScore.recommendation.available\">\n <a [routerLink]=\"[baseUrl, 'tips']\" [fragment]=\"indicator.publicKey\">discover how to improve ></a>\n </div>\n </div>\n <div class=\"arrow\"></div>\n </div>\n </sat-popover>\n</ng-container>\n", styles: [".smallTextUppercase{font-family:StevieSansThin,sans-serif;font-style:normal;font-weight:400;font-size:15px;line-height:140%;text-transform:uppercase;line-height:100%}.bigletteredbutton{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;text-decoration:none;background:#ffffff1a;margin-bottom:10px;display:flex;align-content:center;border-radius:20px;padding:15px;font-size:24px;border:2px solid #1F3F8F;border-bottom:6px solid #1F3F8F;color:#fff;align-items:center;cursor:pointer}.bigletteredbutton .free{font-family:StevieSansThin,sans-serif;font-style:normal;font-weight:400;font-size:15px;line-height:140%;background:#fff73f;color:#2f2f2f;padding:3px 5px;margin-left:20px;border-radius:10px}.bigletteredbutton .plan{font-family:StevieSansThin,sans-serif;font-style:normal;font-weight:400;font-size:15px;line-height:140%;background:#fff;color:#2f2f2f;padding:3px 5px;margin-left:20px;border-radius:10px}.bigletteredbutton:hover,.bigletteredbutton.selected{border:2px solid #fff73f;border-bottom:6px solid #fff73f}.bigletteredbutton .button-letter{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;border-radius:30px;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center;background:#fff73f;color:#1f3f8f;margin-right:20px}.bigletteredbutton .button-letter .ph{color:#1f3f8f}.bigletteredbutton .button-letter:hover{background:#1f3f8f;color:#fff73f}.bigletteredbutton .button-letter:hover .ph{color:#fff73f}.roundicon-yellow{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;border-radius:30px;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center;background:#fff73f;color:#1f3f8f}.roundicon-yellow .ph{color:#1f3f8f}.roundicon-yellow:hover{background:#1f3f8f;color:#fff73f}.roundicon-yellow:hover .ph{color:#fff73f}.roundicon{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;border-radius:30px;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center}.roundicon-large{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center;border-radius:60px;height:120px;width:120px}\n"] }]
4867
4869
  }], ctorParameters: () => [{ type: ViewModelStateBase, decorators: [{
4868
4870
  type: Inject,
4869
4871
  args: [VIEWSTATE_PROVIDER]
4872
+ }] }, { type: undefined, decorators: [{
4873
+ type: Inject,
4874
+ args: [VIEWSTATE_USERSETTINGS_STRATEGY]
4870
4875
  }] }, { type: UserSettingService }, { type: i1.MatSnackBar }, { type: ArrowUpdateService }], propDecorators: { indicator: [{
4871
4876
  type: Input
4872
4877
  }], actionStatusPosition: [{
@@ -4876,26 +4881,25 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImpor
4876
4881
  }] } });
4877
4882
 
4878
4883
  class ModelFactorCoreComponent extends ComponentWithViewStateBase {
4879
- constructor(state, userSettingsService, snackBar, arrowUpdateService) {
4884
+ constructor(state, userSettings, userSettingService, snackBar, arrowUpdateService) {
4880
4885
  super(state, snackBar);
4881
4886
  this.state = state;
4882
- this.userSettingsService = userSettingsService;
4887
+ this.userSettings = userSettings;
4888
+ this.userSettingService = userSettingService;
4883
4889
  this.snackBar = snackBar;
4884
4890
  this.arrowUpdateService = arrowUpdateService;
4885
4891
  this.expandIndicators = false;
4886
4892
  this.InterventionStateEnum = InterventionStateEnum;
4887
- this.settings = this.userSettingsService.get();
4888
4893
  }
4889
4894
  ngOnInit() {
4890
4895
  super.ngOnInit();
4891
- this.settingsSubscription = this.userSettingsService.changed.subscribe((settings) => {
4892
- this.settings = settings;
4893
- if (this.settings.user.modelFilter.advanced !== this.expandIndicators) {
4896
+ this.settingsSubscription = this.userSettingService.changed.subscribe((settings) => {
4897
+ if (this.userSettings.settings.user.modelFilter.advanced !== this.expandIndicators) {
4894
4898
  this.toggleIndicators();
4895
4899
  }
4896
4900
  this.setIsInActiveLayer();
4897
4901
  });
4898
- if (this.settings.user.modelFilter.advanced !== this.expandIndicators) {
4902
+ if (this.userSettings.settings.user.modelFilter.advanced !== this.expandIndicators) {
4899
4903
  this.toggleIndicators();
4900
4904
  }
4901
4905
  }
@@ -4910,6 +4914,9 @@ class ModelFactorCoreComponent extends ComponentWithViewStateBase {
4910
4914
  }
4911
4915
  onDataUpdate(data) {
4912
4916
  this.factorScore = data.factorScores.factorScores.find(p => p.key == this.factor.publicKey);
4917
+ if (this.factorScore == null) {
4918
+ return;
4919
+ }
4913
4920
  this.delta = data.factorScores.delta;
4914
4921
  this.baseUrl = data.baseUrl;
4915
4922
  this.benchmark = data.factorScores.benchmark;
@@ -4921,20 +4928,23 @@ class ModelFactorCoreComponent extends ComponentWithViewStateBase {
4921
4928
  ;
4922
4929
  setIsInActiveLayer() {
4923
4930
  this.isInActiveLayer =
4924
- (this.settings.user.modelFilter.layers.length == 0) ||
4925
- (this.settings.user.modelFilter.layers.find(p => p.key == "TeamMembers" && p.selected) != null && this.factorScore.points.find(p => p.name == "TeamMember") != null) ||
4926
- (this.settings.user.modelFilter.layers.find(p => p.key == "Stakeholders" && p.selected) != null && this.factorScore.points.find(p => p.name == "Stakeholder") != null) ||
4927
- (this.settings.user.modelFilter.layers.find(p => p.key == "Supporters" && p.selected) != null && this.factorScore.points.find(p => p.name == "Supporter") != null);
4931
+ (this.userSettings.settings.user.modelFilter.layers.length == 0) ||
4932
+ (this.userSettings.settings.user.modelFilter.layers.find(p => p.key == "TeamMembers" && p.selected) != null && this.factorScore.points.find(p => p.name == "TeamMember") != null) ||
4933
+ (this.userSettings.settings.user.modelFilter.layers.find(p => p.key == "Stakeholders" && p.selected) != null && this.factorScore.points.find(p => p.name == "Stakeholder") != null) ||
4934
+ (this.userSettings.settings.user.modelFilter.layers.find(p => p.key == "Supporters" && p.selected) != null && this.factorScore.points.find(p => p.name == "Supporter") != null);
4928
4935
  }
4929
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: ModelFactorCoreComponent, deps: [{ token: VIEWSTATE_PROVIDER }, { token: UserSettingService }, { token: i1.MatSnackBar }, { token: ArrowUpdateService }], target: i0.ɵɵFactoryTarget.Component }); }
4930
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.0", type: ModelFactorCoreComponent, isStandalone: false, selector: "model-factor-core", inputs: { factor: "factor", allowExpand: "allowExpand", expandPosition: "expandPosition" }, usesInheritance: true, ngImport: i0, template: "<div [class]=\"'model-factor model-factor-' + direction\" [ngClass]=\"{'model-factor-fade' : !isInActiveLayer || !dataAvailable}\" [id]=\"'factor-' + factor.publicKey\" >\n <div [class]=\"'model-factor-expand model-factor-expand-' + expandPosition\" [ngClass]=\"{'expanded': expandIndicators}\" (click)=\"toggleIndicators()\" [id]=\"'factor-' + factor.publicKey + '-expand'\" *ngIf=\"allowExpand\">\n <span class=\"plus\">+</span>\n </div>\n <div class=\"model-factor-inner\" #factorAnchor>\n <div class=\"model-factor-content\" (click)=\"popover.open()\">\n <div class=\"model-factor-name\">\n {{factor.name}}\n </div>\n <progressbar [factorScore]=\"factorScore\"></progressbar>\n <div class=\"model-factor-details\">\n <age-indicator [lastMeasured]=\"factorScore.lastMeasured\" *ngIf=\"settings.user.modelFilter.advanced\"></age-indicator>\n <delta-arrow *ngIf=\"dataAvailable\" [factorScore]=\"factorScore\" [delta]=\"delta\"></delta-arrow>\n </div>\n </div>\n\n <div class=\"model-factor-bottom\" *ngIf=\"settings.user.modelFilter.advanced\">\n <span class=\"meta-actions\" [title]=\"factorScore.interventionSummary.open + ' open improvement actions, versus ' + factorScore.interventionSummary.completed + ' completed improvement actions'\">\n <span [routerLink]=\"[baseUrl, 'actions']\" [queryParams]=\"{ state: InterventionStateEnum.open, expectedImpactOn: factor.publicKey }\">{{factorScore.interventionSummary.open}}</span>/\n <span [routerLink]=\"[baseUrl, 'actions']\" [queryParams]=\"{ state: InterventionStateEnum.completed, expectedImpactOn: factor.publicKey }\">{{factorScore.interventionSummary.completed}}</span>\n </span>\n <span class=\"meta-impeded\" *ngIf=\"factorScore.interventionSummary.impeded > 0\" [title]=\"factorScore.interventionSummary.impeded + ' improvement actions are blocked, and teams are requesting support'\" [routerLink]=\"[baseUrl, 'actions']\" [queryParams]=\"{ state: InterventionStateEnum.impeded, expectedImpactOn: factor.publicKey }\">\n <img class=\"icon\" src=\"/assets/img/impeded.svg\" />{{factorScore.interventionSummary.impeded}}\n </span>\n <span class=\"meta-warnings\" *ngIf=\"notes.length > 0\" notesDialog [notes]=\"notes\">\n <span class=\"icon ph-warning-fill\"></span>\n </span>\n </div>\n\n <div class=\"model-factor-bottom-empty\" *ngIf=\"!settings.user.modelFilter.advanced\">\n </div>\n </div>\n</div>\n\n<div [id]=\"'factor-' + factor.publicKey + '-indicators'\" class=\"indicators\">\n <model-factor-indicator [indicator]=\"indicator\" *ngFor=\"let indicator of factor.lower\" [actionStatusPosition]=\"expandPosition\" [visible]=\"expandIndicators && allowExpand\"></model-factor-indicator>\n</div>\n\n<sat-popover #popover horizontalAlign=\"after\" [anchor]=\"factorAnchor\" verticalAlign=\"center\" [hasBackdrop]=\"true\" [autoFocus]=\"false\">\n <div class=\"popover\" [id]=\"'popover-' + factor.publicKey\">\n <div class=\"popover-container\">\n <span (click)=\"popover.close()\" class=\"close ph-x\"></span>\n <h3 factorInformationDialog [factor]=\"factor\">\n {{factor.name}}\n <span class=\"icon ph-info-fill\"></span>\n </h3>\n <div class=\"description\">{{factor.description}}</div>\n\n <model-factor-benchmark [factor]=\"factorScore\" [benchmark]=\"benchmark\"></model-factor-benchmark>\n <model-factor-breakdown [factor]=\"factorScore\"></model-factor-breakdown>\n <quicktips [dimensionKey]=\"factor.publicKey\" [extraClass]=\"'quicktips-popover'\"></quicktips>\n\n <div class=\"link\" *ngIf=\"factorScore.recommendation.available\">\n <a [routerLink]=\"[baseUrl, 'tips']\" [fragment]=\"factor.publicKey\">discover how to improve ></a>\n </div>\n </div>\n <div class=\"arrow\"></div>\n </div>\n</sat-popover>\n", styles: [".smallTextUppercase{font-family:StevieSansThin,sans-serif;font-style:normal;font-weight:400;font-size:15px;line-height:140%;text-transform:uppercase;line-height:100%}.bigletteredbutton{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;text-decoration:none;background:#ffffff1a;margin-bottom:10px;display:flex;align-content:center;border-radius:20px;padding:15px;font-size:24px;border:2px solid #1F3F8F;border-bottom:6px solid #1F3F8F;color:#fff;align-items:center;cursor:pointer}.bigletteredbutton .free{font-family:StevieSansThin,sans-serif;font-style:normal;font-weight:400;font-size:15px;line-height:140%;background:#fff73f;color:#2f2f2f;padding:3px 5px;margin-left:20px;border-radius:10px}.bigletteredbutton .plan{font-family:StevieSansThin,sans-serif;font-style:normal;font-weight:400;font-size:15px;line-height:140%;background:#fff;color:#2f2f2f;padding:3px 5px;margin-left:20px;border-radius:10px}.bigletteredbutton:hover,.bigletteredbutton.selected{border:2px solid #fff73f;border-bottom:6px solid #fff73f}.bigletteredbutton .button-letter{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;border-radius:30px;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center;background:#fff73f;color:#1f3f8f;margin-right:20px}.bigletteredbutton .button-letter .ph{color:#1f3f8f}.bigletteredbutton .button-letter:hover{background:#1f3f8f;color:#fff73f}.bigletteredbutton .button-letter:hover .ph{color:#fff73f}.roundicon-yellow{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;border-radius:30px;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center;background:#fff73f;color:#1f3f8f}.roundicon-yellow .ph{color:#1f3f8f}.roundicon-yellow:hover{background:#1f3f8f;color:#fff73f}.roundicon-yellow:hover .ph{color:#fff73f}.roundicon{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;border-radius:30px;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center}.roundicon-large{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center;border-radius:60px;height:120px;width:120px}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: DeltaArrowComponent, selector: "delta-arrow", inputs: ["factorScore", "delta", "noDataIndicator"] }, { kind: "component", type: AgeIndicatorComponent, selector: "age-indicator", inputs: ["lastMeasured"] }, { kind: "component", type: QuickTipsComponent, selector: "quicktips", inputs: ["dimensionKey", "extraClass"] }, { kind: "component", type: ModelFactorBreakdownComponent, selector: "model-factor-breakdown", inputs: ["factor", "pageSize"] }, { kind: "directive", type: OpenNotesDialogDirective, selector: "[notesDialog]", inputs: ["notes"] }, { kind: "component", type: i11.SatPopoverComponent, selector: "sat-popover", inputs: ["anchor", "horizontalAlign", "xAlign", "verticalAlign", "yAlign", "forceAlignment", "lockAlignment", "autoFocus", "restoreFocus", "scrollStrategy", "hasBackdrop", "interactiveClose", "openTransition", "closeTransition", "openAnimationStartAtScale", "closeAnimationEndAtScale", "backdropClass", "panelClass"], outputs: ["opened", "closed", "afterOpen", "afterClose", "backdropClicked", "overlayKeydown"] }, { kind: "directive", type: OpenFactorInformationDialogDirective, selector: "[factorInformationDialog]", inputs: ["factor"] }, { kind: "component", type: ProgressbarComponent, selector: "progressbar", inputs: ["factorScore"] }, { kind: "component", type: ModelFactorIndicatorComponent, selector: "model-factor-indicator", inputs: ["indicator", "actionStatusPosition", "visible"] }, { kind: "component", type: ModelFactorBenchmarkComponent, selector: "model-factor-benchmark", inputs: ["factor", "benchmark"] }] }); }
4936
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: ModelFactorCoreComponent, deps: [{ token: VIEWSTATE_PROVIDER }, { token: VIEWSTATE_USERSETTINGS_STRATEGY }, { token: UserSettingService }, { token: i1.MatSnackBar }, { token: ArrowUpdateService }], target: i0.ɵɵFactoryTarget.Component }); }
4937
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.0", type: ModelFactorCoreComponent, isStandalone: false, selector: "model-factor-core", inputs: { factor: "factor", allowExpand: "allowExpand", expandPosition: "expandPosition" }, usesInheritance: true, ngImport: i0, template: "<div [class]=\"'model-factor model-factor-' + direction\" [ngClass]=\"{'model-factor-fade' : !isInActiveLayer || !dataAvailable}\" [id]=\"'factor-' + factor.publicKey\" >\n <div [class]=\"'model-factor-expand model-factor-expand-' + expandPosition\" [ngClass]=\"{'expanded': expandIndicators}\" (click)=\"toggleIndicators()\" [id]=\"'factor-' + factor.publicKey + '-expand'\" *ngIf=\"allowExpand\">\n <span class=\"plus\">+</span>\n </div>\n <div class=\"model-factor-inner\" #factorAnchor>\n <div class=\"model-factor-content\" (click)=\"popover.open()\">\n <div class=\"model-factor-name\">\n {{factor.name}}\n </div>\n <progressbar [factorScore]=\"factorScore\"></progressbar>\n <div class=\"model-factor-details\">\n <age-indicator [lastMeasured]=\"factorScore.lastMeasured\" *ngIf=\"userSettings.settings.user.modelFilter.advanced\"></age-indicator>\n <delta-arrow *ngIf=\"dataAvailable\" [factorScore]=\"factorScore\" [delta]=\"delta\"></delta-arrow>\n </div>\n </div>\n\n <div class=\"model-factor-bottom\" *ngIf=\"userSettings.settings.user.modelFilter.advanced\">\n <span class=\"meta-actions\" [title]=\"factorScore.interventionSummary.open + ' open improvement actions, versus ' + factorScore.interventionSummary.completed + ' completed improvement actions'\">\n <span [routerLink]=\"[baseUrl, 'actions']\" [queryParams]=\"{ state: InterventionStateEnum.open, expectedImpactOn: factor.publicKey }\">{{factorScore.interventionSummary.open}}</span>/\n <span [routerLink]=\"[baseUrl, 'actions']\" [queryParams]=\"{ state: InterventionStateEnum.completed, expectedImpactOn: factor.publicKey }\">{{factorScore.interventionSummary.completed}}</span>\n </span>\n <span class=\"meta-impeded\" *ngIf=\"factorScore.interventionSummary.impeded > 0\" [title]=\"factorScore.interventionSummary.impeded + ' improvement actions are blocked, and teams are requesting support'\" [routerLink]=\"[baseUrl, 'actions']\" [queryParams]=\"{ state: InterventionStateEnum.impeded, expectedImpactOn: factor.publicKey }\">\n <img class=\"icon\" src=\"/assets/img/impeded.svg\" />{{factorScore.interventionSummary.impeded}}\n </span>\n <span class=\"meta-warnings\" *ngIf=\"notes.length > 0\" notesDialog [notes]=\"notes\">\n <span class=\"icon ph-warning-fill\"></span>\n </span>\n </div>\n\n <div class=\"model-factor-bottom-empty\" *ngIf=\"!userSettings.settings.user.modelFilter.advanced\">\n </div>\n </div>\n</div>\n\n<div [id]=\"'factor-' + factor.publicKey + '-indicators'\" class=\"indicators\">\n <model-factor-indicator [indicator]=\"indicator\" *ngFor=\"let indicator of factor.lower\" [actionStatusPosition]=\"expandPosition\" [visible]=\"expandIndicators && allowExpand\"></model-factor-indicator>\n</div>\n\n<sat-popover #popover horizontalAlign=\"after\" [anchor]=\"factorAnchor\" verticalAlign=\"center\" [hasBackdrop]=\"true\" [autoFocus]=\"false\">\n <div class=\"popover\" [id]=\"'popover-' + factor.publicKey\">\n <div class=\"popover-container\">\n <span (click)=\"popover.close()\" class=\"close ph-x\"></span>\n <h3 factorInformationDialog [factor]=\"factor\">\n {{factor.name}}\n <span class=\"icon ph-info-fill\"></span>\n </h3>\n <div class=\"description\">{{factor.description}}</div>\n\n <model-factor-benchmark [factor]=\"factorScore\" [benchmark]=\"benchmark\"></model-factor-benchmark>\n <model-factor-breakdown [factor]=\"factorScore\"></model-factor-breakdown>\n <quicktips [dimensionKey]=\"factor.publicKey\" [extraClass]=\"'quicktips-popover'\"></quicktips>\n\n <div class=\"link\" *ngIf=\"factorScore.recommendation.available\">\n <a [routerLink]=\"[baseUrl, 'tips']\" [fragment]=\"factor.publicKey\">discover how to improve ></a>\n </div>\n </div>\n <div class=\"arrow\"></div>\n </div>\n</sat-popover>\n", styles: [".smallTextUppercase{font-family:StevieSansThin,sans-serif;font-style:normal;font-weight:400;font-size:15px;line-height:140%;text-transform:uppercase;line-height:100%}.bigletteredbutton{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;text-decoration:none;background:#ffffff1a;margin-bottom:10px;display:flex;align-content:center;border-radius:20px;padding:15px;font-size:24px;border:2px solid #1F3F8F;border-bottom:6px solid #1F3F8F;color:#fff;align-items:center;cursor:pointer}.bigletteredbutton .free{font-family:StevieSansThin,sans-serif;font-style:normal;font-weight:400;font-size:15px;line-height:140%;background:#fff73f;color:#2f2f2f;padding:3px 5px;margin-left:20px;border-radius:10px}.bigletteredbutton .plan{font-family:StevieSansThin,sans-serif;font-style:normal;font-weight:400;font-size:15px;line-height:140%;background:#fff;color:#2f2f2f;padding:3px 5px;margin-left:20px;border-radius:10px}.bigletteredbutton:hover,.bigletteredbutton.selected{border:2px solid #fff73f;border-bottom:6px solid #fff73f}.bigletteredbutton .button-letter{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;border-radius:30px;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center;background:#fff73f;color:#1f3f8f;margin-right:20px}.bigletteredbutton .button-letter .ph{color:#1f3f8f}.bigletteredbutton .button-letter:hover{background:#1f3f8f;color:#fff73f}.bigletteredbutton .button-letter:hover .ph{color:#fff73f}.roundicon-yellow{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;border-radius:30px;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center;background:#fff73f;color:#1f3f8f}.roundicon-yellow .ph{color:#1f3f8f}.roundicon-yellow:hover{background:#1f3f8f;color:#fff73f}.roundicon-yellow:hover .ph{color:#fff73f}.roundicon{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;border-radius:30px;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center}.roundicon-large{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center;border-radius:60px;height:120px;width:120px}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: DeltaArrowComponent, selector: "delta-arrow", inputs: ["factorScore", "delta", "noDataIndicator"] }, { kind: "component", type: AgeIndicatorComponent, selector: "age-indicator", inputs: ["lastMeasured"] }, { kind: "component", type: QuickTipsComponent, selector: "quicktips", inputs: ["dimensionKey", "extraClass"] }, { kind: "component", type: ModelFactorBreakdownComponent, selector: "model-factor-breakdown", inputs: ["factor", "pageSize"] }, { kind: "directive", type: OpenNotesDialogDirective, selector: "[notesDialog]", inputs: ["notes"] }, { kind: "component", type: i11.SatPopoverComponent, selector: "sat-popover", inputs: ["anchor", "horizontalAlign", "xAlign", "verticalAlign", "yAlign", "forceAlignment", "lockAlignment", "autoFocus", "restoreFocus", "scrollStrategy", "hasBackdrop", "interactiveClose", "openTransition", "closeTransition", "openAnimationStartAtScale", "closeAnimationEndAtScale", "backdropClass", "panelClass"], outputs: ["opened", "closed", "afterOpen", "afterClose", "backdropClicked", "overlayKeydown"] }, { kind: "directive", type: OpenFactorInformationDialogDirective, selector: "[factorInformationDialog]", inputs: ["factor"] }, { kind: "component", type: ProgressbarComponent, selector: "progressbar", inputs: ["factorScore"] }, { kind: "component", type: ModelFactorIndicatorComponent, selector: "model-factor-indicator", inputs: ["indicator", "actionStatusPosition", "visible"] }, { kind: "component", type: ModelFactorBenchmarkComponent, selector: "model-factor-benchmark", inputs: ["factor", "benchmark"] }] }); }
4931
4938
  }
4932
4939
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: ModelFactorCoreComponent, decorators: [{
4933
4940
  type: Component,
4934
- args: [{ selector: 'model-factor-core', standalone: false, template: "<div [class]=\"'model-factor model-factor-' + direction\" [ngClass]=\"{'model-factor-fade' : !isInActiveLayer || !dataAvailable}\" [id]=\"'factor-' + factor.publicKey\" >\n <div [class]=\"'model-factor-expand model-factor-expand-' + expandPosition\" [ngClass]=\"{'expanded': expandIndicators}\" (click)=\"toggleIndicators()\" [id]=\"'factor-' + factor.publicKey + '-expand'\" *ngIf=\"allowExpand\">\n <span class=\"plus\">+</span>\n </div>\n <div class=\"model-factor-inner\" #factorAnchor>\n <div class=\"model-factor-content\" (click)=\"popover.open()\">\n <div class=\"model-factor-name\">\n {{factor.name}}\n </div>\n <progressbar [factorScore]=\"factorScore\"></progressbar>\n <div class=\"model-factor-details\">\n <age-indicator [lastMeasured]=\"factorScore.lastMeasured\" *ngIf=\"settings.user.modelFilter.advanced\"></age-indicator>\n <delta-arrow *ngIf=\"dataAvailable\" [factorScore]=\"factorScore\" [delta]=\"delta\"></delta-arrow>\n </div>\n </div>\n\n <div class=\"model-factor-bottom\" *ngIf=\"settings.user.modelFilter.advanced\">\n <span class=\"meta-actions\" [title]=\"factorScore.interventionSummary.open + ' open improvement actions, versus ' + factorScore.interventionSummary.completed + ' completed improvement actions'\">\n <span [routerLink]=\"[baseUrl, 'actions']\" [queryParams]=\"{ state: InterventionStateEnum.open, expectedImpactOn: factor.publicKey }\">{{factorScore.interventionSummary.open}}</span>/\n <span [routerLink]=\"[baseUrl, 'actions']\" [queryParams]=\"{ state: InterventionStateEnum.completed, expectedImpactOn: factor.publicKey }\">{{factorScore.interventionSummary.completed}}</span>\n </span>\n <span class=\"meta-impeded\" *ngIf=\"factorScore.interventionSummary.impeded > 0\" [title]=\"factorScore.interventionSummary.impeded + ' improvement actions are blocked, and teams are requesting support'\" [routerLink]=\"[baseUrl, 'actions']\" [queryParams]=\"{ state: InterventionStateEnum.impeded, expectedImpactOn: factor.publicKey }\">\n <img class=\"icon\" src=\"/assets/img/impeded.svg\" />{{factorScore.interventionSummary.impeded}}\n </span>\n <span class=\"meta-warnings\" *ngIf=\"notes.length > 0\" notesDialog [notes]=\"notes\">\n <span class=\"icon ph-warning-fill\"></span>\n </span>\n </div>\n\n <div class=\"model-factor-bottom-empty\" *ngIf=\"!settings.user.modelFilter.advanced\">\n </div>\n </div>\n</div>\n\n<div [id]=\"'factor-' + factor.publicKey + '-indicators'\" class=\"indicators\">\n <model-factor-indicator [indicator]=\"indicator\" *ngFor=\"let indicator of factor.lower\" [actionStatusPosition]=\"expandPosition\" [visible]=\"expandIndicators && allowExpand\"></model-factor-indicator>\n</div>\n\n<sat-popover #popover horizontalAlign=\"after\" [anchor]=\"factorAnchor\" verticalAlign=\"center\" [hasBackdrop]=\"true\" [autoFocus]=\"false\">\n <div class=\"popover\" [id]=\"'popover-' + factor.publicKey\">\n <div class=\"popover-container\">\n <span (click)=\"popover.close()\" class=\"close ph-x\"></span>\n <h3 factorInformationDialog [factor]=\"factor\">\n {{factor.name}}\n <span class=\"icon ph-info-fill\"></span>\n </h3>\n <div class=\"description\">{{factor.description}}</div>\n\n <model-factor-benchmark [factor]=\"factorScore\" [benchmark]=\"benchmark\"></model-factor-benchmark>\n <model-factor-breakdown [factor]=\"factorScore\"></model-factor-breakdown>\n <quicktips [dimensionKey]=\"factor.publicKey\" [extraClass]=\"'quicktips-popover'\"></quicktips>\n\n <div class=\"link\" *ngIf=\"factorScore.recommendation.available\">\n <a [routerLink]=\"[baseUrl, 'tips']\" [fragment]=\"factor.publicKey\">discover how to improve ></a>\n </div>\n </div>\n <div class=\"arrow\"></div>\n </div>\n</sat-popover>\n", styles: [".smallTextUppercase{font-family:StevieSansThin,sans-serif;font-style:normal;font-weight:400;font-size:15px;line-height:140%;text-transform:uppercase;line-height:100%}.bigletteredbutton{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;text-decoration:none;background:#ffffff1a;margin-bottom:10px;display:flex;align-content:center;border-radius:20px;padding:15px;font-size:24px;border:2px solid #1F3F8F;border-bottom:6px solid #1F3F8F;color:#fff;align-items:center;cursor:pointer}.bigletteredbutton .free{font-family:StevieSansThin,sans-serif;font-style:normal;font-weight:400;font-size:15px;line-height:140%;background:#fff73f;color:#2f2f2f;padding:3px 5px;margin-left:20px;border-radius:10px}.bigletteredbutton .plan{font-family:StevieSansThin,sans-serif;font-style:normal;font-weight:400;font-size:15px;line-height:140%;background:#fff;color:#2f2f2f;padding:3px 5px;margin-left:20px;border-radius:10px}.bigletteredbutton:hover,.bigletteredbutton.selected{border:2px solid #fff73f;border-bottom:6px solid #fff73f}.bigletteredbutton .button-letter{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;border-radius:30px;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center;background:#fff73f;color:#1f3f8f;margin-right:20px}.bigletteredbutton .button-letter .ph{color:#1f3f8f}.bigletteredbutton .button-letter:hover{background:#1f3f8f;color:#fff73f}.bigletteredbutton .button-letter:hover .ph{color:#fff73f}.roundicon-yellow{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;border-radius:30px;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center;background:#fff73f;color:#1f3f8f}.roundicon-yellow .ph{color:#1f3f8f}.roundicon-yellow:hover{background:#1f3f8f;color:#fff73f}.roundicon-yellow:hover .ph{color:#fff73f}.roundicon{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;border-radius:30px;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center}.roundicon-large{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center;border-radius:60px;height:120px;width:120px}\n"] }]
4941
+ args: [{ selector: 'model-factor-core', standalone: false, template: "<div [class]=\"'model-factor model-factor-' + direction\" [ngClass]=\"{'model-factor-fade' : !isInActiveLayer || !dataAvailable}\" [id]=\"'factor-' + factor.publicKey\" >\n <div [class]=\"'model-factor-expand model-factor-expand-' + expandPosition\" [ngClass]=\"{'expanded': expandIndicators}\" (click)=\"toggleIndicators()\" [id]=\"'factor-' + factor.publicKey + '-expand'\" *ngIf=\"allowExpand\">\n <span class=\"plus\">+</span>\n </div>\n <div class=\"model-factor-inner\" #factorAnchor>\n <div class=\"model-factor-content\" (click)=\"popover.open()\">\n <div class=\"model-factor-name\">\n {{factor.name}}\n </div>\n <progressbar [factorScore]=\"factorScore\"></progressbar>\n <div class=\"model-factor-details\">\n <age-indicator [lastMeasured]=\"factorScore.lastMeasured\" *ngIf=\"userSettings.settings.user.modelFilter.advanced\"></age-indicator>\n <delta-arrow *ngIf=\"dataAvailable\" [factorScore]=\"factorScore\" [delta]=\"delta\"></delta-arrow>\n </div>\n </div>\n\n <div class=\"model-factor-bottom\" *ngIf=\"userSettings.settings.user.modelFilter.advanced\">\n <span class=\"meta-actions\" [title]=\"factorScore.interventionSummary.open + ' open improvement actions, versus ' + factorScore.interventionSummary.completed + ' completed improvement actions'\">\n <span [routerLink]=\"[baseUrl, 'actions']\" [queryParams]=\"{ state: InterventionStateEnum.open, expectedImpactOn: factor.publicKey }\">{{factorScore.interventionSummary.open}}</span>/\n <span [routerLink]=\"[baseUrl, 'actions']\" [queryParams]=\"{ state: InterventionStateEnum.completed, expectedImpactOn: factor.publicKey }\">{{factorScore.interventionSummary.completed}}</span>\n </span>\n <span class=\"meta-impeded\" *ngIf=\"factorScore.interventionSummary.impeded > 0\" [title]=\"factorScore.interventionSummary.impeded + ' improvement actions are blocked, and teams are requesting support'\" [routerLink]=\"[baseUrl, 'actions']\" [queryParams]=\"{ state: InterventionStateEnum.impeded, expectedImpactOn: factor.publicKey }\">\n <img class=\"icon\" src=\"/assets/img/impeded.svg\" />{{factorScore.interventionSummary.impeded}}\n </span>\n <span class=\"meta-warnings\" *ngIf=\"notes.length > 0\" notesDialog [notes]=\"notes\">\n <span class=\"icon ph-warning-fill\"></span>\n </span>\n </div>\n\n <div class=\"model-factor-bottom-empty\" *ngIf=\"!userSettings.settings.user.modelFilter.advanced\">\n </div>\n </div>\n</div>\n\n<div [id]=\"'factor-' + factor.publicKey + '-indicators'\" class=\"indicators\">\n <model-factor-indicator [indicator]=\"indicator\" *ngFor=\"let indicator of factor.lower\" [actionStatusPosition]=\"expandPosition\" [visible]=\"expandIndicators && allowExpand\"></model-factor-indicator>\n</div>\n\n<sat-popover #popover horizontalAlign=\"after\" [anchor]=\"factorAnchor\" verticalAlign=\"center\" [hasBackdrop]=\"true\" [autoFocus]=\"false\">\n <div class=\"popover\" [id]=\"'popover-' + factor.publicKey\">\n <div class=\"popover-container\">\n <span (click)=\"popover.close()\" class=\"close ph-x\"></span>\n <h3 factorInformationDialog [factor]=\"factor\">\n {{factor.name}}\n <span class=\"icon ph-info-fill\"></span>\n </h3>\n <div class=\"description\">{{factor.description}}</div>\n\n <model-factor-benchmark [factor]=\"factorScore\" [benchmark]=\"benchmark\"></model-factor-benchmark>\n <model-factor-breakdown [factor]=\"factorScore\"></model-factor-breakdown>\n <quicktips [dimensionKey]=\"factor.publicKey\" [extraClass]=\"'quicktips-popover'\"></quicktips>\n\n <div class=\"link\" *ngIf=\"factorScore.recommendation.available\">\n <a [routerLink]=\"[baseUrl, 'tips']\" [fragment]=\"factor.publicKey\">discover how to improve ></a>\n </div>\n </div>\n <div class=\"arrow\"></div>\n </div>\n</sat-popover>\n", styles: [".smallTextUppercase{font-family:StevieSansThin,sans-serif;font-style:normal;font-weight:400;font-size:15px;line-height:140%;text-transform:uppercase;line-height:100%}.bigletteredbutton{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;text-decoration:none;background:#ffffff1a;margin-bottom:10px;display:flex;align-content:center;border-radius:20px;padding:15px;font-size:24px;border:2px solid #1F3F8F;border-bottom:6px solid #1F3F8F;color:#fff;align-items:center;cursor:pointer}.bigletteredbutton .free{font-family:StevieSansThin,sans-serif;font-style:normal;font-weight:400;font-size:15px;line-height:140%;background:#fff73f;color:#2f2f2f;padding:3px 5px;margin-left:20px;border-radius:10px}.bigletteredbutton .plan{font-family:StevieSansThin,sans-serif;font-style:normal;font-weight:400;font-size:15px;line-height:140%;background:#fff;color:#2f2f2f;padding:3px 5px;margin-left:20px;border-radius:10px}.bigletteredbutton:hover,.bigletteredbutton.selected{border:2px solid #fff73f;border-bottom:6px solid #fff73f}.bigletteredbutton .button-letter{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;border-radius:30px;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center;background:#fff73f;color:#1f3f8f;margin-right:20px}.bigletteredbutton .button-letter .ph{color:#1f3f8f}.bigletteredbutton .button-letter:hover{background:#1f3f8f;color:#fff73f}.bigletteredbutton .button-letter:hover .ph{color:#fff73f}.roundicon-yellow{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;border-radius:30px;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center;background:#fff73f;color:#1f3f8f}.roundicon-yellow .ph{color:#1f3f8f}.roundicon-yellow:hover{background:#1f3f8f;color:#fff73f}.roundicon-yellow:hover .ph{color:#fff73f}.roundicon{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;border-radius:30px;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center}.roundicon-large{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center;border-radius:60px;height:120px;width:120px}\n"] }]
4935
4942
  }], ctorParameters: () => [{ type: ViewModelStateBase, decorators: [{
4936
4943
  type: Inject,
4937
4944
  args: [VIEWSTATE_PROVIDER]
4945
+ }] }, { type: undefined, decorators: [{
4946
+ type: Inject,
4947
+ args: [VIEWSTATE_USERSETTINGS_STRATEGY]
4938
4948
  }] }, { type: UserSettingService }, { type: i1.MatSnackBar }, { type: ArrowUpdateService }], propDecorators: { factor: [{
4939
4949
  type: Input
4940
4950
  }], allowExpand: [{
@@ -4944,33 +4954,25 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImpor
4944
4954
  }] } });
4945
4955
 
4946
4956
  class ModelCanvasComponent extends ComponentWithViewStateBase {
4947
- constructor(state, userSettingsService, snackBar) {
4957
+ constructor(state, userSettings, userSettingService, snackBar) {
4948
4958
  super(state, snackBar);
4949
4959
  this.state = state;
4950
- this.userSettingsService = userSettingsService;
4960
+ this.userSettings = userSettings;
4961
+ this.userSettingService = userSettingService;
4951
4962
  this.snackBar = snackBar;
4952
4963
  this.QualifiedByEnum = QualifiedByEnum;
4953
- this.settings = this.userSettingsService.get();
4954
- if (typeof this.settings.user.modelFilter.advanced === 'undefined') {
4955
- this.settings.user.modelFilter.advanced = false;
4956
- }
4957
- if (!this.settings.user.modelFilter.layers || this.settings.user.modelFilter.layers.length == 0) {
4958
- this.settings.user.modelFilter.layers = [];
4959
- this.settings.user.modelFilter.layers.push(new SelectListItem("TeamMembers", "Team", true));
4960
- this.settings.user.modelFilter.layers.push(new SelectListItem("Stakeholders", "Stakeholders", true));
4961
- this.settings.user.modelFilter.layers.push(new SelectListItem("Supporters", "Supporters", true));
4962
- }
4963
4964
  }
4964
4965
  ngOnInit() {
4965
4966
  this.determineScreenSize();
4966
4967
  super.ngOnInit();
4967
- this.settingsSubscription = this.userSettingsService.changed.subscribe((settings) => {
4968
- this.settings = settings;
4969
- });
4970
- }
4971
- ngOnDestroy() {
4972
- if (this.settingsSubscription) {
4973
- this.settingsSubscription.unsubscribe();
4968
+ if (typeof this.userSettings.settings.user.modelFilter.advanced === 'undefined') {
4969
+ this.userSettings.settings.user.modelFilter.advanced = false;
4970
+ }
4971
+ if (!this.userSettings.settings.user.modelFilter.layers || this.userSettings.settings.user.modelFilter.layers.length == 0) {
4972
+ this.userSettings.settings.user.modelFilter.layers = [];
4973
+ this.userSettings.settings.user.modelFilter.layers.push(new SelectListItem("TeamMembers", "Team", true));
4974
+ this.userSettings.settings.user.modelFilter.layers.push(new SelectListItem("Stakeholders", "Stakeholders", true));
4975
+ this.userSettings.settings.user.modelFilter.layers.push(new SelectListItem("Supporters", "Supporters", true));
4974
4976
  }
4975
4977
  }
4976
4978
  determineScreenSize(event) {
@@ -5011,26 +5013,29 @@ class ModelCanvasComponent extends ComponentWithViewStateBase {
5011
5013
  }
5012
5014
  ;
5013
5015
  toggleView(advanced) {
5014
- this.settings.user.modelFilter.advanced = advanced;
5015
- this.userSettingsService.set(this.settings);
5016
+ this.userSettings.settings.user.modelFilter.advanced = advanced;
5017
+ this.userSettingService.set(this.userSettings.settings);
5016
5018
  }
5017
5019
  toggleLayer(selectedLayer) {
5018
- var layer = this.settings.user.modelFilter.layers.find(p => p.key == selectedLayer.key);
5020
+ var layer = this.userSettings.settings.user.modelFilter.layers.find(p => p.key == selectedLayer.key);
5019
5021
  if (!layer) {
5020
5022
  return;
5021
5023
  }
5022
5024
  layer.selected = !layer.selected;
5023
- this.userSettingsService.set(this.settings);
5025
+ this.userSettingService.set(this.userSettings.settings);
5024
5026
  }
5025
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: ModelCanvasComponent, deps: [{ token: VIEWSTATE_PROVIDER }, { token: UserSettingService }, { token: i1.MatSnackBar }], target: i0.ɵɵFactoryTarget.Component }); }
5026
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.0", type: ModelCanvasComponent, isStandalone: false, selector: "model-canvas", host: { listeners: { "window:resize": "determineScreenSize($event)" } }, usesInheritance: true, ngImport: i0, template: "<div *ngIf=\"!showModel\" class=\"message message-warning\">\n <div><span class=\"icon ph-info-fill\"></span> We've hidden the model visualization because your resolution is too low. Please try a larger device, like a tablet, laptop or desktop.</div>\n</div>\n\n<div class=\"wirebox model\" *ngIf=\"factors && showModel\">\n <div class=\"top\">\n <div class=\"toolbar\">\n <div class=\"toolbar-settings\">\n <div class=\"toolbar-setting\">\n <div class=\"toolbar-setting-title\">Selected Benchmark</div>\n <div class=\"toolbar-setting-label\">{{benchmark}}</div>\n </div>\n <div class=\"toolbar-setting\">\n <div class=\"toolbar-setting-title\">compare results to</div>\n <div class=\"toolbar-setting-label\" *ngIf=\"qualifiedBy == QualifiedByEnum.none\">No comparison</div>\n <div class=\"toolbar-setting-label\" *ngIf=\"qualifiedBy == QualifiedByEnum.delta && deltaType == 'PreviousSnapshot'\">Previous snapshot from {{deltaDateRange | dateRange}}</div>\n <div class=\"toolbar-setting-label\" *ngIf=\"qualifiedBy == QualifiedByEnum.delta && deltaType != 'PreviousSnapshot'\">Current period <span class=\"icon ph-info-fill\" [title]=\"'Current period ranges from ' + (dateRange | dateRange) + '. This includes weighed measurements from ' + pointCount + ' ' + pointType + ': ' + pointNames\"></span> with previous period <span class=\"icon ph-info-fill\" [title]=\"'Previous period ranges from ' + (deltaDateRange | dateRange) + '. This includes weighed measurements from ' + deltaTeams + ' ' + pointType + ': ' + deltaTeamNames\"></span></div>\n <div class=\"toolbar-setting-label\" *ngIf=\"qualifiedBy == QualifiedByEnum.benchmark\">Against benchmark</div>\n </div>\n <div class=\"toolbar-setting\" *ngIf=\"qualifiedBy != QualifiedByEnum.none\">\n <div class=\"toolbar-setting-title\">comparison legend</div>\n <div class=\"toolbar-setting-markers negative\">\n <ng-container *ngIf=\"qualifiedBy == 'Benchmark'\">\n <div class=\"toolbar-setting-marker negative\">\n <span class=\"marker\"></span>\n <span class=\"label\">lower</span>\n </div>\n <div class=\"toolbar-setting-marker positive\">\n <span class=\"marker\"></span>\n <span class=\"label\">higher</span>\n </div>\n </ng-container>\n <ng-container *ngIf=\"qualifiedBy == 'Delta'\">\n <div class=\"toolbar-setting-marker negative\">\n <span class=\"marker\"></span>\n <span class=\"label\">decreased</span>\n </div>\n <div class=\"toolbar-setting-marker positive\">\n <span class=\"marker\"></span>\n <span class=\"label\">improved</span>\n </div>\n </ng-container>\n </div>\n </div>\n </div>\n <div class=\"buttons\">\n <div class=\"button\" id=\"change-settings\" settingsDialog><span class=\"ph-faders icon\"></span> Settings</div>\n <div class=\"button\" id=\"export-factorscores\" exportFactorScoresDialog *ngIf=\"isLoggedIn\"><span class=\"ph-download-simple icon\"></span> Export</div>\n </div>\n </div>\n </div>\n <div class=\"content\">\n <div class=\"model-visualization\">\n <div class=\"model-clarification\">\n <span class=\"icon ph-info-fill\"></span>\n <span class=\"message-text\">This model shows how factors are connected based on scientific research. Click <span class=\"icon ph-plus-circle-bold plus\"></span> to expand or close lower-order factors. Click factors for more detail.</span>\n </div>\n\n <div *ngIf=\"!showModel || !showIndicatorArrows\" class=\"model-smallscreen\">\n <span class=\"icon ph-frame-corners-bold\"></span>\n <span class=\"message-text\">View on a larger device to see more details.</span>\n </div>\n\n <div class=\"model-viewconfiguration\">\n <div class=\"model-viewmode\">\n <div class=\"model-viewmode-label\">View</div>\n <div class=\"model-viewmode-option\" (click)=\"toggleView(false)\" [ngClass]=\"{'selected': !settings.user.modelFilter.advanced}\">\n <span class=\"icon ph-check-fill\" *ngIf=\"!settings.user.modelFilter.advanced\"></span>Simple\n </div>\n <div class=\"model-viewmode-option selected\" (click)=\"toggleView(true)\" [ngClass]=\"{'selected': settings.user.modelFilter.advanced}\">\n <span class=\"icon ph-check-fill\" *ngIf=\"settings.user.modelFilter.advanced\"></span>Advanced\n </div>\n </div>\n\n <div class=\"model-viewmode model-layers\">\n <div class=\"model-viewmode-label\">Source</div>\n\n <div class=\"model-viewmode-option\" *ngFor=\"let layer of settings.user.modelFilter.layers\" (click)=\"toggleLayer(layer)\" [ngClass]=\"{'selected': layer.selected}\">\n <span class=\"icon ph-check-fill\" *ngIf=\"layer.selected\"></span>{{layer.label}}\n </div>\n </div>\n\n <div class=\"model-warnings\" *ngIf=\"globalNotes.length > 0\" notesDialog [notes]=\"globalNotes\">\n <span class=\"ph-warning-fill icon\"></span>\n <span *ngIf=\"globalNotes.length == 1\">{{globalNotes.length}} warning</span>\n <span *ngIf=\"globalNotes.length > 1\">{{globalNotes.length}} warnings</span>\n </div>\n </div>\n\n <div class=\"model-frame\" [class]=\"'model-visualization-' + modelDefinition.publicKey\">\n <ng-container *ngFor=\"let factor of factors\">\n <model-factor-core [factor]=\"factor\" [expandPosition]=\"factor.indicatorPosition\" [allowExpand]=\"showIndicatorArrows\"></model-factor-core>\n </ng-container>\n </div>\n\n <ng-container *ngFor=\"let factor of factors\">\n <arrow [from]=\"'#factor-' + factor.publicKey\" [to]=\"'#factor-' + effect.to\" [onlyVisible]=\"true\" [tail]=\"true\" [head]=\"false\" [width]=\"2\" *ngFor=\"let effect of factor.effects\"></arrow>\n <ng-container *ngIf=\"showIndicatorArrows\">\n <ng-container *ngFor=\"let lowerFactor of factor.lower\">\n <arrow [from]=\"'#factor-' + lowerFactor.publicKey + '-anchor'\" [to]=\"'#factor-' + lowerEffect.to + '-expand'\" [onlyVisible]=\"true\" [tail]=\"false\" [head]=\"false\" [width]=\"1\" *ngFor=\"let lowerEffect of lowerFactor.effects\"></arrow>\n </ng-container>\n </ng-container>\n </ng-container>\n\n <div class=\"model-attribution\">\n <span class=\"icon ph-info-fill\"></span>\n <span>\n <span [innerHtml]=\"modelDefinition.attribution\"></span>\n <span>&nbsp;See our <a href=\"https://github.com/theliberators/scrumteamsurvey.docs/wiki\" target=\"_blank\">wiki</a> for details and a FAQ.</span>\n </span>\n </div>\n </div>\n </div>\n</div>\n", styles: [".smallTextUppercase{font-family:StevieSansThin,sans-serif;font-style:normal;font-weight:400;font-size:15px;line-height:140%;text-transform:uppercase;line-height:100%}.bigletteredbutton{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;text-decoration:none;background:#ffffff1a;margin-bottom:10px;display:flex;align-content:center;border-radius:20px;padding:15px;font-size:24px;border:2px solid #1F3F8F;border-bottom:6px solid #1F3F8F;color:#fff;align-items:center;cursor:pointer}.bigletteredbutton .free{font-family:StevieSansThin,sans-serif;font-style:normal;font-weight:400;font-size:15px;line-height:140%;background:#fff73f;color:#2f2f2f;padding:3px 5px;margin-left:20px;border-radius:10px}.bigletteredbutton .plan{font-family:StevieSansThin,sans-serif;font-style:normal;font-weight:400;font-size:15px;line-height:140%;background:#fff;color:#2f2f2f;padding:3px 5px;margin-left:20px;border-radius:10px}.bigletteredbutton:hover,.bigletteredbutton.selected{border:2px solid #fff73f;border-bottom:6px solid #fff73f}.bigletteredbutton .button-letter{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;border-radius:30px;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center;background:#fff73f;color:#1f3f8f;margin-right:20px}.bigletteredbutton .button-letter .ph{color:#1f3f8f}.bigletteredbutton .button-letter:hover{background:#1f3f8f;color:#fff73f}.bigletteredbutton .button-letter:hover .ph{color:#fff73f}.roundicon-yellow{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;border-radius:30px;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center;background:#fff73f;color:#1f3f8f}.roundicon-yellow .ph{color:#1f3f8f}.roundicon-yellow:hover{background:#1f3f8f;color:#fff73f}.roundicon-yellow:hover .ph{color:#fff73f}.roundicon{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;border-radius:30px;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center}.roundicon-large{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center;border-radius:60px;height:120px;width:120px}.content{border-bottom:3px solid #f0f0f0}@media only screen and (max-width: 1536px){.toolbar-settings{display:flex}}@media only screen and (max-width: 992px){.toolbar-settings{display:block}}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ArrowComponent, selector: "arrow", inputs: ["from", "to", "head", "tail", "text", "toolTip", "color", "width", "onlyVisible", "fromX", "fromY", "toX", "toY"] }, { kind: "directive", type: OpenSettingsDialogDirective, selector: "[settingsDialog]", inputs: ["showSettingStacking"] }, { kind: "directive", type: OpenExportFactorScoresDialogDirective, selector: "[exportFactorScoresDialog]" }, { kind: "directive", type: OpenNotesDialogDirective, selector: "[notesDialog]", inputs: ["notes"] }, { kind: "component", type: ModelFactorCoreComponent, selector: "model-factor-core", inputs: ["factor", "allowExpand", "expandPosition"] }, { kind: "pipe", type: DateRangePipe, name: "dateRange" }] }); }
5027
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: ModelCanvasComponent, deps: [{ token: VIEWSTATE_PROVIDER }, { token: VIEWSTATE_USERSETTINGS_STRATEGY }, { token: UserSettingService }, { token: i1.MatSnackBar }], target: i0.ɵɵFactoryTarget.Component }); }
5028
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.0", type: ModelCanvasComponent, isStandalone: false, selector: "model-canvas", host: { listeners: { "window:resize": "determineScreenSize($event)" } }, usesInheritance: true, ngImport: i0, template: "<div *ngIf=\"!showModel\" class=\"message message-warning\">\n <div><span class=\"icon ph-info-fill\"></span> We've hidden the model visualization because your resolution is too low. Please try a larger device, like a tablet, laptop or desktop.</div>\n</div>\n\n<div class=\"wirebox model\" *ngIf=\"factors && showModel\">\n <div class=\"top\">\n <div class=\"toolbar\">\n <div class=\"toolbar-settings\">\n <div class=\"toolbar-setting\">\n <div class=\"toolbar-setting-title\">Selected Benchmark</div>\n <div class=\"toolbar-setting-label\">{{benchmark}}</div>\n </div>\n <div class=\"toolbar-setting\">\n <div class=\"toolbar-setting-title\">compare results to</div>\n <div class=\"toolbar-setting-label\" *ngIf=\"qualifiedBy == QualifiedByEnum.none\">No comparison</div>\n <div class=\"toolbar-setting-label\" *ngIf=\"qualifiedBy == QualifiedByEnum.delta && deltaType == 'PreviousSnapshot'\">Previous snapshot from {{deltaDateRange | dateRange}}</div>\n <div class=\"toolbar-setting-label\" *ngIf=\"qualifiedBy == QualifiedByEnum.delta && deltaType != 'PreviousSnapshot'\">Current period <span class=\"icon ph-info-fill\" [title]=\"'Current period ranges from ' + (dateRange | dateRange) + '. This includes weighed measurements from ' + pointCount + ' ' + pointType + ': ' + pointNames\"></span> with previous period <span class=\"icon ph-info-fill\" [title]=\"'Previous period ranges from ' + (deltaDateRange | dateRange) + '. This includes weighed measurements from ' + deltaTeams + ' ' + pointType + ': ' + deltaTeamNames\"></span></div>\n <div class=\"toolbar-setting-label\" *ngIf=\"qualifiedBy == QualifiedByEnum.benchmark\">Against benchmark</div>\n </div>\n <div class=\"toolbar-setting\" *ngIf=\"qualifiedBy != QualifiedByEnum.none\">\n <div class=\"toolbar-setting-title\">comparison legend</div>\n <div class=\"toolbar-setting-markers negative\">\n <ng-container *ngIf=\"qualifiedBy == 'Benchmark'\">\n <div class=\"toolbar-setting-marker negative\">\n <span class=\"marker\"></span>\n <span class=\"label\">lower</span>\n </div>\n <div class=\"toolbar-setting-marker positive\">\n <span class=\"marker\"></span>\n <span class=\"label\">higher</span>\n </div>\n </ng-container>\n <ng-container *ngIf=\"qualifiedBy == 'Delta'\">\n <div class=\"toolbar-setting-marker negative\">\n <span class=\"marker\"></span>\n <span class=\"label\">decreased</span>\n </div>\n <div class=\"toolbar-setting-marker positive\">\n <span class=\"marker\"></span>\n <span class=\"label\">improved</span>\n </div>\n </ng-container>\n </div>\n </div>\n </div>\n <div class=\"buttons\">\n <div class=\"button\" id=\"change-settings\" settingsDialog><span class=\"ph-faders icon\"></span> Settings</div>\n <div class=\"button\" id=\"export-factorscores\" exportFactorScoresDialog *ngIf=\"isLoggedIn\"><span class=\"ph-download-simple icon\"></span> Export</div>\n </div>\n </div>\n </div>\n <div class=\"content\">\n <div class=\"model-visualization\">\n <div class=\"model-clarification\">\n <span class=\"icon ph-info-fill\"></span>\n <span class=\"message-text\">This model shows how factors are connected based on scientific research. Click <span class=\"icon ph-plus-circle-bold plus\"></span> to expand or close lower-order factors. Click factors for more detail.</span>\n </div>\n\n <div *ngIf=\"!showModel || !showIndicatorArrows\" class=\"model-smallscreen\">\n <span class=\"icon ph-frame-corners-bold\"></span>\n <span class=\"message-text\">View on a larger device to see more details.</span>\n </div>\n\n <div class=\"model-viewconfiguration\">\n <div class=\"model-viewmode\">\n <div class=\"model-viewmode-label\">View</div>\n <div class=\"model-viewmode-option\" (click)=\"toggleView(false)\" [ngClass]=\"{'selected': !userSettings.settings.user.modelFilter.advanced}\">\n <span class=\"icon ph-check-fill\" *ngIf=\"!userSettings.settings.user.modelFilter.advanced\"></span>Simple\n </div>\n <div class=\"model-viewmode-option selected\" (click)=\"toggleView(true)\" [ngClass]=\"{'selected': userSettings.settings.user.modelFilter.advanced}\">\n <span class=\"icon ph-check-fill\" *ngIf=\"userSettings.settings.user.modelFilter.advanced\"></span>Advanced\n </div>\n </div>\n\n <div class=\"model-viewmode model-layers\">\n <div class=\"model-viewmode-label\">Source</div>\n <div class=\"model-viewmode-option\" *ngFor=\"let layer of userSettings.settings.user.modelFilter.layers\" (click)=\"toggleLayer(layer)\" [ngClass]=\"{'selected': layer.selected}\">\n <span class=\"icon ph-check-fill\" *ngIf=\"layer.selected\"></span>{{layer.label}}\n </div>\n </div>\n\n <div class=\"model-warnings\" *ngIf=\"globalNotes.length > 0\" notesDialog [notes]=\"globalNotes\">\n <span class=\"ph-warning-fill icon\"></span>\n <span *ngIf=\"globalNotes.length == 1\">{{globalNotes.length}} warning</span>\n <span *ngIf=\"globalNotes.length > 1\">{{globalNotes.length}} warnings</span>\n </div>\n </div>\n\n <div class=\"model-frame\" [class]=\"'model-visualization-' + modelDefinition.publicKey\">\n <ng-container *ngFor=\"let factor of factors\">\n <model-factor-core [factor]=\"factor\" [expandPosition]=\"factor.indicatorPosition\" [allowExpand]=\"showIndicatorArrows\"></model-factor-core>\n </ng-container>\n </div>\n\n <ng-container *ngFor=\"let factor of factors\">\n <arrow [from]=\"'#factor-' + factor.publicKey\" [to]=\"'#factor-' + effect.to\" [onlyVisible]=\"true\" [tail]=\"true\" [head]=\"false\" [width]=\"2\" *ngFor=\"let effect of factor.effects\"></arrow>\n <ng-container *ngIf=\"showIndicatorArrows\">\n <ng-container *ngFor=\"let lowerFactor of factor.lower\">\n <arrow [from]=\"'#factor-' + lowerFactor.publicKey + '-anchor'\" [to]=\"'#factor-' + lowerEffect.to + '-expand'\" [onlyVisible]=\"true\" [tail]=\"false\" [head]=\"false\" [width]=\"1\" *ngFor=\"let lowerEffect of lowerFactor.effects\"></arrow>\n </ng-container>\n </ng-container>\n </ng-container>\n\n <div class=\"model-attribution\">\n <span class=\"icon ph-info-fill\"></span>\n <span>\n <span [innerHtml]=\"modelDefinition.attribution\"></span>\n <span>&nbsp;See our <a href=\"https://github.com/theliberators/scrumteamsurvey.docs/wiki\" target=\"_blank\">wiki</a> for details and a FAQ.</span>\n </span>\n </div>\n </div>\n </div>\n</div>\n", styles: [".smallTextUppercase{font-family:StevieSansThin,sans-serif;font-style:normal;font-weight:400;font-size:15px;line-height:140%;text-transform:uppercase;line-height:100%}.bigletteredbutton{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;text-decoration:none;background:#ffffff1a;margin-bottom:10px;display:flex;align-content:center;border-radius:20px;padding:15px;font-size:24px;border:2px solid #1F3F8F;border-bottom:6px solid #1F3F8F;color:#fff;align-items:center;cursor:pointer}.bigletteredbutton .free{font-family:StevieSansThin,sans-serif;font-style:normal;font-weight:400;font-size:15px;line-height:140%;background:#fff73f;color:#2f2f2f;padding:3px 5px;margin-left:20px;border-radius:10px}.bigletteredbutton .plan{font-family:StevieSansThin,sans-serif;font-style:normal;font-weight:400;font-size:15px;line-height:140%;background:#fff;color:#2f2f2f;padding:3px 5px;margin-left:20px;border-radius:10px}.bigletteredbutton:hover,.bigletteredbutton.selected{border:2px solid #fff73f;border-bottom:6px solid #fff73f}.bigletteredbutton .button-letter{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;border-radius:30px;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center;background:#fff73f;color:#1f3f8f;margin-right:20px}.bigletteredbutton .button-letter .ph{color:#1f3f8f}.bigletteredbutton .button-letter:hover{background:#1f3f8f;color:#fff73f}.bigletteredbutton .button-letter:hover .ph{color:#fff73f}.roundicon-yellow{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;border-radius:30px;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center;background:#fff73f;color:#1f3f8f}.roundicon-yellow .ph{color:#1f3f8f}.roundicon-yellow:hover{background:#1f3f8f;color:#fff73f}.roundicon-yellow:hover .ph{color:#fff73f}.roundicon{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;border-radius:30px;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center}.roundicon-large{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center;border-radius:60px;height:120px;width:120px}.content{border-bottom:3px solid #f0f0f0}@media only screen and (max-width: 1536px){.toolbar-settings{display:flex}}@media only screen and (max-width: 992px){.toolbar-settings{display:block}}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ArrowComponent, selector: "arrow", inputs: ["from", "to", "head", "tail", "text", "toolTip", "color", "width", "onlyVisible", "fromX", "fromY", "toX", "toY"] }, { kind: "directive", type: OpenSettingsDialogDirective, selector: "[settingsDialog]", inputs: ["showSettingStacking"] }, { kind: "directive", type: OpenExportFactorScoresDialogDirective, selector: "[exportFactorScoresDialog]" }, { kind: "directive", type: OpenNotesDialogDirective, selector: "[notesDialog]", inputs: ["notes"] }, { kind: "component", type: ModelFactorCoreComponent, selector: "model-factor-core", inputs: ["factor", "allowExpand", "expandPosition"] }, { kind: "pipe", type: DateRangePipe, name: "dateRange" }] }); }
5027
5029
  }
5028
5030
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: ModelCanvasComponent, decorators: [{
5029
5031
  type: Component,
5030
- args: [{ selector: 'model-canvas', standalone: false, template: "<div *ngIf=\"!showModel\" class=\"message message-warning\">\n <div><span class=\"icon ph-info-fill\"></span> We've hidden the model visualization because your resolution is too low. Please try a larger device, like a tablet, laptop or desktop.</div>\n</div>\n\n<div class=\"wirebox model\" *ngIf=\"factors && showModel\">\n <div class=\"top\">\n <div class=\"toolbar\">\n <div class=\"toolbar-settings\">\n <div class=\"toolbar-setting\">\n <div class=\"toolbar-setting-title\">Selected Benchmark</div>\n <div class=\"toolbar-setting-label\">{{benchmark}}</div>\n </div>\n <div class=\"toolbar-setting\">\n <div class=\"toolbar-setting-title\">compare results to</div>\n <div class=\"toolbar-setting-label\" *ngIf=\"qualifiedBy == QualifiedByEnum.none\">No comparison</div>\n <div class=\"toolbar-setting-label\" *ngIf=\"qualifiedBy == QualifiedByEnum.delta && deltaType == 'PreviousSnapshot'\">Previous snapshot from {{deltaDateRange | dateRange}}</div>\n <div class=\"toolbar-setting-label\" *ngIf=\"qualifiedBy == QualifiedByEnum.delta && deltaType != 'PreviousSnapshot'\">Current period <span class=\"icon ph-info-fill\" [title]=\"'Current period ranges from ' + (dateRange | dateRange) + '. This includes weighed measurements from ' + pointCount + ' ' + pointType + ': ' + pointNames\"></span> with previous period <span class=\"icon ph-info-fill\" [title]=\"'Previous period ranges from ' + (deltaDateRange | dateRange) + '. This includes weighed measurements from ' + deltaTeams + ' ' + pointType + ': ' + deltaTeamNames\"></span></div>\n <div class=\"toolbar-setting-label\" *ngIf=\"qualifiedBy == QualifiedByEnum.benchmark\">Against benchmark</div>\n </div>\n <div class=\"toolbar-setting\" *ngIf=\"qualifiedBy != QualifiedByEnum.none\">\n <div class=\"toolbar-setting-title\">comparison legend</div>\n <div class=\"toolbar-setting-markers negative\">\n <ng-container *ngIf=\"qualifiedBy == 'Benchmark'\">\n <div class=\"toolbar-setting-marker negative\">\n <span class=\"marker\"></span>\n <span class=\"label\">lower</span>\n </div>\n <div class=\"toolbar-setting-marker positive\">\n <span class=\"marker\"></span>\n <span class=\"label\">higher</span>\n </div>\n </ng-container>\n <ng-container *ngIf=\"qualifiedBy == 'Delta'\">\n <div class=\"toolbar-setting-marker negative\">\n <span class=\"marker\"></span>\n <span class=\"label\">decreased</span>\n </div>\n <div class=\"toolbar-setting-marker positive\">\n <span class=\"marker\"></span>\n <span class=\"label\">improved</span>\n </div>\n </ng-container>\n </div>\n </div>\n </div>\n <div class=\"buttons\">\n <div class=\"button\" id=\"change-settings\" settingsDialog><span class=\"ph-faders icon\"></span> Settings</div>\n <div class=\"button\" id=\"export-factorscores\" exportFactorScoresDialog *ngIf=\"isLoggedIn\"><span class=\"ph-download-simple icon\"></span> Export</div>\n </div>\n </div>\n </div>\n <div class=\"content\">\n <div class=\"model-visualization\">\n <div class=\"model-clarification\">\n <span class=\"icon ph-info-fill\"></span>\n <span class=\"message-text\">This model shows how factors are connected based on scientific research. Click <span class=\"icon ph-plus-circle-bold plus\"></span> to expand or close lower-order factors. Click factors for more detail.</span>\n </div>\n\n <div *ngIf=\"!showModel || !showIndicatorArrows\" class=\"model-smallscreen\">\n <span class=\"icon ph-frame-corners-bold\"></span>\n <span class=\"message-text\">View on a larger device to see more details.</span>\n </div>\n\n <div class=\"model-viewconfiguration\">\n <div class=\"model-viewmode\">\n <div class=\"model-viewmode-label\">View</div>\n <div class=\"model-viewmode-option\" (click)=\"toggleView(false)\" [ngClass]=\"{'selected': !settings.user.modelFilter.advanced}\">\n <span class=\"icon ph-check-fill\" *ngIf=\"!settings.user.modelFilter.advanced\"></span>Simple\n </div>\n <div class=\"model-viewmode-option selected\" (click)=\"toggleView(true)\" [ngClass]=\"{'selected': settings.user.modelFilter.advanced}\">\n <span class=\"icon ph-check-fill\" *ngIf=\"settings.user.modelFilter.advanced\"></span>Advanced\n </div>\n </div>\n\n <div class=\"model-viewmode model-layers\">\n <div class=\"model-viewmode-label\">Source</div>\n\n <div class=\"model-viewmode-option\" *ngFor=\"let layer of settings.user.modelFilter.layers\" (click)=\"toggleLayer(layer)\" [ngClass]=\"{'selected': layer.selected}\">\n <span class=\"icon ph-check-fill\" *ngIf=\"layer.selected\"></span>{{layer.label}}\n </div>\n </div>\n\n <div class=\"model-warnings\" *ngIf=\"globalNotes.length > 0\" notesDialog [notes]=\"globalNotes\">\n <span class=\"ph-warning-fill icon\"></span>\n <span *ngIf=\"globalNotes.length == 1\">{{globalNotes.length}} warning</span>\n <span *ngIf=\"globalNotes.length > 1\">{{globalNotes.length}} warnings</span>\n </div>\n </div>\n\n <div class=\"model-frame\" [class]=\"'model-visualization-' + modelDefinition.publicKey\">\n <ng-container *ngFor=\"let factor of factors\">\n <model-factor-core [factor]=\"factor\" [expandPosition]=\"factor.indicatorPosition\" [allowExpand]=\"showIndicatorArrows\"></model-factor-core>\n </ng-container>\n </div>\n\n <ng-container *ngFor=\"let factor of factors\">\n <arrow [from]=\"'#factor-' + factor.publicKey\" [to]=\"'#factor-' + effect.to\" [onlyVisible]=\"true\" [tail]=\"true\" [head]=\"false\" [width]=\"2\" *ngFor=\"let effect of factor.effects\"></arrow>\n <ng-container *ngIf=\"showIndicatorArrows\">\n <ng-container *ngFor=\"let lowerFactor of factor.lower\">\n <arrow [from]=\"'#factor-' + lowerFactor.publicKey + '-anchor'\" [to]=\"'#factor-' + lowerEffect.to + '-expand'\" [onlyVisible]=\"true\" [tail]=\"false\" [head]=\"false\" [width]=\"1\" *ngFor=\"let lowerEffect of lowerFactor.effects\"></arrow>\n </ng-container>\n </ng-container>\n </ng-container>\n\n <div class=\"model-attribution\">\n <span class=\"icon ph-info-fill\"></span>\n <span>\n <span [innerHtml]=\"modelDefinition.attribution\"></span>\n <span>&nbsp;See our <a href=\"https://github.com/theliberators/scrumteamsurvey.docs/wiki\" target=\"_blank\">wiki</a> for details and a FAQ.</span>\n </span>\n </div>\n </div>\n </div>\n</div>\n", styles: [".smallTextUppercase{font-family:StevieSansThin,sans-serif;font-style:normal;font-weight:400;font-size:15px;line-height:140%;text-transform:uppercase;line-height:100%}.bigletteredbutton{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;text-decoration:none;background:#ffffff1a;margin-bottom:10px;display:flex;align-content:center;border-radius:20px;padding:15px;font-size:24px;border:2px solid #1F3F8F;border-bottom:6px solid #1F3F8F;color:#fff;align-items:center;cursor:pointer}.bigletteredbutton .free{font-family:StevieSansThin,sans-serif;font-style:normal;font-weight:400;font-size:15px;line-height:140%;background:#fff73f;color:#2f2f2f;padding:3px 5px;margin-left:20px;border-radius:10px}.bigletteredbutton .plan{font-family:StevieSansThin,sans-serif;font-style:normal;font-weight:400;font-size:15px;line-height:140%;background:#fff;color:#2f2f2f;padding:3px 5px;margin-left:20px;border-radius:10px}.bigletteredbutton:hover,.bigletteredbutton.selected{border:2px solid #fff73f;border-bottom:6px solid #fff73f}.bigletteredbutton .button-letter{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;border-radius:30px;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center;background:#fff73f;color:#1f3f8f;margin-right:20px}.bigletteredbutton .button-letter .ph{color:#1f3f8f}.bigletteredbutton .button-letter:hover{background:#1f3f8f;color:#fff73f}.bigletteredbutton .button-letter:hover .ph{color:#fff73f}.roundicon-yellow{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;border-radius:30px;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center;background:#fff73f;color:#1f3f8f}.roundicon-yellow .ph{color:#1f3f8f}.roundicon-yellow:hover{background:#1f3f8f;color:#fff73f}.roundicon-yellow:hover .ph{color:#fff73f}.roundicon{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;border-radius:30px;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center}.roundicon-large{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center;border-radius:60px;height:120px;width:120px}.content{border-bottom:3px solid #f0f0f0}@media only screen and (max-width: 1536px){.toolbar-settings{display:flex}}@media only screen and (max-width: 992px){.toolbar-settings{display:block}}\n"] }]
5032
+ args: [{ selector: 'model-canvas', standalone: false, template: "<div *ngIf=\"!showModel\" class=\"message message-warning\">\n <div><span class=\"icon ph-info-fill\"></span> We've hidden the model visualization because your resolution is too low. Please try a larger device, like a tablet, laptop or desktop.</div>\n</div>\n\n<div class=\"wirebox model\" *ngIf=\"factors && showModel\">\n <div class=\"top\">\n <div class=\"toolbar\">\n <div class=\"toolbar-settings\">\n <div class=\"toolbar-setting\">\n <div class=\"toolbar-setting-title\">Selected Benchmark</div>\n <div class=\"toolbar-setting-label\">{{benchmark}}</div>\n </div>\n <div class=\"toolbar-setting\">\n <div class=\"toolbar-setting-title\">compare results to</div>\n <div class=\"toolbar-setting-label\" *ngIf=\"qualifiedBy == QualifiedByEnum.none\">No comparison</div>\n <div class=\"toolbar-setting-label\" *ngIf=\"qualifiedBy == QualifiedByEnum.delta && deltaType == 'PreviousSnapshot'\">Previous snapshot from {{deltaDateRange | dateRange}}</div>\n <div class=\"toolbar-setting-label\" *ngIf=\"qualifiedBy == QualifiedByEnum.delta && deltaType != 'PreviousSnapshot'\">Current period <span class=\"icon ph-info-fill\" [title]=\"'Current period ranges from ' + (dateRange | dateRange) + '. This includes weighed measurements from ' + pointCount + ' ' + pointType + ': ' + pointNames\"></span> with previous period <span class=\"icon ph-info-fill\" [title]=\"'Previous period ranges from ' + (deltaDateRange | dateRange) + '. This includes weighed measurements from ' + deltaTeams + ' ' + pointType + ': ' + deltaTeamNames\"></span></div>\n <div class=\"toolbar-setting-label\" *ngIf=\"qualifiedBy == QualifiedByEnum.benchmark\">Against benchmark</div>\n </div>\n <div class=\"toolbar-setting\" *ngIf=\"qualifiedBy != QualifiedByEnum.none\">\n <div class=\"toolbar-setting-title\">comparison legend</div>\n <div class=\"toolbar-setting-markers negative\">\n <ng-container *ngIf=\"qualifiedBy == 'Benchmark'\">\n <div class=\"toolbar-setting-marker negative\">\n <span class=\"marker\"></span>\n <span class=\"label\">lower</span>\n </div>\n <div class=\"toolbar-setting-marker positive\">\n <span class=\"marker\"></span>\n <span class=\"label\">higher</span>\n </div>\n </ng-container>\n <ng-container *ngIf=\"qualifiedBy == 'Delta'\">\n <div class=\"toolbar-setting-marker negative\">\n <span class=\"marker\"></span>\n <span class=\"label\">decreased</span>\n </div>\n <div class=\"toolbar-setting-marker positive\">\n <span class=\"marker\"></span>\n <span class=\"label\">improved</span>\n </div>\n </ng-container>\n </div>\n </div>\n </div>\n <div class=\"buttons\">\n <div class=\"button\" id=\"change-settings\" settingsDialog><span class=\"ph-faders icon\"></span> Settings</div>\n <div class=\"button\" id=\"export-factorscores\" exportFactorScoresDialog *ngIf=\"isLoggedIn\"><span class=\"ph-download-simple icon\"></span> Export</div>\n </div>\n </div>\n </div>\n <div class=\"content\">\n <div class=\"model-visualization\">\n <div class=\"model-clarification\">\n <span class=\"icon ph-info-fill\"></span>\n <span class=\"message-text\">This model shows how factors are connected based on scientific research. Click <span class=\"icon ph-plus-circle-bold plus\"></span> to expand or close lower-order factors. Click factors for more detail.</span>\n </div>\n\n <div *ngIf=\"!showModel || !showIndicatorArrows\" class=\"model-smallscreen\">\n <span class=\"icon ph-frame-corners-bold\"></span>\n <span class=\"message-text\">View on a larger device to see more details.</span>\n </div>\n\n <div class=\"model-viewconfiguration\">\n <div class=\"model-viewmode\">\n <div class=\"model-viewmode-label\">View</div>\n <div class=\"model-viewmode-option\" (click)=\"toggleView(false)\" [ngClass]=\"{'selected': !userSettings.settings.user.modelFilter.advanced}\">\n <span class=\"icon ph-check-fill\" *ngIf=\"!userSettings.settings.user.modelFilter.advanced\"></span>Simple\n </div>\n <div class=\"model-viewmode-option selected\" (click)=\"toggleView(true)\" [ngClass]=\"{'selected': userSettings.settings.user.modelFilter.advanced}\">\n <span class=\"icon ph-check-fill\" *ngIf=\"userSettings.settings.user.modelFilter.advanced\"></span>Advanced\n </div>\n </div>\n\n <div class=\"model-viewmode model-layers\">\n <div class=\"model-viewmode-label\">Source</div>\n <div class=\"model-viewmode-option\" *ngFor=\"let layer of userSettings.settings.user.modelFilter.layers\" (click)=\"toggleLayer(layer)\" [ngClass]=\"{'selected': layer.selected}\">\n <span class=\"icon ph-check-fill\" *ngIf=\"layer.selected\"></span>{{layer.label}}\n </div>\n </div>\n\n <div class=\"model-warnings\" *ngIf=\"globalNotes.length > 0\" notesDialog [notes]=\"globalNotes\">\n <span class=\"ph-warning-fill icon\"></span>\n <span *ngIf=\"globalNotes.length == 1\">{{globalNotes.length}} warning</span>\n <span *ngIf=\"globalNotes.length > 1\">{{globalNotes.length}} warnings</span>\n </div>\n </div>\n\n <div class=\"model-frame\" [class]=\"'model-visualization-' + modelDefinition.publicKey\">\n <ng-container *ngFor=\"let factor of factors\">\n <model-factor-core [factor]=\"factor\" [expandPosition]=\"factor.indicatorPosition\" [allowExpand]=\"showIndicatorArrows\"></model-factor-core>\n </ng-container>\n </div>\n\n <ng-container *ngFor=\"let factor of factors\">\n <arrow [from]=\"'#factor-' + factor.publicKey\" [to]=\"'#factor-' + effect.to\" [onlyVisible]=\"true\" [tail]=\"true\" [head]=\"false\" [width]=\"2\" *ngFor=\"let effect of factor.effects\"></arrow>\n <ng-container *ngIf=\"showIndicatorArrows\">\n <ng-container *ngFor=\"let lowerFactor of factor.lower\">\n <arrow [from]=\"'#factor-' + lowerFactor.publicKey + '-anchor'\" [to]=\"'#factor-' + lowerEffect.to + '-expand'\" [onlyVisible]=\"true\" [tail]=\"false\" [head]=\"false\" [width]=\"1\" *ngFor=\"let lowerEffect of lowerFactor.effects\"></arrow>\n </ng-container>\n </ng-container>\n </ng-container>\n\n <div class=\"model-attribution\">\n <span class=\"icon ph-info-fill\"></span>\n <span>\n <span [innerHtml]=\"modelDefinition.attribution\"></span>\n <span>&nbsp;See our <a href=\"https://github.com/theliberators/scrumteamsurvey.docs/wiki\" target=\"_blank\">wiki</a> for details and a FAQ.</span>\n </span>\n </div>\n </div>\n </div>\n</div>\n", styles: [".smallTextUppercase{font-family:StevieSansThin,sans-serif;font-style:normal;font-weight:400;font-size:15px;line-height:140%;text-transform:uppercase;line-height:100%}.bigletteredbutton{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;text-decoration:none;background:#ffffff1a;margin-bottom:10px;display:flex;align-content:center;border-radius:20px;padding:15px;font-size:24px;border:2px solid #1F3F8F;border-bottom:6px solid #1F3F8F;color:#fff;align-items:center;cursor:pointer}.bigletteredbutton .free{font-family:StevieSansThin,sans-serif;font-style:normal;font-weight:400;font-size:15px;line-height:140%;background:#fff73f;color:#2f2f2f;padding:3px 5px;margin-left:20px;border-radius:10px}.bigletteredbutton .plan{font-family:StevieSansThin,sans-serif;font-style:normal;font-weight:400;font-size:15px;line-height:140%;background:#fff;color:#2f2f2f;padding:3px 5px;margin-left:20px;border-radius:10px}.bigletteredbutton:hover,.bigletteredbutton.selected{border:2px solid #fff73f;border-bottom:6px solid #fff73f}.bigletteredbutton .button-letter{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;border-radius:30px;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center;background:#fff73f;color:#1f3f8f;margin-right:20px}.bigletteredbutton .button-letter .ph{color:#1f3f8f}.bigletteredbutton .button-letter:hover{background:#1f3f8f;color:#fff73f}.bigletteredbutton .button-letter:hover .ph{color:#fff73f}.roundicon-yellow{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;border-radius:30px;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center;background:#fff73f;color:#1f3f8f}.roundicon-yellow .ph{color:#1f3f8f}.roundicon-yellow:hover{background:#1f3f8f;color:#fff73f}.roundicon-yellow:hover .ph{color:#fff73f}.roundicon{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;border-radius:30px;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center}.roundicon-large{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center;border-radius:60px;height:120px;width:120px}.content{border-bottom:3px solid #f0f0f0}@media only screen and (max-width: 1536px){.toolbar-settings{display:flex}}@media only screen and (max-width: 992px){.toolbar-settings{display:block}}\n"] }]
5031
5033
  }], ctorParameters: () => [{ type: ViewModelStateBase, decorators: [{
5032
5034
  type: Inject,
5033
5035
  args: [VIEWSTATE_PROVIDER]
5036
+ }] }, { type: undefined, decorators: [{
5037
+ type: Inject,
5038
+ args: [VIEWSTATE_USERSETTINGS_STRATEGY]
5034
5039
  }] }, { type: UserSettingService }, { type: i1.MatSnackBar }], propDecorators: { determineScreenSize: [{
5035
5040
  type: HostListener,
5036
5041
  args: ['window:resize', ['$event']]
@@ -5942,7 +5947,13 @@ class TipBadgeComponent extends ComponentWithViewStateBase {
5942
5947
  this.label = "good";
5943
5948
  break;
5944
5949
  case "negative":
5945
- this.label = "urgent";
5950
+ if (this.impact > 50) {
5951
+ this.label = "important";
5952
+ }
5953
+ else {
5954
+ this.class = "neutral";
5955
+ this.label = "improve";
5956
+ }
5946
5957
  break;
5947
5958
  default:
5948
5959
  this.label = "average";
@@ -6120,11 +6131,11 @@ class FocusAreasComponent extends ComponentWithViewStateBase {
6120
6131
  return items.length > 0 ? " to improve " + item.effects.filter(p => p.type == EffectTypeEnum.predicts)[0].name : null;
6121
6132
  }
6122
6133
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: FocusAreasComponent, deps: [{ token: VIEWSTATE_PROVIDER }, { token: i1.MatSnackBar }], target: i0.ɵɵFactoryTarget.Component }); }
6123
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.0", type: FocusAreasComponent, isStandalone: false, selector: "focusareas", inputs: { limit: "limit" }, usesInheritance: true, ngImport: i0, template: "<div class=\"wirebox contentwithborders focusareas\">\n <h3>Focus areas</h3>\n <ng-container *ngIf=\"count > 0\">\n <p>Based on the data, we recommend that you focus on the following areas. They are most likely to improve the effectiveness of your teams:</p>\n <div class=\"focusarea\" [routerLink]=\"[baseUrl, 'tips']\" *ngFor=\"let item of focusAreas; let index = index\" [ngClass]=\"{'first': index == 0}\">\n <div class=\"index\">{{index + 1}}</div>\n <div class=\"name\">Invest in <b>{{item.name}}</b>{{getCoreFactor(item)}}</div>\n <div class=\"impact\"><span class=\"badge nofeedback\">impact <impact-indicator [factorScore]=\"item\"></impact-indicator></span></div>\n <div [routerLink]=\"[baseUrl, 'tips']\" [fragment]=\"item.key\" class=\"more\">discover how ></div>\n </div>\n <div class=\"link\">\n <a [routerLink]=\"[baseUrl, 'tips']\">discover tips for all areas ></a>\n </div>\n </ng-container>\n <ng-container *ngIf=\"count == 0\">\n <p>Once you have one or more snapshots for your team(s), you can find useful evidence-based feedback here.</p>\n </ng-container>\n</div>\n", styles: [".smallTextUppercase{font-family:StevieSansThin,sans-serif;font-style:normal;font-weight:400;font-size:15px;line-height:140%;text-transform:uppercase;line-height:100%}.bigletteredbutton{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;text-decoration:none;background:#ffffff1a;margin-bottom:10px;display:flex;align-content:center;border-radius:20px;padding:15px;font-size:24px;border:2px solid #1F3F8F;border-bottom:6px solid #1F3F8F;color:#fff;align-items:center;cursor:pointer}.bigletteredbutton .free{font-family:StevieSansThin,sans-serif;font-style:normal;font-weight:400;font-size:15px;line-height:140%;background:#fff73f;color:#2f2f2f;padding:3px 5px;margin-left:20px;border-radius:10px}.bigletteredbutton .plan{font-family:StevieSansThin,sans-serif;font-style:normal;font-weight:400;font-size:15px;line-height:140%;background:#fff;color:#2f2f2f;padding:3px 5px;margin-left:20px;border-radius:10px}.bigletteredbutton:hover,.bigletteredbutton.selected{border:2px solid #fff73f;border-bottom:6px solid #fff73f}.bigletteredbutton .button-letter{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;border-radius:30px;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center;background:#fff73f;color:#1f3f8f;margin-right:20px}.bigletteredbutton .button-letter .ph{color:#1f3f8f}.bigletteredbutton .button-letter:hover{background:#1f3f8f;color:#fff73f}.bigletteredbutton .button-letter:hover .ph{color:#fff73f}.roundicon-yellow{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;border-radius:30px;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center;background:#fff73f;color:#1f3f8f}.roundicon-yellow .ph{color:#1f3f8f}.roundicon-yellow:hover{background:#1f3f8f;color:#fff73f}.roundicon-yellow:hover .ph{color:#fff73f}.roundicon{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;border-radius:30px;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center}.roundicon-large{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center;border-radius:60px;height:120px;width:120px}.focusareas .focusarea{cursor:pointer;display:flex;align-items:center;padding:15px 10px;border-top:3px solid #f0f0f0}.focusareas .focusarea:hover{background:#f0f0f0}.focusareas .focusarea.first{border-top:none}.focusareas .focusarea .index{width:50px;height:50px;min-width:50px;min-height:50px;display:flex;justify-content:center;align-items:center;border-radius:25px;background:#1f3f8f;margin-right:15px;color:#fff;font-weight:600}.focusareas .focusarea .impact{margin-left:15px;white-space:pre}@media only screen and (max-width: 992px){.focusareas .focusarea .impact{display:none}}.focusareas .focusarea .more{margin-left:15px;font-weight:600;font-size:15px;font-family:StevieSans,sans-serif;white-space:nowrap}@media only screen and (max-width: 992px){.focusareas .focusarea .more{display:none}}.focusareas .focusarea .more .icon{vertical-align:middle}.focusareas .link{margin-top:30px;text-align:right;white-space:nowrap}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: ImpactIndicatorComponent, selector: "impact-indicator", inputs: ["factorScore"] }] }); }
6134
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.0", type: FocusAreasComponent, isStandalone: false, selector: "focusareas", inputs: { limit: "limit" }, usesInheritance: true, ngImport: i0, template: "<div class=\"wirebox contentwithborders focusareas\">\n <h3>Focus areas</h3>\n <ng-container *ngIf=\"count > 0\">\n <p>Based on the data, we recommend to focus on the following areas:</p>\n <div class=\"focusarea\" [routerLink]=\"[baseUrl, 'tips']\" *ngFor=\"let item of focusAreas; let index = index\" [ngClass]=\"{'first': index == 0}\">\n <div class=\"index\">{{index + 1}}</div>\n <div class=\"name\">Invest in <b>{{item.name}}</b>{{getCoreFactor(item)}}</div>\n <div class=\"impact\"><span class=\"badge nofeedback\">impact <impact-indicator [factorScore]=\"item\"></impact-indicator></span></div>\n <div [routerLink]=\"[baseUrl, 'tips']\" [fragment]=\"item.key\" class=\"more\">discover how ></div>\n </div>\n <div class=\"link\">\n <a [routerLink]=\"[baseUrl, 'tips']\">more recommendations ></a>\n </div>\n </ng-container>\n <ng-container *ngIf=\"count == 0\">\n <p>Once you have one or more snapshots for your team(s), you can find useful evidence-based feedback here.</p>\n </ng-container>\n</div>\n", styles: [".smallTextUppercase{font-family:StevieSansThin,sans-serif;font-style:normal;font-weight:400;font-size:15px;line-height:140%;text-transform:uppercase;line-height:100%}.bigletteredbutton{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;text-decoration:none;background:#ffffff1a;margin-bottom:10px;display:flex;align-content:center;border-radius:20px;padding:15px;font-size:24px;border:2px solid #1F3F8F;border-bottom:6px solid #1F3F8F;color:#fff;align-items:center;cursor:pointer}.bigletteredbutton .free{font-family:StevieSansThin,sans-serif;font-style:normal;font-weight:400;font-size:15px;line-height:140%;background:#fff73f;color:#2f2f2f;padding:3px 5px;margin-left:20px;border-radius:10px}.bigletteredbutton .plan{font-family:StevieSansThin,sans-serif;font-style:normal;font-weight:400;font-size:15px;line-height:140%;background:#fff;color:#2f2f2f;padding:3px 5px;margin-left:20px;border-radius:10px}.bigletteredbutton:hover,.bigletteredbutton.selected{border:2px solid #fff73f;border-bottom:6px solid #fff73f}.bigletteredbutton .button-letter{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;border-radius:30px;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center;background:#fff73f;color:#1f3f8f;margin-right:20px}.bigletteredbutton .button-letter .ph{color:#1f3f8f}.bigletteredbutton .button-letter:hover{background:#1f3f8f;color:#fff73f}.bigletteredbutton .button-letter:hover .ph{color:#fff73f}.roundicon-yellow{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;border-radius:30px;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center;background:#fff73f;color:#1f3f8f}.roundicon-yellow .ph{color:#1f3f8f}.roundicon-yellow:hover{background:#1f3f8f;color:#fff73f}.roundicon-yellow:hover .ph{color:#fff73f}.roundicon{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;border-radius:30px;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center}.roundicon-large{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center;border-radius:60px;height:120px;width:120px}.focusareas .focusarea{cursor:pointer;display:flex;align-items:center;padding:15px 10px;border-top:3px solid #f0f0f0}.focusareas .focusarea:hover{background:#f0f0f0}.focusareas .focusarea.first{border-top:none}.focusareas .focusarea .index{width:50px;height:50px;min-width:50px;min-height:50px;display:flex;justify-content:center;align-items:center;border-radius:25px;background:#1f3f8f;margin-right:15px;color:#fff;font-weight:600}.focusareas .focusarea .impact{margin-left:15px;white-space:pre}@media only screen and (max-width: 992px){.focusareas .focusarea .impact{display:none}}.focusareas .focusarea .more{margin-left:15px;font-weight:600;font-size:15px;font-family:StevieSans,sans-serif;white-space:nowrap}@media only screen and (max-width: 992px){.focusareas .focusarea .more{display:none}}.focusareas .focusarea .more .icon{vertical-align:middle}.focusareas .link{margin-top:30px;text-align:right;white-space:nowrap}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: ImpactIndicatorComponent, selector: "impact-indicator", inputs: ["factorScore"] }] }); }
6124
6135
  }
6125
6136
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: FocusAreasComponent, decorators: [{
6126
6137
  type: Component,
6127
- args: [{ selector: 'focusareas', standalone: false, template: "<div class=\"wirebox contentwithborders focusareas\">\n <h3>Focus areas</h3>\n <ng-container *ngIf=\"count > 0\">\n <p>Based on the data, we recommend that you focus on the following areas. They are most likely to improve the effectiveness of your teams:</p>\n <div class=\"focusarea\" [routerLink]=\"[baseUrl, 'tips']\" *ngFor=\"let item of focusAreas; let index = index\" [ngClass]=\"{'first': index == 0}\">\n <div class=\"index\">{{index + 1}}</div>\n <div class=\"name\">Invest in <b>{{item.name}}</b>{{getCoreFactor(item)}}</div>\n <div class=\"impact\"><span class=\"badge nofeedback\">impact <impact-indicator [factorScore]=\"item\"></impact-indicator></span></div>\n <div [routerLink]=\"[baseUrl, 'tips']\" [fragment]=\"item.key\" class=\"more\">discover how ></div>\n </div>\n <div class=\"link\">\n <a [routerLink]=\"[baseUrl, 'tips']\">discover tips for all areas ></a>\n </div>\n </ng-container>\n <ng-container *ngIf=\"count == 0\">\n <p>Once you have one or more snapshots for your team(s), you can find useful evidence-based feedback here.</p>\n </ng-container>\n</div>\n", styles: [".smallTextUppercase{font-family:StevieSansThin,sans-serif;font-style:normal;font-weight:400;font-size:15px;line-height:140%;text-transform:uppercase;line-height:100%}.bigletteredbutton{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;text-decoration:none;background:#ffffff1a;margin-bottom:10px;display:flex;align-content:center;border-radius:20px;padding:15px;font-size:24px;border:2px solid #1F3F8F;border-bottom:6px solid #1F3F8F;color:#fff;align-items:center;cursor:pointer}.bigletteredbutton .free{font-family:StevieSansThin,sans-serif;font-style:normal;font-weight:400;font-size:15px;line-height:140%;background:#fff73f;color:#2f2f2f;padding:3px 5px;margin-left:20px;border-radius:10px}.bigletteredbutton .plan{font-family:StevieSansThin,sans-serif;font-style:normal;font-weight:400;font-size:15px;line-height:140%;background:#fff;color:#2f2f2f;padding:3px 5px;margin-left:20px;border-radius:10px}.bigletteredbutton:hover,.bigletteredbutton.selected{border:2px solid #fff73f;border-bottom:6px solid #fff73f}.bigletteredbutton .button-letter{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;border-radius:30px;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center;background:#fff73f;color:#1f3f8f;margin-right:20px}.bigletteredbutton .button-letter .ph{color:#1f3f8f}.bigletteredbutton .button-letter:hover{background:#1f3f8f;color:#fff73f}.bigletteredbutton .button-letter:hover .ph{color:#fff73f}.roundicon-yellow{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;border-radius:30px;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center;background:#fff73f;color:#1f3f8f}.roundicon-yellow .ph{color:#1f3f8f}.roundicon-yellow:hover{background:#1f3f8f;color:#fff73f}.roundicon-yellow:hover .ph{color:#fff73f}.roundicon{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;border-radius:30px;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center}.roundicon-large{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center;border-radius:60px;height:120px;width:120px}.focusareas .focusarea{cursor:pointer;display:flex;align-items:center;padding:15px 10px;border-top:3px solid #f0f0f0}.focusareas .focusarea:hover{background:#f0f0f0}.focusareas .focusarea.first{border-top:none}.focusareas .focusarea .index{width:50px;height:50px;min-width:50px;min-height:50px;display:flex;justify-content:center;align-items:center;border-radius:25px;background:#1f3f8f;margin-right:15px;color:#fff;font-weight:600}.focusareas .focusarea .impact{margin-left:15px;white-space:pre}@media only screen and (max-width: 992px){.focusareas .focusarea .impact{display:none}}.focusareas .focusarea .more{margin-left:15px;font-weight:600;font-size:15px;font-family:StevieSans,sans-serif;white-space:nowrap}@media only screen and (max-width: 992px){.focusareas .focusarea .more{display:none}}.focusareas .focusarea .more .icon{vertical-align:middle}.focusareas .link{margin-top:30px;text-align:right;white-space:nowrap}\n"] }]
6138
+ args: [{ selector: 'focusareas', standalone: false, template: "<div class=\"wirebox contentwithborders focusareas\">\n <h3>Focus areas</h3>\n <ng-container *ngIf=\"count > 0\">\n <p>Based on the data, we recommend to focus on the following areas:</p>\n <div class=\"focusarea\" [routerLink]=\"[baseUrl, 'tips']\" *ngFor=\"let item of focusAreas; let index = index\" [ngClass]=\"{'first': index == 0}\">\n <div class=\"index\">{{index + 1}}</div>\n <div class=\"name\">Invest in <b>{{item.name}}</b>{{getCoreFactor(item)}}</div>\n <div class=\"impact\"><span class=\"badge nofeedback\">impact <impact-indicator [factorScore]=\"item\"></impact-indicator></span></div>\n <div [routerLink]=\"[baseUrl, 'tips']\" [fragment]=\"item.key\" class=\"more\">discover how ></div>\n </div>\n <div class=\"link\">\n <a [routerLink]=\"[baseUrl, 'tips']\">more recommendations ></a>\n </div>\n </ng-container>\n <ng-container *ngIf=\"count == 0\">\n <p>Once you have one or more snapshots for your team(s), you can find useful evidence-based feedback here.</p>\n </ng-container>\n</div>\n", styles: [".smallTextUppercase{font-family:StevieSansThin,sans-serif;font-style:normal;font-weight:400;font-size:15px;line-height:140%;text-transform:uppercase;line-height:100%}.bigletteredbutton{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;text-decoration:none;background:#ffffff1a;margin-bottom:10px;display:flex;align-content:center;border-radius:20px;padding:15px;font-size:24px;border:2px solid #1F3F8F;border-bottom:6px solid #1F3F8F;color:#fff;align-items:center;cursor:pointer}.bigletteredbutton .free{font-family:StevieSansThin,sans-serif;font-style:normal;font-weight:400;font-size:15px;line-height:140%;background:#fff73f;color:#2f2f2f;padding:3px 5px;margin-left:20px;border-radius:10px}.bigletteredbutton .plan{font-family:StevieSansThin,sans-serif;font-style:normal;font-weight:400;font-size:15px;line-height:140%;background:#fff;color:#2f2f2f;padding:3px 5px;margin-left:20px;border-radius:10px}.bigletteredbutton:hover,.bigletteredbutton.selected{border:2px solid #fff73f;border-bottom:6px solid #fff73f}.bigletteredbutton .button-letter{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;border-radius:30px;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center;background:#fff73f;color:#1f3f8f;margin-right:20px}.bigletteredbutton .button-letter .ph{color:#1f3f8f}.bigletteredbutton .button-letter:hover{background:#1f3f8f;color:#fff73f}.bigletteredbutton .button-letter:hover .ph{color:#fff73f}.roundicon-yellow{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;border-radius:30px;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center;background:#fff73f;color:#1f3f8f}.roundicon-yellow .ph{color:#1f3f8f}.roundicon-yellow:hover{background:#1f3f8f;color:#fff73f}.roundicon-yellow:hover .ph{color:#fff73f}.roundicon{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;border-radius:30px;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center}.roundicon-large{-webkit-transition:all .25s ease-in-out;-moz-transition:all .25s ease-in-out;-o-transition:all .25s ease-in-out;transition:all .25s ease-in-out;font-family:StevieSans,sans-serif;height:52px;width:52px;min-width:52px;min-height:52px;font-weight:900;font-size:30px;line-height:100%;display:flex;align-items:center;justify-content:center;border-radius:60px;height:120px;width:120px}.focusareas .focusarea{cursor:pointer;display:flex;align-items:center;padding:15px 10px;border-top:3px solid #f0f0f0}.focusareas .focusarea:hover{background:#f0f0f0}.focusareas .focusarea.first{border-top:none}.focusareas .focusarea .index{width:50px;height:50px;min-width:50px;min-height:50px;display:flex;justify-content:center;align-items:center;border-radius:25px;background:#1f3f8f;margin-right:15px;color:#fff;font-weight:600}.focusareas .focusarea .impact{margin-left:15px;white-space:pre}@media only screen and (max-width: 992px){.focusareas .focusarea .impact{display:none}}.focusareas .focusarea .more{margin-left:15px;font-weight:600;font-size:15px;font-family:StevieSans,sans-serif;white-space:nowrap}@media only screen and (max-width: 992px){.focusareas .focusarea .more{display:none}}.focusareas .focusarea .more .icon{vertical-align:middle}.focusareas .link{margin-top:30px;text-align:right;white-space:nowrap}\n"] }]
6128
6139
  }], ctorParameters: () => [{ type: ViewModelStateBase, decorators: [{
6129
6140
  type: Inject,
6130
6141
  args: [VIEWSTATE_PROVIDER]
@@ -6251,6 +6262,7 @@ class DialogModelFilterComponent extends ComponentWithViewStateBase {
6251
6262
  this.userSettings.settings.user.modelKey = this.form.controls.activeModel.value.publicKey;
6252
6263
  await this.userSettings.apply();
6253
6264
  this.dialogRef.close();
6265
+ console.log(this.userSettings.settings.user.modelFilter);
6254
6266
  }
6255
6267
  createForm() {
6256
6268
  this.form = this.formBuilder.group({