Commit Graph

90 Commits

Author SHA1 Message Date
Kevin Ansfield 18d60ad0d1 Koenig - Fixed error on Enter if card is selected
refs https://github.com/TryGhost/Ghost/issues/9505
- depending on the location of the caret around the selected card <kbd>Enter</kbd> could throw an error due to the assumption of a `tagName` property in the enter-at-start-of-header handling
2018-04-26 17:49:14 +01:00
Kevin Ansfield ad272cedfb Koenig - Improve link text expansion matching
refs https://github.com/TryGhost/Ghost/issues/9505
- tightens up regex to ensure we're not matching unexpected chars earlier in the paragraph
2018-04-26 17:40:38 +01:00
Kevin Ansfield 4a80859797 Koenig - Ctrl/Cmd+K shortcut has same behaviour as toolbar link button
no issue
- override mobiledoc-kit's default <kbd>Ctrl/Cmd+K</kbd> shortcut to trigger our own link editing component
2018-04-26 17:04:40 +01:00
Kevin Ansfield bc7074d382 Koenig - Fixed autofocus of markdown card when entering edit mode
refs https://github.com/TryGhost/Ghost/issues/9505
- add `autofocus` property to markdown editor component
- remove autofocus routine that was in place for old textarea based editor
2018-04-25 16:15:56 +01:00
Kevin Ansfield bee8b85866 Koenig - Fixed error when clicking on card with /-menu open
refs https://github.com/TryGhost/Ghost/issues/9505
- logic assumed that the selected section had a text property (cards do not)
2018-04-25 15:19:09 +01:00
Kevin Ansfield e2e153577d Koenig - Fixed card context menus sometimes being misplaced
refs https://github.com/TryGhost/Ghost/issues/9505
- sometimes the toolbar was not in a state to measure correctly during `didInsertElement` so the positioning was incorrect
- fixed by re-calculating width/height each time we want to show the toolbar
2018-04-25 15:11:45 +01:00
Zimo 3fc0841647 Koenig - Plus menu positioning and container card style
refs https://github.com/TryGhost/Ghost/issues/9505
2018-04-25 14:28:52 +01:00
Zimo f78467091d Koenig - Tweaked container card styles
refs https://github.com/TryGhost/Ghost/issues/9505
2018-04-25 14:28:37 +01:00
Zimo df50c9c51c Koenig - Styled HTML card edit mode
refs https://github.com/TryGhost/Ghost/issues/9505
2018-04-25 14:27:53 +01:00
Kevin Ansfield a075613d8f Koenig - Fix divider card insertion
refs https://github.com/TryGhost/Ghost/issues/9505
- ensure we select the next section when inserting a card
- remove duplicated card insertion logic by passing the Koenig instance to our text expansion helpers so that they can call actions
2018-04-25 13:12:59 +01:00
Kevin Ansfield a1656a8123 Koenig - Increase undo depth to 50
refs https://github.com/TryGhost/Ghost/issues/9505
2018-04-25 12:46:50 +01:00
Kevin Ansfield 22f85d52d7 Koenig - Remove caption from HTML card
refs https://github.com/TryGhost/Ghost/issues/9505
2018-04-25 12:09:20 +01:00
Kevin Ansfield a4feb4d18d Koenig - Enable line-wrapping for HTML card's CodeMirror instance
refs https://github.com/TryGhost/Ghost/issues/9505
- pass `lineWrapping` option through to CodeMirror in `{{gh-cm-editor}}`
- add cascade overrides for the `pre` line-wrapping styles needed by CodeMirror
2018-04-25 12:06:01 +01:00
Kevin Ansfield 1345582340
Koenig - Card menu and (+) button styles (#1010)
refs https://github.com/TryGhost/Ghost/issues/9505
- apply styles to card menu and replace icons
- apply styles for (+) button
2018-04-25 10:11:48 +01:00
Kevin Ansfield aaf40bc483 Koenig - Keep MD card formatting toolbar visible when possible
refs https://github.com/TryGhost/Ghost/issues/9505
- use `{{gh-scroll-trigger}}` components at top and bottom of the markdown card when in edit mode so that styles can be applied to the `.editor-toolbar` element to keep the toolbar fixed at the bottom of the screen whilst scrolling
2018-04-24 13:10:20 +01:00
Peter Zimon f88c2e1706 Koenig - Improve styles (#1008)
refs https://github.com/TryGhost/Ghost/issues/9505
- Tweaking UI of link input
- Tweaking toolbar menu
- Tweaking image toolbar style
- Applying image width styles
- Tweaking list typography
- Fixing empty post placeholder
2018-04-24 10:15:54 +01:00
Zimo 9eb0019628 Koenig - Fixing editing styles for HTML card 2018-04-20 17:51:33 +02:00
Kevin Ansfield 5a29aae97e Koenig - Only deselect cards on cursor changes within the doc
refs https://github.com/TryGhost/Ghost/issues/9505
- prevents clicks outside of the document canvas from exiting edit mode
- useful for cards that include modals because previously any click on a modal would exit edit mode and usually remove the modal from view
2018-04-20 15:43:44 +01:00
Kevin Ansfield 4a1273d388 Koenig - Use our full markdown editor in markdown card
no issue
- remove jQuery usage in `{{gh-markdown-editor}}` (general cleanup)
- switch `koenig-card-markdown` to use `{{gh-markdown-editor}}`
- update markdown editor styles to fit within the card interface
- add `{{gh-editor}}` for handling image uploads and drag/drop
2018-04-20 15:43:44 +01:00
Peter Zimon 92d1454a41 Koenig - Basic styles for editor content (#1006)
refs https://github.com/TryGhost/Ghost/issues/9505
- paragraph and heading styles and vert rhythm
- blockquote and link styles
- list styles
- card styles
- markdown card styles
2018-04-20 15:43:20 +01:00
Kevin Ansfield bd46a6b291 Koenig - Add card options for automatic edit/select after insert
no issue
- allows specifying Koenig-specific card options via `createComponentCard`
- respect `hasEditMode` and `selectAfterInsert` options when inserting cards via the (+) and / menus
- do not select divider card after insertion
2018-04-18 10:52:49 +01:00
Kevin Ansfield 2f5f3ce82a Koenig - Fixed _emphasis_ and link text expansions not cancelling
refs https://github.com/TryGhost/Ghost/issues/9505
- the `_` emphasis and link text expansions were toggling the wrong markup on completion
2018-04-18 10:17:13 +01:00
Kevin Ansfield ee6ca44dca Koenig - Apply link to selected text when pasting a URL
refs https://github.com/TryGhost/Ghost/issues/9505
- add a `paste` event handler to the editor element so that we can override the default mobiledoc-kit paste handling when required
- detect a paste when we have a plain text selection and if it's a valid url convert the selection to a link using the pasted url as the `href`
2018-04-13 17:53:40 +01:00
Kevin Ansfield 2ba01265d8 Koenig - Fixed error when pasting text with a whole paragraph selected
refs https://github.com/TryGhost/Ghost/issues/9505
2018-04-13 16:42:20 +01:00
Kevin Ansfield d45baa7ede Koenig - Enter/Backspace at beginning of heading moves heading
refs https://github.com/TryGhost/Ghost/issues/9505
- use `ENTER` and `BACKSPACE` key commands to intercept <kbd>Enter</kbd> and <kbd>Backspace</kbd> to insert/remove blank paragraphs rather than splitting the heading when the cursor is at the beginning of a heading
2018-04-13 16:15:43 +01:00
Kevin Ansfield 201681a445 Koenig - Backspace undoes code/strike text expansions
refs https://github.com/TryGhost/Ghost/issues/9505
- prevent typing at the end of a `code` or ~strike~ markup continuing the format
- if <kbd>Backspace</kbd> is pressed at the end of a `code` or ~strike~ markup then undo the text expansion and remove the last char
2018-04-12 17:20:27 +01:00
Kevin Ansfield 1a585517c7 Koenig - Change ~strike~ text expansion to ~~strike~~
refs https://github.com/TryGhost/Ghost/issues/9505
2018-04-12 12:40:15 +01:00
Kevin Ansfield d9c56977f0 Koenig - Disable dragging of text within the editor
refs https://github.com/TryGhost/Ghost/issues/9505
- disable all drags that start within the editor, prevents hectic behaviour when selecting and dragging text
2018-04-12 11:14:47 +01:00
Kevin Ansfield 07aba16846 Koenig - Link hover toolbar
refs https://github.com/TryGhost/Ghost/issues/9505
- disable `mobiledoc-kit`'s built-in link tooltip
- add `{{koenig-link-toolbar}}` component
    - shows toolbar above a link when it is hovered with the mouse
    - hides toolbar when a link isn't hovered
    - has a clickable link with the URL, opens in a new tab
    - edit button switches display to the link input toolbar
    - delete button removes link markup from the link
2018-04-11 18:42:27 +01:00
Kevin Ansfield 2f6132eb57 Koenig - Update icons, add divider support to card context toolbars
refs https://github.com/TryGhost/Ghost/issues/9505
2018-04-11 16:48:01 +01:00
Kevin Ansfield 28509c6bf6 Koenig - First pass at image width styles
refs https://github.com/TryGhost/Ghost/issues/9505
- add image style buttons to the image card context menu
- still requires Spirit styles for image classes to work correctly
2018-04-10 18:39:30 +01:00
Kevin Ansfield 52396ce280 Koenig - Fixed card context menu clickableness
refs https://github.com/TryGhost/Ghost/issues/9505
- ensure we disable `pointer-events` on context menus when hidden so that hidden menus do not interact with the mouse
- add z-index to context menus so that they sit on top of any editor content
- add `relative` positioning to the html card content so the click overlay div doesn't expand outside of the content area
2018-04-10 16:46:25 +01:00
Kevin Ansfield ac49240d34 Koenig - Fix error on SHIFT+ENTER whilst a card is selected
refs https://github.com/TryGhost/Ghost/issues/9505
- a card section isn't markerable so a guard is needed to prevent inserting the soft-break atom
2018-04-10 15:34:12 +01:00
Kevin Ansfield 7a89333b00 Koenig - Fixed markdown expansions not capturing 1 or 2 char markups
refs https://github.com/TryGhost/Ghost/issues/9505
- adjusted regexes to match a non-space group separately to a spaced group to deal with 1 or 2 chars of markup
- fixed `matchStrongStar` always triggering a markup toggle because the toggle was outside of the match conditional
2018-04-10 15:04:18 +01:00
Kevin Ansfield c0cef4a211 Koenig - Fixed UP or LEFT on a blank list item jumping cursor to title
refs https://github.com/TryGhost/Ghost/issues/9505
- ListItem sections have a parent rather than a prev section so we need to look for a section before the parent section when determining if the cursor is at the beginning of the doc for <kbd>Up</kbd> and <kbd>Left</kbd> key handling
2018-04-10 11:26:22 +01:00
Kevin Ansfield f0fe23d50b Koenig - Link creation/editing via formatting toolbar
refs https://github.com/TryGhost/Ghost/issues/9505
- wire up the link button in the toolbar to set a `linkRange` property on `{{koenig-editor}}`
- add `{{koenig-link-input}}` that is shown when `{{koenig-editor}}` has a `linkRange` set
    - <kbd>Escape</kbd> will cancel the link input
    - clicking outside the input will cancel the link input
    - previously selected text will be re-selected on cancel
    - if an existing link was selected (or partially selected) then pre-fill the link input with the `href`
    - `X` is shown when there's a href value and clicking will clear the input
    - <kbd>Enter</kbd> *with* a href value will remove all links from text that is touched by the selection and create a new link across only the selected text
    - <kbd>Enter</kbd> *with no* href value will remove all links touched by the selection
- fixed toolbar tick positioning that was 8px off after change to Spirit classes
2018-04-06 17:49:16 +01:00
Kevin Ansfield e7c9406e88 Koenig - Fix hidden toolbar still being clickable
no issue
- when switching to Spirit classes the `pointer-events` styles to properly hide the hidden toolbar and `z-index` to keep the toolbar above the title input had both been missed
2018-04-04 10:12:31 +01:00
Kevin Ansfield c338896793 Koenig - Switch card context menu to Spirit classes
refs https://github.com/TryGhost/Ghost/issues/9505
- use Spirit classes for card context menu
- add button and icon class options for context menu items
- add ability to have icon+text for context menu items
- add "Edit" context menu item to markdown and html cards
2018-04-03 18:34:01 +01:00
Kevin Ansfield 3ec2e87a6c Koenig - Update toolbar to use Spirit classes
refs https://github.com/TryGhost/Ghost/issues/9505
- switch `{{koenig-toolbar}}` to use Spirit classes and icons
- wrap the toolbar `<ul>` in an absolutely positioned `<div>` rather than positioning the toolbar directly to improve animation behaviour
- remove old/unused Koenig SVG icons
2018-04-03 16:52:00 +01:00
Kevin Ansfield 9aef06c4c2 Koenig - Fixed trailing-spaces when using markdown text expansions
refs https://github.com/TryGhost/Ghost/issues/9505
- previous attempts at toggling the markup state failed because mobiledoc-kit was automatically setting the activeMarkupState after we made the replacement
- by scheduling the toggle we change the active markup state after mobiledoc has done it's thing so you can continue typing without the markdown markup being applied and without needing to insert an unexpected space
2018-04-03 13:43:08 +01:00
Kevin Ansfield a28eb92c12
Switch to packaged version of Spirit (#985)
no issue
- remove the manually copied Spirit CSS files
- remove the manually copied Spirit helpers
- install `ember-cli-ghost-spirit` addon
- remove manual postcss configuration
- update all `color()` functions in CSS to `color-mod()`
- fixed invalid `color-mod()` usage in `power-calendar.css`
- bump sub-dependencies
2018-04-03 11:52:18 +01:00
Austin Burdine 3fd2c7ad66 Swap out ember-inline-svg for ember-svg-jar (#970)
closes TryGhost/Ghost#9506
2018-03-19 09:57:31 +00:00
Kevin Ansfield fddf679a27 Koenig - Remove markdown/embed card if it's empty when leaving edit mode
refs https://github.com/TryGhost/Ghost/issues/9505
- add `deleteCard` action to `{{koenig-editor}}` component and pass it through to the component cards
  - required modifying the `_deleteCard` behaviour so that it doesn't always try to move the cursor
- use `onLeaveEdit` action from `{{koenig-card}}` in the markdown and html cards to check if their payload is empty and remove the card when exiting edit mode
- fixed `onLeaveEdit` action firing when card first rendered
2018-03-15 17:54:15 +00:00
Kevin Ansfield ff1d16858e Koenig - Standardise on <em> but allow <i> to be toggled off via toolbar
refs https://github.com/TryGhost/Ghost/issues/9505
- switch toolbar `I` button to toggle `<em>` instead of `<i>`, this standardises it with the <kbd>Meta+I</kbd> shortcut
- if the active markup is `<i>` instead of `<em>` then highlight the `I` button and allow it to be toggled off to prevent confusion
2018-03-15 17:25:10 +00:00
Kevin Ansfield 1842dab9c6 Koenig - Improve MD text expansion behaviour
refs https://github.com/TryGhost/Ghost/issues/9505
- fix overzealous matching of inline formatting
  - ensure the match starts with a space or the start of the paragraph
  - ensure the start matched chars are not followed by a space
  - ensure the end matched chars are not preceded by a space
  - avoid matching more MD chars than expected
- allow text expansions to work when editing text in the middle of a paragraph
  - do not add a trailing space after reformatting in this case
2018-03-15 17:13:50 +00:00
Kevin Ansfield 47d8c05f16 Koenig - Don't display toolbar for keyboard selections
refs https://github.com/TryGhost/Ghost/issues/9505
- implements similar `mousemove` event handling in `{{koenig-toolbar}}` as we use in `{{koenig-card}}` to not show the toolbar until we are sure there's mouse interaction
2018-03-15 15:15:53 +00:00
Kevin Ansfield 97e5925fec Koenig - Move list creation from card menus to toolbar
refs https://github.com/TryGhost/Ghost/issues/9505
- remove unordered and bullet list icons from the (+) and / menus
- add unordered and bullet list icons to the formatting toolbar
- reorder toolbar icons to match latest design specs
- remove now-unused `replaceWithListItem` actions
2018-03-15 14:35:39 +00:00
Kevin Ansfield cbc077d55c Fix linting error 2018-03-15 11:10:12 +00:00
Kevin Ansfield bbbd765adb Koenig - Fixed formatting being lost when deleting cards
refs https://github.com/TryGhost/Ghost/issues/9311
- when using <kbd>Backspace</kbd> to delete a card the formatting (eg, heading format) on the following section would be lost
- switched to using `editor.removeSection` and a cursor change to avoid the range style deletion stripping the formatting
2018-03-14 16:30:28 +00:00
Kevin Ansfield c04514ce45 Koenig - Fixed backspace not deleting empty para at beginning of doc
refs https://github.com/TryGhost/Ghost/issues/9311
- something that became apparent after adding the "<kbd>Enter</kbd> in post title adds blank paragraph" feature was that using that feature left you in a position where Backspace doesn't do what you expect - it does nothing rather than deleting the blank paragraph
- added logic to the `handleBackspaceKey` handler in `{{koenig-editor}}` to detect when backspace is pressed on a blank paragraph at the start of the doc so that we remove it then focus the title
2018-03-14 16:13:33 +00:00