Commit Graph

648 Commits

Author SHA1 Message Date
Fabien egg O'Carroll
12582c6cf4 Added initial Before/After card UI
refs https://github.com/TryGhost/Team/issues/1249

This adds a WIP for the Before/After card UI - behind an alpha flag.
It's completely missing design input and is intented to serve as a base
to work from.
2021-12-13 15:57:29 +02:00
Sanne de Vries
f788cd6dfa Removed unnecessary hidden audio player buttons
Refs https://github.com/TryGhost/Team/issues/1230
2021-12-13 14:09:39 +01:00
Sanne de Vries
828786212c Fixed audio card error state
Refs https://github.com/TryGhost/Team/issues/1230
2021-12-13 12:36:38 +01:00
Thibaut Patel
a879beb09d Hid the product card button fields when button is disabled
refs https://github.com/TryGhost/Team/issues/1245
2021-12-13 11:48:21 +01:00
Sanne de Vries
26265b6a11 Updated video card in editor
Refs https://github.com/TryGhost/Team/issues/1229
2021-12-13 11:43:11 +01:00
Rishabh
48e64a47be Updated thumbnail replace for audio card with thumbnail delete option
refs https://github.com/TryGhost/Team/issues/1230

- allowing users to delete the thumbnail and upload another is a better flow as it allows removing a thumbnail as well if not needed
2021-12-13 16:10:29 +05:30
Rishabh
c3cb7dde47 Updated card edit flow for audio and file cards
refs https://github.com/TryGhost/Team/issues/1230

- Updated the audio and file card to follow - 1st click → select, 2nd click → edit pattern, which is consistent with other cards
2021-12-13 15:58:25 +05:30
Kevin Ansfield
59def266de Fixed video card aspect ration change when uploading custom thumbnail
refs https://github.com/TryGhost/Team/issues/1229

- changed the video card image so it uses an aspect-ratio box set to the aspect ratio of the video, with the image using `object-fit: cover` to match the background image behavior in the front-end
2021-12-10 19:48:28 +00:00
Peter Zimon
6800a3fdb4 Updated file card styles in Koenig (#2175)
Added styles for file card in editor
2021-12-10 19:17:11 +01:00
Rishabh
0fb7a04bae Refined file upload card
refs https://github.com/TryGhost/Team/issues/1231

- updated upload endpoint for files
- cleanup
2021-12-10 18:01:25 +05:30
Rishabh
ee639625ad Cleaned up audio card file
refs https://github.com/TryGhost/Team/issues/1230
2021-12-10 17:25:55 +05:30
djordje vlaisavljevic
7b9c0319a6 Updated settings panel placeholders for product card
https://github.com/TryGhost/Team/issues/1245
2021-12-10 11:26:53 +01:00
Rishabh
dd8e770692 Updated audio card allowed extensions and payload
refs https://github.com/TryGhost/Team/issues/1230

- cleans up allowed payload attributes for audio card
2021-12-10 01:22:05 +05:30
Kevin Ansfield
c7925e6915 Fixed video card with adjustment not changing editor size
refs 00d9d200f7

- `concat` helper had been accidentally removed so width classes weren't being output correctly
2021-12-09 16:49:38 +00:00
Kevin Ansfield
e04422221f Switched to images API for video thumbnails with custom thumbnail override behaviour
refs https://github.com/TryGhost/Team/issues/1229

- using the images API lets us separate the auto-generated thumbnail and custom thumbnail
- added `customThumbnailSrc` to video card payload and switched settings panel uploader to store upload result there
- switched image display to fallback from custom thumbnail to auto-generated thumbnail
2021-12-09 16:38:05 +00:00
Sanne de Vries
00d9d200f7 Added static player UI to video card
Refs https://github.com/TryGhost/Team/issues/1229
2021-12-09 16:22:58 +00:00
James Morris
25807c9490 Added temporary icons for header card alignment
refs https://github.com/TryGhost/Team/issues/1253
2021-12-09 15:06:25 +00:00
Rishabh
49aab60795 Added first version for new file card
refs https://github.com/TryGhost/Team/issues/1231
2021-12-09 20:30:28 +05:30
Rishabh
997862cf58 Allowed creating audio card directly on file drop in editor
refs https://github.com/TryGhost/Team/issues/1230
2021-12-09 20:30:28 +05:30
Kevin Ansfield
192c983975 First pass at custom thumbnail upload for video card
refs https://github.com/TryGhost/Team/issues/1229

- adds uploader to setting panel
- currently replaces the single/auto-generated thumbnail image
2021-12-09 14:58:28 +00:00
Thibaut Patel
7e48fcd06d Fixed a visual bug in the cards using KoenigBasicHtmlInput
refs https://github.com/TryGhost/Team/issues/1245

- When pressing backspace on an empty `KoenigBasicHtmlInput` that don't use `p` as the default tag, an empty paragraph was created by e21bde39e1/lib/koenig-editor/addon/options/key-commands.js (L171-L176), messing with the style while in edit mode.
- This was fixed by normalizing the tag to be the `defaultTag` in the `didUpdatePost` hook
- Because of this new normalization, we could remove the same normalization from `handlePaste`
2021-12-09 14:08:17 +01:00
djordje vlaisavljevic
24eeaf68ff Updated the product card menu icon
refs https://github.com/TryGhost/Team/issues/1209
2021-12-09 10:18:19 +01:00
Rishabh
f37c0f91d4 Added metadata extraction for audio file in card
refs https://github.com/TryGhost/Team/issues/1230

- extracts audio duration and mimeType metadata for uploaded file
2021-12-09 13:12:45 +05:30
Rishabh
4df58bb022 Fixed thumbnail replace not working on drop for audio cards
refs https://github.com/TryGhost/Team/issues/1230
2021-12-09 00:08:43 +05:30
djordje vlaisavljevic
e9c2942de5 Updated editor styles and template for product card
refs https://github.com/TryGhost/Team/issues/1209
2021-12-08 19:33:55 +01:00
Sanne de Vries
049fe97e7e Updated video card
Refs https://github.com/TryGhost/Team/issues/1229
2021-12-08 17:29:22 +00:00
Thibaut Patel
16d242f763 Added image drag and drop to the product card
refs https://github.com/TryGhost/Team/issues/1245

- followed the pattern from the video card as the image card uses an older ember syntax
2021-12-08 18:28:42 +01:00
Thibaut Patel
b1d0c33c09 Added hover-over on product card stars in edit mode
refs https://github.com/TryGhost/Team/issues/1245

- Used onmouseover because a CSS-only approach wouldn't work
- CSS can only highligh next siblings on hover, while we want to highlight previous sibling in our case
- This adds a hover class on mouseover to the right stars and removes it onmouseout
2021-12-08 17:18:45 +01:00
Sanne de Vries
ed3b5e462f Updated audio card
Refs https://github.com/TryGhost/Team/issues/1230
2021-12-08 15:34:25 +00:00
Kevin Ansfield
9218c72b86 Added an additional blockquote style
refs https://github.com/TryGhost/Team/issues/1239

Repeatedly clicking the quote icon in the editor toolbar or using the <kbd>Ctrl+Q</kbd> keyboard shortcut will cycle through standard-blockquote -> alternative-blockquot -> standard paragraph.
2021-12-08 15:19:39 +00:00
Kevin Ansfield
e21bde39e1 Updated CTRL+Q blockquote keyboard shortcut to cycle through alt style
refs https://github.com/TryGhost/Team/issues/1239

- updates keyboard shortcut behavior to match the quote icon behavior where it cycles through blockquote->aside->p
2021-12-08 15:19:39 +00:00
Thibaut Patel
811ca6d08e Allow multiple paragraphs in the product card description
refs https://github.com/TryGhost/Team/issues/1245
2021-12-08 16:00:49 +01:00
Thibaut Patel
b157bf7c34 Added enter/tab support to the product card title field
refs https://github.com/TryGhost/Team/issues/1245

- Enables keyboard-only title+description input
2021-12-08 15:08:40 +01:00
Thibaut Patel
120deae9b1 Allowed line-breaks in product card description
refs https://github.com/TryGhost/Team/issues/1245
2021-12-08 14:42:00 +01:00
Thibaut Patel
b03f72c59e 🐛 Fixed pasting html into a KoenigBasicHtmlInput
refs https://github.com/TryGhost/Team/issues/1245

- Several inputs where dismissing the content when pasting HTML without the expected input tag
- The inputs where: the caption of the feature image; the email footer; the caption in the bookmark, code, embed, gallery, image, video cards; the callout card title; the product card header and description; the toggle header
- This makes sure the wrapper html tag is the expected one.

Co-authored-by:
- Kevin Ansfield (@kevinansfield)
2021-12-08 14:22:33 +01:00
djordje vlaisavljevic
50516e47d5 Updated editor template and styles for product card
refs https://github.com/TryGhost/Team/issues/1245
2021-12-08 13:55:18 +01:00
Rishabh
e2db69d265 Updated file name handling for audio card
refs https://github.com/TryGhost/Team/issues/1230

- adds a method to prettify filename from the audio file
- cleanup
2021-12-08 17:17:47 +05:30
Thibaut Patel
52530c2949 Updated the product card button in the editor
refs https://github.com/TryGhost/Team/issues/1245

- Disabled the button link to avoid leaving the editor
- Added disabled states when the button is incomplete
2021-12-08 12:07:46 +01:00
Thibaut Patel
3f16cec396 Fixed the image deletion action in the product card
refs https://github.com/TryGhost/Team/issues/1245

- The property `previewSrc` wasn't tracked so it wasn't updated when set to null
2021-12-08 11:29:53 +01:00
Thibaut Patel
6c81e9a182 Added the image placeholder for the product card
refs https://github.com/TryGhost/Team/issues/1245
2021-12-08 11:10:24 +01:00
Thibaut Patel
9a94dbe000 Enable the product card button when editing it
refs https://github.com/TryGhost/Team/issues/1245

- When editing the button text or url, the button is enabled
2021-12-08 10:36:24 +01:00
djordje vlaisavljevic
3b019b3b05 Updated editor template and styles for product card
refs https://github.com/TryGhost/Team/issues/1245
2021-12-07 22:34:15 +01:00
Rishabh
2b2edf48ef Refined audio card player UI in edit mode
refs https://github.com/TryGhost/Team/issues/1230

- updates player ui in audio card to use same html as theme
- removes setting panel for audio card
2021-12-08 00:44:58 +05:30
Kevin Ansfield
c29adfb441 🐛 Fixed pasted image files appearing twice in editor
closes https://github.com/TryGhost/Team/issues/1254

- when switching over to a more generic file paste handling the prevention of the default paste behaviour was missed meaning an additional image element was added to the contenteditable area which was not rendered on the front-end and disappeared when reloading the post
2021-12-07 18:08:00 +00:00
Kevin Ansfield
59ee50735a 🐛 Fixed initial paste of Twitter URL not triggering full script load
no issue

- pasted URLs that are converted into an embed card were triggering the `convertUrl` task twice, once on insertion and then again on the immediate deselection that happens whilst the caret is adjusted
- a change in browsers or in Twitter's script meant that the double-fetch and iframe population started to become unreliable with the script not triggering, or the iframe contents being replaced interfering with script timing, resulting in un-styled Twitter embeds immediately after pasting a URL
- added `.drop()` to the `convertUrl` task so the second deselection call is ignored whilst the first call is still in progress
2021-12-07 17:26:58 +00:00
djordje vlaisavljevic
40fad51d05 Updated editor template for product card
refs https://github.com/TryGhost/Team/issues/1245
2021-12-07 17:38:15 +01:00
Thibaut Patel
8e14a23fea Fixed the star rating in the product card
refs https://github.com/TryGhost/Team/issues/1245

- It wasn't hidden in the editor preview when disabled
2021-12-07 16:17:13 +01:00
djordje vlaisavljevic
9abe330714 Updated editor styles for product card
refs https://github.com/TryGhost/Team/issues/1245
2021-12-07 15:39:42 +01:00
djordje vlaisavljevic
1d1b1fe79a Added the menu icon for product card
refs https://github.com/TryGhost/Team/issues/1245
2021-12-07 15:39:42 +01:00
Thibaut Patel
636907f8f1 Removed duplicated star rating in product card
refs https://github.com/TryGhost/Team/issues/1245
2021-12-07 14:24:21 +01:00