s.div.text._node = this;
    this.div.icon.onclick = this.div.icon.ondblclick = this.div.text.onclick = this.div.text.ondblclick = function() {
      this._node.control.select(this._node);
    };

  },

  /*
  Property: insert
    Creates a new node, nested inside this one.

  Parameters:
    options - an object containing the same options available to the <MooTreeNode> constructor.

  Returns:
    A new <MooTreeNode> instance.
  */

  insert: function(options) {

    // set the parent div and create the node:
    options.div = this.div.sub;
    options.control = this.control;
    var node = new MooTreeNode(options);

    // set the new node's parent:
    node.parent = this;

    // mark this node's last node as no longer being the last, then add the new last node:
    var n = this.nodes;
    if (n.length) {
      n[n.length - 1].last = false;
    }
    n.push(node);

    // repaint the new node:
    node.update();

    // repaint the new node's parent (this node):
    if (n.length == 1) {
      this.update();
    }

    // recursively repaint the new node's previous sibling node:
    if (n.length > 1) {
      n[n.length - 2].update(true);
    }

    return node;

  },

  /*
  Property: remove
    Removes this node, and all of it's child nodes. If you want to remove all the childnodes without removing the node itself, use <MooTreeNode.clear>
  */

  remove: function() {
    var p = this.parent;
    this._remove();
    p.update(true);
  },

  _remove: function() {

    // recursively remove this node's subnodes:
    var n = this.nodes;
    while (n.length) {
      n[n.length - 1]._remove();
    }

    // remove the node id from the control's index:
    delete this.control.index[this.id];

    // remove this node's divs:
    this.div.main.destroy();
    this.div.sub.destroy();

    if (this.parent) {

      // remove this node from the parent's collection of nodes:
      var p = this.parent.nodes;
      p.erase(this);

      // in case we removed the parent's last node, flag it's current last node as being the last:
      if (p.length) {
        p[p.length - 1].last = true;
      }

    }

  },

  /*
  Property: clear
    Removes all child nodes under this node, without removing the node itself.
    To remove all nodes including this one, use <MooTreeNode.remove>
  */

  clear: function() {
    this.control.disable();
    while (this.nodes.length) {
      this.nodes[this.nodes.length - 1].remove();
    }
    this.control.enable();
  },

  /*
  Property: update
    Update the tree node's visual appearance.

  Parameters:
    recursive - boolean, defaults to false. If true, recursively updates all nodes beneath this one.
    invalidated - boolean, defaults to false. If true, updates only nodes that have been invalidated while the control has been disabled.
  */

  update: function(recursive, invalidated) {

    var draw = true;

    if (!this.control.enabled) {
      // control is currently disabled, so we don't do any visual updates
      this.invalidated = true;
      draw = false;
    }

    if (invalidated) {
      if (!this.invalidated) {
        draw = false; // this one is still valid, don't draw
      } else {
        this.invalidated = false; // we're drawing this item now
      }
    }

    if (draw) {

      var x;

      // make selected, or not:
      this.div.main.className = 'mooTree_node' + (this.selected ? ' mooTree_selected' : '');

      // update indentations:
      var p = this, i = '';
      while (p.parent) {
        p = p.parent;
        i = this.getImg(p.last || !this.control.grid ? '' : 'I') + i;
      }
      this.div.indent.innerHTML = i;

      // update the text:
      x = this.div.text;
      x.empty();
      x.appendText(this.text);
      if (this.color) {
        x.style.color = this.color;
      }

      // update the icon:
      this.div.icon.innerHTML = this.getImg(this.nodes.length ? (this.open ? (this.openicon || this.icon || '_open') : (this.icon || '_closed')) : (this.icon || (this.control.mode == 'folders' ? '_closed' : '_doc')));

      // update the plus/minus gadget:
      this.div.gadget.innerHTML = this.getImg((this.control.grid ? (this.control.root == this ? (this.nodes.length ? 'R' : '') : (this.last ? 'L' : 'T')) : '') + (this.nodes.length ? (this.open ? 'minus' : 'plus') : ''));

      // show/hide subnodes:
      this.div.sub.style.display = this.open ? 'block' : 'none';

    }

    // if recursively updating, update all child nodes:
    if (recursive) {
      this.nodes.forEach(function(node) {
        node.update(true, invalidated);
      });
    }

  },

  /*
  Property: getImg
    Creates a new image, in the form of HTML for a DIV element with appropriate style.
    You should not need to manually call this method. (though if for some reason you want to, you can)

  Parameters:
    name - the name of new image to create, defined by <MooTreeIcon> or located in an external file.

  Returns:
    The HTML for a new div Element.
  */

  getImg: function(name) {

    var html = '<div class="mooTree_img"';

    if (name != '') {
      var img = this.control.theme;
      var i = MooTreeIcon.indexOf(name);
      if (i == -1) {
        // custom (external) icon:
        var x = name.split('#');
        img = x[0];
        i = (x.length == 2 ? parseInt(x[1]) - 1 : 0);
      }
      html += ' style="background-image:url(' + img + '); background-position:-' + (i * 18) + 'px 0px;"';
    }

    html += '></div>';

    return html;

  },

  /*
  Property: toggle
    By default (with no arguments) this function toggles the node between expanded/collapsed.
    Can also be used to recursively expand/collapse all or part of the tree.

  Parameters:
    recursive - boolean, defaults to false. With recursive set to true, all child nodes are recursively toggle to this node's new state.
    state - boolean. If undefined, the node's state is toggled. If true or false, the node can be explicitly opened or closed.
  */

  toggle: function(recursive, state) {

    this.open = (state === undefined ? !this.open : state);
    this.update();

    this.onExpand(this.open);
    this.control.onExpand(this, this.open);

    if (recursive) {
      this.nodes.forEach(function(node) {
        node.toggle(true, this.open);
      }, this);
    }

  },

  /*
  Property: select
    Called by <MooTreeControl> when the selection changes.
    You should not manually call this method - to set the selection, use the <MooTreeControl.select> method.
  */

  select: function(state) {
    this.selected = state;
    this.update();
    this.onSelect(state);
  },

  /*
  Property: load
    Asynchronously load an XML structure into a node of this tree.

  Parameters:
    url - string, required, specifies the URL from which to load the XML document.
    vars - query string, optional.
  */

  load: function(url, vars) {

    if (this.loading) {
      return;
    } // if this node is already loading, return
    this.loading = true;      // flag this node as loading

    this.toggle(false, true); // expand the node to make the loader visible

    this.clear();

    this.insert(this.control.loader);

    var f = function() {
      new Request({
        method: 'GET',
        url: url,
        onSuccess: this._loaded.bind(this),
        onFailure: this._load_err.bind(this)
      }).send(url, vars || '');
    }.bind(this).delay(20);

    //window.setTimeout(f.bind(this), 20); // allowing a small delay for the browser to draw the loader-icon.

  },

  _loaded: function(text, xml) {
    // called on success - import nodes from the root element:
    this.control.disable();
    this.clear();
    this._import(xml.documentElement);
    this.control.enable();
    this.loading = false;
  },

  _import: function(e) {
    // import childnodes from an xml element:
    var n = e.childNodes;
    for (var i = 0; i < n.length; i++) {
      if (n[i].tagName == 'node') {
        var opt = {data: {}};
        var a = n[i].attributes;
        for (var t = 0; t < a.length; t++) {
          switch (a[t].name) {
            case 'text':
            case 'id':
            case 'icon':
            case 'openicon':
            case 'color':
            case 'open':
              opt[a[t].name] = a[t].value;
              break;
            default:
              opt.data[a[t].name] = a[t].value;
          }
        }

        var node = this.insert(opt);
        if (node.data.load) {
          node.open = false; // can't have a dynamically loading node that's already open!
          node.insert(this.control.loader);
          node.onExpand = function(state) {
            this.load(this.data.load);
            this.onExpand = new Function();
          };
        }

      // recursively import subnodes of this node:
        if (n[i].childNodes.length) {
          node._import(n[i]);
        }
      }
    }
  },

  _load_err: function() {
    Utils.modalAlert(window.translations('media-js-Error_loading_content-try_again'), null, true);
  }

});


/*
 *  These Are Changes for Igloo's use:
 */

var OriginalMooTreeControl = MooTreeControl;

MooTreeControl = new Class({
  Extends: OriginalMooTreeControl,

  initialize: function(config, options) {
    this.nodeClass = config.nodeClass || MooTreeNode;

    options.control = this;               // make sure our new MooTreeNode knows who it's owner control is
    options.div = config.div;             // tells the root node which div to insert itself into
    this.root = new this.nodeClass(options);      // create the root node of this tree control

    this.index = new Object();              // used by the get() method

    this.enabled = true;                // enable visual updates of the control

    this.theme = config.theme || 'mootree.gif';

    this.loader = config.loader || {icon: 'mootree_loader.gif', text: 'Loading...', color: '#a0a0a0'};

    this.selected = null;               // set the currently selected node to nothing
    this.mode = config.mode;              // mode can be "folders" or "files", and affects the default icons
    this.grid = config.grid;              // grid can be turned on (true) or off (false)

    this.onExpand = config.onExpand || new Function();  // called when any node in the tree is expanded/collapsed
    this.onSelect = config.onSelect || new Function();  // called when any node in the tree is selected/deselected
    this.onClick = config.onClick || new Function();  // called when any node in the tree is clicked

    this.root.update(true);

    this.preselected = config.preselected || null;

    this.selectableTypes = config.selectableTypes || ['folder'];
    this.clickableTypes = config.clickableTypes || ['folder'];
    this.filterImages = config.filterImages || false;
  },

  select: function(node) {
    if (!node) {
      return;
    }
    if (!node.selectable) {
      return;
    }

    this.parent(node);
  },
  unselectall: function() {
    delete this.selected;
    Object.each(this.root.nodes, function(node) {
      if (node.selected) {
        node.selected = false;
        node.update();
      }
      this.unselectchildren(node);
    }.bind(this));
  },
  unselectchildren: function(node) {
    var self = this;
    Object.each(node.nodes, function(node) {
      if (node.selected) {
        node.selected = false;
        node.update();
      }
      if (node.nodes.length > 0) {
        self.unselectchildren(node);
      }
    });
  }
});

var OriginalMooTreeNode = MooTreeNode;

MooTreeNode = new Class({
  Extends: OriginalMooTreeNode,

  initialize: function(options) {

    this.text = options.text.replace('&amp;', '&').replace('&#39;', '\''); // the text displayed by this node
    this.id = options.id || null; // the node's unique id
    this.nodes = []; // subnodes nested beneath this node (MooTreeNode objects)
    this.parent = null; // this node's parent node (another MooTreeNode object)
    this.last = true; // a flag telling whether this node is the last (bottom) node of it's parent
    this.control = options.control; // owner control of this node's tree
    this.selected = false; // a flag telling whether this node is the currently selected node in it's tree
    this.selectable = (options.selectable === 'undefined' || options.selectable === null) ? true : options.selectable; // says that by default a node is selectable
    this.clickable = (options.clickable === 'undefined' || options.clickable === null) ? true : options.clickable; // says that by default a node responds to a click event
    this.color = options.color || null; // text color of this node
    this.data = options.data || {}; // optional object containing whatever data you wish to associate with the node (typically an url or an id)
    this.onExpand = options.onExpand ||
    function() {}; // called when the individual node is expanded/collapsed
    this.onSelect = options.onSelect ||
    function() {}; // called when the individual node is selected/deselected
    this.onClick = options.onClick ||
    function() {}; // called when the individual node is clicked
    this.open = options.open ? true : false; // flag: node open or closed?
    this.icon = options.icon;
    this.openicon = options.openicon || this.icon;
    this.href = options.href;
    this.nodeClass = this.control.nodeClass || MooTreeNode;

    // add the node to the control's node index:
    if (this.id) {
      this.control.index[this.id] = this;
    }

    // create the necessary divs:
    this.div = {
      main: new Element('div').addClass('mooTree_node'),
      indent: new Element('div'),
      gadget: new Element('div'),
      icon: new Element('div'),
      text: new Element('div').addClass('mooTree_text'),
      sub: new Element('div')
    };

    // put the other divs under the main div:
    this.div.main.adopt(this.div.indent);
    this.div.main.adopt(this.div.gadget);
    this.div.main.adopt(this.div.icon);
    this.div.main.adopt(this.div.text);

    // put the main and sub divs in the specified parent div:
    $(options.div).adopt(this.div.main);
    $(options.div).adopt(this.div.sub);

    // attach event handler to gadget:
    this.div.gadget._node = this;
    this.div.gadget.onclick = this.div.gadget.ondblclick = function() {
      this._node.toggle();
    };

    // attach event handler to icon/text:
    if (this.clickable) {
      this.div.text.addClass('mooTree_clickable');
      this.div.icon._node = this.div.text._node = this;
      this.div.icon.onclick = this.div.icon.ondblclick = this.div.text.onclick = this.div.text.ondblclick = function() {
        this._node.control.select(this._node);
      };
    }

  },

  insert: function(options) {

    // set the parent div and create the node:
    options.div = this.div.sub;
    options.control = this.control;
    var node = new this.nodeClass(options);

    // set the new node's parent:
    node.parent = this;

    // mark this node's last node as no longer being the last, then add the new last node:
    var n = this.nodes;
    if (n.length) {
      n[n.length - 1].last = false;
    }
    n.push(node);

    // repaint the new node:
    node.update();

    // repaint the new node's parent (this node):
    if (n.length == 1) {
      this.update();
    }

    // recursively repaint the new node's previous sibling node:
    if (n.length > 1) {
      n[n.length - 2].update(true);
    }

    return node;

  },

  select: function(state) {
    if (this.selectable) {
      this.selected = state;
      this.update();
      this.onSelect(state);
    }
  },

  load: function(id, vars) {

    if (this.loading) {
      return;
    } // if this node is already loading, return
    this.loading = true; // flag this node as loading
    this.clear();

    var loadChildren = new ApiClient({
      debug: false,
      method: 'get',
      headers: {Accept: 'application/xml'},
      apimethod: 'objects/' + id + '/children/viewsmall',
      queryparams: {
        maxcount: 1000,
        orderby: 'TitleAsc',
        groupFolders: true,
        filterImages: this.control.filterImages
      },
      onSuccess: this._loaded.bind(this),
      onFailure: this._load_err.bind(this),
      onRequest: function() {
        $(this.div.gadget.firstChild).addClass('gadgetloading');
      }.bind(this),
      onComplete: function() {
        $(this.div.gadget.firstChild).removeClass('gadgetloading');
      }.bind(this)
    });
  },

  /* here is the new version, made for the igloo response*/
  _import: function(e) {

    /* this code needs to change whenever the API changes. ptoooey. */
    var cnode;
    var n1 = e.childNodes;
    var i1, i2;
    for (i1 = 0; i1 < n1.length; i1++) {
      if (n1[i1].tagName.toLowerCase() === 'response') {
        e2 = n1[i1]; // e2 is the "response" element
        var n2 = e2.childNodes; //
        for (i2 = 0; i2 < n2.length; i2++) {
          if (n2[i2].tagName.toLowerCase() === 'items') {
            e3 = n2[i2]; // e3 is the "items" element
            cnode = n2[i2];
            break;
          }
        }
        break;
      }
    }

    // import childnodes from an xml element:
    if (cnode && cnode.childNodes) {
      var n = cnode.childNodes;
      var i;
      for (i = 0; i < n.length; i++) {
        if (n[i].tagName === 'object') {
          var objnode = n[i];
          var opt = {
            data: {}
          };
          var a = objnode.childNodes;
          showme = true;
          var text, href, id, childcount,

            // yay fragmen-freakin-tation!
            // our API returns object type as an attribute of the object node when calling one API
            // and returns it as a node 'objecttype' when calling another, similar, API
            // this is a very handy and undocumented feature used to deter developers from using our APIs!
            // namespacing the type attribute is also a very nice touch, thank you So Much for over-engineering this.
            type = objnode.getAttribute('i:type').toLowerCase();
          var t;
          for (t = 0; t < a.length; t++) {
            if (a[t].tagName.toLowerCase() === 'title') {
              text = Utils.htmldecode(a[t].firstChild.nodeValue);
            }
            if (a[t].tagName.toLowerCase() === 'href') {
              if (a[t].firstChild) {
                href = a[t].firstChild.nodeValue;
              }
            }
            if (a[t].tagName.toLowerCase() === 'id') {
              id = a[t].firstChild.nodeValue;
            }
            if (a[t].tagName.toLowerCase() === 'statistics') {
              try {
                childcount = a[t].childNodes[1].childNodes[0].firstChild.nodeValue;
              } catch (ex) {
                childcount = 0;
              }
            }
            if (a[t].tagName.toLowerCase() === 'objecttype') {
              type = a[t].firstChild.nodeValue.toLowerCase();
            }
          }

          opt.data.objectid = id;
          if (type === 'folder') {
            opt.data.load = id;
            opt.icon = '_closed';
            opt.openicon = '_open';
          }
          opt.clickable = this.control.clickableTypes.contains(type);
          opt.selectable = this.control.selectableTypes.contains(type);
          opt.id = id;
          opt.text = text;
          opt.href = href;

          var node = this.insert(opt);
          if (node.data.load) {
            node.open = false; // can't have a dynamically loading node that's already open!
            node.insert(this.control.loader);
            node.onExpand = function(state) {
              this.load(this.data.load);
              this.onExpand = function() {};
            };
          }

          // check if any are in the preselected ancestry
          var preselected = this.control.preselected,
            iii;
          for (iii = 0; iii < preselected.length; iii++) {
            var lookfor = preselected[iii];
            if (node.id === lookfor) {
              node.toggle(false, true);
              node.control.select(node);

              var oft = node.div.main.offsetTop;
              var post = node.div.main.getCoordinates();
              post = post.top;
              var containerheight = $('mytreecontainer').getCoordinates();
              containerheight = containerheight.height;

              $('mytreecontainer').scrollTop = oft - (containerheight / 2);
            }
          }
        }
      }
    }
  }
});

var UploaderMooTreeNode = new Class({
  Extends: MooTreeNode,

  initialize: function(options) {

    this.text = options.text.replace('&amp;', '&').replace('&#39;', '\''); // the text displayed by this node
    this.id = options.id || null; // the node's unique id
    this.nodes = []; // subnodes nested beneath this node (MooTreeNode objects)
    this.parent = null; // this node's parent node (another MooTreeNode object)
    this.last = true; // a flag telling whether this node is the last (bottom) node of it's parent
    this.control = options.control; // owner control of this node's tree
    this.selected = false; // a flag telling whether this node is the currently selected node in it's tree
    this.selectable = (options.selectable === 'undefined' || options.selectable === null) ? true : options.selectable; // says that by default a node is selectable
    this.clickable = (options.clickable === 'undefined' || options.clickable === null) ? true : options.clickable; // says that by default a node responds to a click event
    this.color = options.color || null; // text color of this node
    this.data = options.data || {}; // optional object containing whatever data you wish to associate with the node (typically an url or an id)
    this.onExpand = options.onExpand ||
    function() {}; // called when the individual node is expanded/collapsed
    this.onSelect = options.onSelect ||
    function() {}; // called when the individual node is selected/deselected
    this.onClick = options.onClick ||
    function() {}; // called when the individual node is clicked
    this.open = options.open ? true : false; // flag: node open or closed?
    this.icon = options.icon;
    this.spaceicon = options.spaceicon || this.icon;
    this.communityicon = options.communityicon || this.icon;
    this.openicon = options.openicon || this.icon;
    this.href = options.href;
    this.nodeClass = this.control.nodeClass || MooTreeNode;
    this.type = options.type;
    this.watermark = options.watermark;

    // add the node to the control's node index:
    if (this.id) {
      this.control.index[this.id] = this;
    }

    // create the necessary divs:
    this.div = {
      main: new Element('div').addClass('mooTree_node'),
      indent: new Element('div'),
      gadget: new Element('div'),
      icon: new Element('div'),
      text: new Element('div').addClass('mooTree_text'),
      sub: new Element('div')
    };

    // put the other divs under the main div:
    this.div.main.adopt(this.div.indent);
    this.div.main.adopt(this.div.gadget);
    this.div.main.adopt(this.div.icon);
    this.div.main.adopt(this.div.text);

    // put the main and sub divs in the specified parent div:
    $(options.div).adopt(this.div.main);
    $(options.div).adopt(this.div.sub);

    // attach event handler to gadget:
    this.div.gadget._node = this;
    this.div.gadget.onclick = this.div.gadget.ondblclick = function() {
      this._node.toggle();
      this._node.control.select(this._node);
    };

    // attach event handler to icon/text:
    if (this.clickable) {
      this.div.text.addClass('mooTree_clickable');
      this.div.icon._node = this.div.text._node = this;
      this.div.icon.onclick = this.div.icon.ondblclick = this.div.text.onclick = this.div.text.ondblclick = function() {
        this._node.toggle();
        this._node.control.select(this._node);
      };
    } else {
      this.div.text.addClass('mooTree_clickable');
      this.div.icon._node = this.div.text._node = this;
      this.div.icon.onclick = this.div.icon.ondblclick = this.div.text.onclick = this.div.text.ondblclick = function() {
        this._node.toggle();
      };
    }

  },
  load: function(id, vars) {

    if (this.loading) {
      return;
    } // if this node is already loading, return
    this.loading = true; // flag this node as loading
    this.clear();

    var loadChildren = new ApiClient({
      debug: false,
      method: 'get',
      headers: {Accept: 'application/xml'},

      apimethod: 'folders/' + id + '/children/byType',
      queryparams: {
        perPage: 1000,
        objectType: 2 // objectType=1 and filetype=2 gives you images, objectType=2 gives you folders
      },

      onSuccess: this._loaded.bind(this),
      onFailure: this._load_err.bind(this),
      onRequest: function() {
        $(this.div.gadget.firstChild).addClass('gadgetloading');
      }.bind(this),
      onComplete: function() {
        $(this.div.gadget.firstChild).removeClass('gadgetloading');
      }.bind(this)
    });
  },
  update: function(recursive, invalidated) {

    var draw = true;

    if (!this.control.enabled) {
      // control is currently disabled, so we don't do any visual updates
      this.invalidated = true;
      draw = false;
    }

    if (invalidated) {
      if (!this.invalidated) {
        draw = false; // this one is still valid, don't draw
      } else {
        this.invalidated = false; // we're drawing this item now
      }
    }

    if (draw) {

      var x;

      // make selected, or not:
      this.div.main.className = 'mooTree_node' + (this.selected ? ' mooTree_selected' : '');

      // update indentations:
      var p = this, i = '';
      while (p.parent) {
        p = p.parent;
        i = this.getImg(p.last || !this.control.grid ? '' : 'I') + i;
      }
      this.div.indent.innerHTML = i;

      // update the text:
      x = this.div.text;
      x.empty();
      x.appendText(this.text);
      if (this.color) {
        x.style.color = this.color;
      }

      // update the icon:
      if (this.clickable && this.type != 'space') {
        this.div.icon.innerHTML = this.getImg(this.nodes.length ? (this.open ? (this.openicon || this.icon || '_open') : (this.icon || '_closed')) : (this.icon || (this.control.mode == 'folders' ? '_closed' : '_doc')));
      } else if (this.type == 'space') {
        this.div.icon.innerHTML = this.getImg(this.spaceicon || this.icon || '');
      }

      // update the plus/minus gadget:
      this.div.gadget.innerHTML = this.getImg((this.control.grid ? (this.control.root == this ? (this.nodes.length ? 'R' : '') : (this.last ? 'L' : 'T')) : '') + (this.nodes.length ? (this.open ? 'minus' : 'plus') : ''));

      // show/hide subnodes:
      this.div.sub.style.display = this.open ? 'block' : 'none';

    }

    // if recursively updating, update all child nodes:
    if (recursive) {
      this.nodes.forEach(function(node) {
        node.update(true, invalidated);
      });
    }

  }

});

var ImageInserterNode = new Class({
  Extends: MooTreeNode,

  load: function(id, vars) {

    if (this.loading) {
      return;
    } // if this node is already loading, return
    this.loading = true; // flag this node as loading
    this.clear();

    var loadChildren = new ApiClient({
      debug: false,
      method: 'get',
      headers: {Accept: 'application/xml'},

      apimethod: 'folders/' + id + '/children/byType',
      queryparams: {
        perPage: 1000,
        objectType: 2 // objectType=1 and filetype=2 gives you images, objectType=2 gives you folders
      },

      onSuccess: this._loaded.bind(this),
      onFailure: this._load_err.bind(this),
      onRequest: function() {
        $(this.div.gadget.firstChild).addClass('gadgetloading');
      }.bind(this),
      onComplete: function() {
        $(this.div.gadget.firstChild).removeClass('gadgetloading');
      }.bind(this)
    });
  }

});
Ә