There are 4 steps to create this landing page. Using JavaScript first strip off the invitation information from the current page. Next check the user agent to determine if the page is running in a mobile browser. If so then redirect to the page containing the mobile widget otherwise redirect to the page for the desktop browser widget. In both cases append the invitation link information. The last step is to edit the joinCollaborationUri attribute in the existing pages for both the mobile and desktop cobrowse to point to this new landing page.
Here is a sample of the HTML/Javascript code for a basic cobrowse landing page:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>CEA Cobrowse Widget</title>
<script type="text/javascript">
var CEA_COLLAB_PREFIX = "cea_collab=";
var href = document.location.href;
var cobrowseString = "";
if ( -1 < href.indexOf(CEA_COLLAB_PREFIX)){
index = href.lastIndexOf(CEA_COLLAB_PREFIX);
collabID = href.slice(index + CEA_COLLAB_PREFIX.length);
cobrowseString = "?" + CEA_COLLAB_PREFIX + collabID;
}
if((navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i)) || (navigator.userAgent.match(/Android/i))) {
window.location = "/cea/cobrowse_mobile.html" + cobrowseString;
} else {
window.location = "/cea/cobrowse_desktop.html" + cobrowseString;
}
</script>
</head>
</html>
