You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
188 lines
6.2 KiB
JavaScript
188 lines
6.2 KiB
JavaScript
12 years ago
|
require({cache:{
|
||
|
'url:dijit/templates/MenuItem.html':"<tr class=\"dijitReset dijitMenuItem\" data-dojo-attach-point=\"focusNode\" role=\"menuitem\" tabIndex=\"-1\">\n\t<td class=\"dijitReset dijitMenuItemIconCell\" role=\"presentation\">\n\t\t<img src=\"${_blankGif}\" alt=\"\" class=\"dijitIcon dijitMenuItemIcon\" data-dojo-attach-point=\"iconNode\"/>\n\t</td>\n\t<td class=\"dijitReset dijitMenuItemLabel\" colspan=\"2\" data-dojo-attach-point=\"containerNode\"></td>\n\t<td class=\"dijitReset dijitMenuItemAccelKey\" style=\"display: none\" data-dojo-attach-point=\"accelKeyNode\"></td>\n\t<td class=\"dijitReset dijitMenuArrowCell\" role=\"presentation\">\n\t\t<div data-dojo-attach-point=\"arrowWrapper\" style=\"visibility: hidden\">\n\t\t\t<img src=\"${_blankGif}\" alt=\"\" class=\"dijitMenuExpand\"/>\n\t\t\t<span class=\"dijitMenuExpandA11y\">+</span>\n\t\t</div>\n\t</td>\n</tr>\n"}});
|
||
|
define("dijit/MenuItem", [
|
||
|
"dojo/_base/declare", // declare
|
||
|
"dojo/dom", // dom.setSelectable
|
||
|
"dojo/dom-attr", // domAttr.set
|
||
|
"dojo/dom-class", // domClass.toggle
|
||
|
"dojo/_base/kernel", // kernel.deprecated
|
||
|
"dojo/sniff", // has("ie")
|
||
|
"./_Widget",
|
||
|
"./_TemplatedMixin",
|
||
|
"./_Contained",
|
||
|
"./_CssStateMixin",
|
||
|
"dojo/text!./templates/MenuItem.html"
|
||
|
], function(declare, dom, domAttr, domClass, kernel, has,
|
||
|
_Widget, _TemplatedMixin, _Contained, _CssStateMixin, template){
|
||
|
|
||
|
// module:
|
||
|
// dijit/MenuItem
|
||
|
|
||
|
return declare("dijit.MenuItem",
|
||
|
[_Widget, _TemplatedMixin, _Contained, _CssStateMixin],
|
||
|
{
|
||
|
// summary:
|
||
|
// A line item in a Menu Widget
|
||
|
|
||
|
// Make 3 columns
|
||
|
// icon, label, and expand arrow (BiDi-dependent) indicating sub-menu
|
||
|
templateString: template,
|
||
|
|
||
|
baseClass: "dijitMenuItem",
|
||
|
|
||
|
// label: String
|
||
|
// Menu text
|
||
|
label: "",
|
||
|
_setLabelAttr: function(val){
|
||
|
this.containerNode.innerHTML = val;
|
||
|
this._set("label", val);
|
||
|
if(this.textDir === "auto"){
|
||
|
this.applyTextDir(this.focusNode, this.label);
|
||
|
}
|
||
|
},
|
||
|
|
||
|
// iconClass: String
|
||
|
// Class to apply to DOMNode to make it display an icon.
|
||
|
iconClass: "dijitNoIcon",
|
||
|
_setIconClassAttr: { node: "iconNode", type: "class" },
|
||
|
|
||
|
// accelKey: String
|
||
|
// Text for the accelerator (shortcut) key combination.
|
||
|
// Note that although Menu can display accelerator keys there
|
||
|
// is no infrastructure to actually catch and execute these
|
||
|
// accelerators.
|
||
|
accelKey: "",
|
||
|
|
||
|
// disabled: Boolean
|
||
|
// If true, the menu item is disabled.
|
||
|
// If false, the menu item is enabled.
|
||
|
disabled: false,
|
||
|
|
||
|
_fillContent: function(/*DomNode*/ source){
|
||
|
// If button label is specified as srcNodeRef.innerHTML rather than
|
||
|
// this.params.label, handle it here.
|
||
|
if(source && !("label" in this.params)){
|
||
|
this.set('label', source.innerHTML);
|
||
|
}
|
||
|
},
|
||
|
|
||
|
buildRendering: function(){
|
||
|
this.inherited(arguments);
|
||
|
var label = this.id+"_text";
|
||
|
domAttr.set(this.containerNode, "id", label);
|
||
|
if(this.accelKeyNode){
|
||
|
domAttr.set(this.accelKeyNode, "id", this.id + "_accel");
|
||
|
label += " " + this.id + "_accel";
|
||
|
}
|
||
|
this.domNode.setAttribute("aria-labelledby", label);
|
||
|
dom.setSelectable(this.domNode, false);
|
||
|
},
|
||
|
|
||
|
onClick: function(/*Event*/){
|
||
|
// summary:
|
||
|
// User defined function to handle clicks
|
||
|
// tags:
|
||
|
// callback
|
||
|
},
|
||
|
|
||
|
focus: function(){
|
||
|
// summary:
|
||
|
// Focus on this MenuItem
|
||
|
try{
|
||
|
if(has("ie") == 8){
|
||
|
// needed for IE8 which won't scroll TR tags into view on focus yet calling scrollIntoView creates flicker (#10275)
|
||
|
this.containerNode.focus();
|
||
|
}
|
||
|
this.focusNode.focus();
|
||
|
}catch(e){
|
||
|
// this throws on IE (at least) in some scenarios
|
||
|
}
|
||
|
},
|
||
|
|
||
|
_onFocus: function(){
|
||
|
// summary:
|
||
|
// This is called by the focus manager when focus
|
||
|
// goes to this MenuItem or a child menu.
|
||
|
// tags:
|
||
|
// protected
|
||
|
this._setSelected(true);
|
||
|
this.getParent()._onItemFocus(this);
|
||
|
|
||
|
this.inherited(arguments);
|
||
|
},
|
||
|
|
||
|
_setSelected: function(selected){
|
||
|
// summary:
|
||
|
// Indicate that this node is the currently selected one
|
||
|
// tags:
|
||
|
// private
|
||
|
|
||
|
/***
|
||
|
* TODO: remove this method and calls to it, when _onBlur() is working for MenuItem.
|
||
|
* Currently _onBlur() gets called when focus is moved from the MenuItem to a child menu.
|
||
|
* That's not supposed to happen, but the problem is:
|
||
|
* In order to allow dijit.popup's getTopPopup() to work,a sub menu's popupParent
|
||
|
* points to the parent Menu, bypassing the parent MenuItem... thus the
|
||
|
* MenuItem is not in the chain of active widgets and gets a premature call to
|
||
|
* _onBlur()
|
||
|
*/
|
||
|
|
||
|
domClass.toggle(this.domNode, "dijitMenuItemSelected", selected);
|
||
|
},
|
||
|
|
||
|
setLabel: function(/*String*/ content){
|
||
|
// summary:
|
||
|
// Deprecated. Use set('label', ...) instead.
|
||
|
// tags:
|
||
|
// deprecated
|
||
|
kernel.deprecated("dijit.MenuItem.setLabel() is deprecated. Use set('label', ...) instead.", "", "2.0");
|
||
|
this.set("label", content);
|
||
|
},
|
||
|
|
||
|
setDisabled: function(/*Boolean*/ disabled){
|
||
|
// summary:
|
||
|
// Deprecated. Use set('disabled', bool) instead.
|
||
|
// tags:
|
||
|
// deprecated
|
||
|
kernel.deprecated("dijit.Menu.setDisabled() is deprecated. Use set('disabled', bool) instead.", "", "2.0");
|
||
|
this.set('disabled', disabled);
|
||
|
},
|
||
|
_setDisabledAttr: function(/*Boolean*/ value){
|
||
|
// summary:
|
||
|
// Hook for attr('disabled', ...) to work.
|
||
|
// Enable or disable this menu item.
|
||
|
|
||
|
this.focusNode.setAttribute('aria-disabled', value ? 'true' : 'false');
|
||
|
this._set("disabled", value);
|
||
|
},
|
||
|
_setAccelKeyAttr: function(/*String*/ value){
|
||
|
// summary:
|
||
|
// Hook for attr('accelKey', ...) to work.
|
||
|
// Set accelKey on this menu item.
|
||
|
|
||
|
this.accelKeyNode.style.display=value?"":"none";
|
||
|
this.accelKeyNode.innerHTML=value;
|
||
|
//have to use colSpan to make it work in IE
|
||
|
domAttr.set(this.containerNode,'colSpan',value?"1":"2");
|
||
|
|
||
|
this._set("accelKey", value);
|
||
|
},
|
||
|
_setTextDirAttr: function(/*String*/ textDir){
|
||
|
// summary:
|
||
|
// Setter for textDir.
|
||
|
// description:
|
||
|
// Users shouldn't call this function; they should be calling
|
||
|
// set('textDir', value)
|
||
|
// tags:
|
||
|
// private
|
||
|
|
||
|
// only if new textDir is different from the old one
|
||
|
// and on widgets creation.
|
||
|
if(!this._created || this.textDir != textDir){
|
||
|
this._set("textDir", textDir);
|
||
|
this.applyTextDir(this.focusNode, this.label);
|
||
|
}
|
||
|
}
|
||
|
});
|
||
|
});
|