1 /***************************************************************
4 * (c) 2010 TYPO3 Tree Team <http://forge.typo3.org/projects/typo3v4-extjstrees>
7 * This script is part of the TYPO3 project. The TYPO3 project is
8 * free software; you can redistribute it and/or modify
9 * it under the terms of the GNU General Public License as published by
10 * the Free Software Foundation; either version 2 of the License, or
11 * (at your option) any later version.
13 * The GNU General Public License can be found at
14 * http://www.gnu.org/copyleft/gpl.html.
15 * A copy is found in the textfile GPL.txt and important notices to the license
16 * from the author is found in LICENSE.txt distributed with these scripts.
19 * This script is distributed in the hope that it will be useful,
20 * but WITHOUT ANY WARRANTY; without even the implied warranty of
21 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
22 * GNU General Public License for more details.
24 * This copyright notice MUST APPEAR in all copies of the script!
25 ***************************************************************/
26 Ext
.namespace('TYPO3.Components.PageTree');
29 * @class TYPO3.Components.PageTree.App
31 * Page tree main application that controls setups the components
33 * @namespace TYPO3.Components.PageTree
35 * @author Stefan Galinski <stefan.galinski@gmail.com>
37 TYPO3
.Components
.PageTree
.App
= Ext
.extend(Ext
.Panel
, {
62 * @type {TYPO3.Components.PageTree.Tree}
69 * The afterlayout wizard relayoutes the navigation container to fix some nasty
77 this.ownerCt
.doLayout();
84 * Initializes the application
86 * Set's the necessary language labels, configuration options and sprite icons by an
87 * external call and initializes the needed components.
91 initComponent: function() {
92 TYPO3
.Components
.PageTree
.DataProvider
.loadResources(function(response
) {
93 TYPO3
.Components
.PageTree
.LLL
= response
['LLL'];
94 TYPO3
.Components
.PageTree
.Configuration
= response
['Configuration'];
95 TYPO3
.Components
.PageTree
.Sprites
= response
['Sprites'];
97 var tree
= this.activeTree
= new TYPO3
.Components
.PageTree
.Tree({
98 id
: this.id
+ '-tree',
99 deletionDropZoneId
: this.id
+ '-deletionDropZone',
102 stateId
: 'Pagetree' + TYPO3
.Components
.PageTree
.Configuration
.temporaryMountPoint
,
106 plugins
: new Ext
.ux
.state
.TreePanel(),
107 commandProvider
: TYPO3
.Components
.PageTree
.Actions
,
108 contextMenuProvider
: TYPO3
.Components
.PageTree
.ContextMenuDataProvider
,
109 treeDataProvider
: TYPO3
.Components
.PageTree
.DataProvider
,
114 var treeContainer
= Ext
.getCmp(this.id
+ '-treeContainer');
115 Ext
.getCmp(this.id
+ '-filteringTree').setSize(treeContainer
.getSize());
116 treeContainer
.doLayout();
124 var filteringTree
= new TYPO3
.Components
.PageTree
.FilteringTree({
125 id
: this.id
+ '-filteringTree',
126 deletionDropZoneId
: this.id
+ '-deletionDropZone',
130 commandProvider
: TYPO3
.Components
.PageTree
.Actions
,
131 contextMenuProvider
: TYPO3
.Components
.PageTree
.ContextMenuDataProvider
,
132 treeDataProvider
: TYPO3
.Components
.PageTree
.DataProvider
,
136 var topPanel
= new TYPO3
.Components
.PageTree
.TopPanel({
137 dataProvider
: TYPO3
.Components
.PageTree
.DataProvider
,
138 filteringTree
: filteringTree
,
144 var deletionDropZone
= new TYPO3
.Components
.PageTree
.DeletionDropZone({
145 id
: this.id
+ '-deletionDropZone',
146 commandProvider
: TYPO3
.Components
.PageTree
.Actions
,
153 var topPanelItems
= new Ext
.Panel({
154 id
: this.id
+ '-topPanelItems',
161 id
: this.id
+ '-indicatorBar'
172 id
: this.id
+ '-treeContainer',
175 items
: [tree
, filteringTree
]
181 if (TYPO3
.Components
.PageTree
.Configuration
.temporaryMountPoint
) {
182 topPanelItems
.on('afterrender', function() {
183 this.addTemporaryMountPointIndicator();
187 if (TYPO3
.Components
.PageTree
.Configuration
.indicator
!== '') {
188 this.addIndicatorItems();
192 TYPO3
.Components
.PageTree
.App
.superclass
.initComponent
.apply(this, arguments
);
196 * Adds the default indicator items
200 addIndicatorItems: function() {
203 id
: this.id
+ '-indicatorBar-indicatorTitle',
204 cls
: this.id
+ '-indicatorBar-item',
205 html
: TYPO3
.Components
.PageTree
.Configuration
.indicator
210 * Adds the temporary mount point indicator item
214 addTemporaryMountPointIndicator: function() {
215 this.temporaryMountPointInfoIndicator
= this.addIndicator({
217 id
: this.id
+ '-indicatorBar-temporaryMountPoint',
218 cls
: this.id
+ '-indicatorBar-item',
223 var element
= Ext
.fly(this.id
+ '-indicatorBar-temporaryMountPoint-clear');
224 element
.on('click', function() {
225 TYPO3
.BackendUserSettings
.ExtDirect
.unsetKey(
226 'pageTree_temporaryMountPoint',
228 TYPO3
.Components
.PageTree
.Configuration
.temporaryMountPoint
= null;
229 this.removeIndicator(this.temporaryMountPointInfoIndicator
);
230 this.getTree().refreshTree();
231 this.getTree().stateId
= 'Pagetree';
242 '<span id="' + this.id
+ '-indicatorBar-temporaryMountPoint-info' + '" ' +
243 'class="' + this.id
+ '-indicatorBar-item-leftIcon ' +
244 TYPO3
.Components
.PageTree
.Sprites
.Info
+ '"> ' +
246 '<span id="' + this.id
+ '-indicatorBar-temporaryMountPoint-clear' + '" ' +
247 'class="' + this.id
+ '-indicatorBar-item-rightIcon ' + '">X' +
249 TYPO3
.Components
.PageTree
.LLL
.temporaryMountPointIndicatorInfo
+ '<br />' +
250 TYPO3
.Components
.PageTree
.Configuration
.temporaryMountPoint
+
256 * Adds an indicator item
258 * @param {Object} component
261 addIndicator: function(component
) {
262 if (component
.listeners
&& component
.listeners
.afterrender
) {
263 component
.listeners
.afterrender
.fn
= component
.listeners
.afterrender
.fn
.createSequence(
264 this.afterTopPanelItemAdded
, this
267 if (component
.listeners
) {
268 component
.listeners
= {}
271 component
.listeners
.afterrender
= {
272 fn
: this.afterTopPanelItemAdded
276 return Ext
.getCmp(this.id
+ '-indicatorBar').add(component
);
280 * Recalculates the top panel items height after an indicator was added
282 * @param {Ext.Component} component
285 afterTopPanelItemAdded: function(component
) {
286 var topPanelItems
= Ext
.getCmp(this.id
+ '-topPanelItems');
287 topPanelItems
.setHeight(topPanelItems
.getHeight() + component
.getHeight() + 3);
291 * Removes an indicator item from the indicator bar
293 * @param {Ext.Component} component
296 removeIndicator: function(component
) {
297 var topPanelItems
= Ext
.getCmp(this.id
+ '-topPanelItems');
298 topPanelItems
.setHeight(topPanelItems
.getHeight() - component
.getHeight() - 3);
299 Ext
.getCmp(this.id
+ '-indicatorBar').remove(component
);
303 * Compatibility method that calls refreshTree()
307 refresh: function() {
312 * Another compatibility method that calls refreshTree()
316 refresh_nav: function() {
321 * Refreshes the tree and selects the node defined by fsMod.recentIds['web']
325 refreshTree: function() {
326 if (!isNaN(fsMod
.recentIds
['web']) && fsMod
.recentIds
['web'] !== '') {
327 this.select(fsMod
.recentIds
['web'], true);
330 TYPO3
.Components
.PageTree
.DataProvider
.getIndicators(function(response
) {
331 var indicators
= Ext
.getCmp(this.id
+ '-indicatorBar-indicatorTitle');
333 this.removeIndicator(indicators
);
336 if (response
._COUNT
> 0) {
337 TYPO3
.Components
.PageTree
.Configuration
.indicator
= response
.html
;
338 this.addIndicatorItems();
342 this.activeTree
.refreshTree();
346 * Returns the current active tree
348 * @return {TYPO3.Components.PageTree.Tree}
350 getTree: function() {
351 return this.activeTree
;
355 * Selects a node defined by the page id. If the second parameter is set, we
356 * store the new location into the state hash.
358 * @param {int} pageId
359 * @param {Boolean} saveState
362 select: function(pageId
, saveState
) {
363 if (saveState
!== false) {
367 var tree
= this.getTree();
368 var succeeded
= false;
369 var node
= tree
.getRootNode().findChild('realId', pageId
, true);
372 tree
.selectPath(node
.getPath());
373 if (!!saveState
&& tree
.stateHash
) {
374 tree
.stateHash
.lastSelectedNode
= node
.id
;
382 * Returns the currently selected node
384 * @return {Ext.tree.TreeNode}
386 getSelected: function() {
387 var node
= this.getTree().getSelectionModel().getSelectedNode();
388 return node
? node
: null;
393 * Callback method for the module menu
395 * @return {TYPO3.Components.PageTree.App}
397 TYPO3
.ModuleMenu
.App
.registerNavigationComponent('typo3-pagetree', function() {
398 TYPO3
.Backend
.NavigationContainer
.PageTree
= new TYPO3
.Components
.PageTree
.App();
400 // compatibility code
401 top
.nav
= TYPO3
.Backend
.NavigationContainer
.PageTree
;
402 top
.nav_frame
= TYPO3
.Backend
.NavigationContainer
.PageTree
;
403 top
.content
.nav_frame
= TYPO3
.Backend
.NavigationContainer
.PageTree
;
405 return TYPO3
.Backend
.NavigationContainer
.PageTree
;
408 // XTYPE Registration
409 Ext
.reg('TYPO3.Components.PageTree.App', TYPO3
.Components
.PageTree
.App
);