<?php

error_reporting(E_ALL);
ini_set('display_errors', 1);

require_once("config.php");


/* ===============================
   LOGIN CHECK
================================ */

if (!isset($_SESSION['userid'])) {
    header("Location: login.php");
    exit;
}


/* ===============================
   DEBUG
================================ */

$DEBUG = true;

function dbg($msg)
{
    global $DEBUG;

    if ($DEBUG) {
        echo "
        <div style='
            background:#111;
            color:#00ff00;
            padding:10px;
            font-family:monospace;
        '>
        $msg
        </div>
        ";
    }
}


/* ===============================
   DEFAULT DEVICE
================================ */

$DEVID = $conn->real_escape_string(
    $_GET['devid'] ?? "Pmon-9999"
);

dbg("DEVID = ".$DEVID);


/* ===============================
   CREATE BOX
================================ */
if (isset($_POST['save'])) {

    $item = $conn->real_escape_string($_POST['item']);
    $url  = $conn->real_escape_string($_POST['url']);


    $sql = "

        INSERT INTO pms_dashboard_links
        (
            item,
            url,
            created_by
        )

        VALUES
        (
            '$item',
            '$url',
            '".$_SESSION['userid']."'
        )

    ";


    dbg($sql);

    $conn->query($sql);


    /* Prevent duplicate insert on refresh */

    header(

        "Location: dashboard.php?devid=".$DEVID

    );

    exit;
}

/* ===============================
   DELETE BOX
================================ */

if (isset($_POST['delete_box'])) {

    $id = intval($_POST['deleteid']);

    $sql = "

        DELETE FROM
            pms_dashboard_links

        WHERE
            id='$id'

    ";

    dbg($sql);

    $conn->query($sql);
}



/* ===============================
   LOAD DEVICE DATA
================================ */

$sql = "

    SELECT

        c1,
        c2,
        c4,

        time,
        day,
        month,
        year,

        devid

    FROM sleep_data2

    WHERE devid='$DEVID'

    ORDER BY id DESC

    LIMIT 1

";

dbg($sql);


$q = $conn->query($sql);

$row = $q->fetch_assoc();


if (!$row) {

    die(

        "No data found for:

        ".$DEVID

    );

}



/* ===============================
   MAP VALUES
================================ */

$hr = $row['c4'];

$rr = $row['c2'];

$bed = ($row['c1'])
    ? "IN BED"
    : "OUT OF BED";


$ist = sprintf(

    "%02d/%02d/%04d %s",

    $row['day'],
    $row['month'],
    $row['year'],
    $row['time']

);


dbg(

    "HR=".$hr.
    " RR=".$rr.
    " BED=".$be

);



/* ===============================
   LOAD CAPABILITY BOXES
================================ */

$links = $conn->query(

    "

    SELECT *

    FROM pms_dashboard_links

    ORDER BY id DESC

    "

);

?>

<!DOCTYPE html>

<html>

<head>

<meta
name="viewport"
content="width=device-width,initial-scale=1">


<style>


body{

margin:0;
background:#000;
color:white;
font-family:Arial;

}



/* ================== */

.top{

padding:18px;

background:

linear-gradient(

90deg,

#17394d,
#325f78

);

display:flex;

justify-content:
space-between;

font-size:
18px;

}



.panel{

margin:15px;

padding:20px;

background:#111;

border:
2px solid #00bfff;

border-radius:
20px;

}



.row{

display:flex;

justify-content:
space-between;

padding:
12px 0;

border-bottom:
1px solid #333;

font-size:
20px;

}



.device{

text-align:center;

}



.device img{

width:
180px;

margin-top:
20px;

}



/* ================== */

.card{

margin:15px;

padding:20px;

background:#111;

border:
2px solid #00bfff;

border-radius:
20px;

text-align:
center;

}



.value{

font-size:
55px;

font-weight:
bold;

}



/* ================== */

.cap{

font-size:
30px;

text-align:
center;

padding:
20px;

}



/* ==================
CAPABILITY BOXES
================== */

.boxgrid{

display:

grid;

grid-template-columns:

repeat(

auto-fit,

minmax(

160px,

1fr

)

);

gap:

15px;

padding:

15px;

}



.box{

background:

#111;

border:

2px solid #00bfff;

border-radius:

20px;

min-height:

110px;

display:

flex;

justify-content:

center;

align-items:

center;

text-decoration:

none;

color:

white;

font-size:

22px;

position:

relative;

padding:

10px;

text-align:

center;

}



.box:hover{

box-shadow:

0 0 20px

rgba(

0,
191,
255,
0.3

);

}



.watched{

position:

absolute;

right:

8px;

bottom:

8px;

width:

22px;

height:

22px;

background:

green;

border-radius:

50%;

display:

none;

text-align:

center;

line-height:

22px;

font-size:

14px;

}



/* ==================
FORMS
================== */

.form{

padding:

15px;

display:

flex;

gap:

10px;

flex-wrap:

wrap;

}



input,
button,
select{

padding:

12px;

border:

none;

border-radius:

10px;

}



button{

background:

#00bfff;

color:

white;

}



/* ==================
MOBILE
================== */

@media(

max-width:700px

){

.value{

font-size:

45px;

}


.box{

font-size:

18px;

}


.top{

font-size:

14px;

}

}


</style>


</head>



<body>



<div class="top">


<div>

PMS Dashboard

</div>



<div>

<?=

$ist

?>


|


<?=

$_SESSION['userid']

??

'Guest'

?>


</div>



</div>







<div class="panel">


<div class="row">

Status

<span style="color:#00ff44">

Online

</span>

</div>



<div class="row">

Location

<span>

Home

</span>

</div>



<div class="row">

Device

<span>

<?=

$row['devid']

?>

</span>

</div>



<div class="row">

Updated

<span>

<?=

$ist

?>

</span>

</div>




<div class="device">


<img

src="pmsmaster2.png"


>


</div>


</div>








<div class="card">


❤️


<h2>

HEART RATE

</h2>



<div class="value">

<?=

$hr

?>

</div>



<div>

BPM

</div>



<br>


Lo:40 | Hi:120


</div>








<div class="card">


💨


<h2>

RESPIRATION

</h2>



<div class="value">

<?=

$rr

?>

</div>



<div>

RPM

</div>



<br>


Lo:10 | Hi:25


</div>








<div class="card">


🛏️


<h2>

BED STATUS

</h2>



<div

class="value"

style="font-size:40px"


>


<?=

$bed

?>


</div>


</div>








<div class="cap">


TO KNOW CAPABILITIES

<br>

CLICK BELOW


</div>








<div class="boxgrid">


<?php

while(

$x=

$links->fetch_assoc()

){

?>


<a

class="box"

href="<?=

$x['url']

?>"

target="_blank"


onclick="watch(

<?=

$x['id']

?>

)"

>



<?=

$x['item']

?>





<div

class="watched"

id="w<?=

$x['id']

?>

">


✓


</div>



</a>


<?php

}

?>


</div>









<form
method="post"

class="form">


<input

name="item"

placeholder="Box Name"

required>



<input

name="url"

placeholder="URL"

required>



<button

name="save"


>

Create


</button>


</form>








<form
method="post"

class="form">


<select

name="deleteid"


>


<?php

$d=
$conn->query(

"

SELECT *

FROM

pms_dashboard_links

"

);



while(

$r=

$d->fetch_assoc()

){

?>


<option

value="<?=

$r['id']

?>

">


<?=

$r['item']

?>


</option>



<?php

}

?>


</select>



<button

name="delete_box"


>

Delete


</button>



</form>








<script>


function watch(

id

){

localStorage.setItem(

'w'+id,

1

);

}




window.onload=

function(){


document

.querySelectorAll(

'.watched'

)

.forEach(

function(

x

){

if(

localStorage.getItem(

x.id

)

){

x.style.display=

'block';

}

});


}


</script>





</body>

</html>