Onboarding Plugins

NOTICE OF DEPRECATION

This page is no longer maintained and the contents of the page should not be used for the implementation of 3B Onboarding

Plugins

“remoteUtils”

Enables communication with Salesforce. If the global variable b3o.GlobalRemoutingRouter is available (when the plugin is embedded in a VFP with the apex controller set to “b3o.GlobalRemoutingRouter”), then we will use secure AJAX to communicate with Salesforce. Alternatively, if the b3o.GlobalRemoutingRouter global variable is not available, we will fall back to REST API for communication with Salesforce.

REST API communication is unauthenticated and requires that the plugin is set up with a “publicSiteURL” pointing to a guest user enabled site/community*(link to article)

We do not recommend overriding or extending this plugin.

To include the plugin on a Visualforce Page, use this script:

<apex:includeScript value="{!URLFOR($Resource.b3o__JobRemoteUtils, 'api/js/remote.js')}"/>

To initiate the plugin, run this script:

remoteUtils.init({
    publicSiteURL: '{!$Setup.b3o__Onboarding_Default_Settings__c.b3o__Site_URL__c}'
}).then(value => {
    console.log('Loaded [Remote Utils]', value);
}).catch(error => {
    console.error('Error Initializing [Remote Utils]', error);
});

Properties

Property	Type	Description	Default	Required
publicSiteURL	string	This is the Site/Community base endpoint.		true

“modal”

This is a simple modal plugin. It is a dependency for other plugins to display pages/content in a modal interface.

To include the plugin on a Visualforce Page, use this script:

<apex:includeScript value="{!URLFOR($Resource.b3o__ModalHandler, 'api/js/remote.js')}" />
<link href="{!URLFOR($Resource.b3o__ModalHandler, 'api/css/default.css')}" rel="stylesheet" />

To initiate the plugin, run this script:

modal.init({
    rootEl: 'modal-wrapper',
    reloadComponentsOnClose: false
}).then(value => {
    console.log('Loaded [MODALHANDLER]', value);
}).catch(error => {
    console.error('Error Loading Component [MODALHANDLER]', error);
}).finally(fin =>{

});

Properties

Property	Type	Description	Default	Required
rootEl	string	This is the ID of the root element where the modal will be rendered into		true
reloadComponentsOnClose	boolean	Whether or not the component will request all other sibling components to re-render when the modal is closed	true	false

“jobVetting”

This is the plugin that runs assessments *(link to article).

To include the plugin on a Visualforce Page, use this script:

<!-- Web Components -->
<apex:includeScript value="{!URLFOR($Resource.b3o__AppVettingResources, 'api/components/inputText.js')}"/>
<apex:includeScript value="{!URLFOR($Resource.b3o__AppVettingResources, 'api/components/inputSelect.js')}"/>
<apex:includeScript value="{!URLFOR($Resource.b3o__AppVettingResources, 'api/components/inputCheckboxes.js')}"/>
<!-- Resource Scripts Loading -->
<apex:includeScript value="{!URLFOR($Resource.b3o__AppVettingResources, 'api/js/remote.js')}" />
<link href="{!URLFOR($Resource.b3o__AppVettingResources, 'api/css/default.css')}" rel="stylesheet" />

To initiate the plugin, run this script:

const queryString = window.location.search;
const urlParams = new URLSearchParams(queryString);
//Question Set ID and Contact Id are required
const userId = urlParams.get('uId');
const questionSetId = urlParams.get('qsId');

//Job Id and Job Board Id are not required - if passed, we will create a new 3B Applicaiton
const jobId = urlParams.get('jobId');
const boardId = urlParams.get('bId');

//If Document Id is passed, we will create a new Document Submission for that document
const documentId = urlParams.get('docId');
const applicationId = urlParams.get('applicationId');
let jobBoardId = urlParams.get('jb');

jobVetting.init({
    rootEl: 'job-app-vetting',
    jobBoardId: jobBoardId,
    userId: userId,
    jobPostId: jobId,
    jobBoardId: boardId,
    questionSetId: questionSetId,
    documentId: documentId,
    applicationId: applicationId,
}).then(value => {
    console.log('Loaded [JOBVETTING]', value);
}).catch(error => {
    console.error('Error Loading Component [JOBVETTING]', error);
}).finally(fin =>{
    window.addEventListener('b3oVettingComplete', onCompleteVetting, false); 
});

This plugin is dependent on the remoteUtils plugin.

Properties

Property	Type	Description	Default	Required
rootEl	string	This is the ID of the root element where the modal will be rendered into		true
jobPostId	string	This is the 3B Job's record id. Used to auto-generate 3B Application if passed.		false
jobBoardId	string	This is the Job Board's record id. Used together with jobPostId, when a 3B Application is created, we will assign the Job Board's ID in the field on the 3B Application		false
userId	string	This is the Contact Id (logged in user)		true
questionSetId	string	This is the Question Set's record id.		true
documentId	string	This is the Document's record id. If passed, we will create a new document submission*(Link to article) upon successful submission of the record		false
applicationId	string	This is the 3B Application's record id. If passed, we will relate the Candidate Scorecard*(Link to article) to the provided 3B Application id		false
LBL_DefaultOptionLabel	string	For drop-downs, what would be the text displayed in the non-selected drop downs	-- Select --	false
MSG_FieldRequired	string	Error message displayed when a field is required, but no value is provided	This is required	false
MSG_FieldTooLong	string	Error message displayed if the input field violates the maximum length settings	Input is too long	false
submitBTN	string	The label of the submit button	Submit	false

“jobBoardActions”

This is the plugin that renders the login/log out and options menu for non-community user authentication mode. Elect a registration form or even other menu options to be displayed. Feel free to override the HTML implementation to make the drop down fit better your branding.

To include the plugin on a Visualforce Page, use this script:

<apex:includeScript value="{!URLFOR($Resource.b3o__JobBoardMenuResources, 'api/js/remote.js')}" />
<link href="{!URLFOR($Resource.b3o__JobBoardMenuResources, 'api/css/default.css')}" rel="stylesheet" />

To initiate the plugin, run this script:

const urlParams = new URLSearchParams(queryString);
const jobBoardId = urlParams.get('jb');

jobBoardActions.init({
    rootEl: 'job-board-actions',
    publicSiteURL: '{!$Setup.b3o__Onboarding_Default_Settings__c.b3o__Site_URL__c}',
    jobBoardId: jobBoardId,
    logOutRedirectURL: '{!$Setup.b3o__Onboarding_Default_Settings__c.b3o__Site_URL__c}',
    hideInCommunity: true,
}).then(value => {
    console.log('Loaded [JOBBOARDACTIONS]', value);
}).catch(error => {
    console.error('Error Loading Component [JOBBOARDACTIONS]', error);
}).finally(fin =>{
    
});

This plugin is dependent on the remoteUtils plugin.

Properties

Property	Type	Description	Default	Required
rootEl	string	This is the ID of the root element where the modal will be rendered into		true
publicSiteURL	string	This is the Site/Community base endpoint.		true
jobBoardId	string	This is the Job Board's record id. This is used in order to identify which Menu Buttons to retreive and render.		true
logOutRedirectURL	string	This is the page/URL the user will be re-directed upon successful log out		true
hideInCommunity	boolean	Whether or not to render the component in a community context	true	false
BTN_Login	string	The label of the login button	Login	false
BTN_Logout	string	The label of the logout button	Logout	false

“selfB”

This is the plugin that runs the self bookings*(link to article).

To include the plugin on a Visualforce Page, use this script:

<apex:includeScript value="{!URLFOR($Resource.b3o__SelfBooking, 'api/js/app.js')}" />
<link href="{!URLFOR($Resource.b3o__SelfBooking, 'api/css/styles.css')}" rel="stylesheet" />

To initiate the plugin, run this script:

const queryString = window.location.search;
const urlParams = new URLSearchParams(queryString);
const userId = urlParams.get('id');
//Optional param to pass back to parent component
const documentId = urlParams.get('document');

const userLocale =
  navigator.languages && navigator.languages.length
    ? navigator.languages[0]
    : navigator.language;
    
document.addEventListener("DOMContentLoaded", function(){
    selfB.init({                
        rootEl: 'self-booking',
        publicSiteURL: '{!$Setup.b3o__Onboarding_Default_Settings__c.b3o__Site_URL__c}',
        source:'Default Self-Booking Page',
        MSG_NoPendingInvites: 'You have no pending invitations currently. Please try again later',
        userId: userId,
        localeCode: userLocale,
    }).then(value => {
        console.log('Loaded [SELFBOOKING]', value);
    }).catch(error => {
        console.error('Error Loading Component [SELFBOOKING]', error);
    }).finally(fin =>{
        window.addEventListener('b3oBookingComplete', onCompleteBooking, false); 
    });

    //This event is required in order to auto-close the modal once the assessment 
    //is completed, provided that the assessment is completed in MyDocuments.page
    function onCompleteBooking(event){
        console.log('Caught Self-Booking Complete - firing back', event.detail);
    
        window.parent.postMessage(
            {
                event_id: '3bonboarding_selfBook',
                data: {
                    contactId: event.detail.contactId,
                    documentId: documentId
                }
            }, 
            "*" 
        ); 
    }
});

This plugin is dependent on the remoteUtils plugin.

Properties

Property	Type	Description	Default	Required
rootEl	string	This is the ID of the root element where the modal will be rendered into		true
publicSiteURL	string	This is the Site/Community base endpoint.		true
source	string	Any unique identifier to help with reporting. This will be stamped on a field on the Session Invitation record		false
userId	string	This is the Contact Id (logged in user)		true
sendCompleteEvent	boolean	This will cause an event to be emitted with the event_id "b3oBookingComplete" once the booking is successfull. Used with MyDocuments.page to re-render the documents page.		false
localeCode	string	User's locale preference for display of dates/times. Determines whether we use dd/mm/yyyy or mm/dd/yyyy format. Can be hard-coded or auto identified.	Dynamically retreived by user's browser settings. Fall back to en-GB	false
LBL_InvitationsHeader	string	Header	Invitations	false
LBL_SessionDetails	string	Header	Session Details	false
LBL_SessionOrganizer	string	Field label	Organiser	false
LBL_SessionLocation	string	Field label	Location	false
LBL_ConfirmBtn	string	Confirm button label	Confirm	false
LBL_SelectDateHeader	string	Header	Select Date	false
LBL_SelectTimeHeader	string	Header	Select Time	false
LBL_BookedHeader	string	Header after session booked	Booked!	false
MSG_NoPendingInvites	string	Message displayed if the contact has no pending invites	No pending invites. Please try again later.	false
MSG_GeneralError	string	General error message (APEX/Javascript)	There was an unexpected error. Please try again later.	false
MSG_NoDatesAvailable	string	Message displayed when there are no available scheduled dates to book	No dates available.	false
variant	string	Two possible options - 'calendar' which renders invites in a calendar view or 'table' which will render them in a list view	Defaults to 'calendar'	false
weekDays	array	Represents the days of the weeks. Used for translations	['Sun', 'Mon', ..'Sat']	false
monthNames	array	Represents the months of the year. Used for translations	['Jan', 'Feb', ... 'Dec']	false
LBL_PrevMonthBtn	string	Month navigation button	Prev	false
LBL_NextMonthBtn	string	Month navigation button	Next	false
MSG_NoInvitationsFound	string	Error message when no invitations found	'No recent invitations found.'	false

"jobBoard"

This is the plugin that renders Jobs in a job board format

To include the plugin on a Visualforce Page, use this script:

<apex:includeScript value="{!URLFOR($Resource.b3o__JobBoardResources, 'api/js/remote.js')}" />
<link href="{!URLFOR($Resource.b3o__JobBoardResources, 'api/css/default.css')}" rel="stylesheet" />

To initiate the plugin, run this script:

jobBoard.init({
    rootEl: 'jobs-feed',
    publicSiteURL: '{!$Setup.b3o__Onboarding_Default_Settings__c.b3o__Site_URL__c}',
    jobBoardId: jobBoardId,
    googleAPIKey: '{!$Setup.b3o__Onboarding_Default_Settings__c.b3o__Google_API_Key__c}',
    placesAPIOptions: {
        fields: ['geometry'],
    },
    localeCode: 'en-GB',
}).then(value => {
    console.log('Loaded [JOBBOARD]', value);
}).catch(error => {
    console.error('Error Loading Component [JOBBOARD]', error);
}).finally(fin =>{
});

Properties

Property	Type	Description	Default	Required
rootEl	string	This is the ID of the root element where the modal will be rendered into		true
jobBoardId	string	This is the Job Board's record id. Used together with jobPostId, when a 3B Application is created, we will assign the Job Board's ID in the field on the 3B Application		false
BTN_Search	string	Button label	Search	false
BTN_ViewJob	string	Button label	View Job	false
LBL_JobAvailableUntil	string	Field label	Available Until	false
LBL_JobType	string	Drop down default state label	-- Select Category --	false
LBL_EmpType	string	Drop down default state label	-- Select Job Type --	false
LBL_Location	string	Drop down default state label	-- Select Location --	false
LBL_Keywords	string	Field label	Search by keywords	false
LBL_Places	string	Field label	Search by location	false
LBL_Places_Radius	string	Drop down default state label	-- Radius --	false
MSG_NoJobsFound	string	Message when no jobs found after search / load	No jobs found	false
googleAPIKey	string	API key for google maps		false
placesAPIOptions	object	new google.maps.places.Autocomplete(searchInput, settings.placesAPIOptions);		false
radiusSearchUnits	string		mi	false
radiusSearchOptions	object		{label:'Within 5 miles', value:5, selected:true}, {label:'Within 10 miles', value:10}, {label:'Within 20 miles', value:20}, {label:'Within 30 miles', value:30}, {label:'Within 100 miles', value:100}, {label:'Nationwide', value:1000}	false
dateFormat	object	A javascript object of the date formatting rule, used as the options parameter in a ''.toLocaleDateString()	{ year: 'numeric', month: 'numeric', day: 'numeric' }	false
localeCode	string	User's locale preference for display of dates/times. Determines whether we use dd/mm/yyyy or mm/dd/yyyy format. Can be hard-coded or auto identified.	Dynamically retreived by user's browser settings. Fall back to en-GB	false

This plugin is dependent on the remoteUtils, modal and jobBoardActions plugins.

“jobPost”

This is the plugin that renders Job Posts in an embedded format

To include the plugin on a Visualforce Page, use this script:

<apex:includeScript value="{!URLFOR($Resource.b3o__JobPostResources, 'api/js/remote.js')}"/>
<link href="{!URLFOR($Resource.b3o__JobPostResources, 'api/css/default.css')}" rel="stylesheet"/>

To initiate the plugin, run this script:

jobPost.init({
    rootEl: 'job-post',
    jobPostId: jobId,
    localeCode: 'en-GB'
}).then(value => {
    console.log('Loaded [JOBPOST]', value);
}).catch(error => {
    console.error('Error Loading Component [JOBPOST]', error);
}).finally(fin =>{
});

Properties

Property	Type	Description	Default	Required
rootEl	string	This is the ID of the root element where the modal will be rendered into		true
jobPostId	string	This is the 3B Job's record id.		true
LBL_PostNotFound	string	Header when we couldn't find a valid 3B Job by the jobPostId	Error 404	false
LBL_PostNotFoundDesc	string	Description when we couldn't find a valid 3B Job by the jobPostId	Post not found	false
LBL_JobLocation	string	Field label	Location	false
LBL_JobJobType	string	Field label	Job Type	false
LBL_JobEmploymentType	string	Field label	Employment Type	false
LBL_JobPay	string	Field label	Pay	false
LBL_JobReference	string	Field label	Job Reference	false
LBL_JobAvailableUntil	string	Field label	Available Until	false
LBL_AlreadyApplied	string	Message displayed when someone has already applied and they are viewing this job post	You have already applied for this job	false
BTN_NavigateJobDocuments	string	Button label	Application Documents	false
myDocumentsPage	string	This is the end point to the page responsible for managing documents and assignments.	b3o__JobDocuments?id={0}&dpId={1}&applicationId={2}	false
dateFormat	object	A javascript object of the date formatting rule, used as the options parameter in a ''.toLocaleDateString()	{ year: 'numeric', month: 'numeric', day: 'numeric' }	false
localeCode	string	User's locale preference for display of dates/times. Determines whether we use dd/mm/yyyy or mm/dd/yyyy format. Can be hard-coded or auto identified.	Dynamically retreived by user's browser settings. Fall back to en-GB	false

This plugin is dependent on the remoteUtils, modal, jobBoardActions and jobApp plugins.

“jobApp”

This is the plugin that enables the job application workflow

To include the plugin on a Visualforce Page, use this script:

<apex:includeScript value="{!URLFOR($Resource.b3o__JobAppResources, 'api/js/remote.js')}"/> 
<link href="{!URLFOR($Resource.b3o__JobAppResources, 'api/css/default.css')}" rel="stylesheet"/>

To initiate the plugin, run this script:

jobApp.init({
    rootEl: 'job-app',
    publicSiteURL: '{!$Setup.b3o__Onboarding_Default_Settings__c.b3o__Site_URL__c}',
    jobPostId: jobId
}).then(value => {
    console.log('Loaded [JOBAPP]', value);
}).catch(error => {
    console.error('Error Loading Component [JOBAPP]', error);
}).finally(fin =>{
});

Properties

Property	Type	Description	Default	Required
rootEl	string	This is the ID of the root element where the modal will be rendered into		true
publicSiteURL	string	This is the Site/Community base endpoint.		true
jobPostId	string	This is the 3B Job's record id.		true
jobApplicationPage	string	Question Set/Assessment page URL	b3o__JobApplication	false
myDocumentsPage	string	This is the end point to the page responsible for managing documents and assignments.	/b3o__JobDocuments?id={0}&dpId={1}&applicationId={2}	false

“myDocs”

This is the plugin that runs the My Documents component. Include the below scripts and links:

<!-- Web Components -->
<script src="{!URLFOR($Resource.b3o__GeneralUtils, 'utils/communication.js')}" type="module"/>
<script src="{!URLFOR($Resource.b3o__GeneralUtils, 'utils/toasts.js')}" type="module"/>
<script src="{!URLFOR($Resource.b3o__GeneralUtils, 'components/loading-spinner/loadingSpinner.js')}" type="module"/>
<script src="{!URLFOR($Resource.b3o__MyDocuments, 'api/components/document-submissions-list/documentSubmissionsList.js')}" type="module"/> 
<script src="{!URLFOR($Resource.b3o__MyDocuments, 'api/components/document-pack-table/documentPackTable.js')}" type="module"/> 
<script src="{!URLFOR($Resource.b3o__MyDocuments, 'api/components/document-pack/documentPack.js')}" type="module"/> 
<!-- Plugin -->
<apex:includeScript value="{!URLFOR($Resource.MyDocuments, 'api/js/app.js')}" />
<link href="{!URLFOR($Resource.b3o__MyDocuments, 'api/css/styles.css')}" rel="stylesheet" />

Property	Type	Description	Default	Required
rootEl	string	This is the ID of the root element where the modal will be rendered into	N/A	true
publicSiteURL	string	This is the Site/Community base endpoint.	{!$Setup.b3o__Onboarding_Default_Settings__c.b3o__Site_URL__c}	true
userId	string	Required - contact id or user id	N/A	true
documentPackId	string	A filter on a specific document pack to be loaded		false
applicationId	string
localeCode	string	The default locale code (en-GB, es-ES)	Retreived window.navigator.language	false
dateFormat	object	Date format for Date.toLocaleDateString()	{ year: 'numeric', month: 'numeric', day: 'numeric' }	false
showDetailsOnLoad	boolean	Whether or not to show previous submissions on page load	true	false
ContextLookupField	string	Secondary context to be added to 3B Forms. Usually an Application/Placement record lookup. Works with Target Recruit App, Bullhorn App or any other custom object lookup	b3o__X3B_Application__c	false
AssignmentBadgeFieldPaths	array	An array of field paths starting from the Document Assignment to be rendered as badges on the Document Pack	[ 'b3o__X3B_Application__r.Name', 'b3o__X3B_Application__r.b3o__Job__r.Name' ]	false
LBL_HeaderComments	string	Label	Comments	false
LBL_HeaderStatus	string	Label	Status	false
LBL_HeaderDocument	string	Label	Document	false
BTN_Submit	string	Label	Submit	false
BTN_Edit	string	Label	Edit	false
BTN_Re_Submit	string	Label	Re-Submit	false
BTN_Approved	string	Label	Approved	false
BTN_Invalid	string	Label	Invalid	false
BTN_PendingSubmission	string	Label	Pending Submission	false
BTN_CompleteDocumentPack	string	Label	Submit for Approval	false
BTN_CompleteDocumentPackAgain	string	Label	Re-Submit for Approval	false
MSG_NoDocumentAssignments	string	Label	No documents are assigned to you currently. Please try again later	false
MSG_NotLoggedInMessage	string	Label	You have followed an invalid link or you are not logged in	false
MSG_GeneralError	string	Label	There was an unexpected error. Please try again later	false
MSG_ConfirmDocAssignmentSubmission	string	Label	Are you sure you want to continue	false
LINK_VFBaseURL	string	Base URL for displayed VF pages	{!$Setup.b3o__Onboarding_Default_Settings__c.b3o__Visualforce_External_Site_URL__c}	false
LINK_Form	string	3B Form template url. {0} - form Id {1} - contact id {2} - context lookup field on assignment	apex/b3f__formcomplete?id={0}&ContactId={1}&b3o__Application__cId={2}&ContextLookupField={2}	false
LINK_Document	string	3B Docs template url. {0} - template id {1} - contact id or context id	apex/b3d__Document?templateId={0}&recordId={1}	false
LINK_QuestionSet	string	3B Assessment template url. {0} - contact id {1} - question set id {2} - document id {3} - context id	apex/b3o__jobapplication?uId={0}&qsId={1}&docId={2}&applicationId={3}	false

To include on a Visualforce Page, use the below example:

myDocs.init({
    rootEl: 'my-documents',
    publicSiteURL: '{!$Setup.b3o__Onboarding_Default_Settings__c.b3o__Site_URL__c}',
    LINK_VFBaseURL: '{!$Setup.b3o__Onboarding_Default_Settings__c.b3o__Visualforce_External_Site_URL__c}',
    BTN_Approved: 'Approved',
    userId: userId,
    documentPackId: documentPackId,
    localeCode: 'en-GB',
    showDetailsOnLoad: {!$Setup.b3o__Onboarding_Default_Settings__c.b3o__My_Docs_Show_Expanded_Details_on_Load__c},
    ContextLookupField: 'b3o__X3B_Application__c',
    AssignmentBadgeFieldPaths: [
        'b3o__X3B_Application__r.Name',
        'b3o__X3B_Application__r.b3o__Job__r.Name'
    ]
}).then(value => {
    console.log('Loaded [MYDOCUMENTS]', value);
}).catch(error => {
    console.error('Error Loading Component [MYDOCUMENTS]', error);
}).finally(fin =>{
    
});

Authentication Context

3B components are designed to be running in internal user context, community user context or un-authenticated guest user context. When running our components in the later context, you are responsible for implementing a reliable and secure authentication and communication mechanism. We provide a component “jobBoardActions” that manages authentication using 3B Forms, however we view this as dangerous and prone to brute force attacks. Always implement full-blown community licenses where possible for external candidate communication.