New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We鈥檒l occasionally send you account related emails.

Already on GitHub? Sign in to your account

New editor layout #355

Merged
merged 1 commit into from Oct 24, 2016

Conversation

Projects
None yet
5 participants
@disordinary
Contributor

disordinary commented Oct 21, 2016

This bumps the editor to 14 (13 wasn't so lucky).

Requires: TryGhost/Ghost#7619
Refs: TryGhost/Ghost#7429

It includes:

  • The title is integrated into the content.
  • The toolbar has been revamped, that annoying under paragraph toolbar has been removed in favor of a block level changed (on the left hand side of the content).
  • The toolbar also has the ability to create links.
  • Additional markdown support within the editor including # h1 headings, ## h2 headings, ### h3 headings, 1. lists, * lists, - lists, > blockquote, _italic_, *italic*, __bold__, **bold**, ~~strikethrough~~, [links](http://www.ghost.org/), ![images](https://placekitten.com/200/300) (warning will replace the entire block).

Footnotes and codeblocks are on our todo, we won't be supporting inline HTML, however there are markdown and HTML cards which can be inserted into the content.

Whew, it's getting there. What you see is still placeholder styling - but we're slowly refining towards something that's useful. 馃嵕

This was referenced Oct 21, 2016

@kevinansfield kevinansfield added this to the 1.0.0-alpha.6 milestone Oct 21, 2016

// if the enter key or down key are pressed then focus on the editor
case 13:
case 40:
Ember.$('.__mobiledoc-editor').focus();

This comment has been minimized.

@disordinary

disordinary Oct 21, 2016

Contributor

@kevinansfield there is likely a better way to do this. Basically on enter or the down arrow key I want to change focus to the mobiledoc editor.
Normally I'd do this.$ to select the editor, but in the mixin this doesn't have jquery as a method. And Ember.$ fails linting.

I'm treating this mixin as if it was a component which is clearly not the right way to approach things, although it appears the way that the mixin was intended.

Ideas?

This comment has been minimized.

@disordinary

disordinary Oct 21, 2016

Contributor

I should add it's triggered by the keyDown action on gh-trim-focus-input within edit.hbs

This comment has been minimized.

@kevinansfield

kevinansfield Oct 21, 2016

Collaborator

If you want access to jQuery you can use import $ from 'jQuery' if that will help with the linting problems.

The editor-base-controller mixin is unfortunately a bit of a mess, in many older areas of our codebase we have controllers taking on the responsibilities of a component.

I may have missed it but what is the reasoning behind using an ember-concurrency task here? As far as I can see there's no asynchrony involved - would it make more sense for this to be a standard action?

This comment has been minimized.

@disordinary

disordinary Oct 21, 2016

Contributor

I was using a generator mainly for consistency and to keep code grouped together, will adjust.

So yes having the mixin behave like a component is what we expect...

Thanks.

@@ -1,5 +1,6 @@
import run from 'ember-runloop';
export default function destroyApp(application) {
server.shutdown();

This comment has been minimized.

@kevinansfield

kevinansfield Oct 21, 2016

Collaborator

Would you mind removing this line from the PR? I'd prefer if that change went in separately with some notes about why it's being made, especially as it's something that should be handled by ember-cli-mirage

controller.set('cards' , []);
controller.set('atoms' , []);
controller.set('toolbar' , []);
controller.set('apiRoot', ghostPaths().apiRoot);

This comment has been minimized.

@acburdine

acburdine Oct 21, 2016

Member

it would probably be better to inject the ghostPaths service into the controller rather than re-set the API and asset paths each time the route is entered.

This comment has been minimized.

@disordinary

disordinary Oct 21, 2016

Contributor

Thanks,

As Kevin said above the whole editor is a bit of a mess and it's not 100% clear that everything is behaving as it should. I'll also adjust the edit route, this whole thing is probably a good candidate for refactoring in the future.

@disordinary disordinary changed the title from [WIP] New editor layout to New editor layout Oct 24, 2016

@disordinary disordinary referenced this pull request Oct 24, 2016

Merged

New Editor Layout #7619

New editor layout
- the title is now part of the content
- new ways to navigate from the title to the content
- the new editor contains updated toolbar behavior
- the new editor contains markdown like commands

@kevinansfield kevinansfield merged commit 7872fae into TryGhost:master Oct 24, 2016

1 check passed

continuous-integration/travis-ci/pr The Travis CI build passed
Details
@velobarplus

This comment has been minimized.

velobarplus commented Oct 26, 2016

How will the editor handle youtube embeds?

@rawsh

This comment has been minimized.

rawsh commented Oct 26, 2016

@gurde In the initial post (referenced at the top) they said that you can paste html code as an embed. It's unlikely that there's going to be any specific embedding.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment