Onboarding Plugins: Difference between revisions

Jump to navigation Jump to search

Onboarding Plugins (view source)

Revision as of 06:50, 22 October 2022

15,304 bytes added ,  06:50, 22 October 2022
Final
No edit summary
(Final)
Line 11: Line 11:
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)
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. <syntaxhighlight lang="javascript" line="1">
We do not recommend overriding or extending this plugin.
 
To include the plugin on a Visualforce Page, use this script: <syntaxhighlight lang="html">
<apex:includeScript value="{!URLFOR($Resource.b3o__JobRemoteUtils, 'api/js/remote.js')}"/>
</syntaxhighlight>To initiate the plugin, run this script:<syntaxhighlight lang="javascript" line="1">
remoteUtils.init({
remoteUtils.init({
     publicSiteURL: '{!$Setup.b3o__Onboarding_Default_Settings__c.b3o__Site_URL__c}'
     publicSiteURL: '{!$Setup.b3o__Onboarding_Default_Settings__c.b3o__Site_URL__c}'
Line 36: Line 40:


==== “modal” ====
==== “modal” ====
This is a simple modal plugin. It is a dependency for other plugins to display pages/content in a modal interface. <syntaxhighlight lang="javascript">
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: <syntaxhighlight lang="html">
<apex:includeScript value="{!URLFOR($Resource.b3o__ModalHandler, 'api/js/remote.js')}" />
<link href="{!URLFOR($Resource.b3o__ModalHandler, 'api/css/default.css')}" rel="stylesheet" />
</syntaxhighlight>To initiate the plugin, run this script:<syntaxhighlight lang="javascript">
modal.init({
modal.init({
     rootEl: 'modal-wrapper',
     rootEl: 'modal-wrapper',
Line 71: Line 80:
==== “jobVetting” ====
==== “jobVetting” ====
This is the plugin that runs assessments *(link to article).
This is the plugin that runs assessments *(link to article).
To include the plugin on a Visualforce Page, use this script:<syntaxhighlight lang="javascript" line="1">
<!-- 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" />
</syntaxhighlight>To initiate the plugin, run this script:<syntaxhighlight lang="javascript" line="1">
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);
});
</syntaxhighlight>This plugin is dependent on the '''remoteUtils''' plugin.
{| class="wikitable"
{| class="wikitable"
|+Properties
|+Properties
Line 148: Line 200:
==== “jobBoardActions” ====
==== “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.
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:<syntaxhighlight lang="html" line="1">
<apex:includeScript value="{!URLFOR($Resource.b3o__JobBoardMenuResources, 'api/js/remote.js')}" />
<link href="{!URLFOR($Resource.b3o__JobBoardMenuResources, 'api/css/default.css')}" rel="stylesheet" />
</syntaxhighlight>To initiate the plugin, run this script:<syntaxhighlight lang="javascript" line="1">
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 =>{
   
});
</syntaxhighlight>This plugin is dependent on the '''remoteUtils''' plugin.
{| class="wikitable"
|+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” ====
==== “selfB” ====
This is the plugin that runs the self bookings*(link to article).  
This is the plugin that runs the self bookings*(link to article). 
 
To include the plugin on a Visualforce Page, use this script: <syntaxhighlight lang="html">
<apex:includeScript value="{!URLFOR($Resource.b3o__SelfBooking, 'api/js/app.js')}" />
<link href="{!URLFOR($Resource.b3o__SelfBooking, 'api/css/styles.css')}" rel="stylesheet" />
</syntaxhighlight>To initiate the plugin, run this script:<syntaxhighlight lang="javascript">
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
                }
            },
            "*"
        );
    }
});
</syntaxhighlight>This plugin is dependent on the '''remoteUtils''' plugin.
 
{| class="wikitable"
|+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
|}
 
==== "jobBoard" ====
This is the plugin that renders Jobs in a job board format
 
To include the plugin on a Visualforce Page, use this script:<syntaxhighlight lang="html">
<apex:includeScript value="{!URLFOR($Resource.b3o__JobBoardResources, 'api/js/remote.js')}" />
<link href="{!URLFOR($Resource.b3o__JobBoardResources, 'api/css/default.css')}" rel="stylesheet" />
</syntaxhighlight>To initiate the plugin, run this script:<syntaxhighlight lang="javascript" line="1">
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 =>{
});
</syntaxhighlight>
{| class="wikitable"
|+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 <nowiki>''</nowiki>.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” ====
==== “jobPost” ====
This is the plugin that renders Job Posts in an embedded format
This is the plugin that renders Job Posts in an embedded format
To include the plugin on a Visualforce Page, use this script:<syntaxhighlight lang="html">
<apex:includeScript value="{!URLFOR($Resource.b3o__JobPostResources, 'api/js/remote.js')}"/>
<link href="{!URLFOR($Resource.b3o__JobPostResources, 'api/css/default.css')}" rel="stylesheet"/>
</syntaxhighlight>To initiate the plugin, run this script:<syntaxhighlight lang="javascript" line="1">
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 =>{
});
</syntaxhighlight>
{| class="wikitable"
|+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 <nowiki>''</nowiki>.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” ====
==== “jobApp” ====
This is the plugin that enables the job application workflow
This is the plugin that enables the job application workflow
To include the plugin on a Visualforce Page, use this script:<syntaxhighlight lang="html">
<apex:includeScript value="{!URLFOR($Resource.b3o__JobAppResources, 'api/js/remote.js')}"/>
<link href="{!URLFOR($Resource.b3o__JobAppResources, 'api/css/default.css')}" rel="stylesheet"/>
</syntaxhighlight>To initiate the plugin, run this script:<syntaxhighlight lang="javascript" line="1">
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 =>{
});
</syntaxhighlight>
{| class="wikitable"
|+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
|}


=== '''Authentication Context''' ===
=== '''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.
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.
Retrieved from ‘https://3bknowhow.com/wiki/Special:MobileDiff/140’

Navigation menu