conect data door loack and atribute to realtime firebase
This commit is contained in:
parent
4a2e57d538
commit
beb8a3d7c7
|
@ -19,19 +19,26 @@ public function index()
|
|||
// Ambil data dari Firebase
|
||||
$dht11 = $this->database->getReference('dht11')->getValue() ?? [];
|
||||
$security = $this->database->getReference('security')->getValue() ?? [];
|
||||
$smartcab = $this->database->getReference('smartcab')->getValue() ?? [];
|
||||
|
||||
// Ambil nilai spesifik
|
||||
$humidity = $dht11['humidity'] ?? 'N/A';
|
||||
$temperature = $dht11['temperature'] ?? 'N/A';
|
||||
$motion = $security['motion'] ?? 'N/A';
|
||||
$status = $security['status'] ?? 'N/A';
|
||||
$last_access = $smartcab['last_access'] ?? 'N/A';
|
||||
$status_device = $smartcab['status_device'] ?? 'N/A';
|
||||
$servo_status = $smartcab['servo_status'] ?? 'N/A';
|
||||
|
||||
// Kirim data ke tampilan
|
||||
return view('welcome', compact(
|
||||
'humidity',
|
||||
'temperature',
|
||||
'motion',
|
||||
'status'
|
||||
'status',
|
||||
'last_access',
|
||||
'status_device',
|
||||
'servo_status'
|
||||
));
|
||||
}
|
||||
}
|
||||
|
|
|
@ -191,8 +191,8 @@ class="p-2 text-gray-500 hover:text-gray-700 dark:text-gray-400 dark:hover:text-
|
|||
|
||||
<!-- Charts and Door Status Section -->
|
||||
<div class="mt-8 grid grid-cols-1 md:grid-cols-2 gap-4">
|
||||
<!-- Door Lock Status Card - Changed order for mobile -->
|
||||
<div class="bg-white dark:bg-gray-800 rounded-lg shadow-lg p-6 order-1 md:order-2">
|
||||
<!-- Door Lock Status Card -->
|
||||
<div class="bg-white dark:bg-gray-800 rounded-lg shadow-lg p-6">
|
||||
<!-- Door Status -->
|
||||
<div class="flex items-center mb-6">
|
||||
<div class="p-3 mr-4 text-green-500 bg-green-100 rounded-full dark:text-green-100 dark:bg-green-500">
|
||||
|
@ -202,7 +202,7 @@ class="p-2 text-gray-500 hover:text-gray-700 dark:text-gray-400 dark:hover:text-
|
|||
</div>
|
||||
<div>
|
||||
<p class="text-sm font-medium text-gray-600 dark:text-gray-400">Door Status</p>
|
||||
<p class="text-lg font-semibold text-green-600 dark:text-green-400" id="door-status">Locked</p>
|
||||
<p class="text-lg font-semibold text-green-600 dark:text-green-400" id="servo-status">{{ $servo_status }}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
@ -211,11 +211,11 @@ class="p-2 text-gray-500 hover:text-gray-700 dark:text-gray-400 dark:hover:text-
|
|||
<div class="grid grid-cols-2 gap-4">
|
||||
<div>
|
||||
<p class="text-sm font-medium text-gray-600 dark:text-gray-400">Last Access</p>
|
||||
<p class="text-lg font-semibold text-gray-700 dark:text-gray-200" id="last-access">Dikenali</p>
|
||||
<p class="text-lg font-semibold text-gray-700 dark:text-gray-200" id="last-access">{{ $last_access }}</p>
|
||||
</div>
|
||||
<div>
|
||||
<p class="text-sm font-medium text-gray-600 dark:text-gray-400">Device Status</p>
|
||||
<p class="text-lg font-semibold text-gray-700 dark:text-gray-200" id="device-status">Online</p>
|
||||
<p class="text-lg font-semibold text-gray-700 dark:text-gray-200" id="device-status">{{ $status_device }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -378,6 +378,9 @@ function updateUI(data) {
|
|||
toggle.checked = data.security.status === 'on';
|
||||
}
|
||||
}
|
||||
|
||||
// Add door status updates
|
||||
updateDoorStatus(data);
|
||||
}
|
||||
|
||||
// Function to fetch and update data
|
||||
|
@ -447,7 +450,7 @@ function toggleSecurity(checkbox) {
|
|||
|
||||
// Function to update chart data
|
||||
function updateChart(timestamp, temperature, humidity) {
|
||||
const MAX_DATA_POINTS = 10;
|
||||
const MAX_DATA_POINTS = 5;
|
||||
|
||||
// Check if there's any change in the latest data
|
||||
const lastTempData = sensorChart.data.datasets[0].data[sensorChart.data.datasets[0].data.length - 1];
|
||||
|
@ -740,7 +743,7 @@ function toggleDoorLock() {
|
|||
}
|
||||
|
||||
function updateDoorStatus() {
|
||||
const doorStatus = document.getElementById('door-status');
|
||||
const doorStatus = document.getElementById('servo-status');
|
||||
if (doorStatus) {
|
||||
doorStatus.textContent = isDoorLocked ? 'Locked' : 'Unlocked';
|
||||
doorStatus.className = isDoorLocked
|
||||
|
@ -766,6 +769,49 @@ function updateDoorStatus() {
|
|||
}
|
||||
}, 5000);
|
||||
});
|
||||
|
||||
// Function to update door status UI
|
||||
function updateDoorStatus(data) {
|
||||
if (data.smartcab) {
|
||||
// Update servo status
|
||||
const servoStatus = document.getElementById('servo-status');
|
||||
if (servoStatus) {
|
||||
servoStatus.textContent = data.smartcab.servo_status;
|
||||
// Update color based on status
|
||||
if (data.smartcab.servo_status === 'Locked') {
|
||||
servoStatus.className = 'text-lg font-semibold text-green-600 dark:text-green-400';
|
||||
} else {
|
||||
servoStatus.className = 'text-lg font-semibold text-red-600 dark:text-red-400';
|
||||
}
|
||||
}
|
||||
|
||||
// Update last access
|
||||
const lastAccess = document.getElementById('last-access');
|
||||
if (lastAccess) {
|
||||
lastAccess.textContent = data.smartcab.last_access;
|
||||
}
|
||||
|
||||
// Update device status
|
||||
const deviceStatus = document.getElementById('device-status');
|
||||
if (deviceStatus) {
|
||||
deviceStatus.textContent = data.smartcab.status_device;
|
||||
// Update color based on status
|
||||
if (data.smartcab.status_device === 'Online') {
|
||||
deviceStatus.className = 'text-lg font-semibold text-green-600 dark:text-green-400';
|
||||
} else {
|
||||
deviceStatus.className = 'text-lg font-semibold text-green-600 dark:text-green-400';
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Listen for smartcab changes
|
||||
database.ref('smartcab').on('value', (snapshot) => {
|
||||
const data = snapshot.val();
|
||||
if (data) {
|
||||
updateDoorStatus(data);
|
||||
}
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
Loading…
Reference in New Issue