RSJ-Next Generation Label Printing System - makes workflow easier

Reusable Sidebar

You don't have to reinvent the wheel to integrate LPSNG with your application: Our reusable sidebar technology allows for extremly simple integration in other applications (web or native).

It also allows future improvements of the sidebar with additional functionalities without changes to your application.

Proven Technology

We used this very technology for our integration Add-Ins for Google Sheets, Microsoft Excel 365 and Microsoft Office 2013.

How it works

Include one of our JavaScript files in your HTML header
Define a div in your web page, where our sidebar should live.
Register your application with LPSNG (requires a Pro subscription).
Call our entry point during page initialization
Provide some callback functions

Modifications to your HTML

<html>
 <head>
  .....
  <script src="https://lpsng.rsj.de/sidebar/sidebar.js"></script>
 </head>
 <body>
 ......
  <div id="sidebarContents"></div>
 </body>
<html>

The JavaScript is available in source form to give you an idea of customization possibilities.

Requirements

The reusable sidebar is based on IFRAMEs.

If you actually include our sidebar from a sandboxed IFRAME the following rights are required:

allow-same-origin
allow-forms
allow-scripts
allow-popups
allow-popups-to-escape-sandbox

Register your application

Goto Manage Applications
Add your application
Set the Redirect URL to /loginComplete.html
Note the clientid and clientsecret

JavaScript Code

function getData(completion, options) {

   var data= [
       { barcode:"4012345123456", productName:"Coca Cola", price: "1.42", 
           labelCount: 10},
       { barcode:"4191709413901", productName:"dotnetpro", price: "14.90", 
           labelCount: 5}
       ];

   var job= {
       title:"Test Job",
       name: "Test Job",
       description: "Job description",
       data: JSON.stringify(data)
       };

   completion(job);
   };

function DoPrint(completion, options) {
   getData(completion, options);
   };

var conf= {
   div: "sidebarContents",        // div id on page
   clientId: "..........",        // client_id from "Manage Applications"
   clientSecret: "............",  // client_secret 
   getData: getData
   };

window.LpsngEmbedded(conf);

Mandatory Configuration Parameters

| Parameter | Description | | --- | --- | | div | div id for sidebar | | clientId | clientid (from application management) | | clientSecret | clientsecret (from application management) | | getData | Function as job data source |

Additional Customizations

The data structure given to window.LpngEmbdded can include additional (optional)parameters:

| Parameter | Description | | --- | --- | | debug | Display current status in sidebar. Display cross frame communication in debug log. | | loginPartner | Name of pre-selected login partner | | accessToken | Access Token | | user | User ID (GUID) | | design | Selected Design (GUID) | | loadState | Function to restore (user specific) state | | storeState | Function to save (user specific) state | | extensions | Define additional user interface components | | extensions.buttonTitle | Title ahead of custom buttons | | extensions.buttons | Definition of custom buttons | | extensions.optionTitle | Title ahead of custom options | | extensions.options | Definition of custom options | | urlBase | Use different LPSNG website. For RSJ internal testing | | handler | Inter frame message hander. Only used in special cases (eg Google Apps Script integration). |

Sample Page

We have implemented a test page with this technology. This page shows a lot of debugging information which allows you to see what is actually going on.

You can find the test page here.

Use Cases

Features
- Barcode Formats
- Enterprise Features
Interfaces
ESL
Deployment
Presentation Slides

Contact

Or contact us directly:

RSJ Software GmbH
Holzstrasse 4
82120 Germering
Germany

Phone: +49 89 89 41 42-0
Fax: +49 89 89 41 42-80
E-Mail: info@rsj.de