Showing
5 changed files
with
51 additions
and
17 deletions
| ... | @@ -271,8 +271,6 @@ module.exports = function (ngApp, events) { | ... | @@ -271,8 +271,6 @@ module.exports = function (ngApp, events) { |
| 271 | scope.mdModel = content; | 271 | scope.mdModel = content; |
| 272 | scope.mdChange(markdown(content)); | 272 | scope.mdChange(markdown(content)); |
| 273 | 273 | ||
| 274 | - console.log('test'); | ||
| 275 | - | ||
| 276 | element.on('change input', (event) => { | 274 | element.on('change input', (event) => { |
| 277 | content = element.val(); | 275 | content = element.val(); |
| 278 | $timeout(() => { | 276 | $timeout(() => { |
| ... | @@ -304,6 +302,7 @@ module.exports = function (ngApp, events) { | ... | @@ -304,6 +302,7 @@ module.exports = function (ngApp, events) { |
| 304 | const input = element.find('[markdown-input] textarea').first(); | 302 | const input = element.find('[markdown-input] textarea').first(); |
| 305 | const display = element.find('.markdown-display').first(); | 303 | const display = element.find('.markdown-display').first(); |
| 306 | const insertImage = element.find('button[data-action="insertImage"]'); | 304 | const insertImage = element.find('button[data-action="insertImage"]'); |
| 305 | + const insertEntityLink = element.find('button[data-action="insertEntityLink"]') | ||
| 307 | 306 | ||
| 308 | let currentCaretPos = 0; | 307 | let currentCaretPos = 0; |
| 309 | 308 | ||
| ... | @@ -355,6 +354,13 @@ module.exports = function (ngApp, events) { | ... | @@ -355,6 +354,13 @@ module.exports = function (ngApp, events) { |
| 355 | input[0].selectionEnd = caretPos + ('; | 354 | input[0].selectionEnd = caretPos + ('; |
| 356 | return; | 355 | return; |
| 357 | } | 356 | } |
| 357 | + | ||
| 358 | + // Insert entity link shortcut | ||
| 359 | + if (event.which === 75 && event.ctrlKey && event.shiftKey) { | ||
| 360 | + showLinkSelector(); | ||
| 361 | + return; | ||
| 362 | + } | ||
| 363 | + | ||
| 358 | // Pass key presses to controller via event | 364 | // Pass key presses to controller via event |
| 359 | scope.$emit('editor-keydown', event); | 365 | scope.$emit('editor-keydown', event); |
| 360 | }); | 366 | }); |
| ... | @@ -370,6 +376,26 @@ module.exports = function (ngApp, events) { | ... | @@ -370,6 +376,26 @@ module.exports = function (ngApp, events) { |
| 370 | }); | 376 | }); |
| 371 | }); | 377 | }); |
| 372 | 378 | ||
| 379 | + function showLinkSelector() { | ||
| 380 | + window.showEntityLinkSelector((entity) => { | ||
| 381 | + let selectionStart = currentCaretPos; | ||
| 382 | + let selectionEnd = input[0].selectionEnd; | ||
| 383 | + let textSelected = (selectionEnd !== selectionStart); | ||
| 384 | + let currentContent = input.val(); | ||
| 385 | + | ||
| 386 | + if (textSelected) { | ||
| 387 | + let selectedText = currentContent.substring(selectionStart, selectionEnd); | ||
| 388 | + let linkText = `[${selectedText}](${entity.link})`; | ||
| 389 | + input.val(currentContent.substring(0, selectionStart) + linkText + currentContent.substring(selectionEnd)); | ||
| 390 | + } else { | ||
| 391 | + let linkText = ` [${entity.name}](${entity.link}) `; | ||
| 392 | + input.val(currentContent.substring(0, selectionStart) + linkText + currentContent.substring(selectionStart)) | ||
| 393 | + } | ||
| 394 | + input.change(); | ||
| 395 | + }); | ||
| 396 | + } | ||
| 397 | + insertEntityLink.click(showLinkSelector); | ||
| 398 | + | ||
| 373 | } | 399 | } |
| 374 | } | 400 | } |
| 375 | }]); | 401 | }]); | ... | ... |
| ... | @@ -140,6 +140,11 @@ $(function () { | ... | @@ -140,6 +140,11 @@ $(function () { |
| 140 | $(this).fadeOut(240); | 140 | $(this).fadeOut(240); |
| 141 | }); | 141 | }); |
| 142 | 142 | ||
| 143 | + $('.markdown-display').on('click', 'a', function(event) { | ||
| 144 | + event.preventDefault(); | ||
| 145 | + window.open($(this).attr('href')); | ||
| 146 | + }); | ||
| 147 | + | ||
| 143 | }); | 148 | }); |
| 144 | 149 | ||
| 145 | // Page specific items | 150 | // Page specific items | ... | ... |
| ... | @@ -19,22 +19,9 @@ | ... | @@ -19,22 +19,9 @@ |
| 19 | 19 | ||
| 20 | 20 | ||
| 21 | </div> | 21 | </div> |
| 22 | - @include('partials/image-manager', ['imageType' => 'gallery', 'uploaded_to' => $page->id]) | ||
| 23 | 22 | ||
| 24 | - <div id="entity-selector-wrap"> | 23 | + @include('partials/image-manager', ['imageType' => 'gallery', 'uploaded_to' => $page->id]) |
| 25 | - <div class="overlay" entity-link-selector> | 24 | + @include('partials/entity-selector-popup') |
| 26 | - <div class="popup-body small flex-child"> | ||
| 27 | - <div class="popup-header primary-background"> | ||
| 28 | - <div class="popup-title">Entity Select</div> | ||
| 29 | - <button type="button" class="corner-button neg button">x</button> | ||
| 30 | - </div> | ||
| 31 | - @include('partials/entity-selector', ['name' => 'entity-selector']) | ||
| 32 | - <div class="popup-footer"> | ||
| 33 | - <button type="button" disabled="true" class="button entity-link-selector-confirm pos corner-button">Select</button> | ||
| 34 | - </div> | ||
| 35 | - </div> | ||
| 36 | - </div> | ||
| 37 | - </div> | ||
| 38 | 25 | ||
| 39 | <script> | 26 | <script> |
| 40 | (function() { | 27 | (function() { | ... | ... |
| ... | @@ -73,6 +73,8 @@ | ... | @@ -73,6 +73,8 @@ |
| 73 | <span class="float left">Editor</span> | 73 | <span class="float left">Editor</span> |
| 74 | <div class="float right buttons"> | 74 | <div class="float right buttons"> |
| 75 | <button class="text-button" type="button" data-action="insertImage"><i class="zmdi zmdi-image"></i>Insert Image</button> | 75 | <button class="text-button" type="button" data-action="insertImage"><i class="zmdi zmdi-image"></i>Insert Image</button> |
| 76 | + | | ||
| 77 | + <button class="text-button" type="button" data-action="insertEntityLink"><i class="zmdi zmdi-link"></i>Insert Entity Link</button> | ||
| 76 | </div> | 78 | </div> |
| 77 | </div> | 79 | </div> |
| 78 | 80 | ... | ... |
| 1 | +<div id="entity-selector-wrap"> | ||
| 2 | + <div class="overlay" entity-link-selector> | ||
| 3 | + <div class="popup-body small flex-child"> | ||
| 4 | + <div class="popup-header primary-background"> | ||
| 5 | + <div class="popup-title">Entity Select</div> | ||
| 6 | + <button type="button" class="corner-button neg button popup-close">x</button> | ||
| 7 | + </div> | ||
| 8 | + @include('partials/entity-selector', ['name' => 'entity-selector']) | ||
| 9 | + <div class="popup-footer"> | ||
| 10 | + <button type="button" disabled="true" class="button entity-link-selector-confirm pos corner-button">Select</button> | ||
| 11 | + </div> | ||
| 12 | + </div> | ||
| 13 | + </div> | ||
| 14 | +</div> | ||
| ... | \ No newline at end of file | ... | \ No newline at end of file |
-
Please register or sign in to post a comment