Commit Graph

19 Commits

Author SHA1 Message Date
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
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
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
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
81ef283c06 Replacing Facebook embed with Spotify 2018-08-15 18:11:16 +02: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
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
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
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
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
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
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
2cef2a4f1e Koenig - Move to generic card names
refs https://github.com/TryGhost/Ghost/issues/9311
- use `hr`, `image`, and `markdown` as card names instead of codifying the `koenig-card-` prefix into the mobiledoc
2018-02-01 12:26:24 +01:00
Kevin Ansfield
521b9dbb99 Koenig - Textarea-only markdown card
refs https://github.com/TryGhost/Ghost/issues/9311
- add `{{koenig-card-markdown}}` component that renders an auto expanding textarea with the markdown card value
- add `{{card-markdown}}` that is an alias of `{{koenig-card-markdown}}` for backwards compatibility - all of our pre-1.0 alpha cards and our current markdown implementation do not have the `koenig-` prefix in their card names
2018-01-31 08:32:27 +00:00
Kevin Ansfield
d25fb1597e Koenig - Display-only image card with markdown text expansion
refs https://github.com/TryGhost/Ghost/issues/9311
- adds the `koenig-card-image` card that renders an `<img>` element
- adds text expansion to convert markdown images into the new image card
2018-01-30 20:46:03 +00:00
Kevin Ansfield
3ac59e5ba8 Koenig - HR card with markdown text expansion
refs https://github.com/TryGhost/Ghost/issues/9311
- adds the `koenig-card-hr` card that renders a `<hr>` element
- adds text expansion to convert `---` into the new HR card
2018-01-30 15:19:30 +00:00
Kevin Ansfield
07d6aee326 Koenig - Initial card support
refs https://github.com/TryGhost/Ghost/issues/9311
- use a similar approach as used in `ember-mobiledoc-editor` to render a div into the editor canvas then use Ember's `{{-in-element}}` helper as a wormhole to render an ember component card into the new div
- adds a `createComponentCard` util for setting up the necessary rendering boilerplate for Ember component cards
2018-01-30 15:18:08 +00:00