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
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
|
<!DOCTYPE html>
<html>
<head>
<title>Remote Desktop</title>
<!--Stylesheet that styles the charms bar and the startbutton -->
<link rel="stylesheet" href="css/charms.css"/>
<meta http-equiv="x-ua-compatible" content="IE=edge">
<!--Script that powers the charms bar-->
<script>
function charms(){
document.getElementById('charmsbar').style.display='block';
document.getElementById('datetime').style.display='block';
document.getElementById('time').style.display='block';
}
function destroycharms() {
document.getElementById('charmsbar').style.display='none';
document.getElementById('datetime').style.display='none';
document.getElementById('time').style.display='none';
}
function start(){
document.getElementById('startbutton').style.display='block';
}
function destroystart() {
document.getElementById('startbutton').style.display='none';
}
</script>
<style>
body {
background-image: url(bg.jpg);
background-repeat: no-repeat;
background-size: 100%;
background-color: #515151;
font-family: Segoe UI Light, Segoe UI, Open Sans, Microsoft Jheng Hei;
}
#connect {
padding:10px;
height: 40px;
color: white;
font-weight:normal;
background:#212121;
border:2px solid white;
margin-left:10px;
font-family:Segoe UI Semibold;
}
#connect:hover {
background:#3e3e3e;
cursor:pointer;
}
#connect:active {
background: white;
color: black;
cursor:pointer;
}
#text {
font-family:Segoe UI;
padding: 10px;
width: 1000px;
max-height: 50px;
background-color: #d3d3d3;
border: 0px;
margin-left: 100px;
margin-top: 15px;
margin-bottom: 15px;
color: #555555;
}
#text:focus {
background: white;
color: black;
cursor:pointer;
}
</style>
</head>
<body>
<div id="splashscreen"></div>
<div style="margin-left: 100px; margin-top: 40px;">
<span style="color:white; font-size:72px;">Remote Desktop</span>
</div>
<div style="margin-left: 100px; margin-top: 50px;">
<span style="color:white;">To connect to a PC enter the PC name below.</span>
</div>
<div style="margin-left: 100px; margin-top: 10px;">
<span style="color:white;">With Remote Desktop, you can do more than connect to other PCs.</span>
<ul>
<span style="color:white;">
<li>Work with apps and desktops that the administrator has set up for you.</li>
</span>
<span style="color:#2e93c3">
Access RemoteApp and Desktop Connections
</span>
<span style="color:white;">
<li>Connect to PCs on your corporate network without setting up a VPN.</li>
</span>
<span style="color:#2e93c3">
Use a Remote Desktop Gateway server
</span>
</ul>
</div>
<div style="height: 70px; width: 100%; background-color: #212121; position:absolute; left: 0; bottom:0;">
<input id="text" value="PC name" onFocus="this.value=''">
<input type="button" id="connect" value="Connect">
<!-- CHARMS BAR CODE -->
<div id="hoverarea" onmouseover="charms()" class="hotcorner">
</div>
<div id="charmsbar" onmouseover="charms()" onmouseout="destroycharms()">
<img src="../../common/img/charmsbar/search.png" onmouseover="this.src='../../common/img/charmsbar/search-hover.png'" onmouseout="this.src='../../common/img/charmsbar/search.png'"/><br/>
<img src="../../common/img/charmsbar/share.png" onmouseover="this.src='../../common/img/charmsbar/share-hover.png'" onmouseout="this.src='../../common/img/charmsbar/share.png'"/><br/>
<a href="../../start/index.html"><img src="img/charmsbar/start.png" onmouseover="this.src='img/charmsbar/start-hover.png'" onmouseout="this.src='../../common/img/charmsbar/start.png'"/></a><br/>
<img src="../../common/img/charmsbar/devices.png" onmouseover="this.src='../../common/img/charmsbar/devices-hover.png'" onmouseout="this.src='../../common/img/charmsbar/devices.png'"/><br/>
<img src="../../common/img/charmsbar/settings.png" onmouseover="this.src='../../common/img/charmsbar/settings-hover.png'" onmouseout="this.src='../../common/img/charmsbar/settings.png'" onclick="settingsc()"/><br/>
</div>
<div id="datetime">
<img src="../../common/img/charmsbar/network.png" id="iconnetwork" height="24px" width="24px"/>
<img src="../../common/img/charmsbar/battery.png" id="iconbattery"/>
<span id="time"></span>
<script>
<!-- Begin
function clock() {
var digital = new Date();
var hours = digital.getHours();
var minutes = digital.getMinutes();
var seconds = digital.getSeconds();
var amOrPm = "AM";
if (hours > 11) amOrPm = "PM";
if (hours > 12) hours = hours - 12;
if (hours == 0) hours = 12;
if (minutes <= 9) minutes = "0" + minutes;
if (seconds <= 9) seconds = "0" + seconds;
dispTime = hours + ":" + minutes ;
document.getElementById('time').innerHTML = dispTime;
setTimeout("clock()", 1000);
}
window.onmouseover=clock;
// End -->
</script>
<div id="date">
<script>
var dayName = new Array ("Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday")
var monName = new Array ("January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December")
var now = new Date
document.write("" + dayName[now.getDay()] + "<br/>" +"<span id=month>" + monName[now.getMonth()] + " "+now.getDate() +"")
</script>
</div>
</div>
<div id="bottomhoverarea" onmouseover="charms()" class="hotcorner">
</div>
<div id="starthoverarea" onmouseover="start()" class="hotcorner">
</div>
<div id="startbutton" onmouseout="destroystart()">
<a href="../../start/index.html"><img src="../../common/img/charmsbar/startbutton.png"/></a>
</div>
</div>
|
