2020-04-24 19:38:21 +02:00
|
|
|
<!DOCTYPE html>
|
|
|
|
|
<html lang="en">
|
|
|
|
|
<head>
|
2020-12-06 19:43:17 +01:00
|
|
|
<title>Galène</title>
|
2021-03-30 07:27:07 +02:00
|
|
|
<meta charset="utf-8">
|
2020-09-11 10:39:32 +02:00
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
|
|
|
<meta http-equiv="ScreenOrientation" content="autoRotate:disabled">
|
2020-04-24 19:38:21 +02:00
|
|
|
<link rel="stylesheet" type="text/css" href="/common.css"/>
|
2020-12-06 19:43:17 +01:00
|
|
|
<link rel="stylesheet" type="text/css" href="/galene.css"/>
|
2020-04-24 19:38:21 +02:00
|
|
|
<link rel="author" href="https://www.irif.fr/~jch/"/>
|
2024-11-16 18:12:15 +01:00
|
|
|
<link rel="stylesheet" type="text/css" href="/third-party/fontawesome/css/fontawesome.min.css"/>
|
|
|
|
|
<link rel="stylesheet" type="text/css" href="/third-party/fontawesome/css/solid.min.css"/>
|
|
|
|
|
<link rel="stylesheet" type="text/css" href="/third-party/fontawesome/css/regular.min.css"/>
|
|
|
|
|
<link rel="stylesheet" type="text/css" href="/third-party/toastify/toastify.css"/>
|
|
|
|
|
<link rel="stylesheet" type="text/css" href="/third-party/contextual/contextual.css"/>
|
2024-12-14 13:19:39 +01:00
|
|
|
<script src="/key.js" ></script>
|
2020-04-24 19:38:21 +02:00
|
|
|
</head>
|
|
|
|
|
|
|
|
|
|
<body>
|
2024-12-14 13:19:39 +01:00
|
|
|
<div id="srSpeak" class="sr-only" aria-live="assertive" aria-atomic="true"></div>
|
|
|
|
|
<main id="main" class="app">
|
2020-08-27 21:17:46 +02:00
|
|
|
<div class="row full-height">
|
2024-12-14 13:19:39 +01:00
|
|
|
<nav id="left-sidebar" class="active">
|
2020-08-27 21:17:46 +02:00
|
|
|
<div class="users-header">
|
2020-12-06 19:43:17 +01:00
|
|
|
<div class="galene-header">Galène</div>
|
2020-08-27 21:17:46 +02:00
|
|
|
</div>
|
2024-12-14 13:19:39 +01:00
|
|
|
<h2 class="screenreader">User list</h2>
|
|
|
|
|
<div rollr="region" class="header-sep"></div>
|
2020-08-27 21:17:46 +02:00
|
|
|
<div id="users"></div>
|
|
|
|
|
</nav>
|
|
|
|
|
<div class="container">
|
|
|
|
|
<header>
|
|
|
|
|
<nav class="topnav navbar navbar-expand navbar-light fixed-top">
|
|
|
|
|
<div id="header">
|
2024-12-14 13:19:39 +01:00
|
|
|
<button class="collapse" title="Collapse left panel" id="sidebarCollapse" aria-label="Collapse left panel">
|
2022-02-19 03:50:30 +01:00
|
|
|
<i class="fas fa-align-left" aria-hidden="true"></i>
|
2024-12-14 13:19:39 +01:00
|
|
|
</button>
|
2021-01-25 13:06:09 +01:00
|
|
|
<h1 id="title" class="header-title">Galène</h1>
|
2020-08-27 21:17:46 +02:00
|
|
|
</div>
|
2020-09-03 17:01:21 +02:00
|
|
|
|
2020-08-27 21:17:46 +02:00
|
|
|
<ul class="nav-menu">
|
2020-09-02 15:35:55 +02:00
|
|
|
<li>
|
2024-12-14 13:19:39 +01:00
|
|
|
<button id="presentbutton" class="invisible btn btn-success" aria-label=" Enable">
|
2021-07-29 14:46:02 +02:00
|
|
|
<i class="fas fa-play" aria-hidden="true"></i><span class="nav-text"> Enable</span>
|
2020-09-02 15:35:55 +02:00
|
|
|
</button>
|
|
|
|
|
</li>
|
|
|
|
|
<li>
|
2024-12-14 13:19:39 +01:00
|
|
|
<button id="unpresentbutton" class="invisible btn btn-cancel" aria-label=" Disable">
|
2021-07-29 14:46:02 +02:00
|
|
|
<i class="fas fa-stop" aria-hidden="true"></i><span class="nav-text"> Disable</span>
|
2020-09-02 15:35:55 +02:00
|
|
|
</button>
|
|
|
|
|
</li>
|
|
|
|
|
<li>
|
2024-12-14 13:19:39 +01:00
|
|
|
<button id="mutebutton" class="nav-link nav-button" aria-label="Mute">
|
2020-11-09 15:57:30 +01:00
|
|
|
<span><i class="fas fa-microphone-slash" aria-hidden="true"></i></span>
|
2020-09-02 15:35:55 +02:00
|
|
|
<label>Mute</label>
|
2024-12-14 13:19:39 +01:00
|
|
|
</button>
|
2020-09-02 15:35:55 +02:00
|
|
|
</li>
|
|
|
|
|
<li>
|
2024-12-14 13:19:39 +01:00
|
|
|
<button id="sharebutton" class="invisible nav-link nav-button" aria-label="Share Screen">
|
2020-11-09 15:57:30 +01:00
|
|
|
<span><i class="fas fa-share-square" aria-hidden="true"></i></span>
|
2020-09-02 15:35:55 +02:00
|
|
|
<label>Share Screen</label>
|
2024-12-14 13:19:39 +01:00
|
|
|
</button>
|
2020-09-02 15:35:55 +02:00
|
|
|
</li>
|
|
|
|
|
<li>
|
2024-12-14 13:19:39 +01:00
|
|
|
<button class="nav-button nav-link nav-more" id="openside" title="Open settings" aria-label="Open settings">
|
2020-11-27 11:21:48 +01:00
|
|
|
<span><i class="fas fa-ellipsis-v" aria-hidden="true"></i></span>
|
2024-12-14 13:19:39 +01:00
|
|
|
</button>
|
2020-08-27 21:17:46 +02:00
|
|
|
</li>
|
|
|
|
|
</ul>
|
|
|
|
|
</nav>
|
|
|
|
|
</header>
|
2024-12-14 13:19:39 +01:00
|
|
|
<div class="row full-width video-on" id="mainrow">
|
|
|
|
|
<div class="coln-left invisible" id="left" >
|
|
|
|
|
<div role="region" id="chat">
|
|
|
|
|
<h2 class="screenreader">Chat box</h2>
|
2020-08-27 21:17:46 +02:00
|
|
|
<div id="chatbox">
|
2024-12-14 13:19:39 +01:00
|
|
|
<button class="close-chat" id="close-chat" title="Hide chat" aria-label="Hide chat">
|
2020-10-07 09:33:38 +02:00
|
|
|
<span class="close-icon"></span>
|
2024-12-14 13:19:39 +01:00
|
|
|
</button>
|
|
|
|
|
<div id="box" tabindex="0" aria-label="Chat Area"></div>
|
2020-08-27 21:17:46 +02:00
|
|
|
<div class="reply">
|
|
|
|
|
<form id="inputform">
|
2024-12-14 13:19:39 +01:00
|
|
|
<textarea id="input" class="form-reply" aria-label="Enter message"></textarea>
|
|
|
|
|
<input id="inputbutton" type="submit" value="➤" class="btn btn-default" aria-label="Send message"/>
|
2020-08-27 21:17:46 +02:00
|
|
|
</form>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
2020-09-02 15:35:55 +02:00
|
|
|
<div id="resizer"></div>
|
2020-09-03 17:01:21 +02:00
|
|
|
<div class="coln-right" id="right">
|
2024-12-14 13:19:39 +01:00
|
|
|
<button class="show-video blink invisible" id="show-video" aria-label="Show video">
|
2021-03-26 11:08:21 +01:00
|
|
|
<i class="fas fa-exchange-alt" aria-hidden="true"></i>
|
2024-12-14 13:19:39 +01:00
|
|
|
</button>
|
|
|
|
|
<button class="chat-btn show-chat" id="show-chat" aria-label="Show chat">
|
2021-03-26 20:18:20 +01:00
|
|
|
<i class="far fa-comment-alt icon-chat" title="Show chat"></i>
|
2024-12-14 13:19:39 +01:00
|
|
|
</button>
|
|
|
|
|
<button class="chat-btn collapse-video invisible" id="collapse-video" aria-label="Hide video and show chat">
|
2021-03-26 20:18:20 +01:00
|
|
|
<i class="far fa-comment-alt icon-chat" title="Hide video and show chat"></i>
|
2024-12-14 13:19:39 +01:00
|
|
|
</button>
|
|
|
|
|
<div class="video-container invisible" id="video-container"><h2 class="screenreader">Video area</h2>
|
2020-10-05 11:15:31 +02:00
|
|
|
<div id="expand-video" class="expand-video">
|
|
|
|
|
<div id="peers"></div>
|
|
|
|
|
</div>
|
2020-08-27 21:17:46 +02:00
|
|
|
</div>
|
2024-07-31 20:22:57 +02:00
|
|
|
<div id="captions-container" class="invisible">
|
|
|
|
|
<div id="captions"></div>
|
|
|
|
|
</div>
|
2020-09-02 15:35:55 +02:00
|
|
|
<div class="login-container invisible" id="login-container">
|
|
|
|
|
<div class="login-box">
|
2024-06-11 11:57:15 +02:00
|
|
|
<form id="loginform" class="loginform">
|
|
|
|
|
<div id="userform">
|
|
|
|
|
<label for="username">Username</label>
|
|
|
|
|
<input id="username" type="text" name="username"
|
|
|
|
|
autocomplete="username" class="form-control"/>
|
|
|
|
|
</div>
|
2023-04-01 13:28:24 +02:00
|
|
|
<div id="passwordform">
|
|
|
|
|
<label for="password">Password</label>
|
|
|
|
|
<input id="password" type="password" name="password"
|
|
|
|
|
autocomplete="current-password" class="form-control"/>
|
|
|
|
|
</div>
|
2021-07-29 14:46:02 +02:00
|
|
|
<label>Enable at start:</label>
|
2020-12-02 11:15:36 +01:00
|
|
|
<div class="present-switch">
|
|
|
|
|
<p class="switch-radio">
|
|
|
|
|
<input id="presentoff" type="radio" name="presentradio" value="" checked/>
|
2021-07-29 14:46:02 +02:00
|
|
|
<label for="presentoff">Nothing</label>
|
2020-12-02 11:15:36 +01:00
|
|
|
</p>
|
|
|
|
|
<p class="switch-radio">
|
|
|
|
|
<input id="presentmike" type="radio" name="presentradio" value="mike"/>
|
2021-07-29 14:46:02 +02:00
|
|
|
<label for="presentmike">Microphone</label>
|
2020-12-02 11:15:36 +01:00
|
|
|
</p>
|
|
|
|
|
<p class="switch-radio">
|
|
|
|
|
<input id="presentboth" type="radio" name="presentradio" value="both"/>
|
2021-07-29 14:46:02 +02:00
|
|
|
<label for="presentboth">Camera and microphone</label>
|
2020-12-02 11:15:36 +01:00
|
|
|
</p>
|
|
|
|
|
</div>
|
2020-09-02 15:35:55 +02:00
|
|
|
<div class="clear"></div>
|
2020-12-02 11:15:36 +01:00
|
|
|
<div class="connect">
|
|
|
|
|
<input id="connectbutton" type="submit" class="btn btn-blue" value="Connect"/>
|
|
|
|
|
</div>
|
2020-09-02 15:35:55 +02:00
|
|
|
</form>
|
|
|
|
|
<div class="clear"></div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
2020-08-27 21:17:46 +02:00
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
2020-04-24 19:38:21 +02:00
|
|
|
</div>
|
2024-12-14 13:19:39 +01:00
|
|
|
</main>
|
2020-04-24 19:38:21 +02:00
|
|
|
|
2024-12-14 13:19:39 +01:00
|
|
|
<div id="sidebarnav" class="sidenav" aria-hidden="true">
|
2020-08-27 21:17:46 +02:00
|
|
|
<div class="sidenav-header">
|
2020-09-09 20:26:19 +02:00
|
|
|
<h2>Settings</h2>
|
2024-12-14 13:19:39 +01:00
|
|
|
<button class="closebtn" id="clodeside" title="Close settings" aria-label="Close settings"><i class="fas fa-times"></i>
|
2020-08-27 21:17:46 +02:00
|
|
|
</div>
|
|
|
|
|
<div class="sidenav-content" id="optionsdiv">
|
2020-11-24 17:36:52 +01:00
|
|
|
<div id="profile" class="profile invisible">
|
|
|
|
|
<div class="profile-user">
|
|
|
|
|
<div class="profile-logo">
|
|
|
|
|
<span><i class="fas fa-user" aria-hidden="true"></i></span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="profile-info">
|
|
|
|
|
<span id="userspan"></span>
|
|
|
|
|
<span id="permspan"></span>
|
2024-04-11 00:40:49 +02:00
|
|
|
<span id="chpwspan" class="invisible"><a id="change-password">Change password</a></span>
|
2020-11-24 17:36:52 +01:00
|
|
|
</div>
|
|
|
|
|
<div class="user-logout">
|
2024-12-14 13:19:39 +01:00
|
|
|
<button id="disconnectbutton">
|
2020-11-24 17:36:52 +01:00
|
|
|
<span class="logout-icon"><i class="fas fa-sign-out-alt"></i></span>
|
|
|
|
|
<span class="logout-text">Logout</span>
|
2024-12-14 13:19:39 +01:00
|
|
|
</button>
|
2020-11-24 17:36:52 +01:00
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
2020-10-05 11:15:31 +02:00
|
|
|
<div id="mediaoptions" class="invisible">
|
|
|
|
|
<fieldset>
|
|
|
|
|
<legend>Media Options</legend>
|
2020-12-01 21:17:10 +01:00
|
|
|
<label for="videoselect" class="sidenav-label-first">Camera:</label>
|
2020-10-05 11:15:31 +02:00
|
|
|
<select id="videoselect" class="select select-inline">
|
|
|
|
|
<option value="">off</option>
|
|
|
|
|
</select>
|
|
|
|
|
|
2020-12-01 21:17:10 +01:00
|
|
|
<label for="audioselect" class="sidenav-label">Microphone:</label>
|
2020-10-05 11:15:31 +02:00
|
|
|
<select id="audioselect" class="select select-inline">
|
|
|
|
|
<option value="">off</option>
|
|
|
|
|
</select>
|
2021-01-23 01:15:53 +01:00
|
|
|
|
|
|
|
|
<form>
|
|
|
|
|
<input id="mirrorbox" type="checkbox" checked/>
|
2021-01-25 13:06:09 +01:00
|
|
|
<label for="mirrorbox">Mirror view</label>
|
2021-01-23 01:15:53 +01:00
|
|
|
</form>
|
|
|
|
|
|
2020-10-05 11:15:31 +02:00
|
|
|
<form>
|
2020-12-01 21:17:10 +01:00
|
|
|
<input id="blackboardbox" type="checkbox"/>
|
|
|
|
|
<label for="blackboardbox">Blackboard mode</label>
|
2020-10-05 11:15:31 +02:00
|
|
|
</form>
|
|
|
|
|
|
2022-02-21 18:07:49 +01:00
|
|
|
<form>
|
|
|
|
|
<input id="preprocessingbox" type="checkbox"/ checked>
|
|
|
|
|
<label for="preprocessingbox">Noise suppression</label>
|
|
|
|
|
</form>
|
|
|
|
|
|
|
|
|
|
<form>
|
|
|
|
|
<input id="hqaudiobox" type="checkbox"/>
|
|
|
|
|
<label for="hqaudiobox">High-quality audio</label>
|
|
|
|
|
</form>
|
|
|
|
|
|
2020-10-05 11:15:31 +02:00
|
|
|
</fieldset>
|
|
|
|
|
</div>
|
2020-05-05 17:50:16 +02:00
|
|
|
|
2020-10-05 11:15:31 +02:00
|
|
|
<fieldset>
|
2020-11-09 00:13:13 +01:00
|
|
|
<legend>Other Settings</legend>
|
2020-11-30 20:53:12 +01:00
|
|
|
|
2021-01-13 13:57:05 +01:00
|
|
|
<form id="filterform">
|
|
|
|
|
<label for="filterselect" class="sidenav-label-first">Filter:</label>
|
|
|
|
|
<select id="filterselect" class="select select-inline">
|
|
|
|
|
<option value="" selected>none</option>
|
|
|
|
|
</select>
|
|
|
|
|
</form>
|
|
|
|
|
|
2020-11-30 20:53:12 +01:00
|
|
|
<form id="sendform">
|
2020-12-01 21:17:10 +01:00
|
|
|
<label for="sendselect" class="sidenav-label-first">Send:</label>
|
2020-11-30 20:53:12 +01:00
|
|
|
<select id="sendselect" class="select select-inline">
|
|
|
|
|
<option value="lowest">lowest</option>
|
|
|
|
|
<option value="low">low</option>
|
|
|
|
|
<option value="normal" selected>normal</option>
|
|
|
|
|
<option value="unlimited">unlimited</option>
|
|
|
|
|
</select>
|
|
|
|
|
</form>
|
|
|
|
|
|
2021-05-08 21:25:22 +02:00
|
|
|
<form id="simulcastform">
|
|
|
|
|
<label for="simulcastselect" class="sidenav-label-first">Simulcast:</label>
|
|
|
|
|
<select id="simulcastselect" class="select select-inline">
|
|
|
|
|
<option value="off">off</option>
|
|
|
|
|
<option value="auto" selected>auto</option>
|
|
|
|
|
<option value="on">on</option>
|
|
|
|
|
</select>
|
|
|
|
|
</form>
|
|
|
|
|
|
2020-11-30 20:53:12 +01:00
|
|
|
<form id="requestform">
|
2020-12-01 21:17:10 +01:00
|
|
|
<label for="requestselect" class="sidenav-label">Receive:</label>
|
2020-11-30 20:53:12 +01:00
|
|
|
<select id="requestselect" class="select select-inline">
|
|
|
|
|
<option value="">nothing</option>
|
|
|
|
|
<option value="audio">audio only</option>
|
2023-01-11 19:36:33 +01:00
|
|
|
<option value="screenshare">screenshare only</option>
|
|
|
|
|
<option value="everything-low">low quality</option>
|
2020-11-30 20:53:12 +01:00
|
|
|
<option value="everything" selected>everything</option>
|
|
|
|
|
</select>
|
|
|
|
|
</form>
|
2020-10-05 11:15:31 +02:00
|
|
|
|
2020-09-18 19:14:10 +02:00
|
|
|
<form>
|
2020-12-01 21:17:10 +01:00
|
|
|
<input id="activitybox" type="checkbox"/>
|
|
|
|
|
<label for="activitybox">Activity detection</label>
|
2020-09-18 19:14:10 +02:00
|
|
|
</form>
|
2020-11-24 19:22:38 +01:00
|
|
|
|
2022-09-16 19:10:01 +02:00
|
|
|
<form>
|
|
|
|
|
<input id="displayallbox" type="checkbox"/>
|
|
|
|
|
<label for="displayallbox">Display audio-only users</label>
|
|
|
|
|
</form>
|
2020-10-05 11:15:31 +02:00
|
|
|
</fieldset>
|
2020-04-24 19:38:21 +02:00
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
2020-09-28 17:00:25 +02:00
|
|
|
<div id="videocontrols-template" class="invisible">
|
2020-10-29 09:55:32 +01:00
|
|
|
<div class="video-controls vc-overlay">
|
2020-12-08 13:27:56 +01:00
|
|
|
<div class="controls-button controls-left">
|
2024-12-14 13:19:39 +01:00
|
|
|
<button class="video-play" title="Play video" aria-label="Play video">
|
2020-12-15 15:20:53 +01:00
|
|
|
<i class="fas fa-play"></i>
|
2024-12-14 13:19:39 +01:00
|
|
|
</button>
|
2020-12-08 13:27:56 +01:00
|
|
|
<span class="volume" title="Volume">
|
2024-12-14 13:19:39 +01:00
|
|
|
<i class="fas fa-volume-up volume-mute" tabindex="0" role='button'></i>
|
|
|
|
|
<input class="volume-slider" type="range" max="100" value="100" min="0" step="5" aria-label="Volume slider">
|
2020-12-08 13:27:56 +01:00
|
|
|
</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="controls-button controls-right">
|
2024-12-14 13:19:39 +01:00
|
|
|
<button class="pip" title="Picture In Picture" aria-label="Picture In Picture">
|
2020-12-08 13:27:56 +01:00
|
|
|
<i class="far fa-clone" aria-hidden="true"></i>
|
2024-12-14 13:19:39 +01:00
|
|
|
</button>
|
|
|
|
|
<button class="fullscreen" title="Fullscreen" aria-label="Fullscreen">
|
2020-12-08 13:27:56 +01:00
|
|
|
<i class="fas fa-expand" aria-hidden="true"></i>
|
2024-12-14 13:19:39 +01:00
|
|
|
</button>
|
2020-12-08 13:27:56 +01:00
|
|
|
</div>
|
2020-09-28 17:00:25 +02:00
|
|
|
</div>
|
|
|
|
|
</div>
|
2021-03-29 20:44:24 +02:00
|
|
|
<div id="topvideocontrols-template" class="invisible">
|
|
|
|
|
<div class="top-video-controls">
|
|
|
|
|
<div class="controls-button controls-right">
|
2024-12-14 13:19:39 +01:00
|
|
|
<button class="close-icon video-stop" title="Stop video" aria-label="Stop video">
|
|
|
|
|
</button>
|
2021-03-29 20:44:24 +02:00
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
2024-12-14 13:19:39 +01:00
|
|
|
<div class="sr-help invisible"> <!-- help for translation -->
|
|
|
|
|
<span class='voff'>Muted</span>
|
|
|
|
|
<span class='von'>On</span>
|
|
|
|
|
</div>
|
2020-09-28 17:00:25 +02:00
|
|
|
|
2023-05-03 18:37:52 +02:00
|
|
|
<dialog id="invite-dialog">
|
|
|
|
|
<form method="dialog">
|
|
|
|
|
<label for="invite-username">Username (optional):</label>
|
|
|
|
|
<input id="invite-username" type="text"/>
|
|
|
|
|
<br>
|
|
|
|
|
<label for="invite-not-before">Not before:</label>
|
|
|
|
|
<input id="invite-not-before" type="datetime-local"/>
|
|
|
|
|
<br>
|
|
|
|
|
<label for="invite-expires">Expires:</label>
|
|
|
|
|
<input id="invite-expires" type="datetime-local"/>
|
|
|
|
|
<br>
|
|
|
|
|
<button id="invite-cancel" value="cancel" type="button">Cancel</button>
|
|
|
|
|
<button value="invite" value="invite">Invite</button>
|
2024-04-26 19:10:57 +02:00
|
|
|
</form>
|
2023-05-03 18:37:52 +02:00
|
|
|
</dialog>
|
|
|
|
|
|
2020-08-11 17:09:31 +02:00
|
|
|
<script src="/protocol.js" defer></script>
|
2024-11-16 18:12:15 +01:00
|
|
|
<script src="/third-party/toastify/toastify.js" defer></script>
|
|
|
|
|
<script src="/third-party/contextual/contextual.js" defer></script>
|
2020-12-06 19:43:17 +01:00
|
|
|
<script src="/galene.js" defer></script>
|
2020-04-24 19:38:21 +02:00
|
|
|
</body>
|
|
|
|
|
</html>
|
