Type.registerNamespace('Sys.Extended.UI');
Sys.Extended.UI.DropDownBehavior = function(element) {
Sys.Extended.UI.DropDownBehavior.initializeBase(this, [element]);
this._dropDownControl = null;
this._highlightBorderColor = "#2353B2";
this._highlightBackgroundColor = "#FFF3DB";
this._dropArrowBackgroundColor = "#C6E1FF";
this._dropArrowImageUrl = null;
this._dropArrowWidth = "16px";
this._oldBackgroundColor = null;
this._dropFrame = null;
this._dropArrow = null;
this._dropArrowImage = null;
this._dropWrapper = null;
this._isOpen = false;
this._isOver = false;
this._wasClicked = null;
this._dropWrapperHoverBehavior = null;
this._dropPopupPopupBehavior = null;
this._onShowJson = null;
this._onHideJson = null;
this._dropDownControl$delegates = {
click: Function.createDelegate(this, this._dropDownControl_onclick),
contextmenu: Function.createDelegate(this, this._dropDownControl_oncontextmenu)
}
this._dropFrame$delegates = {
click: Function.createDelegate(this, this._dropFrame_onclick),
contextmenu: Function.createDelegate(this, this._dropFrame_oncontextmenu)
}
this._dropWrapper$delegates = {
click: Function.createDelegate(this, this._dropWrapper_onclick),
contextmenu: Function.createDelegate(this, this._dropWrapper_oncontextmenu)
}
this._document$delegates = {
click: Function.createDelegate(this, this._document_onclick),
contextmenu: Function.createDelegate(this, this._document_oncontextmenu)
}
this._dropWrapperHoverBehavior$delegates = {
hover: Function.createDelegate(this, this._dropWrapperHoverBehavior_onhover),
unhover: Function.createDelegate(this, this._dropWrapperHoverBehavior_onunhover)
}
}
Sys.Extended.UI.DropDownBehavior.prototype = {
initialize: function() {
Sys.Extended.UI.DropDownBehavior.callBaseMethod(this, 'initialize');
var elt = this.get_element(),
parent = elt.parentNode;
// _dropDownControl
if(this._dropDownControl == null) {
$common.createElementFromTemplate({
parent: parent,
nameTable: this,
name: "_dropDownControl",
nodeName: "div",
visible: false,
cssClasses: this._dropDownControl ? null : ["ajax__dropdown_panel"],
properties: {
__GENERATED: true
}
});
}
$addHandlers(this._dropDownControl, this._dropDownControl$delegates);
// _dropFrame
// _dropArrow
// _dropArrowWrapper
// _dropArrowImage
var dropArrowImageProperties = {};
if(this._dropArrowImageUrl)
// Only set src if it has a value - otherwise IE gets a HTTP 404 response
dropArrowImageProperties["src"] = this._dropArrowImageUrl;
$common.createElementFromTemplate({
parent: parent,
nameTable: this,
name: "_dropFrame",
nodeName: "span",
visible: false,
children: [{
name: "_dropFrameTop",
nodeName: "div",
cssClasses: ["ajax__dropdown_frame_line"]
}, {
name: "_dropFrameRight",
nodeName: "div",
cssClasses: ["ajax__dropdown_frame_line"]
}, {
name: "_dropFrameBottom",
nodeName: "div",
cssClasses: ["ajax__dropdown_frame_line"]
}, {
name: "_dropFrameLeft",
nodeName: "div",
cssClasses: ["ajax__dropdown_frame_line"]
}, {
name: "_dropArrow",
nodeName: "div",
cssClasses: (!this._dropArrowImageUrl) ? ["ajax__dropdown_arrow", "ajax__dropdown_arrow_image"] : ["ajax__dropdown_arrow"],
properties: {
style: {
width: this._dropArrowWidth,
backgroundColor: this._dropArrowBackgroundColor
}
},
events: this._dropFrame$delegates,
children: [{
name: "_dropArrowWrapper",
nodeName: "div",
visible: !!this._dropArrowImageUrl,
cssClasses: ["ajax__dropdown_arrow_wrapper"],
children: [{
name: "_dropArrowImage",
nodeName: "img",
properties: dropArrowImageProperties
}]
}]
}]
});
// _dropWrapper
$common.createElementFromTemplate({
parent: null,
nameTable: this,
name: "_dropWrapper",
nodeName: "span",
properties: {
id: elt.id + "_dropWrapper",
style: {
cursor: "default"
}
},
events: this._dropWrapper$delegates,
content: elt
});
// _dropPopupPopupBehavior
this._dropPopupPopupBehavior = $create(Sys.Extended.UI.PopupBehavior, {
positioningMode: Sys.Extended.UI.PositioningMode.BottomRight,
parentElement: elt,
y: -1
}, null, null, this._dropDownControl);
// Create the animations (if they were set before initialize was called)
if(this._onShowJson)
this._dropPopupPopupBehavior.set_onShow(this._onShowJson);
if(this._onHideJson)
this._dropPopupPopupBehavior.set_onHide(this._onHideJson);
// _dropWrapperHoverBehavior
this._dropWrapperHoverBehavior = $create(Sys.Extended.UI.HoverBehavior, {
hoverElement: this._dropFrame
}, this._dropWrapperHoverBehavior$delegates, null, this._dropWrapper);
// wire events
$addHandlers(document, this._document$delegates);
},
dispose: function() {
var elt = this.get_element();
if(this._isOpen) {
this.hide();
this.unhover();
this._isOpen = false;
}
$common.removeHandlers(document, this._document$delegates);
this._onShowJson = null;
this._onHideJson = null;
if(this._dropPopupPopupBehavior) {
this._dropPopupPopupBehavior.dispose();
this._dropPopupPopupBehavior = null;
}
if(this._dropWrapperHoverBehavior) {
this._dropWrapperHoverBehavior.dispose();
this._dropWrapperHoverBehavior = null;
}
if(this._dropFrame) {
$common.removeElement(this._dropFrame);
this._dropFrame = null;
this._dropFrameTop = null;
this._dropFrameRight = null;
this._dropFrameBottom = null;
this._dropFrameLeft = null;
this._dropArrow = null;
this._dropArrowWrapper = null;
this._dropArrowImage = null;
}
if(this._dropWrapper) {
$common.removeHandlers(this._dropWrapper, this._dropWrapper$delegates);
$common.unwrapElement(elt, this._dropWrapper);
this._dropWrapper = null;
}
if(this._dropDownControl) {
$common.removeHandlers(this._dropDownControl, this._dropDownControl$delegates);
if(this._dropDownControl.__GENERATED)
$common.removeElement(this._dropDownControl);
this._dropDownControl = null;
}
Sys.Extended.UI.DropDownBehavior.callBaseMethod(this, 'dispose');
},
hover: function() {
var elt = this.get_element();
if(!this._isOver) {
this._isOver = true;
this.raiseHoverOver(Sys.EventArgs.Empty);
var bounds = $common.getBounds(elt);
// measure the offset caused by absolute/relative positioning:
// - set position to (0,0)
$common.setLocation(this._dropFrame, { x: 0, y: 0 });
// - show element
$common.setVisible(this._dropFrame, true);
// - get the actual position
var offset = $common.getLocation(this._dropFrame);
// - hide element
$common.setVisible(this._dropFrame, false);
// apply the measured offset
bounds.x -= offset.x;
bounds.y -= offset.y;
$common.setBounds(this._dropFrameTop, {
x: bounds.x,
y: bounds.y,
width: bounds.width,
height: 1
});
$common.setBounds(this._dropFrameRight, {
x: bounds.x + bounds.width - 1,
y: bounds.y,
width: 1,
height: bounds.height
});
$common.setBounds(this._dropFrameBottom, {
x: bounds.x,
y: bounds.y + bounds.height - 1,
width: bounds.width,
height: 1
});
$common.setBounds(this._dropFrameLeft, {
x: bounds.x,
y: bounds.y,
width: 1,
height: bounds.height
});
$common.setBounds(this._dropArrow, {
x: bounds.x + bounds.width - 17,
y: bounds.y + 1,
width: 16,
height: bounds.height - 2
});
this._dropFrameTop.style.backgroundColor = this._highlightBorderColor;
this._dropFrameRight.style.backgroundColor = this._highlightBorderColor;
this._dropFrameBottom.style.backgroundColor = this._highlightBorderColor;
this._dropFrameLeft.style.backgroundColor = this._highlightBorderColor;
$common.setVisible(this._dropFrame, true);
if(!this._oldBackgroundColor)
this._oldBackgroundColor = $common.getCurrentStyle(elt, 'backgroundColor');
elt.style.backgroundColor = this._highlightBackgroundColor;
}
},
unhover: function() {
var elt = this.get_element();
if(this._isOver || !this._isOpen) {
this._isOver = false;
if(!this._isOpen) {
$common.setVisible(this._dropFrame, false);
if(this._oldBackgroundColor) {
elt.style.backgroundColor = this._oldBackgroundColor;
this._oldBackgroundColor = null;
} else {
elt.style.backgroundColor = "transparent";
}
}
this.raiseHoverOut(Sys.EventArgs.Empty);
}
},
show: function() {
if(!this._isOpen) {
this.hover();
var eventArgs = new Sys.CancelEventArgs();
this.raiseShowing(eventArgs);
this.raisePopup(eventArgs);
if(eventArgs.get_cancel())
return;
this._isOpen = true;
this.populate();
if(!this._dynamicPopulateBehavior || (this._dynamicPopulateBehavior._populated && this._cacheDynamicResults))
this._showPopup();
}
},
_showPopup: function() {
this._dropPopupPopupBehavior.show();
this.raiseShown(Sys.EventArgs.Empty);
},
hide: function() {
if(this._isOpen) {
var eventArgs = new Sys.CancelEventArgs();
this.raiseHiding(eventArgs);
if(eventArgs.get_cancel())
return;
this._isOpen = false;
this._dropPopupPopupBehavior.hide();
this.raiseHidden(Sys.EventArgs.Empty);
}
},
_dropWrapperHoverBehavior_onhover: function(sender, e) {
this.hover();
},
_dropWrapperHoverBehavior_onunhover: function(sender, e) {
this.unhover();
},
_dropWrapper_onclick: function(e) {
if(e.target.tagName != "A") {
if(!this._isOpen)
this.show();
else
this.hide();
this._wasClicked = true;
}
},
_dropWrapper_oncontextmenu: function(e) {
if(e.target.tagName != "A") {
this._wasClicked = true;
e.preventDefault();
this.show();
}
},
_dropFrame_onclick: function(e) {
if(!this._isOpen)
this.show();
else
this.hide();
this._wasClicked = true;
},
_dropFrame_oncontextmenu: function(e) {
this._wasClicked = true;
e.preventDefault();
this.show();
},
_dropDownControl_onclick: function(e) {
//this._wasClicked = true;
},
_dropDownControl_oncontextmenu: function(e) {
this._wasClicked = true;
e.preventDefault();
},
_document_onclick: function(e) {
if(this._wasClicked) {
this._wasClicked = false;
} else if(this._isOpen) {
this.hide();
this.unhover();
}
},
_document_oncontextmenu: function(e) {
if(this._wasClicked) {
this._wasClicked = false;
} else if(this._isOpen) {
this.hide();
this.unhover();
}
},
_onPopulated: function(sender, eventArgs) {
Sys.Extended.UI.DropDownBehavior.callBaseMethod(this, '_onPopulated', [sender, eventArgs]);
if(this._isOpen)
this._showPopup();
},
get_onShow: function() {
// Generic OnShow Animation's JSON definition
return this._dropPopupPopupBehavior ? this._dropPopupPopupBehavior.get_onShow() : this._onShowJson;
},
set_onShow: function(value) {
if(this._dropPopupPopupBehavior)
this._dropPopupPopupBehavior.set_onShow(value)
else
this._onShowJson = value;
this.raisePropertyChanged('onShow');
},
get_onShowBehavior: function() {
// Generic OnShow Animation's behavior
return this._dropPopupPopupBehavior ? this._dropPopupPopupBehavior.get_onShowBehavior() : null;
},
onShow: function() {
if(this._dropPopupPopupBehavior)
this._dropPopupPopupBehavior.onShow();
},
get_onHide: function() {
// Generic OnHide Animation's JSON definition
return this._dropPopupPopupBehavior ? this._dropPopupPopupBehavior.get_onHide() : this._onHideJson;
},
set_onHide: function(value) {
if(this._dropPopupPopupBehavior)
this._dropPopupPopupBehavior.set_onHide(value)
else
this._onHideJson = value;
this.raisePropertyChanged('onHide');
},
get_onHideBehavior: function() {
// Generic OnHide Animation's behavior
return this._dropPopupPopupBehavior ? this._dropPopupPopupBehavior.get_onHideBehavior() : null;
},
onHide: function() {
if(this._dropPopupPopupBehavior)
this._dropPopupPopupBehavior.onHide();
},
get_dropDownControl: function() {
return this._dropDownControl;
},
set_dropDownControl: function(value) {
if(this._dropDownControl != value) {
this._dropDownControl = value;
this.raisePropertyChanged("dropDownControl");
}
},
get_highlightBorderColor: function() {
return this._highlightBorderColor;
},
set_highlightBorderColor: function(value) {
if(this._highlightBorderColor != value) {
this._highlightBorderColor = value;
this.raisePropertyChanged("highlightBorderColor");
}
},
get_highlightBackgroundColor: function() {
return this._highlightBackgroundColor;
},
set_highlightBackgroundColor: function(value) {
if(this._highlightBackgroundColor != value) {
this._highlightBackgroundColor = value;
if(this.get_isInitialized() && this._isOpen)
this._dropWrapper.style.backgroundColor = value;
this.raisePropertyChanged("highlightBackgroundColor");
}
},
get_dropArrowBackgroundColor: function() {
return this._dropArrowBackgroundColor;
},
set_dropArrowBackgroundColor: function(value) {
if(this._dropArrowBackgroundColor != value) {
this._dropArrowBackgroundColor = value;
if(this.get_isInitialized())
this._dropArrow.style.backgroundColor = value;
this.raisePropertyChanged("dropArrowBackgroundColor");
}
},
get_dropArrowImageUrl: function() {
return this._dropArrowImageUrl;
},
set_dropArrowImageUrl: function(value) {
if(this._dropArrowImageUrl != value) {
this._dropArrowImageUrl = value;
if(this.get_isInitialized()) {
if(this._dropArrow.className) {
this._dropArrow.className = "";
this._dropArrowWrapper.style.display = 'block';
}
this._dropArrowImage.src = value;
}
this.raisePropertyChanged("dropArrowImageUrl");
}
},
get_dropArrowWidth: function() {
return this._dropArrowWidth;
},
set_dropArrowWidth: function(value) {
if(this._dropArrowWidth != value) {
this._dropArrowWidth = value;
if(this.get_isInitialized())
this._dropArrow.style.width = value;
this.raisePropertyChanged("dropArrowWidth");
}
},
get_isOver: function() {
return this._isOver;
},
get_isOpen: function() {
return this._isOpen;
},
add_showing: function(handler) {
this.get_events().addHandler('showing', handler);
},
remove_showing: function(handler) {
this.get_events().removeHandler('showing', handler);
},
raiseShowing: function(eventArgs) {
var handler = this.get_events().getHandler('showing');
if(handler)
handler(this, eventArgs);
},
add_shown: function(handler) {
this.get_events().addHandler('shown', handler);
},
remove_shown: function(handler) {
this.get_events().removeHandler('shown', handler);
},
raiseShown: function(eventArgs) {
var handler = this.get_events().getHandler('shown');
if(handler)
handler(this, eventArgs);
},
add_popup: function(handler) {
this.get_events().addHandler('popup', handler);
},
remove_popup: function(handler) {
this.get_events().removeHandler('popup', handler);
},
raisePopup: function(eventArgs) {
var handler = this.get_events().getHandler('popup');
if(handler)
handler(this, eventArgs);
},
add_hiding: function(handler) {
this.get_events().addHandler('hiding', handler);
},
remove_hiding: function(handler) {
this.get_events().removeHandler('hiding', handler);
},
raiseHiding: function(eventArgs) {
var handler = this.get_events().getHandler('hiding');
if(handler)
handler(this, eventArgs);
},
add_hidden: function(handler) {
this.get_events().addHandler('hidden', handler);
},
remove_hidden: function(handler) {
this.get_events().removeHandler('hidden', handler);
},
raiseHidden: function(eventArgs) {
var handler = this.get_events().getHandler('hidden');
if(handler)
handler(this, eventArgs);
},
add_hoverOver: function(handler) {
this.get_events().addHandler('hoverOver', handler);
},
remove_hoverOver: function(handler) {
this.get_events().removeHandler('hoverOver', handler);
},
raiseHoverOver: function(eventArgs) {
var handler = this.get_events().getHandler('hoverOver');
if(handler)
handler(this, eventArgs);
},
add_hoverOut: function(handler) {
this.get_events().addHandler('hoverOut', handler);
},
remove_hoverOut: function(handler) {
this.get_events().removeHandler('hoverOut', handler);
},
raiseHoverOut: function(eventArgs) {
var handler = this.get_events().getHandler('hoverOut');
if(handler)
handler(this, eventArgs);
}
}
Sys.Extended.UI.DropDownBehavior.registerClass('Sys.Extended.UI.DropDownBehavior', Sys.Extended.UI.DynamicPopulateBehaviorBase);