Infra-Mirrors/BookStack
1
0
Fork 0
mirror of https://github.com/BookStackApp/BookStack.git synced 2024-08-25 11:45:58 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #3591 from BookStackApp/shelf_books_enhancements

Browse Source 
Improved shelf book management interface
This commit is contained in:
Dan Brown 2022-07-24 12:28:01 +01:00 committed by GitHub
commit da6169159d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 102 additions and 48 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

53
app/Http/Controllers/BookshelfController.php
View File

@ -10,22 +10,19 @@ use BookStack\Entities\Tools\PermissionsUpdater;
use BookStack\Entities\Tools\ShelfContext;
use BookStack\Exceptions\ImageUploadException;
use BookStack\Exceptions\NotFoundException;
use BookStack\Uploads\ImageRepo;
use Exception;
use Illuminate\Http\Request;
use Illuminate\Validation\ValidationException;
class BookshelfController extends Controller
{
protected $bookshelfRepo;
protected $entityContextManager;
protected $imageRepo;
protected BookshelfRepo $shelfRepo;
protected ShelfContext $shelfContext;
public function __construct(BookshelfRepo $bookshelfRepo, ShelfContext $entityContextManager, ImageRepo $imageRepo)
public function __construct(BookshelfRepo $shelfRepo, ShelfContext $shelfContext)
{
$this->bookshelfRepo = $bookshelfRepo;
$this->entityContextManager = $entityContextManager;
$this->imageRepo = $imageRepo;
$this->shelfRepo = $shelfRepo;
$this->shelfContext = $shelfContext;
}
/**
@ -42,12 +39,12 @@ class BookshelfController extends Controller
'updated_at' => trans('common.sort_updated_at'),
];
$shelves = $this->bookshelfRepo->getAllPaginated(18, $sort, $order);
$recents = $this->isSignedIn() ? $this->bookshelfRepo->getRecentlyViewed(4) : false;
$popular = $this->bookshelfRepo->getPopular(4);
$new = $this->bookshelfRepo->getRecentlyCreated(4);
$shelves = $this->shelfRepo->getAllPaginated(18, $sort, $order);
$recents = $this->isSignedIn() ? $this->shelfRepo->getRecentlyViewed(4) : false;
$popular = $this->shelfRepo->getPopular(4);
$new = $this->shelfRepo->getRecentlyCreated(4);
$this->entityContextManager->clearShelfContext();
$this->shelfContext->clearShelfContext();
$this->setPageTitle(trans('entities.shelves'));
return view('shelves.index', [
@ -68,7 +65,7 @@ class BookshelfController extends Controller
public function create()
{
$this->checkPermission('bookshelf-create-all');
$books = Book::visible()->get();
$books = Book::visible()->orderBy('name')->get(['name', 'id', 'slug']);
$this->setPageTitle(trans('entities.shelves_create'));
return view('shelves.create', ['books' => $books]);
@ -91,7 +88,7 @@ class BookshelfController extends Controller
]);
$bookIds = explode(',', $request->get('books', ''));
$shelf = $this->bookshelfRepo->create($validated, $bookIds);
$shelf = $this->shelfRepo->create($validated, $bookIds);
return redirect($shelf->getUrl());
}
@ -103,7 +100,7 @@ class BookshelfController extends Controller
*/
public function show(ActivityQueries $activities, string $slug)
{
$shelf = $this->bookshelfRepo->getBySlug($slug);
$shelf = $this->shelfRepo->getBySlug($slug);
$this->checkOwnablePermission('bookshelf-view', $shelf);
$sort = setting()->getForCurrentUser('shelf_books_sort', 'default');
@ -115,7 +112,7 @@ class BookshelfController extends Controller
->all();
View::incrementFor($shelf);
$this->entityContextManager->setShelfContext($shelf->id);
$this->shelfContext->setShelfContext($shelf->id);
$view = setting()->getForCurrentUser('bookshelf_view_type');
$this->setPageTitle($shelf->getShortName());
@ -135,11 +132,11 @@ class BookshelfController extends Controller
*/
public function edit(string $slug)
{
$shelf = $this->bookshelfRepo->getBySlug($slug);
$shelf = $this->shelfRepo->getBySlug($slug);
$this->checkOwnablePermission('bookshelf-update', $shelf);
$shelfBookIds = $shelf->books()->get(['id'])->pluck('id');
$books = Book::visible()->whereNotIn('id', $shelfBookIds)->get();
$books = Book::visible()->whereNotIn('id', $shelfBookIds)->orderBy('name')->get(['name', 'id', 'slug']);
$this->setPageTitle(trans('entities.shelves_edit_named', ['name' => $shelf->getShortName()]));
@ -158,7 +155,7 @@ class BookshelfController extends Controller
*/
public function update(Request $request, string $slug)
{
$shelf = $this->bookshelfRepo->getBySlug($slug);
$shelf = $this->shelfRepo->getBySlug($slug);
$this->checkOwnablePermission('bookshelf-update', $shelf);
$validated = $this->validate($request, [
'name' => ['required', 'string', 'max:255'],
@ -174,7 +171,7 @@ class BookshelfController extends Controller
}
$bookIds = explode(',', $request->get('books', ''));
$shelf = $this->bookshelfRepo->update($shelf, $validated, $bookIds);
$shelf = $this->shelfRepo->update($shelf, $validated, $bookIds);
return redirect($shelf->getUrl());
}
@ -184,7 +181,7 @@ class BookshelfController extends Controller
*/
public function showDelete(string $slug)
{
$shelf = $this->bookshelfRepo->getBySlug($slug);
$shelf = $this->shelfRepo->getBySlug($slug);
$this->checkOwnablePermission('bookshelf-delete', $shelf);
$this->setPageTitle(trans('entities.shelves_delete_named', ['name' => $shelf->getShortName()]));
@ -199,10 +196,10 @@ class BookshelfController extends Controller
*/
public function destroy(string $slug)
{
$shelf = $this->bookshelfRepo->getBySlug($slug);
$shelf = $this->shelfRepo->getBySlug($slug);
$this->checkOwnablePermission('bookshelf-delete', $shelf);
$this->bookshelfRepo->destroy($shelf);
$this->shelfRepo->destroy($shelf);
return redirect('/shelves');
}
@ -212,7 +209,7 @@ class BookshelfController extends Controller
*/
public function showPermissions(string $slug)
{
$shelf = $this->bookshelfRepo->getBySlug($slug);
$shelf = $this->shelfRepo->getBySlug($slug);
$this->checkOwnablePermission('restrictions-manage', $shelf);
return view('shelves.permissions', [
@ -225,7 +222,7 @@ class BookshelfController extends Controller
*/
public function permissions(Request $request, PermissionsUpdater $permissionsUpdater, string $slug)
{
$shelf = $this->bookshelfRepo->getBySlug($slug);
$shelf = $this->shelfRepo->getBySlug($slug);
$this->checkOwnablePermission('restrictions-manage', $shelf);
$permissionsUpdater->updateFromPermissionsForm($shelf, $request);
@ -240,10 +237,10 @@ class BookshelfController extends Controller
*/
public function copyPermissions(string $slug)
{
$shelf = $this->bookshelfRepo->getBySlug($slug);
$shelf = $this->shelfRepo->getBySlug($slug);
$this->checkOwnablePermission('restrictions-manage', $shelf);
$updateCount = $this->bookshelfRepo->copyDownPermissions($shelf);
$updateCount = $this->shelfRepo->copyDownPermissions($shelf);
$this->showSuccessNotification(trans('entities.shelves_copy_permission_success', ['count' => $updateCount]));
return redirect($shelf->getUrl());

38
resources/js/components/shelf-sort.js
View File

@ -2,10 +2,12 @@ import Sortable from "sortablejs";
class ShelfSort {
constructor(elem) {
this.elem = elem;
this.input = document.getElementById('books-input');
this.shelfBooksList = elem.querySelector('[shelf-sort-assigned-books]');
setup() {
this.elem = this.$el;
this.input = this.$refs.input;
this.shelfBookList = this.$refs.shelfBookList;
this.allBookList = this.$refs.allBookList;
this.bookSearchInput = this.$refs.bookSearch;
this.initSortable();
this.setupListeners();
@ -25,12 +27,36 @@ class ShelfSort {
setupListeners() {
this.elem.addEventListener('click', event => {
const sortItem = event.target.closest('.scroll-box-item:not(.instruction)');
const sortItem = event.target.closest('.scroll-box-item');
if (sortItem) {
event.preventDefault();
this.sortItemClick(sortItem);
}
});
this.bookSearchInput.addEventListener('input', event => {
this.filterBooksByName(this.bookSearchInput.value);
});
}
/**
* @param {String} filterVal
*/
filterBooksByName(filterVal) {
// Set height on first search, if not already set, to prevent the distraction
// of the list height jumping around
if (!this.allBookList.style.height) {
this.allBookList.style.height = this.allBookList.getBoundingClientRect().height + 'px';
}
const books = this.allBookList.children;
const lowerFilter = filterVal.trim().toLowerCase();
for (const bookEl of books) {
const show = !filterVal || bookEl.textContent.toLowerCase().includes(lowerFilter);
bookEl.style.display = show ? null : 'none';
}
}
/**
@ -47,7 +73,7 @@ class ShelfSort {
}
onChange() {
const shelfBookElems = Array.from(this.shelfBooksList.querySelectorAll('[data-id]'));
const shelfBookElems = Array.from(this.shelfBookList.querySelectorAll('[data-id]'));
this.input.value = shelfBookElems.map(elem => elem.getAttribute('data-id')).join(',');
}

2
resources/lang/en/entities.php
View File

@ -88,7 +88,7 @@ return [
'shelves_save' => 'Save Shelf',
'shelves_books' => 'Books on this shelf',
'shelves_add_books' => 'Add books to this shelf',
'shelves_drag_books' => 'Drag books here to add them to this shelf',
'shelves_drag_books' => 'Drag books below to add them to this shelf',
'shelves_empty_contents' => 'This shelf has no books assigned to it',
'shelves_edit_and_assign' => 'Edit shelf to assign books',
'shelves_edit_named' => 'Edit Bookshelf :name',

3
resources/sass/_forms.scss
View File

@ -317,7 +317,8 @@ input[type=color] {
.form-group[collapsible] {
padding: 0 $-m;
border: 1px solid #DDD;
border: 1px solid;
@include lightDark(border-color, #DDD, #000);
border-radius: 4px;
.collapse-title {
margin-inline-start: -$-m;

42
resources/sass/styles.scss
View File

@ -241,28 +241,54 @@ $btt-size: 40px;
.scroll-box {
max-height: 250px;
overflow-y: scroll;
border: 1px solid #DDD;
border: 1px solid;
@include lightDark(border-color, #DDD, #000);
border-radius: 3px;
min-height: 20px;
@include lightDark(background-color, #EEE, #000);
.scroll-box-item {
padding: $-xs $-m;
border-bottom: 1px solid #DDD;
border-top: 1px solid #DDD;
border-bottom: 1px solid;
border-top: 1px solid;
@include lightDark(border-color, #DDD, #000);
margin-top: -1px;
@include lightDark(background-color, #FFF, #222);
display: flex;
gap: $-xs;
&:last-child {
border-bottom: 0;
}
&:hover {
cursor: pointer;
@include lightDark(background-color, #f8f8f8, #333);
}
.handle {
color: #AAA;
cursor: grab;
}
}
}
.scroll-box[data-instruction]:before {
content: attr(data-instruction);
input.scroll-box-search, .scroll-box-header-item {
font-size: 0.8rem;
padding: $-xs $-m;
border-bottom: 1px solid #DDD;
display: block;
font-size: 0.75rem;
border: 1px solid;
@include lightDark(border-color, #DDD, #000);
@include lightDark(background-color, #FFF, #222);
margin-bottom: -1px;
border-radius: 3px 3px 0 0;
width: 100%;
max-width: 100%;
height: auto;
line-height: 1.4;
color: #666;
}
.scroll-box-search + .scroll-box,
.scroll-box-header-item + .scroll-box {
border-radius: 0 0 3px 3px;
}
.fullscreen {
border:0;
position:fixed;

12
resources/views/shelves/parts/form.blade.php
View File

@ -10,15 +10,17 @@
@include('form.textarea', ['name' => 'description'])
</div>
<div shelf-sort class="grid half gap-xl">
<div component="shelf-sort" class="grid half gap-xl">
<div class="form-group">
<label for="books">{{ trans('entities.shelves_books') }}</label>
<input type="hidden" id="books-input" name="books"
<input refs="shelf-sort@input" type="hidden" name="books"
value="{{ isset($shelf) ? $shelf->visibleBooks->implode('id', ',') : '' }}">
<div class="scroll-box" shelf-sort-assigned-books data-instruction="{{ trans('entities.shelves_drag_books') }}">
<div class="scroll-box-header-item">{{ trans('entities.shelves_drag_books') }}</div>
<div refs="shelf-sort@shelf-book-list" class="scroll-box">
@if (count($shelf->visibleBooks ?? []) > 0)
@foreach ($shelf->visibleBooks as $book)
<div data-id="{{ $book->id }}" class="scroll-box-item">
<div class="handle">@icon('grip')</div>
<a href="{{ $book->getUrl() }}" class="text-book">@icon('book'){{ $book->name }}</a>
</div>
@endforeach
@ -27,9 +29,11 @@
</div>
<div class="form-group">
<label for="books">{{ trans('entities.shelves_add_books') }}</label>
<div class="scroll-box">
<input type="text" refs="shelf-sort@book-search" class="scroll-box-search" placeholder="{{ trans('common.search') }}">
<div refs="shelf-sort@all-book-list" class="scroll-box">
@foreach ($books as $book)
<div data-id="{{ $book->id }}" class="scroll-box-item">
<div class="handle">@icon('grip')</div>
<a href="{{ $book->getUrl() }}" class="text-book">@icon('book'){{ $book->name }}</a>
</div>
@endforeach