Suggestion #27747

Make flyout message hide on click

Added by Kay Strobach almost 2 years ago. Updated almost 2 years ago.

Status:Closed Start date:2011-06-28
Priority:Should have Due date:
Assignee:- % Done:

0%
Category:Interface
Target version:TYPO3 4.6
Tags:
Votes: 0

Description

some of the flyout messages have such a big space requirement (red frame e.g. extmgm after uploading extension) that users must wait until they can go on with working in the backend.

So it would be great if the flyout messages can be closed with a click on them.

28-06-2011_17-49-35.png (59.4 kB) Kay Strobach, 2011-06-28 17:53

28-06-2011_17-49-35.png (4 kB) Kay Strobach, 2011-06-29 07:50

ok_big.png (4.2 kB) Fabien Udriot, 2011-07-14 15:03

ok.png (4 kB) Fabien Udriot, 2011-07-14 15:03

info.png (1.3 kB) Fabien Udriot, 2011-07-14 16:37

ok.png (4 kB) Fabien Udriot, 2011-07-14 16:37

warning.png (3.5 kB) Fabien Udriot, 2011-07-14 16:37

error.png (1.2 kB) Fabien Udriot, 2011-07-14 16:37

icon_error.png (318 Bytes) Fabien Udriot, 2011-07-14 16:37

icon_info.png (316 Bytes) Fabien Udriot, 2011-07-14 16:37

icon_ok.png (317 Bytes) Fabien Udriot, 2011-07-14 16:37

icon_warning.png (313 Bytes) Fabien Udriot, 2011-07-14 16:37

15-07-2011_06-58-07.png (8.5 kB) Kay Strobach, 2011-07-15 07:11

default_icon.png (479 Bytes) Fabien Udriot, 2011-07-15 11:18

variant_error.png (1.1 kB) Fabien Udriot, 2011-07-15 11:18

variant_info.png (1.2 kB) Fabien Udriot, 2011-07-15 11:18

variant_warning.png (3.4 kB) Fabien Udriot, 2011-07-15 11:18

variant_ok.png (3.9 kB) Fabien Udriot, 2011-07-15 11:18

icon_error.png (209 Bytes) Fabien Udriot, 2011-07-15 11:51

icon_info.png (213 Bytes) Fabien Udriot, 2011-07-15 11:51

icon_ok.png (213 Bytes) Fabien Udriot, 2011-07-15 11:51

icon_warning.png (207 Bytes) Fabien Udriot, 2011-07-15 11:51

Related issues

related to Core - Bug #24238: Javascript flashmessage miss named severity Closed 2010-11-29
related to Core - Bug #28462: Regression: Flashmessages are not shown any more Closed 2011-07-26

History

#1
Updated by Kay Strobach almost 2 years ago

#2
Updated by Jens Hoffmann almost 2 years ago

  • Category set to Interface
  • Status changed from New to Accepted
  • Target version set to TYPO3 4.6

+1 ;)

#3
Updated by Mr. Hudson almost 2 years ago

Patch set 1 of change I270dc0b6b4cfef945aa5802abcf586671db63e8b has been pushed to the review server.
It is available at http://review.typo3.org/2956

#4
Updated by Mr. Hudson almost 2 years ago

Patch set 2 of change I270dc0b6b4cfef945aa5802abcf586671db63e8b has been pushed to the review server.
It is available at http://review.typo3.org/2956

#5
Updated by Mr. Hudson almost 2 years ago

Patch set 3 of change I270dc0b6b4cfef945aa5802abcf586671db63e8b has been pushed to the review server.
It is available at http://review.typo3.org/2956

#6
Updated by Kay Strobach almost 2 years ago

sry for spamming patches - but i tried to fit the needs of jenkins by using jslint, by not founding any information in jenkins what was wrong...

#7
Updated by Mr. Hudson almost 2 years ago

Patch set 4 of change I270dc0b6b4cfef945aa5802abcf586671db63e8b has been pushed to the review server.
It is available at http://review.typo3.org/2956

#8
Updated by Mr. Hudson almost 2 years ago

Patch set 5 of change I270dc0b6b4cfef945aa5802abcf586671db63e8b has been pushed to the review server.
It is available at http://review.typo3.org/2956

#9
Updated by Mr. Hudson almost 2 years ago

Patch set 6 of change I270dc0b6b4cfef945aa5802abcf586671db63e8b has been pushed to the review server.
It is available at http://review.typo3.org/2956

#10
Updated by Kay Strobach almost 2 years ago

please ignore the jenkins vote - it seems to not check the js ... thanks

#11
Updated by Mr. Hudson almost 2 years ago

Patch set 7 of change I270dc0b6b4cfef945aa5802abcf586671db63e8b has been pushed to the review server.
It is available at http://review.typo3.org/2956

#12
Updated by Philipp Gampe almost 2 years ago

This change makes it hard to copy&paste texts from flashmessages. It should be turned off if BE is in debug mode.

#13
Updated by Kay Strobach almost 2 years ago

what about adding a close button/area in the upper right of each message?

The image is just a 2 minute sketch - i'm on the go ... :(

#14
Updated by Steffen Gebert almost 2 years ago

I remember having the exactly same discussion already.. will try to find it.

#15
Updated by Steffen Gebert almost 2 years ago

#23996 was it, I think - Discussion

#16
Updated by Kay Strobach almost 2 years ago

@steffen - the discussion is not about the hideability of this messages. I do just mean the flashmessages which are created as flyout messages (with extjs) ;)

The discussion fits to the following task #27748

#17
Updated by Kay Strobach almost 2 years ago

any additional feedback? - i still do like the simple click on close. The browser messages behave very similar in chrome ...

#18
Updated by Kay Strobach almost 2 years ago

please repeat before the feature freeze ... :(

#19
Updated by Fabien Udriot almost 2 years ago

Two variants regarding the size of the closing icon

#20
Updated by Fabien Udriot almost 2 years ago

Small icon could be enough considering the Use Case?

What do you think?

#21
Updated by Kay Strobach almost 2 years ago

hi fabien,

first - i like the screens, especially the small one.

second just for practical reasons i would use a semitransparent version of the icon which just contains neutral colors.
This way we could use the same closebutton for all background colors - otherwise we need atleast 4(? - OK, WARN, ERR, INFO, ...)

In my opinion there is no need to emphasize the button it can be very light ;)

Thanks in advice
Kay

#22
Updated by Fabien Udriot almost 2 years ago

I would prefer icons in tone with the fly-out message




Find the icons bellows




If needed I can put the source file (SVG). Let me know.

#23
Updated by Steffen Gebert almost 2 years ago

The round X is meant as "clear the value of this field" not "close anything". Please ask Lars on this. It's not streamlined through the backend at all, but X has different meanings (clear, delete, close).

#25
Updated by Kay Strobach almost 2 years ago

and there is also the runded x in input fields.

So what about using the word "close" or "schließen" in german ...

Otherwise it would be ok for me to have a lightgray semitransparent x for closing - or we just use the one from extjs ?!

#26
Updated by Jens Hoffmann almost 2 years ago

@fabien: Like+ :)
@steffen: You are right, too.

As far as I know Lars is on vacation in Ibiza. Don't know when he is back.
Until when do we need find a solution .. when is the feature freeze date?!

Greez Jens

#27
Updated by Kay Strobach almost 2 years ago

beginning of august ...

#28
Updated by Fabien Udriot almost 2 years ago

Wait will come up with another variant in a minute!

#29
Updated by Jens Hoffmann almost 2 years ago

:)

#30
Updated by Fabien Udriot almost 2 years ago

Default icon in TYPO3 for closing is

So, we could have square icons instead:




What consensus?

#31
Updated by Jens Hoffmann almost 2 years ago

Good solution. Let's go for that! :)
Thanks man.

#32
Updated by Kay Strobach almost 2 years ago

could you push the images to gerrit/core than i would push the js afterwards ;) - thanks

#33
Updated by Fabien Udriot almost 2 years ago

For now I am putting the icon on this thread. We will need to figure out how it should be integrated into the patch on Gerrit.

@Steffen it would be cool if you could give some clue about that




#34
Updated by Mr. Hudson almost 2 years ago

Patch set 8 of change I270dc0b6b4cfef945aa5802abcf586671db63e8b has been pushed to the review server.
It is available at http://review.typo3.org/2956

#35
Updated by Mr. Hudson almost 2 years ago

Patch set 9 of change I270dc0b6b4cfef945aa5802abcf586671db63e8b has been pushed to the review server.
It is available at http://review.typo3.org/2956

#36
Updated by Mr. Hudson almost 2 years ago

Patch set 10 of change I270dc0b6b4cfef945aa5802abcf586671db63e8b has been pushed to the review server.
It is available at http://review.typo3.org/2956

#37
Updated by Mr. Hudson almost 2 years ago

Patch set 11 of change I270dc0b6b4cfef945aa5802abcf586671db63e8b has been pushed to the review server.
It is available at http://review.typo3.org/2956

#38
Updated by Mr. Hudson almost 2 years ago

Patch set 12 of change I270dc0b6b4cfef945aa5802abcf586671db63e8b has been pushed to the review server.
It is available at http://review.typo3.org/2956

#39
Updated by Steffen Gebert almost 2 years ago

These messages can be created by entering into a JS console

TYPO3.Flashmessage().display(severuty, 'foo','bar', 100)

with severity in [0-4]

#41
Updated by Mr. Hudson almost 2 years ago

Patch set 13 of change I270dc0b6b4cfef945aa5802abcf586671db63e8b has been pushed to the review server.
It is available at http://review.typo3.org/2956

#42
Updated by Mr. Hudson almost 2 years ago

Patch set 1 of change I270dc0b6b4cfef945aa5802abcf586671db63e8b has been pushed to the review server.
It is available at http://review.typo3.org/3681

#43
Updated by Fabien Udriot almost 2 years ago

  • Status changed from Accepted to Closed

Also available in: Atom PDF