-
Notifications
You must be signed in to change notification settings - Fork 4
/
view-vm.html
114 lines (114 loc) · 5.57 KB
/
view-vm.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
<style>
div#display-outer {
width: 100%;
display: table;
vertical-align: middle;
text-align: center;
margin-top: 38px;
}
div#display {
display: inline-block;
}
.chat-timestamp {
float: right;
}
</style>
<div id="vm-view" style="display: none;">
<div style="text-align: center">
<h2><small>Click the screen to request a turn and control the computer!</small></h2>
</div>
<div id="display-outer">
<div id="display"></div>
<div style="display:none;" class="ui blue message" role="alert" id="vote-alert">
<i class="poll icon" style="font-size: 3em; line-height: 1; vertical-align: middle; opacity: 0.8; flex: 0 0 auto; width: auto; margin-right: 0em; float: left;"></i>
<i class="close icon" aria-label="Close" class="close" id="vote-dismiss-button"></i>
Do you want to reset the VM?
<button type="button" class="ui green button" id="vote-yes-button">Yes</button>
<button type="button" class="ui red button" id="vote-no-button">No</button>
</div>
<div style="display:none;" id="vote-status">
<h3><small>Votes for VM Reset (<span id="vote-time"></span>s): </small></h3>
<span class="ui green horizontal label">Yes: <span id="vote-label-yes"></span></span> <span class="ui red horizontal label">No: <span id="vote-label-no"></span></span>
<br><br>
</div>
<!--<div class="progress">
<div class="progress-bar progress-bar-success" style="width: 60%">
<span>Yes</span>
</div>
<div class="progress-bar progress-bar-danger" style="width: 40%">
<span>No</span>
</div>
</div>-->
<div class="ui centered grid">
<div class="row">
<button class="ui button" type="button" id="osk-btn"><i class="keyboard icon"></i> Keyboard</button>
<button style="display: none;" class="ui button" type="button" id="change-username-button"><i class="user icon"></i> Change Username</button>
<button style="display: none;" class="ui button" type="button" id="start-vote-button"><i class="poll icon"></i> Vote for Reset</button>
<button style="display: none;" class="ui button" type="button" id="upload-options-btn"><i class="cloud upload icon"></i> Upload File</button>
<button class="ui button" type="button" id="end-turn-btn"><i class="stop icon"></i>End Turn</button>
<button class="ui button" type="button" id="mute-button"><i class="volume up icon"></i>Mute</button>
<button style="display: none;" class="ui button" type="button" id="picture-in-picture-button"><i class="images outline icon"></i> Picture-in-Picture</button>
<div id="file-upload" class="form-inline" style="display: none;">
<input class="form" id="upload-input" type="file">
<!--<label for="filename-box">Filename</label><input type="text" class="form-control" id="filename-box" placeholder="filename">-->
<label><input type="checkbox" id="upload-run-chkbox" checked>Run file</label>
<button class="ui button" type="button" id="upload-btn" disabled>Upload</button>
<div id="upload-wait-time"></div>
</div>
</div>
<div id="admin-controls" class="row" style="display: none;">
<button class="ui button" type="button" id="pause-turns-btn"><i class="pause icon"></i>Pause Turn</button>
<button class="ui button" type="button" id="resume-turns-btn"><i class="play icon"></i>Resume Turn</button>
<button class="ui button" type="button" id="cancel-vote-btn"><i class="ban icon"></i>Cancel Vote</button>
</div>
</div>
<h3 style="height: 1em;"><small id="status"></small></h3>
</div>
<div id="kbd-container">
<div class="osk" id="kbd-outer" style="display: none;">
<div class="osk" id="kbd-keys"></div>
<br>
</div>
</div>
<div id="vm-description" style="text-align:center; height: 2em;">
</div>
<div class="ui grid" style="margin-left: 0rem;">
<div class="four wide column">
<h4 class="ui top attached header" style="background: #EEEEEE;">
Users Online: <span id="online-users-count"></span>
</h4>
<div class="ui attached segment" style="overflow-y:auto;max-height:280px;">
<div id="online-users" class="ui celled list">
</div>
</div>
</div>
<div class="twelve wide column">
<div style="position: relative;min-height: 246px; margin-bottom: 10px;">
<ul id="chat-panel" class="list-group-item message-pane-wrapper">
<div id="chat-box" class="message-pane">
</div>
</ul>
</div>
<div class="ui fluid labeled action input">
<span id="chat-user" class="ui label"></span>
<input id="chat-input" type="text" class="form-control" aria-describedby="user-label" disabled>
<span class="ui labeled input">
<button id="chat-send-btn" class="ui button" type="button" disabled>Send</button>
</span>
</div>
</div>
</div>
<div id="change-username-modal" class="ui mini modal" style="width: 600px;">
<div class="header">Change Username</div>
<div class="content">Enter a new username in the box below.<br>
<div class="ui fluid labeled action input">
<span id="username-label" class="ui label">Username</span> <input id="new-username-input" type="text" placeholder="Enter username here..."></input>
</div>
<div class="ui clearing divider"></div>
<div class="actions" style="float:right;">
<button class="ui ok primary button" type="button">OK</button>
</div>
</div>
<br><br>
</div>
</div>