Publish button amends

[ErisDS]

There are some amends we'd like to make to our trusty friend the publish button:

First, remove Add to Queue and Publish On for now, so that the only options in the menu are:

• Publish Now which when activated would transition the post to published
• Save Draft which when activated would save the post in the current status which is draft

These two options reflect the two statuses that a post can be in, draft and published, and two transitions that can occur: draft -> published and published -> draft. Whatever state the post is currently in, there are always two options, one to save as is and one to transition. When the button is set so that the next action would be a transition, the button should be red.

To explain in full:

Initially a post which has not yet been saved should behave the same as a post which has been saved as a draft. The button should be blue, and read Save Draft. If you open the menu, Save Draft should have a tick next to it (currently it doesn't).

Pressing the button should save the post in its current state of draft.

Opening the menu, and choosing Publish Now should put a tick next to Publish Now and set the button to say Publish Now. The button should be red - this requires adding the classes splitbutton-delete and button-delete instead of splitbutton-save and button-save.

Now clicking the button should publish the post, i.e. transition the post status from draft -> published.

Once published, the whole split button should go back to being blue. The two options in the menu should change to:

• Update Post which when activated would save the post in its current state of published and
• Unpublish which when activated would transition the post back to a draft.

The button should be set to Update Post by default, on opening the menu Update Post should have a tick next to it.

Clicking the button will now save the post in its current state of published

Opening the menu and selecting Unpublish should should put a tick next to Unpublish and set the button to say Unpublish. The button should be red, - this requires adding the classes splitbutton-delete and button-delete instead of splitbutton-save and button-save.

Pressing the button should unpublish the post, i.e. transition the post status from draft -> published.

The button should revert back to its original state - that is be blue with the words Save Draft, and with a tick next to Save Draft when the menu is open.

Note: Ideally, this should be closed with a CasperJS test which checks the full circle of options, including labels, colour and which item is ticked.

Related: #352 The spinny arrow on the split button should point up when the menu is open and down otherwise.

Related: #511 clicking publish now with no post title reset button to save draft

[gotdibbs]

I'm already all up in the publish button, so I shall be happy to tackle this one as well.

[JohnONolan]

assigned!

[ErisDS]

Oooh.. whilst I think of it, in editor.js there is some code which hooks into splitbutton-save, when because it is JS it should have it's own class like js-post-splitbutton. Making this change will also solve the problem whereby the publish button will stop working when you make it red with the splitbutton-delete class

[JohnONolan]

Do they both need a js class? (splitbutton and button)

either way: js-publish-button please (and js-publish-splitbutton - if that's also needed)

[gotdibbs]

@ErisDS & @JohnONolan valid points. I'll make sure that is included in the PR.

[gotdibbs]

@JohnONolan @ErisDS Not to be nit-picky here, but do we really want to make the affirmative Publish Now button red? I understand some people like to use the visual weight that red carries to denote risky actions, but I have never liked the negative/destructive connotation that comes with the color when its not used for a negative/destructive actions. I'm ok just gettin' 'er done if you want, just thought I'd bring it up. 🎈

[JohnONolan]

Let's test drive it and see how we go (fade between colours if possible)

[gotdibbs]

👍