Bug #21428

Recycler produces some scroll bars

Added by Oliver Hader about 10 years ago. Updated over 9 years ago.

Status:
Closed
Priority:
Should have
Category:
-
Target version:
-
Start date:
2009-11-02
Due date:
% Done:

0%

TYPO3 Version:
4.3
PHP Version:
5.1
Tags:
Complexity:
Is Regression:
Sprint Focus:

Description

The recycler produces some scrollbars and this look a bit ugly.

  • the recycler should use the whole dimension available in the viewport (no hardcoded dimensions)
  • the "recycler" title is not required
  • the "delete" and "undelete" buttons should be inside the panel and not below

See the attached screenshot at a resolution of 1024x768 in Firefox 3 - even the action buttons below the panel are not visible.

(issue imported from #M12437)

recycler.png View (69.1 KB) Administrator Admin, 2009-11-02 18:55

12437.diff View (1.44 KB) Administrator Admin, 2009-11-03 19:19

recycler_scrollbar-2.png View (52.7 KB) Administrator Admin, 2009-11-03 19:55

12437_v2.diff View (16.4 KB) Administrator Admin, 2009-11-04 12:27

recycler_scrollbar_after_patch_v2.png View (84.5 KB) Administrator Admin, 2009-11-04 14:35

12437_v3.diff View (18.7 KB) Administrator Admin, 2009-11-04 17:44

recycler_scrollbar_after_patch_v3.png View (89.7 KB) Administrator Admin, 2009-11-04 18:16


Related issues

Related to TYPO3 Core - Bug #21437: Recycler: remove superfluous Header "Recycler" Closed 2009-11-03
Related to TYPO3 Core - Bug #21440: Recycler: empty space between items and pagebrowser Closed 2009-11-03
Related to TYPO3 Core - Bug #21436: Recycler: remove superfluous tab "Deleted Data" Closed 2009-11-03
Related to TYPO3 Core - Bug #21571: Set recycler height dynamic Closed 2009-11-16
Duplicated by TYPO3 Core - Bug #21461: Recycler is missing title + description in the about module Closed 2009-11-05

History

#1 Updated by Steffen Müller about 10 years ago

Confirmed.
I even have three scrollbars on the right.

#2 Updated by Steffen Kamper about 10 years ago

Attached patch solves 3 issues:

1) remove inner vertical scrollbar
2) remove innerDoc horizontal scrollbar
3) remove content after </html>

#3 Updated by Steffen Kamper about 10 years ago

I disagree with the title, each module (except list) has the title at the beginning. Why should it be omitted?

I agree with styling. Header should be aligned left, tab isn't needed (there is only one). So i suggest something like that
RECYCLER
allows to undelete deleted data

I try to put the buttons inside too.

#4 Updated by Steffen Müller about 10 years ago

I conform the patch fixes 2) and 3)
But regarding 1) there is still one scrollbar too much, at last when using a screen resolution of 1280x800 (14.1 '' screen) - even if I use browser in fullscreen mode (see appended screenshot: recycler_scrollbar-2.png)
It seems that the reason is the height of the div container #recyclerContent which is too big.

#5 Updated by Steffen Kamper about 10 years ago

this scrollbar is correct The grid is inside a container with a fix dimension. If the grid is larger than the container then of course a scrollbar appear. If you only have 3-5 lines, you won't see the scrollbar (which was there always before)

#6 Updated by Steffen Müller about 10 years ago

Please have a look at my screenshot. I meant the outer scrollbar. The inner one is totally ok, since the list of items is longer than the grid. But the outer one is useless.

I can't test behavior with few items (lines), because the grid does not shrink (see #21440).

A general solution would be the make the container resizeable and have some auto resizing to fit the frame. Just like you did with textareas in tt_content. Setting a records limit via userTS is no solution, since this is not an option for unprivileged users.

#7 Updated by Steffen Kamper about 10 years ago

i try my best, currently i change the complete structure of container to reduce to a gridPanel only, unfortunally it's more difficult than it looks on first sight.

#8 Updated by Steffen Müller about 10 years ago

Thanks for taking care. It's good to see that someone cares about these usability issues.
Btw. I hope these topics find their way into t3uxw.

#9 Updated by Steffen Kamper about 10 years ago

here is v2 which is the result of my rework.

There are 2 TODOs which i postpone for later, as i was not able to achieve now:

1) automatic resizing of columns when window is resized
2) better alignment for toolbar (i would like to have 2 groups left/right aligned)

But i think it's much better than before.

#10 Updated by Steffen Müller about 10 years ago

Thanks for the patch. I appended a screenshot of how it looks on my laptop after applying 12437_v2.diff.

The height of the grid is still to large. It seems that a fixed value is used (530px). I tried to change the height parameter for tbar in t3_recycler.js from "height: 530" to "height: 98%" but then the grid collapsed almost completely. I' have to admit that my experience with ExtJS is tiny and trial&error is not very effective. :(

Personally I don't like the buttons on the right side. I am used to have buttons at the bottom.

#11 Updated by Steffen Kamper about 10 years ago

indeed a problem with small screens. So i will put the buttons to the bottom bar.

As it's not possible (at least now) to calculate the correct height of the frame, i will add a setting in EM for the height, so you can adjust the height of the container there.

PS - you couldn't adjust the height in the js as it was defined twice. I restructured the code once again to have it easy for reading / modifying, will upload new patch today.

#12 Updated by Steffen Kamper about 10 years ago

ok, here is my last version for this issue.

I solved the resize problem too.
Adjust height in EM if it'S too large.

I also localized the column titles which were hardcoded before.
I moved the buttons to the bottom again.

#13 Updated by Steffen Kamper about 10 years ago

i put this version in core list now.

#14 Updated by Steffen Müller about 10 years ago

The appended screenshot recycler_scrollbar_after_patch_v3.png uses a screen width of 1172px.
As you can see, the recycler is not usable with that screen resolution. You cannot select a table, since the dropdown field does not appear.

#15 Updated by Steffen Kamper about 10 years ago

committed to trunk rev 6344

Also available in: Atom PDF