Added colorization through OptionSet value color

MscrmTools · Jun 26, 2019 · 646b8b9 · 646b8b9
1 parent d3ca656
commit 646b8b9
Show file tree

Hide file tree

Showing 4 changed files with 88 additions and 14 deletions.
diff --git a/NNCheckboxes/NNCheckboxes/ControlManifest.Input.xml b/NNCheckboxes/NNCheckboxes/ControlManifest.Input.xml
@@ -1,10 +1,10 @@
 <?xml version="1.0" encoding="utf-8" ?>
 <manifest>
-  <control namespace="MscrmTools" constructor="NNCheckboxes" version="1.0.5" display-name-key="NNCheckboxes_Display_Key" description-key="NNCheckboxes_Desc_Key" control-type="standard" preview-image="logo.png">
+  <control namespace="MscrmTools" constructor="NNCheckboxes" version="1.0.6" display-name-key="NNCheckboxes_Display_Key" description-key="NNCheckboxes_Desc_Key" control-type="standard" preview-image="logo.png">
     <data-set name="nnRelationshipDataSet" display-name-key="nnRelationshipDataSet_Display_Key">
       <property-set name="displayAttribute" display-name-key="targetEntity_Display_Key" description-key="targetEntity_Desc_Key" of-type="SingleLine.Text" usage="bound" required="true" />
-      <property-set name="backgroundColorAttribute" display-name-key="backgroundColorAttribute_Display_Key" description-key="backgroundColorAttribute_Desc_Key" of-type="SingleLine.Text" usage="bound" required="false" />
-      <property-set name="foreColorAttribute" display-name-key="foreColorAttribute_Display_Key" description-key="foreColorAttribute_Desc_Key" of-type="SingleLine.Text" usage="bound" required="false" />
+      <property-set name="backgroundColorAttribute" display-name-key="backgroundColorAttribute_Display_Key" description-key="backgroundColorAttribute_Desc_Key" of-type-group="colorTypes" usage="bound" required="false" />
+      <property-set name="foreColorAttribute" display-name-key="foreColorAttribute_Display_Key" description-key="foreColorAttribute_Desc_Key" of-type-group="colorTypes" usage="bound" required="false" />
       <property-set name="categoryAttribute" display-name-key="categoryAttribute_Display_Key" description-key="categoryAttribute_Desc_Key" of-type-group="categoryTypes" usage="bound" required="false" />
     </data-set>
     <property name="parentEntityLogicalName" display-name-key="parentEntityLogicalName_Display_Key" description-key="parentEntityLogicalName_Desc_Key" of-type="SingleLine.Text" usage="input" required="true" /> 
@@ -14,6 +14,10 @@
       <type>SingleLine.Text</type>
       <type>OptionSet</type>
       <type>TwoOptions</type>
+    </type-group>
+      <type-group name="colorTypes">
+      <type>SingleLine.Text</type>
+      <type>OptionSet</type>
     </type-group>
     <resources>
       <code path="index.ts" order="1"/>

diff --git a/NNCheckboxes/NNCheckboxes/index.ts b/NNCheckboxes/NNCheckboxes/index.ts
@@ -17,11 +17,14 @@ export class NNCheckboxes implements ComponentFramework.StandardControl<IInputs,
 	private _childRecordType: string;
 	private _labelAttributeName: string;
 	private _backgroundColorAttributeName: string;
+	private _backgroundColorIsFromOptionSet: boolean;
 	private _foreColorAttributeName: string;
+	private _foreColorIsFromOptionSet: boolean;
 	private _numberOfColumns: number;
 	private _categoryAttributeName : string;
 	private _categoryUseDisplayName : boolean;
 	private _relationshipSchemaName: string | null;
+	private _colors: any;
 	/**
 	 * Empty constructor.
 	 */
@@ -59,16 +62,29 @@ export class NNCheckboxes implements ComponentFramework.StandardControl<IInputs,
 			}
 			else if(column.alias === "backgroundColorAttribute"){
 				this._backgroundColorAttributeName = column.name;
+
+				if(column.dataType === "OptionSet"){
+					if(!this._colors || !this._colors[column.name]){
+						await this.GetOptionSetColors(column.name);
+					}
+
+					this._backgroundColorIsFromOptionSet = true;
+				}
 			}
 			else if(column.alias === "foreColorAttribute"){
 				this._foreColorAttributeName = column.name;
+
+				if(column.dataType === "OptionSet"){
+					if(!this._colors || !this._colors[column.name]){
+						await this.GetOptionSetColors(column.name);
+					}
+
+					this._foreColorIsFromOptionSet = true;
+				}
 			}
 			else if(column.alias === "categoryAttribute"){
 				this._categoryAttributeName = column.name;
 				this._categoryUseDisplayName = column.dataType === "Lookup.Simple" ||  column.dataType === "OptionSet" ||  column.dataType === "TwoOptions";
-				if(column.dataType === "Lookup.Simple"){
-					this._categoryAttributeName = "_" + column.name + "_value";
-				}
 			}
 		}
 
@@ -137,9 +153,33 @@ export class NNCheckboxes implements ComponentFramework.StandardControl<IInputs,
 
 							// With style if configured with colors
 							var styles = new Array();
-							if(thisCtrl._backgroundColorAttributeName) styles.push("background-color:" + record[thisCtrl._backgroundColorAttributeName]);
-							if(thisCtrl._foreColorAttributeName) styles.push("color:" + record[thisCtrl._foreColorAttributeName]);
-
+							if(thisCtrl._backgroundColorAttributeName) {
+								if(thisCtrl._backgroundColorIsFromOptionSet){
+									if(thisCtrl._colors 
+										&& thisCtrl._colors[thisCtrl._backgroundColorAttributeName] 
+										&& thisCtrl._colors[thisCtrl._backgroundColorAttributeName][record[thisCtrl._backgroundColorAttributeName]]){
+										var color = thisCtrl._colors[thisCtrl._backgroundColorAttributeName][record[thisCtrl._backgroundColorAttributeName]];
+										styles.push("background-color:" + color);
+									}
+								}
+								else{
+									styles.push("background-color:" + record[thisCtrl._backgroundColorAttributeName]);
+								}
+							}
+							if(thisCtrl._foreColorAttributeName){
+								if(thisCtrl._foreColorIsFromOptionSet){
+									if(thisCtrl._colors 
+										&& thisCtrl._colors[thisCtrl._foreColorAttributeName] 
+										&& thisCtrl._colors[thisCtrl._foreColorAttributeName][record[thisCtrl._backgroundColorAttributeName]]){
+										var color = thisCtrl._colors[thisCtrl._foreColorAttributeName][record[thisCtrl._backgroundColorAttributeName]];
+										styles.push("color:" + color);
+									}
+								}
+								else{
+									styles.push("color:" + record[thisCtrl._foreColorAttributeName]);
+								}
+							}
+
 							var lblContainer = document.createElement("label");
 							lblContainer.setAttribute("class", "container");
 							lblContainer.setAttribute("style", styles.join(";"))
@@ -275,6 +315,37 @@ export class NNCheckboxes implements ComponentFramework.StandardControl<IInputs,
 		);
 	}
 
+	public async GetOptionSetColors(attribute:string){
+		let requestUrl =
+		"/api/data/v9.0/EntityDefinitions(LogicalName='"+ this._childRecordType +"')/Attributes/Microsoft.Dynamics.CRM.PicklistAttributeMetadata?$select=LogicalName&$filter=LogicalName eq '"+attribute+"'&$expand=OptionSet";
+
+		var thisCtrl = this;
+		let request = new XMLHttpRequest();
+		request.open("GET", requestUrl, true);
+		request.setRequestHeader("OData-MaxVersion", "4.0");
+		request.setRequestHeader("OData-Version", "4.0");
+		request.setRequestHeader("Accept", "application/json");
+		request.setRequestHeader("Content-Type", "application/json; charset=utf-8");
+		request.onreadystatechange = () => {
+			if (request.readyState === 4) {
+				request.onreadystatechange = null;
+				if (request.status === 200) {
+					let entityMetadata = JSON.parse(request.response);
+					let options = entityMetadata.value[0].OptionSet.Options;
+					thisCtrl._colors = {};
+					thisCtrl._colors[attribute] = {}
+					for (var i = 0; i < options.length; i++) {
+						thisCtrl._colors[attribute][options[i].Value] = options[i].Color;						
+					}
+				} else {
+					let errorText = request.responseText;
+					console.log(errorText);
+				}
+				}
+			};
+		request.send();
+	}
+
 	public async GetNNRelationshipNameByEntityNames() {
 		let schemaNameParameter = this._context.parameters.relationshipSchemaName;
 		if (schemaNameParameter != undefined && schemaNameParameter.raw != null) { return Promise.resolve(<string>schemaNameParameter.raw); }
@@ -307,7 +378,6 @@ export class NNCheckboxes implements ComponentFramework.StandardControl<IInputs,
 	 * @param context The entire property bag available to control via Context Object; It contains values as set up by the customizer mapped to names defined in the manifest, as well as utility functions
 	 */
 	public updateView(context: ComponentFramework.Context<IInputs>): void {
-		debugger;
 		if(context.parameters.nnRelationshipDataSet.paging.hasNextPage)
 		{
 			context.parameters.nnRelationshipDataSet.paging.loadNextPage();

diff --git a/NNCheckboxes/NNCheckboxes/strings/NNCheckboxes.1033.resx b/NNCheckboxes/NNCheckboxes/strings/NNCheckboxes.1033.resx
@@ -89,13 +89,13 @@
     <value>Background color</value>
   </data>
   <data name="backgroundColorAttribute_Desc_Key" xml:space="preserve">
-    <value>Attribute that contains the color to use as background. This attribute must be exposed in the selected view</value>
+    <value>Attribute that contains the color to use as background. If text attribute, can be color name of hexadecimal code. If optionset attribute, the color of the option will be used. This attribute must be exposed in the selected view</value>
   </data>
   <data name="foreColorAttribute_Display_Key" xml:space="preserve">
     <value>Color</value>
   </data>
   <data name="foreColorAttribute_Desc_Key" xml:space="preserve">
-    <value>Attribute that contains the color to use as forecolor. This attribute must be exposed in the selected view</value>
+    <value>Attribute that contains the color to use as forecolor. If text attribute, can be color name of hexadecimal code. If optionset attribute, the color of the option will be used. This attribute must be exposed in the selected view</value>
   </data>
   <data name="columnsNumber_Display_Key" xml:space="preserve">
     <value>Columns</value>

diff --git a/NNCheckboxes/NNCheckboxes/strings/NNCheckboxes.1036.resx b/NNCheckboxes/NNCheckboxes/strings/NNCheckboxes.1036.resx
@@ -89,13 +89,13 @@
     <value>Couleur de fond</value>
   </data>
   <data name="backgroundColorAttribute_Desc_Key" xml:space="preserve">
-    <value>Attribut qui sert à définir la couleur de fond de l'enregistrement. L'attribut doit être exposé dans la vue sélectionnée</value>
+    <value>Attribut qui sert à définir la couleur de fond de l'enregistrement. Si attribut de type texte, la valeur doit être un nom de couleur ou un code hexadécimal. Si attribut de type OptionSet, la couleur de l'option sera utilisée. L'attribut doit être exposé dans la vue sélectionnée</value>
   </data>
   <data name="foreColorAttribute_Display_Key" xml:space="preserve">
     <value>Couleur du texte</value>
   </data>
   <data name="foreColorAttribute_Desc_Key" xml:space="preserve">
-    <value>Attribut qui sert à définir la couleur d'affichage de l'enregistrement. L'attribut doit être exposé dans la vue sélectionnée</value>
+    <value>Attribut qui sert à définir la couleur d'affichage de l'enregistrement. Si attribut de type texte, la valeur doit être un nom de couleur ou un code hexadécimal. Si attribut de type OptionSet, la couleur de l'option sera utilisée. L'attribut doit être exposé dans la vue sélectionnée</value>
   </data>
   <data name="categoryAttribute_Display_Key" xml:space="preserve">
     <value>Grouper par</value>