[TASK] Migrate `Utility` to TypeScript 51/54251/6
authorAndreas Fernandez <a.fernandez@scripting-base.de>
Sun, 1 Oct 2017 11:17:10 +0000 (13:17 +0200)
committerChristian Kuhn <lolli@schwarzbu.ch>
Mon, 16 Oct 2017 09:29:10 +0000 (11:29 +0200)
The RequireJS module `TYPO3/CMS/Backend/Utility` is migrated to
TypeScript. This patch marks the global object `TYPO3.Utility` as
deprecated. Any occurrence is migrated to properly use the module instead.

Resolves: #82609
Releases: master
Change-Id: Ic0deaa29074080edd71928891fd09c3fb2af63fd
Reviewed-on: https://review.typo3.org/54251
Tested-by: TYPO3com <no-reply@typo3.com>
Reviewed-by: Frank Naegler <frank.naegler@typo3.org>
Tested-by: Frank Naegler <frank.naegler@typo3.org>
Reviewed-by: Christian Kuhn <lolli@schwarzbu.ch>
Tested-by: Christian Kuhn <lolli@schwarzbu.ch>
Build/types/TYPO3/index.d.ts
typo3/sysext/backend/Resources/Private/TypeScript/Utility.ts [new file with mode: 0644]
typo3/sysext/backend/Resources/Public/JavaScript/Utility.js
typo3/sysext/backend/Resources/Public/JavaScript/Viewport.js
typo3/sysext/backend/Resources/Public/JavaScript/extjs/components/pagetree/javascript/actions.js
typo3/sysext/backend/Resources/Public/JavaScript/extjs/components/pagetree/javascript/toppanel.js
typo3/sysext/core/Documentation/Changelog/master/Deprecation-82609-DeprecateTYPO3Utility.rst [new file with mode: 0644]

index 09391b1..077aa4d 100644 (file)
@@ -7,6 +7,7 @@
 declare namespace TYPO3 {
   export let Popover: any;
   export let Storage: any;
+  export let Utility: any;
   export const lang: any;
   export const settings: any;
   export namespace CMS {
diff --git a/typo3/sysext/backend/Resources/Private/TypeScript/Utility.ts b/typo3/sysext/backend/Resources/Private/TypeScript/Utility.ts
new file mode 100644 (file)
index 0000000..895e880
--- /dev/null
@@ -0,0 +1,84 @@
+/*
+ * This file is part of the TYPO3 CMS project.
+ *
+ * It is free software; you can redistribute it and/or modify it under
+ * the terms of the GNU General Public License, either version 2
+ * of the License, or any later version.
+ *
+ * For the full copyright and license information, please read the
+ * LICENSE.txt file that was distributed with this source code.
+ *
+ * The TYPO3 project - inspiring people to share!
+ */
+
+/**
+ * Module: TYPO3/CMS/Backend/Utility
+ */
+class Utility {
+  /**
+   * Checks if a given number is really a number
+   *
+   * Taken from:
+   * http://dl.dropbox.com/u/35146/js/tests/isNumber.html
+   *
+   * @param {number} value
+   * @returns {boolean}
+   */
+  public isNumber = (value: number): boolean => {
+    return !isNaN(parseFloat(value.toString())) && isFinite(value);
+  }
+
+  /**
+   * Gets a parameter from a given url
+   *
+   * @param {string} url
+   * @param {string} parameter
+   * @returns {string}
+   */
+  public getParameterFromUrl = (url: string, parameter: string): string => {
+    if (typeof url.split !== 'function') {
+      return '';
+    }
+    const parts = url.split('?');
+    let value = '';
+
+    if (parts.length >= 2) {
+      const queryString = parts.join('?');
+
+      const prefix = encodeURIComponent(parameter) + '=';
+      const parameters = queryString.split(/[&;]/g);
+      for (let i = parameters.length; i-- > 0; ) {
+        if (parameters[i].lastIndexOf(prefix, 0) !== -1) {
+          value = parameters[i].split('=')[1];
+          break;
+        }
+      }
+    }
+
+    return value;
+  }
+
+  /**
+   * Updates a parameter inside of given url
+   *
+   * @param {string} url
+   * @param {string} key
+   * @param {string} value
+   * @returns {string}
+   */
+  public updateQueryStringParameter = (url: string, key: string, value: string): string => {
+    const re = new RegExp('([?&])' + key + '=.*?(&|$)', 'i');
+    const separator = url.indexOf('?') !== -1 ? '&' : '?';
+
+    if (url.match(re)) {
+      return url.replace(re, '$1' + key + '=' + value + '$2');
+    }
+    return url + separator + key + '=' + value;
+  }
+}
+
+const utilityObject = new Utility();
+
+// @deprecated since TYPO3 v9, will be removed in TYPO3 v10. Use the TYPO3/CMS/Backend/Utility module in AMD instead
+TYPO3.Utility = utilityObject;
+export = utilityObject;
index bc69091..b68e8a8 100644 (file)
  *
  * The TYPO3 project - inspiring people to share!
  */
-
-/**
- * Module: TYPO3/CMS/Backend/Utility
- */
-define(['jquery'], function($) {
-
-       /**
-        * The main Utility object
-        *
-        * @type {{}}
-        * @exports TYPO3/CMS/Backend/Utility
-        */
-       var Utility = {
-       };
-
-       /**
-        * Checks if a given number is really a number
-        *
-        * Taken from:
-        * http://dl.dropbox.com/u/35146/js/tests/isNumber.html
-        *
-        * @param {String} number
-        * @returns {boolean|*}
-        */
-       Utility.isNumber = function(number) {
-               return !isNaN(parseFloat(number)) && isFinite(number);
-       };
-
-       /**
-        * Gets a parameter from a given url
-        *
-        * @param {String} url
-        * @param {String} parameter
-        * @returns {String}
-        */
-       Utility.getParameterFromUrl = function(url, parameter) {
-               if (typeof url.split !== 'function') {
-                       return '';
-               }
-               var parts = url.split('?'),
-                       value = '';
-
-               if (parts.length >= 2) {
-                       var queryString = parts.join('?');
-
-                       var prefix = encodeURIComponent(parameter) + '=';
-                       var parameters = queryString.split(/[&;]/g);
-                       for (var i = parameters.length; i-- > 0;) {
-                               if (parameters[i].lastIndexOf(prefix, 0) !== -1) {
-                                       value = parameters[i].split('=')[1];
-                                       break;
-                               }
-                       }
-               }
-
-               return value;
-       };
-
-       /**
-        * Updates a parameter inside of given url
-        *
-        * @param {String} url
-        * @param {String} key
-        * @param {String} value
-        */
-       Utility.updateQueryStringParameter = function(url, key, value) {
-               var re = new RegExp('([?&])' + key + '=.*?(&|$)', 'i'),
-                       separator = url.indexOf('?') !== -1 ? '&' : '?';
-
-               if (url.match(re)) {
-                       return url.replace(re, '$1' + key + '=' + value + '$2');
-               }
-               return url + separator + key + '=' + value;
-       };
-
-       TYPO3.Utility = Utility;
-       return Utility;
+define(["require", "exports"], function (require, exports) {
+    "use strict";
+    /**
+     * Module: TYPO3/CMS/Backend/Utility
+     */
+    var Utility = (function () {
+        function Utility() {
+            /**
+             * Checks if a given number is really a number
+             *
+             * Taken from:
+             * http://dl.dropbox.com/u/35146/js/tests/isNumber.html
+             *
+             * @param {number} value
+             * @returns {boolean}
+             */
+            this.isNumber = function (value) {
+                return !isNaN(parseFloat(value.toString())) && isFinite(value);
+            };
+            /**
+             * Gets a parameter from a given url
+             *
+             * @param {string} url
+             * @param {string} parameter
+             * @returns {string}
+             */
+            this.getParameterFromUrl = function (url, parameter) {
+                if (typeof url.split !== 'function') {
+                    return '';
+                }
+                var parts = url.split('?');
+                var value = '';
+                if (parts.length >= 2) {
+                    var queryString = parts.join('?');
+                    var prefix = encodeURIComponent(parameter) + '=';
+                    var parameters = queryString.split(/[&;]/g);
+                    for (var i = parameters.length; i-- > 0;) {
+                        if (parameters[i].lastIndexOf(prefix, 0) !== -1) {
+                            value = parameters[i].split('=')[1];
+                            break;
+                        }
+                    }
+                }
+                return value;
+            };
+            /**
+             * Updates a parameter inside of given url
+             *
+             * @param {string} url
+             * @param {string} key
+             * @param {string} value
+             * @returns {string}
+             */
+            this.updateQueryStringParameter = function (url, key, value) {
+                var re = new RegExp('([?&])' + key + '=.*?(&|$)', 'i');
+                var separator = url.indexOf('?') !== -1 ? '&' : '?';
+                if (url.match(re)) {
+                    return url.replace(re, '$1' + key + '=' + value + '$2');
+                }
+                return url + separator + key + '=' + value;
+            };
+        }
+        return Utility;
+    }());
+    var utilityObject = new Utility();
+    TYPO3.Utility = utilityObject;
+    return utilityObject;
 });
index 7b6aecc..4854372 100644 (file)
@@ -21,10 +21,11 @@ define(
        [
                'jquery',
                'TYPO3/CMS/Backend/Icons',
+               'TYPO3/CMS/Backend/Utility',
                'TYPO3/CMS/Backend/Event/ConsumerScope',
                'TYPO3/CMS/Backend/Event/TriggerRequest'
        ],
-       function ($, Icons, ConsumerScope, TriggerRequest) {
+       function ($, Icons, Utility, ConsumerScope, TriggerRequest) {
                'use strict';
 
                function resolveIFrameElement() {
@@ -217,7 +218,7 @@ define(
                                },
                                getIdFromUrl: function() {
                                        if(this.getUrl) {
-                                               return TYPO3.Utility.getParameterFromUrl(this.getUrl, 'id');
+                                               return Utility.getParameterFromUrl(this.getUrl, 'id');
                                        } else {
                                                return 0;
                                        }
index 3e640de..0cece6f 100644 (file)
  */
 Ext.namespace('TYPO3.Components.PageTree');
 
-/**
- * @class TYPO3.Components.PageTree.Actions
- *
- * Actions dedicated for the page tree
- *
- * @namespace TYPO3.Components.PageTree
- */
-TYPO3.Components.PageTree.Actions = {
-
-       /**
-        * Evaluates a response from an ext direct call and shows a flash message
-        * if it was an exceptional result
-        *
-        * @param {Object} response
-        * @return {Boolean}
-        */
-       evaluateResponse: function(response) {
-               if (response.success === false) {
-                       top.TYPO3.Notification.error('Exception', response.message);
-                       return false;
-               }
-
-               return true;
-       },
-
+require(['TYPO3/CMS/Backend/Utility'], function(Utility) {
        /**
-        * Releases the cut and copy mode from the context menu
+        * @class TYPO3.Components.PageTree.Actions
         *
-        * @param {TYPO3.Components.PageTree.Tree} tree
-        * @return {void}
-        */
-       releaseCutAndCopyModes: function(tree) {
-               tree.t3ContextInfo.inCutMode = false;
-               tree.t3ContextInfo.inCopyMode = false;
-
-               if (tree.t3ContextNode) {
-                       tree.t3ContextNode.attributes.nodeData.t3InCutMode = false;
-                       tree.t3ContextNode.attributes.nodeData.t3InCopyMode = false;
-                       tree.t3ContextNode = null;
-               }
-       },
-
-       /**
-        * Updates an existing node with the given alternative. The new tree node
-        * is returned afterwards.
+        * Actions dedicated for the page tree
         *
-        * @param {Ext.tree.TreeNode} node
-        * @param {Boolean} isExpanded
-        * @param {Object} updatedNode
-        * @param {Function} callback
-        * @return {Ext.tree.TreeNode}
+        * @namespace TYPO3.Components.PageTree
         */
-       updateNode: function(node, isExpanded, updatedNode, callback) {
-               if (!updatedNode) {
-                       return null;
-               }
-
-               updatedNode.uiProvider = node.ownerTree.uiProvider;
-               var newTreeNode = new Ext.tree.TreeNode(updatedNode);
+       TYPO3.Components.PageTree.Actions = {
 
-               var refreshCallback = this.restoreNodeStateAfterRefresh;
-               if (callback) {
-                       refreshCallback = refreshCallback.createSequence(callback);
-               }
-
-               node.parentNode.replaceChild(newTreeNode, node);
-               newTreeNode.ownerTree.refreshNode(newTreeNode, refreshCallback);
-
-               return newTreeNode;
-       },
+               /**
+                * Evaluates a response from an ext direct call and shows a flash message
+                * if it was an exceptional result
+                *
+                * @param {Object} response
+                * @return {Boolean}
+                */
+               evaluateResponse: function (response) {
+                       if (response.success === false) {
+                               top.TYPO3.Notification.error('Exception', response.message);
+                               return false;
+                       }
 
-       /**
-        * Restores the node state
-        *
-        * @param {Ext.tree.TreeNode} node
-        * @param {Boolean} isExpanded
-        * @return {void}
-        */
-       restoreNodeStateAfterRefresh: function(node, isExpanded) {
-               node.parentNode.expand(false, false);
-               if (isExpanded) {
-                       node.expand(false, false);
-               } else {
-                       node.collapse(false, false);
-               }
-       },
+                       return true;
+               },
+
+               /**
+                * Releases the cut and copy mode from the context menu
+                *
+                * @param {TYPO3.Components.PageTree.Tree} tree
+                * @return {void}
+                */
+               releaseCutAndCopyModes: function (tree) {
+                       tree.t3ContextInfo.inCutMode = false;
+                       tree.t3ContextInfo.inCopyMode = false;
+
+                       if (tree.t3ContextNode) {
+                               tree.t3ContextNode.attributes.nodeData.t3InCutMode = false;
+                               tree.t3ContextNode.attributes.nodeData.t3InCopyMode = false;
+                               tree.t3ContextNode = null;
+                       }
+               },
+
+               /**
+                * Updates an existing node with the given alternative. The new tree node
+                * is returned afterwards.
+                *
+                * @param {Ext.tree.TreeNode} node
+                * @param {Boolean} isExpanded
+                * @param {Object} updatedNode
+                * @param {Function} callback
+                * @return {Ext.tree.TreeNode}
+                */
+               updateNode: function (node, isExpanded, updatedNode, callback) {
+                       if (!updatedNode) {
+                               return null;
+                       }
 
-       /**
-        * Shows deletion confirmation window
-        *
-        * @param {Ext.tree.TreeNode} node
-        * @param {TYPO3.Components.PageTree.Tree} tree
-        * @param {Function} callback
-        * @param {Boolean} recursiveDelete
-        * @return {void}
-        */
-       confirmDelete: function(node, tree, callback, recursiveDelete) {
-               callback = callback || null;
+                       updatedNode.uiProvider = node.ownerTree.uiProvider;
+                       var newTreeNode = new Ext.tree.TreeNode(updatedNode);
 
-               var title = TYPO3.Components.PageTree.LLL.deleteDialogTitle,
-                       message = TYPO3.Components.PageTree.LLL.deleteDialogMessage;
-               if (recursiveDelete) {
-                       message = TYPO3.Components.PageTree.LLL.recursiveDeleteDialogMessage;
-               }
+                       var refreshCallback = this.restoreNodeStateAfterRefresh;
+                       if (callback) {
+                               refreshCallback = refreshCallback.createSequence(callback);
+                       }
 
-               Ext.Msg.show({
-                       title: title,
-                       msg: message,
-                       buttons: Ext.Msg.YESNO,
-                       fn: function (answer) {
-                               if (answer === 'yes') {
-                                       TYPO3.Components.PageTree.Actions.deleteNode(node, tree, callback);
-                                       return true;
-                               }
-                               return false;
-                       },
-                       animEl: 'elId'
-               });
-       },
+                       node.parentNode.replaceChild(newTreeNode, node);
+                       newTreeNode.ownerTree.refreshNode(newTreeNode, refreshCallback);
+
+                       return newTreeNode;
+               },
+
+               /**
+                * Restores the node state
+                *
+                * @param {Ext.tree.TreeNode} node
+                * @param {Boolean} isExpanded
+                * @return {void}
+                */
+               restoreNodeStateAfterRefresh: function (node, isExpanded) {
+                       node.parentNode.expand(false, false);
+                       if (isExpanded) {
+                               node.expand(false, false);
+                       } else {
+                               node.collapse(false, false);
+                       }
+               },
+
+               /**
+                * Shows deletion confirmation window
+                *
+                * @param {Ext.tree.TreeNode} node
+                * @param {TYPO3.Components.PageTree.Tree} tree
+                * @param {Function} callback
+                * @param {Boolean} recursiveDelete
+                * @return {void}
+                */
+               confirmDelete: function (node, tree, callback, recursiveDelete) {
+                       callback = callback || null;
+
+                       var title = TYPO3.Components.PageTree.LLL.deleteDialogTitle,
+                               message = TYPO3.Components.PageTree.LLL.deleteDialogMessage;
+                       if (recursiveDelete) {
+                               message = TYPO3.Components.PageTree.LLL.recursiveDeleteDialogMessage;
+                       }
 
-       /**
-        * Deletes a node directly
-        *
-        * @param {Ext.tree.TreeNode} node
-        * @param {TYPO3.Components.PageTree.Tree} tree
-        * @param {Function} callback
-        * @return {void}
-        */
-       deleteNode: function(node, tree, callback) {
-               TYPO3.Components.PageTree.Commands.deleteNode(
-                       node.attributes.nodeData,
-                       function(response) {
-                               var succeeded = this.evaluateResponse(response);
-                               if (Ext.isFunction(callback)) {
-                                       callback(node, tree, succeeded);
-                               }
+                       Ext.Msg.show({
+                               title: title,
+                               msg: message,
+                               buttons: Ext.Msg.YESNO,
+                               fn: function (answer) {
+                                       if (answer === 'yes') {
+                                               TYPO3.Components.PageTree.Actions.deleteNode(node, tree, callback);
+                                               return true;
+                                       }
+                                       return false;
+                               },
+                               animEl: 'elId'
+                       });
+               },
+
+               /**
+                * Deletes a node directly
+                *
+                * @param {Ext.tree.TreeNode} node
+                * @param {TYPO3.Components.PageTree.Tree} tree
+                * @param {Function} callback
+                * @return {void}
+                */
+               deleteNode: function (node, tree, callback) {
+                       TYPO3.Components.PageTree.Commands.deleteNode(
+                               node.attributes.nodeData,
+                               function (response) {
+                                       var succeeded = this.evaluateResponse(response);
+                                       if (Ext.isFunction(callback)) {
+                                               callback(node, tree, succeeded);
+                                       }
 
-                               if (succeeded) {
+                                       if (succeeded) {
                                                // the node may not be removed in workspace mode
-                                       if (top.TYPO3.configuration.inWorkspace && response.id) {
-                                               this.updateNode(node, node.isExpanded(), response);
-                                       } else {
-                                               node.remove();
+                                               if (top.TYPO3.configuration.inWorkspace && response.id) {
+                                                       this.updateNode(node, node.isExpanded(), response);
+                                               } else {
+                                                       node.remove();
+                                               }
                                        }
-                               }
-                       },
-                       this
-               );
-       },
-
-       /**
-        * Removes a node either directly or first shows deletion popup
-        *
-        * @param {Ext.tree.TreeNode} node
-        * @param {TYPO3.Components.PageTree.Tree} tree
-        * @return {void}
-        */
-       removeNode: function(node, tree) {
-               if (TYPO3.Components.PageTree.Configuration.displayDeleteConfirmation) {
-                       this.confirmDelete(node);
-               } else {
-                       this.deleteNode(node, tree);
-               }
-       },
-
-       /**
-        * Restores a given node and moves it to the given destination inside the tree. Use this
-        * method if you want to add it as the first child of the destination.
-        *
-        * @param {Ext.tree.TreeNode} node
-        * @param {TYPO3.Components.PageTree.Tree} tree
-        * @param {Ext.tree.TreeNode} destination
-        * @return {void}
-        */
-       restoreNodeToFirstChildOfDestination: function(node, tree, destination) {
-               TYPO3.Components.PageTree.Commands.restoreNode(
-                       node.attributes.nodeData,
-                       destination.attributes.nodeData.id,
-                       function(updatedNode) {
-                               if (this.evaluateResponse(updatedNode)) {
-                                       var newTreeNode = new Ext.tree.TreeNode(
-                                               Ext.apply(node.attributes, updatedNode)
-                                       );
-                                       destination.insertBefore(newTreeNode, destination.firstChild);
-                               }
-                       },
-                       this
-               );
-       },
-
-       /**
-        * Restores a given node and moves it to the given destination inside the tree. Use this
-        * method if you want to add the node after the destination node.
-        *
-        * @param {Ext.tree.TreeNode} node
-        * @param {TYPO3.Components.PageTree.Tree} tree
-        * @param {Ext.tree.TreeNode} destination
-        * @return {void}
-        */
-       restoreNodeAfterDestination: function(node, tree, destination) {
-               TYPO3.Components.PageTree.Commands.restoreNode(
-                       node.attributes.nodeData,
-                       -destination.attributes.nodeData.id,
-                       function(updatedNode) {
-                               if (this.evaluateResponse(updatedNode)) {
-                                       var newTreeNode = new Ext.tree.TreeNode(
-                                               Ext.apply(node.attributes, updatedNode)
-                                       );
-                                       destination.parentNode.insertBefore(newTreeNode, destination.nextSibling);
-                               }
-                       },
-                       this
-               );
-       },
-
-       /**
-        * Collapses a whole tree branch
-        *
-        * @param {Ext.tree.TreeNode} node
-        * @return {void}
-        */
-       collapseBranch: function(node) {
-               node.collapse(true);
-       },
-
-       /**
-        * Expands a whole tree branch
-        *
-        * @param {Ext.tree.TreeNode} node
-        * @return {void}
-        */
-       expandBranch: function(node) {
-               node.expand(true);
-       },
-
-       /**
-        * Opens a popup windows for previewing the given node/page
-        *
-        * @param {Ext.tree.TreeNode} node
-        * @return {void}
-        */
-       viewPage: function(node) {
-               var frontendWindow = window.open('', 'newTYPO3frontendWindow');
-               TYPO3.Components.PageTree.Commands.getViewLink(
-                       node.attributes.nodeData,
-                       function(result) {
-                               frontendWindow.location = result;
-                               frontendWindow.focus();
+                               },
+                               this
+                       );
+               },
+
+               /**
+                * Removes a node either directly or first shows deletion popup
+                *
+                * @param {Ext.tree.TreeNode} node
+                * @param {TYPO3.Components.PageTree.Tree} tree
+                * @return {void}
+                */
+               removeNode: function (node, tree) {
+                       if (TYPO3.Components.PageTree.Configuration.displayDeleteConfirmation) {
+                               this.confirmDelete(node);
+                       } else {
+                               this.deleteNode(node, tree);
                        }
-               );
-       },
-
-       /**
-        * Creates a temporary tree mount point
-        *
-        * @param {Ext.tree.TreeNode} node
-        * @param {TYPO3.Components.PageTree.Tree} tree
-        * @return {void}
-        */
-       mountAsTreeRoot: function(node, tree) {
-               TYPO3.Components.PageTree.Commands.setTemporaryMountPoint(
-                       node.attributes.nodeData,
-                       function(response) {
-                               if (TYPO3.Components.PageTree.Configuration.temporaryMountPoint) {
-                                       TYPO3.Backend.NavigationContainer.PageTree.removeIndicator(
-                                               TYPO3.Backend.NavigationContainer.PageTree.temporaryMountPointInfoIndicator
-                                       );
-                               }
-
-                               TYPO3.Components.PageTree.Configuration.temporaryMountPoint = response;
-                               Ext.getCmp('typo3-pagetree-tree').app.addTemporaryMountPointIndicator();
-
-                               var selectedNode = Ext.getCmp('typo3-pagetree-tree').app.getSelected();
-                               tree.stateId = 'Pagetree' + TYPO3.Components.PageTree.Configuration.temporaryMountPoint;
-                               tree.refreshTree(function() {
-                                       var nodeIsSelected = false;
-                                       if (selectedNode) {
-                                               nodeIsSelected = TYPO3.Backend.NavigationContainer.PageTree.select(
-                                                       selectedNode.attributes.nodeData.id
+               },
+
+               /**
+                * Restores a given node and moves it to the given destination inside the tree. Use this
+                * method if you want to add it as the first child of the destination.
+                *
+                * @param {Ext.tree.TreeNode} node
+                * @param {TYPO3.Components.PageTree.Tree} tree
+                * @param {Ext.tree.TreeNode} destination
+                * @return {void}
+                */
+               restoreNodeToFirstChildOfDestination: function (node, tree, destination) {
+                       TYPO3.Components.PageTree.Commands.restoreNode(
+                               node.attributes.nodeData,
+                               destination.attributes.nodeData.id,
+                               function (updatedNode) {
+                                       if (this.evaluateResponse(updatedNode)) {
+                                               var newTreeNode = new Ext.tree.TreeNode(
+                                                       Ext.apply(node.attributes, updatedNode)
                                                );
+                                               destination.insertBefore(newTreeNode, destination.firstChild);
                                        }
-
-                                       var node = (nodeIsSelected ? TYPO3.Backend.NavigationContainer.PageTree.getSelected() : null);
-                                       if (node) {
-                                               this.singleClick(node, tree);
-                                       } else {
-                                               this.singleClick(tree.getRootNode().firstChild, tree);
+                               },
+                               this
+                       );
+               },
+
+               /**
+                * Restores a given node and moves it to the given destination inside the tree. Use this
+                * method if you want to add the node after the destination node.
+                *
+                * @param {Ext.tree.TreeNode} node
+                * @param {TYPO3.Components.PageTree.Tree} tree
+                * @param {Ext.tree.TreeNode} destination
+                * @return {void}
+                */
+               restoreNodeAfterDestination: function (node, tree, destination) {
+                       TYPO3.Components.PageTree.Commands.restoreNode(
+                               node.attributes.nodeData,
+                               -destination.attributes.nodeData.id,
+                               function (updatedNode) {
+                                       if (this.evaluateResponse(updatedNode)) {
+                                               var newTreeNode = new Ext.tree.TreeNode(
+                                                       Ext.apply(node.attributes, updatedNode)
+                                               );
+                                               destination.parentNode.insertBefore(newTreeNode, destination.nextSibling);
+                                       }
+                               },
+                               this
+                       );
+               },
+
+               /**
+                * Collapses a whole tree branch
+                *
+                * @param {Ext.tree.TreeNode} node
+                * @return {void}
+                */
+               collapseBranch: function (node) {
+                       node.collapse(true);
+               },
+
+               /**
+                * Expands a whole tree branch
+                *
+                * @param {Ext.tree.TreeNode} node
+                * @return {void}
+                */
+               expandBranch: function (node) {
+                       node.expand(true);
+               },
+
+               /**
+                * Opens a popup windows for previewing the given node/page
+                *
+                * @param {Ext.tree.TreeNode} node
+                * @return {void}
+                */
+               viewPage: function (node) {
+                       var frontendWindow = window.open('', 'newTYPO3frontendWindow');
+                       TYPO3.Components.PageTree.Commands.getViewLink(
+                               node.attributes.nodeData,
+                               function (result) {
+                                       frontendWindow.location = result;
+                                       frontendWindow.focus();
+                               }
+                       );
+               },
+
+               /**
+                * Creates a temporary tree mount point
+                *
+                * @param {Ext.tree.TreeNode} node
+                * @param {TYPO3.Components.PageTree.Tree} tree
+                * @return {void}
+                */
+               mountAsTreeRoot: function (node, tree) {
+                       TYPO3.Components.PageTree.Commands.setTemporaryMountPoint(
+                               node.attributes.nodeData,
+                               function (response) {
+                                       if (TYPO3.Components.PageTree.Configuration.temporaryMountPoint) {
+                                               TYPO3.Backend.NavigationContainer.PageTree.removeIndicator(
+                                                       TYPO3.Backend.NavigationContainer.PageTree.temporaryMountPointInfoIndicator
+                                               );
                                        }
-                               }, this);
-                       },
-                       this
-               );
-       },
-
-       /**
-        * Opens the edit page properties dialog
-        *
-        * @param {Ext.tree.TreeNode} node
-        * @return {void}
-        */
-       editPageProperties: function(node) {
-               var returnUrl = TYPO3.Backend.ContentContainer.getUrl();
-               if (returnUrl.indexOf('returnUrl') !== -1) {
-                       returnUrl = TYPO3.Utility.getParameterFromUrl(returnUrl, 'returnUrl');
-               } else {
-                       returnUrl = encodeURIComponent(returnUrl);
-               }
-
-               var decodeReturnUrl = decodeURIComponent(returnUrl);
-               var editPageId = TYPO3.Utility.getParameterFromUrl(decodeReturnUrl, 'id');
-               if (parseInt(editPageId, 10) !== parseInt(node.attributes.nodeData.id, 10)) {
-                       returnUrl = encodeURIComponent(TYPO3.Utility.updateQueryStringParameter(decodeReturnUrl, 'id', node.attributes.nodeData.id));
-               }
-
-               TYPO3.Backend.ContentContainer.setUrl(
-                       TYPO3.settings.FormEngine.moduleUrl + '&edit[pages][' + node.attributes.nodeData.id + ']=edit&returnUrl=' + returnUrl
-               ).then(
-                       node.select
-               );
-       },
-
-       /**
-        * Opens the new page wizard
-        *
-        * @param {Ext.tree.TreeNode} node
-        * @return {void}
-        */
-       newPageWizard: function(node) {
-               TYPO3.Backend.ContentContainer.setUrl(
-                       TYPO3.settings.NewRecord.moduleUrl + '&id=' + node.attributes.nodeData.id + '&pagesOnly=1'
-               ).then(
-                       node.select
-               );
-       },
-
-       /**
-        * Opens the info popup
-        *
-        * @param {Ext.tree.TreeNode} node
-        * @return {void}
-        */
-       openInfoPopUp: function(node) {
-               launchView('pages', node.attributes.nodeData.id);
-       },
-
-       /**
-        * Opens the history popup
-        *
-        * @param {Ext.tree.TreeNode} node
-        * @return {void}
-        */
-       openHistoryPopUp: function(node) {
-               TYPO3.Backend.ContentContainer.setUrl(
-                       TYPO3.settings.RecordHistory.moduleUrl + '&element=pages:' + node.attributes.nodeData.id
-               ).then(
-                       node.select
-               );
-       },
-
-       /**
-        * Opens the export .t3d file dialog
-        *
-        * @param {Ext.tree.TreeNode} node
-        * @return {void}
-        */
-       exportT3d: function(node) {
-               TYPO3.Backend.ContentContainer.setUrl(
-                       TYPO3.settings.ImportExport.moduleUrl +
-                       '&tx_impexp[action]=export&' +
-                       'id=0&tx_impexp[pagetree][id]=' + node.attributes.nodeData.id +
-                       '&tx_impexp[pagetree][levels]=0' +
-                       '&tx_impexp[pagetree][tables][]=_ALL'
-               ).then(
-                       node.select
-               );
-       },
-
-       /**
-        * Opens the import .t3d file dialog
-        *
-        * @param {Ext.tree.TreeNode} node
-        * @return {void}
-        */
-       importT3d: function(node) {
-               TYPO3.Backend.ContentContainer.setUrl(
-                       TYPO3.settings.ImportExport.moduleUrl +
-                       '&id=' + node.attributes.nodeData.id +
-                       '&table=pages&tx_impexp[action]=import'
-               ).then(
-                       node.select
-               );
-       },
-
-       /**
-        * Enables the cut mode of a node
-        *
-        * @param {Ext.tree.TreeNode} node
-        * @param {TYPO3.Components.PageTree.Tree} tree
-        * @return {void}
-        */
-       enableCutMode: function(node, tree) {
-               this.disableCopyMode(node, tree);
-               node.attributes.nodeData.t3InCutMode = true;
-               tree.t3ContextInfo.inCutMode = true;
-               tree.t3ContextNode = node;
-       },
-
-       /**
-        * Disables the cut mode of a node
-        *
-        * @param {Ext.tree.TreeNode} node
-        * @param {TYPO3.Components.PageTree.Tree} tree
-        * @return {void}
-        */
-       disableCutMode: function(node, tree) {
-               this.releaseCutAndCopyModes(tree);
-               node.attributes.nodeData.t3InCutMode = false;
-       },
-
-       /**
-        * Enables the copy mode of a node
-        *
-        * @param {Ext.tree.TreeNode} node
-        * @param {TYPO3.Components.PageTree.Tree} tree
-        * @return {void}
-        */
-       enableCopyMode: function(node, tree) {
-               this.disableCutMode(node, tree);
-               node.attributes.nodeData.t3InCopyMode = true;
-               tree.t3ContextInfo.inCopyMode = true;
-               tree.t3ContextNode = node;
-       },
-
-       /**
-        * Disables the copy mode of a node
-        *
-        * @param {Ext.tree.TreeNode} node
-        * @param {TYPO3.Components.PageTree.Tree} tree
-        * @return {void}
-        */
-       disableCopyMode: function(node, tree) {
-               this.releaseCutAndCopyModes(tree);
-               node.attributes.nodeData.t3InCopyMode = false;
-       },
-
-       /**
-        * Pastes the cut/copy context node into the given node
-        *
-        * @param {Ext.tree.TreeNode} node
-        * @param {TYPO3.Components.PageTree.Tree} tree
-        * @return {void}
-        */
-       pasteIntoNode: function(node, tree) {
-               if (!tree.t3ContextNode) {
-                       return;
-               }
-
-               if (tree.t3ContextInfo.inCopyMode) {
-                                // This is hard stuff to do. So increase the timeout for the AJAX request
-                       Ext.Ajax.timeout = 3600000;
 
-                       var newNode = tree.t3ContextNode = new Ext.tree.TreeNode(tree.t3ContextNode.attributes);
-                       newNode.id = 'fakeNode';
-                       node.insertBefore(newNode, node.childNodes[0]);
-                       node.attributes.nodeData.t3InCopyMode = false;
-                       this.copyNodeToFirstChildOfDestination(newNode, tree);
+                                       TYPO3.Components.PageTree.Configuration.temporaryMountPoint = response;
+                                       Ext.getCmp('typo3-pagetree-tree').app.addTemporaryMountPointIndicator();
+
+                                       var selectedNode = Ext.getCmp('typo3-pagetree-tree').app.getSelected();
+                                       tree.stateId = 'Pagetree' + TYPO3.Components.PageTree.Configuration.temporaryMountPoint;
+                                       tree.refreshTree(function () {
+                                               var nodeIsSelected = false;
+                                               if (selectedNode) {
+                                                       nodeIsSelected = TYPO3.Backend.NavigationContainer.PageTree.select(
+                                                               selectedNode.attributes.nodeData.id
+                                                       );
+                                               }
+
+                                               var node = (nodeIsSelected ? TYPO3.Backend.NavigationContainer.PageTree.getSelected() : null);
+                                               if (node) {
+                                                       this.singleClick(node, tree);
+                                               } else {
+                                                       this.singleClick(tree.getRootNode().firstChild, tree);
+                                               }
+                                       }, this);
+                               },
+                               this
+                       );
+               },
+
+               /**
+                * Opens the edit page properties dialog
+                *
+                * @param {Ext.tree.TreeNode} node
+                * @return {void}
+                */
+               editPageProperties: function (node) {
+                       var returnUrl = TYPO3.Backend.ContentContainer.getUrl();
+                       if (returnUrl.indexOf('returnUrl') !== -1) {
+                               returnUrl = Utility.getParameterFromUrl(returnUrl, 'returnUrl');
+                       } else {
+                               returnUrl = encodeURIComponent(returnUrl);
+                       }
 
-               } else if (tree.t3ContextInfo.inCutMode) {
-                       if (node.getPath().indexOf(tree.t3ContextNode.id) !== -1) {
-                               return;
+                       var decodeReturnUrl = decodeURIComponent(returnUrl);
+                       var editPageId = Utility.getParameterFromUrl(decodeReturnUrl, 'id');
+                       if (parseInt(editPageId, 10) !== parseInt(node.attributes.nodeData.id, 10)) {
+                               returnUrl = encodeURIComponent(Utility.updateQueryStringParameter(decodeReturnUrl, 'id', node.attributes.nodeData.id));
                        }
 
-                       node.appendChild(tree.t3ContextNode);
+                       TYPO3.Backend.ContentContainer.setUrl(
+                               TYPO3.settings.FormEngine.moduleUrl + '&edit[pages][' + node.attributes.nodeData.id + ']=edit&returnUrl=' + returnUrl
+                       ).then(
+                               node.select
+                       );
+               },
+
+               /**
+                * Opens the new page wizard
+                *
+                * @param {Ext.tree.TreeNode} node
+                * @return {void}
+                */
+               newPageWizard: function (node) {
+                       TYPO3.Backend.ContentContainer.setUrl(
+                               TYPO3.settings.NewRecord.moduleUrl + '&id=' + node.attributes.nodeData.id + '&pagesOnly=1'
+                       ).then(
+                               node.select
+                       );
+               },
+
+               /**
+                * Opens the info popup
+                *
+                * @param {Ext.tree.TreeNode} node
+                * @return {void}
+                */
+               openInfoPopUp: function (node) {
+                       launchView('pages', node.attributes.nodeData.id);
+               },
+
+               /**
+                * Opens the history popup
+                *
+                * @param {Ext.tree.TreeNode} node
+                * @return {void}
+                */
+               openHistoryPopUp: function (node) {
+                       TYPO3.Backend.ContentContainer.setUrl(
+                               TYPO3.settings.RecordHistory.moduleUrl + '&element=pages:' + node.attributes.nodeData.id
+                       ).then(
+                               node.select
+                       );
+               },
+
+               /**
+                * Opens the export .t3d file dialog
+                *
+                * @param {Ext.tree.TreeNode} node
+                * @return {void}
+                */
+               exportT3d: function (node) {
+                       TYPO3.Backend.ContentContainer.setUrl(
+                               TYPO3.settings.ImportExport.moduleUrl +
+                               '&tx_impexp[action]=export&' +
+                               'id=0&tx_impexp[pagetree][id]=' + node.attributes.nodeData.id +
+                               '&tx_impexp[pagetree][levels]=0' +
+                               '&tx_impexp[pagetree][tables][]=_ALL'
+                       ).then(
+                               node.select
+                       );
+               },
+
+               /**
+                * Opens the import .t3d file dialog
+                *
+                * @param {Ext.tree.TreeNode} node
+                * @return {void}
+                */
+               importT3d: function (node) {
+                       TYPO3.Backend.ContentContainer.setUrl(
+                               TYPO3.settings.ImportExport.moduleUrl +
+                               '&id=' + node.attributes.nodeData.id +
+                               '&table=pages&tx_impexp[action]=import'
+                       ).then(
+                               node.select
+                       );
+               },
+
+               /**
+                * Enables the cut mode of a node
+                *
+                * @param {Ext.tree.TreeNode} node
+                * @param {TYPO3.Components.PageTree.Tree} tree
+                * @return {void}
+                */
+               enableCutMode: function (node, tree) {
+                       this.disableCopyMode(node, tree);
+                       node.attributes.nodeData.t3InCutMode = true;
+                       tree.t3ContextInfo.inCutMode = true;
+                       tree.t3ContextNode = node;
+               },
+
+               /**
+                * Disables the cut mode of a node
+                *
+                * @param {Ext.tree.TreeNode} node
+                * @param {TYPO3.Components.PageTree.Tree} tree
+                * @return {void}
+                */
+               disableCutMode: function (node, tree) {
+                       this.releaseCutAndCopyModes(tree);
                        node.attributes.nodeData.t3InCutMode = false;
-                       this.moveNodeToFirstChildOfDestination(node, tree);
-               }
-       },
-
-       /**
-        * Pastes a cut/copy context node after the given node
-        *
-        * @param {Ext.tree.TreeNode} node
-        * @param {TYPO3.Components.PageTree.Tree} tree
-        * @return {void}
-        */
-       pasteAfterNode: function(node, tree) {
-               if (!tree.t3ContextNode) {
-                       return;
-               }
-
-               if (tree.t3ContextInfo.inCopyMode) {
-                               // This is hard stuff to do. So increase the timeout for the AJAX request
-                       Ext.Ajax.timeout = 3600000;
-
-                       var newNode = tree.t3ContextNode = new Ext.tree.TreeNode(tree.t3ContextNode.attributes);
-                       newNode.id = 'fakeNode';
-                       node.parentNode.insertBefore(newNode, node.nextSibling);
+               },
+
+               /**
+                * Enables the copy mode of a node
+                *
+                * @param {Ext.tree.TreeNode} node
+                * @param {TYPO3.Components.PageTree.Tree} tree
+                * @return {void}
+                */
+               enableCopyMode: function (node, tree) {
+                       this.disableCutMode(node, tree);
+                       node.attributes.nodeData.t3InCopyMode = true;
+                       tree.t3ContextInfo.inCopyMode = true;
+                       tree.t3ContextNode = node;
+               },
+
+               /**
+                * Disables the copy mode of a node
+                *
+                * @param {Ext.tree.TreeNode} node
+                * @param {TYPO3.Components.PageTree.Tree} tree
+                * @return {void}
+                */
+               disableCopyMode: function (node, tree) {
+                       this.releaseCutAndCopyModes(tree);
                        node.attributes.nodeData.t3InCopyMode = false;
-                       this.copyNodeAfterDestination(newNode, tree);
-
-               } else if (tree.t3ContextInfo.inCutMode) {
-                       if (node.getPath().indexOf(tree.t3ContextNode.id) !== -1) {
+               },
+
+               /**
+                * Pastes the cut/copy context node into the given node
+                *
+                * @param {Ext.tree.TreeNode} node
+                * @param {TYPO3.Components.PageTree.Tree} tree
+                * @return {void}
+                */
+               pasteIntoNode: function (node, tree) {
+                       if (!tree.t3ContextNode) {
                                return;
                        }
 
-                       node.parentNode.insertBefore(tree.t3ContextNode, node.nextSibling);
-                       node.attributes.nodeData.t3InCutMode = false;
-                       this.moveNodeAfterDestination(node, tree);
-               }
-       },
+                       if (tree.t3ContextInfo.inCopyMode) {
+                               // This is hard stuff to do. So increase the timeout for the AJAX request
+                               Ext.Ajax.timeout = 3600000;
 
-       /**
-        * Moves the current tree context node after the given node
-        *
-        * @param {Ext.tree.TreeNode} node
-        * @param {TYPO3.Components.PageTree.Tree} tree
-        * @return {void}
-        */
-       moveNodeAfterDestination: function(node, tree) {
-               TYPO3.Components.PageTree.Commands.moveNodeAfterDestination(
-                       tree.t3ContextNode.attributes.nodeData,
-                       node.attributes.nodeData.id,
-                       function(response) {
-                               if (this.evaluateResponse(response) && tree.t3ContextNode) {
-                                       this.updateNode(tree.t3ContextNode, tree.t3ContextNode.isExpanded(), response);
-                               }
-                               this.releaseCutAndCopyModes(tree);
-                       },
-                       this
-               );
-       },
+                               var newNode = tree.t3ContextNode = new Ext.tree.TreeNode(tree.t3ContextNode.attributes);
+                               newNode.id = 'fakeNode';
+                               node.insertBefore(newNode, node.childNodes[0]);
+                               node.attributes.nodeData.t3InCopyMode = false;
+                               this.copyNodeToFirstChildOfDestination(newNode, tree);
 
-       /**
-        * Moves the current tree context node as the first child of the given node
-        *
-        * @param {Ext.tree.TreeNode} node
-        * @param {TYPO3.Components.PageTree.Tree} tree
-        * @return {void}
-        */
-       moveNodeToFirstChildOfDestination: function(node, tree) {
-               TYPO3.Components.PageTree.Commands.moveNodeToFirstChildOfDestination(
-                       tree.t3ContextNode.attributes.nodeData,
-                       node.attributes.nodeData.id,
-                       function(response) {
-                               if (this.evaluateResponse(response) && tree.t3ContextNode) {
-                                       this.updateNode(tree.t3ContextNode, tree.t3ContextNode.isExpanded(), response);
+                       } else if (tree.t3ContextInfo.inCutMode) {
+                               if (node.getPath().indexOf(tree.t3ContextNode.id) !== -1) {
+                                       return;
                                }
-                               this.releaseCutAndCopyModes(tree);
-                       },
-                       this
-               );
-       },
 
-       /**
-        * Inserts a new node after the given node
-        *
-        * @param {Ext.tree.TreeNode} node
-        * @param {TYPO3.Components.PageTree.Tree} tree
-        * @return {void}
-        */
-       insertNodeAfterDestination: function(node, tree) {
-               TYPO3.Components.PageTree.Commands.insertNodeAfterDestination(
-                       tree.t3ContextNode.attributes.nodeData,
-                       node.previousSibling.attributes.nodeData.id,
-                       tree.t3ContextInfo.serverNodeType,
-                       function(response) {
-                               if (this.evaluateResponse(response)) {
-                                       this.updateNode(node, node.isExpanded(), response, function(node) {
-                                               tree.triggerEdit(node);
-                                       });
-                               }
-                               this.releaseCutAndCopyModes(tree);
-                       },
-                       this
-               );
-       },
+                               node.appendChild(tree.t3ContextNode);
+                               node.attributes.nodeData.t3InCutMode = false;
+                               this.moveNodeToFirstChildOfDestination(node, tree);
+                       }
+               },
+
+               /**
+                * Pastes a cut/copy context node after the given node
+                *
+                * @param {Ext.tree.TreeNode} node
+                * @param {TYPO3.Components.PageTree.Tree} tree
+                * @return {void}
+                */
+               pasteAfterNode: function (node, tree) {
+                       if (!tree.t3ContextNode) {
+                               return;
+                       }
 
-       /**
-        * Inserts a new node as the first child of the given node
-        *
-        * @param {Ext.tree.TreeNode} node
-        * @param {TYPO3.Components.PageTree.Tree} tree
-        * @return {void}
-        */
-       insertNodeToFirstChildOfDestination: function(node, tree) {
-               TYPO3.Components.PageTree.Commands.insertNodeToFirstChildOfDestination(
-                       tree.t3ContextNode.attributes.nodeData,
-                       tree.t3ContextInfo.serverNodeType,
-                       function(response) {
-                               if (this.evaluateResponse(response)) {
-                                       this.updateNode(node, true, response, function(node) {
-                                               tree.triggerEdit(node);
-                                       });
-                               }
-                               this.releaseCutAndCopyModes(tree);
-                       },
-                       this
-               );
-       },
+                       if (tree.t3ContextInfo.inCopyMode) {
+                               // This is hard stuff to do. So increase the timeout for the AJAX request
+                               Ext.Ajax.timeout = 3600000;
 
-       /**
-        * Copies the current tree context node after the given node
-        *
-        * @param {Ext.tree.TreeNode} node
-        * @param {TYPO3.Components.PageTree.Tree} tree
-        * @return {void}
-        */
-       copyNodeAfterDestination: function(node, tree) {
-               TYPO3.Components.PageTree.Commands.copyNodeAfterDestination(
-                       tree.t3ContextNode.attributes.nodeData,
-                       node.previousSibling.attributes.nodeData.id,
-                       function(response) {
-                               if (this.evaluateResponse(response)) {
-                                       this.updateNode(node, true, response, function(node) {
-                                               tree.triggerEdit(node);
-                                       });
-                               }
-                               this.releaseCutAndCopyModes(tree);
-                       },
-                       this
-               );
-       },
+                               var newNode = tree.t3ContextNode = new Ext.tree.TreeNode(tree.t3ContextNode.attributes);
+                               newNode.id = 'fakeNode';
+                               node.parentNode.insertBefore(newNode, node.nextSibling);
+                               node.attributes.nodeData.t3InCopyMode = false;
+                               this.copyNodeAfterDestination(newNode, tree);
 
-       /**
-        * Copies the current tree context node as the first child of the given node
-        *
-        * @param {Ext.tree.TreeNode} node
-        * @param {TYPO3.Components.PageTree.Tree} tree
-        * @return {void}
-        */
-       copyNodeToFirstChildOfDestination: function(node, tree) {
-               TYPO3.Components.PageTree.Commands.copyNodeToFirstChildOfDestination(
-                       tree.t3ContextNode.attributes.nodeData,
-                       node.parentNode.attributes.nodeData.id,
-                       function(response) {
-                               if (this.evaluateResponse(response)) {
-                                       this.updateNode(node, true, response, function(node) {
-                                               tree.triggerEdit(node);
-                                       });
+                       } else if (tree.t3ContextInfo.inCutMode) {
+                               if (node.getPath().indexOf(tree.t3ContextNode.id) !== -1) {
+                                       return;
                                }
-                               this.releaseCutAndCopyModes(tree);
-                       },
-                       this
-               );
-       },
 
-       /**
-        * Visibilizes a page
-        *
-        * @param {Ext.tree.TreeNode} node
-        * @return {void}
-        */
-       enablePage: function(node) {
-               TYPO3.Components.PageTree.Commands.visiblyNode(
-                       node.attributes.nodeData,
-                       function(response) {
-                               if (this.evaluateResponse(response)) {
-                                       this.updateNode(node, node.isExpanded(), response);
-                               }
-                       },
-                       this
-               );
-       },
+                               node.parentNode.insertBefore(tree.t3ContextNode, node.nextSibling);
+                               node.attributes.nodeData.t3InCutMode = false;
+                               this.moveNodeAfterDestination(node, tree);
+                       }
+               },
+
+               /**
+                * Moves the current tree context node after the given node
+                *
+                * @param {Ext.tree.TreeNode} node
+                * @param {TYPO3.Components.PageTree.Tree} tree
+                * @return {void}
+                */
+               moveNodeAfterDestination: function (node, tree) {
+                       TYPO3.Components.PageTree.Commands.moveNodeAfterDestination(
+                               tree.t3ContextNode.attributes.nodeData,
+                               node.attributes.nodeData.id,
+                               function (response) {
+                                       if (this.evaluateResponse(response) && tree.t3ContextNode) {
+                                               this.updateNode(tree.t3ContextNode, tree.t3ContextNode.isExpanded(), response);
+                                       }
+                                       this.releaseCutAndCopyModes(tree);
+                               },
+                               this
+                       );
+               },
+
+               /**
+                * Moves the current tree context node as the first child of the given node
+                *
+                * @param {Ext.tree.TreeNode} node
+                * @param {TYPO3.Components.PageTree.Tree} tree
+                * @return {void}
+                */
+               moveNodeToFirstChildOfDestination: function (node, tree) {
+                       TYPO3.Components.PageTree.Commands.moveNodeToFirstChildOfDestination(
+                               tree.t3ContextNode.attributes.nodeData,
+                               node.attributes.nodeData.id,
+                               function (response) {
+                                       if (this.evaluateResponse(response) && tree.t3ContextNode) {
+                                               this.updateNode(tree.t3ContextNode, tree.t3ContextNode.isExpanded(), response);
+                                       }
+                                       this.releaseCutAndCopyModes(tree);
+                               },
+                               this
+                       );
+               },
+
+               /**
+                * Inserts a new node after the given node
+                *
+                * @param {Ext.tree.TreeNode} node
+                * @param {TYPO3.Components.PageTree.Tree} tree
+                * @return {void}
+                */
+               insertNodeAfterDestination: function (node, tree) {
+                       TYPO3.Components.PageTree.Commands.insertNodeAfterDestination(
+                               tree.t3ContextNode.attributes.nodeData,
+                               node.previousSibling.attributes.nodeData.id,
+                               tree.t3ContextInfo.serverNodeType,
+                               function (response) {
+                                       if (this.evaluateResponse(response)) {
+                                               this.updateNode(node, node.isExpanded(), response, function (node) {
+                                                       tree.triggerEdit(node);
+                                               });
+                                       }
+                                       this.releaseCutAndCopyModes(tree);
+                               },
+                               this
+                       );
+               },
+
+               /**
+                * Inserts a new node as the first child of the given node
+                *
+                * @param {Ext.tree.TreeNode} node
+                * @param {TYPO3.Components.PageTree.Tree} tree
+                * @return {void}
+                */
+               insertNodeToFirstChildOfDestination: function (node, tree) {
+                       TYPO3.Components.PageTree.Commands.insertNodeToFirstChildOfDestination(
+                               tree.t3ContextNode.attributes.nodeData,
+                               tree.t3ContextInfo.serverNodeType,
+                               function (response) {
+                                       if (this.evaluateResponse(response)) {
+                                               this.updateNode(node, true, response, function (node) {
+                                                       tree.triggerEdit(node);
+                                               });
+                                       }
+                                       this.releaseCutAndCopyModes(tree);
+                               },
+                               this
+                       );
+               },
+
+               /**
+                * Copies the current tree context node after the given node
+                *
+                * @param {Ext.tree.TreeNode} node
+                * @param {TYPO3.Components.PageTree.Tree} tree
+                * @return {void}
+                */
+               copyNodeAfterDestination: function (node, tree) {
+                       TYPO3.Components.PageTree.Commands.copyNodeAfterDestination(
+                               tree.t3ContextNode.attributes.nodeData,
+                               node.previousSibling.attributes.nodeData.id,
+                               function (response) {
+                                       if (this.evaluateResponse(response)) {
+                                               this.updateNode(node, true, response, function (node) {
+                                                       tree.triggerEdit(node);
+                                               });
+                                       }
+                                       this.releaseCutAndCopyModes(tree);
+                               },
+                               this
+                       );
+               },
+
+               /**
+                * Copies the current tree context node as the first child of the given node
+                *
+                * @param {Ext.tree.TreeNode} node
+                * @param {TYPO3.Components.PageTree.Tree} tree
+                * @return {void}
+                */
+               copyNodeToFirstChildOfDestination: function (node, tree) {
+                       TYPO3.Components.PageTree.Commands.copyNodeToFirstChildOfDestination(
+                               tree.t3ContextNode.attributes.nodeData,
+                               node.parentNode.attributes.nodeData.id,
+                               function (response) {
+                                       if (this.evaluateResponse(response)) {
+                                               this.updateNode(node, true, response, function (node) {
+                                                       tree.triggerEdit(node);
+                                               });
+                                       }
+                                       this.releaseCutAndCopyModes(tree);
+                               },
+                               this
+                       );
+               },
+
+               /**
+                * Visibilizes a page
+                *
+                * @param {Ext.tree.TreeNode} node
+                * @return {void}
+                */
+               enablePage: function (node) {
+                       TYPO3.Components.PageTree.Commands.visiblyNode(
+                               node.attributes.nodeData,
+                               function (response) {
+                                       if (this.evaluateResponse(response)) {
+                                               this.updateNode(node, node.isExpanded(), response);
+                                       }
+                               },
+                               this
+                       );
+               },
+
+               /**
+                * Disables a page
+                *
+                * @param {Ext.tree.TreeNode} node
+                * @return {void}
+                */
+               disablePage: function (node) {
+                       TYPO3.Components.PageTree.Commands.disableNode(
+                               node.attributes.nodeData,
+                               function (response) {
+                                       if (this.evaluateResponse(response)) {
+                                               this.updateNode(node, node.isExpanded(), response);
+                                       }
+                               },
+                               this
+                       );
+               },
+
+               /**
+                * Clear cache of a page
+                *
+                * @param {Ext.tree.TreeNode} node
+                * @return {void}
+                */
+               clearCacheOfPage: function (node) {
+                       TYPO3.Components.PageTree.Commands.clearCacheOfPage(
+                               node.attributes.nodeData
+                       );
+               },
+
+               /**
+                * Reloads the content frame with the current module and node id
+                *
+                * @param {Ext.tree.TreeNode} node
+                * @param {TYPO3.Components.PageTree.Tree} tree
+                * @return {void}
+                */
+               singleClick: function (node, tree) {
+                       var separator = '?';
+                       if (currentSubScript.indexOf('?') !== -1) {
+                               separator = '&';
+                       }
 
-       /**
-        * Disables a page
-        *
-        * @param {Ext.tree.TreeNode} node
-        * @return {void}
-        */
-       disablePage: function(node) {
-               TYPO3.Components.PageTree.Commands.disableNode(
-                       node.attributes.nodeData,
-                       function(response) {
-                               if (this.evaluateResponse(response)) {
-                                       this.updateNode(node, node.isExpanded(), response);
+                       TYPO3.Backend.ContentContainer.setUrl(
+                               currentSubScript + separator + 'id=' + node.attributes.nodeData.id
+                       ).then(function () {
+                               node.select();
+                               tree.currentSelectedNode = node;
+                               if (tree.stateHash) {
+                                       tree.stateHash.lastSelectedNode = node.id;
                                }
-                       },
-                       this
-               );
-       },
-
-       /**
-        * Clear cache of a page
-        *
-        * @param {Ext.tree.TreeNode} node
-        * @return {void}
-        */
-       clearCacheOfPage: function(node) {
-               TYPO3.Components.PageTree.Commands.clearCacheOfPage(
-                       node.attributes.nodeData
-               );
-       },
-
-       /**
-        * Reloads the content frame with the current module and node id
-        *
-        * @param {Ext.tree.TreeNode} node
-        * @param {TYPO3.Components.PageTree.Tree} tree
-        * @return {void}
-        */
-       singleClick: function(node, tree) {
-               var separator = '?';
-               if (currentSubScript.indexOf('?') !== -1) {
-                       separator = '&';
-               }
-
-               TYPO3.Backend.ContentContainer.setUrl(
-                       currentSubScript + separator + 'id=' + node.attributes.nodeData.id
-               ).then(function() {
-                       node.select();
-                       tree.currentSelectedNode = node;
-                       if (tree.stateHash) {
-                               tree.stateHash.lastSelectedNode = node.id;
+                               fsMod.recentIds['web'] = node.attributes.nodeData.id;
+                               fsMod.recentIds['system'] = node.attributes.nodeData.id;
+                       });
+               },
+
+               /**
+                * Opens a configured url inside the content frame
+                *
+                * @param {Ext.tree.TreeNode} node
+                * @param {TYPO3.Components.PageTree.Tree} tree
+                * @param {Object} contextItem
+                * @return {void}
+                */
+               openCustomUrlInContentFrame: function (node, tree, contextItem) {
+                       if (!contextItem.customAttributes || !contextItem.customAttributes.contentUrl) {
+                               return;
                        }
-                       fsMod.recentIds['web'] = node.attributes.nodeData.id;
-                       fsMod.recentIds['system'] = node.attributes.nodeData.id;
-               });
-       },
-
-       /**
-        * Opens a configured url inside the content frame
-        *
-        * @param {Ext.tree.TreeNode} node
-        * @param {TYPO3.Components.PageTree.Tree} tree
-        * @param {Object} contextItem
-        * @return {void}
-        */
-       openCustomUrlInContentFrame: function(node, tree, contextItem) {
-               if (!contextItem.customAttributes || !contextItem.customAttributes.contentUrl) {
-                       return;
-               }
-
-               var nodeId = node.attributes.nodeData.id,
-                       idPattern = '###ID###';
-               TYPO3.Backend.ContentContainer.setUrl(
-                       contextItem.customAttributes.contentUrl
-                               .replace(idPattern, nodeId)
-                               .replace(encodeURIComponent(idPattern), nodeId)
-               ).then(
-                       node.select
-               );
-       },
 
-       /**
-        * Updates the title of a node
-        *
-        * @param {String} newText
-        * @param {String} oldText
-        * @param {TYPO3.Components.PageTree.TreeEditor} treeEditor
-        * @return {void}
-        */
-       saveTitle: function(newText, oldText, treeEditor) {
-               // Save current editNode in case treeEditor.editNode changes before the ajax call completes
-               var editedNode = treeEditor.editNode;
-
-               if (newText === oldText || newText == '') {
-                       treeEditor.updateNodeText(
-                               editedNode,
-                               editedNode.attributes.nodeData.editableText,
-                               Ext.util.Format.htmlEncode(oldText)
+                       var nodeId = node.attributes.nodeData.id,
+                               idPattern = '###ID###';
+                       TYPO3.Backend.ContentContainer.setUrl(
+                               contextItem.customAttributes.contentUrl
+                                       .replace(idPattern, nodeId)
+                                       .replace(encodeURIComponent(idPattern), nodeId)
+                       ).then(
+                               node.select
                        );
-                       return;
-               }
+               },
+
+               /**
+                * Updates the title of a node
+                *
+                * @param {String} newText
+                * @param {String} oldText
+                * @param {TYPO3.Components.PageTree.TreeEditor} treeEditor
+                * @return {void}
+                */
+               saveTitle: function (newText, oldText, treeEditor) {
+                       // Save current editNode in case treeEditor.editNode changes before the ajax call completes
+                       var editedNode = treeEditor.editNode;
+
+                       if (newText === oldText || newText == '') {
+                               treeEditor.updateNodeText(
+                                       editedNode,
+                                       editedNode.attributes.nodeData.editableText,
+                                       Ext.util.Format.htmlEncode(oldText)
+                               );
+                               return;
+                       }
 
-               TYPO3.Components.PageTree.Commands.updateLabel(
-                       editedNode.attributes.nodeData,
-                       newText,
-                       function(response) {
-                               if (this.evaluateResponse(response)) {
-                                       treeEditor.updateNodeText(editedNode, response.editableText, response.updatedText);
-                               } else {
-                                       treeEditor.updateNodeText(
-                                               editedNode,
-                                               editedNode.attributes.nodeData.editableText,
-                                               Ext.util.Format.htmlEncode(oldText)
-                                       );
-                               }
-                               var currentTree = treeEditor.editNode.getOwnerTree();
-                               if (currentTree.currentSelectedNode !== null) {
-                                       if (currentTree.currentSelectedNode.id === treeEditor.editNode.id) {
-                                               this.singleClick(treeEditor.editNode, treeEditor.editNode.ownerTree, currentTree);
+                       TYPO3.Components.PageTree.Commands.updateLabel(
+                               editedNode.attributes.nodeData,
+                               newText,
+                               function (response) {
+                                       if (this.evaluateResponse(response)) {
+                                               treeEditor.updateNodeText(editedNode, response.editableText, response.updatedText);
+                                       } else {
+                                               treeEditor.updateNodeText(
+                                                       editedNode,
+                                                       editedNode.attributes.nodeData.editableText,
+                                                       Ext.util.Format.htmlEncode(oldText)
+                                               );
                                        }
-                                       currentTree.currentSelectedNode.select();
-                               }
-                       },
-                       this
-               );
-       }
-};
+                                       var currentTree = treeEditor.editNode.getOwnerTree();
+                                       if (currentTree.currentSelectedNode !== null) {
+                                               if (currentTree.currentSelectedNode.id === treeEditor.editNode.id) {
+                                                       this.singleClick(treeEditor.editNode, treeEditor.editNode.ownerTree, currentTree);
+                                               }
+                                               currentTree.currentSelectedNode.select();
+                                       }
+                               },
+                               this
+                       );
+               }
+       };
+});
index c370693..0d1a122 100644 (file)
  */
 Ext.namespace('TYPO3.Components.PageTree');
 
-/**
- * @class TYPO3.Components.PageTree.TopPanel
- *
- * Top Panel
- *
- * @namespace TYPO3.Components.PageTree
- * @extends Ext.Panel
- */
-TYPO3.Components.PageTree.TopPanel = Ext.extend(Ext.Panel, {
-       /**
-        * Component Id
-        *
-        * @type {String}
-        */
-       id: 'typo3-pagetree-topPanel',
-
-       /**
-        * Component Class
-        *
-        * @type {String}
-        */
-       cls: 'typo3-pagetree-toppanel',
-
-       /**
-        * Border
-        *
-        * @type {Boolean}
-        */
-       border: true,
-
-       /**
-        * Toolbar Object
-        *
-        * @type {Ext.Toolbar}
-        */
-       tbar: new Ext.Toolbar(),
-
-       /**
-        * Currently Clicked Toolbar Button
-        *
-        * @type {Ext.Button}
-        */
-       currentlyClickedButton: null,
-
-       /**
-        * Currently Shown Panel
-        *
-        * @type {Ext.Component}
-        */
-       currentlyShownPanel: null,
-
-       /**
-        * Filtering Indicator Item
-        *
-        * @type {Ext.Panel}
-        */
-       filteringIndicator: null,
-
-       /**
-        * Drag and Drop Group
-        *
-        * @cfg {String}
-        */
-       ddGroup: '',
-
-       /**
-        * Data Provider
-        *
-        * @cfg {Object}
-        */
-       dataProvider: null,
-
-       /**
-        * Filtering Tree
-        *
-        * @cfg {TYPO3.Components.PageTree.FilteringTree}
-        */
-       filteringTree: null,
-
-       /**
-        * Page Tree
-        *
-        * @cfg {TYPO3.Components.PageTree.Tree}
-        */
-       tree: null,
-
-       /**
-        * Application Panel
-        *
-        * @cfg {TYPO3.Components.PageTree.App}
-        */
-       app: null,
-
-       /**
-        * Initializes the component
-        *
-        * @return {void}
-        */
-       initComponent: function() {
-               this.currentlyShownPanel = new Ext.Panel({
-                       id: this.id + '-defaultPanel',
-                       cls: this.id + '-item typo3-pagetree-toppanel-item',
-                       border: false
-               });
-               this.items = [this.currentlyShownPanel];
-
-               TYPO3.Components.PageTree.TopPanel.superclass.initComponent.apply(this, arguments);
-
-               this.addDragDropNodeInsertionFeature();
-
-               if (!TYPO3.Components.PageTree.Configuration.hideFilter
-                       || TYPO3.Components.PageTree.Configuration.hideFilter === '0'
-               ) {
-                       this.addFilterFeature();
-               }
-
-               this.getTopToolbar().addItem({xtype: 'tbfill'});
-               this.addRefreshTreeFeature();
-       },
-
-       /**
-        * Returns a custom button template to fix some nasty webkit issues
-        * by removing some useless wrapping html code
-        *
-        * @return {void}
-        */
-       getButtonTemplate: function() {
-               return new Ext.Template(
-                       '<div id="{4}" class="x-btn {3}"><button type="{0}">&nbsp;</button></div>'
-               );
-       },
-
-       /**
-        * Adds a button to the components toolbar with a related component
-        *
-        * @param {Object} button
-        * @param {Object} connectedWidget
-        * @return {void}
-        */
-       addButton: function(button, connectedWidget) {
-               button.template = this.getButtonTemplate();
-               button.on('toggle', this.topbarButtonToggleCallback);
-               if (!button.hasListener('click')) {
-                       button.on('click', this.topbarButtonCallback);
-               }
-
-               if (connectedWidget) {
-                       connectedWidget.hidden = true;
-                       button.connectedWidget = connectedWidget;
-                       this.add(connectedWidget);
-               }
-
-               this.getTopToolbar().addItem(button);
-               this.doLayout();
-       },
+require(['TYPO3/CMS/Backend/Utility'], function(Utility) {
 
        /**
-        * Toggle button state
+        * @class TYPO3.Components.PageTree.TopPanel
         *
-        * @return {void}
-        */
-       topbarButtonToggleCallback: function() {
-               if (this.pressed) {
-                       this.el.addClass(['active']);
-               } else {
-                       this.el.removeClass(['active']);
-               }
-       },
-
-       /**
-        * Usual button callback method that triggers the assigned component of the
-        * clicked toolbar button
+        * Top Panel
         *
-        * @return {void}
+        * @namespace TYPO3.Components.PageTree
+        * @extends Ext.Panel
         */
-       topbarButtonCallback: function() {
-               var topPanel = this.ownerCt.ownerCt;
+       TYPO3.Components.PageTree.TopPanel = Ext.extend(Ext.Panel, {
+               /**
+                * Component Id
+                *
+                * @type {String}
+                */
+               id: 'typo3-pagetree-topPanel',
+
+               /**
+                * Component Class
+                *
+                * @type {String}
+                */
+               cls: 'typo3-pagetree-toppanel',
+
+               /**
+                * Border
+                *
+                * @type {Boolean}
+                */
+               border: true,
+
+               /**
+                * Toolbar Object
+                *
+                * @type {Ext.Toolbar}
+                */
+               tbar: new Ext.Toolbar(),
+
+               /**
+                * Currently Clicked Toolbar Button
+                *
+                * @type {Ext.Button}
+                */
+               currentlyClickedButton: null,
+
+               /**
+                * Currently Shown Panel
+                *
+                * @type {Ext.Component}
+                */
+               currentlyShownPanel: null,
+
+               /**
+                * Filtering Indicator Item
+                *
+                * @type {Ext.Panel}
+                */
+               filteringIndicator: null,
+
+               /**
+                * Drag and Drop Group
+                *
+                * @cfg {String}
+                */
+               ddGroup: '',
+
+               /**
+                * Data Provider
+                *
+                * @cfg {Object}
+                */
+               dataProvider: null,
+
+               /**
+                * Filtering Tree
+                *
+                * @cfg {TYPO3.Components.PageTree.FilteringTree}
+                */
+               filteringTree: null,
+
+               /**
+                * Page Tree
+                *
+                * @cfg {TYPO3.Components.PageTree.Tree}
+                */
+               tree: null,
+
+               /**
+                * Application Panel
+                *
+                * @cfg {TYPO3.Components.PageTree.App}
+                */
+               app: null,
+
+               /**
+                * Initializes the component
+                *
+                * @return {void}
+                */
+               initComponent: function () {
+                       this.currentlyShownPanel = new Ext.Panel({
+                               id: this.id + '-defaultPanel',
+                               cls: this.id + '-item typo3-pagetree-toppanel-item',
+                               border: false
+                       });
+                       this.items = [this.currentlyShownPanel];
+
+                       TYPO3.Components.PageTree.TopPanel.superclass.initComponent.apply(this, arguments);
+
+                       this.addDragDropNodeInsertionFeature();
+
+                       if (!TYPO3.Components.PageTree.Configuration.hideFilter
+                               || TYPO3.Components.PageTree.Configuration.hideFilter === '0'
+                       ) {
+                               this.addFilterFeature();
+                       }
 
-               topPanel.currentlyShownPanel.hide();
-               if (topPanel.currentlyClickedButton) {
-                       topPanel.currentlyClickedButton.toggle(false);
-               }
+                       this.getTopToolbar().addItem({xtype: 'tbfill'});
+                       this.addRefreshTreeFeature();
+               },
+
+               /**
+                * Returns a custom button template to fix some nasty webkit issues
+                * by removing some useless wrapping html code
+                *
+                * @return {void}
+                */
+               getButtonTemplate: function () {
+                       return new Ext.Template(
+                               '<div id="{4}" class="x-btn {3}"><button type="{0}">&nbsp;</button></div>'
+                       );
+               },
+
+               /**
+                * Adds a button to the components toolbar with a related component
+                *
+                * @param {Object} button
+                * @param {Object} connectedWidget
+                * @return {void}
+                */
+               addButton: function (button, connectedWidget) {
+                       button.template = this.getButtonTemplate();
+                       button.on('toggle', this.topbarButtonToggleCallback);
+                       if (!button.hasListener('click')) {
+                               button.on('click', this.topbarButtonCallback);
+                       }
 
-               if (topPanel.currentlyClickedButton === this) {
-                       topPanel.currentlyClickedButton = null;
-                       topPanel.currentlyShownPanel = topPanel.get(topPanel.id + '-defaultPanel');
-               } else {
-                       this.toggle(true);
-                       topPanel.currentlyClickedButton = this;
-                       topPanel.currentlyShownPanel = this.connectedWidget;
-               }
+                       if (connectedWidget) {
+                               connectedWidget.hidden = true;
+                               button.connectedWidget = connectedWidget;
+                               this.add(connectedWidget);
+                       }
 
-               topPanel.currentlyShownPanel.show();
-       },
+                       this.getTopToolbar().addItem(button);
+                       this.doLayout();
+               },
+
+               /**
+                * Toggle button state
+                *
+                * @return {void}
+                */
+               topbarButtonToggleCallback: function () {
+                       if (this.pressed) {
+                               this.el.addClass(['active']);
+                       } else {
+                               this.el.removeClass(['active']);
+                       }
+               },
+
+               /**
+                * Usual button callback method that triggers the assigned component of the
+                * clicked toolbar button
+                *
+                * @return {void}
+                */
+               topbarButtonCallback: function () {
+                       var topPanel = this.ownerCt.ownerCt;
+
+                       topPanel.currentlyShownPanel.hide();
+                       if (topPanel.currentlyClickedButton) {
+                               topPanel.currentlyClickedButton.toggle(false);
+                       }
 
-       /**
-        * Loads the filtering tree nodes with the given search word
-        *
-        * @param {Ext.form.TextField} textField
-        * @return {void}
-        */
-       createFilterTree: function(textField) {
-               var searchWord = textField.getValue();
-               var isNumber = TYPO3.Utility.isNumber(searchWord);
-               var hasMinLength = (searchWord.length > 2 || searchWord.length <= 0);
-               if ((!hasMinLength && !isNumber) || searchWord === this.filteringTree.searchWord) {
-                       return;
-               }
+                       if (topPanel.currentlyClickedButton === this) {
+                               topPanel.currentlyClickedButton = null;
+                               topPanel.currentlyShownPanel = topPanel.get(topPanel.id + '-defaultPanel');
+                       } else {
+                               this.toggle(true);
+                               topPanel.currentlyClickedButton = this;
+                               topPanel.currentlyShownPanel = this.connectedWidget;
+                       }
 
-               this.filteringTree.searchWord = searchWord;
-               if (this.filteringTree.searchWord === '') {
-                       this.app.activeTree = this.tree;
-                       this.tree.t3ContextNode = this.filteringTree.t3ContextNode;
+                       topPanel.currentlyShownPanel.show();
+               },
+
+               /**
+                * Loads the filtering tree nodes with the given search word
+                *
+                * @param {Ext.form.TextField} textField
+                * @return {void}
+                */
+               createFilterTree: function (textField) {
+                       var searchWord = textField.getValue();
+                       var isNumber = Utility.isNumber(searchWord);
+                       var hasMinLength = (searchWord.length > 2 || searchWord.length <= 0);
+                       if ((!hasMinLength && !isNumber) || searchWord === this.filteringTree.searchWord) {
+                               return;
+                       }
 
-                       textField.setHideTrigger(true);
-                       this.filteringTree.hide();
-                       this.tree.show().refreshTree(function() {
-                               textField.focus(false, 500);
-                       }, this);
+                       this.filteringTree.searchWord = searchWord;
+                       if (this.filteringTree.searchWord === '') {
+                               this.app.activeTree = this.tree;
+                               this.tree.t3ContextNode = this.filteringTree.t3ContextNode;
 
-                       if (this.filteringIndicator) {
-                               this.app.removeIndicator(this.filteringIndicator);
-                               this.filteringIndicator = null;
-                       }
-               } else {
-                       var selectedNode = this.app.getSelected();
-                       this.app.activeTree = this.filteringTree;
-
-                       if (!this.filteringIndicator) {
-                               this.filteringIndicator = this.app.addIndicator(
-                                       this.createIndicatorItem(textField)
-                               );
-                       }
+                               textField.setHideTrigger(true);
+                               this.filteringTree.hide();
+                               this.tree.show().refreshTree(function () {
+                                       textField.focus(false, 500);
+                               }, this);
 
-                       textField.setHideTrigger(false);
-                       this.tree.hide();
-                       this.filteringTree.show().refreshTree(function() {
-                               if (selectedNode) {
-                                       this.app.select(selectedNode.attributes.nodeData.id, false);
+                               if (this.filteringIndicator) {
+                                       this.app.removeIndicator(this.filteringIndicator);
+                                       this.filteringIndicator = null;
+                               }
+                       } else {
+                               var selectedNode = this.app.getSelected();
+                               this.app.activeTree = this.filteringTree;
+
+                               if (!this.filteringIndicator) {
+                                       this.filteringIndicator = this.app.addIndicator(
+                                               this.createIndicatorItem(textField)
+                                       );
                                }
-                               textField.focus();
-                       }, this);
-               }
 
-               this.doLayout();
-       },
+                               textField.setHideTrigger(false);
+                               this.tree.hide();
+                               this.filteringTree.show().refreshTree(function () {
+                                       if (selectedNode) {
+                                               this.app.select(selectedNode.attributes.nodeData.id, false);
+                                       }
+                                       textField.focus();
+                               }, this);
+                       }
 
-       /**
-        * Adds an indicator item to the page tree application for the filtering feature
-        *
-        * @param {Ext.form.TextField} textField
-        * @return {void}
-        */
-       createIndicatorItem: function(textField) {
-               return {
-                       border: false,
-                       id: this.app.id + '-indicatorBar-filter',
-                       cls: this.app.id + '-indicatorBar-item',
-                       html: '' +
+                       this.doLayout();
+               },
+
+               /**
+                * Adds an indicator item to the page tree application for the filtering feature
+                *
+                * @param {Ext.form.TextField} textField
+                * @return {void}
+                */
+               createIndicatorItem: function (textField) {
+                       return {
+                               border: false,
+                               id: this.app.id + '-indicatorBar-filter',
+                               cls: this.app.id + '-indicatorBar-item',
+                               html: '' +
                                '<div class="alert alert-info">' +
-                                       '<div class="media">' +
-                                               '<div class="media-left">' +
-                                                       TYPO3.Components.PageTree.Icons.Info +
-                                               '</div>' +
-                                               '<div class="media-body">' +
-                                                       TYPO3.Components.PageTree.LLL.activeFilterMode +
-                                               '</div>' +
-                                               '<div class="media-right">' +
-                                                       '<a href="#" id="' + this.app.id + '-indicatorBar-filter-clear">' +
-                                                               TYPO3.Components.PageTree.Icons.Close +
-                                                       '</a>' +
-                                               '</div>' +
-                                       '</div>' +
+                               '<div class="media">' +
+                               '<div class="media-left">' +
+                               TYPO3.Components.PageTree.Icons.Info +
+                               '</div>' +
+                               '<div class="media-body">' +
+                               TYPO3.Components.PageTree.LLL.activeFilterMode +
+                               '</div>' +
+                               '<div class="media-right">' +
+                               '<a href="#" id="' + this.app.id + '-indicatorBar-filter-clear">' +
+                               TYPO3.Components.PageTree.Icons.Close +
+                               '</a>' +
+                               '</div>' +
+                               '</div>' +
                                '</div>',
-                       filteringTree: this.filteringTree,
-
-                       listeners: {
-                               afterrender: {
-                                       scope: this,
-                                       fn: function() {
-                                               var element = Ext.fly(this.app.id + '-indicatorBar-filter-clear');
-                                               element.on('click', function() {
-                                                       textField.setValue('');
-                                                       this.createFilterTree(textField);
-                                               }, this);
+                               filteringTree: this.filteringTree,
+
+                               listeners: {
+                                       afterrender: {
+                                               scope: this,
+                                               fn: function () {
+                                                       var element = Ext.fly(this.app.id + '-indicatorBar-filter-clear');
+                                                       element.on('click', function () {
+                                                               textField.setValue('');
+                                                               this.createFilterTree(textField);
+                                                       }, this);
+                                               }
                                        }
                                }
-                       }
-               };
-       },
+                       };
+               },
+
+               /**
+                * Adds the necessary functionality and components for the filtering feature
+                *
+                * @return {void}
+                */
+               addFilterFeature: function () {
+                       var topPanelButton = new Ext.Button({
+                               id: this.id + '-button-filter',
+                               cls: 'btn btn-default btn-sm',
+                               text: TYPO3.Components.PageTree.Icons.Filter,
+                               tooltip: TYPO3.Components.PageTree.LLL.buttonFilter
+                       });
+
+                       var textField = new Ext.form.TriggerField({
+                               id: this.id + '-filter',
+                               cls: 'form-control input-sm typo3-pagetree-toppanel-filter',
+                               enableKeyEvents: true,
+                               triggerConfig: {
+                                       tag: 'span',
+                                       html: TYPO3.Components.PageTree.Icons.InputClear,
+                                       cls: 'typo3-pagetree-toppanel-filter-clear'
+                               },
+                               value: TYPO3.Components.PageTree.LLL.searchTermInfo,
+
+                               listeners: {
+                                       blur: {
+                                               scope: this,
+                                               fn: function (textField) {
+                                                       if (textField.getValue() === '') {
+                                                               textField.setValue(TYPO3.Components.PageTree.LLL.searchTermInfo);
+                                                               textField.addClass(this.id + '-filter-defaultText');
+                                                       }
+                                               }
+                                       },
+
+                                       focus: {
+                                               scope: this,
+                                               fn: function (textField) {
+                                                       if (textField.getValue() === TYPO3.Components.PageTree.LLL.searchTermInfo) {
+                                                               textField.setValue('');
+                                                               textField.removeClass(this.id + '-filter-defaultText');
+                                                       }
+                                               }
+                                       },
 
-       /**
-        * Adds the necessary functionality and components for the filtering feature
-        *
-        * @return {void}
-        */
-       addFilterFeature: function() {
-               var topPanelButton = new Ext.Button({
-                       id: this.id + '-button-filter',
-                       cls: 'btn btn-default btn-sm',
-                       text: TYPO3.Components.PageTree.Icons.Filter,
-                       tooltip: TYPO3.Components.PageTree.LLL.buttonFilter
-               });
-
-               var textField = new Ext.form.TriggerField({
-                       id: this.id + '-filter',
-                       cls: 'form-control input-sm typo3-pagetree-toppanel-filter',
-                       enableKeyEvents: true,
-                       triggerConfig: {
-                               tag: 'span',
-                               html: TYPO3.Components.PageTree.Icons.InputClear,
-                               cls: 'typo3-pagetree-toppanel-filter-clear'
-                       },
-                       value: TYPO3.Components.PageTree.LLL.searchTermInfo,
-
-                       listeners: {
-                               blur: {
-                                       scope: this,
-                                       fn:function(textField) {
-                                               if (textField.getValue() === '') {
-                                                       textField.setValue(TYPO3.Components.PageTree.LLL.searchTermInfo);
-                                                       textField.addClass(this.id + '-filter-defaultText');
+                                       keydown: {
+                                               fn: this.createFilterTree,
+                                               scope: this,
+                                               buffer: 1000
+                                       }
+                               }
+                       });
+
+                       textField.setHideTrigger(true);
+                       textField.onTriggerClick = function () {
+                               textField.setValue('');
+                               this.createFilterTree(textField);
+                       }.createDelegate(this);
+
+                       var topPanelWidget = new Ext.Container({
+                               border: false,
+                               id: this.id + '-filterWrap',
+                               cls: this.id + '-item typo3-pagetree-toppanel-item',
+                               border: false,
+                               items: [textField],
+
+                               listeners: {
+                                       show: {
+                                               scope: this,
+                                               fn: function (panel) {
+                                                       panel.get(this.id + '-filter').focus();
                                                }
                                        }
+                               }
+                       });
+
+                       this.addButton(topPanelButton, topPanelWidget);
+               },
+
+               /**
+                * Creates the entries for the new node drag zone toolbar
+                *
+                * @return {void}
+                */
+               createNewNodeToolbar: function () {
+                       this.dragZone = new Ext.dd.DragZone(this.getEl(), {
+                               ddGroup: this.ownerCt.ddGroup,
+                               topPanel: this.ownerCt,
+
+                               endDrag: function () {
+                                       this.topPanel.app.activeTree.dontSetOverClass = false;
                                },
 
-                               focus: {
-                                       scope: this,
-                                       fn: function(textField) {
-                                               if (textField.getValue() === TYPO3.Components.PageTree.LLL.searchTermInfo) {
-                                                       textField.setValue('');
-                                                       textField.removeClass(this.id + '-filter-defaultText');
+                               getDragData: function (event) {
+                                       this.proxyElement = document.createElement('div');
+                                       if (event.getTarget('.x-btn') !== null) {
+                                               var node = Ext.getCmp(event.getTarget('.x-btn').id);
+                                               node.shouldCreateNewNode = true;
+                                               return {
+                                                       ddel: this.proxyElement,
+                                                       item: node
                                                }
                                        }
                                },
 
-                               keydown: {
-                                       fn: this.createFilterTree,
-                                       scope: this,
-                                       buffer: 1000
-                               }
-                       }
-               });
-
-               textField.setHideTrigger(true);
-               textField.onTriggerClick = function() {
-                       textField.setValue('');
-                       this.createFilterTree(textField);
-               }.createDelegate(this);
-
-               var topPanelWidget = new Ext.Container({
-                       border: false,
-                       id: this.id + '-filterWrap',
-                       cls: this.id + '-item typo3-pagetree-toppanel-item',
-                       border: false,
-                       items: [textField],
-
-                       listeners: {
-                               show: {
-                                       scope: this,
-                                       fn: function(panel) {
-                                               panel.get(this.id + '-filter').focus();
-                                       }
-                               }
-                       }
-               });
+                               onInitDrag: function () {
+                                       this.topPanel.app.activeTree.dontSetOverClass = true;
+                                       var clickedButton = this.dragData.item;
 
-               this.addButton(topPanelButton, topPanelWidget);
-       },
+                                       this.proxyElement.shadow = false;
+                                       this.proxyElement.innerHTML = '<div class="x-dd-drag-ghost-pagetree">' +
+                                               '<span class="x-dd-drag-ghost-pagetree-icon">' + clickedButton.initialConfig.html + '</span>' +
+                                               '<span class="x-dd-drag-ghost-pagetree-text">' + clickedButton.title + '</span>' +
+                                               '</div>';
 
-       /**
-        * Creates the entries for the new node drag zone toolbar
-        *
-        * @return {void}
-        */
-       createNewNodeToolbar: function() {
-               this.dragZone = new Ext.dd.DragZone(this.getEl(), {
-                       ddGroup: this.ownerCt.ddGroup,
-                       topPanel: this.ownerCt,
-
-                       endDrag: function() {
-                               this.topPanel.app.activeTree.dontSetOverClass = false;
-                       },
-
-                       getDragData: function(event) {
-                               this.proxyElement = document.createElement('div');
-                               if (event.getTarget('.x-btn') !== null){
-                                       var node = Ext.getCmp(event.getTarget('.x-btn').id);
-                                       node.shouldCreateNewNode = true;
-                                       return {
-                                               ddel: this.proxyElement,
-                                               item: node
-                                       }
+                                       this.proxy.update(this.proxyElement);
                                }
-                       },
-
-                       onInitDrag: function() {
-                               this.topPanel.app.activeTree.dontSetOverClass = true;
-                               var clickedButton = this.dragData.item;
-
-                               this.proxyElement.shadow = false;
-                               this.proxyElement.innerHTML = '<div class="x-dd-drag-ghost-pagetree">' +
-                                       '<span class="x-dd-drag-ghost-pagetree-icon">' + clickedButton.initialConfig.html + '</span>' +
-                                       '<span class="x-dd-drag-ghost-pagetree-text">'  + clickedButton.title + '</span>' +
-                               '</div>';
-
-                               this.proxy.update(this.proxyElement);
-                       }
-               });
+                       });
 
                        // listens on the escape key to stop the dragging
-               (new Ext.KeyMap(document, {
-                       key: Ext.EventObject.ESC,
-                       scope: this,
-                       buffer: 250,
-                       fn: function(event) {
-                               if (this.dragZone.dragging) {
-                                       Ext.dd.DragDropMgr.stopDrag(event);
-                                       this.dragZone.onInvalidDrop(event);
+                       (new Ext.KeyMap(document, {
+                               key: Ext.EventObject.ESC,
+                               scope: this,
+                               buffer: 250,
+                               fn: function (event) {
+                                       if (this.dragZone.dragging) {
+                                               Ext.dd.DragDropMgr.stopDrag(event);
+                                               this.dragZone.onInvalidDrop(event);
+                                       }
                                }
-                       }
-               }, 'keydown'));
-       },
-
-       /**
-        * Creates the necessary components for new node drag and drop feature
-        *
-        * @return {void}
-        */
-       addDragDropNodeInsertionFeature: function() {
-               var newNodeToolbar = new Ext.Toolbar({
-                       border: false,
-                       id: this.id + '-item-newNode',
-                       listeners: {
-                               render: {
-                                       fn: this.createNewNodeToolbar
+                       }, 'keydown'));
+               },
+
+               /**
+                * Creates the necessary components for new node drag and drop feature
+                *
+                * @return {void}
+                */
+               addDragDropNodeInsertionFeature: function () {
+                       var newNodeToolbar = new Ext.Toolbar({
+                               border: false,
+                               id: this.id + '-item-newNode',
+                               listeners: {
+                                       render: {
+                                               fn: this.createNewNodeToolbar
+                                       }
                                }
-                       }
-               });
-
-               this.dataProvider.getNodeTypes(function(response) {
-                       var amountOfNodeTypes = response.length;
-                       if (amountOfNodeTypes > 0) {
-                               topPanelButton.show();
-                               for (var i = 0; i < amountOfNodeTypes; ++i) {
-                                       response[i].template = this.getButtonTemplate();
-                                       response[i].cls = 'typo3-pagetree-toppanel-drag-node';
-                                       newNodeToolbar.addItem(response[i]);
+                       });
+
+                       this.dataProvider.getNodeTypes(function (response) {
+                               var amountOfNodeTypes = response.length;
+                               if (amountOfNodeTypes > 0) {
+                                       topPanelButton.show();
+                                       for (var i = 0; i < amountOfNodeTypes; ++i) {
+                                               response[i].template = this.getButtonTemplate();
+                                               response[i].cls = 'typo3-pagetree-toppanel-drag-node';
+                                               newNodeToolbar.addItem(response[i]);
+                                       }
+                                       newNodeToolbar.doLayout();
                                }
-                               newNodeToolbar.doLayout();
-                       }
-               }, this);
-
-               var topPanelButton = new Ext.Button({
-                       id: this.id + '-button-newNode',
-                       cls: 'btn btn-default btn-sm',
-                       text: TYPO3.Components.PageTree.Icons.NewNode,
-                       tooltip: TYPO3.Components.PageTree.LLL.buttonNewNode,
-                       hidden: true
-               });
-
-               this.addButton(topPanelButton, newNodeToolbar);
-       },
+                       }, this);
 
-       /**
-        * Adds a button to the toolbar for the refreshing feature
-        *
-        * @return {void}
-        */
-       addRefreshTreeFeature: function() {
-               var topPanelButton = new Ext.Button({
-                       id: this.id + '-button-refresh',
-                       cls: 'btn btn-default btn-sm',
-                       text: TYPO3.Components.PageTree.Icons.Refresh,
-                       tooltip: TYPO3.Components.PageTree.LLL.buttonRefresh,
-
-                       listeners: {
-                               click: {
-                                       scope: this,
-                                       fn: function() {
-                                               this.app.activeTree.refreshTree();
+                       var topPanelButton = new Ext.Button({
+                               id: this.id + '-button-newNode',
+                               cls: 'btn btn-default btn-sm',
+                               text: TYPO3.Components.PageTree.Icons.NewNode,
+                               tooltip: TYPO3.Components.PageTree.LLL.buttonNewNode,
+                               hidden: true
+                       });
+
+                       this.addButton(topPanelButton, newNodeToolbar);
+               },
+
+               /**
+                * Adds a button to the toolbar for the refreshing feature
+                *
+                * @return {void}
+                */
+               addRefreshTreeFeature: function () {
+                       var topPanelButton = new Ext.Button({
+                               id: this.id + '-button-refresh',
+                               cls: 'btn btn-default btn-sm',
+                               text: TYPO3.Components.PageTree.Icons.Refresh,
+                               tooltip: TYPO3.Components.PageTree.LLL.buttonRefresh,
+
+                               listeners: {
+                                       click: {
+                                               scope: this,
+                                               fn: function () {
+                                                       this.app.activeTree.refreshTree();
+                                               }
                                        }
                                }
-                       }
-               });
+                       });
 
-               this.addButton(topPanelButton);
-       }
-});
+                       this.addButton(topPanelButton);
+               }
+       });
 
-// XTYPE Registration
-Ext.reg('TYPO3.Components.PageTree.TopPanel', TYPO3.Components.PageTree.TopPanel);
+       // XTYPE Registration
+       Ext.reg('TYPO3.Components.PageTree.TopPanel', TYPO3.Components.PageTree.TopPanel);
+});
diff --git a/typo3/sysext/core/Documentation/Changelog/master/Deprecation-82609-DeprecateTYPO3Utility.rst b/typo3/sysext/core/Documentation/Changelog/master/Deprecation-82609-DeprecateTYPO3Utility.rst
new file mode 100644 (file)
index 0000000..7e56dcb
--- /dev/null
@@ -0,0 +1,35 @@
+.. include:: ../../Includes.txt
+
+=============================================
+Deprecation: #82609 - Deprecate TYPO3.Utility
+=============================================
+
+See :issue:`82609`
+
+Description
+===========
+
+The public property :js:`TYPO3.Utility` has been marked as deprecated. `Utility` may be used in AMD based modules by
+importing :js:`TYPO3/CMS/Backend/Utility` instead.
+
+
+Affected Installations
+======================
+
+All extensions using :js:`TYPO3.Utility` are affected.
+
+
+Migration
+=========
+
+Import :js:`TYPO3/CMS/Backend/Utility` in your AMD module.
+
+Example code:
+
+.. code-block:: javascript
+
+       define(['TYPO3/CMS/Backend/Utility'], function(Utility) {
+               // use Utility here
+       });
+
+.. index:: JavaScript, NotScanned