Using on Salesforce flow (Developer skills required)

This demo only serves as a broad example on how **SharinPix **be used in Salesforce Flow. You are not restricted to using **Contacts or Accounts **objects. To get a technical grasp on how the VisualFlow was implemented, please head over to the Cookbook section: Create Contacts from an Account using VisualFlow

In this demo, we will see how it possible to create one or more **Contacts **starting from a particular **Account **record and upload a profile picture corresponding to the **SharinPix Album **for each newly-created Contact record.

Overview

To implement the present demo, we will reference a **Visual Flow **inside a Visualforce Page. The following steps provide a high-level overview of the objective we want to achieve in this demo:

Visual Flow:

1. Look up the Id of Account Record from which the Screen Flow was launched.

2. Display the input fields to so as to create the **Contact **record(s) while using the **Account Id **(collected in the previous step) in order to create a LookUp **relationship **between the **Account **and the recently-created **Contact **record(s).

3. Display the **SharinPix Album **for the user to upload the profile picture of the newly-created Contact(s).

Visualforce Page:

4. Reference the newly-created **Flow **inside a Visualforce Page.

Account Page-Layout:

5. Create a custom action to launch the** Visualforce Page **created in the previous step.

6. Add the custom action to the Account's page-layout.

Integrating SharinPix with the VisualFlow

In order to be able to use the SharinPix Album alongside a VisualFlow, we references both the SharinPix Album and the VisualFlow inside a custom Visualforce Page.

The code snippet below shows how both the VisualFlow and SharinPix Album is referenced inside a Visualforce Page.

    <apex:page StandardController="Account" extensions="FlowController">
    <flow:interview name="SharinPix_Account_Contacts" interview="{! sp_flow }" finishLocation="/{!$CurrentPage.parameters.Id}"></flow:interview>
    <sharinpix:SharinPix height="400px" rendered="{! sp_flow.RenderAlbum == true }" parameters="{'Id': '{! sp_flow.ContactId }', 'abilities':{'{! sp_flow.ContactId }':{'Access': {'image_upload':true,'image_list':true,'see':true,'image_delete':true}}}}" />	
    </apex:page>

• The code snippet below references a VisualFlow.

    <flow:interview name="SharinPix_Account_Contacts" interview="{! sp_flow }" finishLocation="/{!$CurrentPage.parameters.Id}"></flow:interview>

• As it can bee seen above, the flow element has the following properties:

  • **Name: **the name of the flow created.

  • **Interview: **a reference to the flow interview as declared in the Apex Controller of the current Visualforce Page. This reference will allow us to access the variables found in the flow.

• The code snippet below references the SharinPix Visualforce Component.

    <sharinpix:SharinPix height="400px" rendered="{! sp_flow.RenderAlbum == true }" parameters="{'Id': '{! sp_flow.ContactId }', 'abilities':{'{! sp_flow.ContactId }':{'Access': {'image_upload':true,'image_list':true,'see':true,'image_delete':true}}}}" />	

As it can be seen in the above code snippet, the SharinPix Visualforce Component has the properties:

• **height: **corresponds to the height of the SharinPix Album as rendered inside the SharinPix Visualforce Component.

• **rendered: **corresponds to the Boolean flag that dictates whether the SharinPix Visualforce Component is to be rendered, hence displayed on the Visualforce Page.

• **parameters: **corresponds to the set of SharinPix Abilities enabled/disabled on the SharinPix Album.

The code snippet below shows the implementation of the Apex Class used as the controller for the Visualforce Page implemented above.

    public class FlowController {
        public Flow.Interview.SharinPix_Account_Contacts sp_flow { get; set; }
        public FlowController (ApexPages.StandardController controller) {}
    }

The declared variable **sp_flow **represents the reference for the Flow. It will allow us to access the variables present within the flow.

For example, within the **SharinPix Visualforce Component **referenced inside the Visualforce Page, shown above, uses the Flow reference to access the following variables:

• **sp_flow.RenderAlbum: **The **RenderAlbum **variable is used to dictate whether the SharinPix Visualforce Component is to be displayed or not on the Visualforce Page.

• **sp_flow.ContactId: **The **ContactId **variable is used to associate the SharinPix Album to the relevant Contact Record.