<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml" class="manywho" style="height: 100%;">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">

<link rel="shortcut icon" href="https://assets.manywho.com/img/favicon/favicon.ico" type="image/x-icon" />
<link rel="apple-touch-icon" href="https://assets.manywho.com/img/favicon/apple-touch-icon.png" />
<link rel="apple-touch-icon" sizes="57x57" href="https://assets.manywho.com/img/favicon/apple-touch-icon-57x57.png" />
<link rel="apple-touch-icon" sizes="72x72" href="https://assets.manywho.com/img/favicon/apple-touch-icon-72x72.png" />
<link rel="apple-touch-icon" sizes="76x76" href="https://assets.manywho.com/img/favicon/apple-touch-icon-76x76.png" />
<link rel="apple-touch-icon" sizes="114x114" href="https://assets.manywho.com/img/favicon/apple-touch-icon-114x114.png" />
<link rel="apple-touch-icon" sizes="120x120" href="https://assets.manywho.com/img/favicon/apple-touch-icon-120x120.png" />
<link rel="apple-touch-icon" sizes="144x144" href="https://assets.manywho.com/img/favicon/apple-touch-icon-144x144.png" />
<link rel="apple-touch-icon" sizes="152x152" href="https://assets.manywho.com/img/favicon/apple-touch-icon-152x152.png" />
<link rel="apple-touch-icon" sizes="180x180" href="https://assets.manywho.com/img/favicon/apple-touch-icon-180x180.png" />
<link rel="icon" sizes="192x192" href="https://assets.manywho.com/img/favicon/android-icon.png">
<meta name="msapplication-square310x310logo" content="https://assets.manywho.com/img/favicon/microsoft-310x310.png">

<title>Boomi Flow</title>
<style>
/******** Custom Navigation Dropdown *****************/
.navbar-dropdown {
margin: 0;
padding-left: 0;
}
.mw-bs .navbar-dropdown li {
color: #fff;
display: block;
position: relative;
text-decoration: none;
transition-duration: 0.5s;
}
.mw-bs .navbar-dropdown li:hover,
.navbar-dropdown li:focus-within {
cursor: pointer;
}
.mw-bs .navbar-dropdown li:focus-within a {
outline: none;
}
.mw-bs ul li .navbar-dropdown {
background: #e4e4e4;
visibility: hidden;
opacity: 0;
min-width: 15em;
position: absolute;
left: 0;
display: none;
border: 1px solid #d5d5d5;
}
.mw-bs ul li .navbar-dropdown li {
border-top: 1px solid #d5d5d5
}
.mw-bs ul li .navbar-dropdown li a {
color: #777777;
text-decoration: none;
padding: 10px;
display: block;
}
.mw-bs ul li .navbar-dropdown li a:hover,
.mw-bs ul li .navbar-dropdown li a:focus {
text-decoration: none;
color: #3399f3;
}
.mw-bs ul li .navbar-dropdown li:first-child {
border-top: initial
}
.mw-bs ul li:hover>ul,
ul li:focus-within>ul,
ul li .navbar-dropdown:hover,
ul li .navbar-dropdown:focus {
visibility: visible;
opacity: 1;
display: block;
}
.mw-bs .navbar-nav {
grid-row: 1;
}
.mw-bs .navbar-nav ul {
grid-row: 2;
}
.mw-bs .navbar-default .navbar-nav>li>a {
-ms-grid-row: 1;
grid-row: 1;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-ms-grid-row-align: center;
align-self: center;
display: inline-block;
-ms-grid-column: 1;
grid-column: 1
}
@media (min-width: 768px) {
.mw-bs .dropdown-indicator {
font-size: 9px;
display: inline-block;
-ms-grid-row: 1;
grid-row: 1;
text-align: right;
-ms-grid-row-align: center;
align-self: center;
padding-right: 10px;
padding-left: 4px;
-ms-grid-column: 1;
grid-column: 1;
}
.mw-bs .dropdown-indicator:after {
content: "\e252";
font-family: 'Glyphicons Halflings';
display: inline-block;
vertical-align: middle;
-webkit-transition: 0.5s;
-o-transition: 0.5s;
transition: 0.5s;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-ms-flex-item-align: center;
-ms-grid-row-align: center;
align-self: center;
}
.mw-bs .top-nav-element:hover .dropdown-indicator:after,
.mw-bs .top-nav-element:active .dropdown-indicator:after,
.mw-bs .top-nav-element:focus .dropdown-indicator:after {
-webkit-transform: rotate(180deg);
-ms-transform: rotate(180deg);
transform: rotate(180deg);
}
}
/* Mobile View */
@media (max-width: 768px) {
.mw-bs ul li .navbar-dropdown {
display: block;
visibility: initial;
opacity: 1;
position: relative;
padding-left: 20px;
}
}
/******** Custom Navigation dropdown *****************/
.mw-bs .wait-container {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
min-height: 500px;
z-index: 1100;
background-color: rgba(255, 255, 255, 0.5);
}

.mw-bs .wait-message {
position: relative;
text-align: center;
margin-top: 1em;
display: block;
top: 40%;
font-size: 2em;
padding: 0 2em;
}

/* outer */
.mw-bs .wait-spinner {
display: block;
position: relative;
left: 50%;
width: 150px;
height: 150px;
margin: 200px 0 0 -75px;
border-radius: 50%;
border: 3px solid transparent;
border-top-color: #268AAF;
-webkit-animation: spin 2s linear infinite; /* Chrome, Opera 15+, Safari 5+ */
animation: spin 2s linear infinite; /* Chrome, Firefox 16+, IE 10+, Opera */
}

/* middle */
.mw-bs .wait-spinner:before {
content: "";
position: absolute;
top: 5px;
left: 5px;
right: 5px;
bottom: 5px;
border-radius: 50%;
border: 3px solid transparent;
border-top-color: #31B2E2;
-webkit-animation: spin 3s linear infinite; /* Chrome, Opera 15+, Safari 5+ */
animation: spin 3s linear infinite; /* Chrome, Firefox 16+, IE 10+, Opera */
}

/* inner */
.mw-bs .wait-spinner:after {
content: "";
position: absolute;
top: 15px;
left: 15px;
right: 15px;
bottom: 15px;
border-radius: 50%;
border: 3px solid transparent;
border-top-color: #154E62;
-webkit-animation: spin 1.5s linear infinite; /* Chrome, Opera 15+, Safari 5+ */
animation: spin 1.5s linear infinite; /* Chrome, Firefox 16+, IE 10+, Opera */
}

@-webkit-keyframes spin {
0% {
-webkit-transform: rotate(0deg); /* Chrome, Opera 15+, Safari 3.1+ */
-ms-transform: rotate(0deg); /* IE 9 */
transform: rotate(0deg); /* Firefox 16+, IE 10+, Opera */
}
100% {
-webkit-transform: rotate(360deg); /* Chrome, Opera 15+, Safari 3.1+ */
-ms-transform: rotate(360deg); /* IE 9 */
transform: rotate(360deg); /* Firefox 16+, IE 10+, Opera */
}
}
@keyframes spin {
0% {
-webkit-transform: rotate(0deg); /* Chrome, Opera 15+, Safari 3.1+ */
-ms-transform: rotate(0deg); /* IE 9 */
transform: rotate(0deg); /* Firefox 16+, IE 10+, Opera */
}
100% {
-webkit-transform: rotate(360deg); /* Chrome, Opera 15+, Safari 3.1+ */
-ms-transform: rotate(360deg); /* IE 9 */
transform: rotate(360deg); /* Firefox 16+, IE 10+, Opera */
}
}
</style>
</head>
<body style="height: 100%;">
<div id="manywho">
<div id="loader" class="mw-bs" style="width: 100%; height: 100%;">
<div class="wait-container">
<div class="wait-spinner"></div>
</div>
</div>
</div>

<script src="https://assets.manywho.com/js/vendor/jquery-2.1.4.min.js"></script>

<script>
var manywho = {
cdnUrl: 'https://assets.manywho.com',
requires: ['core', 'bootstrap3'],
initialize: function () {

var queryParameters = manywho.utils.parseQueryString(window.location.search.substring(1));

manywho.settings.initialize({
platform: {
uri: '',
},
adminTenantId: 'da497693-4d02-45db-bc08-8ea16d2ccbdf',
playerUrl: [ location.protocol, '//', location.host, location.pathname ].join(''),
joinUrl: [ location.protocol, '//', location.host, location.pathname ].join('')
});

var options = {
authentication: {
sessionId: queryParameters['session-token'],
sessionUrl: queryParameters['session-url']
},
navigationElementId: queryParameters['navigation-element-id'],
mode: queryParameters['mode'],
reportingMode: queryParameters['reporting-mode'],
replaceUrl: true,
collaboration: {
isEnabled: false
},
inputs: null,
annotations: null,
navigation: {
isFixed: true,
isWizard: false,
components:
[
/* Simple Navigation element */
React.createElement("li", null, React.createElement("a", { href: "https://example.com", target: "_blank" }, "My Custom Nav Item")),
/* Dropdown Navigation element */
React.createElement("li", { class: "top-nav-element" },
React.createElement("a", { href: "#" }, "My Custom Dropdown Nav Item",
React.createElement("span", { class: "dropdown-indicator" })),
React.createElement("ul", { class: "navbar-dropdown" },
React.createElement("li", { class: " " },
React.createElement("a", { href: "https://example.com", target: "_blank" }, "My Dropdown Link # 1")),
React.createElement("li", { class: " " },
React.createElement("a", { href: "https://example.com", target: "_blank" }, "My Dropdown Link # 2")) )),
/* Custom Icons with Navigation Elements */
React.createElement("li", null,
React.createElement("a", { href: "#" }, "My Account ",
React.createElement("span", { class: "glyphicon glyphicon-user" }))),
React.createElement("li", null,
React.createElement("a", { href: "#" }, "Boomiverse ",
React.createElement("span", { class: "glyphicon glyphicon-log-in" })))
]
},
callbacks: [],
theme: queryParameters['theme']
};

var tenantId = queryParameters['tenant-id'];
if (!tenantId) {
tenantId =
window.location.pathname
.split('/')
.filter(function (path) {
return path && path.length > 0;
})[0];
}

manywho.engine.initialize(
tenantId,
queryParameters['flow-id'],
queryParameters['flow-version-id'],
'main',
queryParameters['join'],
queryParameters['authorization'],
options,
queryParameters['initialization']
);

}
};
</script>

<script src="https://assets.manywho.com/js/loader.min.js"></script>
</body>
</html>