.-.-.-.-.-

<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Holiday Program Cleaning Checklist</title>
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
    <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap" rel="stylesheet">
    <style>
        @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;600&display=swap');

body {
            font-family: 'Poppins', sans-serif;
            background: url('https://localhost/CleaningChecklist/cover.jpg') no-repeat center center fixed;
            background-size: cover;
            padding: 20px;
            margin: 0;
        }

.container {
            background-color: #fff;
            background: linear-gradient(to right, #e2e5e7, #ffffff);
            box-shadow: 0 0 30px rgba(0, 0, 0, 0.3);
            padding: 40px;
            border-radius: 20px;
            max-width: 800px;
            margin: auto;
        }

.header {
            text-align: center;
            margin-bottom: 40px;
        }

.header img {
            width: 160px;
            height: auto;
        }

h1 {
            text-align: center;
            font-size: 3.5em;
            margin-bottom: 30px;
            color: #1e3c72;
            text-shadow: 3px 3px 5px rgba(0, 0, 0, 0.3);
            background: linear-gradient(to right, #1e3c72, #2a5298);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            font-family: 'Poppins', sans-serif;
        }

.form-group label {
            font-weight: bold;
            color: #1e3c72;
            font-size: 1.3em;
            text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
        }

.form-control {
            border: 2px solid #2a5298;
            border-radius: 10px;
            font-size: 1.0em;
            padding: 14px;
            width: 100%;
            margin-bottom: 25px;
            transition: all 0.3s ease;
        }

.form-control:focus {
            outline: none;
            border-color: #1e3c72;
            box-shadow: 0 0 7px rgba(30, 60, 114, 0.5);
        }

.form-check-label {
            font-weight: bold;
            color: #1e3c72;
            margin-left: 10px;
            font-size: 1.3em;
            text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
        }

.signature-pad {
            border: 2px dashed #2a5298;
            border-radius: 10px;
            height: 150px;
            background-color: #fff;
            box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
            margin-top: 25px;
            display: flex;
            justify-content: center;
            align-items: center;
        }

.signature-pad:hover {
            border-color: #1e3c72;
        }

.note {
            font-size: 1.2em;
            color: #1e3c72;
            margin-top: 25px;
            text-align: center;
            text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
        }

.section h2 {
            font-size: 1.5em;
            color: #1e3c72;
            margin-bottom: 20px;
            text-align: left;
            background: linear-gradient(to right, #1e3c72, #2a5298);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
            font-family: 'Poppins', sans-serif;
        }

.btn-primary {
            background: linear-gradient(to right, #2a5298, #1e3c72);
            color: #fff;
            border: none;
            padding: 15px 30px;
            border-radius: 8px;
            cursor: pointer;
            font-size: 20px;
            margin-top: 35px;
            display: block;
            width: 100%;
            transition: all 0.3s ease;
        }

.btn-primary:hover {
            background: linear-gradient(to right, #1e3c72, #2a5298);
        }

.footer {
            border-top: 1px solid #ccc;
            padding-top: 20px;
            margin-top: 35px;
            font-size: 1em;
            color: #555;
            text-align: center;
        }
        .section {
            margin-bottom: 20px;
        }

.form-check {
            display: flex;
            align-items: center;
            margin-bottom: 5px;
        }

.form-check-input {
            width: 20px;
            height: 20px;
            margin-right: 20px; /* Small space between checkbox and label */
            padding: 20px;
        }

.form-check-label {
            margin: 0;
            font-weight: normal; /* Ensure sentences are not bold */
        }

.footer a {
            color: #1e3c72;
            text-decoration: none;
        }

.footer a:hover {
            text-decoration: underline;
        }
    </style>
</head>
<?php
date_default_timezone_set("Australia/Sydney");

// Show error if no id is passed with the URL parameter
if (!isset($_GET['task_id'])) {
    echo "Invalid Request";
    exit();
} else {
    $task_id = $_GET['task_id'];

require_once '../Service/TaskService.php';
    require_once '../Service/SubtaskService.php';

$taskService = new TaskService();
    $subtaskService = new SubtaskService();

// Get task details
    $task = $taskService->getTaskById($task_id);

// Fetch all subtasks for the given task_id
    $subtasks = $subtaskService->getAllSubtasksForTask($task_id);

$taskOwnerEmail = $task->assignedCleaneremail;

//check if the task owner email is equil form the email from the url
    if($taskOwnerEmail != $_GET['email']){
        echo "Unauthorized Access";
        exit();
    }

// Check if subtasks are empty
    if (empty($subtasks)) {
        echo "No subtasks found for this task";
        exit();
    }

// Check if TODAY exists in subtask dates and get the corresponding subtask
    $today_date = date('Y-m-d');
    $today_subtask = null;

foreach ($subtasks as $subtask) {
        if ($subtask->subtask_date == $today_date) {
            $today_subtask = $subtask;
            break;
        }
    }

// If no subtask found for today, show an appropriate message
    if (!$today_subtask) {
        echo "No subtasks scheduled for today";
        exit();
    }

// Check if assigned cleaner email is null in task
    if ($task->assignedCleaneremail == null) {
        echo "No cleaner assigned to this task";
        exit();
    }

// Check if subtask has already been submitted
    if ($today_subtask->completed == 1 && $today_subtask->completed_at != null && $today_subtask->form_submission_id != null) {
        echo "This subtask has already been submitted. <br> View the submitted form <a href='completedsubtaskform.php?id=$today_subtask->form_submission_id'>here</a>";
        exit();
    }

// Display the found subtask details
    //echo "Subtask found for today: <br>";
    //echo "Subtask ID: " . $today_subtask->id . "<br>";c
    //echo "Subtask Date: " . $today_subtask->subtask_date . "<br>";
    // Additional details display or processing can be added here
}
?>

<body>

<div class="container">
    <div class="header">
        <div class="company-name">Emera Facility Services</div>
        <img src="../src/img/Emera-Primary-Logo.png" alt="Company Logo">
    </div>

<h1>Holiday Program Cleaning Checklist</h1>

<input type="text" class="form-control" id="subtask_id" name="subtask_id" value="<?php echo htmlspecialchars($subtask->id); ?>" hidden>

</div>
        <div class="form-group">
            <label for="schoolName">School Name:</label>
            
            <h3 id="schoolName"><?php echo htmlspecialchars($subtask->service_name); ?></h3>
        </div>

<div class="form-group">
            <label for="date">Date:</label>
            
            <h3 id="date"><?php echo htmlspecialchars($subtask->subtask_date); ?></h3>
        </div>

<div class="section">
            <h2>Main Area</h2>
            <div class="form-check">
                <input class="form-check-input" type="checkbox" id="main1" data-section="mainArea" value="Vacuum/Sweep hard floors and carpet areas">
                <label class="form-check-label" for="main1">Vacuum/Sweep hard floors and carpet areas</label>
            </div>
            <div class="form-check">
                <input class="form-check-input" type="checkbox" id="main2" data-section="mainArea" value="Disinfect and mop hard floor areas">
                <label class="form-check-label" for="main2">Disinfect and mop hard floor areas</label>
            </div>
            <div class="form-check">
                <input class="form-check-input" type="checkbox" id="main3" data-section="mainArea" value="Bin Emptied">
                <label class="form-check-label" for="main3">Bin Emptied</label>
            </div>
        </div>

<div class="section">
            <h2>Kitchen Area</h2>
            <div class="form-check">
                <input class="form-check-input" type="checkbox" id="kitchen1" data-section="kitchenArea" value="Vacuum/Sweep hard floors">
                <label class="form-check-label" for="kitchen1">Vacuum/Sweep hard floors</label>
            </div>
            <div class="form-check">
                <input class="form-check-input" type="checkbox" id="kitchen2" data-section="kitchenArea" value="Disinfect and mop hard floor areas">
                <label class="form-check-label" for="kitchen2">Disinfect and mop hard floor areas</label>
            </div>
            <div class="form-check">
                <input class="form-check-input" type="checkbox" id="kitchen3" data-section="kitchenArea" value="Clean and wipe benchtops surroundings">
                <label class="form-check-label" for="kitchen3">Clean and wipe benchtops surroundings</label>
            </div>
            <div class="form-check">
                <input class="form-check-input" type="checkbox" id="kitchen4" data-section="kitchenArea" value="Bin Emptied">
                <label class="form-check-label" for="kitchen4">Bin Emptied</label>
            </div>
        </div>

<div class="section">
            <h2>Bathrooms and Toilets</h2>
            <div class="form-check">
                <input class="form-check-input" type="checkbox" id="bathroom1" data-section="bathroomArea" value="Clean and disinfect sinks and taps">
                <label class="form-check-label" for="bathroom1">Clean and disinfect sinks and taps</label>
            </div>
            <div class="form-check">
                <input class="form-check-input" type="checkbox" id="bathroom2" data-section="bathroomArea" value="Clean and disinfect toilets">
                <label class="form-check-label" for="bathroom2">Clean and disinfect toilets</label>
            </div>
            <div class="form-check">
                <input class="form-check-input" type="checkbox" id="bathroom3" data-section="bathroomArea" value="Floor sweep and mop">
                <label class="form-check-label" for="bathroom3">Floor sweep and mop</label>
            </div>
            <div class="form-check">
                <input class="form-check-input" type="checkbox" id="bathroom4" data-section="bathroomArea" value="Bin Emptied">
                <label class="form-check-label" for="bathroom4">Bin Emptied</label>
            </div>
        </div>

<div class="form-group">
            <label for="notes">Notes:</label>
            <textarea class="form-control" id="notes" name="notes" rows="4"></textarea>
        </div>

<div class="row">
            <div class="col-md-6">
                <div class="form-group">
                    <label for="clientName">Client Representative Name:</label>
                    <input type="text" class="form-control" id="clientName" name="clientName" required>
                </div>
                <div class="form-group">
                    <label for="clientSignature">Client Representative Signature:</label>
                    <canvas id="clientSignature" class="signature-pad" onclick="openSignatureModal('client')"></canvas>
                </div>
            </div>
            <div class="col-md-6">
                <div class="form-group">
                    <label for="staffName">Emera Staff Member Name:</label>
                    <input type="text" class="form-control" id="staffName" name="staffName" required>
                </div>
                <div class="form-group">
                    <label for="staffSignature">Emera Staff Member Signature:</label>
                    <canvas id="staffSignature" class="signature-pad" onclick="openSignatureModal('staff')"></canvas>
                </div>
            </div>
        </div>

<div class="note">
            This document is to be completed after every visit from the professional cleaner. Once completed, please take a photo and send it to your supervisor.
        </div>

<div class="footer">
        <p>Emera Facility Services</p>
        <p><a href="www.emerafs.com.au" target="_blank">www.emerafs.com.au</a></p>
        <p>16 Stelvio Close, Lynbrook, VIC 3975</p>
        <p>10/440 Collins St, Melbourne VIC 3000</p>
        <p>Phone: 1300 153 114 | Email: <a href="mailto:hello@emerafs.com.au">hello@emerafs.com.au</a></p>
    </div>
</div>

<div class="modal fade" id="signatureModal" tabindex="-1" role="dialog" aria-labelledby="signatureModalLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="signatureModalLabel">Add Signature</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <canvas id="modalSignaturePad" class="signature-pad"></canvas>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" id="clearSignature">Clear</button>
                <button type="button" class="btn btn-primary" id="saveSignature">Save</button>
            </div>
        </div>
    </div>
</div>

function openSignatureModal(type) {
                $('#signatureModal').modal('show');
                activeSignaturePad = type === 'client' ? signaturePadClient : signaturePadStaff;
                modalSignaturePad.clear();
                if (!activeSignaturePad.isEmpty()) {
                    modalSignaturePad.fromData(activeSignaturePad.toData());
                }
            }

document.getElementById('clientSignature').addEventListener('click', function () {
                openSignatureModal('client');
            });

document.getElementById('staffSignature').addEventListener('click', function () {
                openSignatureModal('staff');
            });

document.getElementById('clearSignature').addEventListener('click', function () {
                modalSignaturePad.clear();
                if (activeSignaturePad) {
                    activeSignaturePad.clear();
                }
            });

function collectChecklistData() {
                const sections = ['mainArea', 'kitchenArea', 'bathroomArea']; // Add other sections if necessary
                const checklistData = {};

sections.forEach(section => {
                    checklistData[section] = [];
                    document.querySelectorAll(`input[data-section="${section}"]:checked`).forEach(item => {
                        checklistData[section].push(item.value);
                    });
                });

return checklistData;
            }

document.getElementById('cleaningChecklistForm').addEventListener('submit', function (e) {
                e.preventDefault();

if (signaturePadClient.isEmpty() || signaturePadStaff.isEmpty()) {
                    Swal.fire({
                        icon: 'error',
                        title: 'Missing Signatures',
                        text: 'Please provide both signatures.'
                    });
                    return;
                }

// Serialize checklist data to JSON
                const checklistData = collectChecklistData();
                document.getElementById('checklist_json').value = JSON.stringify(checklistData);

// Add signatures to hidden inputs
                document.getElementById('clientSignatureData').value = signaturePadClient.toDataURL();
                document.getElementById('staffSignatureData').value = signaturePadStaff.toDataURL();

// Get the geolocation data
                function getLocation() {
                    navigator.geolocation.getCurrentPosition(function(position) {
                        document.getElementById('latitude').value = position.coords.latitude;
                        document.getElementById('longitude').value = position.coords.longitude;

// Collect the form data
                        var formData = new FormData(document.getElementById('cleaningChecklistForm'));

//append school name, date and time to the form data
                        formData.append('schoolName', <?php echo json_encode($subtask->service_name); ?>);
                        formData.append('date', <?php echo json_encode($subtask->subtask_date); ?>);

const subtaskTime = <?php echo json_encode($subtask->subtask_time); ?>;

// Check if time is empty
                        if (subtaskTime == null || subtaskTime.trim() === "") {
                            // Set time to a default value, e.g., '00:00:00'
                            formData.append('time', '00:00:00');
                        } else {
                            formData.append('time', subtaskTime);
                        }
                        // Submit the form using fetch
                        fetch('submit_form.php', {
                            method: 'POST',
                            body: formData
                        })
                            .then(response => response.text())
                            .then(data => {
                                Swal.fire({
                                    icon: 'success',
                                    title: 'Form Submitted',
                                    text: data
                                }).then(() => {
                                    //reload the page
                                    location.reload();
                                });
                            })
                            .catch(error => {
                                Swal.fire({
                                    icon: 'error',
                                    title: 'Submission Error',
                                    text: 'An error occurred while submitting the form. Please try again.'
                                });
                            });
                    }, function(error) {
                        if (error.code === error.PERMISSION_DENIED) {
                            //submit form without geolocation set 0 to both fields
                            document.getElementById('latitude').value = 0;
                            document.getElementById('longitude').value = 0;

// Collect the form data
                            var formData = new FormData(document.getElementById('cleaningChecklistForm'));

//append school name, date and time to the form data
                            formData.append('schoolName', <?php echo json_encode($subtask->service_name); ?>);
                            formData.append('date', <?php echo json_encode($subtask->subtask_date); ?>);
                            const subtaskTime = <?php echo json_encode($subtask->subtask_time); ?>;

// Submit the form using fetch

fetch('submit_form.php', {
                                method: 'POST',
                                body: formData
                            })
                                .then(response => response.text())
                                .then(data => {
                                    Swal.fire({
                                        icon: 'success',
                                        title: 'Form Submitted',
                                        text: data
                                    }).then(() => {
                                        //reload the page
                                        location.reload();
                                    });
                                })
                                .catch(error => {
                                    Swal.fire({
                                        icon: 'error',
                                        title: 'Submission Error',
                                        text: 'An error occurred while submitting the form. Please try again.'
                                    });
                                });

} else {
                            Swal.fire({
                                icon: 'error',
                                title: 'Geolocation Error',
                                text: 'Unable to retrieve your location. Please try again or enable location services in your browser settings.'
                            });
                        }
                    });
                }

// Initial call to get location
                getLocation();
            });
        });

</script>
</body>
</html>

/home/emeraadmin/.cpanel/../www/pages/./taskform.php