mirror of
https://github.com/BookStackApp/BookStack.git
synced 2024-08-26 20:22:18 +00:00
Added link selector to markdown editor
This commit is contained in:
parent
5b64358ef1
commit
23e014cb25
@ -271,8 +271,6 @@ module.exports = function (ngApp, events) {
|
||||
scope.mdModel = content;
|
||||
scope.mdChange(markdown(content));
|
||||
|
||||
console.log('test');
|
||||
|
||||
element.on('change input', (event) => {
|
||||
content = element.val();
|
||||
$timeout(() => {
|
||||
@ -304,6 +302,7 @@ module.exports = function (ngApp, events) {
|
||||
const input = element.find('[markdown-input] textarea').first();
|
||||
const display = element.find('.markdown-display').first();
|
||||
const insertImage = element.find('button[data-action="insertImage"]');
|
||||
const insertEntityLink = element.find('button[data-action="insertEntityLink"]')
|
||||
|
||||
let currentCaretPos = 0;
|
||||
|
||||
@ -355,6 +354,13 @@ module.exports = function (ngApp, events) {
|
||||
input[0].selectionEnd = caretPos + ('![](http://'.length);
|
||||
return;
|
||||
}
|
||||
|
||||
// Insert entity link shortcut
|
||||
if (event.which === 75 && event.ctrlKey && event.shiftKey) {
|
||||
showLinkSelector();
|
||||
return;
|
||||
}
|
||||
|
||||
// Pass key presses to controller via event
|
||||
scope.$emit('editor-keydown', event);
|
||||
});
|
||||
@ -370,6 +376,26 @@ module.exports = function (ngApp, events) {
|
||||
});
|
||||
});
|
||||
|
||||
function showLinkSelector() {
|
||||
window.showEntityLinkSelector((entity) => {
|
||||
let selectionStart = currentCaretPos;
|
||||
let selectionEnd = input[0].selectionEnd;
|
||||
let textSelected = (selectionEnd !== selectionStart);
|
||||
let currentContent = input.val();
|
||||
|
||||
if (textSelected) {
|
||||
let selectedText = currentContent.substring(selectionStart, selectionEnd);
|
||||
let linkText = `[${selectedText}](${entity.link})`;
|
||||
input.val(currentContent.substring(0, selectionStart) + linkText + currentContent.substring(selectionEnd));
|
||||
} else {
|
||||
let linkText = ` [${entity.name}](${entity.link}) `;
|
||||
input.val(currentContent.substring(0, selectionStart) + linkText + currentContent.substring(selectionStart))
|
||||
}
|
||||
input.change();
|
||||
});
|
||||
}
|
||||
insertEntityLink.click(showLinkSelector);
|
||||
|
||||
}
|
||||
}
|
||||
}]);
|
||||
|
@ -140,6 +140,11 @@ $(function () {
|
||||
$(this).fadeOut(240);
|
||||
});
|
||||
|
||||
$('.markdown-display').on('click', 'a', function(event) {
|
||||
event.preventDefault();
|
||||
window.open($(this).attr('href'));
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
// Page specific items
|
||||
|
@ -19,22 +19,9 @@
|
||||
|
||||
|
||||
</div>
|
||||
@include('partials/image-manager', ['imageType' => 'gallery', 'uploaded_to' => $page->id])
|
||||
|
||||
<div id="entity-selector-wrap">
|
||||
<div class="overlay" entity-link-selector>
|
||||
<div class="popup-body small flex-child">
|
||||
<div class="popup-header primary-background">
|
||||
<div class="popup-title">Entity Select</div>
|
||||
<button type="button" class="corner-button neg button">x</button>
|
||||
</div>
|
||||
@include('partials/entity-selector', ['name' => 'entity-selector'])
|
||||
<div class="popup-footer">
|
||||
<button type="button" disabled="true" class="button entity-link-selector-confirm pos corner-button">Select</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@include('partials/image-manager', ['imageType' => 'gallery', 'uploaded_to' => $page->id])
|
||||
@include('partials/entity-selector-popup')
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
|
@ -73,6 +73,8 @@
|
||||
<span class="float left">Editor</span>
|
||||
<div class="float right buttons">
|
||||
<button class="text-button" type="button" data-action="insertImage"><i class="zmdi zmdi-image"></i>Insert Image</button>
|
||||
|
|
||||
<button class="text-button" type="button" data-action="insertEntityLink"><i class="zmdi zmdi-link"></i>Insert Entity Link</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
14
resources/views/partials/entity-selector-popup.blade.php
Normal file
14
resources/views/partials/entity-selector-popup.blade.php
Normal file
@ -0,0 +1,14 @@
|
||||
<div id="entity-selector-wrap">
|
||||
<div class="overlay" entity-link-selector>
|
||||
<div class="popup-body small flex-child">
|
||||
<div class="popup-header primary-background">
|
||||
<div class="popup-title">Entity Select</div>
|
||||
<button type="button" class="corner-button neg button popup-close">x</button>
|
||||
</div>
|
||||
@include('partials/entity-selector', ['name' => 'entity-selector'])
|
||||
<div class="popup-footer">
|
||||
<button type="button" disabled="true" class="button entity-link-selector-confirm pos corner-button">Select</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
Loading…
Reference in New Issue
Block a user