starred/newznab-tmux
1
0
Fork 0
mirror of https://github.com/NNTmux/newznab-tmux.git synced 2026-09-03 03:38:52 +00:00
Code Issues Packages Projects Releases Wiki Activity

Update console list and edit pages

Browse Source
This commit is contained in:
DariusIII
2025-04-14 16:07:00 +02:00
parent 54ea8750b2
commit 2cf40dfa3b
2 changed files with 384 additions and 117 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/views/themes/admin/console-edit.tpl
+228 -90
View File
@@ -1,105 +1,243 @@
<h1>{$title}</h1>
<div class="card card-body">
<a class="btn btn-success" href="{{url("/admin/console-list")}}"><i class="fa fa-arrow-left"></i> Go
back</a>
<form enctype="multipart/form-data" action="console-edit?action=submit" method="post">
{{csrf_field()}}
<div class="card">
<div class="card-header">
<div class="d-flex justify-content-between align-items-center">
<h4 class="mb-0">{$title}</h4>
<a href="{{url("/admin/console-list")}}" class="btn btn-outline-secondary">
<i class="fa fa-arrow-left me-2"></i>Back to Console List
</a>
</div>
</div>
<input type="hidden" name="id" value="{$console.id}"/>
<div class="card-body">
<form enctype="multipart/form-data" action="console-edit?action=submit" method="post" class="needs-validation" novalidate>
{{csrf_field()}}
<input type="hidden" name="id" value="{$console.id}"/>
<table class="input data table table-striped responsive-utilities jambo-table">
<div class="row g-3">
<!-- Basic Information -->
<div class="col-12">
<h5 class="border-bottom pb-2 mb-3">Console Information</h5>
</div>
<tr>
<td><label for="title">Title</label>:</td>
<td>
<input id="title" class="long" name="title" type="text" value="{$console.title|escape:'htmlall'}"/>
</td>
</tr>
<div class="col-md-12 mb-3">
<label for="title" class="form-label">Title</label>
<input id="title" class="form-control" name="title" type="text" value="{$console.title|escape:'htmlall'}" required />
<div class="invalid-feedback">Please enter a title</div>
</div>
<tr>
<td><label for="asin">ASIN</label>:</td>
<td>
<input id="asin" name="asin" type="text" value="{$console.asin|escape:'htmlall'}"/>
</td>
</tr>
<div class="col-md-6 mb-3">
<label for="asin" class="form-label">ASIN</label>
<div class="input-group">
<span class="input-group-text"><i class="fa fa-barcode"></i></span>
<input id="asin" class="form-control" name="asin" type="text" value="{$console.asin|escape:'htmlall'}" />
</div>
</div>
<tr>
<td><label for="url">URL</label>:</td>
<td>
<input id="url" class="long" name="url" type="text" value="{$console.url|escape:'htmlall'}"/>
</td>
</tr>
<div class="col-md-6 mb-3">
<label for="platform" class="form-label">Platform</label>
<div class="input-group">
<span class="input-group-text"><i class="fa fa-gamepad"></i></span>
<input id="platform" class="form-control" name="platform" type="text" value="{$console.platform|escape:'htmlall'}" required />
</div>
<div class="invalid-feedback">Please specify the platform</div>
</div>
<tr>
<td><label for="salesrank">Sales Rank</label>:</td>
<td>
<input id="salesrank" class="short" type="text" name="salesrank"
value="{$console.salesrank|escape:'htmlall'}"/>
</td>
</tr>
<div class="col-md-6 mb-3">
<label for="genre" class="form-label">Genre</label>
<select id="genre" name="genre" class="form-select" required>
{foreach $genres as $gen}
<option {if $gen.id == $console.genres_id}selected="selected"{/if} value="{$gen.id}">{$gen.title|escape:'htmlall'}</option>
{/foreach}
</select>
<div class="invalid-feedback">Please select a genre</div>
</div>
<tr>
<td><label for="platform">Platform</label>:</td>
<td>
<input id="platform" class="long" name="platform" type="text"
value="{$console.platform|escape:'htmlall'}"/>
</td>
</tr>
<div class="col-md-6 mb-3">
<label for="publisher" class="form-label">Publisher</label>
<div class="input-group">
<span class="input-group-text"><i class="fa fa-building"></i></span>
<input id="publisher" class="form-control" name="publisher" type="text" value="{$console.publisher|escape:'htmlall'}" />
</div>
</div>
<tr>
<td><label for="publisher">Publisher</label>:</td>
<td>
<input id="publisher" class="long" name="publisher" type="text"
value="{$console.publisher|escape:'htmlall'}"/>
</td>
</tr>
<div class="col-md-6 mb-3">
<label for="releasedate" class="form-label">Release Date</label>
<div class="input-group">
<span class="input-group-text"><i class="fa fa-calendar"></i></span>
<input id="releasedate" class="form-control" name="releasedate" type="text" value="{$console.releasedate|escape:'htmlall'}" placeholder="YYYY-MM-DD" />
</div>
</div>
<tr>
<td><label for="releasedate">Release Date</label>:</td>
<td>
<input id="releasedate" name="releasedate" type="text"
value="{$console.releasedate|escape:'htmlall'}"/>
</td>
</tr>
<div class="col-md-6 mb-3">
<label for="esrb" class="form-label">Rating</label>
<div class="input-group">
<span class="input-group-text"><i class="fa fa-star"></i></span>
<input id="esrb" class="form-control" name="esrb" type="text" value="{$console.esrb|escape:'htmlall'}" />
</div>
</div>
<tr>
<td><label for="esrb">Rating</label>:</td>
<td>
<input id="esrb" class="short" name="esrb" type="text" value="{$console.esrb|escape:'htmlall'}"/>
</td>
</tr>
<!-- Additional Details -->
<div class="col-12 mt-4">
<h5 class="border-bottom pb-2 mb-3">Additional Details</h5>
</div>
<tr>
<td><label for="genre">Genre</label>:</td>
<td>
<select id="genre" name="genre">
{foreach $genres as $gen}
<option {if $gen.id == $console.genres_id}selected="selected"{/if}
value="{$gen.id}">{$gen.title|escape:'htmlall'}</option>
{/foreach}
</select>
</td>
</tr>
<div class="col-md-12 mb-3">
<label for="url" class="form-label">URL</label>
<div class="input-group">
<span class="input-group-text"><i class="fa fa-link"></i></span>
<input id="url" class="form-control" name="url" type="text" value="{$console.url|escape:'htmlall'}" />
</div>
</div>
<tr>
<td><label for="cover">Cover Image</label>:</td>
<td>
<input type="file" id="cover" name="cover"/>
{if $console.cover == 1}
<img style="max-width:200px; display:block;"
src="{{url("/covers/console/{$console.id}.jpg")}}" alt=""/>
{/if}
</td>
</tr>
<div class="col-md-6 mb-3">
<label for="salesrank" class="form-label">Sales Rank</label>
<div class="input-group">
<span class="input-group-text"><i class="fa fa-line-chart"></i></span>
<input id="salesrank" class="form-control" type="text" name="salesrank" value="{$console.salesrank|escape:'htmlall'}" />
</div>
</div>
<tr>
<td></td>
<td>
<input class="btn btn-success" type="submit" value="Save"/>
</td>
</tr>
<!-- Cover Image -->
<div class="col-12 mt-4">
<h5 class="border-bottom pb-2 mb-3">Console Cover</h5>
</div>
</table>
<div class="col-md-12 mb-3">
<label for="cover" class="form-label">Cover Image</label>
<div class="row">
<div class="col-md-8">
<input type="file" id="cover" name="cover" class="form-control" accept="image/*" />
<div class="form-text">Recommended size: 600x900 pixels (JPG format)</div>
</div>
<div class="col-md-4">
{if $console.cover == 1}
<div class="cover-preview text-center">
<img src="{{url("/covers/console/{$console.id}.jpg")}}" alt="Cover" class="img-thumbnail" style="max-height: 200px;" />
</div>
<div class="text-center mt-2">
<span class="badge bg-success">Current Cover</span>
</div>
{else}
<div class="text-center">
<span class="badge bg-warning">No Cover Available</span>
</div>
{/if}
</div>
</div>
</div>
</form>
</div>
<div class="col-12 mt-4">
<div class="d-grid gap-2 d-md-flex justify-content-md-end">
<a href="{{url("/admin/console-list")}}" class="btn btn-outline-secondary">
<i class="fa fa-times me-2"></i>Cancel
</a>
<button type="submit" class="btn btn-success">
<i class="fa fa-save me-2"></i>Save Changes
</button>
</div>
</div>
</div>
</form>
</div>
</div>
<script>
{literal}
document.addEventListener('DOMContentLoaded', function() {
// Initialize tooltips
var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'));
var tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) {
return new bootstrap.Tooltip(tooltipTriggerEl);
});
// Form validation
var forms = document.querySelectorAll('.needs-validation');
Array.prototype.slice.call(forms).forEach(function (form) {
form.addEventListener('submit', function (event) {
if (!form.checkValidity()) {
event.preventDefault();
event.stopPropagation();
}
form.classList.add('was-validated');
}, false);
});
// Image preview functionality
const coverInput = document.getElementById('cover');
if (coverInput) {
coverInput.addEventListener('change', function() {
if (this.files && this.files[0]) {
const file = this.files[0];
const reader = new FileReader();
reader.onload = function(e) {
const previewContainer = document.querySelector('.cover-preview');
if (previewContainer) {
previewContainer.innerHTML = `<img src="${e.target.result}" alt="Preview" class="img-thumbnail" style="max-height: 200px;">`;
} else {
const newPreview = document.createElement('div');
newPreview.className = 'cover-preview text-center';
newPreview.innerHTML = `<img src="${e.target.result}" alt="Preview" class="img-thumbnail" style="max-height: 200px;">`;
const parent = coverInput.closest('.col-md-8').nextElementSibling;
if (parent) {
parent.innerHTML = '';
parent.appendChild(newPreview);
const badgeContainer = document.createElement('div');
badgeContainer.className = 'text-center mt-2';
badgeContainer.innerHTML = `<span class="badge bg-info">New Cover Preview</span>`;
parent.appendChild(badgeContainer);
}
}
};
reader.readAsDataURL(file);
}
});
}
});
{/literal}
</script>
<style>
{literal}
/* Form styling */
.form-control:focus {
border-color: #80bdff;
box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}
/* Cover image preview */
.cover-preview {
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
transition: transform 0.2s;
}
.cover-preview:hover {
transform: translateY(-5px);
}
/* Section headings */
h5.border-bottom {
color: #495057;
}
/* Responsive adjustments */
@media (max-width: 767.98px) {
.card-header .d-flex {
flex-direction: column;
gap: 1rem;
}
.card-header .btn {
width: 100%;
}
.cover-preview {
margin: 0 auto;
margin-top: 1rem;
}
}
{/literal}
</style>
resources/views/themes/admin/console-list.tpl
+156 -27
View File
@@ -1,31 +1,160 @@
<h1>{$title}</h1>
<div class="card">
<div class="card-header">
<div class="d-flex justify-content-between align-items-center">
<h4 class="mb-0">{$title}</h4>
<a href="{{url("/admin/console-add")}}" class="btn btn-outline-success">
<i class="fa fa-plus me-2"></i>Add New Console
</a>
</div>
</div>
<div class="card card-body">
{if $consolelist}
{$consolelist->onEachSide(5)->links()}
<table style="margin-top:10px;" class="data table table-striped responsive-utilities jambo-table Sortable">
<div class="card-body">
<form name="consolesearch" method="get" action="{{url("/admin/console-list")}}" id="console-search-form" class="mb-4">
{{csrf_field()}}
<div class="row">
<div class="col-md-6 offset-md-6">
<div class="input-group">
<input type="text" class="form-control" placeholder="Search by title or platform"
id="consolesearch" name="consolesearch" value="{$lastSearch|escape:'html'}">
<button type="submit" class="btn btn-primary">
<i class="fa fa-search me-2"></i>Search
</button>
</div>
</div>
</div>
</form>
<tr>
<th>id</th>
<th>Title</th>
<th>Platform</th>
<th>Created</th>
</tr>
{if $consolelist}
<div class="table-responsive">
<table class="table table-striped table-hover align-middle">
<thead class="thead-light">
<tr>
<th>ID</th>
<th>Title</th>
<th>Platform</th>
<th>Created</th>
<th class="text-end">Actions</th>
</tr>
</thead>
<tbody>
{foreach from=$consolelist item=console}
<tr>
<td>
<span class="badge bg-secondary">{$console->id}</span>
</td>
<td>
<div class="mb-1">
<a href="{{url("/admin/console-edit?id={$console->id}")}}" class="title fw-semibold">
{$console->title|escape:"htmlall"}
</a>
</div>
</td>
<td>
<span class="badge bg-info">{$console->platform|escape:"htmlall"}</span>
</td>
<td>
<div class="d-flex align-items-center">
<i class="fa fa-calendar text-muted me-2"></i>
<span title="{$console->created_at}">{$console->created_at|date_format}</span>
</div>
</td>
<td class="text-end">
<div class="btn-group btn-group-sm" role="group">
<a href="{{url("/admin/console-edit?id={$console->id}")}}" class="btn btn-primary" data-bs-toggle="tooltip" title="Edit this console">
<i class="fa fa-pencil"></i>
</a>
<a href="{{url("/admin/console-update?id={$console->id}")}}" class="btn btn-warning" data-bs-toggle="tooltip" title="Update metadata">
<i class="fa fa-refresh"></i>
</a>
<a href="{{url("/admin/console-delete?id={$console->id}")}}" class="btn btn-danger" data-bs-toggle="tooltip" title="Delete console" onclick="return confirm('Are you sure you want to delete this console?')">
<i class="fa fa-trash"></i>
</a>
</div>
</td>
</tr>
{/foreach}
</tbody>
</table>
</div>
{else}
<div class="alert alert-info">
<i class="fa fa-info-circle me-2"></i>No consoles available. Use the Add New Console button to add some.
</div>
{/if}
</div>
{foreach from=$consolelist item=console}
<tr class="{cycle values=",alt"}">
<td class="less">{$console->id}</td>
<td><a title="Edit"
href="{{url("/admin/console-edit?id={$console->id}")}}">{$console->title}</a></td>
<td>{$console->platform}</td>
<td>{$console->created_at|date_format}</td>
</tr>
{/foreach}
{if $consolelist}
<div class="card-footer">
<div class="d-flex justify-content-between align-items-center">
<div>
Showing {$consolelist->firstItem()} to {$consolelist->lastItem()} of {$consolelist->total()} consoles
</div>
<div class="pagination-container overflow-auto">
{$consolelist->onEachSide(5)->links()}
</div>
</div>
</div>
{/if}
</div>
</table>
<br/>
{$consolelist->onEachSide(5)->links()}
{else}
<p>No games available.</p>
{/if}
</div>
<script>
{literal}
document.addEventListener('DOMContentLoaded', function() {
// Initialize tooltips
var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'));
var tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) {
return new bootstrap.Tooltip(tooltipTriggerEl);
});
});
{/literal}
</script>
<style>
{literal}
/* Improve table responsiveness */
.table-responsive {
overflow-x: auto;
-webkit-overflow-scrolling: touch;
}
/* Badge styling */
.badge {
font-weight: 500;
padding: 0.4em 0.6em;
}
/* Pagination container */
.pagination-container {
max-width: 100%;
}
/* Improve action buttons on small screens */
@media (max-width: 767.98px) {
.btn-group .btn {
padding: 0.375rem 0.5rem;
}
.card-footer .d-flex {
flex-direction: column;
gap: 0.5rem;
}
.pagination-container {
justify-content: center !important;
}
}
/* Improve search form on small screens */
@media (max-width: 767.98px) {
#console-search-form .row {
margin-right: 0;
margin-left: 0;
}
#console-search-form .col-md-6 {
padding-right: 0;
padding-left: 0;
}
}
{/literal}
</style>