mirror of
https://github.com/rustdesk/rustdesk.git
synced 2024-12-22 17:27:50 +08:00
163 lines
3.4 KiB
HTML
163 lines
3.4 KiB
HTML
|
<html>
|
||
|
|
<head>
|
||
|
|
<title>Clock</title>
|
||
|
|
<style>
|
||
|
|
body { padding: 5dip; }
|
||
|
|
|
||
|
|
#clocks {
|
||
|
|
size: *;
|
||
|
|
flow: horizontal-flow;
|
||
|
|
}
|
||
|
|
|
||
|
|
.city {
|
||
|
|
flow: vertical;
|
||
|
|
size: *;
|
||
|
|
}
|
||
|
|
|
||
|
|
.city > caption {
|
||
|
|
width: *;
|
||
|
|
padding: 5dip;
|
||
|
|
flow:horizontal;
|
||
|
|
horizontal-align: center;
|
||
|
|
font-size: 11pt;
|
||
|
|
font-weight: 700;
|
||
|
|
}
|
||
|
|
|
||
|
|
.city > clock, .edit {
|
||
|
|
margin-right: *;
|
||
|
|
margin-left: *;
|
||
|
|
margin-bottom: 5dip;
|
||
|
|
}
|
||
|
|
|
||
|
|
.city > .edit {
|
||
|
|
flow: horizontal;
|
||
|
|
width: max-content;
|
||
|
|
}
|
||
|
|
|
||
|
|
clock {
|
||
|
|
behavior: native-clock;
|
||
|
|
display: block;
|
||
|
|
min-width: 150dip;
|
||
|
|
min-height: 150dip;
|
||
|
|
}
|
||
|
|
|
||
|
|
.native-text {
|
||
|
|
behavior: native-text;
|
||
|
|
display: block;
|
||
|
|
min-height: 100dip;
|
||
|
|
min-width: 100dip;
|
||
|
|
outline: 1px solid orange;
|
||
|
|
}
|
||
|
|
|
||
|
|
.italic {
|
||
|
|
font-style: italic;
|
||
|
|
}
|
||
|
|
.bold {
|
||
|
|
font-weight: bold;
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
<script type="text/tiscript">
|
||
|
|
|
||
|
|
// called from Rust
|
||
|
|
function getLocalTime() {
|
||
|
|
var d = new Date();
|
||
|
|
return [d.hour, d.minute, d.second];
|
||
|
|
}
|
||
|
|
|
||
|
|
function getUtcTime(offset) {
|
||
|
|
var d = new Date();
|
||
|
|
d.UTChour += offset;
|
||
|
|
return [d.UTChour, d.UTCminute, d.UTCsecond];
|
||
|
|
}
|
||
|
|
|
||
|
|
var timeSet = $(#set-time);
|
||
|
|
var timeEdit = $(#edit-time);
|
||
|
|
var timeShow = $(#show-time);
|
||
|
|
|
||
|
|
timeEdit << event change {
|
||
|
|
var now = this.value;
|
||
|
|
var local = [now.hour, now.minute, now.second];
|
||
|
|
stdout.printf("timeEdit: %v %v\n", now, local);
|
||
|
|
timeShow.value = local;
|
||
|
|
}
|
||
|
|
|
||
|
|
timeSet << event click {
|
||
|
|
var now = new Date();
|
||
|
|
var local = [now.hour, now.minute, now.second];
|
||
|
|
stdout.printf("timeSet: %v %v\n", now, local);
|
||
|
|
timeEdit.value = now;
|
||
|
|
timeShow.value = local;
|
||
|
|
}
|
||
|
|
|
||
|
|
function self.ready() {
|
||
|
|
var now = new Date();
|
||
|
|
var local = [now.hour, now.minute, now.second];
|
||
|
|
stdout.printf("initial time: %v %v\n", now, local);
|
||
|
|
timeShow.value = local;
|
||
|
|
}
|
||
|
|
|
||
|
|
// update window icon
|
||
|
|
function setIcon() {
|
||
|
|
var clock = $(clock);
|
||
|
|
|
||
|
|
// get clock element size
|
||
|
|
var (w, h) = clock.box(#dimension, #border);
|
||
|
|
if (w == 0 || h == 0)
|
||
|
|
return;
|
||
|
|
|
||
|
|
// make a snapshot of it with 32x32 size
|
||
|
|
var img = new Image(clock, w, h, 32, 32);
|
||
|
|
var png = img.toBytes();
|
||
|
|
img.destroy();
|
||
|
|
|
||
|
|
// make an icon from the snapshot
|
||
|
|
var icon = Image.fromBytes(png);
|
||
|
|
view.windowIcon = icon;
|
||
|
|
|
||
|
|
return true; // continue to update icon ;)
|
||
|
|
}
|
||
|
|
self.timer(1000, setIcon);
|
||
|
|
|
||
|
|
</script>
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
|
||
|
|
<div id="clocks" some>
|
||
|
|
<div class="city">
|
||
|
|
<caption>London</caption>
|
||
|
|
<clock utc="0" title="UTC+0"></clock>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="city">
|
||
|
|
<caption>Tokyo</caption>
|
||
|
|
<clock utc="+9" title="UTC+9"></clock>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="city">
|
||
|
|
<caption>New York</caption>
|
||
|
|
<clock utc="-4" title="UTC-4"></clock>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div id="local" some>
|
||
|
|
<div class="city">
|
||
|
|
<caption>Frozen time</caption>
|
||
|
|
<clock frozen id="show-time"></clock>
|
||
|
|
<div class="edit">
|
||
|
|
<widget type="time" value="now" id="edit-time" title="Change time of the drawn clock" />
|
||
|
|
<widget type="button" id="set-time" title="Reset back to local time">=</widget>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div>
|
||
|
|
<div class="city">
|
||
|
|
<caption>Text</caption>
|
||
|
|
<div class="native-text">static text</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
|
||
|
|
</body>
|
||
|
|
</html>
|