function DropdownMenu(parent)
{
	Text.call(this, parent);

	this.element.style.backgroundColor = "var(--bar-color)";
	this.element.style.cursor = "pointer";
	this.element.style.pointerEvents = "auto";

	this.preventDragEvents();

	/**
	 * Element, where the options are stored.
	 *
	 * This DOM element is added directly to the parent DOM element.
	 *
	 * @attribute panel
	 * @type {Component}
	 */
	this.panel = new Component(parent, "div");
	this.panel.element.style.overflow = "visible";
	this.panel.element.style.display = "none";
	this.panel.element.style.zIndex = "300";

	/**
	 * Option icon image, the element is only created when a icon is set.
	 *
	 * @attribute icon
	 * @type {Component}
	 */
	this.icon = null;

	/**
	 * Decorative arrow.
	 *
	 * @attribute arrow
	 * @type {Component}
	 */
	this.arrow = document.createElement("img");
	this.arrow.style.display = "none";
	this.arrow.style.position = "absolute";
	this.arrow.style.right = "5px";
	this.arrow.style.top = "3px";
	this.arrow.style.width = "12px";
	this.arrow.style.height = "12px";
	this.arrow.src = Global.FILE_PATH + "icons/misc/arrow_right.png";
	this.element.appendChild(this.arrow);

	/**
	 * Direction to open the dropdown.
	 *
	 * @attribute direction
	 * @type {number}
	 */
	this.direction = DropdownMenu.DOWN;
	
	/**
	 * Indicates if the dropdown menu is expanded.
	 *
	 * @attribute expanded
	 * @type {boolean}
	 */
	this.expanded = false;

	/**
	 * Size of each dropdown menu option.
	 *
	 * @attribute optionsSize
	 * @type {Vector2}
	 */
	this.optionsSize = new Vector2(150, 20);

	/**
	 * Options available in the dropdown.
	 *
	 * Options are stored as: {button:button, value:object, name:string}
	 *
	 * @attribute options
	 * @type {Array}
	 */
	this.options = [];

	var self = this;

	this.addEvent("mouseenter", function()
	{
		self.setExpanded(true);
		self.element.style.backgroundColor = "var(--button-over-color)";
	});

	this.addEvent("mouseleave", function()
	{
		self.setExpanded(false);
		self.element.style.backgroundColor = "var(--bar-color)";
	});
	
	this.panel.addEvent("mouseenter", function()
	{
		self.setExpanded(true);
	});

	this.panel.addEvent("mouseleave", function()
	{
		self.setExpanded(false);
	});
}
Dropdown menu element, used to create dropdowns in menu bars and in context menus.

@class DropdownMenu
@extends {Text}
@param {Component} parent Parent element.