Add clock and punch in/out buttons, add database, add branding
This commit is contained in:
parent
b80d8ffa9b
commit
359509732c
3
.gitignore
vendored
3
.gitignore
vendored
@ -1,4 +1,5 @@
|
||||
vendor
|
||||
settings.php
|
||||
nbproject/private
|
||||
*.sync-conflict*
|
||||
*.sync-conflict*
|
||||
database.mwb.bak
|
@ -3,7 +3,6 @@
|
||||
/**
|
||||
* Make things happen when buttons are pressed and forms submitted.
|
||||
*/
|
||||
|
||||
require_once __DIR__ . "/required.php";
|
||||
|
||||
dieifnotloggedin();
|
||||
@ -25,6 +24,10 @@ function returnToSender($msg, $arg = "") {
|
||||
}
|
||||
|
||||
switch ($VARS['action']) {
|
||||
case "time":
|
||||
$out = ["status" => "OK", "time" => date(TIME_FORMAT), "date" => date(LONG_DATE_FORMAT), "seconds" => date("s")];
|
||||
header('Content-Type: application/json');
|
||||
exit(json_encode($out));
|
||||
case "signout":
|
||||
session_destroy();
|
||||
header('Location: index.php');
|
||||
|
4
api.php
4
api.php
@ -31,6 +31,6 @@ switch ($VARS['action']) {
|
||||
$out = ["status" => "OK", "maxresults" => $max, "pong" => true];
|
||||
exit(json_encode($out));
|
||||
default:
|
||||
header("HTTP/1.1 400 Bad Request");
|
||||
die("\"400 Bad Request\"");
|
||||
http_response_code(404);
|
||||
die("\"404 Action not found\"");
|
||||
}
|
BIN
database.mwb
Normal file
BIN
database.mwb
Normal file
Binary file not shown.
@ -25,4 +25,7 @@ define("STRINGS", [
|
||||
"login server user data error" => "The login server refused to provide account information. Try again or contact technical support.",
|
||||
"captcha error" => "There was a problem with the CAPTCHA (robot test). Try again.",
|
||||
"home" => "Home",
|
||||
"punch in out" => "Punch In/Out",
|
||||
"you are punched in" => "You are punched in.",
|
||||
"you are not punched in" => "You are not on the clock."
|
||||
]);
|
@ -5,7 +5,10 @@ define("PAGES", [
|
||||
"home" => [
|
||||
"title" => "home",
|
||||
"navbar" => true,
|
||||
"icon" => "home"
|
||||
"icon" => "home",
|
||||
"scripts" => [
|
||||
"static/js/home.js"
|
||||
]
|
||||
],
|
||||
"404" => [
|
||||
"title" => "404 error"
|
||||
|
@ -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>
|
1
pages/punches.php
Normal file
1
pages/punches.php
Normal file
@ -0,0 +1 @@
|
||||
<h1>Hello World</h1>
|
@ -35,6 +35,17 @@ define("PORTAL_KEY", "123");
|
||||
// For supported values, see http://php.net/manual/en/timezones.php
|
||||
define("TIMEZONE", "America/Denver");
|
||||
|
||||
// See http://php.net/manual/en/function.date.php
|
||||
define("TIME_FORMAT", "g:i A"); // 12 hour time
|
||||
#define("TIME_FORMAT", "G:i"); // 24 hour time
|
||||
|
||||
// Used in many places
|
||||
define("DATETIME_FORMAT", "M j Y g:i:s A"); // 12 hour time
|
||||
#define("DATETIME_FORMAT", "M j Y G:i:s"); // 24 hour time
|
||||
|
||||
// Used on the clock widget
|
||||
define("LONG_DATE_FORMAT", "l F j");
|
||||
|
||||
// Base URL for site links.
|
||||
define('URL', 'http://localhost/qwikclock');
|
||||
|
||||
|
Binary file not shown.
Before Width: | Height: | Size: 12 KiB After Width: | Height: | Size: 19 KiB |
@ -16,19 +16,11 @@
|
||||
version="1.1"
|
||||
inkscape:version="0.91 r13725"
|
||||
sodipodi:docname="logo.svg"
|
||||
inkscape:export-filename="/home/skylar/Documents/Projects/Sources/WebAppTemplate/static/img/logo.png"
|
||||
inkscape:export-xdpi="90"
|
||||
inkscape:export-ydpi="90">
|
||||
inkscape:export-filename="/home/skylar/Documents/Projects/Assets/QwikClock/logo_64.png"
|
||||
inkscape:export-xdpi="11.25"
|
||||
inkscape:export-ydpi="11.25">
|
||||
<defs
|
||||
id="defs4">
|
||||
<inkscape:perspective
|
||||
sodipodi:type="inkscape:persp3d"
|
||||
inkscape:vp_x="-493.3276 : 245.89848 : 1"
|
||||
inkscape:vp_y="0 : 1000 : 0"
|
||||
inkscape:vp_z="464.45088 : 245.89848 : 1"
|
||||
inkscape:persp3d-origin="-14.438371 : 160.56515 : 1"
|
||||
id="perspective4236" />
|
||||
</defs>
|
||||
id="defs4" />
|
||||
<sodipodi:namedview
|
||||
id="base"
|
||||
pagecolor="#ffffff"
|
||||
@ -37,7 +29,7 @@
|
||||
inkscape:pageopacity="0.0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:zoom="0.49497475"
|
||||
inkscape:cx="-135.9681"
|
||||
inkscape:cx="163.44061"
|
||||
inkscape:cy="352.66131"
|
||||
inkscape:document-units="px"
|
||||
inkscape:current-layer="layer1"
|
||||
@ -61,7 +53,7 @@
|
||||
id="layer1"
|
||||
transform="translate(0,-540.36216)">
|
||||
<rect
|
||||
style="opacity:1;fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:20;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.74509804"
|
||||
style="opacity:1;fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:1;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
|
||||
id="rect4726"
|
||||
width="512"
|
||||
height="512"
|
||||
@ -69,10 +61,58 @@
|
||||
y="540.36218"
|
||||
rx="50"
|
||||
ry="50" />
|
||||
<path
|
||||
id="path4348"
|
||||
style="fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:9.87128067;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
|
||||
d="m 132.93564,682.51771 213.96788,-43.14304 0,313.97496 -213.96788,-37.9643 z m 213.96788,-43.14304 0,313.97496 32.16084,-45.18373 0,-217.44396 z m -213.96788,43.14304 213.96788,-43.14304 32.16084,51.34727 -167.21823,22.47784 z m 78.91049,30.68207 167.21823,-22.47784 0,217.44396 -167.21823,-19.77968 z m -78.91049,-30.68207 0,232.86762 78.91049,-26.99911 0,-175.18644 z m 0,232.86762 213.96788,37.9643 32.16084,-45.18373 -167.21823,-19.77968 z"
|
||||
inkscape:connector-curvature="0" />
|
||||
<g
|
||||
id="g4951"
|
||||
transform="matrix(9.2608029,0,0,9.2608029,-3841.4127,-9435.8076)">
|
||||
<circle
|
||||
r="20"
|
||||
cy="1104.8901"
|
||||
cx="442.44681"
|
||||
id="path4138"
|
||||
style="opacity:1;fill:none;fill-opacity:1;stroke:#2196f3;stroke-width:5;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
|
||||
<rect
|
||||
transform="matrix(0.70710678,0.70710678,-0.70710678,0.70710678,0,0)"
|
||||
y="465.91809"
|
||||
x="1093.4521"
|
||||
height="5"
|
||||
width="30"
|
||||
id="rect4174"
|
||||
style="opacity:1;fill:#ffd740;fill-opacity:1;stroke:none;stroke-width:5;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
|
||||
<g
|
||||
style="fill:#90caf9;fill-opacity:1"
|
||||
id="g4243"
|
||||
transform="translate(418.44681,76.527869)">
|
||||
<rect
|
||||
style="opacity:1;fill:#90caf9;fill-opacity:1;stroke:none;stroke-width:5;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
|
||||
id="rect4180"
|
||||
width="5"
|
||||
height="1"
|
||||
x="7.1973362"
|
||||
y="1027.8622" />
|
||||
<rect
|
||||
style="opacity:1;fill:#90caf9;fill-opacity:1;stroke:none;stroke-width:5;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
|
||||
id="rect4180-7"
|
||||
width="5"
|
||||
height="1"
|
||||
x="35.906101"
|
||||
y="1027.8622" />
|
||||
<rect
|
||||
style="opacity:1;fill:#90caf9;fill-opacity:1;stroke:none;stroke-width:5;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
|
||||
id="rect4180-7-5"
|
||||
width="5"
|
||||
height="1"
|
||||
x="1011.4764"
|
||||
y="-24.5"
|
||||
transform="matrix(0,1,-1,0,0,0)" />
|
||||
<rect
|
||||
style="opacity:1;fill:#90caf9;fill-opacity:1;stroke:none;stroke-width:5;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
|
||||
id="rect4180-7-5-3"
|
||||
width="5"
|
||||
height="1"
|
||||
x="1040.3921"
|
||||
y="-24.5"
|
||||
transform="matrix(0,1,-1,0,0,0)" />
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 2.9 KiB After Width: | Height: | Size: 3.9 KiB |
45
static/js/home.js
Normal file
45
static/js/home.js
Normal file
@ -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…
x
Reference in New Issue
Block a user