Add clock and punch in/out buttons, add database, add branding
parent
b80d8ffa9b
commit
359509732c
@ -1,4 +1,5 @@
|
|||||||
vendor
|
vendor
|
||||||
settings.php
|
settings.php
|
||||||
nbproject/private
|
nbproject/private
|
||||||
*.sync-conflict*
|
*.sync-conflict*
|
||||||
|
database.mwb.bak
|
Binary file not shown.
@ -1 +1,40 @@
|
|||||||
<h1>Hello World</h1>
|
<div class="row">
|
||||||
|
|
||||||
|
<div class="col-xs-12 col-sm-6 col-md-4 col-md-offset-2">
|
||||||
|
<div class="panel panel-default">
|
||||||
|
<div class="panel-body" style="text-align: center;">
|
||||||
|
<h2 id="server_time"><?php echo date(TIME_FORMAT); ?></h2>
|
||||||
|
<h4 id="server_date"><?php echo date(LONG_DATE_FORMAT); ?></h4>
|
||||||
|
</div>
|
||||||
|
<div id="seconds_bar" style="width: 100%; height: 5px; padding-bottom: 5px;">
|
||||||
|
<div style="background-color: #ffc107; height: 5px; width: <?php echo round(date('s') * 1 / 60 * 100, 4); ?>%;"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="col-xs-12 col-sm-6 col-md-4">
|
||||||
|
<div class="panel panel-blue">
|
||||||
|
<div class="panel-heading">
|
||||||
|
<h3 class="panel-title">
|
||||||
|
<i class="fa fa-clock-o"></i> <?php lang("punch in out"); ?>
|
||||||
|
</h3>
|
||||||
|
</div>
|
||||||
|
<div class="panel-body">
|
||||||
|
<a href="action.php?action=punchin" class="btn btn-block btn-success btn-lg"><i class="fa fa-play"></i> <?php lang("punch in"); ?></a>
|
||||||
|
<br />
|
||||||
|
<a href="action.php?action=punchout" class="btn btn-block btn-danger btn-lg"><i class="fa fa-stop"></i> <?php lang("punch out"); ?></a>
|
||||||
|
</div>
|
||||||
|
<div class="panel-footer">
|
||||||
|
<i class="fa fa-info-circle"></i> <?php
|
||||||
|
if ($database->has('punches', ['AND' => ['uid' => $_SESSION['uid'], 'out' => null]])) {
|
||||||
|
lang("you are punched in");
|
||||||
|
} else {
|
||||||
|
lang("you are not punched in");
|
||||||
|
}
|
||||||
|
?>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
@ -0,0 +1 @@
|
|||||||
|
<h1>Hello World</h1>
|
Binary file not shown.
Before Width: | Height: | Size: 12 KiB After Width: | Height: | Size: 19 KiB |
Before Width: | Height: | Size: 2.9 KiB After Width: | Height: | Size: 3.9 KiB |
@ -0,0 +1,45 @@
|
|||||||
|
function setClock() {
|
||||||
|
$.getJSON("action.php", {
|
||||||
|
action: "time"
|
||||||
|
}, function (resp) {
|
||||||
|
if (resp.status == "OK") {
|
||||||
|
$('#server_time').text(resp.time);
|
||||||
|
$('#server_date').text(resp.date);
|
||||||
|
var seconds = resp.seconds * 1;
|
||||||
|
var interval = 60 - seconds;
|
||||||
|
console.log(interval);
|
||||||
|
if (interval > 5) {
|
||||||
|
interval = 5;
|
||||||
|
}
|
||||||
|
console.log(interval);
|
||||||
|
console.log((((seconds + interval) / 60) * 100));
|
||||||
|
$('#seconds_bar div').animate({
|
||||||
|
width: (((seconds + interval) / 60) * 100) + "%"
|
||||||
|
}, 1000 * interval, "linear", function () {
|
||||||
|
if (interval < 5) {
|
||||||
|
$('#seconds_bar div').animate({
|
||||||
|
width: "0%"
|
||||||
|
}, 1000, "linear", function () {
|
||||||
|
$('#seconds_bar div').animate({
|
||||||
|
width: (((5 - interval - 1) / 60) * 100) + "%"
|
||||||
|
}, 1000 * (5 - interval - 1), "linear");
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function setSeconds() {
|
||||||
|
//$('#seconds_bar div').css("width", ((seconds / 60) * 100) + "%");
|
||||||
|
$('#seconds_bar div').animate({
|
||||||
|
width: ((seconds / 60) * 100) + "%"
|
||||||
|
}, 1000, "linear", function () {
|
||||||
|
seconds++;
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
$(document).ready(function () {
|
||||||
|
setClock();
|
||||||
|
setInterval(setClock, 5000);
|
||||||
|
});
|
Loading…
Reference in New Issue