crds-shared-header
crds-shared-header
is a framework-agnostic implementation of Crossroads' global header.
Requirements
This project requires the following dependencies...
- crds-styles
- Bootstrap.js (only the JavaScript)
- jQuery (required by Bootstrap)
Usage
Install this package via NPM by executing the following command in your project directory...
npm install crds-shared-header --save
Include the compiled bundle before the closing <body>
tag in your HTML like this...
The header class will be available on the global CRDS
object. Instantiate and render like so...
<script>{ var options = el: '[data-header]' ; var header = options; header;};</script>
The following options can be passed when the object is instantiated...
Options | Description | Default |
---|---|---|
el |
Selector to bind the rendered header to | [data-header] |
contentBlockTitle |
The title of the contentBlock used to populate the navigation | sharedGlobalHeader |
contentBlockCategories |
Defines category containing contentBlockTitle |
['common'] |
userMenuContentBlockTitle |
The title of the contentBlock used to populate a signed-in user's menu | sharedGlobalHeaderUserMenu |
userMenuContentBlockCategories |
Defines category containing userMenuContentBlockTitle |
['common'] |
cmsEndpoint |
Environmentally specific URL to the CMS | https://contentint.crossroads.net/ |
appEndpoint |
URL prepended to the sign-in button | https://int.crossroads.net/ |
imgEndpoint |
URL prepended to the user avatar images | https://gatewayint.crossroads.net/gateway/api/image/profile/ |
crdsCookiePrefix |
prefix to prepend to environment's cookie names. int would be intsessionId | int |
Authentication
When a user logs into the site, the sign-in button at the right side of the menu should be replaced with their profile image and a dropdown menu containing account specific links. Currently, the script is configured to respond accordingly whenever a cookie named ${crdsCookiePrefix}sessionId
is set for the current session.
documentcookie = 'intsessionId=21864538764'; //requireddocumentcookie = 'username=Sean'; // optional
Browser Support
In order to support IE versions 10 and 11, you'll need to include the following polyfills in your page/project...
License
This project is licensed under the 3-Clause BSD License.