Disable cpanel and user menu when editing #4694

dgrammatiko · 2014-10-16T10:44:45Z

Small UX improvement in ISIS template

What is it?

On ISIS when we are editing something (basically when we are in singular view) the main navigation becomes greyed out but cpanel and user menu are still visible. This PR hide them and removes their functionality.

Tests

Apply the patch and move around in the admin area

In pictures:

Normal view

Enter editing mode

brianteeman · 2014-10-16T11:14:13Z

Sorry but I really dont like this

On 16 October 2014 11:44, Dimitri Grammatiko notifications@github.com
wrote:

Small UX improvement in ISIS template What is it?

On ISIS when we are editing something (basically when we are in singular
view) the main navigation becomes greyed out, unavailable but still
visible. This PR hide it altogether. If you cannot click it don’t show it!
Tests

Apply the patch and move around in the admin area
In pictures:

Normal view
[image: screenshot 2014-10-16 13 34 35]
https://cloud.githubusercontent.com/assets/3889375/4661252/56b0838c-5521-11e4-8ec0-545311a61367.png

Enter editing mode
[image: screenshot 2014-10-16 13 34 21]
https://cloud.githubusercontent.com/assets/3889375/4661254/5b831ec4-5521-11e4-84d4-5dba98de46a0.png

Scrolling on editing mode
[image: screenshot 2014-10-16 13 34 11]

https://cloud.githubusercontent.com/assets/3889375/4661260/6d587b30-5521-11e4-8ae2-6d6f9fea6b42.png

You can merge this Pull Request by running

git pull https://github.com/dgt41/joomla-cms isis_ux

Or view, comment on, or merge it at:

#4694
Commit Summary

Remove disabled navigation

File Changes

M administrator/templates/isis/index.php
https://github.com/joomla/joomla-cms/pull/4694/files#diff-0 (22)

Patch Links:

https://github.com/joomla/joomla-cms/pull/4694.patch

https://github.com/joomla/joomla-cms/pull/4694.diff

—
Reply to this email directly or view it on GitHub
#4694.

Brian Teeman
Co-founder Joomla! and OpenSourceMatters Inc.
http://brian.teeman.net/

dgrammatiko · 2014-10-16T11:15:21Z

@brianteeman can you elaborate a little bit?

brianteeman · 2014-10-16T11:16:17Z

To explain further - in the past we have had proposals to hide buttons when
they cant be used and they were all rejected as being confusing (I dont
agree but that was the consensus)

For the toolbar buttons the only thing people wanted was to grey them out
if they are disabled but no one came up with a good way to do that with
bootstrap.

So following those decisions it is correct that the menu is displayed as
greyed out when disabled

On 16 October 2014 12:14, Brian Teeman brian@teeman.net wrote:

Sorry but I really dont like this

On 16 October 2014 11:44, Dimitri Grammatiko notifications@github.com
wrote:

Small UX improvement in ISIS template What is it?

On ISIS when we are editing something (basically when we are in singular
view) the main navigation becomes greyed out, unavailable but still
visible. This PR hide it altogether. If you cannot click it don’t show it!
Tests

Apply the patch and move around in the admin area
In pictures:

Normal view
[image: screenshot 2014-10-16 13 34 35]
https://cloud.githubusercontent.com/assets/3889375/4661252/56b0838c-5521-11e4-8ec0-545311a61367.png

Enter editing mode
[image: screenshot 2014-10-16 13 34 21]
https://cloud.githubusercontent.com/assets/3889375/4661254/5b831ec4-5521-11e4-84d4-5dba98de46a0.png

Scrolling on editing mode
[image: screenshot 2014-10-16 13 34 11]

https://cloud.githubusercontent.com/assets/3889375/4661260/6d587b30-5521-11e4-8ae2-6d6f9fea6b42.png

You can merge this Pull Request by running

git pull https://github.com/dgt41/joomla-cms isis_ux

Or view, comment on, or merge it at:

#4694
Commit Summary

Remove disabled navigation

File Changes

M administrator/templates/isis/index.php
https://github.com/joomla/joomla-cms/pull/4694/files#diff-0 (22)

Patch Links:

https://github.com/joomla/joomla-cms/pull/4694.patch

https://github.com/joomla/joomla-cms/pull/4694.diff

—
Reply to this email directly or view it on GitHub
#4694.

Brian Teeman
Co-founder Joomla! and OpenSourceMatters Inc.
http://brian.teeman.net/

Brian Teeman
Co-founder Joomla! and OpenSourceMatters Inc.
http://brian.teeman.net/

dgrammatiko · 2014-10-16T11:34:05Z

This is not about hiding/disabling buttons, it’s about hiding the navigation. And from my point of view having something that is just taking space in the screen is not a good UX. Also another big thing is that when you enter the edit mode you should not have options to click on anything that will unintentionally exit the editing without first warning you so. As it is now the template when you are in editing mode you still have the joomla icon, the shortcut to the site and the cog icon which all of them, when clicked will not warn you that you will actually LOOSE everything you just altered.

wdburgdorf · 2014-10-16T11:35:16Z

I disagree with Brian that it is not confusing when buttons disappear completely, but totally agree with his "I really don't like this". PhpStorm (random example) works like that: The menu adjusts dynamically to available options. Driving me crazy. Looking for a menu item that was there a minute ago. If it's greyed out, I know it's probably for a good reason. If it's gone, I don't know if it's a bug, or if I'm looking in the wrong place. But since there's already a widely accepted consensus - do we need to discuss this here?

dgrammatiko · 2014-10-16T11:46:07Z

@lausianne 3 things:
PHPstorm’s dynamically menus is totally different animal.
Before you disagree I thing you should try, you might be surprised!
Form follows function is a nice motto. In our case if there is no function there shouldn’t be any form.

betweenbrain · 2014-10-16T13:18:50Z

This is an interesting idea. I do support the general concept of removing unusable elements from the page, but do have some concern about a consistent user experience and losing context.

I'm undecided at the moment, but would be interested to also hear the thoughts of folks like @CristinaSolana, @nternetinspired, @phproberto and others.

wdburgdorf · 2014-10-16T13:24:04Z

@dgt41 phpstorm is just one example of software where unusable elements disappear completely, and this causes problems.
What exactly should I try?
Disabled buttons totally do have a function. To know that there is a button, but currently (in the current context) you can't use it. The form is, it greyes out. If it has no function ever, then it should never be there ... of course.

nternetinspired · 2014-10-16T13:28:12Z

My $0.02?

Primary navigation is a fundamental anchor for user experience. It's a fixed point that, like the constellations of stars above us, should be consistent, predictable and reliable if it is to be trusted and relied upon. I don't think it's ever good for users to hide it.

infograf768 · 2014-10-16T13:29:19Z

We already have a complex UI (parameters for example). "Losing context" (as Matt says) is not what we want.
-1 from me.

Bakual · 2014-10-16T13:36:58Z

It also removes some active stuff (cpanel, user menu, frontpage link).

Judging from other comments, there is a big vote against this change. I'm closing it.

dgrammatiko · 2014-10-16T13:37:20Z

I think I have to explain the purpose of this PR which is:
to DISABLE (by hiding navigation because this is the easiest approach here) links that are irrelevant when someone is editing something and thus PREVENTING THE LOSS of any alterations already done.
The other option will be to totally redesign back end so those links are not available in the first place.

dgrammatiko · 2014-10-16T13:45:13Z

@Bakual Exactly those are the problem: when you are editing something those links should be as well HIDDEN (cpanel and user menu)

dgrammatiko · 2014-10-16T13:47:32Z

@Bakual DISABLED i meant to write!

infograf768 · 2014-10-16T13:48:31Z

@dgt41
I agree it is desirable to grey these menus (Except the link to display front-end) when editing, but not hide them.

dgrammatiko · 2014-10-16T13:49:43Z

@infograf768 I will try again… disabling and not hidding this time 😃

brianteeman · 2014-10-16T13:55:29Z

very elegantly put @nternetinspired I will have to remember that one

dgrammatiko · 2014-10-16T13:57:40Z

Ok this PR now DISABLES cpanel and user menu icons when in editing mode
@Bakual Can you open it again?

Bakual · 2014-10-16T14:00:43Z

Reopened as requested 😄

Can you update the screenshots in the description then?

infograf768 · 2014-10-16T14:03:39Z

@test
they are greyed, but they still work. :)

brianteeman · 2014-10-16T15:01:29Z

Two good tests setting to RTC

dgrammatiko · 2014-10-16T15:01:42Z

@brianteeman @infograf768 I just saw that the if statement in the scroll function is totally useless so I removed it. Sorry about that. Needs tests again

brianteeman · 2014-10-16T15:05:42Z

Set back to pending

brianteeman · 2014-10-16T15:07:11Z

Tests reverted

This comment was created with the J!Tracker Application at issues.joomla.org/joomla-cms/4694.

dgrammatiko · 2014-10-16T16:43:51Z

Travis failure is not related to this

1) JAdministratorHelperTest::testFindOptionCanLoginAdminOptionSet
Failed asserting that two strings are equal.
--- Expected
+++ Actual
@@ @@
-'foo'
+’com_login’

mbabker · 2014-10-16T16:44:49Z

Ya, that was my bad, it's fixed already.

vanredweb · 2014-10-17T03:34:57Z

The "Registration Date" have not splited to date and time yet.

This comment was created with the J!Tracker Application at issues.joomla.org/joomla-cms/4694.

trangredweb · 2014-10-17T03:36:30Z

In left menu in user manager, don't show button remove.

tairedweb · 2014-10-17T04:15:49Z

what about this ... it doesn't disable cpanel when i wrote new email :D

This comment was created with the J!Tracker Application at issues.joomla.org/joomla-cms/4694.

phuredweb · 2014-10-17T04:48:07Z

@test

This comment was created with the J!Tracker Application at issues.joomla.org/joomla-cms/4694.

vanredweb · 2014-10-17T06:25:09Z

missing the ID area in User name window

This comment was created with the J!Tracker Application at issues.joomla.org/joomla-cms/4694.

brianteeman · 2014-10-17T06:31:25Z

@trangredweb This pull request is only disabling the cpanel and user menu on the views where the menubar is already disabled. If you think it should be disabled n other views please create a new issue

@vanredweb did you mean to post that here - it doesnt seem to be related to this isse

This comment was created with the J!Tracker Application at issues.joomla.org/joomla-cms/4694.

trangredweb · 2014-10-17T06:38:44Z

icon for button "Hide the sidebar" should change.

This comment was created with the J!Tracker Application at issues.joomla.org/joomla-cms/4694.

infograf768 · 2014-10-17T08:16:02Z

@test
Confirm it is working OK.
Note: we should indeed disable the menubar in com_messages edit

Disable cpanel and user menu when editing

dgrammatiko · 2014-10-17T15:28:47Z

@tairedweb please check #4788

dgrammatiko · 2014-10-17T15:29:55Z

@infograf768 disable the menubar in com_messages edit #4788

Remove disabled navigation

e809708

jissues-bot added the PR-staging label Oct 16, 2014

nicksavov added the PBF14 label Oct 16, 2014

dgrammatiko added 3 commits October 16, 2014 13:52

oops

c23d948

cs

859cbf3

wrong regex

9193dfb

remove animation

d0c2f30

Bakual closed this Oct 16, 2014

Disable istead of hide

18aed57

Bakual reopened this Oct 16, 2014

rearrange the code. remove duplicate if

3aa2926

dgrammatiko added 2 commits October 16, 2014 21:26

use removeAttr

ee7516c

Consistency across the navbar on disable

1401285

infograf768 added a commit that referenced this pull request Oct 17, 2014

Merge pull request #4694 from dgt41/isis_ux

9428be4

Disable cpanel and user menu when editing

infograf768 merged commit 9428be4 into joomla:staging Oct 17, 2014

mbabker added this to the Joomla! 3.3.7 milestone Oct 17, 2014

dgrammatiko mentioned this pull request Oct 17, 2014

Disable menu when editing a message #4788

Closed

dgrammatiko mentioned this pull request Oct 18, 2014

Don't polute the page with useless javascript #4843

Merged

dgrammatiko deleted the isis_ux branch November 8, 2014 23:52

mbabker modified the milestones: Joomla! 3.3.7, Joomla! 3.4.0 Nov 22, 2014

Bakual mentioned this pull request Feb 6, 2015

Admin Logo and Profile dropdown list is disabled on edit screen of plugin,article,module in backend. #5989

Closed

Disable cpanel and user menu when editing #4694

Disable cpanel and user menu when editing #4694

Conversation

dgrammatiko commented Oct 16, 2014

Small UX improvement in ISIS template

What is it?

Tests

In pictures:

brianteeman commented Oct 16, 2014

https://cloud.githubusercontent.com/assets/3889375/4661260/6d587b30-5521-11e4-8ae2-6d6f9fea6b42.png

dgrammatiko commented Oct 16, 2014

brianteeman commented Oct 16, 2014

https://cloud.githubusercontent.com/assets/3889375/4661260/6d587b30-5521-11e4-8ae2-6d6f9fea6b42.png

dgrammatiko commented Oct 16, 2014

wdburgdorf commented Oct 16, 2014

dgrammatiko commented Oct 16, 2014

betweenbrain commented Oct 16, 2014

wdburgdorf commented Oct 16, 2014

nternetinspired commented Oct 16, 2014

infograf768 commented Oct 16, 2014

Bakual commented Oct 16, 2014

dgrammatiko commented Oct 16, 2014

dgrammatiko commented Oct 16, 2014

dgrammatiko commented Oct 16, 2014

infograf768 commented Oct 16, 2014

dgrammatiko commented Oct 16, 2014

brianteeman commented Oct 16, 2014

dgrammatiko commented Oct 16, 2014

Bakual commented Oct 16, 2014

infograf768 commented Oct 16, 2014

brianteeman commented Oct 16, 2014

dgrammatiko commented Oct 16, 2014

brianteeman commented Oct 16, 2014

brianteeman commented Oct 16, 2014

dgrammatiko commented Oct 16, 2014

mbabker commented Oct 16, 2014

vanredweb commented Oct 17, 2014

trangredweb commented Oct 17, 2014

tairedweb commented Oct 17, 2014

phuredweb commented Oct 17, 2014

vanredweb commented Oct 17, 2014

brianteeman commented Oct 17, 2014

trangredweb commented Oct 17, 2014

infograf768 commented Oct 17, 2014

dgrammatiko commented Oct 17, 2014

dgrammatiko commented Oct 17, 2014