44 lines
1.6 KiB
PHP
44 lines
1.6 KiB
PHP
<x-app-layout>
|
|
<x-slot name="header">
|
|
<h2 class="font-semibold text-xl text-gray-800 leading-tight">
|
|
{{ __('Dashboard') }}
|
|
</h2>
|
|
</x-slot>
|
|
|
|
<div class="py-12">
|
|
<div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
|
|
<div class="bg-white overflow-hidden shadow-sm sm:rounded-lg">
|
|
<div class="p-6 text-gray-900">
|
|
<div id="tmi-status" class="mt-4"></div>
|
|
<div id="chat-messages" class="mt-4"></div>
|
|
<div id="dice-result" class="mt-4"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</x-app-layout>
|
|
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
const tmiStatus = document.getElementById('tmi-status');
|
|
const chatMessages = document.getElementById('chat-messages');
|
|
const diceResult = document.getElementById('dice-result');
|
|
|
|
window.addEventListener('tmi-connected', function() {
|
|
tmiStatus.innerText = 'Connected to Twitch chat!';
|
|
});
|
|
|
|
window.addEventListener('chat-message', function(event) {
|
|
console.log('Chat Message Event:', event.detail);
|
|
const message = document.createElement('div');
|
|
message.innerText = `${event.detail.user} : ${event.detail.message}`;
|
|
chatMessages.appendChild(message);
|
|
});
|
|
|
|
window.addEventListener('dice-rolled', function(event) {
|
|
console.log('Dice Rolled Event:', event.detail);
|
|
diceResult.innerText = 'Dice roll result: ' + event.detail;
|
|
});
|
|
});
|
|
</script>
|