Commit Graph

445 Commits

Author SHA1 Message Date
Kevin Ansfield
9aa1ac6cdb Fixed linting error 2021-11-08 15:52:25 +00:00
Kevin Ansfield
794ed83032 Added first pass of button card
no issue

- adds card that contains a single button with alignment options and configurable text and url
2021-11-08 15:50:05 +00:00
Kevin Ansfield
c6f1bbc918 Removed unused @style args from email+email-cta cards
no issue

- the `@style` arguments passed to `<KoenigCard>` in these components doesn't exist
2021-11-08 13:53:57 +00:00
Kevin Ansfield
085ef1646c Converted hr card component to glimmer syntax
no issue

- switching to Ember "Octane" patterns
2021-11-08 13:10:39 +00:00
Kevin Ansfield
0b360c3383 Converted paywall component to glimmer syntax
no issue

- switching to Ember "Octane" patterns
2021-11-08 13:08:58 +00:00
Kevin Ansfield
aae6e32494 Added basic drag-to-move handling to card setting panels
no issue

- adds `{{movable}}` render modifier that sets up basic mouse/touch event handlers that adjust the element's `translate` style when click/touched+dragged so it can be moved around the screen
2021-11-03 16:51:24 +00:00
Kevin Ansfield
999d69af4d Switched back to explicit edit mode for settings panel prototype
no issue

- added the edit toolbar icon back to the email-cta card
- switched back to displaying the non-editable version of the card when not in edit mode
- removed unused `showSettingsPanel` property from `<KoenigCard>` component, cards can now control display of settings panel using `@isEditing`
- removed unused `@visible` argument for `<KoenigSettingsPanel>` component
2021-11-03 14:52:05 +00:00
Kevin Ansfield
ed4efdb0c0 Fixed linting
refs f4c50fb3a5

- removed errant console.log
2021-11-02 16:29:58 +00:00
Kevin Ansfield
f4c50fb3a5 First prototype for card settings panel
no issue

UI experiment (behind the `cardSettingsPanel` labs flag) for pulling card settings out into a separate side-panel. Prototyping against the email-cta card.

- shows panel immediately when selected unless selected by keyboard in which case it will wait for mouse input
- panel position is fixed so it's always on screen
- initial position tries to be as close to centered right of the card as possible
  - ensures all of the panel is on-screen, will overlap the card if there's no enough horizontal width
- re-positions after window resize
- card no longer has a separate edit mode, the text replacement field is directly editable
2021-11-02 16:25:54 +00:00
Rishabh
1b25dfbd67 Updated offers list in email cta to include only active
closes https://github.com/TryGhost/Team/issues/1134

- filters offer urls available on email cta card to only include active offers
2021-10-18 14:48:01 +05:30
Rishabh
aefc762a20 Added offer urls to email cta card
refs https://github.com/TryGhost/Team/issues/1134

- allows site owners to easily include offer URLs in their email CTA
- will be updated to include active offers only
2021-10-12 17:03:45 +05:30
Sanne de Vries
eb8526fc60 Fixed copy 2021-09-20 21:54:14 +02:00
Sanne de Vries
c66c62e4b9 Fixed copy in card-menu for Codepen description 2021-09-20 20:15:47 +02:00
Kevin Ansfield
8b5c18d6e5 Hid email specific cards from card menus when editing pages
no issue

Pages can not be sent by email so by hiding email-specific cards when editing pages we can reduce confusion and clutter.

- added a `@postType` argument to editor components that can be passed through to sub components
- set `@postType` to `post.displayName` which is either `post` or `page`
- updated `{{card-is-available}}` helper to compare a `postType` property on card menu items to the passed in `postType`
2021-09-10 09:24:38 +01:00
Kevin Ansfield
c97e06751e Added additional logging for Sentry issue.id:2451728694
no issue

- Sentry was showing `card` being undefined at times when attempting to select/edit a card after it's inserted in `replaceWithCardSection()` (called by card menus and text expansions) but it's not been reproducible in local environments
- it's unclear if the problem occurs due to the card render not happening in the immediate render queue or if it's some other problem
- added a retry if the card is not found after the first render plus logs to Sentry and console when the unexpected state occurs for better insight
2021-09-09 12:58:38 +01:00
Kevin Ansfield
f9d97bdc35 Added group heading to existing snippets in dropdown
no issue

- wrapped dropdown options in an options group so the heading can provide more context
- fixed styling so there isn't double padding around grouped options
2021-09-08 09:54:06 +01:00
Kevin Ansfield
a5fc45d169 🐛 Fixed crash when newly created images are dragged into a gallery
closes https://github.com/TryGhost/Team/issues/1020

- image card payloads should have a valid `src` attribute, use that instead of relying on the associated `img` element which won't be found/have an unexpected `src` when it's newly created because the image card will still be using the blob url generated for a preview whilst uploading
2021-09-06 14:30:13 +01:00
Kevin Ansfield
9993f02ffa 🎨 Added ability to drop an image card onto an empty gallery
closes https://github.com/TryGhost/Team/issues/1013

Image cards could be dropped into a gallery when at least one image was already present but there was no handling for image cards being dropped onto an empty gallery.

- added `data-gallery` attribute to the placeholder element so it gets picked up by the drag-and-drop container registration
- added drag enter/leave event handlers so we can show the same dropzone indicator as when a standard file is being dropped onto an empty gallery
- updated the drop handling to handle insertion when no images already exist by forcing insertion at index `0`
- updated the register or refresh handler to switch between different drag-and-drop container elements as needed and switched to `scheduleOnce` to prevent duplicate containers being created if the function is called twice before render occurs
2021-09-06 11:57:42 +01:00
Kevin Ansfield
e9a8361687 Fixed errors when pasting non-markup into basic html fields
no issue

- the editor range was getting out of sync between pasting and the subsequent `didUpdatePost` callback which cleans up content to conform to our "basic html" expectations resulting in errors in the console and potentially lost content if the paste occurred with the cursor inside existing text
- updated `handlePaste` to perform the same parse as the default paste handler but then cleanup the post before inserting so there's no mismatch of content across the editor callbacks
2021-09-03 10:51:45 +01:00
Peter Zimon
0b7d1b1946 Fixed gallery delete icon color bug 2021-09-03 11:45:29 +02:00
Kevin Ansfield
5eb817373f 🐛 Fixed captions becoming uneditable when they have a trailing space
closes https://github.com/TryGhost/Team/issues/1023
closes https://github.com/TryGhost/Ghost/issues/11424

- we were comparing the caption editor's contenteditable inner html vs the passed in html in order to reset the editor if the bound value changed upstream, this was causing problems because the editor and external html cleaning were treating trailing whitespace slightly differently which resulted in the editor being reset every time it gained focus when a trailing space was present
- removed reliance on inspecting the editor's inner html and instead switched to comparing a changed `html` value to that which was passed in during initialisation or was last passed upstream from the editor so there's no chance of unexpected deviance
2021-09-03 09:00:14 +01:00
Kevin Ansfield
922c304e3b Added "Email call to action" card for an email-only CTA targeting free or paid members (#2080)
refs https://github.com/TryGhost/Team/issues/993

The new editor card allows you to add styled content along with an optional button that will only be visible to free or paid members when the post is emailed. Useful for encouraging free members to sign up to a paid account for example.

- removed labs flag and conditionals to make the feature is available by default
- cleaned up CSS that re-used the `.email-card` class or was referencing `labs`
2021-09-02 13:11:15 +01:00
Kevin Ansfield
233e57071f Fixed email-cta card button input placeholder disappearing on focus
no issue

- behaviour was from copy-pasting from a different input where the placeholder was intentionally hidden on focus, that's not desirable in this case
2021-09-02 07:42:36 +01:00
Kevin Ansfield
4e30da6c70 Added ability to update snippet contents (#2073)
refs https://github.com/TryGhost/Team/issues/1008

To update a snippet, select the content in the editor that you want as your snippet text and click the snippet icon as per creating a snippet. Once the snippet name input shows, start typing the name of an existing snippet to be able to select it for update.

- replaced main snippet input component with the labs component
- removed the feature flag and associated labs screen toggle
- removed original/labs snippet input conditional in the editor
2021-09-01 09:09:40 +01:00
Kevin Ansfield
b5f43a7e9d Added autofocus of button text input in email-cta card after enabling button
refs https://github.com/TryGhost/Team/issues/1009

- added ID generation to the component as an example of good practice to avoid problems with multiple elements having the same ID
- used `afterRender` queue to schedule the focus of the button text input element so the element actually exists (it's added to the DOM only when `showButton` is true so we have to wait for that to complete)
2021-08-25 15:41:30 +01:00
Sanne de Vries
debb081c61 Updated email CTA toolbar
Refs https://github.com/TryGhost/Team/issues/1007
2021-08-25 11:55:10 +02:00
Kevin Ansfield
a6ca133915 Renamed buttonAlignment to alignment in email-cta payload
refs https://github.com/TryGhost/Team/issues/1007

- all contents within an email-cta card are now aligned left/center so it doesn't make sense to keep the payload attribute as `buttonAlignment`
2021-08-24 17:53:34 +01:00
Kevin Ansfield
dff28b3ca6 Removed "Link to this post" option from email-cta suggested URLs
refs https://github.com/TryGhost/Team/issues/1007

- we don't know the URL of a post until after it's published so we were using the preview URL instead as that will always redirect to the current URL
- however, it's not clear in the UI that is how the preview URL works so we're removing it to avoid any confusion
2021-08-24 16:52:13 +01:00
Kevin Ansfield
8309904fcc Fixed clicking on existing snippets in dropdown having no effect
no issue

- mousedown handler in the snippet input component was automatically closing when it was detecting a mousedown event outside of the element
- the new dropdown select is rendered in a wormhole outside of the component's element so the whole component was being destroyed before the mouseup listener on an option was fired
2021-08-24 16:04:49 +01:00
Kevin Ansfield
e6e08ab70a Fixed button showing in email-cta rendered mode when it's disabled
refs https://github.com/TryGhost/Team/issues/1007

- added `@payload.showButton` to the conditional for showing the button
- `@payload.buttonText` and `@payload.buttonUrl` both kept in the conditional to match how it would behave in the email
2021-08-24 11:44:53 +01:00
Sanne de Vries
6198019de1 Updated snippet replacement dropdown 2021-08-24 12:28:07 +02:00
Kevin Ansfield
e979e45fdb Linked up divider toggle button in email-cta card toolbar
refs https://github.com/TryGhost/Team/issues/1007

- replaced `hasTopDivider` and `hasBottomDivider` and associated payload properties for a single `showDividers` payload property
- removed divider toggles from non-edit mode card toolbar
- linked edit-mode toolbar divider to a toggle dividers action
2021-08-24 10:50:25 +01:00
Kevin Ansfield
0dab21e604 Linked up email-cta button toggle
refs https://github.com/TryGhost/Team/issues/1007

- updated card payload defaults assignment and set `showButton` to `false`
- linked up button toggle button to toggle `showButton` in card payload and show as green when enabled
- hid button, and associated text/url inputs when `showButton` is false
- added `disabled` attribute to button when there's no text (attempt to simulate "placeholder" styling) and matched the text to the button text placeholder
2021-08-24 10:50:25 +01:00
Sanne de Vries
f59fae71eb Updated snippet replacement dropdown 2021-08-24 11:21:47 +02:00
Kevin Ansfield
de480234e9 Fixed snippet creation from email-cta card's toolbar
no issue

- Glimmer components do not have a `.element` property so we need to set it manually because the editor currently reaches into card components to calculate the element's rect for selection when creating snippets
2021-08-24 10:12:52 +01:00
Kevin Ansfield
29095ffba1 Updated suggested URLs list in the email-cta card
refs https://github.com/TryGhost/Team/issues/992

- added "Link to this post" option that uses the preview URL as it's currently the only guaranteed URL that we know before a post is published
- added "Free email signup" option
- added "Paid subscription" and "Upgrade or change plan" options that are only shown when Stripe is connected
2021-08-23 18:46:00 +01:00
Kevin Ansfield
ddf6360ae2 Passed post as a card option through to editor cards
refs https://github.com/TryGhost/Team/issues/992

- within cards we sometimes want access to the `post` record so that UI or copy can be changed based on what is currently being edited
- added ability to pass `@cardOptions` through to the editor components
- fixed KoenigEditor not correctly assigning the `cardOptions` object to the `options` object that gets passed to every card when they are rendered
2021-08-23 18:42:14 +01:00
Kevin Ansfield
4184543307 Added confirmation modal when updating an existing snippet
refs https://github.com/TryGhost/Team/issues/973

- show confirmation modal instead of immediately replacing content of the existing snippet
2021-08-23 17:12:26 +01:00
Kevin Ansfield
daa7f2e781 Added ability to update snippet contents
refs https://github.com/TryGhost/Team/issues/973

- added `@showCreate` option to `<GhInputWithSelect>` that enables the create option without having to pass a function in `@showCreateWhen`
- fixed autofocus not focusing input element in `<GhInputWithSelect>` when `autofocus="true"` isn't enough by itself
- updated `selectOrCreate` in `<GhInputWithSelect>` to trigger `onChange` if it's passed in rather than `onInput`
- swapped input in labs snippet input to `<GhInputWithSelect>`
- added actions for updating a snippet when an existing snippet is selected
- added action to editor control for saving an updated snippet
2021-08-23 16:00:01 +01:00
Sanne de Vries
11cc53c4d0 Added divider button to email CTA card toolbar
Refs https://github.com/TryGhost/Team/issues/1007
2021-08-23 16:22:56 +02:00
Sanne de Vries
c4e54c92ae Updated email CTA card
Refs https://github.com/TryGhost/Team/issues/1007

- Changed text and button to auto-update alignment in and outside of edit mode
- Updated icons
- Added titles on hover
2021-08-23 15:04:11 +02:00
Sanne de Vries
60e14a3dfa Added toolbar to email CTA card
Refs https://github.com/TryGhost/Team/issues/1007
2021-08-23 14:10:33 +02:00
Kevin Ansfield
8f21f0d4fa Added pre-filled options to email-cta card's button url input
refs https://github.com/TryGhost/Team/issues/992

- swapped input element for `<GhInputWithSelect>`
- added `config.getSiteUrl()` method for generating front-end URLs including subdomain
- added example suggested URLs to email-cta card to pass as options to button url input
2021-08-20 14:33:30 +01:00
Kevin Ansfield
77fa802c73 Added snippet input labs component
refs https://github.com/TryGhost/Team/issues/973

- preparation for swapping the text field input for a power-select input behind the `snippetReplacements` labs flag
2021-08-16 10:52:50 +01:00
Sanne de Vries
6dc901993c Updated email CTA card
Refs https://github.com/TryGhost/Team/issues/928
- Added icons for top and bottom border
- Updated spacing for hr element when not in edit mode
- Got rid of hr element when in edit mode
- Got rid of left border for email, html and markdown cards and feature image
2021-08-03 18:21:54 +02:00
Kevin Ansfield
d3d186664f Added button alignment selection to email-cta card
refs https://github.com/TryGhost/Team/issues/928

- added btn group for selecting left/center alignment of CTA button
- updated rendered view to center the button when center alignment is selected
2021-08-02 15:01:15 +01:00
Kevin Ansfield
43aff32dc6 Switched to top/bottom toggles for email-cta dividers
refs https://github.com/TryGhost/Team/issues/928

- two toggle buttons is cleaner than 4 buttons to achieve the same thing
- adjusted payload to have `dividerTop` and `dividerBottom` attributes rather
2021-08-02 14:48:14 +01:00
Kevin Ansfield
1f24c09c5f Fixed linter error 2021-08-02 14:31:05 +01:00
Kevin Ansfield
0e5a7cd2a9 Added none/top/both/bottom divider toolbar buttons to email-cta card
refs https://github.com/TryGhost/Team/issues/928

- adds 4 buttons to email-cta toolbar for changing border setting to `none`, `top`, `bottom`, and `both`
- output `<hr>` elements at top and bottom of email-cta card contents when set
- fixed clicks on non-edit-mode toolbar items switching cards into edit mode
2021-08-02 14:24:28 +01:00
Sanne de Vries
8db674191d Fixed typo in email CTA card 2021-07-29 15:56:14 +02:00