use DOMDocument;
use DOMElement;
use DOMXPath;
+use Illuminate\Support\Collection;
class PageRepo extends EntityRepo
{
return $this->publishPageDraft($copyPage, $pageData);
}
+
+ /**
+ * Get pages that have been marked as templates.
+ * @param int $count
+ * @param int $page
+ * @param string $search
+ * @return \Illuminate\Contracts\Pagination\LengthAwarePaginator
+ */
+ public function getPageTemplates(int $count = 10, int $page = 1, string $search = '')
+ {
+ $query = $this->entityQuery('page')
+ ->where('template', '=', true)
+ ->orderBy('name', 'asc')
+ ->skip( ($page - 1) * $count)
+ ->take($count);
+
+ if ($search) {
+ $query->where('name', 'like', '%' . $search . '%');
+ }
+
+ $paginator = $query->paginate($count, ['*'], 'page', $page);
+ $paginator->withPath('/templates');
+
+ return $paginator;
+ }
}
$this->setPageTitle(trans('entities.pages_edit_draft'));
$draftsEnabled = $this->signedIn;
+ $templates = $this->pageRepo->getPageTemplates(10);
+
return view('pages.edit', [
'page' => $draft,
'book' => $draft->book,
'isDraft' => true,
- 'draftsEnabled' => $draftsEnabled
+ 'draftsEnabled' => $draftsEnabled,
+ 'templates' => $templates,
]);
}
}
$draftsEnabled = $this->signedIn;
+ $templates = $this->pageRepo->getPageTemplates(10);
+
return view('pages.edit', [
'page' => $page,
'book' => $page->book,
'current' => $page,
- 'draftsEnabled' => $draftsEnabled
+ 'draftsEnabled' => $draftsEnabled,
+ 'templates' => $templates,
]);
}
--- /dev/null
+<?php
+
+namespace BookStack\Http\Controllers;
+
+use BookStack\Entities\Repos\PageRepo;
+use BookStack\Exceptions\NotFoundException;
+use Illuminate\Http\Request;
+
+class PageTemplateController extends Controller
+{
+ protected $pageRepo;
+
+ /**
+ * PageTemplateController constructor.
+ * @param $pageRepo
+ */
+ public function __construct(PageRepo $pageRepo)
+ {
+ $this->pageRepo = $pageRepo;
+ parent::__construct();
+ }
+
+ /**
+ * Fetch a list of templates from the system.
+ * @param Request $request
+ * @return \Illuminate\Contracts\View\Factory|\Illuminate\View\View
+ */
+ public function list(Request $request)
+ {
+ $page = $request->get('page', 1);
+ $search = $request->get('search', '');
+ $templates = $this->pageRepo->getPageTemplates(10, $page, $search);
+
+ if ($search) {
+ $templates->appends(['search' => $search]);
+ }
+
+ return view('pages.template-manager-list', [
+ 'templates' => $templates
+ ]);
+ }
+
+ /**
+ * Get the content of a template.
+ * @param $templateId
+ * @return \Illuminate\Contracts\Routing\ResponseFactory|\Symfony\Component\HttpFoundation\Response
+ * @throws NotFoundException
+ */
+ public function get($templateId)
+ {
+ $page = $this->pageRepo->getById('page', $templateId);
+
+ if (!$page->template) {
+ throw new NotFoundException();
+ }
+
+ return response()->json([
+ 'html' => $page->html,
+ 'markdown' => $page->markdown,
+ ]);
+ }
+
+}
--- /dev/null
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M7.41 8L12 12.58 16.59 8 18 9.41l-6 6-6-6z"/><path d="M0 0h24v24H0z" fill="none"/></svg>
\ No newline at end of file
import bookSort from "./book-sort";
import settingAppColorPicker from "./setting-app-color-picker";
import entityPermissionsEditor from "./entity-permissions-editor";
+import templateManager from "./template-manager";
const componentMapping = {
'dropdown': dropdown,
'custom-checkbox': customCheckbox,
'book-sort': bookSort,
'setting-app-color-picker': settingAppColorPicker,
- 'entity-permissions-editor': entityPermissionsEditor
+ 'entity-permissions-editor': entityPermissionsEditor,
+ 'template-manager': templateManager,
};
window.components = {};
});
this.codeMirrorSetup();
+ this.listenForBookStackEditorEvents();
}
// Update the input content and render the display.
})
}
+ listenForBookStackEditorEvents() {
+
+ function getContentToInsert({html, markdown}) {
+ return markdown || html;
+ }
+
+ // Replace editor content
+ window.$events.listen('editor::replace', (eventContent) => {
+ const markdown = getContentToInsert(eventContent);
+ this.cm.setValue(markdown);
+ });
+
+ // Append editor content
+ window.$events.listen('editor::append', (eventContent) => {
+ const cursorPos = this.cm.getCursor('from');
+ const markdown = getContentToInsert(eventContent);
+ const content = this.cm.getValue() + '\n' + markdown;
+ this.cm.setValue(content);
+ this.cm.setCursor(cursorPos.line, cursorPos.ch);
+ });
+
+ // Prepend editor content
+ window.$events.listen('editor::prepend', (eventContent) => {
+ const cursorPos = this.cm.getCursor('from');
+ const markdown = getContentToInsert(eventContent);
+ const content = markdown + '\n' + this.cm.getValue();
+ this.cm.setValue(content);
+ const prependLineCount = markdown.split('\n').length;
+ this.cm.setCursor(cursorPos.line + prependLineCount, cursorPos.ch);
+ });
+ }
}
export default MarkdownEditor ;
--- /dev/null
+import * as DOM from "../services/dom";
+
+class TemplateManager {
+
+ constructor(elem) {
+ this.elem = elem;
+ this.list = elem.querySelector('[template-manager-list]');
+ this.searching = false;
+
+ // Template insert action buttons
+ DOM.onChildEvent(this.elem, '[template-action]', 'click', this.handleTemplateActionClick.bind(this));
+
+ // Template list pagination click
+ DOM.onChildEvent(this.elem, '.pagination a', 'click', this.handlePaginationClick.bind(this));
+
+ // Template list item content click
+ DOM.onChildEvent(this.elem, '.template-item-content', 'click', this.handleTemplateItemClick.bind(this));
+
+ this.setupSearchBox();
+ }
+
+ handleTemplateItemClick(event, templateItem) {
+ const templateId = templateItem.closest('[template-id]').getAttribute('template-id');
+ this.insertTemplate(templateId, 'replace');
+ }
+
+ handleTemplateActionClick(event, actionButton) {
+ event.stopPropagation();
+
+ const action = actionButton.getAttribute('template-action');
+ const templateId = actionButton.closest('[template-id]').getAttribute('template-id');
+ this.insertTemplate(templateId, action);
+ }
+
+ async insertTemplate(templateId, action = 'replace') {
+ const resp = await window.$http.get(`/templates/${templateId}`);
+ const eventName = 'editor::' + action;
+ window.$events.emit(eventName, resp.data);
+ }
+
+ async handlePaginationClick(event, paginationLink) {
+ event.preventDefault();
+ const paginationUrl = paginationLink.getAttribute('href');
+ const resp = await window.$http.get(paginationUrl);
+ this.list.innerHTML = resp.data;
+ }
+
+ setupSearchBox() {
+ const searchBox = this.elem.querySelector('.search-box');
+ const input = searchBox.querySelector('input');
+ const submitButton = searchBox.querySelector('button');
+ const cancelButton = searchBox.querySelector('button.search-box-cancel');
+
+ async function performSearch() {
+ const searchTerm = input.value;
+ const resp = await window.$http.get(`/templates`, {
+ search: searchTerm
+ });
+ cancelButton.style.display = searchTerm ? 'block' : 'none';
+ this.list.innerHTML = resp.data;
+ }
+ performSearch = performSearch.bind(this);
+
+ // Searchbox enter press
+ searchBox.addEventListener('keypress', event => {
+ if (event.key === 'Enter') {
+ event.preventDefault();
+ performSearch();
+ }
+ });
+
+ // Submit button press
+ submitButton.addEventListener('click', event => {
+ performSearch();
+ });
+
+ // Cancel button press
+ cancelButton.addEventListener('click', event => {
+ input.value = '';
+ performSearch();
+ });
+ }
+}
+
+export default TemplateManager;
\ No newline at end of file
}
+function listenForBookStackEditorEvents(editor) {
+
+ // Replace editor content
+ window.$events.listen('editor::replace', ({html}) => {
+ editor.setContent(html);
+ });
+
+ // Append editor content
+ window.$events.listen('editor::append', ({html}) => {
+ const content = editor.getContent() + html;
+ editor.setContent(content);
+ });
+
+ // Prepend editor content
+ window.$events.listen('editor::prepend', ({html}) => {
+ const content = html + editor.getContent();
+ editor.setContent(content);
+ });
+
+}
+
class WysiwygEditor {
constructor(elem) {
});
function editorChange() {
+ console.log('CHANGE');
let content = editor.getContent();
window.$events.emit('editor-html-change', content);
}
editor.focus();
}
+ listenForBookStackEditorEvents(editor);
+
+ // TODO - Update to standardise across both editors
+ // Use events within listenForBookStackEditorEvents instead (Different event signature)
window.$events.listen('editor-html-update', html => {
editor.setContent(html);
editor.selection.select(editor.getBody(), true);
line-height: 1;
}
+.card.border-card {
+ border: 1px solid #DDD;
+}
+
.card.drag-card {
border: 1px solid #DDD;
border-radius: 4px;
}
.permissions-table tr:hover [permissions-table-toggle-all-in-row] {
display: inline;
+}
+
+.template-item {
+ cursor: pointer;
+ position: relative;
+ &:hover, .template-item-actions button:hover {
+ background-color: #F2F2F2;
+ }
+ .template-item-actions {
+ position: absolute;
+ top: 0;
+ right: 0;
+ width: 50px;
+ height: 100%;
+ display: flex;
+ flex-direction: column;
+ border-left: 1px solid #DDD;
+ }
+ .template-item-actions button {
+ cursor: pointer;
+ flex: 1;
+ background: #FFF;
+ border: 0;
+ border-top: 1px solid #DDD;
+ }
+ .template-item-actions button:first-child {
+ border-top: 0;
+ }
}
\ No newline at end of file
'templates' => 'Templates',
'templates_set_as_template' => 'Page is a template',
'templates_explain_set_as_template' => 'You can set this page as a template so its contents be utilized when creating other pages. Other users will be able to use this template if they have view permissions for this page.',
+ 'templates_replace_content' => 'Replace page content',
+ 'templates_append_content' => 'Append to page content',
+ 'templates_prepend_content' => 'Prepend to page content',
// Profile View
'profile_user_for_x' => 'User for :time',
<h4>{{ trans('entities.templates') }}</h4>
<div class="px-l">
- @include('pages.templates-manager', ['page' => $page])
+ @include('pages.template-manager', ['page' => $page, 'templates' => $templates])
</div>
-
</div>
</div>
--- /dev/null
+{{ $templates->links() }}
+
+@foreach($templates as $template)
+ <div class="card template-item border-card p-m mb-m" draggable="true" template-id="{{ $template->id }}">
+ <div class="template-item-content" title="{{ trans('entities.templates_replace_content') }}">
+ <div>{{ $template->name }}</div>
+ <div class="text-muted">{{ trans('entities.meta_updated', ['timeLength' => $template->updated_at->diffForHumans()]) }}</div>
+ </div>
+ <div class="template-item-actions">
+ <button type="button"
+ title="{{ trans('entities.templates_prepend_content') }}"
+ template-action="prepend">@icon('chevron-up')</button>
+ <button type="button"
+ title="{{ trans('entities.templates_append_content') }}"
+ template-action="append">@icon('chevron-down')</button>
+ </div>
+ </div>
+@endforeach
+
+{{ $templates->links() }}
\ No newline at end of file
--- /dev/null
+<div template-manager>
+ @if(userCan('templates-manage'))
+ <p class="text-muted small mb-none">
+ {{ trans('entities.templates_explain_set_as_template') }}
+ </p>
+ @include('components.toggle-switch', [
+ 'name' => 'template',
+ 'value' => old('template', $page->template ? 'true' : 'false') === 'true',
+ 'label' => trans('entities.templates_set_as_template')
+ ])
+ <hr>
+ @endif
+
+ @if(count($templates) > 0)
+ <div class="search-box flexible mb-m">
+ <input type="text" name="template-search" placeholder="{{ trans('common.search') }}">
+ <button type="button">@icon('search')</button>
+ <button class="search-box-cancel text-neg hidden" type="button">@icon('close')</button>
+ </div>
+ @endif
+
+ <div template-manager-list>
+ @include('pages.template-manager-list', ['templates' => $templates])
+ </div>
+</div>
\ No newline at end of file
+++ /dev/null
-@if(userCan('templates-manage'))
- <p class="text-muted small mb-none">
- {{ trans('entities.templates_explain_set_as_template') }}
- </p>
- @include('components.toggle-switch', [
- 'name' => 'template',
- 'value' => old('template', $page->template ? 'true' : 'false') === 'true',
- 'label' => trans('entities.templates_set_as_template')
- ])
- <hr>
-@endif
\ No newline at end of file
Route::get('/search/chapter/{bookId}', 'SearchController@searchChapter');
Route::get('/search/entity/siblings', 'SearchController@searchSiblings');
+ Route::get('/templates', 'PageTemplateController@list');
+ Route::get('/templates/{templateId}', 'PageTemplateController@get');
+
// Other Pages
Route::get('/', 'HomeController@index');
Route::get('/home', 'HomeController@index');
]);
}
+ public function test_templates_content_should_be_fetchable_only_if_page_marked_as_template()
+ {
+ $content = '<div>my_custom_template_content</div>';
+ $page = Page::first();
+ $editor = $this->getEditor();
+ $this->actingAs($editor);
+
+ $templateFetch = $this->get('/templates/' . $page->id);
+ $templateFetch->assertStatus(404);
+
+ $page->html = $content;
+ $page->template = true;
+ $page->save();
+
+ $templateFetch = $this->get('/templates/' . $page->id);
+ $templateFetch->assertStatus(200);
+ $templateFetch->assertJson([
+ 'html' => $content,
+ 'markdown' => '',
+ ]);
+ }
+
+ public function test_template_endpoint_returns_paginated_list_of_templates()
+ {
+ $editor = $this->getEditor();
+ $this->actingAs($editor);
+
+ $toBeTemplates = Page::query()->take(12)->get();
+ $page = $toBeTemplates->first();
+
+ $emptyTemplatesFetch = $this->get('/templates');
+ $emptyTemplatesFetch->assertDontSee($page->name);
+
+ Page::query()->whereIn('id', $toBeTemplates->pluck('id')->toArray())->update(['template' => true]);
+
+ $templatesFetch = $this->get('/templates');
+ $templatesFetch->assertSee($page->name);
+ $templatesFetch->assertSee('pagination');
+ }
+
}
\ No newline at end of file
projects / bookstack / commitdiff
