Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

In this section we will finally understand how to include the video recording component in your Salesforce pages.
We have different options, either leveraging just a point & click interface, or getting our hands dirty writing few rows lines of code in Lightning. In either casescase, no Apex is involved (wink) - so fairly easy to package up and deploy across Salesforce Orgs.


At first, let's fly through look at all of the options we have:

  • If you are planning to embed video recording in a Salesforce Lightning page, you could consider to:
    • Drag and drop the NativeVideo VideoRecord component, that you'll find once the managed package has been installed
    • Create a quick action to load a Lightning Component that wraps the standard VideoRecord component
    • Dynamically load the VideoRecord component, for instance in response to the running user clicking on a button in your page / component
  • If you are still running your Org on the legacy Salesforce Classic, we have you covered too. NativeVideo can expose the recording capabilities as VisualForce component (look for "nativevideo:record"). You might find all info you need in this dedicated section here.

...

As introduced in the first section of this wiki, NativeVideo offer two key components, one of which is the standard VideoRecord. The first option available to you is simply to drag and drop the VideoRecord Lightning component in your Lightning App or Community Builder, as detailed in the section 2 of the "Recording and browsing one video per record", that if necessary you can read this again here.
Please remember to fill in at least the required fields for this component to work, that they vary according to which scenario you are configuring:

...

Save the page... and now the video recording component is embedded in your page. At first, it will ask you for the rights right to access your camera and microphone... and once granted, you'll see yourself on screen, ready to hit the Record button. That's it.

...

If having the video recording component always displayed on screen is not something you really want, a quick action might be a good alternative: we are now going to expose the same functionality in a popup that appears in the middle of the screen once the user has pressed on a button. Again, pretty straightforward.

This approach has been fully detailed in the section 3 of the "Recording and browsing one video per record" page, that you can find here.
Just to recap on this approach, the key steps are:

  1. Create a new Lightning Component, that will embed the standard VideoRecord component. The reason why we have to do this is just because Salesforce don't allow us to pass attributes to a Lightning Component referenced in a Lightning Action... not yet at least
  2. Edit the Component, adding few lines to create the HTML container for the VideoRecord instance that we are going to dynamically initiate
  3. Edit the Controller, adding enough Javascript to create an instance of VideoRecord, specifying the same attributes described in the previous paragraph, according to which scenario needs to be configured. Also, note an extra couple of parameters:
    1. "aura:id" with the Aura identifier of the new component that is going to be created
    2. "videoApprovedOrigin" that has to be initialised with "https://" + window.location.host  - This attribute is just a technicality, but please don't forget to specify it
  4. Navigate to the list of Buttons, Links & Actions and add a new action, that will invoke the component we have just defined
  5. Open the required page layout(s) and include the Lightning Action that has been just created

With these 5 simple steps you are now enabling your users to run video recording and interview simply by clicking on a button on the details page of your records.

...

Consider again the video interview scenario (here again  is the link, in case you've missed it), where we had the concepts concept of Vacancy and Applications, whereby potential candidates were to record video interviews as part of the company's recruitment process. One way to actually implement this is to spin up a Salesforce Community, allowing candidates to access either via their own credentials or anonymously , to (and therefore not require a licence). They can then browse all company information such as mission, values and history, to then move to what 's the role is all about, for instance example this could be described by the hiring manager over a video... and then finally to record a their video interview.

There are different ways to achieve this, but probably the best user experience will be offered by a custom Lightning component, that can really take your candidates by hand and guide them through all of the relevant steps. Once the candidate has logged in into the Salesforce Community, a single page component will welcome him or her, with a description of the company and with a video of from the CEO:

Candidate - Video Interview Portal


In then the candidate is clicking The candidate then clicks on the second tab, where more information are is provided on the specific vacancy, again with a video of the hiring manager describing the ideal candidate and the overall opportunity:

Candidate - Vacancy Info


And then finally Finally the candidate can decide to record his their video interview, moving to the third and final section of the component, where a button is displayed in the middle of the screen:

Candidate - Button to record an interview


And once Once the button is pressed, a VideoRecord component is dynamically created and injected in an empty HTML DIV that acts as a container for it. The user will then be presented with himselfan image of themself, ready to kick off the video interview:

...

From a technical standpoint, this approach is pretty identical to the one described in the previous paragraph, clearly with the exclusion of the Lightning Action. What needs to be done is just to include the same code described in the Controller, where the VideoRecord standard component is dynamically initialised and injected in a host HTML element. 

...

Conclusion & Next Steps

In this chapter we have discussed the most common options in for offering recording capabilities with Salesforce Lightning. If you are now looking to for a similar overview but for the browsing component, jump here. Otherwise, let's now discuss the specific use case where you want to run video recording with un-authenticated users, here.