Files
Umbraco-CMS/umbraco/presentation/umbraco_client/Tree/UmbracoTree.min.js
Shandem 198c2d2d06 WORK IN PROGRESS, DO NOT DOWNLOAD
ClientDependency work. Resolved old 20914 bug. Initial fix to remove Umbraco.aspx page popup.

[TFS Changeset #56361]
2009-07-13 14:51:26 +00:00

119 lines
21 KiB
JavaScript

Umbraco.Sys.registerNamespace("Umbraco.Controls"); (function($) {
$.fn.UmbracoTree = function(opts) { return this.each(function() { var conf = $.extend({ jsonFullMenu: null, jsonInitNode: null, appActions: null, uiKeys: null, app: "", showContext: true, isDialog: false, treeType: "standard", umb_clientFolderRoot: "/umbraco_client" }, opts); new Umbraco.Controls.UmbracoTree().init($(this), conf); }); }; $.fn.UmbracoTreeAPI = function() { return $(this).data("UmbracoTree") == null ? null : $(this).data("UmbracoTree"); }; Umbraco.Controls.UmbracoTree = function() {
return { _actionNode: new Umbraco.Controls.NodeDefinition(), _activeTreeType: "content", _recycleBinId: -20, _umb_clientFolderRoot: "/umbraco_client", _fullMenu: null, _initNode: null, _menuActions: null, _tree: null, _uiKeys: null, _container: null, _app: null, _showContext: true, _isDialog: false, _isDebug: true, _loadedApps: [], _serviceUrl: "", _dataUrl: "", _treeType: "standard", _treeClass: "umbTree", _currenAJAXRequest: false, addEventHandler: function(fnName, fn) { $(this).bind(fnName, fn); }, removeEventHandler: function(fnName, fn) { $(this).unbind(fnName, fn); }, init: function(jItem, opts) { this._init(opts.jsonFullMenu, opts.jsonInitNode, jItem, opts.appActions, opts.uiKeys, opts.app, opts.showContext, opts.isDialog, opts.treeType, opts.serviceUrl, opts.dataUrl, opts.umb_clientFolderRoot); jItem.addClass(this._treeClass); jItem.data("UmbracoTree", this); }, rebuildTree: function(app) {
this._debug("rebuildTree"); if (this._app == null || (this._app.toLowerCase() == app.toLowerCase())) { this._debug("not rebuilding"); return; }
else { this._app = app; }
$("div").remove(".tree-default-context"); this._tree.destroy(); this._container.hide(); var _this = this; var saveData = this._container.data("tree_" + app); if (saveData != null) {
this._debug("rebuildTree: rebuilding from cache!"); this._initNode = saveData.d; this._tree = $.tree_create(); this._tree.init(this._container, this._getInitOptions()); this._configureNodes(this._container.find("li"), true); var lastSelected = saveData.selected != null ? $(saveData.selected[0]).attr("id") : null; if (lastSelected != null) { var _this = this; var foundHandler = function(EV, node) { _this.removeEventHandler("syncFound", foundHandler); this._debug("rebuildTree: node synced, selecting node..."); _this.selectNode(node, false, true); this._container.show(); }; this._debug("rebuildTree: syncing to last selected: " + lastSelected); this.addEventHandler("syncFound", foundHandler); this.setActiveTreeType($(saveData.selected[0]).attr("umb:type")); this.syncTree(lastSelected); }
else { this._container.show(); }
return;
}
var parameters = "{'app':'" + app + "','showContextMenu':'" + this._showContext + "', 'isDialog':'" + this._isDialog + "'}"
this._currentAJAXRequest = true; $.ajax({ type: "POST", url: this._serviceUrl, data: parameters, contentType: "application/json; charset=utf-8", dataType: "json", success: function(msg) {
msg = msg.d; if ($.inArray(msg.app, _this._loadedApps) == -1) { _this._debug("loading js for app: " + msg.app); _this._loadedApps.push(msg.app); _this._container.after("<script>" + msg.js + "</script>"); }
_this._initNode = eval(msg.json); _this._tree = $.tree_create(); _this._tree.init(_this._container, _this._getInitOptions()); _this._container.show(); _this._loadChildNodes(_this._container.find("li:first"), null); _this._currentAJAXRequest = false; $(_this).trigger("rebuiltTree", [msg.app]);
}, error: function(e) { _this._debug("rebuildTree: AJAX error occurred"); _this._currentAJAXRequest = false; $(_this).trigger("ajaxError", [{ msg: "rebuildTree"}]); }
});
}, saveTreeState: function(appAlias) {
this._debug("saveTreeState: " + appAlias + " : ajax request? " + this._currentAJAXRequest); if (this._currentAJAXRequest) { this._container.data("tree_" + appAlias, null); return; }
var treeData = this._tree.getJSON(null, ["id", "umb:type", "class"], ["umb:nodedata", "href", "class", "style"]); this._updateJSONNodeState(treeData); this._container.data("tree_" + appAlias, { selected: this._tree.selected, d: treeData });
}, _updateJSONNodeState: function(obj) {
var node = $("li[id='" + obj.attributes.id + "']").filter(function() { return ($(this).attr("umb:type") == obj.attributes["umb:type"]); }); var c = node.attr("class"); if (c != null) { var state = c.indexOf("open") > -1 ? "open" : c.indexOf("closed") > -1 ? "closed" : null; if (state != null) obj.state = state; }
if (obj.children != null) { for (var x in obj.children) { this._updateJSONNodeState(obj.children[x]); } }
}, syncTree: function(path, forceReload) { this._debug("syncTree: " + path + ", " + forceReload); this._syncTree.call(this, path, forceReload, null, null); }, childNodeCreated: function() {
this._debug("childNodeCreated"); var childrenIds = new Array(); this._actionNode.jsNode.find("ul > li").each(function() { childrenIds.push($(this).attr("id")); }); var _this = this; var currId = this._actionNode.nodeId; this.reloadActionNode(true, false, function(success) {
if (success && childrenIds.length > 0) {
var found = false; var actionNode = _this.findNode(currId); if (actionNode) { actionNode.find("ul > li").each(function() { if ($.inArray($(this).attr("id"), childrenIds) == -1) { found = $(this); } }); }
if (found) { _this._debug("childNodeCreated: selecting new child node: " + found.attr("id")); _this.selectNode(found, true, true); $(_this).trigger("newChildNodeFound", [found]); return; }
}
_this._debug("childNodeCreated: could not select new child!");
});
}, moveNode: function(nodeId, parentPath) { this._debug("moveNode"); var old = this.findNode(nodeId); if (old) old.remove(); var newPath = parentPath + "," + nodeId; var _this = this; var foundHandler = function(EV, node) { _this.removeEventHandler("syncFound", foundHandler); _this.selectNode(node, false, true); $(_this).trigger("nodeMoved", [node]); }; this.addEventHandler("syncFound", foundHandler); this.syncTree(newPath); }, copyNode: function(nodeId, parentPath) { this._debug("copyNode"); var originalNode = this.findNode(nodeId); var _this = this; var foundHandler = function(EV, node) { _this.removeEventHandler("syncFound", foundHandler); _this._loadChildNodes(node, null); if (originalNode) _this.selectNode(originalNode, true); $(_this).trigger("nodeCopied", [node]); }; this.addEventHandler("syncFound", foundHandler); this.syncTree(parentPath); }, findNode: function(nodeId, findGlobal) { var _this = this; var branch = this._container.find("li[id='" + nodeId + "']"); if (!findGlobal) branch = branch.filter(function() { return ($(this).attr("umb:type") == _this._activeTreeType); }); var found = branch.length > 0 ? branch : false; this._debug("findNode: " + nodeId + " in '" + this._activeTreeType + "' tree. Found? " + found.length); return found; }, selectNode: function(node, supressEvent, reselect) {
this._debug("selectNode"); var selectedId = this._tree.selected != null ? $(this._tree.selected[0]).attr("id") : null; if (reselect || (selectedId == null || selectedId != node.attr("id"))) {
if (supressEvent) { this._tree.settings.callback.onselect = function() { }; }
this._tree.select_branch(node); var _this = this; this._tree.settings.callback.onselect = function(N, T) { _this.onSelect(N, T) };
}
}, reloadActionNode: function(supressSelect, supressChildReload, callback) {
this._debug("reloadActionNode: supressSelect = " + supressSelect + ", supressChildReload = " + supressChildReload); if (this._actionNode != null && this._actionNode.jsNode != null) {
var nodeParent = this._actionNode.jsNode.parents("li:first"); this._debug("reloadActionNode: found " + nodeParent.length + " parent nodes"); if (nodeParent.length == 1) {
var nodeDef = this._getNodeDef(nodeParent); this._debug("reloadActionNode: loading ajax for node: " + nodeDef.nodeId); var _this = this; var toReplace = $("<li class='last'><a class='loading' href='#'><div>" + (this._tree.settings.lang.loading || "Loading ...") + "</div></a></li>").replaceAll(this._actionNode.jsNode); $.get(this._getUrl(nodeDef.sourceUrl), null, function(msg) {
if (!msg || msg.length == 0) { _this._debug("reloadActionNode: error loading ajax data, performing jsTree refresh"); _this._tree.refresh(); if (callback != null) callback.call(_this, false); return; }
var oFound = null; for (var o in msg) {
if (msg[o].attributes != null && msg[o].attributes.id == _this._actionNode.nodeId) {
oFound = _this._tree.parseJSON(msg[o]); if ($(oFound).attr("umb:type") == _this._actionNode.treeType) { break; }
else { oFound = null; }
}
}
if (oFound != null) {
_this._debug("reloadActionNode: node is refreshed!"); var reloaded = $(oFound).replaceAll(toReplace); _this._configureNodes(reloaded, true); if (!supressSelect) _this.selectNode(reloaded); if (!supressChildReload) { _this._loadChildNodes(reloaded, function() { if (callback != null) callback.call(_this, true); }); }
else { if (callback != null) callback.call(_this, true); }
}
else { _this._debug("reloadActionNode: error finding child node in ajax data, performing jsTree refresh"); _this._tree.refresh(); if (callback != null) callback.call(_this, false); }
}, "json"); return;
}
this._debug("reloadActionNode: error finding parent node, performing jsTree refresh"); this._tree.refresh(); if (callback != null) callback.call(this, false);
}
}, getActionNode: function() { return this._actionNode; }, setActiveTreeType: function(treeType) { this._activeTreeType = treeType; }, onNodeDeleting: function(EV) {
this._debug("onNodeDeleting")
this._tree.close_branch(this._actionNode.jsNode); this._actionNode.jsNode.find("a").attr("class", "loading"); this._actionNode.jsNode.find("a").css("background-image", ""); this._actionNode.jsNode.find("a").html(this._uiKeys['deleting']);
}, onNodeDeleted: function(EV) { this._debug("onNodeDeleted"); this._actionNode.jsNode.find("a").removeClass("loading"); this._tree.close_branch(this._actionNode.jsNode); this._actionNode.jsNode.hide("drop", { direction: "down" }, 400); this._updateRecycleBin(); }, onNodeRefresh: function(EV) { this._debug("onNodeRefresh"); this._loadChildNodes(this._actionNode.jsNode, null); }, onSelect: function(NODE, TREE_OBJ) {
this.setActiveTreeType($(NODE).attr("umb:type")); var js = $(NODE).children("a").attr("href").replace("javascript:", ""); this._debug("onSelect: js: " + js); try { var func = eval(js); if (func != null) { func.call(); } } catch (e) { }
return true;
}, onOpen: function(NODE, TREE_OBJ) { this._debug("onOpen: " + $(NODE).attr("id")); var nodes = $(NODE).find("ul > li"); this._configureNodes(nodes); return true; }, onBeforeOpen: function(NODE, TREE_OBJ) { var nodeDef = this._getNodeDef($(NODE)); this._debug("onBeforeOpen: " + nodeDef.nodeId); this._currentAJAXRequest = true; TREE_OBJ.settings.data.url = this._getUrl(nodeDef.sourceUrl); }, onJSONData: function(DATA, TREE_OBJ) { this._debug("onJSONData"); this._currentAJAXRequest = false; return DATA; }, onChange: function(NODE, TREE_OBJ) {
if (this._treeType == "checkbox") {
var $this = $(NODE).is("li") ? $(NODE) : $(NODE).parent(); if ($this.children("a").hasClass("checked")) $this.children("a").removeClass("checked")
else $this.children("a").addClass("checked");
}
else if (this._treeType == "inheritedcheckbox") {
var $this = $(NODE).is("li") ? $(NODE) : $(NODE).parent(); if ($this.children("a.unchecked").size() == 0) { TREE_OBJ.container.find("a").addClass("unchecked"); }
$this.children("a").removeClass("clicked"); if ($this.children("a").hasClass("checked")) { $this.find("li").andSelf().children("a").removeClass("checked").removeClass("undetermined").addClass("unchecked"); var state = 0; }
else { $this.find("li").andSelf().children("a").removeClass("unchecked").removeClass("undetermined").addClass("checked"); var state = 1; }
$this.parents("li").each(function() {
if (state == 1) {
if ($(this).find("a.unchecked, a.undetermined").size() - 1 > 0) { $(this).parents("li").andSelf().children("a").removeClass("unchecked").removeClass("checked").addClass("undetermined"); return false; }
else $(this).children("a").removeClass("unchecked").removeClass("undetermined").addClass("checked");
}
else {
if ($(this).find("a.checked, a.undetermined").size() - 1 > 0) { $(this).parents("li").andSelf().children("a").removeClass("unchecked").removeClass("checked").addClass("undetermined"); return false; }
else $(this).children("a").removeClass("checked").removeClass("undetermined").addClass("unchecked");
}
});
}
$(this).trigger("nodeClicked", [NODE]);
}, onRightClick: function(NODE, TREE_OBJ, EV) { this._actionNode = this._getNodeDef($(NODE)); this.setActiveTreeType($(NODE).attr("umb:type")); this._debug("onRightClick: menu = " + this._actionNode.menu); $("div").remove(".tree-default-context"); if (this._actionNode.menu != "") { TREE_OBJ.settings.ui.context = this._getContextMenu(this._actionNode.menu); TREE_OBJ.context_menu(); var timeout = null; TREE_OBJ.context.mouseenter(function() { clearTimeout(timeout); }); TREE_OBJ.context.mouseleave(function() { timeout = setTimeout(function() { TREE_OBJ.hide_context(); }, 400); }); } }, _debug: function(strMsg) { if (this._isDebug) { Sys.Debug.trace("UmbracoTree: " + strMsg); } }, _configureNodes: function(nodes, reconfigure) {
var _this = this; if (!reconfigure) { nodes = nodes.not("li[class*='loaded']"); }
this._debug("_configureNodes: " + nodes.length); var rxInput = new RegExp("\\boverlay-\\w+\\b", "gi"); nodes.each(function() {
if (_this._treeType != "standard") { $(this).children("a:first").css("background", ""); return; }
$(this).children("div").remove(); var m = $(this).attr("class").match(rxInput); if (m != null) { for (i = 0; i < m.length; i++) { _this._debug("_configureNodes: adding overlay: " + m[i] + " for node: " + $(this).attr("id")); $(this).children("a:first").before("<div class='overlay " + m[i] + "'></div>"); } }
var txt = $(this).children("a").html(); $(this).children("a").html("<div>" + txt + "</div>"); $(this).addClass("loaded");
});
}, _getNodeDef: function(NODE) { var nodedata = $(NODE).children("a").metadata({ type: 'attr', name: 'umb:nodedata' }); this._debug("_getNodeDef: " + $(NODE).attr("id") + ", " + nodedata.nodeType + ", " + nodedata.source); var def = new Umbraco.Controls.NodeDefinition(); def.updateDefinition(this._tree, $(NODE), $(NODE).attr("id"), $(NODE).find("a > div").html(), nodedata.nodeType, nodedata.source, nodedata.menu, $(NODE).attr("umb:type")); return def; }, _updateRecycleBin: function() { this._debug("_updateRecycleBin"); var rNode = this.findNode(this._recycleBinId, true); if (rNode) { this._actionNode = this._getNodeDef(rNode); var _this = this; this.reloadActionNode(true, true, function(success) { if (success) { _this.findNode(_this._recycleBinId, true).effect("highlight", {}, 1000); } }); } }, _loadChildNodes: function(liNode, callback) { this._debug("_loadChildNodes: " + liNode); liNode.removeClass("leaf"); this._tree.close_branch(liNode, true); liNode.children("ul:eq(0)").html(""); this._tree.open_branch(liNode, false, callback); }, _syncTree: function(path, forceReload, numPaths, numAsync) {
this._debug("_syncTree"); var paths = path.split(","); var found = null; var foundIndex = null; if (numPaths == null) numPaths = (paths.length - 0); for (var i = 0; i < numPaths; i++) { foundIndex = paths.length - (1 + i); found = this.findNode(paths[foundIndex]); this._debug("_syncTree: finding... " + paths[foundIndex] + " found? " + found); if (found) break; }
if (!found) { this._debug("no node found in path: " + path + " : " + numPaths); $(this).trigger("syncNotFound", [path]); return; }
if (found.attr("id") != paths[paths.length - 1]) {
var _this = this; this._loadChildNodes(found, function(NODE, TREE_OBJ) {
var pathsToSearch = paths.length - (Number(foundIndex) + 1); if (_this.findNode(paths[foundIndex + 1])) { _this._syncTree(path, forceReload, pathsToSearch, (numAsync == null ? numAsync == 1 : ++numAsync)); }
else { _this._debug("node not found in children: " + path + " : " + numPaths); $(this).trigger("syncNotFound", [path]); }
});
}
else {
var doReload = (forceReload && (numAsync == null || numAsync < 1)); this._debug("_syncTree: found! numAsync: " + numAsync + ", forceReload: " + forceReload); if (doReload) { this._actionNode = this._getNodeDef(found); this.reloadActionNode(true, true, null); }
else { if (found.attr("id") != "-1") this.selectNode(found, true); this._configureNodes(found, doReload); }
$(this).trigger("syncFound", [found]);
}
}, _getContextMenu: function(strMenu) {
this._debug("_getContextMenu: " + strMenu); var newMenu = new Array(); for (var i = 0; i < strMenu.length; i++) { var letter = strMenu.charAt(i); var menuItem = this._getMenuItemByLetter(letter); if (menuItem != null) newMenu.push(menuItem); }
return newMenu;
}, _getMenuItemByLetter: function(letter) {
if (letter == ",") return "separator"; for (var m in this._fullMenu) { if (this._fullMenu[m].id == letter) { return this._fullMenu[m]; } }
return null;
}, _init: function(jFullMenu, jInitNode, treeContainer, appActions, uiKeys, app, showContext, isDialog, treeType, serviceUrl, dataUrl, umbClientFolder) {
this._debug("_init: creating new tree with class/id: " + treeContainer.attr("class") + " / " + treeContainer.attr("id")); this._fullMenu = jFullMenu; this._initNode = jInitNode; this._menuActions = appActions; this._uiKeys = uiKeys; this._app = app; this._showContext = showContext; this._isDialog = isDialog; this._treeType = treeType; this._serviceUrl = serviceUrl; this._dataUrl = dataUrl; this._umb_clientFolderRoot = umbClientFolder; if (this._menuActions != null) { var _this = this; this._menuActions.addEventHandler("nodeDeleting", function(E) { _this.onNodeDeleting(E) }); this._menuActions.addEventHandler("nodeDeleted", function(E) { _this.onNodeDeleted(E) }); this._menuActions.addEventHandler("nodeRefresh", function(E) { _this.onNodeRefresh(E) }); }
this._container = treeContainer; this._tree = $.tree_create(); this._tree.init(this._container, this._getInitOptions()); this._loadChildNodes(this._container.find("li:first"), null);
}, _getUrl: function(nodeSource) {
if (nodeSource == null || nodeSource == "") { return this._dataUrl; }
var params = nodeSource.split("?")[1]; return this._dataUrl + "?" + params + "&rnd2=" + Umbraco.Utils.generateRandom();
}, _getInitOptions: function() { this._debug("_getInitOptions"); var _this = this; var options = { data: { type: "json", async: true, url: "", json: this._initNode, async_data: function(NODE) { return null; } }, ui: { dots: false, rtl: false, animation: false, hover_mode: true, theme_path: this._umb_clientFolderRoot + "/Tree/Themes/", theme_name: "umbraco", context: null }, lang: { new_node: "New folder", loading: "<div>" + (this._tree.settings.lang.loading || "Loading ...") + "</div>" }, rules: { metadata: "umb:nodedata", creatable: "none", draggable: "none" }, callback: { onrgtclk: function(N, T, E) { _this.onRightClick(N, T, E) }, beforeopen: function(N, T) { _this.onBeforeOpen(N, T) }, onopen: function(N, T) { _this.onOpen(N, T) }, onselect: function(N, T) { _this.onSelect(N, T) }, onchange: function(N, T) { _this.onChange(N, T) }, onJSONdata: function(D, T) { return _this.onJSONData(D, T) } } }; return options; }
};
}
})(jQuery);