Views:

Please Note: for a quick start you can import a sample Formula - see this article for details

Overview

The Quick Tile App from North52 is a ready-go-to solution for Microsoft Dynamics 365 (and CRM 2013/2015/2016) that allows you to place a HTML web-resource on a form which will dynamically display multiple informational tiles to your end users. The tiles are configured by a single North52 Formula and load when a record is opened up.

It consists on a single HTML web resource which can be used as-is or can be fully customized to any specific requirements. The following screenshots show what Quick Tiles look like when they are configured on the Account form.

It can dynamically change the tiles layout depending on the available size.

Space for 3 Tiles side by side

 

Space for 2 side by side only

 

Space for 1 

A tile is comprised of the following components:

  • Title - Identifies the Quick Tile
  • Result - What was returned by the N52 Formula
  • Glyph - What Glyphicon you want to display
  • Tile color - Colour indicator for the icon strip

The below Quick Tile has the following settings:

  • Tile color - Green
  • Title - Open Opportunities
  • Glyphicon - glyphicon-flag

Note: You can also put HEX values into the colors. 

This next tile has 2 additional settings:

  • TileBackground - fill (This will apply the color to the entire tile)
  • Result Color - Yellow  

Note: When the TileBackground is set to 'fill' then the resultcolor will change the color of the title text and the flag as well for readability reasons. If you do not change the resultcolor text then the default colors are applied.

Install Process

  1. Ensure North52 BPA 528 or higher is installed on your 365 system
  2. Download the solution file from apps page
  3. Logon to Dynamics 365 and navigate to the solutions page. 
  4. Click Import and choose the downloaded solution file to import
  5. Take all the default options during the install process
  6. After the import completes click Publish All

Quick Tile Configuration

  • Create a Formula of type ClientSide - Calculation to populate the Quick Tile - see the Quick Tile Formula section below or install the Sample Quick Tile formula
  • Make a note of the formula shortcode in the top right-hand corner of the formula
  • Next open the form designer for the form that you want the button displayed on
  • Add a web-resource to the form where you want the button to appear
  • Configure it as shown in the screenshot below, changing the 3-character shortcode
  • The custom parameters (data) field needs to be set in the following order, parameter 1 is mandatory and 2-5 are optional:
    1. ShortCode
    2. Width of the Tiles
    3. Formula to execute onload of the tile (e.g. to hide the section containing the tile in certain circumstances)
    4. Comma seperated list of fields that force Quick Tile to refresh when their values are changed
    5. Set the target attribute for url links, by default this is _top, use _blank if you want to open in a new window instead
    6. Use HTTP Post (avoids URL length exceeded errors)
      • Requires North52 Quick Tile 1.9 or higher and North52 Formula Manager 1.0.0.585 or higher

Note: if you only enter the formula ShortCode Quick Tile will use automatically use the full width available to it for each tile.

Sample Tile Configurations

Formula Only:

abc

Formula and Tile Size:

abc|200

Formula, Tile Size and Pre-Tile Load Formula:

abc|200|xyz

Formula, Tile Size, Pre-Tile Load Formula and Comma separated list of OnChange fields

abc|200|xyz|description,customerid

Formula, Tile Size, Pre-Tile Load Formula, Comma separated list of OnChange fields and Set Quick Tile links to open in a new window

abc|200|xyz|description,customerid|_blank

Formula, Tile Size, Pre-Tile Load Formula, Comma separated list of OnChange fields, Set Quick Tile links to open in a new window and configure the tile to use HTTP Post

abc|200|xyz|description,customerid|_blank|post

Formula and Set Quick Tile links to open in a new window 

abc||||_blank

Formula and Tile Size and Refresh on change of a single field and use HTTP Post

abc|200||customerid||post

Note: You can control hiding or showing the section containing the Quick Tile using the 3rd parameter using a ClientSide-Calculation formula like the below:

If the account category is Preferred Customer then hide the section

if ([account.accountcategorycode] = 1, 

  HideSections('SUMMARY_TAB.Quick_Tile_Section'),

  'NoOp'
)

Note:  if you only enter the formula ShortCode north52_quicktile will use automatically use the full width available to it for each tile.

Note: if you are using the third parameter, then you must put in a second parameter, usually 150 - 200 provides the best standard resolution.

Quick Tile Configuration 1

 

Quick Tile Configuration 2



You can adjust the number of rows depending on how many tiles you will want to display.

North52 Quick Tile uses the Glyphicons that come with Bootstrap, you can use any of the glyphs listed, at this link, in your tiles: https://getbootstrap.com/docs/3.4/components/#glyphicons

North52 Quick Tile Formula

To populate the Quick Tile web resource you need a North52 Formula using the CreateQuickTile() function. You can create a single tile only, or multiple tiles using the CreateQuickTileCollection() function.

In the example below we are using a North52 Decision Table to populate a Quick Tile. Each of the fields is a Decision Table Calculation and we are using a standard Calculation to count the number of open opportunities.

Setup the Formula

  • Create a new formula, setting the following values in the Formula Guide:
    • Source Entity set to Account
    • Set Formula Type to ClientSide - Calculation
    • Select the Decision Table editor
    • Click the Create button
  • Change the Name of the formula to Account - Quick Tile - Count Opportunities
  • Click Save
  • Click on Snippets and select Quick Tile this will load a demo tile
  • Click Save
  • Select the Fetch-Xml tab, and click the + button to the right of the Search fetch-xml input box
  • Type Open Opportunities for Account in the Name field
  • For the Query field:
    • Open the Advance Find query builder form
    • Look for should be set to Opportunities
    • Select Status equals Open
    • Select Account equals and choose any single Account record (we will dynamically repalce this)
    • Click Download Fetch XML and open it in Notepad 
      <fetch version="1.0" output-format="xml-platform" mapping="logical" distinct="false">
  <entity name="opportunity">
    <attribute name="name" />
    <attribute name="customerid" />
    <attribute name="estimatedvalue" />
    <attribute name="statuscode" />
    <attribute name="opportunityid" />
    <order attribute="name" descending="false" />
    <filter type="and">
      <condition attribute="statecode" operator="eq" value="0" />
      <condition attribute="parentaccountid" operator="eq" uiname="Fourth Coffee (sample)" uitype="account" value="{A22EB449-0779-E811-A950-000D3AB0F00C}" />
    </filter>
  </entity>
</fetch>
    • Delete the red highlighted text and replace the green highlighted text with @accountid@ 
      <fetch version="1.0" output-format="xml-platform" mapping="logical" distinct="false">
  <entity name="opportunity">
    <attribute name="name" />
    <attribute name="customerid" />
    <attribute name="estimatedvalue" />
    <attribute name="statuscode" />
    <attribute name="opportunityid" />
    <order attribute="name" descending="false" />
    <filter type="and">
      <condition attribute="statecode" operator="eq" value="0" />
      <condition attribute="parentaccountid" operator="eq" value="@accountid@" />
    </filter>
  </entity>
</fetch>
    • Copy and paste this into the Query field
    • Click Save and Close to return to the Decision Table
  • Select cell A4 and delete the sample data from the field
  • Select the Functions tab, type findcount in the Functions Seach input box and press enter
  • Shift-click the FindCountFD function to open the function wizard
    • Friendly Name: type Count Open Opportunities and leave the Type as Calculation
    • Formula Detail (Query): select Open Opportunities for Account from the search list#
    • Field Name: type opportunityid
    • Default Value: replace ? with 0
    • No-Lock: leave as true
    • Click Generate
  • Select cell B4 and type '' (two single quotes)
  • Select cell C4 and type 'Open Opportunities'
  • Select cell D4 and type 'glyphicon-flag'
  • Select cell E4 and type '' (two single quotes)
  • Select cell F4 and type '' (two single quotes)
  • Select cell G4 and type '' (two single quotes)
  • Click Save
  • Add the Quick Tile to your Account form following the steps in the Quick Tile Configuration section above

This is how a single Quick Tile would look an Account:

To create multiple Quick Tiles you would use multiple sheets on the Decision Table and the CreateQuickTileCollection() function. See the Sample Quick Tile formula. 

Quick Tile with Conditions

Decision Tables offer you a significant amount of flexibility, you can include Conditions in that would change how the tile would display. For example, if you wanted to change the color of the tile based on the number of Opportunities, we could edit our example above:

  • Right-click in column A and select Insert > Insert Condition
  • Select cell A2
  • Select the Source tab and expand the Global Calculation node
  • Click on Count Open Opportunities
  • Select the entire row 4 by clicking on the row number, the ctrl-c to copy the details
  • Select row 5 and ctrl-v to paste the values into row 5
  • Select cell A4 and type <3
  • Select cell A5 and type >=3
  • Select cell C5 and type 'yellow'
  • Select cell E5 and type 'glyphicon-alert'
  • Select cell F5 and type 'red'
  • Select cell G5 and type 'fill'
  • Click Save 
  • Test your tiles by loading different accounts with less or more than 3 open Opportunities

When another opportunity is added to the account then the tile will display the second color scheme when the tile is loaded.

You can make the North52 Quick Tiles clickable as well, in the link field you would simply add a hyperlink e.g. https://www.north52.com 

Note: If you are not using a field in the Decision Table you must use two single quotes ('') to indicate the field is blank (this requirement is only for Quick Tile and not regular Decision Tables)

Keywords: Decision Table, HideSections, FindCount, FindCountFD, CreateQuickTile, CreateQuickTileCollection, Formula Manager