Hide type colors in new work package contexts

frontend/src/app/components/work-packages/wp-type-status/wp-type-status.html

@@ -8,6 +8,7 @@
   </div>
   <div class="work-packages--type-selector wp-new-top-row--element">
     <wp-edit-field [workPackageId]="workPackage.id"
+                   [displayFieldOptions]="{ colorize: false }"
                    [wrapperClasses]="'wp-new-top-row--type -no-label'"
                    [fieldName]="'type'">
     </wp-edit-field>

frontend/src/app/components/wp-edit-form/display-field-renderer.ts

@@ -3,7 +3,7 @@ import {WorkPackageChangeset} from './work-package-changeset';
 import {Injector} from '@angular/core';
 import {I18nService} from 'core-app/modules/common/i18n/i18n.service';
 import {IFieldSchema} from "core-app/modules/fields/field.base";
-import {DisplayFieldService} from "core-app/modules/fields/display/display-field.service";
+import {DisplayFieldContext, DisplayFieldService} from "core-app/modules/fields/display/display-field.service";
 import {DisplayField} from "core-app/modules/fields/display/display-field.module";
 import {MultipleLinesStringObjectsDisplayField} from "core-app/modules/fields/display/field-types/wp-display-multiple-lines-string-objects-field.module";
 import {ProgressTextDisplayField} from "core-app/modules/fields/display/field-types/wp-display-progress-text-field.module";
@@ -22,7 +22,9 @@ export class DisplayFieldRenderer {
   readonly displayFieldService:DisplayFieldService = this.injector.get(DisplayFieldService);
   readonly I18n:I18nService = this.injector.get(I18nService);
 
-  constructor(readonly injector:Injector, public context:'table' | 'single-view' | 'timeline') {
+  constructor(public readonly injector:Injector,
+              public readonly container:'table' | 'single-view' | 'timeline',
+              public readonly options:{ [key:string]: any } = {}) {
   }
 
   public render(workPackage:WorkPackageResource,
@@ -77,19 +79,20 @@ export class DisplayFieldRenderer {
   }
 
   private getFieldForCurrentContext(workPackage:WorkPackageResource, fieldSchema:IFieldSchema, name:string):DisplayField {
+    const context:DisplayFieldContext = { container: this.container, options: this.options };
 
     // We handle multi value fields differently in the single view context
     const isMultiLinesField = ['[]CustomOption', '[]User'].indexOf(fieldSchema.type) >= 0;
-    if (this.context === 'single-view' && isMultiLinesField) {
-      return new MultipleLinesStringObjectsDisplayField(workPackage, name, fieldSchema) as DisplayField;
+    if (this.container === 'single-view' && isMultiLinesField) {
+      return new MultipleLinesStringObjectsDisplayField(workPackage, name, fieldSchema, context) as DisplayField;
     }
 
     // We handle progress differently in the timeline
-    if (this.context === 'timeline' && name === 'percentageDone') {
-      return new ProgressTextDisplayField(workPackage, name, fieldSchema);
+    if (this.container === 'timeline' && name === 'percentageDone') {
+      return new ProgressTextDisplayField(workPackage, name, fieldSchema, context);
     }
 
-    return this.displayFieldService.getField(workPackage, name, fieldSchema, this.context);
+    return this.displayFieldService.getField(workPackage, name, fieldSchema, context);
   }
 
   private getText(field:DisplayField, placeholder:string):string {

frontend/src/app/components/wp-edit/wp-edit-field/wp-edit-field.component.ts

@@ -56,6 +56,7 @@ export class WorkPackageEditFieldComponent implements OnInit {
   @Input('fieldName') public fieldName:string;
   @Input('workPackageId') public workPackageId:string;
   @Input('wrapperClasses') public wrapperClasses?:string;
+  @Input('displayFieldOptions') public displayFieldOptions:any = {};
   @Input('displayPlaceholder') public displayPlaceholder?:string;
   @Input('isDropTarget') public isDropTarget?:boolean = false;
 
@@ -63,7 +64,7 @@ export class WorkPackageEditFieldComponent implements OnInit {
   @ViewChild('editContainer') readonly editContainer:ElementRef;
 
   public workPackage:WorkPackageResource;
-  public fieldRenderer = new DisplayFieldRenderer(this.injector, 'single-view');
+  public fieldRenderer:DisplayFieldRenderer;
   public editFieldContainerClass = editFieldContainerClass;
   public active = false;
   public rendered = false;
@@ -85,6 +86,7 @@ export class WorkPackageEditFieldComponent implements OnInit {
   }
 
   public ngOnInit() {
+    this.fieldRenderer = new DisplayFieldRenderer(this.injector, 'single-view', this.displayFieldOptions);
     this.$element = jQuery(this.elementRef.nativeElement);
     this.wpEditFieldGroup.register(this);
   }

frontend/src/app/components/wp-table/wp-table-sums-row/wp-table-sums-row.directive.ts

@@ -121,7 +121,7 @@ export class WorkPackageTableSumsRowController implements AfterViewInit {
       return div;
     }
 
-    const field = this.displayFieldService.getField(sums, name, fieldSchema);
+    const field = this.displayFieldService.getField(sums, name, fieldSchema, { container: 'table', options: {} });
 
     if (!field.isEmpty()) {
       field.render(div, field.valueString);

frontend/src/app/modules/fields/display/display-field.module.ts

@@ -26,14 +26,23 @@
 // See doc/COPYRIGHT.rdoc for more details.
 // ++
 
-import {Field} from "core-app/modules/fields/field.base";
+import {Field, IFieldSchema} from "core-app/modules/fields/field.base";
 import {WorkPackageChangeset} from "core-components/wp-edit-form/work-package-changeset";
+import {I18nService} from "core-app/modules/common/i18n/i18n.service";
+import {DisplayFieldContext} from "core-app/modules/fields/display/display-field.service";
 
 export class DisplayField extends Field {
   public static type:string;
   public mode:string | null = null;
   public changeset:WorkPackageChangeset|null = null;
 
+  constructor(public resource:any,
+              public name:string,
+              public schema:IFieldSchema,
+              public context:DisplayFieldContext) {
+    super(resource, name, schema);
+  }
+
   public get isFormattable():boolean {
     return false;
   }

frontend/src/app/modules/fields/display/display-field.service.ts

@@ -33,7 +33,15 @@ import {DisplayField} from "core-app/modules/fields/display/display-field.module
 import {IFieldSchema} from "core-app/modules/fields/field.base";
 
 export interface IDisplayFieldType extends IFieldType<DisplayField> {
-  new(resource:HalResource, attributeType:string, schema:IFieldSchema):DisplayField;
+  new(resource:HalResource, attributeType:string, schema:IFieldSchema, context:DisplayFieldContext):DisplayField;
+}
+
+export interface DisplayFieldContext {
+  /** Where will the field be rendered? This may result in different styles (Multi select field, e.g.,) */
+  container: 'table'|'single-view'|'timeline';
+
+  /** Options passed to the display field */
+  options:{ [key:string]:any };
 }
 
 @Injectable()
@@ -42,4 +50,25 @@ export class DisplayFieldService extends AbstractFieldService<DisplayField, IDis
   constructor(injector:Injector) {
     super(injector);
   }
+
+  /**
+   * Create an instance of the field type T given the required arguments
+   * with either in descending order:
+   *
+   *  1. The registered field name (most specific)
+   *  2. The registered field for the schema attribute type
+   *  3. The default field type
+   *
+   * @param resource
+   * @param {string} fieldName
+   * @param {IFieldSchema} schema
+   * @param {string} context
+   * @returns {T}
+   */
+  public getField(resource:any, fieldName:string, schema:IFieldSchema, context:DisplayFieldContext):DisplayField {
+    let type = this.fieldType(fieldName) || this.fieldType(schema.type) || this.defaultFieldType;
+    let fieldClass:IDisplayFieldType = this.classes[type];
+
+    return new fieldClass(resource, fieldName, schema, context);
+  }
 }

frontend/src/app/modules/fields/display/field-types/wp-display-highlightable-field.module.ts

@@ -33,6 +33,6 @@ export class HighlightableDisplayField extends DisplayField {
   protected readonly wpTableHighlighting:WorkPackageTableHighlightingService = this.$injector.get(WorkPackageTableHighlightingService);
 
   public get shouldHighlight() {
-    return this.context !== 'table' || this.wpTableHighlighting.isInline;
+    return this.context.options.colorize !== false && (this.context.container !== 'table' || this.wpTableHighlighting.isInline);
   }
 }

frontend/src/app/modules/fields/edit/edit-field.service.ts

@@ -31,6 +31,8 @@ import {WorkPackageResource} from "core-app/modules/hal/resources/work-package-r
 import {AbstractFieldService, IFieldType} from "core-app/modules/fields/field.service";
 import {IFieldSchema} from "core-app/modules/fields/field.base";
 import {EditField} from "core-app/modules/fields/edit/edit.field.module";
+import {DisplayField} from "core-app/modules/fields/display/display-field.module";
+import {DisplayFieldContext, IDisplayFieldType} from "core-app/modules/fields/display/display-field.service";
 
 export interface IEditFieldType extends IFieldType<EditField> {
   new(resource:WorkPackageResource, attributeType:string, schema:IFieldSchema):EditField;
@@ -42,4 +44,24 @@ export class EditFieldService extends AbstractFieldService<EditField, IEditField
   constructor(injector:Injector) {
     super(injector);
   }
+
+  /**
+   * Create an instance of the field type given the required arguments
+   * with either in descending order:
+   *
+   *  1. The registered field name (most specific)
+   *  2. The registered field for the schema attribute type
+   *  3. The default field type
+   *
+   * @param resource
+   * @param {string} fieldName
+   * @param {IFieldSchema} schema
+   * @returns {T}
+   */
+  public getField(resource:any, fieldName:string, schema:IFieldSchema):EditField {
+    let type = this.fieldType(fieldName) || this.fieldType(schema.type) || this.defaultFieldType;
+    let fieldClass:IEditFieldType = this.classes[type];
+
+    return new fieldClass(resource, fieldName, schema);
+  }
 }

frontend/src/app/modules/fields/field.base.ts

@@ -85,8 +85,7 @@ export class Field {
   protected I18n:I18nService
   constructor(public resource:any,
               public name:string,
-              public schema:IFieldSchema,
-              public context:string = '') {
+              public schema:IFieldSchema) {
     this.I18n = this.$injector.get(I18nService);
     this.initializer();
   }

frontend/src/app/modules/fields/field.service.ts

@@ -27,7 +27,7 @@
 // ++
 
 import {Injector} from '@angular/core';
-import {Field, IFieldSchema} from "core-app/modules/fields/field.base";
+import {Field} from "core-app/modules/fields/field.base";
 
 export interface IFieldType<T extends Field> {
   fieldType:string;
@@ -48,27 +48,6 @@ export abstract class AbstractFieldService<T extends Field, C extends IFieldType
   protected constructor(protected injector:Injector) {
   }
 
-  /**
-   * Create an instance of the field type T given the required arguments
-   * with either in descending order:
-   *
-   *  1. The registered field name (most specific)
-   *  2. The registered field for the schema attribute type
-   *  3. The default field type
-   *
-   * @param resource
-   * @param {string} fieldName
-   * @param {IFieldSchema} schema
-   * @param {string} context
-   * @returns {T}
-   */
-  public getField(resource:any, fieldName:string, schema:IFieldSchema, context:string = ''):T {
-    let type = this.fieldType(fieldName) || this.fieldType(schema.type) || this.defaultFieldType;
-    let fieldClass:C = this.classes[type];
-
-    return new fieldClass(resource, fieldName, schema, context);
-  }
-
   /**
    * Get the field type for the given attribute type.
    * If no registered type exists for the field, returns the default type.