Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <html lang="en">
- <head>
- <!-- Meta Info
- �������������������������������������������������� -->
- <meta charset="utf-8">
- <title>DupliMark: Webinar</title>
- <meta name="description" content="Duplimark makes marketing Simple & Easy utilizing our main business strategy: Learn, Grow, Manage. Let us guide your business through this process from start to finish with our revolutionary tools, trianing, and strategies.">
- <meta name="author" content="Duplimark Corporation">
- <meta name="keywords" content="marketing simple easy duplimark business strategies grow learn manage market">
- <meta name="viewport" content="width=device-width, initial-scale=1">
- <!-- Scripts
- �������������������������������������������������� -->
- <script src="/socket.io/socket.io.js"></script>
- <script type="text/javascript" src="/easyrtc/easyrtc.js"></script>
- <script type="text/javascript" src="jquery.min.js"></script>
- <script type="text/javascript" src="PushAPI.js"></script>
- <script type="text/javascript" src="keys.js"></script>
- <script type="text/javascript" src="ertc.js"></script>
- <script src="https://cdn.WebRTC-Experiment.com/getScreenId.js"></script>
- <script>
- function keyPress(e) {
- // if user pressed [Enter]
- if (e.keyCode === 13) {
- e.preventDefault();
- sendMessage();
- }
- }
- </script>
- <script>
- function openTab(evt, tabName) {
- var i, tabcontent, tablinks;
- tabcontent = document.getElementsByClassName("tabcontent");
- for (i = 0; i < tabcontent.length; i++) {
- tabcontent[i].style.display = "none";
- }
- tablinks = document.getElementsByClassName("tablinks");
- for (i = 0; i < tablinks.length; i++) {
- tablinks[i].className = tablinks[i].className.replace(" active", "");
- }
- document.getElementById(tabName).style.display = "block";
- evt.currentTarget.className += " active";
- }
- </script>
- <!-- Style Needs
- �������������������������������������������������� -->
- <link href="https://fonts.googleapis.com/css?family=Raleway:400,300,600" rel="stylesheet" type="text/css">
- <link href="https://fonts.googleapis.com/css?family=Arimo" rel="stylesheet">
- <link href="https://use.fontawesome.com/releases/v5.0.6/css/all.css" rel="stylesheet">
- <link rel="stylesheet" href="https://duplimark.com/Content/normalize.css">
- <link rel="stylesheet" href="https://duplimark.com/Content/UI/skeleton.css">
- <link rel="stylesheet" href="https://duplimark.com/Content/UI/dashboard.css">
- <link rel="stylesheet" href="https://duplimark.com/Content/UI/VIPThemes/vipdefaultlight.css" id="style">
- <style>/* Temp Copy from VIPTheme stylesheet */#logo { background: url('https://duplimark.com/Images/UI/Front/Duplimark.png') no-repeat;background-size: auto 100%; }.back { background: #e9eaee url('https://duplimark.com/Images/UI/VIPThemes/smoke2.png') no-repeat top left; }</style>
- <style>
- /* Basic Page Needs */
- video {
- border: 1px solid black;
- background: black;
- width: 100%;
- }
- #users {
- display: block;
- }
- .point {
- margin: 0;
- display: inline;
- position: relative;
- }
- .above {
- position: absolute;
- width: 12em;
- left: 1vw;
- }
- #input {
- width: 100%;
- }
- #inputWrapper {
- padding: 10%;
- padding-top: 1%;
- transform: translateY(-10%);
- }
- #msgbox div {
- display: inline-block;
- }
- <style>
- /* Style the tab */
- .tab {
- padding-top: 3px;
- }
- /* Style the buttons inside tab */
- .tablinks {
- background: linear-gradient(#eae9e9 10%, white 80%, lightgray);
- padding: 10px 15px;
- margin-right: 5px;
- line-height: 37px;
- border-top-left-radius: 3px;
- border-top-right-radius: 3px;
- cursor: pointer;
- transition: 0.3s;
- }
- /* Change background color of buttons on hover */
- .tablinks:hover {
- background-color: #ddd;
- }
- /* Style the tab content */
- .tabcontent {
- display: none;
- padding: 6px 12px;
- border: 1px solid #ccc;
- border-top: none;
- height: 494px;
- overflow: auto;
- background: white;
- }
- </style>
- <style>
- /* Initial UI styles */
- h2 {
- font-size: 3rem
- }
- .row {
- max-width: 1400px
- }
- .back {
- position: relative;
- padding: 5%;
- }
- #overlay {
- position: absolute;
- top: 0px;
- z-index: 100;
- color: #fff;
- cursor: pointer;
- display: none;
- width: 100%;
- height: 100%;
- }
- .bigbutton {
- background: green;
- background: -webkit-linear-gradient(lightgreen, green);
- background: linear-gradient(lightgreen, green);
- box-shadow: 1px 1px 20px black;
- color: white;
- text-shadow: -1px -1px 1px grey;
- padding: 7px 20px 7px 20px;
- text-decoration: none;
- border-radius: 5px
- }
- #roomVideo {
- width: 100%;
- }
- @media (max-width: 550px) {
- #list {
- height: auto
- }
- }
- @media (max-width: 750px) {
- .videos {
- background: none;
- margin-bottom: 20px
- }
- }
- @media (min-width: 750px) {
- .videos, #list {
- box-shadow: 0px 0px 10px #000000;
- height: 600px
- }
- }
- </style>
- <!-- Favicon
- �������������������������������������������������� -->
- <link rel="icon" type="image/png" href="https://duplimark.com/Images/UI/Front/Duplimark_favicon.png">
- </head>
- <!-- Body
- �������������������������������������������������� -->
- <body onload="openTab(event, 'info'); start_tasks();">
- <div class="container u-full-width" id="navbar">
- <div id="logo"> </div>
- </div>
- <div class="container u-full-width back" style="">
- <h2 class="color" style="margin-bottom:5px;">Live Webinar Event</h2>
- <h4 class="color">Hosted by <span id="author">[Name]</span></h4>
- <div class="row">
- <div class="two-thirds column videos">
- <div id="roomVideo">
- <video id="stream" width="600" height="480"></video>
- <iframe id="screen" width="1200" height="960" style="display:none" src="about:blank"></iframe>
- <br><br>
- <div id="inputWrapper">
- <textarea id="input" onkeypress="keyPress(event)" style="width:600px" placeholder="Truncates messages longer than 500 characters"></textarea>
- </div>
- </div>
- <div class="point" id="joinRoomH" style="display:none"><p>Note: once you join the room, your camera will become active</p></div>
- <div class="point" id="installPlugin" style="display:none">
- <p>In order to share your screen, install <a href="https://chrome.google.com/webstore/detail/screen-capturing/ajhifddimkapgcifgcodmmfdlknahffk" target="_blank">this</a></p>
- </div>
- <div class="point" id="joinRoom"><button class="above" onclick="init_connection();">Join</button></div>
- <div class="point" id="loadmsg"><small class="above" style="margin-top:15px">Loading...</small></div>
- <div id="overlay">
- <h5><span class="bigbutton">Special Offer</span></h5>
- </div>
- </div>
- <div class="one-third column list" id="list">
- <div id="tabBox" style="display: none;">
- <div class="tab">
- <span class="tablinks" onclick="openTab(event, 'msgbox')">Chat</span>
- <span class="tablinks" onclick="openTab(event, 'users')">Users</span>
- <span class="tablinks" onclick="openTab(event, 'info')">Information</span>
- </div>
- <div id="msgbox" class="tabcontent" style="display:none"></div>
- <div id="users" class="tabcontent" style="display:none"><ul></ul></div>
- <div id="info" class="tabcontent" style="display:none">
- <div id="infoTitle"></div><br />
- <div id="infoHost"></div><br />
- <br />
- <button class="point" id="shareScreen" onclick="share_screen();" style="display:none">Share Screen</button><br />
- <button class="point" id="expireRoom" onclick="expire_room();" style="display:none">End Webinar</button><br />
- </div>
- </div>
- </div>
- </div><!-- -End Row -->
- </div><!-- End Back -->
- <footer id="foot">
- © 2018 <a href="/">DupliMark.com</a>
- </footer>
- </body>
- </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement