Commit Graph

561 Commits

Author SHA1 Message Date
Kevin Ansfield
fa9445d1ab Fixed invisible button text when toggling image card alt button
no issue

- `bg-white` was a default style but has a higher specificity than `bg-blue` used when active so the blue background wasn't taking effect
2020-04-28 09:48:00 +01:00
Kevin Ansfield
842c3ffd93 Added "Email" card for inserting content that only appears when emailing posts to members
no issue

- any content inside the email card will not appear on the site, instead it will only be shown when using the members system to email the post to your members
- can `{first_name}` or `{first_name, "fallback"}` to personalise the email content for each member
2020-04-27 13:13:00 +01:00
Peter Zimon
ab8ef7f422 Updated email card help link
no issues.
- updated email card to point the help icon to its final page
2020-04-27 11:02:23 +02:00
Peter Zimon
274babc6e3 Refined email card help styles
no issue

- refine email card help copy, icon and container styles
2020-04-23 14:46:44 +02:00
Kevin Ansfield
625dd9a471 Added help text to email card
no issue

- show help at bottom of email card in edit mode with text explaining that the email card will only be included in emails
- set default content of the email card that includes the `{first_name}` replacement string
- changed behaviour to place cursor at end of the card contents when entering edit mode
2020-04-23 12:11:23 +01:00
Peter Zimon
20b113909c Fixed slash menu positioning bug
no refs.

- fixed visual bug that made Slash menu appear on top of the text
2020-04-21 11:12:47 +02:00
Kevin Ansfield
bdf7a1ba8a Hid slash menu when there are no items to display
no issue

- doesn't make sense to show a plain white box with a shadow
2020-04-21 09:16:13 +01:00
Kevin Ansfield
4a596d232e Fixed formatting only being applied to first replacement string in email card
no issue
2020-04-20 12:15:11 +01:00
Kevin Ansfield
06849869a2 Fixed linting 2020-04-17 17:59:08 +01:00
Kevin Ansfield
abcb9da445 Prevent {} text replacements from receiving any formatting
no issue

- we don't want to allow text replacement strings to be split in half by html tags so we disallow any formats to be applied to them
- in the `<KoenigTextReplacementHtmlInput>`'s mobiledoc editor's `didUpdatePost` hook handler we loop over all markers in the post and if they have a code markup (we use this to represent replacement strings) then we strip any other markups
2020-04-17 17:49:16 +01:00
Kevin Ansfield
01faf606a6 Fixed <code> being persisted to email card payload
no issue

- `<code>` formatting is internal to the text replacement html input and shouldn't be persisted in the payload html
- adjust `cleanTextReplacementHtml` to strip out all `<code>` tags
- adjust `<CleanTextReplacementHtmlInput>` to strip `<code>` formatting when outputting html via the `onChange` action and to also put the `<code>` formatting back when receiving html
- adjust `<KoenigEmailCard>` to add the `<code>` formatting back around any replacement strings so that they are visible in the editor
2020-04-17 16:00:19 +01:00
Kevin Ansfield
2da73cf8ea Fixed {} chars being removed when applying text replacement format
no issue

- we want to keep the `{` and `}` chars when applying/removing formatting from text replacement strings so that you can see the full string with formatting
- added ability to specify a non-replaced special format which is used by the <kbd>Backspace</kbd> handler
- added helper utility to the text expansions for applying formatting to a match without replacing the "markdown" characters
2020-04-17 14:49:54 +01:00
Kevin Ansfield
00ccf68764 Fixed "special markups" not being separate across different editors
no issue

- if the character used to define a special markup is different such as in the text replacement editor, pressing Backspace was not inserting the correct characters
2020-04-17 14:11:19 +01:00
Kevin Ansfield
e5acb34a81 Fixed mobiledoc-kit automatically upgrading document version
refs 6f5c2a9557

- we previously set a fixed mobiledoc spec version in blank documents but when the editor was serializing to a json string after editing it was bumping the spec version
- makes the specific version a constant to be used when serializing any mobiledoc
2020-04-16 22:12:01 +01:00
Peter Zimon
48bbb23174 Added email indicator icon, card menu style bugfix
no refs.
- added indicator icon to appropriately show which card is a newsletter email one
- fixed bug of card menu staying the same height when triggered via "/" menu
2020-04-08 14:01:04 +02:00
Peter Zimon
9ecc808c3a Added email icon to Koenig card menu
no refs.
- added appropriate icon to Koenig menu to support newsletter email cards
2020-04-08 13:52:48 +02:00
Kevin Ansfield
40f2b11524 Removed errant console.log 2020-04-06 13:12:17 +01:00
Kevin Ansfield
a9b9b2f3ae Added first draft of email-only card
no issue

- adds "Email" card to the card menus when developer experiments is turned on
- adds `<KoenigTextReplacementHtmlInput>` implementing most of Koenig except:
  - uses html as it's input/output format
  - replaces backtick "code" formatting with `{replacement}`
  - no headings
  - no cards at all
  - minimal toolbar but all formatting is still available using markdown text expansions or keyboard shortcuts
2020-04-06 10:56:40 +01:00
Kevin Ansfield
07850fd319 🐛 Fixed Ctrl/Cmd+Enter toggling cards into edit mode
no issue

- the card wrapper component was registering an event handler for keyboard events when entering edit mode. This was a problem because those events were also picking up the initial ctrl/cmd+enter and then immediately toggling back out of edit mode
- added a 20ms timeout for registering the event handlers so that they're not working cross-purposes
2020-04-06 10:49:23 +01:00
Kevin Ansfield
6f5c2a9557 Switched to explicit mobiledoc version for new posts
no issue

- when the mobiledoc spec changes due to a mobiledoc-kit version bump, any posts created with that version will fail to load in the editor if a rollback to an earlier Ghost version occurs
- use an explicit version to avoid the problem - we should only be bumping the mobiledoc spec version if we start using features from that version and mark it as a breaking change
2020-03-26 14:27:41 +00:00
Kevin Ansfield
0df2a5da55 🐛 Fixed Ctrl+h and Ctrl+d breaking the editor when used on card boundaries in macOS
closes https://github.com/TryGhost/Ghost/issues/10240

- intercept known macOS content-modifying keyboard shortcuts and simulate the "normal" keyboard events that they map to
  - `ctrl+h`: `Backspace`
  - `ctrl+d`: `Delete`
2020-03-07 21:33:12 +00:00
Kevin Ansfield
98e0f66c59 🐛 Fixed scroll jump in editor when pasting a url onto a selection to create a link
closes https://github.com/TryGhost/Ghost/issues/10090

- when mobiledoc-kit replaces the selection the caret window selection is temporarily set to the whole editor element which was causing our scroll-cursor-into-view routine to scroll incorrectly
- adding the guard allows the first replacement cursor change to be ignored but the second cursor change to be picked up which will do nothing if the text is on-screen, or scroll if it's off screen as normal
2020-03-07 20:23:23 +00:00
Kevin Ansfield
f021badb9f 🐛 Fixed unreachable toolbar when editing wrapped links (#1511)
closes https://github.com/TryGhost/Ghost/issues/9792

- use `getClientRects()` to get separate rectangles for each line of a link and use the mouse position to find the closest one so that the toolbar can be positioned relative to that link section on that line rather than always in the middle of the editor canvas
- pass the rectangle used for positioning the link toolbar through to the link input component so that there is no jumping of position when clicking the edit button
2020-03-07 18:22:56 +00:00
Kevin Ansfield
dfe0b6f810 Updated image card to trigger file browse immediately when inserting
no issue

- removes number of clicks required to insert images, especially when using the `/image` shortcut
- strips `triggerBrowse` property from the payload after inserting to avoid triggering file browse when a post with blank image cards is rendered/re-rendered
2020-02-27 14:38:53 +00:00
Kevin Ansfield
1e46306129 Fixed linting 2020-01-21 17:48:54 +00:00
Kevin Ansfield
4b40346ff4 Cleaned up unused code in bookmark card
no issue

- the `willDestroyElement` hook is referencing event handlers that aren't used in the bookmark card
- stopped setting `type` in the card payload as it's not used anywhere (possible hangover from when bookmarks were a type of embed card)
2020-01-21 17:45:33 +00:00
Kevin Ansfield
ba4c53134f Upgraded eslint-plugin-ghost and fixed new linter errors
no issue

- update imports for `@ember-data` package (https://github.com/emberjs/rfcs/blob/master/text/0395-ember-data-packages.md)
- use `computed.reads` where applicable (https://github.com/ember-cli/eslint-plugin-ember/blob/master/docs/rules/require-computed-macros.md)
- fix usage of `scheduleOnce` so that functions are only scheduled once (https://github.com/ember-cli/eslint-plugin-ember/blob/master/docs/rules/no-incorrect-calls-with-inline-anonymous-functions.md)
2020-01-16 17:01:12 +00:00
Kevin Ansfield
2231dd84c2 Migrated to <AngleBracketSyntax /> (#1460)
no issue

Ember is migrating to `<AngleBracketSyntax />` for component invocation, see https://github.com/emberjs/rfcs/blob/master/text/0311-angle-bracket-invocation.md

We were in a half-way situation where some templates used angle bracket syntax in some places, this PR updates templates to use the syntax everywhere.

This simplifies the rules for what template code is referring to...

`<Component>` = a component
`{{helper}}` = a helper (or locally assigned handlebars variable)
`{{this.foo}}` = data on the template backing context (a component/controller)
`{{@foo}}` = a named argument passed into the component that the component backing class has not modified (note: this commit does not introduce any named arguments)

- ran codemod https://github.com/ember-codemods/ember-angle-brackets-codemod on the following directories:
  - `app/templates`
  - `lib/koenig-editor/addon/templates`
- removed positional params from components as angle bracket syntax does not support them
  - `gh-feature-flag`
  - `gh-tour-item`
  - `gh-cm-editor`
  - `gh-fullscreen-modal`
  - `gh-task-button`
- updates some code that was missed in 3c851293c1 to use explicit this
2020-01-16 15:14:03 +00:00
Peter Zimon
0fef1f61e0 Getting rid of super-thin font weights 2019-11-22 11:53:57 +01:00
Peter Zimon
e39ebcd856 Fixed generic card action toolbar height
no issue
2019-10-29 15:55:02 +01:00
Kevin Ansfield
595110f354 🐛 Fixed editor showing incorrect domain and "unsaved changes" modal for relative links
no issue

- convert relative links to absolute based on the configured blog url when displaying URLs in the link toolbar and when manually setting a relative link
  - converting to absolute in the editor prevents the in-memory mobiledoc getting out of sync with the server response when it converts relative urls to absolute
2019-10-29 11:57:29 +00:00
Kevin Ansfield
538d031908 Remove deprecated ember-cli-htmlbars-inline-precompile dependency 2019-10-14 09:51:40 +01:00
John O'Nolan
af6d19631e Improved alt text UI legibility (#1324) 2019-09-24 15:35:22 +01:00
Kevin Ansfield
7c0db288b4 Fixed "undefined" appearing in markdown card styles
no issue
2019-08-28 09:56:45 +01:00
Rishabh Garg
7543d23e3d Added bookmark card and integrated it as fallback for unknown embeds (#1293)
requires https://github.com/TryGhost/Ghost/pull/11024

With the bookmark card you can present links in a much richer format, similar to Twitter cards. If the URL points to a page with right meta information it can show the page title, excerpt, author, publisher and even a preview image.

Bookmark cards can be created in two ways:

1. pasting a link as the first thing in blank paragraph - we'll check to see if we can create an embed, if we can't then we'll create a bookmark card instead
2. manually selecting the bookmark card from the (+) menu or by typing "/bookmark<kbd>Enter</kbd>" or "/bookmark {url}<kbd>Enter</kbd>" for short (you might want to do this if you want the bookmark version instead of a full embed)

Pressing <kbd>Ctrl/Cmd+Z</kbd> after pasting will convert the bookmark card back to a link if that's preferred, alternatively a URL can be pasted with <kbd>Ctrl/Cmd+Shift+V</kbd> to avoid any automatic transformation to an embed/bookmark.

---

- adds "bookmark" card that functions similarly to the embed card
- if the oembed API request returns `type: "bookmark"` then the metadata is used to create a bookmark card
2019-08-27 15:10:31 +01:00
Kevin Ansfield
dad908911b Added ability to edit alt text for image cards
no issue

- adds an "Alt" button that is displayed in the caption input whilst an image card is selected, clicking it toggles between the rich-text caption input and a plain-text alt text input
2019-07-23 18:13:41 +01:00
Kevin Ansfield
46d5b779ae 🐛 Fixed unexpected image positions when re-ordering gallery images
no issue

- the position that images were inserted did not always match the position indicator because of errors in the insert index calculations
2019-07-05 14:54:22 +01:00
Kevin Ansfield
526c94d954 Added ability to drag images in and out of galleries
no issue

- adjust drag handlers in the editor and gallery card to handle drag/drop of image cards as well as straight images
- adjust drag handlers in the gallery card to handle image inserts as well as re-orders
- add `onDragEnd` event/action to the Koenig drag-n-drop handler so that containers can perform cleanup if one of their draggables was successfully dropped into a different container
- change ghost element when dragging an image card to be an image rather than a card icon
  - allow `createGhostElement` function passed in when registering a drag-n-drop container to fall back to the default behaviour by returning a falsy value
2019-07-05 14:54:22 +01:00
Kevin Ansfield
a2bb7c95f2 Update dependency eslint-plugin-ghost to v0.3.0 (#1247)
no issue

- update dependency `eslint-plugin-ghost` to v0.3.0
  - includes new rules from `eslint-plugin-ember` 6.3.0-6.7.0
- fixed linting failures for new rules
2019-06-24 16:33:21 +01:00
Peter Zimon
c51bce7358 🎨 Updated admin area design and usability (#1232)
refs. https://github.com/TryGhost/Team/issues/205

Major update to Ghost Admin UI including:
- improved general consistency (typography, colors and contrast, UI components, icons)
- new design for post and pages lists, improved discoverability of filters 
- search moved to modal
- account menu is decoupled from ghost logo
- further usability fixes
2019-06-18 11:47:20 +01:00
Kevin Ansfield
83400f6f47 🐛 Fixed markdown text expansion behaviour when similar unexpanded text is present
closes https://github.com/TryGhost/Ghost/issues/10770

- ensure text expansions only occur on the last match before the cursor
- fix subscript text expansion
2019-06-03 21:43:04 +01:00
Kevin Ansfield
70bec996fe Use extracted @tryghost/kg-parser-plugins package
no issue

- `@tryghost/kg-parser-plugins` contains the parser plugins used by the editor and was extracted so that they can be used in server-side html-to-mobiledoc conversion
2019-05-03 10:45:08 +01:00
Kevin Ansfield
d412e624d5 Use extracted @tryghost/kg-clean-basic-html package
no issue
- `cleanBasicHtml` has been extracted to an external package so that it can be used inside the extracted `@tryghost/kg-parser-plugins` package server-side
2019-05-02 17:14:00 +01:00
Kevin Ansfield
1768b864be do not show card toolbar if caption has focus 2019-05-01 15:13:49 +01:00
Kevin Ansfield
ab85412625 extract {{kg-action-bar}} component 2019-05-01 13:57:00 +01:00
Kevin Ansfield
74fa03a72a add figure-to-code-card parser plugin, add language detection to code card parsers 2019-05-01 10:41:42 +01:00
Kevin Ansfield
f64ae7a326 fix caption placeholder text 2019-05-01 09:54:04 +01:00
Kevin Ansfield
0b9aedf060 Added caption support to code cards
no issue
2019-04-30 18:14:49 +02:00
Kevin Ansfield
88e319f89f Fixed invisible caret in captions for cards with no style specified 2019-04-30 17:53:19 +02:00
Zimo
de50206727 Refined code card language input font size
no issue.
2019-04-30 17:03:06 +02:00
Kevin Ansfield
1dad18a06c Added language selection to code cards (#1180)
no issue

- Added a language indicator when in rendered mode and a language input when in edit mode
- Allow code card language to be set with <code>```lang</code>+<kbd>Space/Enter</kbd> expansion 
    - previously <code>\`\`\`</code> would immediately create a code card, the <kbd>Space/Enter</kbd> is now necessary for the insertion to occur
    - lang is optional <code>\`\`\`</code>+<kbd>Space/Enter</kbd> will insert a code card with no language selected
    - requires <kbd>Enter</kbd> to be pressed to finalise the expansion and insert the card
    - added hook for text expansions to skip newline creation for when they are triggered with <kbd>Enter</kbd>
- Set the code card editor's language mode based on selected language
    - set the CodeMirror mode based on the code card payload language
        - add a basic map of language short codes to their respective CodeMirror modes
    - observe `mode` property in `{{gh-cm-editor}}` so that the mode is properly set when it's changed after initial render
2019-04-30 16:46:29 +02:00
Kevin Ansfield
cdb29b3284 Fixed slash-menu appearing empty immediately after setting title on new post
closes https://github.com/TryGhost/Ghost/issues/9847
- the text expansion is triggered twice in this situation, the first time with `""` and the second with `"/"`. The second trigger was trying to match cards to `"/"` which returned an empty card set
- added a quick workaround that ensures we never include a leading `/` in the card selection query
2019-04-29 17:08:40 +02:00
Kevin Ansfield
a89cc44199 Fixed backspace not combining sections if first section is a special markup
refs https://github.com/TryGhost/Ghost/issues/10717#issuecomment-487557026
- avoid triggering special markup delete behaviour when cursor is at the beginning of a section
2019-04-29 14:25:59 +02:00
Kevin Ansfield
0162df47b3 Fixed linting 2019-04-29 13:56:00 +02:00
Kevin Ansfield
2b1fadf757 🐛 Fixed current styling being lost when applying markdown expansions
closes https://github.com/TryGhost/Ghost/issues/10677
- adjusted the basic markdown text expansion behaviour to delete the MD chars and add a markup to the resulting range rather than deleting the whole range and re-adding it
- extracted basic markdown format behaviour into a helper function
- fixed the link markup expansion so that `[](https://example.com)` is recognised and creates a link with the URL as the text
2019-04-29 13:05:04 +02:00
Rishabh Garg
bf6c446f72 Updated to use count words/images helper from SDK (#1159)
refs https://github.com/TryGhost/Ghost/issues/10618

- Updated use of `countWords`, `countImages` and `stripTags` helper from Ghost SDK
- Removed existing local utils copy
2019-04-16 12:50:59 +05:30
Kevin Ansfield
e194a7b571 Fixed image card placeholder image changing on select/deselect 2019-03-22 11:35:59 +00:00
Kevin Ansfield
8d52246353 Fixed "must use set()" error caused by image card random placeholder 2019-03-22 11:31:31 +00:00
Kevin Ansfield
693c6ba12a Bumped ember-cli-babel version in koenig-editor in-repo addon 2019-03-11 10:19:27 +00:00
Zimo
134468983f Added random image card placeholder illustrations
no refs.
- three random illustrations loop as image placeholder illustrations
- increased padding of clickable area for better happy-go-clicky
2019-03-07 15:40:08 +01:00
Zimo
99481261b5 Updated image card placeholder illustration
no refs.
2019-03-07 12:44:33 +01:00
Kevin Ansfield
c4d16d5d67 Bumped dependencies (#1108)
Bumped all non-ember-core dependencies that do not require significant work or that contain unresolvable inter-dependencies.

Skipped:
- `ember-drag-drop` - our usage needs re-working for closure actions
- `ember-infinity`, `ember-in-viewport` - one depends on the other and `ember-light-table` depends on a particular version of `ember-in-viewport` in a way that breaks if they are upgraded

Removed/bumped:
- removed ember-cli-es6-transform
- removed ember-cli-cjs-transform
- removed current-device
- removed ember-responsive
- bumped yarn.lock sub-dependencies
- bumped @ember/jquery
- bumped @tryghost/mobiledoc-kit
- bumped autoprefixer
- bumped broccoli-funnel
- bumped coveralls
- bumped ember-auto-import
- bumped ember-moment
- bumped ember-power-select
- bumped ember-simple-auth
- bumped broccoli-uglify-sourcemap
- bumped ember-cli-eslint and eslint-plugin-ghost with fixes for new rules
- bumped ember-cli-mirage
- bumped ember-cli-pretender
- bumped ember-power-calendar-moment
- bumped ember-power-datepicker
- bumped ember-composable-helpers
- bumped ember-concurrency
- bumped ember-load
- bumped eslint
- bumped walk-sync
- bumped ember-useragent
- bumped fs-extra
- bumped ember-resolver
- bumped @html-next/vertical-collection
- bumped ember-cli-babel
2019-03-05 17:34:00 +00:00
Kevin Ansfield
c6ff5e1315 🐛 Fixed markdown text expansions sometimes resulting in sticky formatting
no issue
- `**bold**` would sometimes result in any further typing keeping bold formatting
- switching to a fixed number of milliseconds helps with timing so mobiledoc-kit does not reset the internal format state _after_ the actions queue had already run
2019-02-24 18:31:36 +07:00
Kevin Ansfield
0be81afddf Fixed linting 2019-02-24 16:07:09 +07:00
Kevin Ansfield
301f633e1c Fixed kgStyle import statement 2019-02-24 15:48:08 +07:00
Kevin Ansfield
0d9bb4a07b Moved Spirit CSS library from external to internal 2019-02-24 11:19:22 +07:00
Kevin Ansfield
d6c22df6d7 🎨 Separated post and page list screens (#1101)
no issue
- added `page` model
- removed `page` param from Post model
- added pages screen with associated links
- added `:type` param to editor screens to work with the right models
- removed post<->page toggle and associated tour item
2019-02-22 10:17:33 +07:00
Kevin Ansfield
b7e0614362 Added undefined guards to uses of JSON stringify/parse copying
no issue
- added guards for JSON stringify+parse replacements of `Ember.copy` introduced in 6fe40b941b
2019-01-30 14:44:53 +00:00
Kevin Ansfield
6fe40b941b Fixed Ember.copy deprecations
refs https://github.com/TryGhost/Ghost/issues/10310
- https://emberjs.com/deprecations/v3.x/#toc_ember-runtime-deprecate-copy-copyable
2019-01-30 10:14:07 +00:00
Kevin Ansfield
c763b3218e 🐛 Fixed drag-n-drop card reordering interfering with caption and markdown/html card text selection
closes  https://github.com/TryGhost/Ghost/issues/10399
- added a data attribute `data-koenig-dnd-disabled` which will prevent the element or any of it's children from initiating a koenig drag event
  - applied the data attribute to `{{koenig-basic-html-input}}`'s outer tag so that captions never initiate a card re-order
- disabled card re-ordering when a card is in edit mode
  - allows text selection within a markdown/html card without triggering the card re-order behaviour
  - clicking another card will exit edit mode and re-enable drag before the drag behaviour is initiated so you can still re-order other cards if you've left a card in edit mode
2019-01-28 09:35:58 +00:00
John O'Nolan
1885d0a193 Update Unsplash logo 2019-01-23 15:05:28 +07:00
Kevin Ansfield
428153dcd5 Removed babel polyfill
no issue
- the polyfill is no longer required for latest browsers (tested on Chrome, FF, and Safari)
- Edge may have problems but it's not currently supported
- reduces build size. Before/after:
  - `vendor.min.js: 3.29 MB (706 KB gzipped)`
  - `vendor.min.js: 3.2 MB (672.92 KB gzipped)`
2019-01-22 14:03:27 +00:00
Kevin Ansfield
042aecb7f6 Switch from embor-browserify to ember-auto-import
no issue
- minor reduction in build size. Before/after:
  - `vendor.min.js 3.32 MB (710.66 KB gzipped)`
  - `vendor.min.js 3.29 MB (706 KB gzipped)`
2019-01-22 13:09:38 +00:00
Kevin Ansfield
73daa80b7f Migrate to latest ember, ember-mocha and modern ember testing (#1044)
no issue
- upgrade to latest `ember-source` and related dependencies including `ember-cli`
- upgrade to latest `ember-mocha` and modern ember testing setup
    - https://github.com/emberjs/rfcs/blob/master/text/0268-acceptance-testing-refactor.md
    - switch from using global acceptance test helpers and `native-dom-helpers` to using the new `ember-test-helpers` methods
    - use [`chai-dom`](https://github.com/nathanboktae/chai-dom) assertions where in some places (still a lot of places in the tests that could use these)
- pin `ember-in-viewport` to 3.0.x to work around incompatibilities between different versions used in `ember-light-table`, `ember-infinity`, and `ember-sticky-element`
    - incompatibilities manifested as "Invalid value used as weak map key" errors thrown when using `ember-light-table` (subscribers screen)
- pin `ember-power-datepicker` to unreleased version that contains a move from global acceptance test helpers to modern test helpers
2019-01-02 09:58:55 +00:00
Kevin Ansfield
6d11fd7ac6 Fixed koenigDragDropHandler._resetDrag throwing errors
no issue
- guard around `_elementsWithHoverRemoved` is necessary because it won't always be set
2018-12-17 17:21:22 +00:00
Kevin Ansfield
661b35ba51 Added drag-and-drop card re-ordering in the editor (#1085)
no issue
- add vertical drop position indicator handling to `koenig-drag-drop-handler` service
- fixed issues with nested drag-and-drop containers
- register card drag/drop handler in `koenig-editor`
    - add drag icon creation
2018-12-17 14:02:40 +00:00
Kevin Ansfield
46662e590f Fixed error thrown by editor caption input when pressing Escape 2018-12-13 15:22:47 +00:00
Kevin Ansfield
165b2efac9 Added auto-scroll when dragging gallery images (#1083)
no issue

Adds auto-scroll if the mouse is placed near the top or bottom of the window whilst dragging an image to re-order it within a gallery. Useful when the position you want to drag to is not currently on screen.

- append drop indicator element to `.koenig-editor` element to account for scrolling (also fixes indicator positioning bug with current implementation if you use mouse-wheel or keyboard to scroll the page whilst dragging)
- generalise `getParent` util to accept a 
  - switch to using selectors rather than dataset for finding parent draggable/droppable/container
- add a `ScrollHandler` class that is used by the `koenigDragDropHandler` service to trigger scrolling whilst dragging
2018-12-13 12:17:43 +00:00
Kevin Ansfield
00ee6ebedd Fixed drag-n-drop reorder of gallery images not responding to drops
no issue
- https://github.com/TryGhost/Ghost-Admin/pull/1081 introduced a bug where the `insertIndex` was being cleared every time we showed the drop position indicator because we hide the indicator as a reset every time we show the indicator. This meant every drop was missing the required insertIndex.
- added a flag to the `_hideDropIndicator` function so that a reset when showing the indicator doesn't clear the required information
2018-12-11 13:20:05 +00:00
Kevin Ansfield
f743697450 Fixed overlay overflow on left-most images in gallery card
no issue
- margin was applied to the wrong edge
2018-12-11 13:01:22 +00:00
Kevin Ansfield
9ed6ea0f1e Fixed gallery image changing order randomly when dropped on itself (#1081)
no issue
- clear the cached `insertIndex` when hiding the drop position indicator
- update the gallery card's `_isDropAllowed` function to return `false` if the `droppabeIndex` (`insertIndex`) doesn't exist
2018-12-11 12:13:51 +00:00
Kevin Ansfield
a565abf5bb Fixed drop indicator not showing if placed directly between images (#1082)
no issue
- when dragging an image, if you dragged out of the gallery then back in directly over the space between images then no indicator was shown
- switch to using padding around images rather than margin so that the mouse can be detected over the gap. Added classes to the image overlays to account for the change in sizing
2018-12-11 12:13:15 +00:00
Kevin Ansfield
5647459a2b Added drag-n-drop re-ordering of images within gallery cards (#1073)
no issue
- first pass at implementation of drag-and-drop re-ordering of images within a gallery
- adds a `koenig-drag-drop-handler` service that allows consumers (editor and cards) to hook into drag and drop behaviour without interfering with each other and allows for future possibilities such as dragging images between galleries or into/out of galleries
2018-12-11 10:05:59 +00:00
Kevin Ansfield
48854e4812 Bumped editor undo states to 100 2018-12-06 10:08:49 +00:00
Kevin Ansfield
2639ff62e6 Optimised gallery image upload previews (#1079)
no issue
- use `URL.createObjectURL(file)` to get a blob url rather than using `FileReader.readAsDataURL` which generates a very large data attribute
- speeds up the display of previews and associated browser hangs when an upload finishes, especially noticeable with large images and fast connections where multiple uploads finish around the same time
2018-12-05 20:16:03 +00:00
Peter Zimon
8ae47cd0e5 UI refinements (#1075)
no issue
* Update negative margin of card indicators
* Update to Spirit 0.0.49
2018-11-26 14:25:47 +00:00
Rishabh Garg
f3ea465435 Added image validation error message to gallery card (#1048)
closes https://github.com/TryGhost/Ghost/issues/9840
- added error on uploading an invalid image format
  - updated to use overall error method(`onFailed`) to set error message instead of individual upload failures(`onUploadFailure`)
2018-11-26 10:31:02 +00:00
Zimo
3a26ba018e Fixing negative margins of Koenig embeds 2018-11-20 11:12:15 +01:00
Kevin Ansfield
0d08c639fe 🐛 Fixed editor undo states for card contents (#1064)
refs https://github.com/TryGhost/Ghost/issues/10049
- update `{{koenig-card}}` component to compare payload values and create a snapshot when exiting edit mode for container cards (markdown, html, code)
- update image card to trigger snapshots on image upload/selection and width change
2018-11-06 14:43:19 +00:00
Kevin Ansfield
874ae6078b Fixed 'set on destroyed object' error in tests
no issue
- we were throttling word count updates but not taking into consideration the editor components could have been destroyed by the time the throttle timeout occurred
2018-09-24 11:09:19 +01:00
Kevin Ansfield
b50e7c3b67 🐛 Fixed broken editor state when deleting a selection containing cards
closes https://github.com/TryGhost/Ghost/issues/9852
- Ember was throwing an error because we weren't using `.set` to set properties on the editor component which halted execution whilst the component cards were being re-rendered
2018-09-17 11:48:13 +01:00
Kevin Ansfield
f11f6ef9b3 🐛 Fixed ` not triggering code text expansions on German keyboards (Win/macOS only) (#1042)
closes https://github.com/TryGhost/Ghost/issues/9825
- the <code>`</code> key on German keyboard layouts is a dead key and so does not trigger the typical keyboard events our editor relies on
- added custom keyboard event listeners to watch for specific keyboard event sequences triggered by using the dead key + spacebar to insert a <code>`</code>
  - trigger text input handlers when we detect a <code>`</code> insertion
  - Linux unfortunately does not trigger events that can be used to track the sequence so this will not work there although it is easier to set up keyboard layouts without dead keys on Linux
- moved modifier key tracking into global event handlers from ember event handlers
  - reduce confusion from duplicated event handling
  - allows modifier key handlers to fire when keys are pressed without the editor element having focus
2018-09-05 17:51:57 +01:00
Kevin Ansfield
bfe985abe2 Do not allow upload of invalid images to gallery
no issue
- added `onUploadStart` action to `{{gh-uploader}}` that is triggered when individual files start uploading
  - will not be triggered for any files that fail client-side validation
- changed `{{koenig-card-gallery}}` to only add images to the local gallery display when the uploader starts an upload
2018-08-31 12:01:08 +01:00
Kevin Ansfield
a11ccccae0 Updated gallery error message copy 2018-08-31 11:10:14 +01:00
Kevin Ansfield
ee7f8516c3 Refactored gallery card
no issue
- moved all payload building into single function
  - only put fully valid images into mobiledoc
- extracted image data reading and width/height reading into a separate function
- fixed re-ordering when deleting an image
2018-08-31 10:36:19 +01:00
Kevin Ansfield
08179545ab Added gallery card to the editor
no issue
- added gallery card (initial implementation)
    - supports upto 9 images in gallery
    - max 3 images per row
- fixed gh-uploaded error handling for generic errors
- ignore jsconfig.json
2018-08-30 17:48:20 +01:00
Zimo
8f9fec3cda Adding hover state for image placeholder 2018-08-27 13:56:21 +01:00
Kevin Ansfield
9c299b973a Koenig - Fixed missing borders on some embeds
refs https://github.com/TryGhost/Ghost/issues/9724
- removed 1px white border on embed card click overlay so that it doesn't cover borders used by certain embeds such as Instagram and Facebook posts
2018-08-20 13:34:45 +01:00
Zimo
81ef283c06 Replacing Facebook embed with Spotify 2018-08-15 18:11:16 +02:00
Kevin Ansfield
09fea26f60 Fix linting 2018-08-15 16:52:06 +01:00
Kevin Ansfield
8c2ff43707 🐛 Koenig - Fixed pasting of plain text
refs https://github.com/TryGhost/Ghost/issues/9724
- `formatMarkdown` was previously changed to return a SafeString but that meant any direct usage of the helper had to account for not dealing with a basic String type
- changed `formatMarkdown` to return a basic String
- modified helper usage of `{{sanitize-html}}` to use triple-curlies
2018-08-15 16:25:02 +01:00
Zimo
a7e9697eac Koenig - Minor design refinements
refs https://github.com/TryGhost/Ghost/issues/9724
- fixed Card menu plus icon's rounded edges
- decreased link toolbar appearance delay
- changing 'H'/'h' toolbar mapping to 'H2'/'H3' and harmonized title font size
2018-08-14 14:35:13 +01:00
Kevin Ansfield
39bcc841a6 🎨 Koenig - Added paste-url-over-selection link creation to caption inputs
refs https://github.com/TryGhost/Ghost/issues/9724
- the "paste url on a selection to make it a link" feature from the main editor was missing in caption inputs
- copied functionality across (shared functionality needs extracting at some point)
2018-08-13 10:59:13 +01:00
Kevin Ansfield
22d07c9692 🐛 Koenig - Fixed pasting of rich-text image captions losing formatting
refs https://github.com/TryGhost/Ghost/issues/9724
- caption payload changed from `textContent` to a cleaned `innerHTML` in our `figureToImageCard` parser plugin
2018-08-13 10:41:01 +01:00
Kevin Ansfield
e082d40d56 🐛 Koenig - Fixed rich-text captions sometimes losing spaces
refs https://github.com/TryGhost/Ghost/issues/9724
- `clean-basic-html` was being overzealous with it's empty element removal, often contenteditable (especially when pasting) will result in HTML such as `<span>&nbsp;</span>` which was being completely removed
- if an empty element has any spaces in it, replace the element with a textNode containing a single space
2018-08-13 10:37:45 +01:00
Kevin Ansfield
61ad09cbc4 🐛 Koenig - Fixed missing alt/title attributes when pasting markdown or HTML
refs https://github.com/TryGhost/Ghost/issues/9724
- capture the `alt` and `title` attributes in our figure and image parser plugins
2018-08-13 09:50:56 +01:00
Kevin Ansfield
cb7a038b08 Koenig - Fixed backspace not removing card after inserting Unsplash image
refs https://github.com/TryGhost/Ghost/issues/9724
- focus was not being returned to the editor after the Unsplash modal was closed so although the image card looked selected the editor was not responding to any key commands
2018-08-11 18:30:59 +01:00
Kevin Ansfield
c33a0c23bc Koenig - Prevent "Enter" being inserted into captions
refs https://github.com/TryGhost/Ghost/issues/9724
- mobiledoc-kit's `key.isPrintable()` returns true for <kbd>Enter</kbd> but in this instance we don't want to capture newlines as printable chars
- swapped insertion of `event.key` for `key.toString()` for better handling of named keys that output characters (eg. when `event.key` === `Enter` which prints `\n`)
2018-08-11 18:26:30 +01:00
Kevin Ansfield
6943e1d27a Koenig - Fixed .cleanup when called during editor initialisation
refs https://github.com/TryGhost/Ghost/issues/9724
- we call `koenig.cleanup` when setting a post in the editor controller but the call will happen before `componentCards` has been populated so none of our "delete if empty" routines were being run
- calls to `.cleanup` now schedule the cleanup after the next editor render which should mean cards are populated before we try to remove them
2018-08-10 18:11:35 +01:00
Kevin Ansfield
4463f975e3 Koenig - Unsplash integration
refs https://github.com/TryGhost/Ghost/issues/9724
- standardised `{{gh-unsplash}}` actions and action arguments to better represent a generic "image source"
- added `{{gh-unsplash searchTerm="ghosts"}}` parameter
- added `payload` param to `card` definitions used for plus/slash menus so that default payload params can be passed to cards
- added a concept of "image selectors" to image card
  - if a `payload.imageSelector` param is received by the card it will look it up in it's list of known selectors and display the appropriate image selection component
  - if the card was created with an image selector param and the image selector is closed without selecting an image then the card will be removed
- delete image cards during cleanup if they were created via selector but have no src
2018-08-10 18:11:35 +01:00
Zimo
7892e4901d Koenig - Updated menu icons
- changed icons for coloured set
- added Unsplash icon
- bumped Spirit for menu-related style updates
2018-08-10 11:18:02 +01:00
Kevin Ansfield
359fcb0756 Koenig - Pass html card content through sanitiser
refs https://github.com/TryGhost/Ghost/issues/9724
- extract html sanitisation into a Koenig helper `{{sanitise-html}}` (all markdown handling will eventually move into Koenig too)
- render sanitised html in the html card
2018-08-09 14:59:03 +01:00
Kevin Ansfield
9832414374 Fixed linting 2018-08-09 10:18:45 +01:00
Kevin Ansfield
82dbf972a9 Koenig - Fix divider card text expansion
no issue
- re-org of the text-expansions code meant that the smart hyphens expansion was being picked up before the divider card expansion and blocking it
2018-08-08 15:52:13 +01:00
Kevin Ansfield
fe13a46273 Koenig - Allow clicks on rich-text captions to place cursor immediately
refs https://github.com/TryGhost/Ghost/issues/9724
- add a `data-kg-allow-clickthrough` attribute so that it's possible to explicitly allow non-input elements to be clicked immediately when clicking on a card
2018-08-08 15:48:31 +01:00
Kevin Ansfield
fbcc320f54 Koenig - Fixed broken styles
no issue
- bump `ghost-spirit` version to fix selectors
2018-08-08 14:45:45 +01:00
Zimo
115a9ce554 Fixing icon style for text toolbar 2018-08-08 15:29:33 +02:00
Kevin Ansfield
cff6789a35 Koenig - Fixed error in {{clean-basic-html}} when passed null/undefined
no issue
- default param was not protecting against null value being passed via helper params
2018-08-08 13:50:42 +01:00
Kevin Ansfield
83924194f5 Koenig - Added rich-text support to captions
refs https://github.com/TryGhost/Ghost/issues/9724
- added `{{koenig-basic-html-input}}` component
  - uses a stripped down version of Koenig
  - supports all inline formatting that Koenig supports
  - supports inline text expansions
  - supports inline key commands
  - limited to a single paragraph
  - serialises and deserialises from HTML rather than mobiledoc
- updated `{{koenig-caption-input}}` to use `{{koenig-basic-html-input}}`
- updated image and embed cards to calculate word counts correctly for html captions
- bumped Spirit dependency to fix styling of toolbars within the editor canvas
- fixed positioning in toolbar components to account for `parentElement` not necessarily being the closest element to position against
2018-08-08 13:38:41 +01:00
Peter Zimon
b4ea1a59e2 Koenig - Design refinements (#1032)
refs https://github.com/TryGhost/Ghost/issues/9724
- made floating header and footer elements in Koenig opaque
- switched to filled toolbar icons + icon cleanup
- fixed Koenig placeholder image size in Firefox
- increased "wide" image width on smaller screens
- refined divider card margins
- fixed long links not wrapping
2018-08-08 13:14:02 +01:00
Kevin Ansfield
7b09fedae2 Koenig - Do not select embed card when auto-converting pasted URL
refs https://github.com/TryGhost/Ghost/issues/9724
- selecting the embed card as soon as it's created causes problems with the caption input grabbing focus which interferes with being able to continue typing
- if content exists after the paste move the cursor to the beginning of the next section, otherwise create a blank paragraph and move the cursor into that
2018-08-02 15:10:00 +01:00
Kevin Ansfield
d1ea14ab8d Koenig - Fixed embeds cards
no issue
- `set` call to remove `linkOnError` from the embed card payload was malformed
2018-08-02 14:39:31 +01:00
Kevin Ansfield
54cc17707f Koenig - Auto-convert URLs pasted on blank lines to embed cards
refs https://github.com/TryGhost/Ghost/issues/9724
- if a URL is pasted in a blank paragraph, insert an embed card configured to switch immediately to a link if the embed fails
- if <kbd>Shift</kbd> is pressed when pasting insert a linked URL with no auto-embed
- added `payload.linkOnError` handling to the embed card
  - if that option is set, immediately convert the embed card section to a linked URL on embed failure
  - skip adding an undo step when auto-converting to a URL so that no undo loop is created. Without this an undo would convert from link to embed card which would automatically look up the url then convert back to a link meaning it's impossible to undo back past the URL paste
  - ensure that the cursor position doesn't jump if the user has continued writing whilst the oembed lookup is in progress
2018-08-02 13:09:32 +01:00
Kevin Ansfield
f1beff3c03 Koenig - Support /image {image url} slash menu shortcut
refs https://github.com/TryGhost/Ghost/issues/9724
- add `src` param to the `image` card for use in the slash menu
- typing `/image http://example.com/image.jpeg` then pressing <kbd>Enter</kbd> will create an image card with the src pre-set
2018-08-01 14:17:09 +01:00
Kevin Ansfield
4cf9220ef4 🐛 Koenig - Fixed duplicate images when dropping image file on an image card
refs https://github.com/TryGhost/Ghost/issues/9724
- `card.handlesDragDrop` was never accessible, it would have had to be registered through `card.koenigOptions.handlesDragDrop` when the drop handling was first added
- as of cc2e20a486 properties on card components are directly accessible so we can use `card.component.handlesDragDrop` to guard against the editor handling drops on cards that handle their own drops
2018-08-01 12:36:02 +01:00
Kevin Ansfield
f4a21bd1f6 🐛 Koenig - Fixed error when dropping an image before the editor has focus
refs https://github.com/TryGhost/Ghost/issues/9724
- adjust `insertImageCards()` to handle the editor not having an active section
- add `jumpToCard` option to `_scrollCursorIntoView()` so that we can scroll to a card when appropriate
- call `_scrollCursorIntoView()` after dropping images and creating cards
2018-08-01 10:00:05 +01:00
Peter Zimon
3bd8a1b3da Koenig - Design refinements (#1031)
refs https://github.com/TryGhost/Ghost/issues/9724
- fixed image card background colour
- made placeholder illustration for image cards work with Night Shift
- added viewbox prop to `summer.svg` illustration
- bumped ghost-spirit dependency
  - fixed link discoverability when spellcheck is on
  - fixed list spacing after headings 3-6 and refined list line heights
  - added quick transition to format toolbar chiclet
  - removed minimum width for image caption
  - fixed wide image width in Safari
2018-07-31 10:57:58 +01:00
Kevin Ansfield
821a5d38ab 🐛 Koenig - Fixed numpad Enter key not behaving like normal Enter key
refs https://github.com/TryGhost/Ghost/issues/9724
- `event.code` represents physical key location rather than the associated key value. Eg, `event.code` could be `NumpadEnter` rather than the expected `Enter` value
- ensure we use `event.key` anywhere that we are acting on the key value so that re-mapped or virtual keys still work as expected
2018-07-30 14:40:00 +01:00
Kevin Ansfield
f321f0c07b Koenig - Fixed error from plus menu when leaving editor
refs https://github.com/TryGhost/Ghost/issues/9724
- leaving the editor could result in the plus menu being removed from DOM before teardown has fully cleared up the event handlers resulting in an error being thrown in the mousemove handler where we assumed the element is present
2018-07-25 15:48:44 +01:00
Kevin Ansfield
fc16a8f333 🐛 Koenig - Fixed Firefox cursor getting stuck on cards when pressing Up
refs https://github.com/TryGhost/Ghost/issues/9724
- Firefox has a bug that prevents the cursor from moving from one element to another when pressing <kbd>Up</kbd> in certain circumstances
- added workaround that replicates the default behaviour that all other browsers have so that <kbd>Up</kbd> can always move to the previous section
2018-07-23 13:45:49 +01:00
Kevin Ansfield
fb6bf6b97d Koenig - Rename image card payload.imageStyle to payload.cardWidth (#1028)
requires https://github.com/TryGhost/Ghost/pull/9741
- using `payload.cardWidth` so that it's more generic than having separate width attributes for every card
2018-07-23 12:21:32 +01:00
Kevin Ansfield
cc2e20a486 Koenig - Added reading time and word count display
refs https://github.com/TryGhost/Ghost/issues/9724
- add `registerComponent` hook to cards so that `{{koenig-editor}}` can fetch properties from card components directly
- add word count and reading time utilities
- add throttled word count update routine to `{{koenig-editor}}` that walks all sections and counts text words or fetches word/image counts from card components
- add `wordCountDidChange` hook to `{{koenig-editor}}` so that word count + reading time can be exposed
- modify editor controller to update it's own word count property when koenig triggers it's action
- modified the editor template to show reading time + word count next to the post status
2018-07-20 15:53:21 +01:00
Kevin Ansfield
0bfe190bb3 Koenig - Implement full set of text editing shortcuts
refs https://github.com/TryGhost/Ghost/issues/9724
- <kbd>Ctrl+Alt+1</kbd> - Togggle heading level 1
- <kbd>Ctrl+Alt+2</kbd> - Togggle heading level 2
- <kbd>Ctrl+Alt+3</kbd> - Togggle heading level 3
- <kbd>Ctrl+Alt+4</kbd> - Togggle heading level 4
- <kbd>Ctrl+Alt+5</kbd> - Togggle heading level 5
- <kbd>Ctrl+Alt+6</kbd> - Togggle heading level 6
- <kbd>Ctrl/Cmd+H</kbd> - Cycle through heading levels 2-6
- <kbd>Ctrl+Q</kbd> - Toggle blockquote
- <kbd>Ctrl+L</kbd> - Toggle unordered list
- <kbd>Ctrl/Cmd+K</kbd> - Toggle link
- <kbd>Ctrl/Cmd+B</kbd> - Toggle bold
- <kbd>Ctrl/Cmd+I</kbd> - Toggle italic
- <kbd>Ctrl/Cmd+U</kbd> - Toggle underline
- <kbd>Ctrl+Alt+U</kbd> - Toggle strikethrough
- <kbd>Ctrl/Cmd+Shift+K</kbd> - Toggle code
2018-07-20 13:24:48 +01:00
Kevin Ansfield
cc41f07213 🎨 Koenig - Allow Ctrl/Cmd+Enter to exit card edit mode
refs https://github.com/TryGhost/Ghost/issues/9724
- <kbd>Ctrl/Cmd+Enter</kbd> is the shortcut to enter edit mode of a card that has it
- adds <kbd>Ctrl/Cmd+Enter</kbd> as a shortcut to exit edit mode as an addition to <kbd>Escape</kbd> for easier toggling in/out of edit mode
2018-07-18 15:15:07 +01:00
Kevin Ansfield
235d71d6a0 🐛 Koenig - Fixed required double-click on (+) when cursor is not in same paragraph
refs https://github.com/TryGhost/Ghost/issues/9724
- ignore the range change which would otherwise close the menu when clicking a (+) next to a different paragraph then the one the cursor is currently on
2018-07-18 15:04:02 +01:00
Kevin Ansfield
e659dcdec7 🐛 Koenig - Prevent double-clicks to enter MD edit mode triggering toolbar buttons
refs https://github.com/TryGhost/Ghost/issues/9724
- add an overlay to the markdown card for 500ms when entering edit mode to stop extra clicks accidentally triggering toolbar buttons
2018-07-18 14:34:11 +01:00
Kevin Ansfield
0c35edd372 🐛 Koenig - Fixed Safari scrolling to bottom of post when using link input
refs https://github.com/TryGhost/Ghost/issues/9724
- `autofocus="true"` in Safari was overriding the custom focus method which keeps the scroll position locked
2018-07-18 12:54:09 +01:00
Kevin Ansfield
075037cadb Koenig - Fixed /-menu Enter card creation
refs https://github.com/TryGhost/Ghost/issues/9724
- eb865f841f introduced a bug because it expected an event param that is only available when clicking
- add guard to check for `event` presence before attempting to stop propagation
2018-07-18 11:41:01 +01:00
Kevin Ansfield
eb865f841f 🐛 Koenig - Fixed clicking certain icons in /-menu not creating cards
refs https://github.com/TryGhost/Ghost/issues/9724
- the click event from clicking on the /-menu items continued propagating after the card was initialised which meant it was picked up by the card as a "click off the card" so certain cards such as the Markdown/HTML cards would then remove themselves as if they were deselected with empty content
- changed the icon click handler to use the DOM `onclick` syntax so that the click can be captured immediately rather than waiting for it to bubble up to Ember's global event handler
- updated the /-menu `itemClicked` action to use the now-accessible MouseEvent to stop it propagating any further and triggering unwanted card behaviour
2018-07-17 17:22:28 +01:00
Kevin Ansfield
62d626a9fd 🐛 Koenig - Fixed "Retry" link in embed card error message
refs https://github.com/TryGhost/Ghost/issues/9724
- `element.contains(target)` was not reliably picking up the `<span>` inside the `<button>` element
- added a fallback that searches the event path for the card component's ID
2018-07-17 17:02:36 +01:00
Kevin Ansfield
8a76e5346a 🐛 Koenig - Fixed error when clicking embed icons in /-menu
refs https://github.com/TryGhost/Ghost/issues/9724
- `{{koenig-menu-content}}` does not pass any params through when an item is clicked
- move the `params` fetching via the query string from `_performAction()` to `actions.itemClicked` so that it works for both <kbd>Enter</kbd> and icon clicks
2018-07-17 14:32:49 +01:00
Kevin Ansfield
1027f85a68 🐛 Koenig - Fixed up/down cursor movement in Firefox and Edge
refs https://github.com/TryGhost/Ghost/issues/9724
- update Spirit so that we're not using `display: flex` on the `contenteditable` element
2018-07-12 16:42:14 +01:00
Kevin Ansfield
beab7a7a4f 🐛 Koenig - Fixed /-menu not working after the editor is reloaded
refs https://github.com/TryGhost/Ghost/issues/9724
- if the editor was reloaded by changing the post model either through clicking "New story" or using the search from the editor screen the /-menu would stop working
- keep track of the last seen `editor` instance inside `{{koenig-slash-menu}}` and register the `/` text input handler on the new editor instance if it changes
2018-07-11 15:08:51 +01:00
Kevin Ansfield
821696a7d7 🐛 Koenig - Fix Firefox adding "ArrowUp" or similar to caption fields
refs https://github.com/TryGhost/Ghost/issues/9623
- Firefox unlike other browsers triggers `keypress` events for non-printable characters
- use mobiledoc-kit's `Key` class to guard against adding non-printable key values to captions
2018-06-21 17:57:45 +01:00
Kevin Ansfield
06e6f42224 🐛 Koenig - Fixed caption/embed inputs in Firefox & Safari
refs https://github.com/TryGhost/Ghost/issues/9623
- disable `contenteditable` on the main editor element when an input in a card gains focus
    - Firefox chokes on inputs inside a `contenteditable` element
    - use a MutationObserver inside `{{koenig-card}}` to automatically add event handlers for focus/blur events so that each card is not required to set up handlers and enable/disable content editable manually
- bump Spirit dependency
    - remove `user-select: none` styling from `.form-text` for text inputs
    - fixes captions and embed inputs in Safari and improves behaviour in Firefox
- add a guard around `getSelection(0)` in the `_scrollCursorIntoView()` method to avoid Safari throwing errors
2018-06-21 15:47:50 +01:00
Kevin Ansfield
749839a8e1 🐛 Koenig - Fixed card click-to-deselect in Safari/Firefox
refs https://github.com/TryGhost/Ghost/issues/9623
- only Chrome exposes `MouseEvent.path` so use `MouseEvent.composedPath()` for Safari/FF support
2018-06-20 17:34:50 +01:00
Kevin Ansfield
e4dca1cb70 Koenig - Fixed HR card selection when clicking
refs https://github.com/TryGhost/Ghost/issues/9623
- clicks near the HR card when it was selected would trigger immediate deselection putting the cursor into a position where it was not possible to type
- update the guard in the click-to-deselect event handler to match any element contained by the editor rather than only clicks that are directly on the editor element
2018-06-20 16:54:43 +01:00
Kevin Ansfield
e79120c339 Koenig - Improved closing of (+) menu when cursor moves
refs https://github.com/TryGhost/Ghost/issues/9623
- close menu if it's open and the cursor position changes within the document
  - closes when you start typing rather than hiding text behind the menu
- watch for arrow keys and close the menu if pressed
  - closes when <kbd>Up</kbd> is pressed and the title is selected rather than the cursor being moved within the document
2018-06-20 15:45:43 +01:00
Kevin Ansfield
7ae1df7c8d Koenig - Lazy-click to edit on mouseup not mousedown
refs https://github.com/TryGhost/Ghost/issues/9623
- move lazy-click handling to a mouseup handler instead of mousedown in `{{koenig-card}}`
- ensure that we don't trigger edit mode on the initial mouseup after a mousedown event has selected the card
2018-06-20 15:00:07 +01:00
Kevin Ansfield
a6686e9cef Koenig - Ensure Enter behaviour is consistent when a card is selected
refs https://github.com/TryGhost/Ghost/issues/9623
- clicking a card a second time while it is selected can move the invisible cursor to the beginning of a section in which case <kbd>Enter</kbd> would insert a blank paragraph above the card
- when <kbd>Enter</kbd> is pressed and a card is selected, move the cursor to the end of the card section without triggering our cursor change so that the default behaviour will always add a paragraph after the card
2018-06-20 13:20:49 +01:00
Kevin Ansfield
2fd9b79102 Koenig - Prevent rendered MD links being clickable
refs https://github.com/TryGhost/Ghost/issues/9623
- add an overlay to the rendered MD card so that links aren't clickable
2018-06-20 12:43:51 +01:00
Kevin Ansfield
bd27295ede Koenig - Added drag-n-drop upload/replace support in image card
refs https://github.com/TryGhost/Ghost/issues/9623
- do not process drop in `{{koenig-editor}}` if the drop happened on a card and the card's  `handlesDragDrop` property is true
- allow `dragover` events on cards to bubble up to Ember's event handler in `{{koenig-editor}}`
- handle drag/drop in `{{koenig-card-image}}`
    - show different overlays when dragging files over the card to indicate an upload or replace action
    - start upload when a file is dropped on the card
2018-06-20 12:34:30 +01:00
Kevin Ansfield
d030e7462c 🐛 Koenig - Fixed placement of dropped images
refs https://github.com/TryGhost/Ghost/issues/9623
- ensure images are placed where the cursor is when dropping or pasting images
- fixed errors when dropping/pasting images into a list
2018-06-19 14:42:24 +01:00
Kevin Ansfield
2699671506 🎨 Koenig - Split list when pressing Enter on a blank list item
refs https://github.com/TryGhost/Ghost/issues/9623
- override <kbd>Enter</kbd> behaviour when pressed on a blank list item mid-list
2018-06-19 13:09:46 +01:00
Kevin Ansfield
7bd22a3b87 🐛 Fixed backspace deleting words and rich-text paste collapsing paragraphs
refs https://github.com/TryGhost/Ghost/issues/9623
- switch to custom `mobiledoc-kit` build
  - fixes top-level elements not being run through parser plugins (https://github.com/bustle/mobiledoc-kit/pull/627)
  - fixes <kbd>Alt</kbd> getting stuck and causing <kbd>Backspace</kbd> to delete whole words (https://github.com/bustle/mobiledoc-kit/pull/626)
  - fixes error that can occur when a paste results in blank insert (https://github.com/bustle/mobiledoc-kit/pull/620)
- add new `figureToImageCard` parser
  - replaces hacky workaround to detect an image+figcaption inside the `imgToCard` parser plugin
- remove wrapping of html in a `<div>...</div>` when pasting
  - no longer necessary now that top-level elements are parsed
  - fixes rich-text pastes where multiple paragraphs would be collapsed into a single paragraph
2018-06-18 18:48:32 +01:00
Kevin Ansfield
9e3c5876ee Koenig - Fixed dash text expansions
refs https://github.com/TryGhost/Ghost/issues/9623
- ea2a6a09dc broke dash expansions because the list toggle was matching the `- ` before the dash text expansion could be triggered
- resolved by adding the missing beginning-of-string `^`
2018-06-15 15:43:00 +01:00
Kevin Ansfield
bc97cd39a8 🐛 Koenig - Fixed cursor jumping to title when pressing Up/Left on list items
refs https://github.com/TryGhost/Ghost/issues/9623
- update "exit cursor at top" logic so it doesn't look at the parent ListSection until the cursor has reached the first ListItem in a ListSection
2018-06-15 14:21:01 +01:00
Kevin Ansfield
ea2a6a09dc Koenig - Toggle list types using MD list syntax
refs https://github.com/TryGhost/Ghost/issues/9623
- toggle the list type (unordered vs ordered) when typing `- `, `* `, `1 `, or `1. ` at the beginning of a list item
2018-06-15 14:00:00 +01:00
Kevin Ansfield
54c3e1de66 Koenig - Toggle existing paragraphs into lists using MD list syntax
refs https://github.com/TryGhost/Ghost/issues/9623
- toggle a paragraph to a list when typing `- `, `* `, `1 `, or `1. ` at the beginning of the paragraph
2018-06-15 12:12:12 +01:00
Kevin Ansfield
cf572e3508 Koenig - Fix misaligned toolbar arrow in Night Shift
refs https://github.com/TryGhost/Ghost/issues/9623
2018-06-15 10:35:31 +01:00
Kevin Ansfield
1eaf85e5aa 🎨 Koenig - Keep posts free of blank cards
refs https://github.com/TryGhost/Ghost/issues/9623
- add new `deleteIfEmpty` option when defining cards
- add `.cleanup()` method to `{{koenig-editor}}` that will remove any blank cards
- pass `{{koenig-editor}}` instance up to the editor controller when it is initialised
- call `.cleanup()` in the editor controller when performing full saves, when leaving the editor with a draft, and when opening the editor with a draft
2018-06-14 16:55:02 +01:00
Kevin Ansfield
940e03d3d2 🐛 Koenig - Fixed jump to bottom of story when deleting a list
refs https://github.com/TryGhost/Ghost/issues/9623
- the `BACKSPACE` key command was checking to see if the current section is the first section but failed to take into account that lists are their own section lists
2018-06-14 13:09:49 +01:00
Kevin Ansfield
1133370568 Koenig - Deselect cards when a click happens outside of the editor canvas
refs https://github.com/TryGhost/Ghost/issues/9623
- move click handler registration from `onEnterEdit` to `onSelect`
- add guard against deselecting for clicks on the editor canvas
  - prevents card being deselected when the click would have placed the cursor in a position that selected the card
  - requires editor instance to be passed through to `{{koenig-card}}` in all card components
2018-06-14 12:21:22 +01:00
Kevin Ansfield
36b4727371 🐛 Koenig - Fix embedding of multiple FB Videos
refs https://github.com/TryGhost/Ghost/issues/9623
- wrap all embeds in an `<iframe>` so that their scripts are isolated (fixes FB Video)
- add `MutationObserver` implementation to adjust iframe height as embed's content is loaded
- add `noframe.js` to resize embedded iframes such as YouTube videos
2018-06-13 17:13:33 +01:00
Kevin Ansfield
49d2ed2fb4 🎨 Koenig - Focus URL input after creating embed card
refs https://github.com/TryGhost/Ghost/issues/9623
2018-06-13 11:14:34 +01:00
Kevin Ansfield
2dc916299b Koenig - Extract card caption input into component
refs https://github.com/TryGhost/Ghost/issues/9623
- add new `{{koenig-caption-input}}` component
- yield koenig-caption-input instance from the `{{koenig-card}}` component
- remove duplicated caption logic from image and embed cards
- remove placeholder when caption input has focus
2018-06-12 18:10:23 +01:00
Kevin Ansfield
a04adae8d2 Koenig - Embed card
refs https://github.com/TryGhost/Ghost/issues/9623
requires https://github.com/TryGhost/Ghost/pull/9666
- `{{koenig-card-embed}}`
    - URL input
    - perform oembed lookup & fetch on <kbd>Enter</kbd>
    - remove card if enter pressed with empty URL
    - show error message on server error
        - "retry" returns to input bar
        - "paste as link" removes card and outputs link
        - "X" removes card
    - force embedded <script> tags to run
    - wrap embed html with `.koenig-embed-{video,photo,rich}` class
- add embed cards to the (+) and /-menus
    - "section" support in the card menus
    - refactor to use single card menu map and content component for both menus
    - update /-menu keyboard movement to handle sections
- add parameter support to /-menu commands
  - `/embed {url}` will insert embed card and automatically fetch oembed for supplied url
2018-06-12 14:07:50 +01:00
Kevin Ansfield
4d27cdb3e9 🐛 Koenig - Disable Grammarly to fix high CPU usage
refs https://github.com/TryGhost/Ghost/issues/9623
- see mobiledoc-kit [caveats](https://github.com/bustle/mobiledoc-kit#caveats) and [associated grammarly issue](https://github.com/bustle/mobiledoc-kit/issues/422)
2018-06-11 18:48:43 +01:00
Zimo
de4d1420d6 Adding placeholder illustration for Koenig image empty state 2018-06-11 13:29:39 +02:00
Zimo
474ccaf51a Koenig - Night Shift support
refs https://github.com/TryGhost/Ghost/issues/9623
- bump `ghost-spirit` dependency to include dark mode support
- import Spirit's dark mode file in `app-dark.css`
2018-06-07 09:48:27 +01:00
Kevin Ansfield
5030b193eb 🐛 Koenig - Fixed scroll jump when card is selected
refs https://github.com/TryGhost/Ghost/issues/9623
- if a card is selected, skip the "keep cursor in view" routine
2018-06-06 14:51:52 +01:00
Zimo
2203834861 Adding embed card icons 2018-06-05 13:08:05 +02:00
Kevin Ansfield
ab5267ab87 Remove errant console.log 2018-06-01 18:17:09 +01:00
Kevin Ansfield
dc6064b567 Koenig - ^superscript^ and ~subscript~ text expansion support
refs https://github.com/TryGhost/Ghost/issues/9623
- added additional text expansions for `^sup^` and `~sub~` that also work inside of words
- added sub and sub expansions to the special formats list so that <kbd>Backspace</kbd> undoes the expansion
2018-06-01 17:53:15 +01:00
Kevin Ansfield
1ebdfac55d Koenig - Do not show image toolbar until image is uploaded
refs https://github.com/TryGhost/Ghost/issues/9623
- update `{{koenig-card}}` to show the toolbar immediately if it has changed
- update `{{koenig-card-image}}` to only add toolbar items when an image is present
2018-05-31 09:45:58 +01:00
Kevin Ansfield
dc2e85a6e0 Koenig - Drag & drop image card creation + upload
refs https://github.com/TryGhost/Ghost/issues/9623
- add `dropTargetSelector` property so that `{{koenig-editor}}` can attach drag/drop events to a larger area
- add drag/drop event handlers to `{{koenig-editor}}`
    - ignore drops that occur on cards in edit mode (cards should handle drop events themselves if required)
    - extract image files from the drop event and use them to create image cards
- extract image card creation from image files into a helper function
2018-05-30 17:14:39 +01:00
Kevin Ansfield
032a8def9e Koenig - Create image cards when pasting image files
refs https://github.com/TryGhost/Ghost/issues/9623
- detect pastes that contain image files and insert a card for each, setting `payload.files` to the `File` instance grabbed from the clipboard
- update the `addComponent` hook to ensure the `payload.files` array is preserved, browsers do not allow `File` instances to be copied
- update `{{koenig-card-image}}` to look for a `payload.files` value to auto-upload it via it's internal `{{gh-uploader}}`
- NOTE: browser support for accessing image files on paste varies:
    - Safari: will paste all images
    - Chrome: will only paste the first image
    - Firefox: will not paste any images
2018-05-29 15:23:50 +01:00
Kevin Ansfield
b0d778a5dc Koenig - Fixed "set on destroyed object" error
refs https://github.com/TryGhost/Ghost/issues/9623
- the `{{koenig-toolbar}} `didReceiveAttrs` hook was triggering an async action when the component was being destroyed so a guard is needed around the call to `set` in the `_hideToolbar` method
2018-05-28 16:54:16 +01:00
Kevin Ansfield
7846192ac3 🐛 Koenig - Fixed pasting content into a container card (HTML, markdown, code)
refs https://github.com/TryGhost/Ghost/issues/9623
- pasting inside a container card such as markdown or HTML would paste content into the card and duplicate that content outside of the card, exiting the card's edit mode in the process
- use the same "addressable" check that mobiledoc-kit's event manager uses
2018-05-28 11:28:25 +01:00
Kevin Ansfield
e68ec9d1df Koenig - Keep cursor on screen when typing or moving via keyboard (#1012)
refs https://github.com/TryGhost/Ghost/issues/9505
- when cursor changes through the normal `cursorDidChange` or through certain programmatic changes we trigger a check to see if the cursor is out of the viewport and scroll it into view if necessary
- disable our scroll-into-view routine if the mouse button or shift key is down so that we don't interfere with default browser behaviour which works well in that situation
- for scroll-into-view at the bottom there are two slightly different methods
    - if the cursor is near the bottom of the document we scroll so that the bottom padding of the editor is visible
    - if the cursor is mid-document then we scroll just enough to bring the cursor into the viewport
2018-05-24 13:30:50 +01:00
Kevin Ansfield
d1ad53c149 Koenig - Allow > expansion to convert existing text to blockquotes
refs https://github.com/TryGhost/Ghost/issues/9623
- match `> ` behaviour to `# ` behaviour so entering it at the beginning of an existing paragraph will convert that paragraph to a blockquote
2018-05-23 16:49:18 +01:00
Kevin Ansfield
ebf43cc2f0 🎨 Koenig - Ease removal of formatting on first section
refs https://github.com/TryGhost/Ghost/issues/9623
- pressing <kbd>Backspace</kbd> on an empty paragraph when it is the first and only section will now remove any heading or blockquote formatting that paragraph had
2018-05-23 15:45:10 +01:00
Kevin Ansfield
7df4817447 Koenig - Fix card selection after exiting blank container card
refs https://github.com/TryGhost/Ghost/issues/9623
- it's necessary to pass a cursor movement to `deleteCard` for card selection after the delete to work
- default to `CURSOR_AFTER` as it's the more typical direction compared to `NO_CURSOR_MOVEMENT`
2018-05-23 15:12:30 +01:00
Kevin Ansfield
f9a1342d01 Koenig - Fixed card deselection when cursor exits top of doc
refs https://github.com/TryGhost/Ghost/issues/9623
- add a `exitCursorAtTop` action to `{{koenig-editor}}` that will deselect any cards before calling the closure action
- check if the we're on a card section when pressing UP or LEFT so that the cursor being before/after the card doesn't trip up the logic
2018-05-23 14:49:39 +01:00
Kevin Ansfield
15d3bafce0 Koenig - Remove trailing paragraph on paste workaround
refs https://github.com/TryGhost/Ghost/issues/9623
- now that we're not creating unnecessary undo states, pasting cards with an immediate Cmd+Z works fine so we don't need to create a trailing paragraph as a partial workaround
2018-05-23 14:25:54 +01:00
Kevin Ansfield
559dd29ba3 🐛 Koenig - Fixed creation of unnecessary undo states
refs https://github.com/TryGhost/Ghost/issues/9623
- only use `editor.run` calls when performing edits, do not use them when only moving the cursor/selection
2018-05-23 14:20:03 +01:00
Kevin Ansfield
56499cae5d Koenig - Fixed card creation from plus menu
refs 569a6942cd
- perform a check for a click originating on the plus menu in `{{koenig-card}}` to avoid an immediate deselection as soon as an editable card is created
- removed unnecessary `.koenig-plus-menu` class in favour of `[data-kg="plus-menu"]` selector
2018-05-23 14:11:42 +01:00
Kevin Ansfield
37abd3be15 Koenig - Fix card tests (missing action placeholders) 2018-05-23 11:59:20 +01:00
Kevin Ansfield
569a6942cd 🎨 Koenig - Exit edit mode of a card when clicking outside the card
refs https://github.com/TryGhost/Ghost/issues/9623
- register window click handler in `{{koenig-card}}` whilst card is in edit mode
  - deselect card when a click is registered
  - ignore any clicks inside the card
  - ignore any clicks that originate inside of a modal
- pass our `deselectCard` action through to all cards
2018-05-23 11:38:30 +01:00
Kevin Ansfield
bc3356051d Koenig - Fixed error on Cmd+K with no selection
refs https://github.com/TryGhost/Ghost/issues/9505
2018-05-22 14:01:03 +01:00
Kevin Ansfield
ac870e43bd Koenig - Grab image caption from <img><figcaption> when pasting
refs https://github.com/TryGhost/Ghost/issues/9623
- workaround to grab a `<figcaption>` for use in an image card in some cases
- will only work when an `<img>` tag is immediately followed by a `<figcaption>` tag in the parsed html
2018-05-18 14:26:26 +01:00
Kevin Ansfield
631edbe60a Koenig - Convert <pre><code> to code card
refs https://github.com/TryGhost/Ghost/issues/9623
- add parser plugin to match a `<pre>` with a nested `<code>` as it's first child and transform it into a code card
2018-05-18 14:06:35 +01:00
Kevin Ansfield
fb226ac956 Koenig - Convert pasted <img> and <hr> elements to cards
refs https://github.com/TryGhost/Ghost/issues/9623
- use our custom paste event to intercept and modify pasted HTML before passing to mobiledoc
  - wrap the html in a `<div>` so that all elements get parsed by mobiledoc-kit
- when pasting results in the last pasted section being a card, insert a blank paragraph
  - fixes immediate breaking of the undo stack
2018-05-18 13:55:46 +01:00
Kevin Ansfield
0fa0068f6a Koenig - Convert <br>s to soft-break atoms on paste
refs https://github.com/TryGhost/Ghost/issues/9623
- adds `parserPlugins` option with array of parser plugins that read node values and convert them when pasting
- converts `<br>` to a soft-break atom for line breaks
- removes leading newlines from text nodes to avoid leading spaces in the render output (common when pasting MD with line breaks)
2018-05-17 16:46:25 +01:00
Kevin Ansfield
e34c6a14c4 Koenig - Fixed header toggle via toolbar
refs https://github.com/TryGhost/Ghost/issues/9623
- header text expansion skip for headers with the same level didn't take into account that the toolbar should actually toggle the heading on/off
2018-05-17 15:00:43 +01:00
Kevin Ansfield
b9c81ac219 Koenig - Standardise <b> and <i> elements when pasting
refs https://github.com/TryGhost/Ghost/issues/9623
- use our paste handler to perform a replacement on any pasted HTML
  - `<b>` -> `<strong>`
  - `<i>` -> `<em>`
2018-05-17 14:42:20 +01:00
Kevin Ansfield
823f6afa80 Koenig - Fixed errors when dragging selection
refs https://github.com/TryGhost/Ghost/issues/9623
- catches and ignores `editor.positionAtPoint` TypeError due to not having a correct node value whilst dragging with a selection
- fixes error thrown from the triple-click handling which expected a value to always be present
2018-05-17 13:56:37 +01:00
Zimo
4909e6c2b3 Koenig - Added Code Block card to (+) and / menus
refs https://github.com/TryGhost/Ghost/issues/9623
- added code block card to (+) and / menus
- changed card row length to 3
- swapped html icon for code icon and added new html icon
2018-05-17 12:20:02 +01:00
Kevin Ansfield
a539f291d8 Koenig - Remove duplication in special format edit state toggling
refs https://github.com/TryGhost/Ghost/issues/9623
2018-05-17 10:47:44 +01:00
Kevin Ansfield
4c2dcc5354 Koenig - Fixed error when placing cursor on special formats after pasting
refs https://github.com/TryGhost/Ghost/issues/9623
- fixes `Maximum call stack size exceeded` error when you paste content containing `<code>` elements and then place the cursor at the end of one of those elements
  - this was occurring because the code in `inputModeDidChange()` was triggering another `inputModeDidChange() call
- use the private mobiledoc-kit methods to toggle editor state because we don't want to trigger `inputModeDidChange()` callbacks
- look at the editor state directly rather than going by what we _think_ the editor state should be based on the markers around the cursor
- fixes another subtle issue where after pasting if you placed the cursor at the end of the code format and started typing it would still be formatted as code - mobiledoc-kit has an odd behaviour where duplicate edit states for the markup are present so we have to loop over them rather than relying on a single `toggleMarkupState()` call
2018-05-16 17:21:34 +01:00
Kevin Ansfield
772675d294 Koenig - Parse pasted plain text as markdown
refs https://github.com/TryGhost/Ghost/issues/9623
- plain text that's pasted will be run through our markdown parser then mobiledoc-kit will perform it's usual rich-text paste handling on the resulting HTML
- add a <kbd>Cmd/Ctrl+V+Shift</kbd> escape valve that will skip markdown parsing so mobiledoc-kit's default plain text parsing is invoked
- will not work with IE or Edge <= 16 due to missing browser support for distinguishing plain text vs html pastes
2018-05-16 13:08:11 +01:00
Kevin Ansfield
ab53c29aea Koenig - Initial code card with MD expansion
refs https://github.com/TryGhost/Ghost/issues/9623
- `code` card that uses CodeMirror for the edit view and outputs `<pre><code>...</code></pre>` for the rendered view
- adds triple-backtick text expansion for creating code cards
2018-05-15 15:26:34 +01:00
Kevin Ansfield
5e3553e039 Koenig - Strip all formatting except links when converting to a heading
refs https://github.com/TryGhost/Ghost/issues/9623
- adds `toggleHeaderSection` action to have a central place for logic
- adds `_performEdit()` so that we can avoid nested runloops in actions
- update text expansion and toolbar to use the new `toggleHeaderSection` action
2018-05-15 12:32:44 +01:00
Kevin Ansfield
8e2a622169 Koenig - Allow heading levels to be changed via markdown expansion
refs https://github.com/TryGhost/Ghost/issues/9623
- disable the default mobiledoc-kit heading text expansion and replace with our own that matches heading markdown at the beginning of existing text and will change the heading level of the existing text
2018-05-14 18:29:54 +01:00
Kevin Ansfield
1b02a63848 Koenig - Expand -- to en dash and --- to em dash
refs https://github.com/TryGhost/Ghost/issues/9623
- match `--` and `---` and convert if followed by a space or any character respectively
- include guards to ensure that expansion doesn't occur inside code blocks
2018-05-14 17:29:49 +01:00
Kevin Ansfield
d760e5633c Koenig - Fixed text deselection when toggling section formatting via toolbar
refs https://github.com/TryGhost/Ghost/issues/9623
- maintains easy reversibility by keeping text selected and toolbar shown in the same position to avoid jumping buttons when font size or other formatting changes
2018-05-14 15:53:34 +01:00
Kevin Ansfield
e9ead57da5 Koenig - Fixed deletion of / not closing the /-menu
refs https://github.com/TryGhost/Ghost/issues/9623
2018-05-14 15:48:29 +01:00
Kevin Ansfield
505aee4dac Koenig - Fix triple-click select adding formatting to following paragraph
refs https://github.com/TryGhost/Ghost/issues/9623
- triple-click select will by default end the selection at position 0 of the following paragraph which means section-level formatting such as headers or quotes will affect the apparently unselected following paragraph
- add a guard to check for that selection situation and ensure the selection is constrained to the visibly selected text
2018-05-14 15:13:47 +01:00
Kevin Ansfield
f03954679e Koenig - Fixed double-tap to select not immediately showing toolbar
refs https://github.com/TryGhost/Ghost/issues/9623
- keep a truthy "skip mouse move" flag around across re-triggers within the 50ms restart window to cater for slightly different mouse/selection event orders
- add a couple of guards to avoid triggering the toggle task unnecessarily
2018-05-14 14:52:40 +01:00
Kevin Ansfield
e545161ed3 Koenig - Extract key commands out of {{koenig-editor}}
refs https://github.com/TryGhost/Ghost/issues/9505
- standardises on a single place for key command handlers
- mark re-used methods as public API rather than private
2018-05-09 18:11:22 +01:00
Zimo
f079ed15af Koenig - Refine card menu and fix toolbar tick color
refs https://github.com/TryGhost/Ghost/issues/9505
- card menu style refinements
- fix tick color and adding appear animation to toolbar
- bump Spirit dependency
2018-05-09 16:48:13 +01:00
Kevin Ansfield
4753f92fe1 Koenig - Fix error on backspace with heading as first section 2018-05-09 10:23:30 +01:00
Kevin Ansfield
e8fdc4ca6f Koenig - Handle deletion of last card with no other sections
refs https://github.com/TryGhost/Ghost/issues/9505
- if there is only a single card in a document and no other text then deleting it would throw an error because we assumed there's another section to move the cursor to
- handle the situation of not having a position to move to by creating a new blank paragraph and placing the cursor inside
2018-05-08 18:17:30 +01:00
Zimo
b4b85fba99 Koenig - Style refinements for card menu, toolbar, and link input
refs https://github.com/TryGhost/Ghost/issues/9505
- Card menu style refinements
- Toolbar style refinements
- Unifying toolbar, link tooltip and link toolbar size and position
- Making link input the same size as text toolbar
- Fix single element position in toolbar
- Making toolbars darker
2018-05-08 18:04:56 +01:00
Peter Zimon
26aa2770ed Koenig - Made full width images work with closed sidebar (#1014)
refs https://github.com/TryGhost/Ghost/issues/9505
- use `ui` service to adjust full-width image styles then the side nav is open
2018-05-08 10:26:46 +01:00
Kevin Ansfield
5adbb9b665 Koenig - Fixed HTML card init error
no issue
- `payload.set` is not always a method because mobiledoc-kit can give us POJOs
2018-05-07 15:40:11 +01:00
Kevin Ansfield
9a68dca80e Remove more import Ember via module imports
refs https://github.com/TryGhost/Ghost/issues/8927
- removes usage of `Ember.testing`
- removes usage of `Ember.uuid`
- removes usage of `Ember.Debug.registerWarnHandler`
2018-05-03 17:52:39 +01:00
Kevin Ansfield
1096e8c3d2 Koenig - Remove reliance on CSS class selectors
no issue
- switch to using data attributes instead of class names to target elements to avoid problems if CSS class names change or are removed
2018-05-02 17:31:17 +01:00
Zimo
4c05d618bd Koenig - Replace custom CSS classes with Spirit
no issue
- Koenig container styles for Spirit
- Applying Spirit styles to card menu
- Applying Spirit styles to generic cards
- Replacing icon styles with Spirit
- Fix slash menu selected state
- Cleanup of unused files + fix empty HTML
2018-05-02 15:54:22 +01:00
Kevin Ansfield
135d550c8a Koenig - Switch this.get for ES5 getters
no issue
- Ember 3.1 adds support for ES5 getters to replace (mostly) the need for `this.get` - https://www.emberjs.com/blog/2018/04/13/ember-3-1-released.html#toc_es5-getters-for-computed-properties-2-of-4
- updating Koenig now because it's a fairly isolated part of Ghost-Admin and a good playground for new standards that we can migrate to in the main codebase
2018-05-01 17:13:53 +01:00
Kevin Ansfield
26e70e86ea Koenig - Sticky card icons (#1013)
refs https://github.com/TryGhost/Ghost/issues/9505
- use `ember-sticky-element` to stick card icons in top left when scrolling
- pass an `headerOffset` down from the `{{gh-editor}}` component through Koenig and the card components so that it can be used for adjustments where necessary
    - calculate `headerHeight` in `{{gh-editor}}` any time we change the header class
2018-05-01 15:55:51 +01:00
Kevin Ansfield
8dd8257bf7 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
8f135264dc 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
1a2e345957 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
483ab830b0 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
13c402cfe8 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
ec65fc890b 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
f25e4eb361 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
deea18576e Koenig - Tweaked container card styles
refs https://github.com/TryGhost/Ghost/issues/9505
2018-04-25 14:28:37 +01:00
Zimo
e253174506 Koenig - Styled HTML card edit mode
refs https://github.com/TryGhost/Ghost/issues/9505
2018-04-25 14:27:53 +01:00
Kevin Ansfield
f2736be430 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
55645e9dd5 Koenig - Increase undo depth to 50
refs https://github.com/TryGhost/Ghost/issues/9505
2018-04-25 12:46:50 +01:00
Kevin Ansfield
9e1e6ca0c9 Koenig - Remove caption from HTML card
refs https://github.com/TryGhost/Ghost/issues/9505
2018-04-25 12:09:20 +01:00
Kevin Ansfield
761e841875 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
bc32beef38 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
b21e46aa39 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
af03f8f516 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
58f5941357 Koenig - Fixing editing styles for HTML card 2018-04-20 17:51:33 +02:00
Kevin Ansfield
dcd76b5a5e 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
21007d0630 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
555758a372 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
77fa4439de 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
945e8316a7 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
f5fb674804 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
ff96eb019f 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
8d0050df67 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
30a61226f8 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
d54172172d 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
801c73dae6 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
583b2e47d8 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
dcd1cc8061 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
38048e0cc3 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
ea0be6a4d8 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
d87787c47c 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
2c8a28f77a 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
d6a6fc3d7c 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
4be392ef16 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
18202d24de 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
4f08b7fb8d 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
508cd31265 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
f18a23434f 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
6bff262849 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
ff69766442 Swap out ember-inline-svg for ember-svg-jar (#970)
closes TryGhost/Ghost#9506
2018-03-19 09:57:31 +00:00
Kevin Ansfield
25bc402f72 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
a59752d4a5 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
cc083ef93f 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
775e59f55b 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
3ef3ebfd6b 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
b0ef0409df Fix linting error 2018-03-15 11:10:12 +00:00
Kevin Ansfield
49ff6ad6b6 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
6e5710364e 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
Kevin Ansfield
13ccd50404 Koenig - Fix image creation via (+) menu
refs https://github.com/TryGhost/Ghost/issues/9311
- image icon was missing the appropriate action
2018-03-14 12:23:54 +00:00
Kevin Ansfield
a20f4080f6 Koenig - Fix error when inserting cards in certain circumstances
refs https://github.com/TryGhost/Ghost/issues/9311
- the card selection in `cursorDidChange` would sometimes fail because the selection would be attempted before the newly inserted card had been pushed on to the `componentCards` array. This was reliably triggered by adding a card to a blank header section via the /-menu
- scheduling the section `afterRender` ensures that the `willRender` hook has fired and populated the `componentCards` array before the selection occurs
2018-03-14 12:13:54 +00:00
Kevin Ansfield
355bf18c7c Koenig - Wrap HR card in {{koenig-card}} component
refs https://github.com/TryGhost/Ghost/issues/9311
- makes the HR card behave like the other cards wrt hover and selection visibility
2018-03-14 11:44:09 +00:00
Kevin Ansfield
1a673cfe99 Koenig - Allow blank paragraphs to be deleted with Delete
refs https://github.com/TryGhost/Ghost/issues/9311
- adjust our <kbd>Delete</kbd> card deletion logic to not fire if we're on a blank paragraph
- allows blank paragraphs between cards to be deleted, feels more natural
2018-03-14 11:01:28 +00:00
Kevin Ansfield
c8dd95c490 Koenig - Hide unused elements in (+) menu
refs https://github.com/TryGhost/Ghost/issues/9311
- we don't and will unlikely ever have a "Text" card
- commented out the search input and "Primary" header, it won't be used until we have many more cards
2018-03-14 10:51:44 +00:00
Kevin Ansfield
eb26d0baca Koenig - Close (+) menu when pressing Escape
refs https://github.com/TryGhost/Ghost/issues/9311
- close menu and reset the caret position in the editor when <kbd>Esacape</kbd> is pressed whilst the (+) menu is open
2018-03-14 10:50:38 +00:00
Kevin Ansfield
aa229973ec Remove ember-one-way-controls (#959)
closes https://github.com/TryGhost/Ghost/issues/9386
- remove usage of `{{one-way-checkbox}}` in favour of direct HTML+handlebars
- add `{{gh-text-input}}` that inherits from Ember's built-in `TextInput` component along with our custom `TextInput` mixin
- swap all uses of `{{gh-input}}` for `{{gh-text-input}}
- remove `{{gh-input}}` component
- update `{{gh-textarea}}` to inherit from Ember's `TextArea` component instead of `OneWayTextarea` and update all component uses accordingly
- update `{{gh-trim-focus-input}}` to inherit from `{{gh-text-input}}` and update all component uses accordingly
- standardize on using the `focus-out` action naming rather than `focusOut` for all text inputs, this is because the text input components (especially `{{gh-trim-focus-input}}`) have their own `focusOut` handler which gets overridden if consumers supply their own `focusOut` attr
- drop `ember-one-way-controls` package
- add `ember-one-way-select` package
2018-02-28 11:44:03 +00:00
Kevin Ansfield
5d552202f6 Koenig - Image card
refs https://github.com/TryGhost/Ghost/issues/9311
- add actions for cursor movement and pass through to card components
    - `moveCursorToNextSection` deselects card and places cursor at beginning of next section, useful for caption inputs where <kbd>down arrow</kbd> or <kbd>right arrow</kbd> should move the cursor out of the input & card. Also creates an empty paragraph before moving the cursor if for some reason an empty paragraph doesn't exist after the last card in the doc
    - `moveCursorToPrevSection` deselects card and places cursor at end of previous section, useful for caption inputs where <kbd>up arrow</kbd> or <kbd>left arrow</kbd> should move the cursor out of the input & card
    - `addParagraphAfterCard` deselects card, creates a new paragraph after the card and moves the cursor to it. Useful for caption inputs where <kbd>enter</kbd> should have the same behaviour as if it was pressed whilst the card is selected
- modify `{{gh-uploader}}` so that it passes the FileList to it's `onStart` closure action. Useful for displaying previews when uploading images
- modify `{{koenig-card}}` toolbar display so that it can display text as well as icon buttons
- update `{{koenig-card-image}}` so that it has a full image uploader and caption input
2018-02-22 20:41:40 +00:00
Kevin Ansfield
618643606a Koenig - Allow clicks on cards to pass through for inputs
refs https://github.com/TryGhost/Ghost/issues/9311
- add `hasEditMode` flag to the `{{koenig-card}}` component so that cards without an edit mode (eg, the image card) don't have unnecessary state changes and even listeners
- allow `mousedown` events on cards to passthrough when selecting if the target was an input or textarea so that the cursor can be placed in an input immediately instead of requiring double clicks
2018-02-22 13:46:24 +00:00
Kevin Ansfield
fecbbd518c Koenig - Fixed more keyboard card selection bugs
refs https://github.com/TryGhost/Ghost/issues/9311
- removed most of the hairy logic in `cursorDidChange` around the cursor positioning changing between head and tail within a selected card in favour of ignoring all head/tail flip flops within a selected card section and a little extra logic in our <kbd>left arrow</kbd> key handler
2018-02-21 22:48:45 +00:00
Kevin Ansfield
465dbd997b Fixed linting error 2018-02-20 21:22:48 +00:00
Kevin Ansfield
b8a7925f46 Update Spirit CSS 2018-02-20 17:40:17 +00:00
Kevin Ansfield
37f393ca27 Koenig - Add caption to HTML/embed card
refs https://github.com/TryGhost/Ghost/issues/9311
- add basic implementation of a caption field to the embed card
2018-02-20 15:53:58 +00:00
Kevin Ansfield
5fa1b28a53 Koenig - Another fix for cards being deselected when clicking in edit mode
refs https://github.com/TryGhost/Ghost/issues/9311
- we added a guard for the caret moving from end to beginning of a card when clicking on a card whilst in edit mode in 26dd4ffb4a but it's also possible for clicks to cause the caret to move in the opposite direction
- update the guard in `cursorDidChange` to ignore the caret moving in either direction whilst a card is in edit mode
2018-02-20 15:34:09 +00:00
Kevin Ansfield
ddb46d7731 Koenig - Cleanup toolbar invocation
no issue
- move toolbar markup into the component's template rather than passing it as a block param to keep the `{{koenig-editor}}` template easier to read and more consistent
2018-02-20 15:20:35 +00:00
Kevin Ansfield
4636b4be0d Koenig - Initial Spirit styles integration
no issue
- copy Spirit styles over (eventually these will live in an addon)
- update `ember-cli-build` to output a separate CSS file for Spirit
- update `asset-delivery` addon to output Spirit CSS link
- add `{{kg-style}}` helper for Spirit class names
- update `{{koenig-card}}` and the `{{koenig-card-markdown/html}}` components to use Spirit class names and markup
- replace markdown icon with new version from Spirit
2018-02-20 15:05:19 +00:00
Kevin Ansfield
56490b7a5f Koenig - Add click overlay to embed card
refs https://github.com/TryGhost/Ghost/issues/9311
- adds an overlay element to the embed card so that clicks do not interact with any embedded iframes so that you can lazy click to enter edit mode
2018-02-15 17:14:30 +00:00
Kevin Ansfield
e2daf96014 Koenig - Allow blank paragraphs to be deleted with Backspace
refs https://github.com/TryGhost/Ghost/issues/9311
- adjust our backspace card deletion logic to not fire if we're on a blank paragraph
- allows blank paragraphs to be deleted, feels more natural
2018-02-15 16:31:51 +00:00
Kevin Ansfield
3f1e5b9fa9 Koenig - Update {{koenig-card-html}} to use new {{koenig-card}} container
refs https://github.com/TryGhost/Ghost/issues/9311
- wraps embed card in same container as the markdown card to handle mouse selection/edit toggles etc
- add render mode to embed card
- autofocus CodeMirror editor when switching to edit mode
- fix incorrect pointer on cards
2018-02-15 15:57:44 +00:00
Kevin Ansfield
26dd4ffb4a Koenig - Fix cards being deselected when clicking in edit mode
refs https://github.com/TryGhost/Ghost/issues/9311
- there was an issue where clicking inside a card whilst it was in edit mode would cause the cursor position in the editor to change from the end of a card to the beginning which would re-run our card selection routine and de-selecting the card
- add a guard to the `cursorDidChange` method that looks for an end-to-beginning move whilst a card is in edit mode and ignores it
2018-02-15 15:52:08 +00:00
Kevin Ansfield
b3b07e488f Koenig - Fix sticky (+) button when clicking to select card
no issue
- if the (+) button was visible and you clicked on a card to select it the cursor moved but the (+) button remained because we weren't updating the `selectedRange` property
2018-02-15 15:02:37 +00:00
Kevin Ansfield
cfc32f2539 Koenig - Remove old Koenig alpha code
refs https://github.com/TryGhost/Ghost/issues/9311
- old code is no longer needed for reference so cleaning up
2018-02-15 10:46:23 +00:00
Kevin Ansfield
2e4990093f Koenig - Generic {{koenig-card}} container card component
refs https://github.com/TryGhost/Ghost/issues/9311
- initial CSS for container card outline, selection state, toolbar, etc
- adds `{{#koenig-card}}` component to be used inside of component card templates to handle the default card container HTML, mouse interactions, etc
- update `{{koenig-card-markdown}}` to use the new `{{koenig-card}}` component
  - add render/edit mode views
  - focus the textarea when entering edit mode
- updated `{{koenig-editor}}`
  - add <kbd>Cmd+Enter</kbd> command to put a selected card into edit mode
  - when inserting new cards put them into edit mode immediately
  - move edit/select methods out of actions and into normal methods so that timing is easier to reason about
  - skip `cursorDidChange` process when cursor changes as a result of a card selection, fixes issues with `selectCard` being triggered multiple times unexpectedly
2018-02-13 18:00:54 +00:00
Kevin Ansfield
4381c17216 Koenig - Card selection and deletion
refs https://github.com/TryGhost/Ghost/issues/9311
- cursor based card selection
- handling of delete/backspace when cards are involved
- add `cursorDidExitAtTop` closure action to `{{koenig-editor}}` to consolidate editor cursor behaviour in the editor
  - added extra behaviour for LEFT in editor and RIGHT in title to switch focus between title and editor
- fixed incorrect icon in the slash menu
2018-02-04 20:35:44 +01:00
Kevin Ansfield
6d4d6cbc51 Koenig - HTML card template
refs https://github.com/TryGhost/Ghost/issues/9311
- add a basic HTML card that renders a CodeMirror editor
- adjust styles so that CodeMirror styles for the markdown editor don't affect CodeMirror instances inside Koenig
2018-02-03 19:20:50 +01:00
Kevin Ansfield
5d4053dec2 Koenig - Slash menu
refs https://github.com/TryGhost/Ghost/issues/9311
- adds `{{koenig-slash-menu}}` component that renders a quick-access card/block menu when typing `/` at the beginning of a new paragraph
2018-02-03 17:54:57 +01:00
Kevin Ansfield
d0ca47892a Koenig - Move list/card replacement actions into {{koenig-editor}} 2018-02-03 17:54:57 +01:00
Kevin Ansfield
f65c87a829 Koenig - Show (+) button on blank paragraph mouseover
refs https://github.com/TryGhost/Ghost/issues/9311
- add a mousemove event handler that shows the (+) next to blank paragraphs when the pointer is over them
- fix sticky button when adding a card mid-document by hiding it, we get another `didReceiveAttrs` call with the new range when adding a blank paragraph so it's still shown in that situation
- fix the incorrect button position when adding a card at the bottom of the doc by re-positioning in the next runloop. Problem seems to stem from the component card being rendered after we get the new range so our position calculations are out of sync
2018-02-02 12:56:55 +01:00
Kevin Ansfield
2ca441438d Koenig - Fix plus menu teardown but
no issue
- fixed typo that was throwing an error on `willDestroyElement` of `{{koenig-plus-menu}}`
2018-02-01 18:29:33 +01:00