In TYPO3 4.5 LTS a new pagetree based on ExtJS and Ext.Direct was introduced. This article explains the new and changed features that are related to this rewrite.
Drag&Drop
The most interesting new feature is the improvement of the drag and drop functionality. It's much easier to copy, move, delete and create pages now. In the upper toolbar, you will find a small button that shows you a list of available doktype icons. Drag them into the tree to create new pages.
You can copy and move pages easily by dragging them around. To copy a page you need to press the ctrl key once. If you press the escape key while dragging the process will be immediatly stopped.
Furthermore you can delete pages with the drag and drop feature. While dragging a panel will be shown below the tree. Just drop a page into that panel to delete the page. You will have some time afterwards to restore the page if you deleted it by accident.
Inline Editing
Another nice feature is the possibility to directly edit the page titles in the tree. Just double click on a page to open an inline editor. The new title is saved after pressing the enter key.
State Provider
The latest used state of the tree is remembered like you might know from the old tree. Furthermore the last clicked page is restored too. The state will be refactored after a reload of the backend or the pagetree.
Filtering
The filter possibility of the old pagetree was far from usable. The new approach is able to really search the existing pages and to show a customized pagetree with the found pages highlighted. There are two modes that are used depending on your search word. The usual mode is the simple search by a keyword like "TYPO3". The search is triggered after entering at least 3 characters. If you type a numerical value this limitation isn't used and the tree will show you all pages with the numerical value in the title and the page that has this identifier. The page is completely highlighted to make it more visible.
Context Menu
Beside the pagetree itself the related context menu was rewritten. It's more responsive and much more flexible now. You will find the usual operations like cut, copy, paste and delete that are inside the page actions branch, because this functionality is already provided by the drag and drop functionality.
Even more interesting is the branch action to show temporary mount points. You can use that on any page inside the tree to get rid of the noise of the other pages while working on a specific tree branch. The filter functionality will just search inside this mount point. Also the state of this particular temporary mount point is saved.
If you are interested in extending the context menu by adding own actions, you can read <link http: wiki.typo3.org pagetree _blank typo3>the wiki article. The article features a demo extension and some example code.
Mount Points
As you might know from the old tree, it's possible to define custom mount points for backend users. The state of this mount points is saved separately and the filter feature just works on this branch like for temporary mount points.
We did a small improvement of this well-known feature by providing the possibility to show the paths of this specific mount points. Just set the configuration option "options.pageTree.showPathAboveMounts" for a backend user or group and the path is shown above each mount point.
Configuration
There are some more configuration possibilites and features that are described in<link http: wiki.typo3.org pagetree _blank typo3>the wiki article. We hope that you appreciate the new pagetree.
Future Developements
The developement of the pagetree isn't finished with 4.5. We are planning to reintroduce the integration of the clipboard to be able to paste content elements and other records directly into the tree. Furthermore it's currently not possible to use the existing code for your own tree and context menus. Also there are some known bugs that will be squashed in the next minor releases of the 4.5 branch.