require login

Implementing Require Login

The require implementation uses JavaScript postMessage.

We will show a simple example here, and then refer you to our login demo sources.

Create an HTML with an embedded widget. Add the following code and run on Chrome to see an a console print when you click "play" on the widget.

function receiveMessage(event)
{
    console.log(["got a message",event]);
}
window.addEventListener("message", receiveMessage, false);

instead of the console.log line you should implement your login logic. For example, lets take a silly prompt to demonstrate this:

function receiveMessage(event)
{
    var username = prompt("Enter username please:");
}
window.addEventListener("message", receiveMessage, false);

Once you have a username, you need to post a message back to the widget with the user ID

The code to do this looks like

var myMessage = JSON.stringify(   {"name":"userlogin", 
                                   "userId" : "myUserId" });
document.getElementsByTagName("iframe")[0].contentWindow
    .postMessage(myMessage,"http://dev.cloudifysource.org")

Now, when the user clicks "play" again - the widget will start.

If you chose to use verification URL the widget will first fire a verification POST to your URL and assuming it returned 200, it will start.

Alternatively you can tell the widget start programtically by posting another message. Appending the following code will get the widget running right after the user logged in to your system.

var myMessage = JSON.stringify(   {"name":"playwidget"});
document.getElementsByTagName("iframe")[0].contentWindow
    .postMessage(myMessage,"http://dev.cloudifysource.org")