260 lines
9.8 KiB
PHP
Executable File

<?php
require_once('fixed/config/go_con.php');
access(39);
$google_translate = true;
$timeFirst = strtotime($get_my_books['date_time']);
$timeSecond = strtotime($date_time);
$differenceInSeconds = $timeSecond - $timeFirst;
?>
<!DOCTYPE html>
<html lang="en" dir="rtl">
<?php require_once('fixed/head/go.php'); ?>
<body class="rtl">
<style>
.base-timer {
position: relative;
width: 300px;
height: 300px;
}
.base-timer__svg {
transform: scaleX(-1);
}
.base-timer__circle {
fill: none;
stroke: none;
}
.base-timer__path-elapsed {
stroke-width: 7px;
stroke: grey;
}
.base-timer__path-remaining {
stroke-width: 7px;
stroke-linecap: round;
transform: rotate(90deg);
transform-origin: center;
transition: 1s linear all;
fill-rule: nonzero;
stroke: currentColor;
}
.base-timer__path-remaining.green {
color: rgb(65, 184, 131);
}
.base-timer__path-remaining.orange {
color: orange;
}
.base-timer__path-remaining.red {
color: red;
}
.base-timer__label {
position: absolute;
width: 300px;
height: 300px;
top: 0;
display: flex;
align-items: center;
justify-content: center;
font-size: 48px;
}
</style>
<?php require_once('fixed/loader/go.php'); ?>
<div class="page-wrapper" id="pageWrapper">
<?php require_once('fixed/header/go.php'); ?>
<div class="page-body-wrapper">
<?php require_once('fixed/sidebar/go.php'); ?>
<div class="page-body">
<div class="container-fluid">
<div class="row">
<div class="col-12">
<div class="card">
<div class="card-body new-user order-list">
<div class="table-responsive">
<table class="table table-bordered text-center">
<tbody>
<tr style="text-align:center;">
<td>
<div style="display: grid;height: 80vh;place-items: center;">
<div id="app"></div>
</div>
</td>
</tr>
<tr style="text-align:center;">
<td>
<div id="next" class="btn btn-pill btn-primary btn-air-primary" title="btn btn-pill btn-primary btn-air-primary">التالي</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<?php require_once('fixed/footer/go.php'); ?>
</div>
</div>
<div id="get_data"></div>
<?php require_once('fixed/js/go.php'); ?>
<script>
const FULL_DASH_ARRAY = 283;
const WARNING_THRESHOLD = 10;
const ALERT_THRESHOLD = 5;
const COLOR_CODES = {
info: {
color: "green"
},
warning: {
color: "orange",
threshold: WARNING_THRESHOLD
},
alert: {
color: "red",
threshold: ALERT_THRESHOLD
}
};
number_temp = parseInt(<?=json_encode($get_my_books['minimum'])?>);
const TIME_LIMIT = (number_temp * 60);
let timePassed = parseInt(<?=json_encode($differenceInSeconds)?>);
let timeLeft = TIME_LIMIT;
let timerInterval = null;
let remainingPathColor = COLOR_CODES.info.color;
document.getElementById("app").innerHTML = `
<div class="base-timer">
<svg class="base-timer__svg" viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
<g class="base-timer__circle">
<circle class="base-timer__path-elapsed" cx="50" cy="50" r="45"></circle>
<path
id="base-timer-path-remaining"
stroke-dasharray="283"
class="base-timer__path-remaining ${remainingPathColor}"
d="
M 50, 50
m -45, 0
a 45,45 0 1,0 90,0
a 45,45 0 1,0 -90,0
"
></path>
</g>
</svg>
<span id="base-timer-label" class="base-timer__label">${formatTime(
timeLeft
)}</span>
</div>
`;
startTimer();
function onTimesUp() {
clearInterval(timerInterval);
}
function startTimer() {
timerInterval = setInterval(() => {
timePassed = timePassed += 1;
timeLeft = TIME_LIMIT - timePassed;
switch (parseInt(timeLeft)) {
case (parseInt(TIME_LIMIT/2)):
swalfun('تذكير', 'يرجى ابلاغ العميل بالآتي : 1- يفضل عدم الاستحمام مباشرة لمدة 4- 7 ساعات للاستفادة من التدليك لعدم فقدان ما يقارب 40% من فائدة التدليك 2- تقديم النصيحة للعميل مع تحديد وقت جلسة اخرى', 'warning');
break;
case (parseInt(TIME_LIMIT/4)):
swalfun('تذكير', 'يرجى ابلاغ العميل بالآتي : 1- يفضل عدم الاستحمام مباشرة لمدة 4- 7 ساعات للاستفادة من التدليك لعدم فقدان ما يقارب 40% من فائدة التدليك 2- تقديم النصيحة للعميل مع تحديد وقت جلسة اخرى', 'warning');
break;
case 0:
swalfun('تذكير', 'يرجى ابلاغ العميل بالآتي : 1- يفضل عدم الاستحمام مباشرة لمدة 4- 7 ساعات للاستفادة من التدليك لعدم فقدان ما يقارب 40% من فائدة التدليك 2- تقديم النصيحة للعميل مع تحديد وقت جلسة اخرى', 'warning');
break;
}
document.getElementById("base-timer-label").innerHTML = formatTime(
timeLeft
);
setCircleDasharray();
setRemainingPathColor(timeLeft);
if (timeLeft === 0) {
onTimesUp();
}
}, 1000);
}
function formatTime(time) {
const minutes = Math.floor(time / 60);
let seconds = time % 60;
return `${minutes}:${seconds}`;
}
function setRemainingPathColor(timeLeft) {
const { alert, warning, info } = COLOR_CODES;
if (timeLeft <= alert.threshold) {
document
.getElementById("base-timer-path-remaining")
.classList.remove(warning.color);
document
.getElementById("base-timer-path-remaining")
.classList.add(alert.color);
} else if (timeLeft <= warning.threshold) {
document
.getElementById("base-timer-path-remaining")
.classList.remove(info.color);
document
.getElementById("base-timer-path-remaining")
.classList.add(warning.color);
}
}
function calculateTimeFraction() {
const rawTimeFraction = timeLeft / TIME_LIMIT;
return rawTimeFraction - (1 / TIME_LIMIT) * (1 - rawTimeFraction);
}
function setCircleDasharray() {
const circleDasharray = `${(
calculateTimeFraction() * FULL_DASH_ARRAY
).toFixed(0)} 283`;
document
.getElementById("base-timer-path-remaining")
.setAttribute("stroke-dasharray", circleDasharray);
}
</script>
<script>
$(function() {
$("#next").click(function() {
next();
console.log('adad');
});
});
function next() {
tretment_id = <?=json_encode($get_my_books['tretment_id'])?>;
book_id = <?=json_encode($get_my_books['book_id'])?>;
$.post("work/order/ajax/go_to_step_3_ajax.php", {
tretment_id,
book_id,
}, function(get_data) {
$("#get_data").html(get_data);
})
}
</script>
</body>
</html>