<?php include "../../root.class.php";
$html = new html();
$html->add_styles_page();
// $html->check_user_type("ADMIN");
$db = new db_safeguard();
session_start();


//get the current date and time
$current_date_time = date("Y-m-d H:i", strtotime("+2 hours"));

$jobcard_id = new input();
$jobcard_id->type("hidden");
$jobcard_id->name("jobcard_id");
$jobcard_id->id("jobcard_id");
$jobcard_id->value($_GET['jc_no']);

$date_time = new input();
$date_time->type("hidden");
$date_time->name("date_time");
$date_time->id("date_time");
$date_time->value($current_date_time);

$casing_label = new label();
$casing_label->for("casing");
$casing_label->value("CASING METERS");
$casing_label->addAttribute("style", "font-size: 1.5vw; color: white;");

$casing_meters = new input();
$casing_meters->type("number");
$casing_meters->placeholder("METERS");
$casing_meters->name("meters");
$casing_meters->id("meters");
$casing_meters->class("jobcard_inputs");

$casing_start = new button();
$casing_start->value("START");
$casing_start->onclick("casing_start()");

$casing_pause = new button();
$casing_pause->value("PAUSE");
$casing_pause->onclick("casing_pause()");

$casing_resume = new button();
$casing_resume->value("RESUME");
$casing_resume->onclick("casing_resume()");

$casing_stop = new button();
$casing_stop->value("STOP");
$casing_stop->onclick("casing_stop()");

$make_notes_btn = new button();
$make_notes_btn->value("MAKE NOTES");
$make_notes_btn->onclick("open_notesPopup()");

?>

<div class="form_down">
    <br><br>
    <?php
    $res_data = $db->query("jobcard_timeline", "SELECT * FROM jobcard_timeline WHERE jobcard_id = {$_GET['record_id']} ORDER BY record_id DESC LIMIT 1");
    $data = $res_data->fetch_assoc();

    $data_type = new input();
    $data_type->class("inputs");
    $data_type->type("hidden");
    $data_type->readonly();
    $data_type->value($data['type']);
    $data_type->add();

    $jobcard_id->add();

    $date_time->add();

    if ($data['type'] == "CASING") {

        $next = new button();
        $next->value("BACK");
        $next->onclick("next()");
        $next->style("background-color: #00008045; color: white;");

        ?>
        <h1>CASING</h1>
        <div style="display: flex; flex-direction: row;width: 100%;justify-content: center;">
            <?php
            $casing_start->add();
            $make_notes_btn->add();
            ?>
        </div>

        <?php
        $next->add();

        $casing_start_ajax = new js_ajax();
        $casing_start_ajax->function_name("casing_start");
        $casing_start_ajax->insert("jobcard_timeline");
        $casing_start_ajax->selected_div(".form_down input");
        $casing_start_ajax->add_column_and_value("jobcard_id={$_GET['record_id']},date_time=" . $current_date_time . ",type=CASING_START,user_id={$_SESSION['user_id']}");
        $casing_start_ajax->on_success("CASING STARTED");

    } else if ($data['type'] == "CASING_START") {

        ?>
            <h1>CASING</h1>

            <?php
            $make_notes_btn->add();

            ?>

            <div style="display: flex; flex-direction: row;width: 100%;justify-content: center;">
                <?php
                $casing_pause->add();
                $casing_stop->add();

                ?>
            </div>

            <?php
            $casing_meters->add();

            $casing_pause_ajax = new js_ajax();
            $casing_pause_ajax->function_name("casing_pause");
            $casing_pause_ajax->insert("jobcard_timeline");
            $casing_pause_ajax->selected_div(".form_down input");
            $casing_pause_ajax->add_column_and_value("jobcard_id={$_GET['record_id']},date_time=" . $current_date_time . ",type=CASING_PAUSE,user_id={$_SESSION['user_id']}");
            $casing_pause_ajax->on_success("CASING PAUSED");

            $casing_stop_ajax = new js_ajax();
            $casing_stop_ajax->function_name("casing_stop");
            $casing_stop_ajax->insert("jobcard_timeline");
            $casing_stop_ajax->selected_div(".form_down input");
            $casing_stop_ajax->add_column_and_value("jobcard_id={$_GET['record_id']},date_time=" . $current_date_time . ",type=CASING_STOP,user_id={$_SESSION['user_id']}");
            $casing_stop_ajax->on_success("CASING STOPPED");

    } elseif ($data['type'] == "CASING_PAUSE") {



        ?>
            <h1>CASING</h1>

            <?php
            $make_notes_btn->add();
            ?>
            <div style="display: flex; flex-direction: row;width: 100%;justify-content: center;">
                <?php
                $casing_resume->add();
                $casing_stop->add();
                ?>
            </div>

            <?php
            $casing_meters->add();


            $casing_resume_ajax = new js_ajax();
            $casing_resume_ajax->function_name("casing_resume");
            $casing_resume_ajax->insert("jobcard_timeline");
            $casing_resume_ajax->selected_div(".form_down input");
            $casing_resume_ajax->add_column_and_value("jobcard_id={$_GET['record_id']},date_time=" . $current_date_time . ",type=CASING_RESUME,user_id={$_SESSION['user_id']}");
            $casing_resume_ajax->on_success("CASING RESUMED");

            $casing_stop_ajax = new js_ajax();
            $casing_stop_ajax->function_name("casing_stop");
            $casing_stop_ajax->insert("jobcard_timeline");
            $casing_stop_ajax->selected_div(".form_down input");
            $casing_stop_ajax->add_column_and_value("jobcard_id={$_GET['record_id']},date_time=" . $current_date_time . ",type=CASING_STOP,user_id={$_SESSION['user_id']}");
            $casing_stop_ajax->on_success("CASING STOPPED");

    } elseif ($data['type'] == "CASING_RESUME") {


        ?>
            <h1>CASING</h1>

            <?php
            $make_notes_btn->add();
            ?>
            <div style="display: flex; flex-direction: row;width: 100%;justify-content: center;">
                <?php
                $casing_pause->add();
                $casing_stop->add();
                ?>
            </div>

            <?php
            $casing_meters->add();


            $casing_pause_ajax = new js_ajax();
            $casing_pause_ajax->function_name("casing_pause");
            $casing_pause_ajax->insert("jobcard_timeline");
            $casing_pause_ajax->selected_div(".form_down input");
            $casing_pause_ajax->add_column_and_value("jobcard_id={$_GET['record_id']},date_time=" . $current_date_time . ",type=CASING_PAUSE,user_id={$_SESSION['user_id']}");
            $casing_pause_ajax->on_success("CASING PAUSED");

            $casing_stop_ajax = new js_ajax();
            $casing_stop_ajax->function_name("casing_stop");
            $casing_stop_ajax->insert("jobcard_timeline");
            $casing_stop_ajax->selected_div(".form_down input");
            $casing_stop_ajax->add_column_and_value("jobcard_id={$_GET['record_id']},date_time=" . $current_date_time . ",type=CASING_STOP,user_id={$_SESSION['user_id']}");
            $casing_stop_ajax->on_success("CASING STOPPED");

    } elseif ($data['type'] == "CASING_STOP") {

        $next = new button();
        $next->value("DONE");
        $next->onclick("next()");

        ?>
            <h1>CASING</h1>
            <div style="display: flex; flex-direction: row;width: 100%;justify-content: center;">
                <?php
                $casing_start->add();
                $make_notes_btn->add();
                ?>
            </div>

            <?php
            $next->add();



            $casing_start_ajax = new js_ajax();
            $casing_start_ajax->function_name("casing_start");
            $casing_start_ajax->insert("jobcard_timeline");
            $casing_start_ajax->selected_div(".form_down input");
            $casing_start_ajax->add_column_and_value("jobcard_id={$_GET['record_id']},date_time=" . $current_date_time . ",type=CASING_START,user_id={$_SESSION['user_id']}");
            $casing_start_ajax->on_success("CASING STARTED");
    } else {

        $next = new button();
        $next->value("BACK");
        $next->onclick("next()");
        $next->style("background-color: #00008045; color: white;");

        ?>
            <h1>CASING</h1>
            <div style="display: flex; flex-direction: row;width: 100%;justify-content: center;">
                <?php
                $casing_start->add();
                $make_notes_btn->add();
                ?>
            </div>

            <?php
            $next->add();

            $casing_start_ajax = new js_ajax();
            $casing_start_ajax->function_name("casing_start");
            $casing_start_ajax->insert("jobcard_timeline");
            $casing_start_ajax->selected_div(".form_down input");
            $casing_start_ajax->add_column_and_value("jobcard_id={$_GET['record_id']},date_time=" . $current_date_time . ",type=CASING_START,user_id={$_SESSION['user_id']}");
            $casing_start_ajax->on_success("CASING STARTED");
    }

    ?>
</div>
<script>
    function next() {
        window.location.href = "../jobcards/jobcard_actions.php?record_id=<?php echo $_GET['record_id']; ?>&jc_no=<?php echo $_GET['jc_no']; ?>";
    }
</script>
<style>
    .notes_popup {
        position: fixed;
        z-index: 1000;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.5);
    }

    .notes_content {
        background: linear-gradient(90deg, #110151, #3331e7);
        margin: 3% auto;
        padding: 20px;
        border-radius: 10px;
        width: 80%;
        height: 85%;
        box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
        position: relative;
        overflow-y: scroll;
    }

    .notes_images {
        width: 10vw;
        height: 10vw;
    }

    .close-btn {
        position: absolute;
        top: 10px;
        right: 15px;
        font-weight: bolder;
        font-size: 5vw;
        cursor: pointer;
        color: white;
    }

    table {
        width: 95%;
        border-collapse: collapse;
    }

    th,
    td {
        padding: 10px;
        border: 3px solid black;
        text-align: left;
        background-color: white;
    }

    @media all and (min-width: 651px) and (max-width: 1050px) {

        .notes_content {
            width: 90%;
            height: 95%;
        }

        .close-btn {
            top: 0px;
            font-size: 15vw;
        }
    }
</style>
<script>
    function open_notesPopup() {
        document.getElementById("notes_popup1").style.display = "block";
    }

    function close_notesPopup() {
        document.getElementById("notes_popup1").style.display = "none";
    }

</script>
<div class="notes_popup" id="notes_popup1" style="z-index:99;display:none;">
    <div class="notes_content">
        <span class="close-btn" onclick="close_notesPopup()">&times;</span>

        <?php
        $res_data = $db->query("jobcard_timeline", "SELECT * FROM jobcard_timeline WHERE jobcard_id = {$_GET['record_id']} ORDER BY record_id DESC LIMIT 1");
        $data = $res_data->fetch_assoc();

        $jobcard_id = new input();
        $jobcard_id->type("hidden");
        $jobcard_id->name("jobcard_id");
        $jobcard_id->id("jobcard_id");
        $jobcard_id->value($_GET['jc_no']);

        $date_time = new input();
        $date_time->type("hidden");
        $date_time->name("date_time");
        $date_time->id("date_time");
        $date_time->value($current_date_time);

        $reasons_label = new label();
        $reasons_label->for("reasons");
        $reasons_label->value("REASONS");
        $reasons_label->addAttribute("style", "font-size: 1.5vw; color: white;");

        $reasons = new select();
        $reasons->class("inputs");
        $reasons->name("reason");
        $reasons->id("reason");
        $reasons->onchange("casing_option()");
        // $reasons->addAttribute("style", "width: 20%;");
        $reasons->add_option("ARRIVED AT LOCATION", "ARRIVED AT LOCATION");
        $reasons->add_option("WAITING FOR CLIENT", "WAITING FOR CLIENT");
        $reasons->add_option("TRAVELING TO SITE", "TRAVELING TO SITE");
        $reasons->add_option("ARRIVED ON SITE", "ARRIVED ON SITE");
        $reasons->add_option("TALKING TO CLIENT", "TALKING TO CLIENT");
        $reasons->add_option("FETCHING MONEY", "FETCHING MONEY");
        $reasons->add_option("BRAKING", "BRAKING");
        $reasons->add_option("CHANGING RIEMER", "CHANGING RIEMER");
        $reasons->add_option("STOP", "STOP");
        $reasons->add_option("PENDING", "PENDING");
        $reasons->add_option("START", "START");
        $reasons->add_option("INSTALLING", "INSTALLING");
        $reasons->add_option("RECEIVED", "RECEIVED");
        $reasons->add_option("BACK TO WORKSHOP", "BACK TO WORKSHOP");
        $reasons->add_option("OTHER", "OTHER");

        $notes_label = new label();
        $notes_label->for("notes");
        $notes_label->value("NOTES");
        $notes_label->addAttribute("style", "font-size: 4vw; color: white; margin:1px;");

        $notes = new input();
        $notes->class("inputs");
        $notes->type("text");
        $notes->placeholder("NOTES");
        $notes->name("note");
        $notes->id("note");
        $notes->addAttribute("style", "width: 50%;");

        $add_notes = new button();
        $add_notes->value("ADD NOTES");
        $add_notes->onclick("add_notes()");
        $add_notes->style("width: 100%;");
        $add_notes->id("notes_btn");

        $ajax = new js_ajax();
        $ajax->function_name("add_notes");
        $ajax->insert("notes");
        $ajax->selected_div(".notes_content input , .notes_content select ");
        $ajax->submit_btn_id("notes_btn");
        $ajax->on_success("NOTE SAVED");

        $data_type = new input();
        $data_type->class("inputs");
        $data_type->type("hidden");
        $data_type->readonly();
        $data_type->value($data['type']);
        $data_type->add();

        $jobcard_id->add();
        $date_time->add();
        $notes_label->add();
        ?>

        <div style="display: flex; flex-direction: column;">
            <?php
            $reasons_label->add();
            $reasons->add();
            ?>
        </div>

        <div id="normal_section" style="display: flex; flex-direction: column;align-items: center;">
            <?php
            $notes->add();

            new camera('image', $_GET['record_id'], "../jobcards/notes/", "notes_images");
            ?>
            <input type="text" style="display: none;" id="image" name="image">

            <?php
            $add_notes->add();

            $notes_ajax = new js_ajax();
            $notes_ajax->function_name("add_notes");
            $notes_ajax->insert("notes");
            $notes_ajax->selected_div(".notes_content input , .notes_content select ");
            $notes_ajax->submit_btn_id("notes_btn");
            $notes_ajax->on_success("NOTE SAVED");
            ?>


            <?php

            $notes_res = $db->query("notes", "SELECT * FROM notes WHERE jobcard_id = {$_GET['record_id']}");

            if ($notes_res->num_rows > 0) {
                while ($row = $notes_res->fetch_assoc()) {
                    $table_data = $table_data . "<tr>
                <td>" . $row['reason'] . "</td>
                <td>" . $row['note'] . "</td>
                <td>" . $row['image'] . "</td>
                <td>" . $row['date_time'] . "</td>
                </tr>";
                }
                $notes = $notes_res->fetch_assoc();

            } else {
                $table_data = $table_data . "<tr><td></td>
            <td>NO NOTES RECORDED</td><td></td><td></td>
            </tr><br>";

            }
            ?>

            <div style="background-color: white;padding-left: 2vw;padding-top: 2vw;">
                <table>
                    <tr>
                        <th>REASON</th>
                        <th>NOTE</th>
                        <th>IMAGE</th>
                        <th>DATE TIME</th>
                    </tr>
                    <?php echo $table_data; ?>
                </table>
                <br>
            </div>
        </div>

        <div id="casing_section" style="display: none; flex-direction: column;align-items: center;">
            <?php
            $res_data = $db->query("jobcard_timeline", "SELECT * FROM jobcard_timeline WHERE jobcard_id = {$_GET['record_id']} ORDER BY record_id DESC LIMIT 1");
            $data = $res_data->fetch_assoc();

            $data_type = new input();
            $data_type->class("inputs");
            $data_type->type("hidden");
            $data_type->readonly();
            $data_type->value($data['type']);
            $data_type->add();

            $jobcard_id->add();

            $date_time->add();
            ?>

        </div>
    </div>

</div>
<br><br>

</div>