GUI for modifying the tree structure of a book
dwees - November 28, 2006 - 23:08
So I remember looking at the book structure of my friends website, and noticing how nice it was. Then when I started creating my own book and made a mistake in nesting the pages correctly, I noticed what a pain it was to change each page, especially when I had lots of pages to change.
So I had the thought that a GUI would be really cool for changing this more easily.
I had something in mind like:
http://tool-man.org/examples/sorting.html
It would be quite cool to have a page where you could drag and drop the pages of your book into the order you wanted, and then have their structure adjusted accordingly.
Has anyone worked this out already?
Dave
Please add this!
It would quadruple the functionality of the book module, if not more. Essential.
If it can't be fancy AJAX drag&drop (which would admittedly be a lot of trouble), please at least have it be a page similar to block administration: List all child nodes of the book, rearrange weight and parent nodes at will through the select menus.
Admittedly, /admin/content/book does a good job of this, but that only extends to the weight rearrangement: Parents have to still be changed by editing the node itself.
And if we can finally stop having to count and compare weights and simply drag and drop the book node (with all its child nodes) to another place in the chain or even another level entirely, Drupal's book administration would be unbeatable. Look at Google Notebook or the Personalized Google Homepage: Drag and drop wins the day.
--
Arancaytar
This would be fantastic
This would be very cool!
Other issues that would need to be worked in to the next book hierarchy enhancement:
1) For most users, the ability to move a book page should limit the extent of the tree to the topmost level created by that user, perhaps, rather than the entire site. The present book hierarchy presents an access /management nightmare because any user with "create book page" access can put his page anywhere in the site's book hierarchy.
2) The book module should somehow play nicer with organic groups, perhaps with a book-per-group option that limits the possible tree hierarchy of a page to the topmost level page created by that group.
Either of these enhancements should allow another admin role to move book pages around to any part of the hierarchy, with all their subpages following in tow.
I'm also wondering if there should be an allowance for multiple parents...for example, the same page may belong in multiple trees...
There's a fuller discussion of some of these same issues at http://drupal.org/node/65319
Cheers,
Andrew
Book GUI
I've got some Javascript written now which does what I want it to do. Basically you can drag book pages to whatever location you want. I'm going to adjust soon to allow you to drag orphaned pages where you want them.
However, I'm really not sure how to update the database to reflect the changes, so if someone could give me some tips on that, I would be greatly pleased. I'll put up a test page tonight, and open up a project for this module.
You can test out the Javascript at my current Javascript testing site at http://www.unitorganizer.com/sortable.
Dave
Module in Alpha Stage
Hey folks,
I've done some more work, and I've got a module started that appears to do a lot of what I want it to do. It still has some issues. I have applied for a CVS account, but I will give a temporary link until the code gets more officially posted.
What this module allows you to do is to go to a particular page through a menu item, and on that page you can drag all of the book pages of your site around and then update the database to reflect your changes.
Current features:
1. Can break a book into smaller separate top-level books.
2. Can combine multiple books into a large top-level book.
3. Can move child pages of books to a new parent, including a completely different book.
4. The book structure is updated with Ajax to prevent page reloads. Since the drop/drag relies on Javascript to be enabled, this means we can assume Ajax is likely to be working.
5. Access control to this page can be restricted.
Current issues:
1. Need both an undo move button, and an undo changes feature. Probably the second of these will require a new table to be created.
2. The CSS of the list has been set by the module, which probably isn't too bad given this is likely to be an administrative feature.
3. If a book has many, many pages, this could end up creating either some very slow Javascript, or just too long a list to work with. One possibility is to allow lists to be contracted/expanded (start contracted by default) and when the list is expanded, populate it with Ajax, this would allow for a smaller number of pages to be adjusted at a time.
4. Some of the Javascript I am using for this comes from individuals who have not specifically used the LGPL for their code (but have a different copyright which would allow for its normal use). As a result, these individuals should be contacted and asked if they mind us using this code under the LGPL.
5. I have not written either a INSTALL.txt, or a README.txt yet, but will do so as this module becomes finalized.
This module has been written for Drupal 5.0.x, but might work for Drupal 4.7.x as well. You can download and test a copy of it from here. Please make and keep a backup of your database while using this module.
Updated already
In case anyone has rushed to download this and install it, I've found an error in the Javascript, and fixed it so you may wish to download the latest version.
Edit: Blah as usual problems in IE. Works fine in Firefox, etc... in fact the script works fine in IE if it is stand-alone and not part of my module.
Edit 2: Looks like I've fixed the problems, at least with a theme that includes a div called 'sidebar-left', which is definitely a hack. Apparently the absolute position JS function Drupal provides isn't completely accurate in IE.
I've put a page up here, the stand-alone version is here.
Dave
4.7.x version ready
I've created a version of this module for Drupal 4.7.x (backwards compatibility is really easy actually, I'm surprised). It requires the Jquery47 module is installed, because it needs the JS from this module to work properly.
This just meant renaming some of the JS functions, and renaming one function in the module itself (drupal_add_css is a much better name than theme_add_style!).
You can download the 4.7.x version here.
Dave
This project is great. I
This project is great.
I think you can focus on the ffunctionality and use the tree widget of yui-ext the new js lib.
This is a sample:
http://yui-ext.com/deploy/yui-ext/examples/tree/reorder.html
You can read more about the lib here http://extjs.com
Hope this will help.
I have ideas about new features if you like to hear.
Brilliant script
Yeah that script is brilliant. I suppose the size of the YUI doesn't matter much since this will only load on one page. Also, the fact that some of the list items are contracted to begin with makes the actual process much cleaner and easier. I will look into incorporating this script into my module when I get a chance. Hopefully it's a relatively clean import, since I can't include the JS with my module (I'll have to force people to download it).
Dave
I'm testing it
It works fine so far, and I like the option to save or reset changes (instead of having changes automatically saved without an undo option). I've had a bit of trouble with actually changing the order of pages on the same level, but then it worked (I don't know what caused that yet; I'll have to test a bit more).
--
Aran
Changing order of pages with the same parent
Unfortunately, to do this would require changing the weights of the individual pages according to the order they have been placed by the user. This is an obvious enhancement that I'm working on. It's pretty clear to me in my head what I need to do to make this work, but I have yet to implement it because of a lack of time.
Actually I just wrote the Javascript for the GUI this week, the fact I've turned it into a module in a weekend definitely shows the power of the Drupal API.
Dave