[GH-ISSUE #50] Improve nested folders support #34

Closed
opened 2026-02-27 11:09:45 +03:00 by kerem · 9 comments
Owner

Originally created by @tonioo on GitHub (Dec 4, 2013).
Original GitHub issue: https://github.com/modoboa/modoboa/issues/50

Originally assigned to: @tonioo on GitHub.

Originally created by Antoine Nguyen on 2010-01-20T16:20:43Z

Actually it is not possible to browse nested folders. We need to implement a tree view to display the folders hierachy.

Originally created by @tonioo on GitHub (Dec 4, 2013). Original GitHub issue: https://github.com/modoboa/modoboa/issues/50 Originally assigned to: @tonioo on GitHub. **Originally created by Antoine Nguyen on 2010-01-20T16:20:43Z** Actually it is not possible to browse nested folders. We need to implement a tree view to display the folders hierachy.
kerem 2026-02-27 11:09:45 +03:00
Author
Owner

@tonioo commented on GitHub (Dec 4, 2013):

Posted by Antoine Nguyen on 2010-04-27T14:06:05Z

First version in [0e7c3c9427a9]. More work is needed but this version will be ok for 0.8.

For example, the div where folders are displayed should be resizable, folders name that are too long should be hidden (at least the part that overflows).

<!-- gh-comment-id:29813233 --> @tonioo commented on GitHub (Dec 4, 2013): **Posted by Antoine Nguyen on 2010-04-27T14:06:05Z** First version in [0e7c3c9427a9]. More work is needed but this version will be ok for 0.8. For example, the div where folders are displayed should be resizable, folders name that are too long should be hidden (at least the part that overflows).
Author
Owner

@tonioo commented on GitHub (Dec 4, 2013):

Posted by Miroslav Abrahám on 2013-09-02T22:30:29Z

Isn't this issue mostly implemented in the Modoboa 1.0.0 version in webmail that uses folder hierarchy to display subfolders?

<!-- gh-comment-id:29813234 --> @tonioo commented on GitHub (Dec 4, 2013): **Posted by Miroslav Abrahám on 2013-09-02T22:30:29Z** Isn't this issue mostly implemented in the Modoboa 1.0.0 version in webmail that uses folder hierarchy to display subfolders?
Author
Owner

@tonioo commented on GitHub (Dec 4, 2013):

Posted by Antoine Nguyen on 2013-09-03T06:54:34Z

It is. But it still needs improvement. I think I should rename this issue...

<!-- gh-comment-id:29813235 --> @tonioo commented on GitHub (Dec 4, 2013): **Posted by Antoine Nguyen on 2013-09-03T06:54:34Z** It is. But it still needs improvement. I think I should rename this issue...
Author
Owner

@tonioo commented on GitHub (Dec 4, 2013):

Posted by Miroslav Abrahám on 2013-09-04T22:24:11Z

I was playing around a little bit and would like to ask whether using the Jquery resizable widget could be a way for Modoboa to go when it comes to resizing? Importing jquery.resizable.js, jquery.resizable.css and posting this code into webmail.js could may be a start:

$("#folders").resizable({ handles: "e" });
$("#folders").bind("resize", function(event, ui) {
    $("#menubar").css("left", ui.size.width + 15 + "px");
    $("#listing").css("left", ui.size.width + 15 + "px");
});

What do you say? Of course it does not work perfectly. It would not respect any other elements on page (thus could be minized to a fex pixels and maximized to full windows), the draggable side would need some styling etc.

<!-- gh-comment-id:29813236 --> @tonioo commented on GitHub (Dec 4, 2013): **Posted by Miroslav Abrahám on 2013-09-04T22:24:11Z** I was playing around a little bit and would like to ask whether using the Jquery resizable widget could be a way for Modoboa to go when it comes to resizing? Importing jquery.resizable.js, jquery.resizable.css and posting this code into webmail.js could may be a start: <pre> $("#folders").resizable({ handles: "e" }); $("#folders").bind("resize", function(event, ui) { $("#menubar").css("left", ui.size.width + 15 + "px"); $("#listing").css("left", ui.size.width + 15 + "px"); }); </pre> What do you say? Of course it does not work perfectly. It would not respect any other elements on page (thus could be minized to a fex pixels and maximized to full windows), the draggable side would need some styling etc.
Author
Owner

@tonioo commented on GitHub (Dec 4, 2013):

Posted by Miroslav Abrahám on 2013-09-06T07:59:39Z

I have made some patches and would like to share in order for others to test. In order to have the basic functionality of folders panel resizing, one needs to:

  • download necessary files jquery.resizable.js (from https://raw.github.com/jquery/jquery-ui/master/ui/jquery.ui.resizable.js) and jquery.resizable.css (from https://raw.github.com/jquery/jquery-ui/master/themes/base/jquery.ui.resizable.css). Of course, the JS version can be minified, but I used the source version for now.
  • patch the index.html file found in modoboa/extensions/webmail/templates/webmail/index.html (patch file attached)
  • patch the webmail.js file found in modoboa/extensions/webmail/static/webmail/js/webmail.js (patch file attached)
  • patch the webmail.css file found in modoboa/extensions/webmail/static/webmail/css/webmail.css (patch file attached)
  • patch the app_settings.py file found in modoboa/extensions/webmail/app_settings.py (patch file attached); this is my try to incorporate the settings for width, however, I don't know how to grab and store the value from Python, so consider this as the first step
  • patch the SOURCES.txt file (patch file attached); not sure though whether it is necessary or the file is autogenerated

That should be it and should give you the basic functionality which does 2 things:

  • it allows a user to resize the folders panel (only to the right starting at 200 px and ending at 400 px, which should be enough)
  • it also shortens long folder names and replaces the end of the long folder names with ellipsis
<!-- gh-comment-id:29813237 --> @tonioo commented on GitHub (Dec 4, 2013): **Posted by Miroslav Abrahám on 2013-09-06T07:59:39Z** I have made some patches and would like to share in order for others to test. In order to have the basic functionality of folders panel resizing, one needs to: - download necessary files jquery.resizable.js (from [[https://raw.github.com/jquery/jquery-ui/master/ui/jquery.ui.resizable.js]]) and jquery.resizable.css (from [[https://raw.github.com/jquery/jquery-ui/master/themes/base/jquery.ui.resizable.css]]). Of course, the JS version can be minified, but I used the source version for now. - patch the index.html file found in modoboa/extensions/webmail/templates/webmail/index.html (patch file attached) - patch the webmail.js file found in modoboa/extensions/webmail/static/webmail/js/webmail.js (patch file attached) - patch the webmail.css file found in modoboa/extensions/webmail/static/webmail/css/webmail.css (patch file attached) - patch the app_settings.py file found in modoboa/extensions/webmail/app_settings.py (patch file attached); this is my try to incorporate the settings for width, however, I don't know how to grab and store the value from Python, so consider this as the first step - patch the SOURCES.txt file (patch file attached); not sure though whether it is necessary or the file is autogenerated That should be it and should give you the basic functionality which does 2 things: - it allows a user to resize the folders panel (only to the right starting at 200 px and ending at 400 px, which should be enough) - it also shortens long folder names and replaces the end of the long folder names with ellipsis
Author
Owner

@tonioo commented on GitHub (Dec 4, 2013):

Posted by Miroslav Abrahám on 2013-09-06T09:48:21Z

Please, use this attached webmail.js patch file; the previous one is copy pasted from my script and all "$" signes are escaped.

<!-- gh-comment-id:29813241 --> @tonioo commented on GitHub (Dec 4, 2013): **Posted by Miroslav Abrahám on 2013-09-06T09:48:21Z** Please, use this attached webmail.js patch file; the previous one is copy pasted from my script and all "$" signes are escaped.
Author
Owner

@tonioo commented on GitHub (Dec 4, 2013):

Posted by Antoine Nguyen on 2013-09-08T19:29:37Z

Many thanks for this work! I'll include it this week.

<!-- gh-comment-id:29813242 --> @tonioo commented on GitHub (Dec 4, 2013): **Posted by Antoine Nguyen on 2013-09-08T19:29:37Z** Many thanks for this work! I'll include it this week.
Author
Owner

@tonioo commented on GitHub (Dec 4, 2013):

Posted by Miroslav Abrahám on 2013-09-09T08:29:30Z

One more small change, this time in webmail.css file - according to https://developer.mozilla.org/en-US/docs/Web/CSS/text-overflow, the "-ms-text-overflow" should not be used. I therefore attach a new patch file for webmail.css.

<!-- gh-comment-id:29813243 --> @tonioo commented on GitHub (Dec 4, 2013): **Posted by Miroslav Abrahám on 2013-09-09T08:29:30Z** One more small change, this time in webmail.css file - according to [[https://developer.mozilla.org/en-US/docs/Web/CSS/text-overflow]], the "-ms-text-overflow" should not be used. I therefore attach a new patch file for webmail.css.
Author
Owner

@tonioo commented on GitHub (Dec 4, 2013):

Posted by Miroslav Abrahám on 2013-09-09T09:10:06Z

Sorry to post again, one more change - I added the grippy picture to the right of the folders div for it to be visibly resizable.

<!-- gh-comment-id:29813246 --> @tonioo commented on GitHub (Dec 4, 2013): **Posted by Miroslav Abrahám on 2013-09-09T09:10:06Z** Sorry to post again, one more change - I added the grippy picture to the right of the folders div for it to be visibly resizable.
Sign in to join this conversation.
No milestone
No project
No assignees
1 participant
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference
starred/modoboa-modoboa#34
No description provided.