Salesforce Lightning: Web Page App Setup

Follow the steps below to set up your Salesforce dashboard with the Enplug Web Page App. 

Notes:

• Salesforce Lightning is the most recent version of Salesforce.
• If using Salesforce Classic, please see this article.

Two-Factor Authentication

If you have two-factor verification enabled on your Salesforce account, you'll need to provide approval for your device. To do this, you'll need to set up an approved IP address on Salesforce.

You'll first want to confirm your current IP address with your IT Team and inquire if there's a preferred method for assigning approval. 

After obtaining your IP address, you'll need all devices on said IP address to access your Salesforce dashboard.

To do so:

1. Log into Salesforce.
2. In the top left corner of the screen, click the gear icon.
3. From the Setup drop-down, click Setup Home.
4. Under Settings, click Security.
5. Select Network Access.
6. Under Network Access, click New.
7. Here, you'll enter the IP address you'd like to provide access.

Adding Salesforce Dashboard to Enplug

Note: You'll need to copy the URL of the Salesforce dashboard you'd like to add to Enplug.

To add a Salesforce Dashboard to Enplug:

1. Log into Enplug.
2. Click the Apps drop-down in the top menu.
3. Open the Web Page app.
4. Click Add Web Page in the top right corner.
5. Add your Salesforce Dashboard URL.
6. Click Advanced Settings and enter the following information:
   • Website Appearance: Desktop View
   • Page Rendering Delay: 2
   • Check the Reload each time page is shown box
   • Auto-Reload: 10
   • Scale text: 100
7. Under JavaScript, check the Allow JavaScript box.
8. Enter your Salesforce account Username and Password.
   • The Token field can be disregarded.
9. In the Run Custom JavaScript field, enter the following:

(function() {

 if ( document ) {

   try {

     document.getElementById('username').value = webView.getUsername();

     document.getElementById('password').value = webView.getPassword();

     document.getElementById('rememberUn').checked = true;

     document.getElementById('Login').click()

   } catch(error){}

 

   var frames = document.getElementsByTagName('iframe');

   for (var i in frames) {

     if ( frames[i].src

         && frames[i].src.split('com/desktopDashboards/dashboardApp.app').length > 1 ) {                

       var frame = frames[i];

       document.body.innerHTML = '';

       document.body.appendChild(frame);

       frame.style.position = 'absolute';

       frame.style.width = '100%';

       frame.style.height = '110%';

       frame.style.transform = 'translate3d( 0, -10%, 0)';

       return;

     }

   }

 }

 setTimeout(arguments.callee, 500);

})();

Once this information is entered, click Save Changes.

When running for the first time, the script may display a blank screen. This is due to the time needed for the script to log into the Salesforce system. If this occurs, click Save Changes again. This will reload the page and the display should work correctly.

Notes:

• Depending on your screen orientation, you may want to modify this line of code: frame.style.transform = 'translate3d( 0, -10%, 0)';. This modification would be to crop the dashboard header out of the screen.
• Landscape screens need a value of -10%.
• Portrait screens need a value of -5%.
• If you'd like content to auto-refresh without using browser cache settings, use this scripting: 

function login() {
  try {
    document.getElementById('username').value = webView.getUsername();
    document.getElementById('password').value = webView.getPassword();
    document.getElementById('rememberUn').checked = true;
    document.getElementById('Login').click();
  } catch (e) {  }
}
function getElement(target, selector, name) {
  return new Promise(function (resolve) {
    function check() {
      var el = target.querySelector(selector);
      if (el) { resolve(el); }
      else { setTimeout(check, 500); }
    };
    check();
  });
}
function repositionFrame() {
  try {
    var frame = document.querySelector('iframe[src*="com/desktopDashboards/dashboardApp.app"]');
    if (!frame) { return; }

    frame.onload = function () {
      runAutorefresh();
    };

    document.body.innerHTML = '';
    document.body.appendChild(frame);
    frame.style.position = 'absolute';
    frame.style.width = '100%';
    frame.style.height = '110%';
    frame.style.transform = 'translate3d( 0, -10%, 0)';
  } catch (e) { }
}
function runAutorefresh() {
  try {
    var frame = document.querySelector('iframe');
    if (!frame) { return; }
    
    var innerDoc = frame.contentDocument || frame.contentWindow.document;
    getElement(innerDoc, '.refresh').then(function (trigger) {
      if (triggerSet) { return; }
      triggerSet = true;
      setInterval(function () { trigger.click(); }, 60000);
    });
  } catch (e) { }
}
var triggerSet = false;
function run() {
  login();
  repositionFrame();
  runAutorefresh();
}
function checkReady() {
  if (document) { run(); }
  else { setTimeout(checkReady, 500); }
}
(function () { checkReady(); })();