--- /dev/null
+/*!
+ * Ext JS Library 3.3.1
+ * Copyright(c) 2006-2010 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
+ */
+/**
+ * @class Ext.ux.StartMenu
+ * @extends Ext.menu.Menu
+ * A start menu object.
+ * @constructor
+ * Creates a new StartMenu
+ * @param {Object} config Configuration options
+ *
+ * SAMPLE USAGE:
+ *
+ * this.startMenu = new Ext.ux.StartMenu({
+ * iconCls: 'user',
+ * height: 300,
+ * shadow: true,
+ * title: get_cookie('memberName'),
+ * width: 300
+ * });
+ *
+ * this.startMenu.add({
+ * text: 'Grid Window',
+ * iconCls:'icon-grid',
+ * handler : this.createWindow,
+ * scope: this
+ * });
+ *
+ * this.startMenu.addTool({
+ * text:'Logout',
+ * iconCls:'logout',
+ * handler:function(){ window.location = "logout.php"; },
+ * scope:this
+ * });
+ */
+
+Ext.namespace("Ext.ux");
+
+Ext.ux.StartMenu = Ext.extend(Ext.menu.Menu, {
+ initComponent: function(config) {
+ Ext.ux.StartMenu.superclass.initComponent.call(this, config);
+
+ var tools = this.toolItems;
+ this.toolItems = new Ext.util.MixedCollection();
+ if(tools){
+ this.addTool.apply(this, tools);
+ }
+ },
+
+ // private
+ onRender : function(ct, position){
+ Ext.ux.StartMenu.superclass.onRender.call(this, ct, position);
+ var el = this.el.addClass('ux-start-menu');
+
+ var header = el.createChild({
+ tag: "div",
+ cls: "x-window-header x-unselectable x-panel-icon "+this.iconCls
+ });
+
+ this.header = header;
+
+ var headerText = header.createChild({
+ tag: "span",
+ cls: "x-window-header-text"
+ });
+ var tl = header.wrap({
+ cls: "ux-start-menu-tl"
+ });
+ var tr = header.wrap({
+ cls: "ux-start-menu-tr"
+ });
+ var tc = header.wrap({
+ cls: "ux-start-menu-tc"
+ });
+
+ this.menuBWrap = el.createChild({
+ tag: "div",
+ cls: "x-window-body x-border-layout-ct ux-start-menu-body"
+ });
+ var ml = this.menuBWrap.wrap({
+ cls: "ux-start-menu-ml"
+ });
+ var mc = this.menuBWrap.wrap({
+ cls: "x-window-mc ux-start-menu-bwrap"
+ });
+
+ this.menuPanel = this.menuBWrap.createChild({
+ tag: "div",
+ cls: "x-panel x-border-panel ux-start-menu-apps-panel"
+ });
+ this.toolsPanel = this.menuBWrap.createChild({
+ tag: "div",
+ cls: "x-panel x-border-panel ux-start-menu-tools-panel"
+ });
+
+ var bwrap = ml.wrap({cls: "x-window-bwrap"});
+ var bc = bwrap.createChild({
+ tag: "div",
+ cls: "ux-start-menu-bc"
+ });
+ var bl = bc.wrap({
+ cls: "ux-start-menu-bl x-panel-nofooter"
+ });
+ var br = bc.wrap({
+ cls: "ux-start-menu-br"
+ });
+
+ this.ul.appendTo(this.menuPanel);
+
+ var toolsUl = this.toolsPanel.createChild({
+ tag: "ul",
+ cls: "x-menu-list"
+ });
+
+ this.mon(toolsUl, 'click', this.onClick, this);
+ this.mon(toolsUl, 'mouseover', this.onMouseOver, this);
+ this.mon(toolsUl, 'mouseout', this.onMouseOut, this);
+
+ this.items.each(function(item){
+ item.parentMenu = this;
+ }, this);
+
+ this.toolItems.each(
+ function(item){
+ var li = document.createElement("li");
+ li.className = "x-menu-list-item";
+ toolsUl.dom.appendChild(li);
+ item.render(li);
+ item.parentMenu = this;
+ }, this);
+
+ this.toolsUl = toolsUl;
+
+ this.menuBWrap.setStyle('position', 'relative');
+ this.menuBWrap.setHeight(this.height - 28);
+
+ this.menuPanel.setStyle({
+ padding: '2px',
+ position: 'absolute',
+ overflow: 'auto'
+ });
+
+ this.toolsPanel.setStyle({
+ padding: '2px 4px 2px 2px',
+ position: 'absolute',
+ overflow: 'auto'
+ });
+
+ this.setTitle(this.title);
+ },
+
+ // private
+ findTargetItem : function(e){
+ var t = e.getTarget(".x-menu-list-item", this.ul, true);
+ if(t && t.menuItemId){
+ if(this.items.get(t.menuItemId)){
+ return this.items.get(t.menuItemId);
+ }else{
+ return this.toolItems.get(t.menuItemId);
+ }
+ }
+ },
+
+ /**
+ * Displays this menu relative to another element
+ * @param {Mixed} element The element to align to
+ * @param {String} position (optional) The {@link Ext.Element#alignTo} anchor position to use in aligning to
+ * the element (defaults to this.defaultAlign)
+ * @param {Ext.ux.StartMenu} parentMenu (optional) This menu's parent menu, if applicable (defaults to undefined)
+ */
+ show : function(el, pos, parentMenu){
+ this.parentMenu = parentMenu;
+ if(!this.el){
+ this.render();
+ }
+
+ this.fireEvent("beforeshow", this);
+ this.showAt(this.el.getAlignToXY(el, pos || this.defaultAlign), parentMenu, false);
+ var tPanelWidth = 100;
+ var box = this.menuBWrap.getBox();
+ this.menuPanel.setWidth(box.width-tPanelWidth);
+ this.menuPanel.setHeight(box.height);
+
+ this.toolsPanel.setWidth(tPanelWidth);
+ this.toolsPanel.setX(box.x+box.width-tPanelWidth);
+ this.toolsPanel.setHeight(box.height);
+ },
+
+ addTool : function(){
+ var a = arguments, l = a.length, item;
+ for(var i = 0; i < l; i++){
+ var el = a[i];
+ if(el.render){ // some kind of Item
+ item = this.addToolItem(el);
+ }else if(typeof el == "string"){ // string
+ if(el == "separator" || el == "-"){
+ item = this.addToolSeparator();
+ }else{
+ item = this.addText(el);
+ }
+ }else if(el.tagName || el.el){ // element
+ item = this.addElement(el);
+ }else if(typeof el == "object"){ // must be menu item config?
+ item = this.addToolMenuItem(el);
+ }
+ }
+ return item;
+ },
+
+ /**
+ * Adds a separator bar to the Tools
+ * @return {Ext.menu.Item} The menu item that was added
+ */
+ addToolSeparator : function(){
+ return this.addToolItem(new Ext.menu.Separator({itemCls: 'ux-toolmenu-sep'}));
+ },
+
+ addToolItem : function(item){
+ this.toolItems.add(item);
+ if(this.ul){
+ var li = document.createElement("li");
+ li.className = "x-menu-list-item";
+ this.ul.dom.appendChild(li);
+ item.render(li, this);
+ this.delayAutoWidth();
+ }
+ return item;
+ },
+
+ addToolMenuItem : function(config){
+ if(!(config instanceof Ext.menu.Item)){
+ if(typeof config.checked == "boolean"){ // must be check menu item config?
+ config = new Ext.menu.CheckItem(config);
+ }else{
+ config = new Ext.menu.Item(config);
+ }
+ }
+ return this.addToolItem(config);
+ },
+
+ setTitle : function(title, iconCls){
+ this.title = title;
+ this.header.child('span').update(title);
+ return this;
+ }
+});
\ No newline at end of file
git.ithinksw.org / extjs.git / blobdiff