The tinymce event system would not pick up the focus within the loaded
draw.io instance, after the drawing toolbar button was clicked, hence
the toolbar would hang around.
This adds a hack to dispatch a mousedown event on the body to get the
toolbar to hide.
For #3597
- Split bash from shell in language list
- Updated code-lang highlighting to be exact match only to prevent
confusion scenarios (Java matching JavaScript, etc..)
- Added design for favorites
- Changed blade language list to be generated from array.
- Added ability to search books list (Local simple text match).
- Added handles, hover-states and cursor states for better user
interaction and clearer use of drag & drop.
- Improved styles for dark mode.
- Converted shelf sort component to newer component format.
- Modernized shelf controller code a little.
Related to #3266
- Added workaround for new 'srcdoc' usage that's breaking content in
Firefox, added new 'custom-changes.md' file to document for future.
- Updated old usages of 'new' when creating nodes.
- Tested and changed logic, where required, where 'editor.dom.select'
has been used to replace the old '$' usages.
- Fixed bad boolean value being passed to 'setActive' in task list
logic.
TinyMCE was adding attributes to <br> elements within code blocks which
would then not be converted to newlines by our code regex match.
This changes the conversion to use dom querying instead.
Fixes#3507
Uses vdom system to diff and update the current markdown preview view
instead of requiring a full HTML replace change.
This should provide better performance, expecially where dynamically
loaded content such as iframes were in use.
Closes#3454
Now uses the previously timestamp gen name as a backup to the original
name. Aligns with the image manager upload which uses the original name
where given.
Closes#3470
- Now has a hover state to match other items.
- Now spans the full sidebar with like other items.
- Also updated chapter-toggle to a chapter-contents component, following
the newer component system.
- Improves animation smoothness
- Changed animation slideup/down animations to use max-height instead of height
to better avoid jutter at the end.
- Cleaned spacing to match page items in books listing.
Animates the height on breadcrumb dropdown menus to transition to the
loaded animations quicker. Includes a new animation helper for doing
similar tasks in future.
- Removed harsh theme color border between search and content.
- Prevented intermediate focus on list container to align arrow & tab
behaviour, and to get to content quicker.
- Tweaked styling to add a little extra shadow and be more rounded to
match other UI areas.
- Added slight horizontal inset when in right sidebar to prevent shadow
being cut-off in most cases.
- Added logic to "drop upwards" if dropping down would take the menu
offscreen.
- Updated all dropdown list item actions into three specific styles:
icon-item, text-item & label-item. Allows a stronger structure while
prevents mixing of styles as we were getting for header dropdown in
dark mode.
- Extracted out page editor top toolbar to its own view file & split
editor switch options to different markdown options.
Sets sizes on WYSIWYG code block sections based on content lines
as an early pre-codemirror height prediction to avoid excessive
jumping in the editor.
For #3326
This filters out <br> elements within code blocks and replaces them with
newlines. The editor started using <br>'s more harshley after some
configuration changes upon upgrading tinymce, in which we standardised
on forced br tags to avoid empty elements.
For #3327
- Updated styles to better align checkboxes within page content.
- Updated functionality to use a cross-compatible property on checkbox
click within the editor.
- For some reason, TinyMCE would handle empty paragraphs with a ' '
by default but this would be removed when the paragraph had an
attribute. This was fine in the old editor.
- This changes the approach to use '<br>' tags within elements
for "spaced emptiness".
- For compatbility with any existing empty paragraphs, I updated the
styles to show default height for empty paragraph sections.
- This also makes changes to help preserve encoded html tags
since they were getting converted along the journey.
Related to #3302
- Allows for easy unlinking, link preview or link editing.
- Created custom one to limit actions available.
- Performed refactoring of non-plugin toolbar editor code to extact into
its own file.
Related to #3276
- Fixed issues with new code blocks breaking or acting odd due to
misnamed contenteditable attribute.
- Helped fix issue where code blocks may show in a strage blank state
due to timing within shadow dom loading.
- Fixed some function timing issues where some functions required their
async predecessor to have finished.
Tested rather heavily in firefox and brave.
Fixes#3292
Code blocks in tinymce could sometimes end up exploded into the sub
elements of the codemirror display.
This changes the strategy to render codemirror within the shadow dom of
a custom element while preserving the normal pre/code DOM structure.
Still a little instability when moving/adding code blocks within details
blocks but much harder to break things now.
- Ensures padding works across FF & Chrome, was only working on FF
before.
- Fixes sketchy editor positioning focus on FF, since tinyMCE would
add a hidden element to the bottom of the body which would remove/add
our body padding causing unstable positioning.
- Removed old 'editor-*-update' commands to instead use the aligned
'editor::replace' command that we already have.
- Changed the way custom styles are loaded for the WYSIWYG editor so we
don't need an API call but instead scape content from the parent page
header using comments as identifiers. Added tests to ensure comments
exist and align.
- To display license info along with shortcuts.
- Extracted out plain layout from 503 error page.
- Added tests to ensure license references are as expected.
- Updated code content to get specific text selection instead of using
node-based handling which could return the whole document when
multiple top-level nodes were in selection.
- Simplified how code gets applied into the page to not be node based
but use native editor methods to replace the selection. Allows
creation from half-way through a block.
Tested on chrome+Firefox on Fedora 35.
Builds upon changes in #3246.
For #3200.
- Split everything into specific plugin/concern files to make things
more managable. Means original component file is now simple and much
of the core config is focused in one place.
Intended to fix positioning quirks caused by changing codemirror
instance size when you have lines that wrap and cause line height
changes. Often caused by editor toolbox expand/collapse.
This adds a debounced resize observer to refresh editor layout on size
change.
Also tweaks toolbox expand/collapse to more consistently set aria
attribute.
For #3186
Quick patch to clear the gallery display when getting the first page.
Duplication of the galler was occuring due to the mulitple upload events
loading the gallery mulitple times while only clearing the existing
gallery at the start of all refreshes.
A bit flashy in terms of user experience, as there will still be
mulitple load/clear events but fixes the duplication. Could be done more
elegently in future by communicating up image upload counts.
For #3160
Language parsing of code blocks could falter on pasted code blocks due
to the lanuage being parsed with a space which would throw an error when
used as a css class.
This adds more extensive language parsing to be safer.
Fixes#3133
Replaces the old suggestion of setting JS head 'window.uploadLimit'
variable. This new env option will be used by back-end validation and
front-end libs/logic too.
Limits already likely exist within prod environments at a PHP and
webserver level but this allows an app-level limit and centralises the
option on the BookStack side into the .env
Closes#3033
- Added testing to cover warning cases.
- Refactored logic to be simpler and move much of the business out of
the controller.
- Added new message that's more suitable to the case this was handling.
- For detecting an outdated draft, checked the draft created_at time
instead of updated_at to better fit the scenario being checked.
- Updated some method types to align with those potentially being used
in the logic of the code.
- Added a cache of shown messages on the front-end to prevent them
re-showing on every save during the session, even if dismissed.
User search input blur would trigger the submission of the search
filters which would cause strange thing where you'd click on a search
filtered user which would blur the input hence submit, but the user
would think they've clicked the user and the page would reload but the
input had not updated at that point.
Related to #2863
Only used an undo transaction on startup and added a small delay
to codeMirror parsing on SetContent's to help avoid
the rendering activities getting caught in undoManager states.
Seemed to improve things a lot in Firefox & chrome on my dev machine.
For #2602
Intended to fix issues raised in #2681.
Changes up the tri-layout tabs, and the main header menu toggle,
to be buttons while adding better text and keyboard controls.
Updated the component format of a few elements along the way.
Also ensured revisions were not created more often than expected.
Summary field null check was triggering revision save even when empty
since it was still in request.
Related to #1846
Brings down total editor load time from about 11s to 7s from testing in
4x reduced CPU speed in chrome.
About 1.5 seconds of that is editor init/page load.
Post editor-init/page-load time is now 60% of previous from testing.
Related to #2518
- Fixed page editor default focus not working as expected due to
misnamed attribute.
- Added owned_by to relevant areas of the API including the docs.
- Made book relation on page accessible even if deleted since it could cause an issue on views, such as audit trail, when the relation is accessed when the book is deleted.
- Removed old 'exposeTranslations' system to instead use new component
option system.
- Extracted validation rules into their own service provider.
- Cleaned up some formatting/comments in the repos.
Cannot get working in chrome reliably due to conflicting handling of
events and drag+drop API. Getting attachment drop working breaks other
parts of TinyMCE.
Implementing current work as should still work for MD editor and within
FireFox.
Related to #1460
- Updated comment routes to be simpler.
- Updated comments JS to align better with updated component system.
- Documented available global JS functions/services.
- Removed redundant controller method.
- Added window.$events helpers for validation messages and
success/error.
- Updated JS events system to not be class based for simplicity.
- Added window.trans_plural method to handle pluralisation/replacements
where you already have the translation string itself.
Fixes#1836
Currently fighting between sortable and tinymce mechanisms which prevent
this working due to the different events stopping the drop event while
needing the dragover for cursor placement.
- Created new dropzone component.
- Added standard component event system using custom DOM events.
- Added tabs component.
- Added ajax-delete-row component.
- Moved Code-editor from vue to component.
- Updated popup code so it background click only hides if the click
originated on the same background. Clicks within the popup will no
longer cause it to hide.
- Added session-level history tracking to code editor.
Added a document to try to define things.
Updated the loading so components are registed dynamically.
Added some standardised ways to reference other elems & define options
- Will focus on title if the value of the field matches the default text
for the current user's language.
- Otherwise will focus on the editor body.
- Added and tested on both editors.
For #2036
- Will now search for a callout on/above the selected node rather than
only using the selected node.
- Issues previously where callout shortcut would not cycle if called
when child formatting was currently selected inside the callout.
For #2061
- Updated editor, and other area, styles to look okay in dark mode.
- Used tinyMCE theme generator to create dark mode theme.
- Updated tinymce to latest 4x version.
- Most elements done, but still need to do editors, tables and final
pass.
- Toggled only by quick js check at the moment, checking via css media
query. Need to make into user-preference toggle.
For #1234
- Intended to prevent enumeration to check if a user exists.
- Updated messages on both the reqest-reset and set-password elements.
- Also updated notification auto-hide to be dynamic based upon the
amount of words within the notification.
- Added tests to cover.
For #2016
- Allowed DRAWIO env option to be passed as URL to point to instance.
- Updated tests to check URL gets passed to pages correctly.
- Update default URL to be the default theme.
For #826
- Added custom handling, Tracks if contenteditable blocks are being dragged. On drop the selection location will be roughly checked to put the block above or below the cursor block root element.
- MDN theme appeared fairly bad for markdown use, and the geometric
background was a bit much. Swapped out to default theme.
- Rough-added stickiness to docs sidebar, will need more work once it
starts to expand possible screen height.
- Extracted logic to get images from paste/drop event into own file to
align usage in both events for both editors.
- Fixed non-ability to drag+drop into WYSIWYG editor.
- Updated check for table data to look for table specific rich-text
instead of just any text since some the old check was too general and
was preventing some legitimate image paste events.
Tested on Chrome and FireFox on Ubuntu.
Attempted to test on Safari via browserstack but environment was
unreliable and could not access folders to test drag/drop of files.
Relates to #1651 and #1697
- Added fadeIn to animation JS service.
- Updated overlay to use anim service and to recieve a callback for
after-anim actions.
- Updated code editor popup to refresh Codemirror instance layout after
animation has completed.
Fixes#1672
- Codemirror mode mapping value can now be a function to dynamically set
mode depending on actual code content.
- Used above system to set php mode type, depending on if '<?php' tags
exist in content.
Closes#1557
