Home

Developer Guide

Standalone app

You can find a working version of the full application here.

Basic Setup

To get started with using the component on your HTML page, you will need three things:

  1. A script tag with a link to the /medical-records.js file
  2. A custom element on your HTML page where you want it to appear
  3. A custom json file having configurable properties or the link to the standard DH one provide by the app: [url to the app]/vmr-configuration.json. Ex: https://vmr-qa.dignityhealthppe.org/vmr-configuration.json.

Custom Json configuration file

To deviate from the standard app configurations you can provide your own Json file that follows the structure of the one provided:

{
  "tenantCode": "dignity-health",
  "migrationBaseUrl": "https://sandboxcernerhealth.com/oauth/authenticate",
  "migrationRedirectionUrl": "http%3A%2F%2Fmedicalrecords-dev.dignityhealthppe.org%2F",
  "tealiumScriptSrc": "https://tags.tiqcdn.com/utag/dignityhealth/commonspirit/dev/utag.js",
  "theme": {
    "font": {
      "family": "CSWeb-Regular",
      "cssUrl": "https://cdn1.commonspirit.org/svc/fonts/v1/CSWeb-Regular.woff2"
    },
    "colorPalette": "dhcl-dignity-health"
  }
}
Attribute Description Type Required App Default
tenantCode Identifies the hosting app string false none
migrationBaseUrl Endpoint to authenticate with migration app string false (true to none
enable migration)
migrationRedirectionUrl Url of the migration app string false (true for none
enable migration)
tealiumScriptSrc Url of the script to register on the page to string false (true to none
record user/site metrics enable metrics)
theme Overrides the theme object false
> font Overrides the font object false

| > > family              | Overrides font-family of app & colorPalette   | string | false                | 'CSWeb-Regular', 'CSWeb-Light', 'CSWeb-Medium', Arial |

| | | | | | | | | | | sans-serif | | > > cssUrl | Url of file that declares all the font-faces | string | true (to have | none | | | of a font (default renders 'CSWeb-Regular', 'CSWeb-Light', 'CSWeb-Medium', Arial) | | default/custom font) | | | > colorPalette | One of a few known css classes that sets | string | false | dhcl-dignity-health | | | font-family & colors in the app. | | | | | | Current possible values: | | | | | | dhcl-dignity-health, dhcl-chi-health, | | | | | | dhcl-common-spirit, dhcl-virginia-mason, | | | | | | dhcl-neutral | | | |

Once added to the page, your code snippet will look like this:

<dhmr-root configuration-url="[url to the json file]"></dhmr-root>
<script type="text/javascript" src="[url to the app]/medical-records.js"></script>

Please note that dhmr-root must come first.