You've already forked Atomcms-edit
72 lines
3.1 KiB
PHP
Executable File
72 lines
3.1 KiB
PHP
Executable File
@extends('layouts.app')
|
|
|
|
@section('title', __('radio.shouts') . ' - ' . config('app.name'))
|
|
|
|
@section('content')
|
|
<div class="max-w-7xl mx-auto py-12 px-4 sm:px-6 lg:px-8">
|
|
<div class="bg-gray-800 overflow-hidden shadow-sm sm:rounded-lg">
|
|
<div class="p-6 text-white">
|
|
<h2 class="text-2xl font-bold mb-4">{{ __('radio.shouts') }}</h2>
|
|
|
|
@if(session('success'))
|
|
<div class="bg-green-500 text-white p-4 rounded mb-4">
|
|
{{ session('success') }}
|
|
</div>
|
|
@endif
|
|
|
|
<form action="{{ route('radio.shouts.store') }}" method="POST" class="mb-8">
|
|
@csrf
|
|
<div>
|
|
<label for="message" class="block text-sm font-medium text-gray-300">{{ __('radio.shout_message') }}</label>
|
|
<textarea name="message" id="message" required rows="3" maxlength="280" placeholder="{{ __('radio.shout_placeholder') }}" class="mt-1 block w-full rounded-md bg-gray-700 border-gray-600 text-white focus:border-indigo-500 focus:ring-indigo-500"></textarea>
|
|
<p class="text-xs text-gray-400 mt-1">{{ __('radio.max_chars') }}</p>
|
|
</div>
|
|
<div class="mt-4">
|
|
<button type="submit" class="bg-indigo-600 hover:bg-indigo-700 text-white font-bold py-2 px-4 rounded">
|
|
{{ __('radio.send_shout') }}
|
|
</button>
|
|
</div>
|
|
</form>
|
|
|
|
<div id="shouts-container" class="space-y-4">
|
|
{{-- Shouts will be loaded via API --}}
|
|
<div class="text-center text-gray-400">{{ __('radio.loading') }}</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
@push('scripts')
|
|
<script>
|
|
function loadShouts() {
|
|
fetch('/api/radio/shouts')
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
const container = document.getElementById('shouts-container');
|
|
if (data.shouts && data.shouts.length > 0) {
|
|
container.innerHTML = data.shouts.map(shout => `
|
|
<div class="bg-gray-700 p-4 rounded-lg">
|
|
<div class="flex justify-between items-center mb-2">
|
|
<span class="font-bold text-indigo-400">${shout.username}</span>
|
|
<span class="text-xs text-gray-400">${shout.created_at}</span>
|
|
</div>
|
|
<p class="text-gray-300">${shout.message}</p>
|
|
</div>
|
|
`).join('');
|
|
} else {
|
|
container.innerHTML = "<p class='text-center text-gray-400'>{{ __('radio.no_shouts') }}</p>";
|
|
}
|
|
})
|
|
.catch(() => {
|
|
document.getElementById('shouts-container').innerHTML = "<p class='text-center text-red-400'>{{ __('radio.load_error') }}</p>";
|
|
});
|
|
}
|
|
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
loadShouts();
|
|
setInterval(loadShouts, 30000); // Reload every 30 seconds
|
|
});
|
|
</script>
|
|
@endpush
|
|
@endsection
|