| 1 | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> |
| 2 | <html lang="en"> |
| 3 | <head> |
| 4 | <meta http-equiv="X-UA-Compatible" content="IE=edge" /> |
| 5 | <meta content="text/html; charset=utf-8" http-equiv="Content-Type" /> |
| 6 | <meta name="viewport" content="user-scalable=1.0,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0" /> |
| 7 | <meta name="apple-mobile-web-app-capable" content="yes" /> |
| 8 | <meta name="format-detection" content="telephone=no" /> |
| 9 | <meta name="robots" content="noindex,nofollow" /> |
| 10 | <link type="text/css" href="styles/style.css" media="screen" rel="stylesheet" title="CSS" /> |
| 11 | {{{customCSSTags}}} |
| 12 | <link rel="apple-touch-icon" href="/favicon-303x303.png" /> |
| 13 | <script type="text/javascript" src="scripts/common-0.0.1{{min}}.js"></script> |
| 14 | {{{customJSTags}}} |
| 15 | <title>Agent Installation</title> |
| 16 | <style> |
| 17 | .tab { |
| 18 | overflow: hidden; |
| 19 | border: 1px solid #ccc; |
| 20 | background-color: #f1f1f1; |
| 21 | } |
| 22 | |
| 23 | .tab button { |
| 24 | background-color: inherit; |
| 25 | float: left; |
| 26 | border: none; |
| 27 | outline: none; |
| 28 | cursor: pointer; |
| 29 | padding: 14px 16px; |
| 30 | transition: 0.3s; |
| 31 | } |
| 32 | |
| 33 | .tab button:hover { |
| 34 | background-color: #ddd; |
| 35 | } |
| 36 | |
| 37 | .tab button.active { |
| 38 | background-color: #8f8; |
| 39 | } |
| 40 | |
| 41 | .tabcontent { |
| 42 | display: none; |
| 43 | padding: 6px 12px; |
| 44 | border: 1px solid #ccc; |
| 45 | border-top: none; |
| 46 | } |
| 47 | |
| 48 | </style> |
| 49 | </head> |
| 50 | <body id="body" onload="if (typeof(startup) !== 'undefined') startup();" style="display:none;overflow:hidden"> |
| 51 | <div id="container"> |
| 52 | <!-- Begin Masthead --> |
| 53 | <div id="masthead" class=noselect style="background:url(logo.png) 0px 0px;background-color:#036;background-repeat:no-repeat;height:66px;width:100%;overflow:hidden;"> |
| 54 | <div style="float:left;text-shadow: 1px 1px 2px #000">{{{titlehtml}}}</div> |
| 55 | <div style="float:left; height: 66px; color:#c8c8c8; padding-left:14px; padding-top:7px"> |
| 56 | <strong><font style="font-size:46px; font-family: Arial, Helvetica, sans-serif;text-shadow: 1px 1px 2px #000">{{{title1}}}</font></strong> |
| 57 | </div> |
| 58 | <div style="float:left; height: 66px; color:#c8c8c8; padding-left:5px; padding-top:14px"> |
| 59 | <strong><font style="font-size:14px; font-family: Arial, Helvetica, sans-serif;text-shadow: 1px 1px 2px #000">{{{title2}}}</font></strong> |
| 60 | </div> |
| 61 | <p id="logoutControl" style="color:white;font-size:11px;margin: 10px 10px 0;">{{{logoutControl}}}</p> |
| 62 | </div> |
| 63 | <div id="page_leftbar"> |
| 64 | <div style="height:16px"></div> |
| 65 | </div> |
| 66 | <div id=topbar class="noselect style3" style="height:24px;position:relative"> |
| 67 | <div id=uiMenuButton title="User interface selection" onclick="showUserInterfaceSelectMenu()"> |
| 68 | ♦ |
| 69 | <div id=uiMenu style="display:none"> |
| 70 | <div id=uiViewButton1 class=uiSelector onclick=userInterfaceSelectMenu(1) title="Left bar interface"><div class="uiSelector1"></div></div> |
| 71 | <div id=uiViewButton2 class=uiSelector onclick=userInterfaceSelectMenu(2) title="Top bar interface"><div class="uiSelector2"></div></div> |
| 72 | <div id=uiViewButton3 class=uiSelector onclick=userInterfaceSelectMenu(3) title="Fixed width interface"><div class="uiSelector3"></div></div> |
| 73 | <div id=uiViewButton4 class=uiSelector onclick=toggleNightMode() title="Toggle night mode"><div class="uiSelector4"></div></div> |
| 74 | </div> |
| 75 | </div> |
| 76 | </div> |
| 77 | <div id="column_l" style="overflow-y:auto"> |
| 78 | <h1>Welcome</h1> |
| 79 | <p> |
| 80 | This is a portal for computer remote management and support. |
| 81 | </p> |
| 82 | <table style="text-align:center;margin-top:60px;width:100%"> |
| 83 | <tr> |
| 84 | <td style="width:33%"></td> |
| 85 | <td style="font-size:20px;background-color:#DDD;padding:12px;border-radius:16px"> |
| 86 | <div style="margin-bottom:10px">Invitation Code</div> |
| 87 | <form method=post> |
| 88 | <div><input id="inviteCode" name="inviteCode" style="font-size:26px;text-align:center;border-radius:6px" maxlength="20" /></div> |
| 89 | <div><input type="submit" style="margin-top:10px" value="Submit" /></div> |
| 90 | </form> |
| 91 | <div id="message" style="margin-top:8px;font-size:16px;display:none"></div> |
| 92 | </td> |
| 93 | <td style="width:33%"></td> |
| 94 | </tr> |
| 95 | </table> |
| 96 | </div> |
| 97 | <div id="footer"> |
| 98 | <table cellpadding="0" cellspacing="10" style="width: 100%"> |
| 99 | <tr> |
| 100 | <td style="text-align:left"></td> |
| 101 | <td style="text-align:right"></td> |
| 102 | </tr> |
| 103 | </table> |
| 104 | </div> |
| 105 | </div> |
| 106 | <script> |
| 107 | 'use strict'; |
| 108 | var random = '{{{randomlength}}}' // Random length string for BREACH mitigation |
| 109 | var urlargs = parseUriArgs(); |
| 110 | if (urlargs.key && (isAlphaNumeric(urlargs.key) == false)) { delete urlargs.key; } |
| 111 | var uiMode = parseInt(getstore('uiMode', 1)); |
| 112 | var webPageStackMenu = false; |
| 113 | var webPageFullScreen = true; |
| 114 | var nightMode = (getstore('_nightMode', '0') == '1'); |
| 115 | userInterfaceSelectMenu(); |
| 116 | Q('inviteCode').focus(); |
| 117 | start(); |
| 118 | document.onclick = function (e) { Q('inviteCode').focus(); } |
| 119 | |
| 120 | function start() { |
| 121 | if (urlargs.c != null) { Q('inviteCode').value = urlargs.c; } |
| 122 | |
| 123 | // Setup page visuals |
| 124 | var hide = 0; |
| 125 | var globalHide = parseInt('{{{hide}}}'); |
| 126 | if (globalHide || urlargs.hide) { |
| 127 | if (urlargs.hide) { hide = parseInt(urlargs.hide); } |
| 128 | if (globalHide) { hide = (hide | globalHide); } |
| 129 | } |
| 130 | urlargs.hide = hide; |
| 131 | QV('masthead', !(hide & 1)); |
| 132 | QV('topbar', !(hide & 2)); |
| 133 | QV('footer', !(hide & 4)); |
| 134 | if ((hide & 4) != 0) { QC('body').add('nofooter'); } else { QC('body').remove('nofooter'); } |
| 135 | if (hide != 0) { |
| 136 | // Fix the main grid to zero-height elements we want to hide. |
| 137 | QS('container')['grid-template-rows'] = ((hide & 1) ? '0' : '66') + 'px fit-content(48px) auto ' + ((hide & 4) ? '0' : '45') + 'px'; |
| 138 | QS('container')['-ms-grid-rows'] = ((hide & 1) ? '0' : '66') + 'px fit-content(48px) auto ' + ((hide & 4) ? '0' : '45') + 'px'; |
| 139 | } |
| 140 | |
| 141 | var messageid = parseInt('{{{messageid}}}'); |
| 142 | var okmessages = ['']; |
| 143 | var failmessages = ["Invalid invitation code."]; |
| 144 | if (messageid > 0) { |
| 145 | var msg = ''; |
| 146 | if ((messageid < 100) && (messageid < okmessages.length)) { msg = okmessages[messageid]; } |
| 147 | else if ((messageid >= 100) && ((messageid - 100) < failmessages.length)) { msg = failmessages[messageid - 100]; } |
| 148 | if (msg != '') { |
| 149 | if (messageid >= 100) { msg = ('<span class="msg error"><b style=color:#8C001A>' + msg + '<b></span>'); } else { msg = ('<span class="msg success"><b>' + msg + '</b></span>'); } |
| 150 | QH('message', msg); |
| 151 | QV('message', true); |
| 152 | } |
| 153 | } |
| 154 | } |
| 155 | |
| 156 | // Toggle user interface menu |
| 157 | function showUserInterfaceSelectMenu() { |
| 158 | Q('uiViewButton1').classList.remove('uiSelectorSel'); |
| 159 | Q('uiViewButton2').classList.remove('uiSelectorSel'); |
| 160 | Q('uiViewButton3').classList.remove('uiSelectorSel'); |
| 161 | Q('uiViewButton4').classList.remove('uiSelectorSel'); |
| 162 | try { Q('uiViewButton' + uiMode).classList.add('uiSelectorSel'); } catch (ex) { } |
| 163 | QV('uiMenu', (QS('uiMenu').display == 'none')); |
| 164 | if (nightMode) { Q('uiViewButton4').classList.add('uiSelectorSel'); } |
| 165 | } |
| 166 | |
| 167 | function userInterfaceSelectMenu(s) { |
| 168 | if (s) { uiMode = s; putstore('uiMode', uiMode); } |
| 169 | webPageFullScreen = (uiMode < 3); |
| 170 | webPageStackMenu = true;//(uiMode > 1); |
| 171 | toggleFullScreen(0); |
| 172 | toggleStackMenu(0); |
| 173 | QC('column_l').add('room4submenu'); |
| 174 | } |
| 175 | |
| 176 | function toggleNightMode() { |
| 177 | nightMode = !nightMode; |
| 178 | if (nightMode) { QC('body').add('night'); } else { QC('body').remove('night'); } |
| 179 | putstore('_nightMode', nightMode ? '1' : '0'); |
| 180 | } |
| 181 | |
| 182 | // Toggle the web page to full screen |
| 183 | function toggleFullScreen(toggle) { |
| 184 | if (toggle === 1) { webPageFullScreen = !webPageFullScreen; putstore('webPageFullScreen', webPageFullScreen); } |
| 185 | var hide = 0; |
| 186 | //if (args.hide) { hide = parseInt(args.hide); } |
| 187 | if (webPageFullScreen == false) { |
| 188 | QC('body').remove('menu_stack'); |
| 189 | QC('body').remove('fullscreen'); |
| 190 | QC('body').remove('arg_hide'); |
| 191 | //if (xxcurrentView >= 10) QC('column_l').add('room4submenu'); |
| 192 | //QV('UserDummyMenuSpan', false); |
| 193 | //QV('page_leftbar', false); |
| 194 | } else { |
| 195 | QC('body').add('fullscreen'); |
| 196 | if (hide & 16) QC('body').add('arg_hide'); // This is replacement for QV('page_leftbar', !(hide & 16)); |
| 197 | //QV('UserDummyMenuSpan', (xxcurrentView < 10) && webPageFullScreen); |
| 198 | //QV('page_leftbar', true); |
| 199 | } |
| 200 | QV('body', true); |
| 201 | } |
| 202 | |
| 203 | // If FullScreen, toggle menu to be horisontal or vertical |
| 204 | function toggleStackMenu(toggle) { |
| 205 | if (webPageFullScreen == true) { |
| 206 | if (toggle === 1) { |
| 207 | webPageStackMenu = !webPageStackMenu; |
| 208 | putstore('webPageStackMenu', webPageStackMenu); |
| 209 | } |
| 210 | if (webPageStackMenu == false) { |
| 211 | QC('body').remove('menu_stack'); |
| 212 | } else { |
| 213 | QC('body').add('menu_stack'); |
| 214 | //if (xxcurrentView >= 10) QC('column_l').remove('room4submenu'); |
| 215 | } |
| 216 | } |
| 217 | } |
| 218 | |
| 219 | function putstore(name, val) { try { if (typeof (localStorage) === 'undefined') return; localStorage.setItem(name, val); } catch (e) { } } |
| 220 | function getstore(name, val) { try { if (typeof (localStorage) === 'undefined') return val; var v = localStorage.getItem(name); if ((v == null) || (v == null)) return val; return v; } catch (e) { return val; } } |
| 221 | function format(format) { var args = Array.prototype.slice.call(arguments, 1); return format.replace(/{(\d+)}/g, function (match, number) { return typeof args[number] != 'undefined' ? args[number] : match; }); }; |
| 222 | </script> |
| 223 | </body> |
| 224 | </html> |