Skip to content

Commit

Permalink
Merge pull request #270 from deejay-hub/ross
Browse files Browse the repository at this point in the history 
Dynamic Icons
  • Loading branch information
@deejay-hub
deejay-hub authored Nov 9, 2023
2 parents c39cc26 + 6e41809 commit 13ed4bf
Show file tree
Hide file tree
Showing 7 changed files with 128 additions and 360 deletions.
302 changes: 27 additions & 275 deletions .pmdruleset.xml
View file

Large diffs are not rendered by default.

53 changes: 42 additions & 11 deletions force-app/main/default/classes/TimelineService.cls
View file
Original file line number Diff line number Diff line change
Expand Up @@ -110,6 +110,8 @@ public with sharing class TimelineService {
'Active__c, ' +
'Icon__c, ' +
'Icon_Background_Colour__c, ' +
'Icon_Field__c, ' +
'Icon_Background_Colour_Field__c, ' +
'Position_Date_Field__c, ' +
'Object_Name__c, ' +
'Type_Field__c, ' +
Expand All @@ -136,13 +138,14 @@ public with sharing class TimelineService {
}

Map<String, TimelineRecord> mapOfTimelineConfigurationRecords = new Map<String, TimelineRecord>();
Map<String, String> mapOfFields = new Map<String, String>();

for (Timeline_Configuration__mdt timelineConfigurationRecord : listOfTimelineConfigurations) {
TimelineRecord timelineRecord = new timelineRecord();
timelineRecord.relationshipName = timelineConfigurationRecord.Relationship_Name__c;
timelineRecord.icon = timelineConfigurationRecord.Icon__c;
timelineRecord.iconBackground = timelineConfigurationRecord.Icon_Background_Colour__c;
timelineRecord.iconField = timelineConfigurationRecord.Icon_Field__c;
timelineRecord.iconBackgroundField = timelineConfigurationRecord.Icon_Background_Colour_Field__c;
timelineRecord.detailField = timelineConfigurationRecord.Detail_Field__c;
timelineRecord.objectName = timelineConfigurationRecord.Object_Name__c;
timelineRecord.type = timelineConfigurationRecord.Type_Field__c;
Expand All @@ -152,17 +155,11 @@ public with sharing class TimelineService {
timelineRecord.tooltipObject = timelineConfigurationRecord.Tooltip_Object_Name__c;
timelineRecord.drilldownIdField = timelineConfigurationRecord.Drilldown_Id_Field__c;
timelineRecord.inclusionField = timelineConfigurationRecord.Inclusion_Field__c;

mapOfTimelineConfigurationRecords.put(
timelineRecord.objectName + timelineRecord.relationshipName,
timelineRecord
);
mapOfFields.put(timelineRecord.detailField, timelineRecord.objectName);
mapOfFields.put(timelineRecord.positionDateField, timelineRecord.objectName);
mapOfFields.put(timelineRecord.fallbackTooltipField, timelineRecord.objectName);
mapOfFields.put(timelineRecord.tooltipIdField, timelineRecord.objectName);
mapOfFields.put(timelineRecord.drilldownIdField, timelineRecord.objectName);
mapOfFields.put(timelineRecord.type, timelineRecord.objectName);
}

Map<String, String> childObjects = getChildObjects(parentObjectType);
Expand All @@ -178,6 +175,8 @@ public with sharing class TimelineService {
String tooltipIdField = String.valueOf(tcr.tooltipIdField);
String drilldownIdField = String.valueOf(tcr.drilldownIdField);
String typeField = String.valueOf(tcr.type);
String iconField = String.valueOf(tcr.iconField);
String iconColourField = String.valueOf(tcr.iconBackgroundField);

String selectStatement = '(SELECT Id, ' + tcr.detailField + ', ' + tcr.positionDateField + '';

Expand Down Expand Up @@ -216,6 +215,14 @@ public with sharing class TimelineService {
selectStatement = selectStatement + ', ' + tcr.tooltipIdField + '';
}

if (iconField != null && iconField != '' ) {
selectStatement = selectStatement + ', ' + tcr.iconField + '';
}

if (iconColourField != null && iconColourField != '' ) {
selectStatement = selectStatement + ', ' + tcr.iconBackgroundField + '';
}

String relationship = tcr.relationshipName;
String optionalFilter = '';

Expand Down Expand Up @@ -310,6 +317,16 @@ public with sharing class TimelineService {
eachCh,
tr.objectName
);
Map<String, String> iconValues = getFieldValues(
tr.iconField,
eachCh,
tr.objectName
);
Map<String, String> iconColourValues = getFieldValues(
tr.iconBackgroundField,
eachCh,
tr.objectName
);

Map<String, String> typeValues = getFieldValues(tr.type, eachCh, tr.objectName);

Expand Down Expand Up @@ -339,8 +356,20 @@ public with sharing class TimelineService {
mapData.put('tooltipObject', tr.tooltipObject);
mapData.put('fallbackTooltipValue', fallbackValues.get('value'));
mapData.put('type', typeValues.get('value'));
mapData.put('icon', tr.icon);
mapData.put('iconBackground', tr.iconBackground);

if (iconValues.get('value') != null && iconValues.get('value') != '') {
mapData.put('icon', iconValues.get('value'));
}
else {
mapData.put('icon', tr.icon);
}

if (iconColourValues.get('value') != null && iconColourValues.get('value') != '') {
mapData.put('iconBackground', iconColourValues.get('value'));
}
else {
mapData.put('iconBackground', tr.iconBackground);
}

if (positionValues.get('value') != null && positionValues.get('value') != '') {
listOfTimelineData.add(mapData);
Expand Down Expand Up @@ -393,7 +422,7 @@ public with sharing class TimelineService {
String fieldValue = '';
String fieldLabel = '';
String objectCheck = '';
String fieldCheck = '';
//String fieldCheck = '';
String fieldStripped = '';
Boolean fieldCanAccess = true;

Expand Down Expand Up @@ -601,6 +630,8 @@ public with sharing class TimelineService {
private String detailFieldLabel;
private String icon;
private String iconBackground;
private String iconField;
private String iconBackgroundField;
private String positionDateField;
private String positionDateValue;
private String objectName;
Expand Down
10 changes: 9 additions & 1 deletion ...default/layouts/Timeline_Configuration__mdt-Timeline Configuration Layout.layout-meta.xml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -77,12 +77,20 @@
<behavior>Required</behavior>
<field>Icon__c</field>
</layoutItems>
<layoutItems>
<behavior>Edit</behavior>
<field>Icon_Field__c</field>
</layoutItems>
</layoutColumns>
<layoutColumns>
<layoutItems>
<behavior>Required</behavior>
<field>Icon_Background_Colour__c</field>
</layoutItems>
<layoutItems>
<behavior>Edit</behavior>
<field>Icon_Background_Colour_Field__c</field>
</layoutItems>
</layoutColumns>
<style>TwoColumnsLeftToRight</style>
</layoutSections>
Expand Down Expand Up @@ -167,7 +175,7 @@
<showRunAssignmentRulesCheckbox>false</showRunAssignmentRulesCheckbox>
<showSubmitAndAttachButton>false</showSubmitAndAttachButton>
<summaryLayout>
<masterLabel>00hN0000002I148</masterLabel>
<masterLabel>00h8I000002GgBp</masterLabel>
<sizeX>4</sizeX>
<sizeY>0</sizeY>
<summaryLayoutStyle>Default</summaryLayoutStyle>
Expand Down
94 changes: 24 additions & 70 deletions force-app/main/default/lwc/timeline/timeline.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -42,8 +42,7 @@ export default class timeline extends NavigationMixin(LightningElement) {
@api latestRange; //How far into the future to go
@api zoomTo; //Zoom to current dat or latest activity
@api daysToShow; //number of days to plot for the default zoom
@api showToday; //should today's date be plotted
@api showTodayColour; //if today's date is shown - what colour
@api showToday; //should today's date be plotted and in what colour

//Component calculated attributes
@api recordId; //current record id of lead, case, opportunity, contact or account
Expand Down Expand Up @@ -99,7 +98,17 @@ export default class timeline extends NavigationMixin(LightningElement) {
illustrationSubHeader; //Sub Header to display when an info box appears
illustrationType; //Type of illustration to display, 'error' or 'no data'

todaysColour;
todayColourMap = {
Blue: "#107cad",
Green: "#2e844a",
Black: "#444444",
Purple: "#9050e9",
Indigo: "#5867e8",
Teal: "#0b827c",
Pink: "#e3066a",
Red: "#ea001e",
No: "#107cad"
};

label = {
DAYS,
Expand Down Expand Up @@ -131,6 +140,14 @@ export default class timeline extends NavigationMixin(LightningElement) {
_timelineData = null;
_timelineHeight = null;

heightMap = {
"1 - Smallest": 125,
"2 - Small": 200,
"3 - Default": 275,
"4 - Big": 350,
"5 - Biggest": 425,
};

//These are the objects holding individual instances of the timeline
_d3timelineCanvas = null;
_d3timelineCanvasAxis = null;
Expand Down Expand Up @@ -210,7 +227,7 @@ export default class timeline extends NavigationMixin(LightningElement) {
}

connectedCallback() {
this._timelineHeight = this.getPreferredHeight();
this._timelineHeight = this.heightMap[this.preferredHeight];
}

renderedCallback() {
Expand All @@ -223,7 +240,7 @@ export default class timeline extends NavigationMixin(LightningElement) {
}

if (!this._d3Rendered) {
this.todaysColour = this.getTodaysColour();
this.todaysColour = this.todayColourMap[this.showToday];
//set the height of the component as the height is dynamic based on the attributes
let timelineDIV = this.template.querySelector('div.timeline-canvas');
this.currentParentField = this.timelineParent;
Expand Down Expand Up @@ -505,7 +522,7 @@ export default class timeline extends NavigationMixin(LightningElement) {

let currentDate = new Date();

if ( this.showToday === "Yes" ) {
if ( this.showToday !== "No" ) {
let today = timelineCanvas.append('g')
.attr('class', 'timeline-canvas-current-date')
.attr('transform', 'translate(' + timelineCanvas.x(currentDate) + ')' );
Expand Down Expand Up @@ -874,69 +891,6 @@ export default class timeline extends NavigationMixin(LightningElement) {
}
}

getTodaysColour() {
let colour;

switch (this.showTodayColour) {
case "Blue":
colour = "#107cad";
break;
case "Green":
colour = "#2e844a";
break;
case "Black":
colour = "#444444";
break;
case "Purple":
colour = "#9050e9";
break;
case "Indigo":
colour = "#5867e8";
break;
case "Teal":
colour = "#0b827c";
break;
case "Pink":
colour = "#e3066a";
break;
case "Red":
colour = "#ea001e";
break;
default:
colour = "#107cad";
break;
}

return colour;
}

getPreferredHeight() {
let height;

switch (this.preferredHeight) {
case '1 - Smallest':
height = 125;
break;
case '2 - Small':
height = 200;
break;
case '3 - Default':
height = 275;
break;
case '4 - Big':
height = 350;
break;
case '5 - Biggest':
height = 425;
break;
default:
height = 275;
break;
}

return height;
}

timelineMap() {
const me = this;

Expand All @@ -963,7 +917,7 @@ export default class timeline extends NavigationMixin(LightningElement) {

let currentDate = new Date();

if ( this.showToday === "Yes" ) {
if ( this.showToday !== "No" ) {
let today = timelineMap.append('g')
.attr('class', 'timeline-map-current-date')
.attr('transform', 'translate(' + timelineMap.x(currentDate) + ')' );
Expand Down
5 changes: 2 additions & 3 deletions force-app/main/default/lwc/timeline/timeline.js-meta.xml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,9 +18,7 @@
<property name="latestRange" label="Future Time Range (Years)" default="0.5" required="true" type="String" datasource="0.25, 0.5, 1, 1.5, 2, 3, 4, 5, 6, 7, 8, 9, 10" description="Specify the end range for the timeline. As n plus current date."/>
<property name="zoomTo" label="Zoom Based On" default="Current Date" required="true" type="String" datasource="Current Date, Last Activity, First Activity" description="Zoom to the last record found (even if it's in the past or future) OR zoom to the current date (even if there are no records)."/>
<property name="daysToShow" label="Zoom Range (Days)" default="60" required="true" type="Integer" min="7" max="365" description="Specify how many days to zoom to by default. e.g. 60 days would show 30 days prior to and 30 days after the specified 'zoom based on' setting."/>

<property name="showToday" label="Show Today" default="Yes" required="true" type="String" description="Show today's date." datasource="Yes, No"/>
<property name="showTodayColour" label="Today Colour" default="Blue" required="true" type="String" datasource="Blue, Black, Green, Indigo, Pink, Purple, Teal, Red" />
<property name="showToday" label="Show Today" default="No" required="true" type="String" description="Show today's date." datasource="No, Blue, Black, Green, Indigo, Pink, Purple, Teal, Red"/>

<supportedFormFactors>
<supportedFormFactor type="Large" />
Expand All @@ -36,6 +34,7 @@
<property name="latestRange" label="Future Time Range (Years)" default="0.5" required="true" type="String" datasource="0.25, 0.5, 1, 1.5, 2, 3, 4, 5, 6, 7, 8, 9, 10" description="Specify the end range for the timeline. As n plus current date."/>
<property name="zoomTo" label="Zoom Based On" default="Current Date" required="true" type="String" datasource="Current Date, Last Activity, First Activity" description="Zoom to the last record found (even if it's in the past or future) OR zoom to the current date (even if there are no records)."/>
<property name="daysToShow" label="Zoom Range (Days)" default="60" required="true" type="Integer" min="7" max="365" description="Specify how many days to zoom to by default. e.g. 60 days would show 30 days prior to and 30 days after the specified 'zoom based on' setting."/>
<property name="showToday" label="Show Today" default="No" required="true" type="String" description="Show today's date." datasource="No, Blue, Black, Green, Indigo, Pink, Purple, Teal, Red"/>
<property name="recordId" label="Record Id" default="{!recordId}" type="String" description="Automatically binds the page's record id to the component variable" />

</targetConfig>
Expand Down
12 changes: 12 additions & 0 deletions ...objects/Timeline_Configuration__mdt/fields/Icon_Background_Colour_Field__c.field-meta.xml
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
<?xml version="1.0" encoding="UTF-8"?>
<CustomField xmlns="http://soap.sforce.com/2006/04/metadata">
<fullName>Icon_Background_Colour_Field__c</fullName>
<externalId>false</externalId>
<fieldManageability>SubscriberControlled</fieldManageability>
<inlineHelpText>The background colour for the icon based on a formula field allowing different colours</inlineHelpText>
<label>Icon Background Colour (Field)</label>
<length>180</length>
<required>false</required>
<type>Text</type>
<unique>false</unique>
</CustomField>
12 changes: 12 additions & 0 deletions ...-app/main/default/objects/Timeline_Configuration__mdt/fields/Icon_Field__c.field-meta.xml
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
<?xml version="1.0" encoding="UTF-8"?>
<CustomField xmlns="http://soap.sforce.com/2006/04/metadata">
<fullName>Icon_Field__c</fullName>
<externalId>false</externalId>
<fieldManageability>SubscriberControlled</fieldManageability>
<inlineHelpText>The icon to use based on a formula field allowing you to dynamically select an icon</inlineHelpText>
<label>Icon (Field)</label>
<length>180</length>
<required>false</required>
<type>Text</type>
<unique>false</unique>
</CustomField>

0 comments on commit 13ed4bf

Please sign in to comment.