forked from fanruan/fineui
imp
7 years ago
40 changed files with 89821 additions and 65417 deletions
@ -0,0 +1,797 @@ |
|||||||
|
/** |
||||||
|
* Created by zcf on 2016/9/22. |
||||||
|
*/ |
||||||
|
BI.Slider = BI.inherit(BI.Widget, { |
||||||
|
_defaultConfig: function () { |
||||||
|
return BI.extend(BI.Slider.superclass._defaultConfig.apply(this, arguments), { |
||||||
|
baseCls: "bi-single-button-button" |
||||||
|
}); |
||||||
|
}, |
||||||
|
_init: function () { |
||||||
|
BI.extend(BI.Slider.superclass._init.apply(this, arguments)); |
||||||
|
this.slider = BI.createWidget({ |
||||||
|
type: "bi.icon_button", |
||||||
|
cls: "widget-button-icon button-button", |
||||||
|
iconWidth: 14, |
||||||
|
iconHeight: 14, |
||||||
|
height: 14, |
||||||
|
width: 14 |
||||||
|
}); |
||||||
|
BI.createWidget({ |
||||||
|
type: "bi.absolute", |
||||||
|
element: this, |
||||||
|
items: [{ |
||||||
|
el: this.slider, |
||||||
|
top: 7, |
||||||
|
left: -7 |
||||||
|
}], |
||||||
|
width: 0, |
||||||
|
height: 14 |
||||||
|
}); |
||||||
|
} |
||||||
|
}); |
||||||
|
BI.shortcut("bi.single_slider_slider", BI.Slider);/** |
||||||
|
* Created by zcf on 2016/9/22. |
||||||
|
*/ |
||||||
|
BI.SingleSlider = BI.inherit(BI.Widget, { |
||||||
|
_constant: { |
||||||
|
EDITOR_WIDTH: 90, |
||||||
|
EDITOR_HEIGHT: 30, |
||||||
|
HEIGHT: 28, |
||||||
|
SLIDER_WIDTH_HALF: 15, |
||||||
|
SLIDER_WIDTH: 30, |
||||||
|
SLIDER_HEIGHT: 30, |
||||||
|
TRACK_HEIGHT: 24 |
||||||
|
}, |
||||||
|
_defaultConfig: function () { |
||||||
|
return BI.extend(BI.SingleSlider.superclass._defaultConfig.apply(this, arguments), { |
||||||
|
baseCls: "bi-single-button bi-button-track" |
||||||
|
}); |
||||||
|
}, |
||||||
|
_init: function () { |
||||||
|
BI.SingleSlider.superclass._init.apply(this, arguments); |
||||||
|
|
||||||
|
var self = this; |
||||||
|
var c = this._constant; |
||||||
|
this.enable = false; |
||||||
|
this.value = ""; |
||||||
|
|
||||||
|
this.grayTrack = BI.createWidget({ |
||||||
|
type: "bi.layout", |
||||||
|
cls: "gray-track", |
||||||
|
height: 6 |
||||||
|
}); |
||||||
|
this.blueTrack = BI.createWidget({ |
||||||
|
type: "bi.layout", |
||||||
|
cls: "blue-track bi-high-light-background", |
||||||
|
height: 6 |
||||||
|
}); |
||||||
|
this.track = this._createTrackWrapper(); |
||||||
|
|
||||||
|
this.slider = BI.createWidget({ |
||||||
|
type: "bi.single_slider_slider" |
||||||
|
}); |
||||||
|
this.slider.element.draggable({ |
||||||
|
axis: "x", |
||||||
|
containment: this.grayTrack.element, |
||||||
|
scroll: false, |
||||||
|
drag: function (e, ui) { |
||||||
|
var percent = (ui.position.left) * 100 / (self._getGrayTrackLength()); |
||||||
|
var significantPercent = BI.parseFloat(percent.toFixed(1));//直接对计算出来的百分数保留到小数点后一位,相当于分成了1000份。
|
||||||
|
self._setBlueTrack(significantPercent); |
||||||
|
self._setLabelPosition(significantPercent); |
||||||
|
var v = self._getValueByPercent(significantPercent); |
||||||
|
self.label.setValue(v); |
||||||
|
self.value = v; |
||||||
|
}, |
||||||
|
stop: function (e, ui) { |
||||||
|
var percent = (ui.position.left) * 100 / (self._getGrayTrackLength()); |
||||||
|
var significantPercent = BI.parseFloat(percent.toFixed(1)); |
||||||
|
self._setSliderPosition(significantPercent); |
||||||
|
self.fireEvent(BI.SingleSlider.EVENT_CHANGE); |
||||||
|
} |
||||||
|
}); |
||||||
|
var sliderVertical = BI.createWidget({ |
||||||
|
type: "bi.vertical", |
||||||
|
items: [{ |
||||||
|
type: "bi.absolute", |
||||||
|
items: [this.slider] |
||||||
|
}], |
||||||
|
hgap: c.SLIDER_WIDTH_HALF, |
||||||
|
height: c.SLIDER_HEIGHT |
||||||
|
}); |
||||||
|
sliderVertical.element.click(function (e) { |
||||||
|
if (self.enable) { |
||||||
|
var offset = e.clientX - self.element.offset().left - c.SLIDER_WIDTH_HALF; |
||||||
|
var trackLength = self.track.element[0].scrollWidth; |
||||||
|
var percent = 0; |
||||||
|
if (offset < 0) { |
||||||
|
percent = 0 |
||||||
|
} |
||||||
|
if (offset > 0 && offset < (trackLength - c.SLIDER_WIDTH)) { |
||||||
|
percent = offset * 100 / self._getGrayTrackLength(); |
||||||
|
} |
||||||
|
if (offset > (trackLength - c.SLIDER_WIDTH)) { |
||||||
|
percent = 100 |
||||||
|
} |
||||||
|
var significantPercent = BI.parseFloat(percent.toFixed(1)); |
||||||
|
self._setAllPosition(significantPercent); |
||||||
|
var v = self._getValueByPercent(significantPercent); |
||||||
|
self.label.setValue(v); |
||||||
|
self.value = v; |
||||||
|
self.fireEvent(BI.SingleSlider.EVENT_CHANGE); |
||||||
|
} |
||||||
|
}); |
||||||
|
this.label = BI.createWidget({ |
||||||
|
type: "bi.sign_editor", |
||||||
|
cls: "button-editor-button bi-border", |
||||||
|
errorText: "", |
||||||
|
height: c.HEIGHT, |
||||||
|
width: c.EDITOR_WIDTH, |
||||||
|
allowBlank: false, |
||||||
|
validationChecker: function (v) { |
||||||
|
return self._checkValidation(v); |
||||||
|
}, |
||||||
|
quitChecker: function (v) { |
||||||
|
return self._checkValidation(v); |
||||||
|
} |
||||||
|
}); |
||||||
|
this.label.on(BI.SignEditor.EVENT_CONFIRM, function () { |
||||||
|
var percent = self._getPercentByValue(this.getValue()); |
||||||
|
var significantPercent = BI.parseFloat(percent.toFixed(1)); |
||||||
|
self._setAllPosition(significantPercent); |
||||||
|
self.fireEvent(BI.SingleSlider.EVENT_CHANGE); |
||||||
|
}); |
||||||
|
this._setVisible(false); |
||||||
|
BI.createWidget({ |
||||||
|
type: "bi.absolute", |
||||||
|
element: this, |
||||||
|
items: [{ |
||||||
|
el: { |
||||||
|
type: "bi.vertical", |
||||||
|
items: [{ |
||||||
|
type: "bi.absolute", |
||||||
|
items: [{ |
||||||
|
el: this.track, |
||||||
|
width: "100%", |
||||||
|
height: c.TRACK_HEIGHT |
||||||
|
}] |
||||||
|
}], |
||||||
|
hgap: 7, |
||||||
|
height: c.TRACK_HEIGHT |
||||||
|
}, |
||||||
|
top: 33, |
||||||
|
left: 0, |
||||||
|
width: "100%" |
||||||
|
}, { |
||||||
|
el: sliderVertical, |
||||||
|
top: 30, |
||||||
|
left: 0, |
||||||
|
width: "100%" |
||||||
|
}, { |
||||||
|
el: { |
||||||
|
type: "bi.vertical", |
||||||
|
items: [{ |
||||||
|
type: "bi.absolute", |
||||||
|
items: [this.label] |
||||||
|
}], |
||||||
|
rgap: c.EDITOR_WIDTH, |
||||||
|
height: c.EDITOR_HEIGHT |
||||||
|
}, |
||||||
|
top: 0, |
||||||
|
left: 0, |
||||||
|
width: "100%" |
||||||
|
}] |
||||||
|
}) |
||||||
|
}, |
||||||
|
|
||||||
|
_createTrackWrapper: function () { |
||||||
|
return BI.createWidget({ |
||||||
|
type: "bi.absolute", |
||||||
|
items: [{ |
||||||
|
el: { |
||||||
|
type: "bi.vertical", |
||||||
|
items: [{ |
||||||
|
type: "bi.absolute", |
||||||
|
items: [{ |
||||||
|
el: this.grayTrack, |
||||||
|
top: 0, |
||||||
|
left: 0, |
||||||
|
width: "100%" |
||||||
|
}, { |
||||||
|
el: this.blueTrack, |
||||||
|
top: 0, |
||||||
|
left: 0, |
||||||
|
width: "0%" |
||||||
|
}] |
||||||
|
}], |
||||||
|
hgap: 8, |
||||||
|
height: 8 |
||||||
|
}, |
||||||
|
top: 8, |
||||||
|
left: 0, |
||||||
|
width: "100%" |
||||||
|
}] |
||||||
|
}) |
||||||
|
}, |
||||||
|
|
||||||
|
_checkValidation: function (v) { |
||||||
|
return !(BI.isNull(v) || v < this.min || v > this.max) |
||||||
|
}, |
||||||
|
|
||||||
|
_setBlueTrack: function (percent) { |
||||||
|
this.blueTrack.element.css({"width": percent + "%"}); |
||||||
|
}, |
||||||
|
|
||||||
|
_setLabelPosition: function (percent) { |
||||||
|
this.label.element.css({"left": percent + "%"}); |
||||||
|
}, |
||||||
|
|
||||||
|
_setSliderPosition: function (percent) { |
||||||
|
this.slider.element.css({"left": percent + "%"}); |
||||||
|
}, |
||||||
|
|
||||||
|
_setAllPosition: function (percent) { |
||||||
|
this._setSliderPosition(percent); |
||||||
|
this._setLabelPosition(percent); |
||||||
|
this._setBlueTrack(percent); |
||||||
|
}, |
||||||
|
|
||||||
|
_setVisible: function (visible) { |
||||||
|
this.slider.setVisible(visible); |
||||||
|
this.label.setVisible(visible); |
||||||
|
}, |
||||||
|
|
||||||
|
_getGrayTrackLength: function () { |
||||||
|
return this.grayTrack.element[0].scrollWidth |
||||||
|
}, |
||||||
|
|
||||||
|
_getValueByPercent: function (percent) { |
||||||
|
var thousandth = BI.parseInt(percent * 10); |
||||||
|
return (((this.max - this.min) * thousandth) / 1000 + this.min); |
||||||
|
}, |
||||||
|
|
||||||
|
_getPercentByValue: function (v) { |
||||||
|
return (v - this.min) * 100 / (this.max - this.min); |
||||||
|
}, |
||||||
|
|
||||||
|
getValue: function () { |
||||||
|
return this.value; |
||||||
|
}, |
||||||
|
|
||||||
|
setValue: function (v) { |
||||||
|
var value = BI.parseFloat(v); |
||||||
|
if ((!isNaN(value))) { |
||||||
|
if (this._checkValidation(value)) { |
||||||
|
this.value = value; |
||||||
|
} |
||||||
|
if (value > this.max) { |
||||||
|
this.value = this.max; |
||||||
|
} |
||||||
|
if (value < this.min) { |
||||||
|
this.value = this.min; |
||||||
|
} |
||||||
|
} |
||||||
|
}, |
||||||
|
|
||||||
|
setMinAndMax: function (v) { |
||||||
|
var minNumber = BI.parseFloat(v.min); |
||||||
|
var maxNumber = BI.parseFloat(v.max); |
||||||
|
if ((!isNaN(minNumber)) && (!isNaN(maxNumber)) && (maxNumber > minNumber )) { |
||||||
|
this.min = minNumber; |
||||||
|
this.max = maxNumber; |
||||||
|
} |
||||||
|
}, |
||||||
|
|
||||||
|
reset: function () { |
||||||
|
this._setVisible(false); |
||||||
|
this.enable = false; |
||||||
|
this.value = ""; |
||||||
|
this.min = 0; |
||||||
|
this.max = 0; |
||||||
|
this._setBlueTrack(0); |
||||||
|
}, |
||||||
|
|
||||||
|
populate: function () { |
||||||
|
if (!isNaN(this.min) && !isNaN(this.max)) { |
||||||
|
this._setVisible(true); |
||||||
|
this.enable = true; |
||||||
|
this.label.setErrorText(BI.i18nText("BI-Please_Enter") + this.min + "-" + this.max + BI.i18nText("BI-Basic_De") + BI.i18nText("BI-Basic_Number")); |
||||||
|
if (BI.isNumeric(this.value) || BI.isNotEmptyString(this.value)) { |
||||||
|
this.label.setValue(this.value); |
||||||
|
this._setAllPosition(this._getPercentByValue(this.value)); |
||||||
|
} else { |
||||||
|
this.label.setValue(this.max); |
||||||
|
this._setAllPosition(100); |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
}); |
||||||
|
BI.SingleSlider.EVENT_CHANGE = "EVENT_CHANGE"; |
||||||
|
BI.shortcut("bi.single_slider", BI.SingleSlider);/** |
||||||
|
* normal single slider |
||||||
|
* Created by Young on 2017/6/21. |
||||||
|
*/ |
||||||
|
BI.SingleSliderNormal = BI.inherit(BI.Widget, { |
||||||
|
|
||||||
|
_constant: { |
||||||
|
EDITOR_WIDTH: 90, |
||||||
|
EDITOR_HEIGHT: 30, |
||||||
|
HEIGHT: 28, |
||||||
|
SLIDER_WIDTH_HALF: 15, |
||||||
|
SLIDER_WIDTH: 30, |
||||||
|
SLIDER_HEIGHT: 30, |
||||||
|
TRACK_HEIGHT: 24 |
||||||
|
}, |
||||||
|
|
||||||
|
props: { |
||||||
|
baseCls: "bi-single-button bi-button-track", |
||||||
|
minMax: { |
||||||
|
min: 0, |
||||||
|
max: 100 |
||||||
|
}, |
||||||
|
color: "#3f8ce8" |
||||||
|
}, |
||||||
|
|
||||||
|
render: function () { |
||||||
|
var self = this; |
||||||
|
var c = this._constant; |
||||||
|
var track = this._createTrack(); |
||||||
|
this.slider = BI.createWidget({ |
||||||
|
type: "bi.single_slider_slider" |
||||||
|
}); |
||||||
|
this.slider.element.draggable({ |
||||||
|
axis: "x", |
||||||
|
containment: this.grayTrack.element, |
||||||
|
scroll: false, |
||||||
|
drag: function (e, ui) { |
||||||
|
var percent = (ui.position.left) * 100 / (self._getGrayTrackLength()); |
||||||
|
var significantPercent = BI.parseFloat(percent.toFixed(1));//直接对计算出来的百分数保留到小数点后一位,相当于分成了1000份。
|
||||||
|
self._setBlueTrack(significantPercent); |
||||||
|
var v = self._getValueByPercent(significantPercent); |
||||||
|
self.value = v; |
||||||
|
self.fireEvent(BI.SingleSliderNormal.EVENT_DRAG, v); |
||||||
|
}, |
||||||
|
stop: function (e, ui) { |
||||||
|
var percent = (ui.position.left) * 100 / (self._getGrayTrackLength()); |
||||||
|
var significantPercent = BI.parseFloat(percent.toFixed(1)); |
||||||
|
self._setSliderPosition(significantPercent); |
||||||
|
self.fireEvent(BI.SingleSlider.EVENT_CHANGE); |
||||||
|
} |
||||||
|
}); |
||||||
|
|
||||||
|
var sliderVertical = BI.createWidget({ |
||||||
|
type: "bi.vertical", |
||||||
|
items: [{ |
||||||
|
type: "bi.absolute", |
||||||
|
items: [this.slider] |
||||||
|
}], |
||||||
|
hgap: c.SLIDER_WIDTH_HALF, |
||||||
|
height: c.SLIDER_HEIGHT |
||||||
|
}); |
||||||
|
sliderVertical.element.click(function (e) { |
||||||
|
if (self.enable) { |
||||||
|
var offset = e.clientX - self.element.offset().left - c.SLIDER_WIDTH_HALF; |
||||||
|
var trackLength = self.track.element[0].scrollWidth; |
||||||
|
var percent = 0; |
||||||
|
if (offset < 0) { |
||||||
|
percent = 0 |
||||||
|
} |
||||||
|
if (offset > 0 && offset < (trackLength - c.SLIDER_WIDTH)) { |
||||||
|
percent = offset * 100 / self._getGrayTrackLength(); |
||||||
|
} |
||||||
|
if (offset > (trackLength - c.SLIDER_WIDTH)) { |
||||||
|
percent = 100 |
||||||
|
} |
||||||
|
var significantPercent = BI.parseFloat(percent.toFixed(1)); |
||||||
|
self._setAllPosition(significantPercent); |
||||||
|
var v = self._getValueByPercent(significantPercent); |
||||||
|
self.value = v; |
||||||
|
self.fireEvent(BI.SingleSlider.EVENT_CHANGE); |
||||||
|
} |
||||||
|
}); |
||||||
|
|
||||||
|
return { |
||||||
|
type: "bi.absolute", |
||||||
|
element: this, |
||||||
|
items: [{ |
||||||
|
el: { |
||||||
|
type: "bi.vertical", |
||||||
|
items: [{ |
||||||
|
type: "bi.absolute", |
||||||
|
items: [{ |
||||||
|
el: track, |
||||||
|
width: "100%", |
||||||
|
height: c.TRACK_HEIGHT |
||||||
|
}] |
||||||
|
}], |
||||||
|
hgap: 7, |
||||||
|
height: c.TRACK_HEIGHT |
||||||
|
}, |
||||||
|
top: 3, |
||||||
|
left: 0, |
||||||
|
width: "100%" |
||||||
|
}, { |
||||||
|
el: sliderVertical, |
||||||
|
top: 0, |
||||||
|
left: 0, |
||||||
|
width: "100%" |
||||||
|
}] |
||||||
|
} |
||||||
|
}, |
||||||
|
|
||||||
|
_createTrack: function () { |
||||||
|
var self = this; |
||||||
|
var c = this._constant; |
||||||
|
this.grayTrack = BI.createWidget({ |
||||||
|
type: "bi.layout", |
||||||
|
cls: "gray-track", |
||||||
|
height: 6 |
||||||
|
}); |
||||||
|
this.blueTrack = BI.createWidget({ |
||||||
|
type: "bi.layout", |
||||||
|
cls: "blue-track", |
||||||
|
height: 6 |
||||||
|
}); |
||||||
|
this.blueTrack.element.css({"background-color": this.options.color}); |
||||||
|
|
||||||
|
return { |
||||||
|
type: "bi.absolute", |
||||||
|
items: [{ |
||||||
|
el: { |
||||||
|
type: "bi.vertical", |
||||||
|
items: [{ |
||||||
|
type: "bi.absolute", |
||||||
|
items: [{ |
||||||
|
el: this.grayTrack, |
||||||
|
top: 0, |
||||||
|
left: 0, |
||||||
|
width: "100%" |
||||||
|
}, { |
||||||
|
el: this.blueTrack, |
||||||
|
top: 0, |
||||||
|
left: 0, |
||||||
|
width: "0%" |
||||||
|
}] |
||||||
|
}], |
||||||
|
hgap: 8, |
||||||
|
height: 8 |
||||||
|
}, |
||||||
|
top: 8, |
||||||
|
left: 0, |
||||||
|
width: "100%" |
||||||
|
}], |
||||||
|
ref: function (ref) { |
||||||
|
self.track = ref; |
||||||
|
} |
||||||
|
} |
||||||
|
}, |
||||||
|
|
||||||
|
_checkValidation: function (v) { |
||||||
|
return !(BI.isNull(v) || v < this.min || v > this.max) |
||||||
|
}, |
||||||
|
|
||||||
|
_setBlueTrack: function (percent) { |
||||||
|
this.blueTrack.element.css({"width": percent + "%"}); |
||||||
|
}, |
||||||
|
|
||||||
|
_setSliderPosition: function (percent) { |
||||||
|
this.slider.element.css({"left": percent + "%"}); |
||||||
|
}, |
||||||
|
|
||||||
|
_setAllPosition: function (percent) { |
||||||
|
this._setSliderPosition(percent); |
||||||
|
this._setBlueTrack(percent); |
||||||
|
}, |
||||||
|
|
||||||
|
_setVisible: function (visible) { |
||||||
|
this.slider.setVisible(visible); |
||||||
|
}, |
||||||
|
|
||||||
|
_getGrayTrackLength: function () { |
||||||
|
return this.grayTrack.element[0].scrollWidth |
||||||
|
}, |
||||||
|
|
||||||
|
_getValueByPercent: function (percent) { |
||||||
|
var thousandth = BI.parseInt(percent * 10); |
||||||
|
return (((this.max - this.min) * thousandth) / 1000 + this.min); |
||||||
|
}, |
||||||
|
|
||||||
|
_getPercentByValue: function (v) { |
||||||
|
return (v - this.min) * 100 / (this.max - this.min); |
||||||
|
}, |
||||||
|
|
||||||
|
getValue: function () { |
||||||
|
return this.value; |
||||||
|
}, |
||||||
|
|
||||||
|
setValue: function (v) { |
||||||
|
var value = BI.parseFloat(v); |
||||||
|
if ((!isNaN(value))) { |
||||||
|
if (this._checkValidation(value)) { |
||||||
|
this.value = value; |
||||||
|
} |
||||||
|
if (value > this.max) { |
||||||
|
this.value = this.max; |
||||||
|
} |
||||||
|
if (value < this.min) { |
||||||
|
this.value = this.min; |
||||||
|
} |
||||||
|
} |
||||||
|
}, |
||||||
|
|
||||||
|
setMinAndMax: function (v) { |
||||||
|
var minNumber = BI.parseFloat(v.min); |
||||||
|
var maxNumber = BI.parseFloat(v.max); |
||||||
|
if ((!isNaN(minNumber)) && (!isNaN(maxNumber)) && (maxNumber > minNumber )) { |
||||||
|
this.min = minNumber; |
||||||
|
this.max = maxNumber; |
||||||
|
} |
||||||
|
}, |
||||||
|
|
||||||
|
reset: function () { |
||||||
|
this._setVisible(false); |
||||||
|
this.enable = false; |
||||||
|
this.value = ""; |
||||||
|
this.min = 0; |
||||||
|
this.max = 0; |
||||||
|
this._setBlueTrack(0); |
||||||
|
}, |
||||||
|
|
||||||
|
populate: function () { |
||||||
|
if (!isNaN(this.min) && !isNaN(this.max)) { |
||||||
|
this._setVisible(true); |
||||||
|
this.enable = true; |
||||||
|
if (BI.isNumeric(this.value) || BI.isNotEmptyString(this.value)) { |
||||||
|
this._setAllPosition(this._getPercentByValue(this.value)); |
||||||
|
} else { |
||||||
|
this._setAllPosition(100); |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
}); |
||||||
|
BI.SingleSliderNormal.EVENT_DRAG = "EVENT_DRAG"; |
||||||
|
BI.shortcut("bi.single_slider_normal", BI.SingleSliderNormal);/** |
||||||
|
* Created by Urthur on 2017/9/4. |
||||||
|
*/ |
||||||
|
BI.SliderButton = BI.inherit(BI.Widget, { |
||||||
|
_defaultConfig: function () { |
||||||
|
return BI.extend(BI.SliderButton.superclass._defaultConfig.apply(this, arguments), { |
||||||
|
baseCls: "bi-slider-button" |
||||||
|
}); |
||||||
|
}, |
||||||
|
_init: function () { |
||||||
|
BI.extend(BI.SliderButton.superclass._init.apply(this, arguments)); |
||||||
|
var self = this; |
||||||
|
var sliderButton = BI.createWidget({ |
||||||
|
type: "bi.icon_button", |
||||||
|
cls: "column-next-page-h-font", |
||||||
|
iconWidth: 16, |
||||||
|
iconHeight: 16, |
||||||
|
height: 16, |
||||||
|
width: 16 |
||||||
|
}); |
||||||
|
BI.createWidget({ |
||||||
|
type: "bi.absolute", |
||||||
|
element: this, |
||||||
|
items: [{ |
||||||
|
el: sliderButton, |
||||||
|
left: -8 |
||||||
|
}, { |
||||||
|
el: { |
||||||
|
type: "bi.label", |
||||||
|
ref: function (_ref) { |
||||||
|
self.label = _ref; |
||||||
|
} |
||||||
|
}, |
||||||
|
left: -8, |
||||||
|
top: -10 |
||||||
|
}] |
||||||
|
}); |
||||||
|
}, |
||||||
|
|
||||||
|
setValue: function (v) { |
||||||
|
this.label.setText(v); |
||||||
|
} |
||||||
|
}); |
||||||
|
BI.shortcut("bi.slider_button", BI.SliderButton);/** |
||||||
|
* Created by Urthur on 2017/9/4. |
||||||
|
*/ |
||||||
|
BI.SliderNormal = BI.inherit(BI.Widget, { |
||||||
|
_constant: { |
||||||
|
HEIGHT: 28, |
||||||
|
SLIDER_WIDTH_HALF: 10, |
||||||
|
SLIDER_WIDTH: 25, |
||||||
|
SLIDER_HEIGHT: 30, |
||||||
|
TRACK_HEIGHT: 24 |
||||||
|
}, |
||||||
|
|
||||||
|
_defaultConfig: function () { |
||||||
|
return BI.extend(BI.SliderNormal.superclass._defaultConfig.apply(this, arguments), { |
||||||
|
baseCls: "bi-slider", |
||||||
|
min: 10, |
||||||
|
max: 50 |
||||||
|
}) |
||||||
|
}, |
||||||
|
|
||||||
|
_init: function () { |
||||||
|
BI.SliderNormal.superclass._init.apply(this, arguments); |
||||||
|
var self = this; |
||||||
|
var c = this._constant, o = this.options; |
||||||
|
this.enable = false; |
||||||
|
this.value = o.min; |
||||||
|
this.min = o.min; |
||||||
|
this.max = o.max; |
||||||
|
|
||||||
|
this.rightTrack = BI.createWidget({ |
||||||
|
type: "bi.layout", |
||||||
|
cls: "bi-slider-track", |
||||||
|
height: 5 |
||||||
|
}); |
||||||
|
this.track = this._createTrack(); |
||||||
|
|
||||||
|
this.slider = BI.createWidget({ |
||||||
|
type: "bi.slider_button" |
||||||
|
}); |
||||||
|
this.slider.setValue(this.getValue()); |
||||||
|
this.slider.element.draggable({ |
||||||
|
axis: "x", |
||||||
|
containment: this.rightTrack.element, |
||||||
|
scroll: false, |
||||||
|
drag: function (e, ui) { |
||||||
|
var percent = (ui.position.left) * 100 / (self._getRightTrackLength()); |
||||||
|
var significantPercent = BI.parseFloat(percent.toFixed(1));//直接对计算出来的百分数保留到小数点后一位,相当于分成了1000份。
|
||||||
|
var v = self._getValueByPercent(significantPercent); |
||||||
|
self.value = BI.parseInt(v) + 1; |
||||||
|
self.slider.setValue(self.getValue()); |
||||||
|
self.fireEvent(BI.SliderNormal.EVENT_CHANGE); |
||||||
|
}, |
||||||
|
stop: function (e, ui) { |
||||||
|
var percent = (ui.position.left) * 100 / (self._getRightTrackLength()); |
||||||
|
var significantPercent = BI.parseFloat(percent.toFixed(1)); |
||||||
|
self._setSliderPosition(significantPercent); |
||||||
|
self.fireEvent(BI.SliderNormal.EVENT_CHANGE); |
||||||
|
} |
||||||
|
}); |
||||||
|
var sliderVertical = BI.createWidget({ |
||||||
|
type: "bi.vertical", |
||||||
|
items: [{ |
||||||
|
type: "bi.absolute", |
||||||
|
items: [{ |
||||||
|
el: this.slider, |
||||||
|
top: 10 |
||||||
|
}] |
||||||
|
}], |
||||||
|
hgap: c.SLIDER_WIDTH_HALF, |
||||||
|
height: c.SLIDER_HEIGHT |
||||||
|
}); |
||||||
|
sliderVertical.element.click(function (e) { |
||||||
|
if (self.enable) { |
||||||
|
var offset = e.clientX - self.element.offset().left - c.SLIDER_WIDTH_HALF; |
||||||
|
var trackLength = self.track.element[0].scrollWidth; |
||||||
|
var percent = 0; |
||||||
|
if (offset < 0) { |
||||||
|
percent = 0 |
||||||
|
} |
||||||
|
if (offset > 0 && offset < (trackLength - c.SLIDER_WIDTH)) { |
||||||
|
percent = offset * 100 / self._getRightTrackLength(); |
||||||
|
} |
||||||
|
if (offset > (trackLength - c.SLIDER_WIDTH)) { |
||||||
|
percent = 100 |
||||||
|
} |
||||||
|
var significantPercent = BI.parseFloat(percent.toFixed(1)); |
||||||
|
self._setSliderPosition(significantPercent); |
||||||
|
var v = self._getValueByPercent(significantPercent); |
||||||
|
self.value = BI.parseInt(v); |
||||||
|
self.slider.setValue(self.getValue()); |
||||||
|
self.fireEvent(BI.SliderNormal.EVENT_CHANGE); |
||||||
|
} |
||||||
|
}); |
||||||
|
|
||||||
|
BI.createWidget({ |
||||||
|
type: "bi.absolute", |
||||||
|
element: this, |
||||||
|
items: [{ |
||||||
|
el: { |
||||||
|
type: "bi.vertical", |
||||||
|
items: [{ |
||||||
|
type: "bi.absolute", |
||||||
|
items: [{ |
||||||
|
el: this.track, |
||||||
|
width: "100%", |
||||||
|
height: c.TRACK_HEIGHT |
||||||
|
}] |
||||||
|
}], |
||||||
|
height: c.TRACK_HEIGHT |
||||||
|
}, |
||||||
|
top: 33, |
||||||
|
left: 0, |
||||||
|
width: "100%" |
||||||
|
}, { |
||||||
|
el: sliderVertical, |
||||||
|
top: 15, |
||||||
|
left: 0, |
||||||
|
width: "100%" |
||||||
|
}] |
||||||
|
}); |
||||||
|
}, |
||||||
|
|
||||||
|
_createTrack: function () { |
||||||
|
return BI.createWidget({ |
||||||
|
type: "bi.absolute", |
||||||
|
items: [{ |
||||||
|
el: { |
||||||
|
type: "bi.vertical", |
||||||
|
items: [{ |
||||||
|
type: "bi.absolute", |
||||||
|
items: [{ |
||||||
|
el: this.rightTrack, |
||||||
|
top: 0, |
||||||
|
left: 0, |
||||||
|
width: "100%" |
||||||
|
}] |
||||||
|
}], |
||||||
|
hgap: 8, |
||||||
|
height: 5 |
||||||
|
}, |
||||||
|
top: 5, |
||||||
|
left: 0, |
||||||
|
width: "100%" |
||||||
|
}] |
||||||
|
}) |
||||||
|
}, |
||||||
|
|
||||||
|
_checkValidation: function (v) { |
||||||
|
return !(BI.isNull(v) || v < this.min || v > this.max) |
||||||
|
}, |
||||||
|
|
||||||
|
_setSliderPosition: function (percent) { |
||||||
|
this.slider.element.css({"left": percent + "%"}); |
||||||
|
}, |
||||||
|
|
||||||
|
_getRightTrackLength: function () { |
||||||
|
return this.rightTrack.element[0].scrollWidth |
||||||
|
}, |
||||||
|
|
||||||
|
_getValueByPercent: function (percent) { |
||||||
|
var thousandth = BI.parseInt(percent * 10); |
||||||
|
return (((this.max - this.min) * thousandth) / 1000 + this.min); |
||||||
|
}, |
||||||
|
|
||||||
|
_getPercentByValue: function (v) { |
||||||
|
return (v - this.min) * 100 / (this.max - this.min); |
||||||
|
}, |
||||||
|
|
||||||
|
getValue: function () { |
||||||
|
return this.value; |
||||||
|
}, |
||||||
|
|
||||||
|
setValue: function (v) { |
||||||
|
var value = BI.parseFloat(v); |
||||||
|
if ((!isNaN(value))) { |
||||||
|
if (this._checkValidation(value)) { |
||||||
|
this.value = value; |
||||||
|
} |
||||||
|
if (value > this.max) { |
||||||
|
this.value = this.max; |
||||||
|
} |
||||||
|
if (value < this.min) { |
||||||
|
this.value = this.min; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
if (!isNaN(this.min) && !isNaN(this.max)) { |
||||||
|
this.enable = true; |
||||||
|
if (BI.isNumeric(this.value) || BI.isNotEmptyString(this.value)) { |
||||||
|
this.slider.setValue(BI.parseInt(this.value)); |
||||||
|
this._setSliderPosition(this._getPercentByValue(this.value)); |
||||||
|
} else { |
||||||
|
this.slider.setValue(this.max); |
||||||
|
this._setSliderPosition(100); |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
}); |
||||||
|
|
||||||
|
BI.SliderNormal.EVENT_CHANGE = "EVENT_CHANGE"; |
||||||
|
BI.shortcut("bi.slider", BI.SliderNormal); |
@ -0,0 +1,797 @@ |
|||||||
|
/** |
||||||
|
* Created by zcf on 2016/9/22. |
||||||
|
*/ |
||||||
|
BI.Slider = BI.inherit(BI.Widget, { |
||||||
|
_defaultConfig: function () { |
||||||
|
return BI.extend(BI.Slider.superclass._defaultConfig.apply(this, arguments), { |
||||||
|
baseCls: "bi-single-button-button" |
||||||
|
}); |
||||||
|
}, |
||||||
|
_init: function () { |
||||||
|
BI.extend(BI.Slider.superclass._init.apply(this, arguments)); |
||||||
|
this.slider = BI.createWidget({ |
||||||
|
type: "bi.icon_button", |
||||||
|
cls: "widget-button-icon button-button", |
||||||
|
iconWidth: 14, |
||||||
|
iconHeight: 14, |
||||||
|
height: 14, |
||||||
|
width: 14 |
||||||
|
}); |
||||||
|
BI.createWidget({ |
||||||
|
type: "bi.absolute", |
||||||
|
element: this, |
||||||
|
items: [{ |
||||||
|
el: this.slider, |
||||||
|
top: 7, |
||||||
|
left: -7 |
||||||
|
}], |
||||||
|
width: 0, |
||||||
|
height: 14 |
||||||
|
}); |
||||||
|
} |
||||||
|
}); |
||||||
|
BI.shortcut("bi.single_slider_slider", BI.Slider);/** |
||||||
|
* Created by zcf on 2016/9/22. |
||||||
|
*/ |
||||||
|
BI.SingleSlider = BI.inherit(BI.Widget, { |
||||||
|
_constant: { |
||||||
|
EDITOR_WIDTH: 90, |
||||||
|
EDITOR_HEIGHT: 30, |
||||||
|
HEIGHT: 28, |
||||||
|
SLIDER_WIDTH_HALF: 15, |
||||||
|
SLIDER_WIDTH: 30, |
||||||
|
SLIDER_HEIGHT: 30, |
||||||
|
TRACK_HEIGHT: 24 |
||||||
|
}, |
||||||
|
_defaultConfig: function () { |
||||||
|
return BI.extend(BI.SingleSlider.superclass._defaultConfig.apply(this, arguments), { |
||||||
|
baseCls: "bi-single-button bi-button-track" |
||||||
|
}); |
||||||
|
}, |
||||||
|
_init: function () { |
||||||
|
BI.SingleSlider.superclass._init.apply(this, arguments); |
||||||
|
|
||||||
|
var self = this; |
||||||
|
var c = this._constant; |
||||||
|
this.enable = false; |
||||||
|
this.value = ""; |
||||||
|
|
||||||
|
this.grayTrack = BI.createWidget({ |
||||||
|
type: "bi.layout", |
||||||
|
cls: "gray-track", |
||||||
|
height: 6 |
||||||
|
}); |
||||||
|
this.blueTrack = BI.createWidget({ |
||||||
|
type: "bi.layout", |
||||||
|
cls: "blue-track bi-high-light-background", |
||||||
|
height: 6 |
||||||
|
}); |
||||||
|
this.track = this._createTrackWrapper(); |
||||||
|
|
||||||
|
this.slider = BI.createWidget({ |
||||||
|
type: "bi.single_slider_slider" |
||||||
|
}); |
||||||
|
this.slider.element.draggable({ |
||||||
|
axis: "x", |
||||||
|
containment: this.grayTrack.element, |
||||||
|
scroll: false, |
||||||
|
drag: function (e, ui) { |
||||||
|
var percent = (ui.position.left) * 100 / (self._getGrayTrackLength()); |
||||||
|
var significantPercent = BI.parseFloat(percent.toFixed(1));//直接对计算出来的百分数保留到小数点后一位,相当于分成了1000份。
|
||||||
|
self._setBlueTrack(significantPercent); |
||||||
|
self._setLabelPosition(significantPercent); |
||||||
|
var v = self._getValueByPercent(significantPercent); |
||||||
|
self.label.setValue(v); |
||||||
|
self.value = v; |
||||||
|
}, |
||||||
|
stop: function (e, ui) { |
||||||
|
var percent = (ui.position.left) * 100 / (self._getGrayTrackLength()); |
||||||
|
var significantPercent = BI.parseFloat(percent.toFixed(1)); |
||||||
|
self._setSliderPosition(significantPercent); |
||||||
|
self.fireEvent(BI.SingleSlider.EVENT_CHANGE); |
||||||
|
} |
||||||
|
}); |
||||||
|
var sliderVertical = BI.createWidget({ |
||||||
|
type: "bi.vertical", |
||||||
|
items: [{ |
||||||
|
type: "bi.absolute", |
||||||
|
items: [this.slider] |
||||||
|
}], |
||||||
|
hgap: c.SLIDER_WIDTH_HALF, |
||||||
|
height: c.SLIDER_HEIGHT |
||||||
|
}); |
||||||
|
sliderVertical.element.click(function (e) { |
||||||
|
if (self.enable) { |
||||||
|
var offset = e.clientX - self.element.offset().left - c.SLIDER_WIDTH_HALF; |
||||||
|
var trackLength = self.track.element[0].scrollWidth; |
||||||
|
var percent = 0; |
||||||
|
if (offset < 0) { |
||||||
|
percent = 0 |
||||||
|
} |
||||||
|
if (offset > 0 && offset < (trackLength - c.SLIDER_WIDTH)) { |
||||||
|
percent = offset * 100 / self._getGrayTrackLength(); |
||||||
|
} |
||||||
|
if (offset > (trackLength - c.SLIDER_WIDTH)) { |
||||||
|
percent = 100 |
||||||
|
} |
||||||
|
var significantPercent = BI.parseFloat(percent.toFixed(1)); |
||||||
|
self._setAllPosition(significantPercent); |
||||||
|
var v = self._getValueByPercent(significantPercent); |
||||||
|
self.label.setValue(v); |
||||||
|
self.value = v; |
||||||
|
self.fireEvent(BI.SingleSlider.EVENT_CHANGE); |
||||||
|
} |
||||||
|
}); |
||||||
|
this.label = BI.createWidget({ |
||||||
|
type: "bi.sign_editor", |
||||||
|
cls: "button-editor-button bi-border", |
||||||
|
errorText: "", |
||||||
|
height: c.HEIGHT, |
||||||
|
width: c.EDITOR_WIDTH, |
||||||
|
allowBlank: false, |
||||||
|
validationChecker: function (v) { |
||||||
|
return self._checkValidation(v); |
||||||
|
}, |
||||||
|
quitChecker: function (v) { |
||||||
|
return self._checkValidation(v); |
||||||
|
} |
||||||
|
}); |
||||||
|
this.label.on(BI.SignEditor.EVENT_CONFIRM, function () { |
||||||
|
var percent = self._getPercentByValue(this.getValue()); |
||||||
|
var significantPercent = BI.parseFloat(percent.toFixed(1)); |
||||||
|
self._setAllPosition(significantPercent); |
||||||
|
self.fireEvent(BI.SingleSlider.EVENT_CHANGE); |
||||||
|
}); |
||||||
|
this._setVisible(false); |
||||||
|
BI.createWidget({ |
||||||
|
type: "bi.absolute", |
||||||
|
element: this, |
||||||
|
items: [{ |
||||||
|
el: { |
||||||
|
type: "bi.vertical", |
||||||
|
items: [{ |
||||||
|
type: "bi.absolute", |
||||||
|
items: [{ |
||||||
|
el: this.track, |
||||||
|
width: "100%", |
||||||
|
height: c.TRACK_HEIGHT |
||||||
|
}] |
||||||
|
}], |
||||||
|
hgap: 7, |
||||||
|
height: c.TRACK_HEIGHT |
||||||
|
}, |
||||||
|
top: 33, |
||||||
|
left: 0, |
||||||
|
width: "100%" |
||||||
|
}, { |
||||||
|
el: sliderVertical, |
||||||
|
top: 30, |
||||||
|
left: 0, |
||||||
|
width: "100%" |
||||||
|
}, { |
||||||
|
el: { |
||||||
|
type: "bi.vertical", |
||||||
|
items: [{ |
||||||
|
type: "bi.absolute", |
||||||
|
items: [this.label] |
||||||
|
}], |
||||||
|
rgap: c.EDITOR_WIDTH, |
||||||
|
height: c.EDITOR_HEIGHT |
||||||
|
}, |
||||||
|
top: 0, |
||||||
|
left: 0, |
||||||
|
width: "100%" |
||||||
|
}] |
||||||
|
}) |
||||||
|
}, |
||||||
|
|
||||||
|
_createTrackWrapper: function () { |
||||||
|
return BI.createWidget({ |
||||||
|
type: "bi.absolute", |
||||||
|
items: [{ |
||||||
|
el: { |
||||||
|
type: "bi.vertical", |
||||||
|
items: [{ |
||||||
|
type: "bi.absolute", |
||||||
|
items: [{ |
||||||
|
el: this.grayTrack, |
||||||
|
top: 0, |
||||||
|
left: 0, |
||||||
|
width: "100%" |
||||||
|
}, { |
||||||
|
el: this.blueTrack, |
||||||
|
top: 0, |
||||||
|
left: 0, |
||||||
|
width: "0%" |
||||||
|
}] |
||||||
|
}], |
||||||
|
hgap: 8, |
||||||
|
height: 8 |
||||||
|
}, |
||||||
|
top: 8, |
||||||
|
left: 0, |
||||||
|
width: "100%" |
||||||
|
}] |
||||||
|
}) |
||||||
|
}, |
||||||
|
|
||||||
|
_checkValidation: function (v) { |
||||||
|
return !(BI.isNull(v) || v < this.min || v > this.max) |
||||||
|
}, |
||||||
|
|
||||||
|
_setBlueTrack: function (percent) { |
||||||
|
this.blueTrack.element.css({"width": percent + "%"}); |
||||||
|
}, |
||||||
|
|
||||||
|
_setLabelPosition: function (percent) { |
||||||
|
this.label.element.css({"left": percent + "%"}); |
||||||
|
}, |
||||||
|
|
||||||
|
_setSliderPosition: function (percent) { |
||||||
|
this.slider.element.css({"left": percent + "%"}); |
||||||
|
}, |
||||||
|
|
||||||
|
_setAllPosition: function (percent) { |
||||||
|
this._setSliderPosition(percent); |
||||||
|
this._setLabelPosition(percent); |
||||||
|
this._setBlueTrack(percent); |
||||||
|
}, |
||||||
|
|
||||||
|
_setVisible: function (visible) { |
||||||
|
this.slider.setVisible(visible); |
||||||
|
this.label.setVisible(visible); |
||||||
|
}, |
||||||
|
|
||||||
|
_getGrayTrackLength: function () { |
||||||
|
return this.grayTrack.element[0].scrollWidth |
||||||
|
}, |
||||||
|
|
||||||
|
_getValueByPercent: function (percent) { |
||||||
|
var thousandth = BI.parseInt(percent * 10); |
||||||
|
return (((this.max - this.min) * thousandth) / 1000 + this.min); |
||||||
|
}, |
||||||
|
|
||||||
|
_getPercentByValue: function (v) { |
||||||
|
return (v - this.min) * 100 / (this.max - this.min); |
||||||
|
}, |
||||||
|
|
||||||
|
getValue: function () { |
||||||
|
return this.value; |
||||||
|
}, |
||||||
|
|
||||||
|
setValue: function (v) { |
||||||
|
var value = BI.parseFloat(v); |
||||||
|
if ((!isNaN(value))) { |
||||||
|
if (this._checkValidation(value)) { |
||||||
|
this.value = value; |
||||||
|
} |
||||||
|
if (value > this.max) { |
||||||
|
this.value = this.max; |
||||||
|
} |
||||||
|
if (value < this.min) { |
||||||
|
this.value = this.min; |
||||||
|
} |
||||||
|
} |
||||||
|
}, |
||||||
|
|
||||||
|
setMinAndMax: function (v) { |
||||||
|
var minNumber = BI.parseFloat(v.min); |
||||||
|
var maxNumber = BI.parseFloat(v.max); |
||||||
|
if ((!isNaN(minNumber)) && (!isNaN(maxNumber)) && (maxNumber > minNumber )) { |
||||||
|
this.min = minNumber; |
||||||
|
this.max = maxNumber; |
||||||
|
} |
||||||
|
}, |
||||||
|
|
||||||
|
reset: function () { |
||||||
|
this._setVisible(false); |
||||||
|
this.enable = false; |
||||||
|
this.value = ""; |
||||||
|
this.min = 0; |
||||||
|
this.max = 0; |
||||||
|
this._setBlueTrack(0); |
||||||
|
}, |
||||||
|
|
||||||
|
populate: function () { |
||||||
|
if (!isNaN(this.min) && !isNaN(this.max)) { |
||||||
|
this._setVisible(true); |
||||||
|
this.enable = true; |
||||||
|
this.label.setErrorText(BI.i18nText("BI-Please_Enter") + this.min + "-" + this.max + BI.i18nText("BI-Basic_De") + BI.i18nText("BI-Basic_Number")); |
||||||
|
if (BI.isNumeric(this.value) || BI.isNotEmptyString(this.value)) { |
||||||
|
this.label.setValue(this.value); |
||||||
|
this._setAllPosition(this._getPercentByValue(this.value)); |
||||||
|
} else { |
||||||
|
this.label.setValue(this.max); |
||||||
|
this._setAllPosition(100); |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
}); |
||||||
|
BI.SingleSlider.EVENT_CHANGE = "EVENT_CHANGE"; |
||||||
|
BI.shortcut("bi.single_slider", BI.SingleSlider);/** |
||||||
|
* normal single slider |
||||||
|
* Created by Young on 2017/6/21. |
||||||
|
*/ |
||||||
|
BI.SingleSliderNormal = BI.inherit(BI.Widget, { |
||||||
|
|
||||||
|
_constant: { |
||||||
|
EDITOR_WIDTH: 90, |
||||||
|
EDITOR_HEIGHT: 30, |
||||||
|
HEIGHT: 28, |
||||||
|
SLIDER_WIDTH_HALF: 15, |
||||||
|
SLIDER_WIDTH: 30, |
||||||
|
SLIDER_HEIGHT: 30, |
||||||
|
TRACK_HEIGHT: 24 |
||||||
|
}, |
||||||
|
|
||||||
|
props: { |
||||||
|
baseCls: "bi-single-button bi-button-track", |
||||||
|
minMax: { |
||||||
|
min: 0, |
||||||
|
max: 100 |
||||||
|
}, |
||||||
|
color: "#3f8ce8" |
||||||
|
}, |
||||||
|
|
||||||
|
render: function () { |
||||||
|
var self = this; |
||||||
|
var c = this._constant; |
||||||
|
var track = this._createTrack(); |
||||||
|
this.slider = BI.createWidget({ |
||||||
|
type: "bi.single_slider_slider" |
||||||
|
}); |
||||||
|
this.slider.element.draggable({ |
||||||
|
axis: "x", |
||||||
|
containment: this.grayTrack.element, |
||||||
|
scroll: false, |
||||||
|
drag: function (e, ui) { |
||||||
|
var percent = (ui.position.left) * 100 / (self._getGrayTrackLength()); |
||||||
|
var significantPercent = BI.parseFloat(percent.toFixed(1));//直接对计算出来的百分数保留到小数点后一位,相当于分成了1000份。
|
||||||
|
self._setBlueTrack(significantPercent); |
||||||
|
var v = self._getValueByPercent(significantPercent); |
||||||
|
self.value = v; |
||||||
|
self.fireEvent(BI.SingleSliderNormal.EVENT_DRAG, v); |
||||||
|
}, |
||||||
|
stop: function (e, ui) { |
||||||
|
var percent = (ui.position.left) * 100 / (self._getGrayTrackLength()); |
||||||
|
var significantPercent = BI.parseFloat(percent.toFixed(1)); |
||||||
|
self._setSliderPosition(significantPercent); |
||||||
|
self.fireEvent(BI.SingleSlider.EVENT_CHANGE); |
||||||
|
} |
||||||
|
}); |
||||||
|
|
||||||
|
var sliderVertical = BI.createWidget({ |
||||||
|
type: "bi.vertical", |
||||||
|
items: [{ |
||||||
|
type: "bi.absolute", |
||||||
|
items: [this.slider] |
||||||
|
}], |
||||||
|
hgap: c.SLIDER_WIDTH_HALF, |
||||||
|
height: c.SLIDER_HEIGHT |
||||||
|
}); |
||||||
|
sliderVertical.element.click(function (e) { |
||||||
|
if (self.enable) { |
||||||
|
var offset = e.clientX - self.element.offset().left - c.SLIDER_WIDTH_HALF; |
||||||
|
var trackLength = self.track.element[0].scrollWidth; |
||||||
|
var percent = 0; |
||||||
|
if (offset < 0) { |
||||||
|
percent = 0 |
||||||
|
} |
||||||
|
if (offset > 0 && offset < (trackLength - c.SLIDER_WIDTH)) { |
||||||
|
percent = offset * 100 / self._getGrayTrackLength(); |
||||||
|
} |
||||||
|
if (offset > (trackLength - c.SLIDER_WIDTH)) { |
||||||
|
percent = 100 |
||||||
|
} |
||||||
|
var significantPercent = BI.parseFloat(percent.toFixed(1)); |
||||||
|
self._setAllPosition(significantPercent); |
||||||
|
var v = self._getValueByPercent(significantPercent); |
||||||
|
self.value = v; |
||||||
|
self.fireEvent(BI.SingleSlider.EVENT_CHANGE); |
||||||
|
} |
||||||
|
}); |
||||||
|
|
||||||
|
return { |
||||||
|
type: "bi.absolute", |
||||||
|
element: this, |
||||||
|
items: [{ |
||||||
|
el: { |
||||||
|
type: "bi.vertical", |
||||||
|
items: [{ |
||||||
|
type: "bi.absolute", |
||||||
|
items: [{ |
||||||
|
el: track, |
||||||
|
width: "100%", |
||||||
|
height: c.TRACK_HEIGHT |
||||||
|
}] |
||||||
|
}], |
||||||
|
hgap: 7, |
||||||
|
height: c.TRACK_HEIGHT |
||||||
|
}, |
||||||
|
top: 3, |
||||||
|
left: 0, |
||||||
|
width: "100%" |
||||||
|
}, { |
||||||
|
el: sliderVertical, |
||||||
|
top: 0, |
||||||
|
left: 0, |
||||||
|
width: "100%" |
||||||
|
}] |
||||||
|
} |
||||||
|
}, |
||||||
|
|
||||||
|
_createTrack: function () { |
||||||
|
var self = this; |
||||||
|
var c = this._constant; |
||||||
|
this.grayTrack = BI.createWidget({ |
||||||
|
type: "bi.layout", |
||||||
|
cls: "gray-track", |
||||||
|
height: 6 |
||||||
|
}); |
||||||
|
this.blueTrack = BI.createWidget({ |
||||||
|
type: "bi.layout", |
||||||
|
cls: "blue-track", |
||||||
|
height: 6 |
||||||
|
}); |
||||||
|
this.blueTrack.element.css({"background-color": this.options.color}); |
||||||
|
|
||||||
|
return { |
||||||
|
type: "bi.absolute", |
||||||
|
items: [{ |
||||||
|
el: { |
||||||
|
type: "bi.vertical", |
||||||
|
items: [{ |
||||||
|
type: "bi.absolute", |
||||||
|
items: [{ |
||||||
|
el: this.grayTrack, |
||||||
|
top: 0, |
||||||
|
left: 0, |
||||||
|
width: "100%" |
||||||
|
}, { |
||||||
|
el: this.blueTrack, |
||||||
|
top: 0, |
||||||
|
left: 0, |
||||||
|
width: "0%" |
||||||
|
}] |
||||||
|
}], |
||||||
|
hgap: 8, |
||||||
|
height: 8 |
||||||
|
}, |
||||||
|
top: 8, |
||||||
|
left: 0, |
||||||
|
width: "100%" |
||||||
|
}], |
||||||
|
ref: function (ref) { |
||||||
|
self.track = ref; |
||||||
|
} |
||||||
|
} |
||||||
|
}, |
||||||
|
|
||||||
|
_checkValidation: function (v) { |
||||||
|
return !(BI.isNull(v) || v < this.min || v > this.max) |
||||||
|
}, |
||||||
|
|
||||||
|
_setBlueTrack: function (percent) { |
||||||
|
this.blueTrack.element.css({"width": percent + "%"}); |
||||||
|
}, |
||||||
|
|
||||||
|
_setSliderPosition: function (percent) { |
||||||
|
this.slider.element.css({"left": percent + "%"}); |
||||||
|
}, |
||||||
|
|
||||||
|
_setAllPosition: function (percent) { |
||||||
|
this._setSliderPosition(percent); |
||||||
|
this._setBlueTrack(percent); |
||||||
|
}, |
||||||
|
|
||||||
|
_setVisible: function (visible) { |
||||||
|
this.slider.setVisible(visible); |
||||||
|
}, |
||||||
|
|
||||||
|
_getGrayTrackLength: function () { |
||||||
|
return this.grayTrack.element[0].scrollWidth |
||||||
|
}, |
||||||
|
|
||||||
|
_getValueByPercent: function (percent) { |
||||||
|
var thousandth = BI.parseInt(percent * 10); |
||||||
|
return (((this.max - this.min) * thousandth) / 1000 + this.min); |
||||||
|
}, |
||||||
|
|
||||||
|
_getPercentByValue: function (v) { |
||||||
|
return (v - this.min) * 100 / (this.max - this.min); |
||||||
|
}, |
||||||
|
|
||||||
|
getValue: function () { |
||||||
|
return this.value; |
||||||
|
}, |
||||||
|
|
||||||
|
setValue: function (v) { |
||||||
|
var value = BI.parseFloat(v); |
||||||
|
if ((!isNaN(value))) { |
||||||
|
if (this._checkValidation(value)) { |
||||||
|
this.value = value; |
||||||
|
} |
||||||
|
if (value > this.max) { |
||||||
|
this.value = this.max; |
||||||
|
} |
||||||
|
if (value < this.min) { |
||||||
|
this.value = this.min; |
||||||
|
} |
||||||
|
} |
||||||
|
}, |
||||||
|
|
||||||
|
setMinAndMax: function (v) { |
||||||
|
var minNumber = BI.parseFloat(v.min); |
||||||
|
var maxNumber = BI.parseFloat(v.max); |
||||||
|
if ((!isNaN(minNumber)) && (!isNaN(maxNumber)) && (maxNumber > minNumber )) { |
||||||
|
this.min = minNumber; |
||||||
|
this.max = maxNumber; |
||||||
|
} |
||||||
|
}, |
||||||
|
|
||||||
|
reset: function () { |
||||||
|
this._setVisible(false); |
||||||
|
this.enable = false; |
||||||
|
this.value = ""; |
||||||
|
this.min = 0; |
||||||
|
this.max = 0; |
||||||
|
this._setBlueTrack(0); |
||||||
|
}, |
||||||
|
|
||||||
|
populate: function () { |
||||||
|
if (!isNaN(this.min) && !isNaN(this.max)) { |
||||||
|
this._setVisible(true); |
||||||
|
this.enable = true; |
||||||
|
if (BI.isNumeric(this.value) || BI.isNotEmptyString(this.value)) { |
||||||
|
this._setAllPosition(this._getPercentByValue(this.value)); |
||||||
|
} else { |
||||||
|
this._setAllPosition(100); |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
}); |
||||||
|
BI.SingleSliderNormal.EVENT_DRAG = "EVENT_DRAG"; |
||||||
|
BI.shortcut("bi.single_slider_normal", BI.SingleSliderNormal);/** |
||||||
|
* Created by Urthur on 2017/9/4. |
||||||
|
*/ |
||||||
|
BI.SliderButton = BI.inherit(BI.Widget, { |
||||||
|
_defaultConfig: function () { |
||||||
|
return BI.extend(BI.SliderButton.superclass._defaultConfig.apply(this, arguments), { |
||||||
|
baseCls: "bi-slider-button" |
||||||
|
}); |
||||||
|
}, |
||||||
|
_init: function () { |
||||||
|
BI.extend(BI.SliderButton.superclass._init.apply(this, arguments)); |
||||||
|
var self = this; |
||||||
|
var sliderButton = BI.createWidget({ |
||||||
|
type: "bi.icon_button", |
||||||
|
cls: "column-next-page-h-font", |
||||||
|
iconWidth: 16, |
||||||
|
iconHeight: 16, |
||||||
|
height: 16, |
||||||
|
width: 16 |
||||||
|
}); |
||||||
|
BI.createWidget({ |
||||||
|
type: "bi.absolute", |
||||||
|
element: this, |
||||||
|
items: [{ |
||||||
|
el: sliderButton, |
||||||
|
left: -8 |
||||||
|
}, { |
||||||
|
el: { |
||||||
|
type: "bi.label", |
||||||
|
ref: function (_ref) { |
||||||
|
self.label = _ref; |
||||||
|
} |
||||||
|
}, |
||||||
|
left: -8, |
||||||
|
top: -10 |
||||||
|
}] |
||||||
|
}); |
||||||
|
}, |
||||||
|
|
||||||
|
setValue: function (v) { |
||||||
|
this.label.setText(v); |
||||||
|
} |
||||||
|
}); |
||||||
|
BI.shortcut("bi.slider_button", BI.SliderButton);/** |
||||||
|
* Created by Urthur on 2017/9/4. |
||||||
|
*/ |
||||||
|
BI.SliderNormal = BI.inherit(BI.Widget, { |
||||||
|
_constant: { |
||||||
|
HEIGHT: 28, |
||||||
|
SLIDER_WIDTH_HALF: 10, |
||||||
|
SLIDER_WIDTH: 25, |
||||||
|
SLIDER_HEIGHT: 30, |
||||||
|
TRACK_HEIGHT: 24 |
||||||
|
}, |
||||||
|
|
||||||
|
_defaultConfig: function () { |
||||||
|
return BI.extend(BI.SliderNormal.superclass._defaultConfig.apply(this, arguments), { |
||||||
|
baseCls: "bi-slider", |
||||||
|
min: 10, |
||||||
|
max: 50 |
||||||
|
}) |
||||||
|
}, |
||||||
|
|
||||||
|
_init: function () { |
||||||
|
BI.SliderNormal.superclass._init.apply(this, arguments); |
||||||
|
var self = this; |
||||||
|
var c = this._constant, o = this.options; |
||||||
|
this.enable = false; |
||||||
|
this.value = o.min; |
||||||
|
this.min = o.min; |
||||||
|
this.max = o.max; |
||||||
|
|
||||||
|
this.rightTrack = BI.createWidget({ |
||||||
|
type: "bi.layout", |
||||||
|
cls: "bi-slider-track", |
||||||
|
height: 5 |
||||||
|
}); |
||||||
|
this.track = this._createTrack(); |
||||||
|
|
||||||
|
this.slider = BI.createWidget({ |
||||||
|
type: "bi.slider_button" |
||||||
|
}); |
||||||
|
this.slider.setValue(this.getValue()); |
||||||
|
this.slider.element.draggable({ |
||||||
|
axis: "x", |
||||||
|
containment: this.rightTrack.element, |
||||||
|
scroll: false, |
||||||
|
drag: function (e, ui) { |
||||||
|
var percent = (ui.position.left) * 100 / (self._getRightTrackLength()); |
||||||
|
var significantPercent = BI.parseFloat(percent.toFixed(1));//直接对计算出来的百分数保留到小数点后一位,相当于分成了1000份。
|
||||||
|
var v = self._getValueByPercent(significantPercent); |
||||||
|
self.value = BI.parseInt(v) + 1; |
||||||
|
self.slider.setValue(self.getValue()); |
||||||
|
self.fireEvent(BI.SliderNormal.EVENT_CHANGE); |
||||||
|
}, |
||||||
|
stop: function (e, ui) { |
||||||
|
var percent = (ui.position.left) * 100 / (self._getRightTrackLength()); |
||||||
|
var significantPercent = BI.parseFloat(percent.toFixed(1)); |
||||||
|
self._setSliderPosition(significantPercent); |
||||||
|
self.fireEvent(BI.SliderNormal.EVENT_CHANGE); |
||||||
|
} |
||||||
|
}); |
||||||
|
var sliderVertical = BI.createWidget({ |
||||||
|
type: "bi.vertical", |
||||||
|
items: [{ |
||||||
|
type: "bi.absolute", |
||||||
|
items: [{ |
||||||
|
el: this.slider, |
||||||
|
top: 10 |
||||||
|
}] |
||||||
|
}], |
||||||
|
hgap: c.SLIDER_WIDTH_HALF, |
||||||
|
height: c.SLIDER_HEIGHT |
||||||
|
}); |
||||||
|
sliderVertical.element.click(function (e) { |
||||||
|
if (self.enable) { |
||||||
|
var offset = e.clientX - self.element.offset().left - c.SLIDER_WIDTH_HALF; |
||||||
|
var trackLength = self.track.element[0].scrollWidth; |
||||||
|
var percent = 0; |
||||||
|
if (offset < 0) { |
||||||
|
percent = 0 |
||||||
|
} |
||||||
|
if (offset > 0 && offset < (trackLength - c.SLIDER_WIDTH)) { |
||||||
|
percent = offset * 100 / self._getRightTrackLength(); |
||||||
|
} |
||||||
|
if (offset > (trackLength - c.SLIDER_WIDTH)) { |
||||||
|
percent = 100 |
||||||
|
} |
||||||
|
var significantPercent = BI.parseFloat(percent.toFixed(1)); |
||||||
|
self._setSliderPosition(significantPercent); |
||||||
|
var v = self._getValueByPercent(significantPercent); |
||||||
|
self.value = BI.parseInt(v); |
||||||
|
self.slider.setValue(self.getValue()); |
||||||
|
self.fireEvent(BI.SliderNormal.EVENT_CHANGE); |
||||||
|
} |
||||||
|
}); |
||||||
|
|
||||||
|
BI.createWidget({ |
||||||
|
type: "bi.absolute", |
||||||
|
element: this, |
||||||
|
items: [{ |
||||||
|
el: { |
||||||
|
type: "bi.vertical", |
||||||
|
items: [{ |
||||||
|
type: "bi.absolute", |
||||||
|
items: [{ |
||||||
|
el: this.track, |
||||||
|
width: "100%", |
||||||
|
height: c.TRACK_HEIGHT |
||||||
|
}] |
||||||
|
}], |
||||||
|
height: c.TRACK_HEIGHT |
||||||
|
}, |
||||||
|
top: 33, |
||||||
|
left: 0, |
||||||
|
width: "100%" |
||||||
|
}, { |
||||||
|
el: sliderVertical, |
||||||
|
top: 15, |
||||||
|
left: 0, |
||||||
|
width: "100%" |
||||||
|
}] |
||||||
|
}); |
||||||
|
}, |
||||||
|
|
||||||
|
_createTrack: function () { |
||||||
|
return BI.createWidget({ |
||||||
|
type: "bi.absolute", |
||||||
|
items: [{ |
||||||
|
el: { |
||||||
|
type: "bi.vertical", |
||||||
|
items: [{ |
||||||
|
type: "bi.absolute", |
||||||
|
items: [{ |
||||||
|
el: this.rightTrack, |
||||||
|
top: 0, |
||||||
|
left: 0, |
||||||
|
width: "100%" |
||||||
|
}] |
||||||
|
}], |
||||||
|
hgap: 8, |
||||||
|
height: 5 |
||||||
|
}, |
||||||
|
top: 5, |
||||||
|
left: 0, |
||||||
|
width: "100%" |
||||||
|
}] |
||||||
|
}) |
||||||
|
}, |
||||||
|
|
||||||
|
_checkValidation: function (v) { |
||||||
|
return !(BI.isNull(v) || v < this.min || v > this.max) |
||||||
|
}, |
||||||
|
|
||||||
|
_setSliderPosition: function (percent) { |
||||||
|
this.slider.element.css({"left": percent + "%"}); |
||||||
|
}, |
||||||
|
|
||||||
|
_getRightTrackLength: function () { |
||||||
|
return this.rightTrack.element[0].scrollWidth |
||||||
|
}, |
||||||
|
|
||||||
|
_getValueByPercent: function (percent) { |
||||||
|
var thousandth = BI.parseInt(percent * 10); |
||||||
|
return (((this.max - this.min) * thousandth) / 1000 + this.min); |
||||||
|
}, |
||||||
|
|
||||||
|
_getPercentByValue: function (v) { |
||||||
|
return (v - this.min) * 100 / (this.max - this.min); |
||||||
|
}, |
||||||
|
|
||||||
|
getValue: function () { |
||||||
|
return this.value; |
||||||
|
}, |
||||||
|
|
||||||
|
setValue: function (v) { |
||||||
|
var value = BI.parseFloat(v); |
||||||
|
if ((!isNaN(value))) { |
||||||
|
if (this._checkValidation(value)) { |
||||||
|
this.value = value; |
||||||
|
} |
||||||
|
if (value > this.max) { |
||||||
|
this.value = this.max; |
||||||
|
} |
||||||
|
if (value < this.min) { |
||||||
|
this.value = this.min; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
if (!isNaN(this.min) && !isNaN(this.max)) { |
||||||
|
this.enable = true; |
||||||
|
if (BI.isNumeric(this.value) || BI.isNotEmptyString(this.value)) { |
||||||
|
this.slider.setValue(BI.parseInt(this.value)); |
||||||
|
this._setSliderPosition(this._getPercentByValue(this.value)); |
||||||
|
} else { |
||||||
|
this.slider.setValue(this.max); |
||||||
|
this._setSliderPosition(100); |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
}); |
||||||
|
|
||||||
|
BI.SliderNormal.EVENT_CHANGE = "EVENT_CHANGE"; |
||||||
|
BI.shortcut("bi.slider", BI.SliderNormal); |
@ -0,0 +1,320 @@ |
|||||||
|
/*! |
||||||
|
* jQuery UI Core 1.10.2 |
||||||
|
* http://jqueryui.com
|
||||||
|
* |
||||||
|
* Copyright 2013 jQuery Foundation and other contributors |
||||||
|
* Released under the MIT license. |
||||||
|
* http://jquery.org/license
|
||||||
|
* |
||||||
|
* http://api.jqueryui.com/category/ui-core/
|
||||||
|
*/ |
||||||
|
(function( $, undefined ) { |
||||||
|
|
||||||
|
var uuid = 0, |
||||||
|
runiqueId = /^ui-id-\d+$/; |
||||||
|
|
||||||
|
// $.ui might exist from components with no dependencies, e.g., $.ui.position
|
||||||
|
$.ui = $.ui || {}; |
||||||
|
|
||||||
|
$.extend( $.ui, { |
||||||
|
version: "1.10.2", |
||||||
|
|
||||||
|
keyCode: { |
||||||
|
BACKSPACE: 8, |
||||||
|
COMMA: 188, |
||||||
|
DELETE: 46, |
||||||
|
DOWN: 40, |
||||||
|
END: 35, |
||||||
|
ENTER: 13, |
||||||
|
ESCAPE: 27, |
||||||
|
HOME: 36, |
||||||
|
LEFT: 37, |
||||||
|
NUMPAD_ADD: 107, |
||||||
|
NUMPAD_DECIMAL: 110, |
||||||
|
NUMPAD_DIVIDE: 111, |
||||||
|
NUMPAD_ENTER: 108, |
||||||
|
NUMPAD_MULTIPLY: 106, |
||||||
|
NUMPAD_SUBTRACT: 109, |
||||||
|
PAGE_DOWN: 34, |
||||||
|
PAGE_UP: 33, |
||||||
|
PERIOD: 190, |
||||||
|
RIGHT: 39, |
||||||
|
SPACE: 32, |
||||||
|
TAB: 9, |
||||||
|
UP: 38 |
||||||
|
} |
||||||
|
}); |
||||||
|
|
||||||
|
// plugins
|
||||||
|
$.fn.extend({ |
||||||
|
focus: (function( orig ) { |
||||||
|
return function( delay, fn ) { |
||||||
|
return typeof delay === "number" ? |
||||||
|
this.each(function() { |
||||||
|
var elem = this; |
||||||
|
setTimeout(function() { |
||||||
|
$( elem ).focus(); |
||||||
|
if ( fn ) { |
||||||
|
fn.call( elem ); |
||||||
|
} |
||||||
|
}, delay ); |
||||||
|
}) : |
||||||
|
orig.apply( this, arguments ); |
||||||
|
}; |
||||||
|
})( $.fn.focus ), |
||||||
|
|
||||||
|
scrollParent: function() { |
||||||
|
var scrollParent; |
||||||
|
if (($.ui.ie && (/(static|relative)/).test(this.css("position"))) || (/absolute/).test(this.css("position"))) { |
||||||
|
scrollParent = this.parents().filter(function() { |
||||||
|
return (/(relative|absolute|fixed)/).test($.css(this,"position")) && (/(auto|scroll)/).test($.css(this,"overflow")+$.css(this,"overflow-y")+$.css(this,"overflow-x")); |
||||||
|
}).eq(0); |
||||||
|
} else { |
||||||
|
scrollParent = this.parents().filter(function() { |
||||||
|
return (/(auto|scroll)/).test($.css(this,"overflow")+$.css(this,"overflow-y")+$.css(this,"overflow-x")); |
||||||
|
}).eq(0); |
||||||
|
} |
||||||
|
|
||||||
|
return (/fixed/).test(this.css("position")) || !scrollParent.length ? $(document) : scrollParent; |
||||||
|
}, |
||||||
|
|
||||||
|
zIndex: function( zIndex ) { |
||||||
|
if ( zIndex !== undefined ) { |
||||||
|
return this.css( "zIndex", zIndex ); |
||||||
|
} |
||||||
|
|
||||||
|
if ( this.length ) { |
||||||
|
var elem = $( this[ 0 ] ), position, value; |
||||||
|
while ( elem.length && elem[ 0 ] !== document ) { |
||||||
|
// Ignore z-index if position is set to a value where z-index is ignored by the browser
|
||||||
|
// This makes behavior of this function consistent across browsers
|
||||||
|
// WebKit always returns auto if the element is positioned
|
||||||
|
position = elem.css( "position" ); |
||||||
|
if ( position === "absolute" || position === "relative" || position === "fixed" ) { |
||||||
|
// IE returns 0 when zIndex is not specified
|
||||||
|
// other browsers return a string
|
||||||
|
// we ignore the case of nested elements with an explicit value of 0
|
||||||
|
// <div style="z-index: -10;"><div style="z-index: 0;"></div></div>
|
||||||
|
value = parseInt( elem.css( "zIndex" ), 10 ); |
||||||
|
if ( !isNaN( value ) && value !== 0 ) { |
||||||
|
return value; |
||||||
|
} |
||||||
|
} |
||||||
|
elem = elem.parent(); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
return 0; |
||||||
|
}, |
||||||
|
|
||||||
|
uniqueId: function() { |
||||||
|
return this.each(function() { |
||||||
|
if ( !this.id ) { |
||||||
|
this.id = "ui-id-" + (++uuid); |
||||||
|
} |
||||||
|
}); |
||||||
|
}, |
||||||
|
|
||||||
|
removeUniqueId: function() { |
||||||
|
return this.each(function() { |
||||||
|
if ( runiqueId.test( this.id ) ) { |
||||||
|
$( this ).removeAttr( "id" ); |
||||||
|
} |
||||||
|
}); |
||||||
|
} |
||||||
|
}); |
||||||
|
|
||||||
|
// selectors
|
||||||
|
function focusable( element, isTabIndexNotNaN ) { |
||||||
|
var map, mapName, img, |
||||||
|
nodeName = element.nodeName.toLowerCase(); |
||||||
|
if ( "area" === nodeName ) { |
||||||
|
map = element.parentNode; |
||||||
|
mapName = map.name; |
||||||
|
if ( !element.href || !mapName || map.nodeName.toLowerCase() !== "map" ) { |
||||||
|
return false; |
||||||
|
} |
||||||
|
img = $( "img[usemap=#" + mapName + "]" )[0]; |
||||||
|
return !!img && visible( img ); |
||||||
|
} |
||||||
|
return ( /input|select|textarea|button|object/.test( nodeName ) ? |
||||||
|
!element.disabled : |
||||||
|
"a" === nodeName ? |
||||||
|
element.href || isTabIndexNotNaN : |
||||||
|
isTabIndexNotNaN) && |
||||||
|
// the element and all of its ancestors must be visible
|
||||||
|
visible( element ); |
||||||
|
} |
||||||
|
|
||||||
|
function visible( element ) { |
||||||
|
return $.expr.filters.visible( element ) && |
||||||
|
!$( element ).parents().addBack().filter(function() { |
||||||
|
return $.css( this, "visibility" ) === "hidden"; |
||||||
|
}).length; |
||||||
|
} |
||||||
|
|
||||||
|
$.extend( $.expr[ ":" ], { |
||||||
|
data: $.expr.createPseudo ? |
||||||
|
$.expr.createPseudo(function( dataName ) { |
||||||
|
return function( elem ) { |
||||||
|
return !!$.data( elem, dataName ); |
||||||
|
}; |
||||||
|
}) : |
||||||
|
// support: jQuery <1.8
|
||||||
|
function( elem, i, match ) { |
||||||
|
return !!$.data( elem, match[ 3 ] ); |
||||||
|
}, |
||||||
|
|
||||||
|
focusable: function( element ) { |
||||||
|
return focusable( element, !isNaN( $.attr( element, "tabindex" ) ) ); |
||||||
|
}, |
||||||
|
|
||||||
|
tabbable: function( element ) { |
||||||
|
var tabIndex = $.attr( element, "tabindex" ), |
||||||
|
isTabIndexNaN = isNaN( tabIndex ); |
||||||
|
return ( isTabIndexNaN || tabIndex >= 0 ) && focusable( element, !isTabIndexNaN ); |
||||||
|
} |
||||||
|
}); |
||||||
|
|
||||||
|
// support: jQuery <1.8
|
||||||
|
if ( !$( "<a>" ).outerWidth( 1 ).jquery ) { |
||||||
|
$.each( [ "Width", "Height" ], function( i, name ) { |
||||||
|
var side = name === "Width" ? [ "Left", "Right" ] : [ "Top", "Bottom" ], |
||||||
|
type = name.toLowerCase(), |
||||||
|
orig = { |
||||||
|
innerWidth: $.fn.innerWidth, |
||||||
|
innerHeight: $.fn.innerHeight, |
||||||
|
outerWidth: $.fn.outerWidth, |
||||||
|
outerHeight: $.fn.outerHeight |
||||||
|
}; |
||||||
|
|
||||||
|
function reduce( elem, size, border, margin ) { |
||||||
|
$.each( side, function() { |
||||||
|
size -= parseFloat( $.css( elem, "padding" + this ) ) || 0; |
||||||
|
if ( border ) { |
||||||
|
size -= parseFloat( $.css( elem, "border" + this + "Width" ) ) || 0; |
||||||
|
} |
||||||
|
if ( margin ) { |
||||||
|
size -= parseFloat( $.css( elem, "margin" + this ) ) || 0; |
||||||
|
} |
||||||
|
}); |
||||||
|
return size; |
||||||
|
} |
||||||
|
|
||||||
|
$.fn[ "inner" + name ] = function( size ) { |
||||||
|
if ( size === undefined ) { |
||||||
|
return orig[ "inner" + name ].call( this ); |
||||||
|
} |
||||||
|
|
||||||
|
return this.each(function() { |
||||||
|
$( this ).css( type, reduce( this, size ) + "px" ); |
||||||
|
}); |
||||||
|
}; |
||||||
|
|
||||||
|
$.fn[ "outer" + name] = function( size, margin ) { |
||||||
|
if ( typeof size !== "number" ) { |
||||||
|
return orig[ "outer" + name ].call( this, size ); |
||||||
|
} |
||||||
|
|
||||||
|
return this.each(function() { |
||||||
|
$( this).css( type, reduce( this, size, true, margin ) + "px" ); |
||||||
|
}); |
||||||
|
}; |
||||||
|
}); |
||||||
|
} |
||||||
|
|
||||||
|
// support: jQuery <1.8
|
||||||
|
if ( !$.fn.addBack ) { |
||||||
|
$.fn.addBack = function( selector ) { |
||||||
|
return this.add( selector == null ? |
||||||
|
this.prevObject : this.prevObject.filter( selector ) |
||||||
|
); |
||||||
|
}; |
||||||
|
} |
||||||
|
|
||||||
|
// support: jQuery 1.6.1, 1.6.2 (http://bugs.jquery.com/ticket/9413)
|
||||||
|
if ( $( "<a>" ).data( "a-b", "a" ).removeData( "a-b" ).data( "a-b" ) ) { |
||||||
|
$.fn.removeData = (function( removeData ) { |
||||||
|
return function( key ) { |
||||||
|
if ( arguments.length ) { |
||||||
|
return removeData.call( this, $.camelCase( key ) ); |
||||||
|
} else { |
||||||
|
return removeData.call( this ); |
||||||
|
} |
||||||
|
}; |
||||||
|
})( $.fn.removeData ); |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
// deprecated
|
||||||
|
$.ui.ie = !!/msie [\w.]+/.exec( navigator.userAgent.toLowerCase() ); |
||||||
|
|
||||||
|
$.support.selectstart = "onselectstart" in document.createElement( "div" ); |
||||||
|
$.fn.extend({ |
||||||
|
disableSelection: function() { |
||||||
|
return this.bind( ( $.support.selectstart ? "selectstart" : "mousedown" ) + |
||||||
|
".ui-disableSelection", function( event ) { |
||||||
|
event.preventDefault(); |
||||||
|
}); |
||||||
|
}, |
||||||
|
|
||||||
|
enableSelection: function() { |
||||||
|
return this.unbind( ".ui-disableSelection" ); |
||||||
|
} |
||||||
|
}); |
||||||
|
|
||||||
|
$.extend( $.ui, { |
||||||
|
// $.ui.plugin is deprecated. Use the proxy pattern instead.
|
||||||
|
plugin: { |
||||||
|
add: function( module, option, set ) { |
||||||
|
var i, |
||||||
|
proto = $.ui[ module ].prototype; |
||||||
|
for ( i in set ) { |
||||||
|
proto.plugins[ i ] = proto.plugins[ i ] || []; |
||||||
|
proto.plugins[ i ].push( [ option, set[ i ] ] ); |
||||||
|
} |
||||||
|
}, |
||||||
|
call: function( instance, name, args ) { |
||||||
|
var i, |
||||||
|
set = instance.plugins[ name ]; |
||||||
|
if ( !set || !instance.element[ 0 ].parentNode || instance.element[ 0 ].parentNode.nodeType === 11 ) { |
||||||
|
return; |
||||||
|
} |
||||||
|
|
||||||
|
for ( i = 0; i < set.length; i++ ) { |
||||||
|
if ( instance.options[ set[ i ][ 0 ] ] ) { |
||||||
|
set[ i ][ 1 ].apply( instance.element, args ); |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
}, |
||||||
|
|
||||||
|
// only used by resizable
|
||||||
|
hasScroll: function( el, a ) { |
||||||
|
|
||||||
|
//If overflow is hidden, the element might have extra content, but the user wants to hide it
|
||||||
|
if ( $( el ).css( "overflow" ) === "hidden") { |
||||||
|
return false; |
||||||
|
} |
||||||
|
|
||||||
|
var scroll = ( a && a === "left" ) ? "scrollLeft" : "scrollTop", |
||||||
|
has = false; |
||||||
|
|
||||||
|
if ( el[ scroll ] > 0 ) { |
||||||
|
return true; |
||||||
|
} |
||||||
|
|
||||||
|
// TODO: determine which cases actually cause this to happen
|
||||||
|
// if the element doesn't have the scroll set, see if it's possible to
|
||||||
|
// set the scroll
|
||||||
|
el[ scroll ] = 1; |
||||||
|
has = ( el[ scroll ] > 0 ); |
||||||
|
el[ scroll ] = 0; |
||||||
|
return has; |
||||||
|
} |
||||||
|
}); |
||||||
|
|
||||||
|
})( jQuery ); |
@ -0,0 +1,935 @@ |
|||||||
|
/*! |
||||||
|
* jQuery UI Draggable 1.10.2 |
||||||
|
* http://jqueryui.com
|
||||||
|
* |
||||||
|
* Copyright 2013 jQuery Foundation and other contributors |
||||||
|
* Released under the MIT license. |
||||||
|
* http://jquery.org/license
|
||||||
|
* |
||||||
|
* http://api.jqueryui.com/draggable/
|
||||||
|
* |
||||||
|
* Depends: |
||||||
|
* jquery.ui.core.js |
||||||
|
* jquery.ui.mouse.js |
||||||
|
* jquery.ui.widget.js |
||||||
|
*/ |
||||||
|
(function( $, undefined ) { |
||||||
|
|
||||||
|
$.widget("ui.draggable", $.ui.mouse, { |
||||||
|
version: "1.10.2", |
||||||
|
widgetEventPrefix: "drag", |
||||||
|
options: { |
||||||
|
addClasses: true, |
||||||
|
appendTo: "parent", |
||||||
|
axis: false, |
||||||
|
connectToSortable: false, |
||||||
|
containment: false, |
||||||
|
cursor: "auto", |
||||||
|
cursorAt: false, |
||||||
|
grid: false, |
||||||
|
handle: false, |
||||||
|
helper: "original", |
||||||
|
iframeFix: false, |
||||||
|
opacity: false, |
||||||
|
refreshPositions: false, |
||||||
|
revert: false, |
||||||
|
revertDuration: 500, |
||||||
|
scope: "default", |
||||||
|
scroll: true, |
||||||
|
scrollSensitivity: 20, |
||||||
|
scrollSpeed: 20, |
||||||
|
snap: false, |
||||||
|
snapMode: "both", |
||||||
|
snapTolerance: 20, |
||||||
|
stack: false, |
||||||
|
zIndex: false, |
||||||
|
isChangeTopLeft: true, |
||||||
|
//修改灵敏度,注意修改
|
||||||
|
distance: 10, |
||||||
|
// callbacks
|
||||||
|
drag: null, |
||||||
|
start: null, |
||||||
|
stop: null |
||||||
|
}, |
||||||
|
_create: function() { |
||||||
|
|
||||||
|
if (this.options.helper === "original" && !(/^(?:r|a|f)/).test(this.element.css("position"))) { |
||||||
|
this.element[0].style.position = "relative"; |
||||||
|
} |
||||||
|
if (this.options.addClasses){ |
||||||
|
this.element.addClass("ui-draggable"); |
||||||
|
} |
||||||
|
if (this.options.disabled){ |
||||||
|
this.element.addClass("ui-draggable-disabled"); |
||||||
|
} |
||||||
|
|
||||||
|
this._mouseInit(); |
||||||
|
|
||||||
|
}, |
||||||
|
|
||||||
|
_destroy: function() { |
||||||
|
this.element.removeClass( "ui-draggable ui-draggable-dragging ui-draggable-disabled" ); |
||||||
|
this._mouseDestroy(); |
||||||
|
}, |
||||||
|
|
||||||
|
_mouseCapture: function(event) { |
||||||
|
|
||||||
|
var o = this.options; |
||||||
|
|
||||||
|
// among others, prevent a drag on a resizable-handle
|
||||||
|
if (this.helper || o.disabled || $(event.target).closest(".ui-resizable-handle").length > 0) { |
||||||
|
return false; |
||||||
|
} |
||||||
|
|
||||||
|
//Quit if we're not on a valid handle
|
||||||
|
this.handle = this._getHandle(event); |
||||||
|
if (!this.handle) { |
||||||
|
return false; |
||||||
|
} |
||||||
|
|
||||||
|
$(o.iframeFix === true ? "iframe" : o.iframeFix).each(function() { |
||||||
|
$("<div class='ui-draggable-iframeFix' style='background: #fff;'></div>") |
||||||
|
.css({ |
||||||
|
width: this.offsetWidth+"px", height: this.offsetHeight+"px", |
||||||
|
position: "absolute", opacity: "0.001", zIndex: 1000000000 |
||||||
|
}) |
||||||
|
.css($(this).offset()) |
||||||
|
.appendTo("body"); |
||||||
|
}); |
||||||
|
|
||||||
|
return true; |
||||||
|
|
||||||
|
}, |
||||||
|
|
||||||
|
_mouseStart: function(event) { |
||||||
|
|
||||||
|
var o = this.options; |
||||||
|
|
||||||
|
//Create and append the visible helper
|
||||||
|
this.helper = this._createHelper(event); |
||||||
|
|
||||||
|
this.helper.addClass("ui-draggable-dragging"); |
||||||
|
|
||||||
|
//Cache the helper size
|
||||||
|
this._cacheHelperProportions(); |
||||||
|
|
||||||
|
//If ddmanager is used for droppables, set the global draggable
|
||||||
|
if($.ui.ddmanager) { |
||||||
|
$.ui.ddmanager.current = this; |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* - Position generation - |
||||||
|
* This block generates everything position related - it's the core of draggables. |
||||||
|
*/ |
||||||
|
|
||||||
|
//Cache the margins of the original element
|
||||||
|
this._cacheMargins(); |
||||||
|
|
||||||
|
//Store the helper's css position
|
||||||
|
this.cssPosition = this.helper.css("position"); |
||||||
|
this.scrollParent = this.helper.scrollParent(); |
||||||
|
|
||||||
|
//The element's absolute position on the page minus margins
|
||||||
|
this.offset = this.positionAbs = this.element.offset(); |
||||||
|
this.offset = { |
||||||
|
top: this.offset.top - this.margins.top, |
||||||
|
left: this.offset.left - this.margins.left |
||||||
|
}; |
||||||
|
|
||||||
|
$.extend(this.offset, { |
||||||
|
click: { //Where the click happened, relative to the element
|
||||||
|
left: event.pageX - this.offset.left, |
||||||
|
top: event.pageY - this.offset.top |
||||||
|
}, |
||||||
|
parent: this._getParentOffset(), |
||||||
|
relative: this._getRelativeOffset() //This is a relative to absolute position minus the actual position calculation - only used for relative positioned helper
|
||||||
|
}); |
||||||
|
|
||||||
|
//Generate the original position
|
||||||
|
this.originalPosition = this.position = this._generatePosition(event); |
||||||
|
this.originalPageX = event.pageX; |
||||||
|
this.originalPageY = event.pageY; |
||||||
|
|
||||||
|
//Adjust the mouse offset relative to the helper if "cursorAt" is supplied
|
||||||
|
(o.cursorAt && this._adjustOffsetFromHelper(o.cursorAt)); |
||||||
|
|
||||||
|
//Set a containment if given in the options
|
||||||
|
if(o.containment) { |
||||||
|
this._setContainment(); |
||||||
|
} |
||||||
|
|
||||||
|
//Trigger event + callbacks
|
||||||
|
if(this._trigger("start", event) === false) { |
||||||
|
this._clear(); |
||||||
|
return false; |
||||||
|
} |
||||||
|
|
||||||
|
//Recache the helper size
|
||||||
|
this._cacheHelperProportions(); |
||||||
|
|
||||||
|
//Prepare the droppable offsets
|
||||||
|
if ($.ui.ddmanager && !o.dropBehaviour) { |
||||||
|
$.ui.ddmanager.prepareOffsets(this, event); |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
this._mouseDrag(event, true); //Execute the drag once - this causes the helper not to be visible before getting its correct position
|
||||||
|
|
||||||
|
//If the ddmanager is used for droppables, inform the manager that dragging has started (see #5003)
|
||||||
|
if ( $.ui.ddmanager ) { |
||||||
|
$.ui.ddmanager.dragStart(this, event); |
||||||
|
} |
||||||
|
|
||||||
|
return true; |
||||||
|
}, |
||||||
|
|
||||||
|
_mouseDrag: function(event, noPropagation) { |
||||||
|
|
||||||
|
//Compute the helpers position
|
||||||
|
this.position = this._generatePosition(event); |
||||||
|
this.positionAbs = this._convertPositionTo("absolute"); |
||||||
|
|
||||||
|
//Call plugins and callbacks and use the resulting position if something is returned
|
||||||
|
if (!noPropagation) { |
||||||
|
var ui = this._uiHash(); |
||||||
|
if(this._trigger("drag", event, ui) === false) { |
||||||
|
this._mouseUp({}); |
||||||
|
return false; |
||||||
|
} |
||||||
|
this.position = ui.position; |
||||||
|
} |
||||||
|
|
||||||
|
if( (!this.options.axis || this.options.axis !== "y") && (this.options.isChangeTopLeft == true) ) { |
||||||
|
this.helper[0].style.left = this.position.left+"px"; |
||||||
|
} |
||||||
|
if( (!this.options.axis || this.options.axis !== "x") && (this.options.isChangeTopLeft == true)) { |
||||||
|
this.helper[0].style.top = this.position.top+"px"; |
||||||
|
} |
||||||
|
if($.ui.ddmanager) { |
||||||
|
$.ui.ddmanager.drag(this, event); |
||||||
|
} |
||||||
|
|
||||||
|
return false; |
||||||
|
}, |
||||||
|
|
||||||
|
_mouseStop: function(event) { |
||||||
|
|
||||||
|
//If we are using droppables, inform the manager about the drop
|
||||||
|
var element, |
||||||
|
that = this, |
||||||
|
elementInDom = false, |
||||||
|
dropped = false; |
||||||
|
if ($.ui.ddmanager && !this.options.dropBehaviour) { |
||||||
|
dropped = $.ui.ddmanager.drop(this, event); |
||||||
|
} |
||||||
|
|
||||||
|
//if a drop comes from outside (a sortable)
|
||||||
|
if(this.dropped) { |
||||||
|
dropped = this.dropped; |
||||||
|
this.dropped = false; |
||||||
|
} |
||||||
|
|
||||||
|
//if the original element is no longer in the DOM don't bother to continue (see #8269)
|
||||||
|
element = this.element[0]; |
||||||
|
while ( element && (element = element.parentNode) ) { |
||||||
|
if (element === document ) { |
||||||
|
elementInDom = true; |
||||||
|
} |
||||||
|
} |
||||||
|
if ( !elementInDom && this.options.helper === "original" ) { |
||||||
|
return false; |
||||||
|
} |
||||||
|
|
||||||
|
if((this.options.revert === "invalid" && !dropped) || (this.options.revert === "valid" && dropped) || this.options.revert === true || ($.isFunction(this.options.revert) && this.options.revert.call(this.element, dropped))) { |
||||||
|
$(this.helper).animate(this.originalPosition, parseInt(this.options.revertDuration, 10), function() { |
||||||
|
if(that._trigger("stop", event) !== false) { |
||||||
|
that._clear(); |
||||||
|
} |
||||||
|
}); |
||||||
|
} else { |
||||||
|
if(this._trigger("stop", event) !== false) { |
||||||
|
this._clear(); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
return false; |
||||||
|
}, |
||||||
|
|
||||||
|
_mouseUp: function(event) { |
||||||
|
//Remove frame helpers
|
||||||
|
$("div.ui-draggable-iframeFix").each(function() { |
||||||
|
this.parentNode.removeChild(this); |
||||||
|
}); |
||||||
|
|
||||||
|
//If the ddmanager is used for droppables, inform the manager that dragging has stopped (see #5003)
|
||||||
|
if( $.ui.ddmanager ) { |
||||||
|
$.ui.ddmanager.dragStop(this, event); |
||||||
|
} |
||||||
|
|
||||||
|
return $.ui.mouse.prototype._mouseUp.call(this, event); |
||||||
|
}, |
||||||
|
|
||||||
|
cancel: function() { |
||||||
|
|
||||||
|
if(this.helper.is(".ui-draggable-dragging")) { |
||||||
|
this._mouseUp({}); |
||||||
|
} else { |
||||||
|
this._clear(); |
||||||
|
} |
||||||
|
|
||||||
|
return this; |
||||||
|
|
||||||
|
}, |
||||||
|
|
||||||
|
_getHandle: function(event) { |
||||||
|
return this.options.handle ? |
||||||
|
!!$( event.target ).closest( this.element.find( this.options.handle ) ).length : |
||||||
|
true; |
||||||
|
}, |
||||||
|
|
||||||
|
_createHelper: function(event) { |
||||||
|
|
||||||
|
var o = this.options, |
||||||
|
helper = $.isFunction(o.helper) ? $(o.helper.apply(this.element[0], [event])) : (o.helper === "clone" ? this.element.clone().removeAttr("id") : this.element); |
||||||
|
|
||||||
|
if(!helper.parents("body").length) { |
||||||
|
helper.appendTo((o.appendTo === "parent" ? this.element[0].parentNode : o.appendTo)); |
||||||
|
} |
||||||
|
|
||||||
|
if(helper[0] !== this.element[0] && !(/(fixed|absolute)/).test(helper.css("position"))) { |
||||||
|
helper.css("position", "absolute"); |
||||||
|
} |
||||||
|
|
||||||
|
return helper; |
||||||
|
|
||||||
|
}, |
||||||
|
|
||||||
|
_adjustOffsetFromHelper: function(obj) { |
||||||
|
if (typeof obj === "string") { |
||||||
|
obj = obj.split(" "); |
||||||
|
} |
||||||
|
if ($.isArray(obj)) { |
||||||
|
obj = {left: +obj[0], top: +obj[1] || 0}; |
||||||
|
} |
||||||
|
if ("left" in obj) { |
||||||
|
this.offset.click.left = obj.left + this.margins.left; |
||||||
|
} |
||||||
|
if ("right" in obj) { |
||||||
|
this.offset.click.left = this.helperProportions.width - obj.right + this.margins.left; |
||||||
|
} |
||||||
|
if ("top" in obj) { |
||||||
|
this.offset.click.top = obj.top + this.margins.top; |
||||||
|
} |
||||||
|
if ("bottom" in obj) { |
||||||
|
this.offset.click.top = this.helperProportions.height - obj.bottom + this.margins.top; |
||||||
|
} |
||||||
|
}, |
||||||
|
|
||||||
|
_getParentOffset: function() { |
||||||
|
|
||||||
|
//Get the offsetParent and cache its position
|
||||||
|
this.offsetParent = this.helper.offsetParent(); |
||||||
|
var po = this.offsetParent.offset(); |
||||||
|
|
||||||
|
// This is a special case where we need to modify a offset calculated on start, since the following happened:
|
||||||
|
// 1. The position of the helper is absolute, so it's position is calculated based on the next positioned parent
|
||||||
|
// 2. The actual offset parent is a child of the scroll parent, and the scroll parent isn't the document, which means that
|
||||||
|
// the scroll is included in the initial calculation of the offset of the parent, and never recalculated upon drag
|
||||||
|
if(this.cssPosition === "absolute" && this.scrollParent[0] !== document && $.contains(this.scrollParent[0], this.offsetParent[0])) { |
||||||
|
po.left += this.scrollParent.scrollLeft(); |
||||||
|
po.top += this.scrollParent.scrollTop(); |
||||||
|
} |
||||||
|
|
||||||
|
//This needs to be actually done for all browsers, since pageX/pageY includes this information
|
||||||
|
//Ugly IE fix
|
||||||
|
if((this.offsetParent[0] === document.body) || |
||||||
|
(this.offsetParent[0].tagName && this.offsetParent[0].tagName.toLowerCase() === "html" && $.ui.ie)) { |
||||||
|
po = { top: 0, left: 0 }; |
||||||
|
} |
||||||
|
|
||||||
|
return { |
||||||
|
top: po.top + (parseInt(this.offsetParent.css("borderTopWidth"),10) || 0), |
||||||
|
left: po.left + (parseInt(this.offsetParent.css("borderLeftWidth"),10) || 0) |
||||||
|
}; |
||||||
|
|
||||||
|
}, |
||||||
|
|
||||||
|
_getRelativeOffset: function() { |
||||||
|
|
||||||
|
if(this.cssPosition === "relative") { |
||||||
|
var p = this.element.position(); |
||||||
|
return { |
||||||
|
top: p.top - (parseInt(this.helper.css("top"),10) || 0) + this.scrollParent.scrollTop(), |
||||||
|
left: p.left - (parseInt(this.helper.css("left"),10) || 0) + this.scrollParent.scrollLeft() |
||||||
|
}; |
||||||
|
} else { |
||||||
|
return { top: 0, left: 0 }; |
||||||
|
} |
||||||
|
|
||||||
|
}, |
||||||
|
|
||||||
|
_cacheMargins: function() { |
||||||
|
this.margins = { |
||||||
|
left: (parseInt(this.element.css("marginLeft"),10) || 0), |
||||||
|
top: (parseInt(this.element.css("marginTop"),10) || 0), |
||||||
|
right: (parseInt(this.element.css("marginRight"),10) || 0), |
||||||
|
bottom: (parseInt(this.element.css("marginBottom"),10) || 0) |
||||||
|
}; |
||||||
|
}, |
||||||
|
|
||||||
|
_cacheHelperProportions: function() { |
||||||
|
this.helperProportions = { |
||||||
|
width: this.helper.outerWidth(), |
||||||
|
height: this.helper.outerHeight() |
||||||
|
}; |
||||||
|
}, |
||||||
|
|
||||||
|
_setContainment: function() { |
||||||
|
|
||||||
|
var over, c, ce, |
||||||
|
o = this.options; |
||||||
|
|
||||||
|
if(o.containment === "parent") { |
||||||
|
o.containment = this.helper[0].parentNode; |
||||||
|
} |
||||||
|
if(o.containment === "document" || o.containment === "window") { |
||||||
|
this.containment = [ |
||||||
|
o.containment === "document" ? 0 : $(window).scrollLeft() - this.offset.relative.left - this.offset.parent.left, |
||||||
|
o.containment === "document" ? 0 : $(window).scrollTop() - this.offset.relative.top - this.offset.parent.top, |
||||||
|
(o.containment === "document" ? 0 : $(window).scrollLeft()) + $(o.containment === "document" ? document : window).width() - this.helperProportions.width - this.margins.left, |
||||||
|
(o.containment === "document" ? 0 : $(window).scrollTop()) + ($(o.containment === "document" ? document : window).height() || document.body.parentNode.scrollHeight) - this.helperProportions.height - this.margins.top |
||||||
|
]; |
||||||
|
} |
||||||
|
|
||||||
|
if(!(/^(document|window|parent)$/).test(o.containment) && o.containment.constructor !== Array) { |
||||||
|
c = $(o.containment); |
||||||
|
ce = c[0]; |
||||||
|
|
||||||
|
if(!ce) { |
||||||
|
return; |
||||||
|
} |
||||||
|
|
||||||
|
over = ($(ce).css("overflow") !== "hidden"); |
||||||
|
|
||||||
|
this.containment = [ |
||||||
|
(parseInt($(ce).css("borderLeftWidth"),10) || 0) + (parseInt($(ce).css("paddingLeft"),10) || 0), |
||||||
|
(parseInt($(ce).css("borderTopWidth"),10) || 0) + (parseInt($(ce).css("paddingTop"),10) || 0), |
||||||
|
(over ? Math.max(ce.scrollWidth,ce.offsetWidth) : ce.offsetWidth) - (parseInt($(ce).css("borderRightWidth"),10) || 0) - (parseInt($(ce).css("paddingRight"),10) || 0) - this.helperProportions.width - this.margins.left - this.margins.right, |
||||||
|
(over ? Math.max(ce.scrollHeight,ce.offsetHeight) : ce.offsetHeight) - (parseInt($(ce).css("borderBottomWidth"),10) || 0) - (parseInt($(ce).css("paddingBottom"),10) || 0) - this.helperProportions.height - this.margins.top - this.margins.bottom |
||||||
|
]; |
||||||
|
this.relative_container = c; |
||||||
|
|
||||||
|
} else if(o.containment.constructor === Array) { |
||||||
|
this.containment = o.containment; |
||||||
|
} |
||||||
|
|
||||||
|
}, |
||||||
|
|
||||||
|
_convertPositionTo: function(d, pos) { |
||||||
|
|
||||||
|
if(!pos) { |
||||||
|
pos = this.position; |
||||||
|
} |
||||||
|
|
||||||
|
var mod = d === "absolute" ? 1 : -1, |
||||||
|
scroll = this.cssPosition === "absolute" && !(this.scrollParent[0] !== document && $.contains(this.scrollParent[0], this.offsetParent[0])) ? this.offsetParent : this.scrollParent, scrollIsRootNode = (/(html|body)/i).test(scroll[0].tagName); |
||||||
|
|
||||||
|
return { |
||||||
|
top: ( |
||||||
|
pos.top + // The absolute mouse position
|
||||||
|
this.offset.relative.top * mod + // Only for relative positioned nodes: Relative offset from element to offset parent
|
||||||
|
this.offset.parent.top * mod - // The offsetParent's offset without borders (offset + border)
|
||||||
|
( ( this.cssPosition === "fixed" ? -this.scrollParent.scrollTop() : ( scrollIsRootNode ? 0 : scroll.scrollTop() ) ) * mod) |
||||||
|
), |
||||||
|
left: ( |
||||||
|
pos.left + // The absolute mouse position
|
||||||
|
this.offset.relative.left * mod + // Only for relative positioned nodes: Relative offset from element to offset parent
|
||||||
|
this.offset.parent.left * mod - // The offsetParent's offset without borders (offset + border)
|
||||||
|
( ( this.cssPosition === "fixed" ? -this.scrollParent.scrollLeft() : scrollIsRootNode ? 0 : scroll.scrollLeft() ) * mod) |
||||||
|
) |
||||||
|
}; |
||||||
|
|
||||||
|
}, |
||||||
|
|
||||||
|
_generatePosition: function(event) { |
||||||
|
|
||||||
|
var containment, co, top, left, |
||||||
|
o = this.options, |
||||||
|
scroll = this.cssPosition === "absolute" && !(this.scrollParent[0] !== document && $.contains(this.scrollParent[0], this.offsetParent[0])) ? this.offsetParent : this.scrollParent, |
||||||
|
scrollIsRootNode = (/(html|body)/i).test(scroll[0].tagName), |
||||||
|
pageX = event.pageX, |
||||||
|
pageY = event.pageY; |
||||||
|
|
||||||
|
/* |
||||||
|
* - Position constraining - |
||||||
|
* Constrain the position to a mix of grid, containment. |
||||||
|
*/ |
||||||
|
|
||||||
|
if(this.originalPosition) { //If we are not dragging yet, we won't check for options
|
||||||
|
if(this.containment) { |
||||||
|
if (this.relative_container){ |
||||||
|
co = this.relative_container.offset(); |
||||||
|
containment = [ this.containment[0] + co.left, |
||||||
|
this.containment[1] + co.top, |
||||||
|
this.containment[2] + co.left, |
||||||
|
this.containment[3] + co.top ]; |
||||||
|
} |
||||||
|
else { |
||||||
|
containment = this.containment; |
||||||
|
} |
||||||
|
|
||||||
|
if(event.pageX - this.offset.click.left < containment[0]) { |
||||||
|
pageX = containment[0] + this.offset.click.left; |
||||||
|
} |
||||||
|
if(event.pageY - this.offset.click.top < containment[1]) { |
||||||
|
pageY = containment[1] + this.offset.click.top; |
||||||
|
} |
||||||
|
if(event.pageX - this.offset.click.left > containment[2]) { |
||||||
|
pageX = containment[2] + this.offset.click.left; |
||||||
|
} |
||||||
|
if(event.pageY - this.offset.click.top > containment[3]) { |
||||||
|
pageY = containment[3] + this.offset.click.top; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
if(o.grid) { |
||||||
|
//Check for grid elements set to 0 to prevent divide by 0 error causing invalid argument errors in IE (see ticket #6950)
|
||||||
|
top = o.grid[1] ? this.originalPageY + Math.round((pageY - this.originalPageY) / o.grid[1]) * o.grid[1] : this.originalPageY; |
||||||
|
pageY = containment ? ((top - this.offset.click.top >= containment[1] || top - this.offset.click.top > containment[3]) ? top : ((top - this.offset.click.top >= containment[1]) ? top - o.grid[1] : top + o.grid[1])) : top; |
||||||
|
|
||||||
|
left = o.grid[0] ? this.originalPageX + Math.round((pageX - this.originalPageX) / o.grid[0]) * o.grid[0] : this.originalPageX; |
||||||
|
pageX = containment ? ((left - this.offset.click.left >= containment[0] || left - this.offset.click.left > containment[2]) ? left : ((left - this.offset.click.left >= containment[0]) ? left - o.grid[0] : left + o.grid[0])) : left; |
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
|
|
||||||
|
return { |
||||||
|
top: ( |
||||||
|
pageY - // The absolute mouse position
|
||||||
|
this.offset.click.top - // Click offset (relative to the element)
|
||||||
|
this.offset.relative.top - // Only for relative positioned nodes: Relative offset from element to offset parent
|
||||||
|
this.offset.parent.top + // The offsetParent's offset without borders (offset + border)
|
||||||
|
( ( this.cssPosition === "fixed" ? -this.scrollParent.scrollTop() : ( scrollIsRootNode ? 0 : scroll.scrollTop() ) )) |
||||||
|
), |
||||||
|
left: ( |
||||||
|
pageX - // The absolute mouse position
|
||||||
|
this.offset.click.left - // Click offset (relative to the element)
|
||||||
|
this.offset.relative.left - // Only for relative positioned nodes: Relative offset from element to offset parent
|
||||||
|
this.offset.parent.left + // The offsetParent's offset without borders (offset + border)
|
||||||
|
( ( this.cssPosition === "fixed" ? -this.scrollParent.scrollLeft() : scrollIsRootNode ? 0 : scroll.scrollLeft() )) |
||||||
|
) |
||||||
|
}; |
||||||
|
|
||||||
|
}, |
||||||
|
|
||||||
|
_clear: function() { |
||||||
|
this.helper.removeClass("ui-draggable-dragging"); |
||||||
|
if(this.helper[0] !== this.element[0] && !this.cancelHelperRemoval) { |
||||||
|
this.helper.remove(); |
||||||
|
} |
||||||
|
this.helper = null; |
||||||
|
this.cancelHelperRemoval = false; |
||||||
|
}, |
||||||
|
|
||||||
|
// From now on bulk stuff - mainly helpers
|
||||||
|
|
||||||
|
_trigger: function(type, event, ui) { |
||||||
|
ui = ui || this._uiHash(); |
||||||
|
$.ui.plugin.call(this, type, [event, ui]); |
||||||
|
//The absolute position has to be recalculated after plugins
|
||||||
|
if(type === "drag") { |
||||||
|
this.positionAbs = this._convertPositionTo("absolute"); |
||||||
|
} |
||||||
|
return $.Widget.prototype._trigger.call(this, type, event, ui); |
||||||
|
}, |
||||||
|
|
||||||
|
plugins: {}, |
||||||
|
|
||||||
|
_uiHash: function() { |
||||||
|
return { |
||||||
|
helper: this.helper, |
||||||
|
position: this.position, |
||||||
|
originalPosition: this.originalPosition, |
||||||
|
offset: this.positionAbs |
||||||
|
}; |
||||||
|
} |
||||||
|
|
||||||
|
}); |
||||||
|
|
||||||
|
$.ui.plugin.add("draggable", "connectToSortable", { |
||||||
|
start: function(event, ui) { |
||||||
|
|
||||||
|
var inst = $(this).data("ui-draggable"), o = inst.options, |
||||||
|
uiSortable = $.extend({}, ui, { item: inst.element }); |
||||||
|
inst.sortables = []; |
||||||
|
$(o.connectToSortable).each(function() { |
||||||
|
var sortable = $.data(this, "ui-sortable"); |
||||||
|
if (sortable && !sortable.options.disabled) { |
||||||
|
inst.sortables.push({ |
||||||
|
instance: sortable, |
||||||
|
shouldRevert: sortable.options.revert |
||||||
|
}); |
||||||
|
sortable.refreshPositions(); // Call the sortable's refreshPositions at drag start to refresh the containerCache since the sortable container cache is used in drag and needs to be up to date (this will ensure it's initialised as well as being kept in step with any changes that might have happened on the page).
|
||||||
|
sortable._trigger("activate", event, uiSortable); |
||||||
|
} |
||||||
|
}); |
||||||
|
|
||||||
|
}, |
||||||
|
stop: function(event, ui) { |
||||||
|
|
||||||
|
//If we are still over the sortable, we fake the stop event of the sortable, but also remove helper
|
||||||
|
var inst = $(this).data("ui-draggable"), |
||||||
|
uiSortable = $.extend({}, ui, { item: inst.element }); |
||||||
|
|
||||||
|
$.each(inst.sortables, function() { |
||||||
|
if(this.instance.isOver) { |
||||||
|
|
||||||
|
this.instance.isOver = 0; |
||||||
|
|
||||||
|
inst.cancelHelperRemoval = true; //Don't remove the helper in the draggable instance
|
||||||
|
this.instance.cancelHelperRemoval = false; //Remove it in the sortable instance (so sortable plugins like revert still work)
|
||||||
|
|
||||||
|
//The sortable revert is supported, and we have to set a temporary dropped variable on the draggable to support revert: "valid/invalid"
|
||||||
|
if(this.shouldRevert) { |
||||||
|
this.instance.options.revert = this.shouldRevert; |
||||||
|
} |
||||||
|
|
||||||
|
//Trigger the stop of the sortable
|
||||||
|
this.instance._mouseStop(event); |
||||||
|
|
||||||
|
this.instance.options.helper = this.instance.options._helper; |
||||||
|
|
||||||
|
//If the helper has been the original item, restore properties in the sortable
|
||||||
|
if(inst.options.helper === "original") { |
||||||
|
this.instance.currentItem.css({ top: "auto", left: "auto" }); |
||||||
|
} |
||||||
|
|
||||||
|
} else { |
||||||
|
this.instance.cancelHelperRemoval = false; //Remove the helper in the sortable instance
|
||||||
|
this.instance._trigger("deactivate", event, uiSortable); |
||||||
|
} |
||||||
|
|
||||||
|
}); |
||||||
|
|
||||||
|
}, |
||||||
|
drag: function(event, ui) { |
||||||
|
|
||||||
|
var inst = $(this).data("ui-draggable"), that = this; |
||||||
|
|
||||||
|
$.each(inst.sortables, function() { |
||||||
|
|
||||||
|
var innermostIntersecting = false, |
||||||
|
thisSortable = this; |
||||||
|
|
||||||
|
//Copy over some variables to allow calling the sortable's native _intersectsWith
|
||||||
|
this.instance.positionAbs = inst.positionAbs; |
||||||
|
this.instance.helperProportions = inst.helperProportions; |
||||||
|
this.instance.offset.click = inst.offset.click; |
||||||
|
|
||||||
|
if(this.instance._intersectsWith(this.instance.containerCache)) { |
||||||
|
innermostIntersecting = true; |
||||||
|
$.each(inst.sortables, function () { |
||||||
|
this.instance.positionAbs = inst.positionAbs; |
||||||
|
this.instance.helperProportions = inst.helperProportions; |
||||||
|
this.instance.offset.click = inst.offset.click; |
||||||
|
if (this !== thisSortable && |
||||||
|
this.instance._intersectsWith(this.instance.containerCache) && |
||||||
|
$.contains(thisSortable.instance.element[0], this.instance.element[0]) |
||||||
|
) { |
||||||
|
innermostIntersecting = false; |
||||||
|
} |
||||||
|
return innermostIntersecting; |
||||||
|
}); |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
if(innermostIntersecting) { |
||||||
|
//If it intersects, we use a little isOver variable and set it once, so our move-in stuff gets fired only once
|
||||||
|
if(!this.instance.isOver) { |
||||||
|
|
||||||
|
this.instance.isOver = 1; |
||||||
|
//Now we fake the start of dragging for the sortable instance,
|
||||||
|
//by cloning the list group item, appending it to the sortable and using it as inst.currentItem
|
||||||
|
//We can then fire the start event of the sortable with our passed browser event, and our own helper (so it doesn't create a new one)
|
||||||
|
this.instance.currentItem = $(that).clone().removeAttr("id").appendTo(this.instance.element).data("ui-sortable-item", true); |
||||||
|
this.instance.options._helper = this.instance.options.helper; //Store helper option to later restore it
|
||||||
|
this.instance.options.helper = function() { return ui.helper[0]; }; |
||||||
|
|
||||||
|
event.target = this.instance.currentItem[0]; |
||||||
|
this.instance._mouseCapture(event, true); |
||||||
|
this.instance._mouseStart(event, true, true); |
||||||
|
|
||||||
|
//Because the browser event is way off the new appended portlet, we modify a couple of variables to reflect the changes
|
||||||
|
this.instance.offset.click.top = inst.offset.click.top; |
||||||
|
this.instance.offset.click.left = inst.offset.click.left; |
||||||
|
this.instance.offset.parent.left -= inst.offset.parent.left - this.instance.offset.parent.left; |
||||||
|
this.instance.offset.parent.top -= inst.offset.parent.top - this.instance.offset.parent.top; |
||||||
|
|
||||||
|
inst._trigger("toSortable", event); |
||||||
|
inst.dropped = this.instance.element; //draggable revert needs that
|
||||||
|
//hack so receive/update callbacks work (mostly)
|
||||||
|
inst.currentItem = inst.element; |
||||||
|
this.instance.fromOutside = inst; |
||||||
|
|
||||||
|
} |
||||||
|
|
||||||
|
//Provided we did all the previous steps, we can fire the drag event of the sortable on every draggable drag, when it intersects with the sortable
|
||||||
|
if(this.instance.currentItem) { |
||||||
|
this.instance._mouseDrag(event); |
||||||
|
} |
||||||
|
|
||||||
|
} else { |
||||||
|
|
||||||
|
//If it doesn't intersect with the sortable, and it intersected before,
|
||||||
|
//we fake the drag stop of the sortable, but make sure it doesn't remove the helper by using cancelHelperRemoval
|
||||||
|
if(this.instance.isOver) { |
||||||
|
|
||||||
|
this.instance.isOver = 0; |
||||||
|
this.instance.cancelHelperRemoval = true; |
||||||
|
|
||||||
|
//Prevent reverting on this forced stop
|
||||||
|
this.instance.options.revert = false; |
||||||
|
|
||||||
|
// The out event needs to be triggered independently
|
||||||
|
this.instance._trigger("out", event, this.instance._uiHash(this.instance)); |
||||||
|
|
||||||
|
this.instance._mouseStop(event, true); |
||||||
|
this.instance.options.helper = this.instance.options._helper; |
||||||
|
|
||||||
|
//Now we remove our currentItem, the list group clone again, and the placeholder, and animate the helper back to it's original size
|
||||||
|
this.instance.currentItem.remove(); |
||||||
|
if(this.instance.placeholder) { |
||||||
|
this.instance.placeholder.remove(); |
||||||
|
} |
||||||
|
|
||||||
|
inst._trigger("fromSortable", event); |
||||||
|
inst.dropped = false; //draggable revert needs that
|
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
|
|
||||||
|
}); |
||||||
|
|
||||||
|
} |
||||||
|
}); |
||||||
|
|
||||||
|
$.ui.plugin.add("draggable", "cursor", { |
||||||
|
start: function() { |
||||||
|
var t = $("body"), o = $(this).data("ui-draggable").options; |
||||||
|
if (t.css("cursor")) { |
||||||
|
o._cursor = t.css("cursor"); |
||||||
|
} |
||||||
|
t.css("cursor", o.cursor); |
||||||
|
}, |
||||||
|
stop: function() { |
||||||
|
var o = $(this).data("ui-draggable").options; |
||||||
|
if (o._cursor) { |
||||||
|
$("body").css("cursor", o._cursor); |
||||||
|
} |
||||||
|
} |
||||||
|
}); |
||||||
|
|
||||||
|
$.ui.plugin.add("draggable", "opacity", { |
||||||
|
start: function(event, ui) { |
||||||
|
var t = $(ui.helper), o = $(this).data("ui-draggable").options; |
||||||
|
if(t.css("opacity")) { |
||||||
|
o._opacity = t.css("opacity"); |
||||||
|
} |
||||||
|
t.css("opacity", o.opacity); |
||||||
|
}, |
||||||
|
stop: function(event, ui) { |
||||||
|
var o = $(this).data("ui-draggable").options; |
||||||
|
if(o._opacity) { |
||||||
|
$(ui.helper).css("opacity", o._opacity); |
||||||
|
} |
||||||
|
} |
||||||
|
}); |
||||||
|
|
||||||
|
$.ui.plugin.add("draggable", "scroll", { |
||||||
|
start: function() { |
||||||
|
var i = $(this).data("ui-draggable"); |
||||||
|
if(i.scrollParent[0] !== document && i.scrollParent[0].tagName !== "HTML") { |
||||||
|
i.overflowOffset = i.scrollParent.offset(); |
||||||
|
} |
||||||
|
}, |
||||||
|
drag: function( event ) { |
||||||
|
|
||||||
|
var i = $(this).data("ui-draggable"), o = i.options, scrolled = false; |
||||||
|
|
||||||
|
if(i.scrollParent[0] !== document && i.scrollParent[0].tagName !== "HTML") { |
||||||
|
|
||||||
|
if(!o.axis || o.axis !== "x") { |
||||||
|
if((i.overflowOffset.top + i.scrollParent[0].offsetHeight) - event.pageY < o.scrollSensitivity) { |
||||||
|
i.scrollParent[0].scrollTop = scrolled = i.scrollParent[0].scrollTop + o.scrollSpeed; |
||||||
|
} else if(event.pageY - i.overflowOffset.top < o.scrollSensitivity) { |
||||||
|
i.scrollParent[0].scrollTop = scrolled = i.scrollParent[0].scrollTop - o.scrollSpeed; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
if(!o.axis || o.axis !== "y") { |
||||||
|
if((i.overflowOffset.left + i.scrollParent[0].offsetWidth) - event.pageX < o.scrollSensitivity) { |
||||||
|
i.scrollParent[0].scrollLeft = scrolled = i.scrollParent[0].scrollLeft + o.scrollSpeed; |
||||||
|
} else if(event.pageX - i.overflowOffset.left < o.scrollSensitivity) { |
||||||
|
i.scrollParent[0].scrollLeft = scrolled = i.scrollParent[0].scrollLeft - o.scrollSpeed; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
} else { |
||||||
|
|
||||||
|
if(!o.axis || o.axis !== "x") { |
||||||
|
if(event.pageY - $(document).scrollTop() < o.scrollSensitivity) { |
||||||
|
scrolled = $(document).scrollTop($(document).scrollTop() - o.scrollSpeed); |
||||||
|
} else if($(window).height() - (event.pageY - $(document).scrollTop()) < o.scrollSensitivity) { |
||||||
|
scrolled = $(document).scrollTop($(document).scrollTop() + o.scrollSpeed); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
if(!o.axis || o.axis !== "y") { |
||||||
|
if(event.pageX - $(document).scrollLeft() < o.scrollSensitivity) { |
||||||
|
scrolled = $(document).scrollLeft($(document).scrollLeft() - o.scrollSpeed); |
||||||
|
} else if($(window).width() - (event.pageX - $(document).scrollLeft()) < o.scrollSensitivity) { |
||||||
|
scrolled = $(document).scrollLeft($(document).scrollLeft() + o.scrollSpeed); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
|
|
||||||
|
if(scrolled !== false && $.ui.ddmanager && !o.dropBehaviour) { |
||||||
|
$.ui.ddmanager.prepareOffsets(i, event); |
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
|
}); |
||||||
|
|
||||||
|
$.ui.plugin.add("draggable", "snap", { |
||||||
|
start: function() { |
||||||
|
|
||||||
|
var i = $(this).data("ui-draggable"), |
||||||
|
o = i.options; |
||||||
|
|
||||||
|
i.snapElements = []; |
||||||
|
|
||||||
|
$(o.snap.constructor !== String ? ( o.snap.items || ":data(ui-draggable)" ) : o.snap).each(function() { |
||||||
|
var $t = $(this), |
||||||
|
$o = $t.offset(); |
||||||
|
if(this !== i.element[0]) { |
||||||
|
i.snapElements.push({ |
||||||
|
item: this, |
||||||
|
width: $t.outerWidth(), height: $t.outerHeight(), |
||||||
|
top: $o.top, left: $o.left |
||||||
|
}); |
||||||
|
} |
||||||
|
}); |
||||||
|
|
||||||
|
}, |
||||||
|
drag: function(event, ui) { |
||||||
|
|
||||||
|
var ts, bs, ls, rs, l, r, t, b, i, first, |
||||||
|
inst = $(this).data("ui-draggable"), |
||||||
|
o = inst.options, |
||||||
|
d = o.snapTolerance, |
||||||
|
x1 = ui.offset.left, x2 = x1 + inst.helperProportions.width, |
||||||
|
y1 = ui.offset.top, y2 = y1 + inst.helperProportions.height; |
||||||
|
|
||||||
|
for (i = inst.snapElements.length - 1; i >= 0; i--){ |
||||||
|
|
||||||
|
l = inst.snapElements[i].left; |
||||||
|
r = l + inst.snapElements[i].width; |
||||||
|
t = inst.snapElements[i].top; |
||||||
|
b = t + inst.snapElements[i].height; |
||||||
|
|
||||||
|
//Yes, I know, this is insane ;)
|
||||||
|
if(!((l-d < x1 && x1 < r+d && t-d < y1 && y1 < b+d) || (l-d < x1 && x1 < r+d && t-d < y2 && y2 < b+d) || (l-d < x2 && x2 < r+d && t-d < y1 && y1 < b+d) || (l-d < x2 && x2 < r+d && t-d < y2 && y2 < b+d))) { |
||||||
|
if(inst.snapElements[i].snapping) { |
||||||
|
(inst.options.snap.release && inst.options.snap.release.call(inst.element, event, $.extend(inst._uiHash(), { snapItem: inst.snapElements[i].item }))); |
||||||
|
} |
||||||
|
inst.snapElements[i].snapping = false; |
||||||
|
continue; |
||||||
|
} |
||||||
|
|
||||||
|
if(o.snapMode !== "inner") { |
||||||
|
ts = Math.abs(t - y2) <= d; |
||||||
|
bs = Math.abs(b - y1) <= d; |
||||||
|
ls = Math.abs(l - x2) <= d; |
||||||
|
rs = Math.abs(r - x1) <= d; |
||||||
|
if(ts) { |
||||||
|
ui.position.top = inst._convertPositionTo("relative", { top: t - inst.helperProportions.height, left: 0 }).top - inst.margins.top; |
||||||
|
} |
||||||
|
if(bs) { |
||||||
|
ui.position.top = inst._convertPositionTo("relative", { top: b, left: 0 }).top - inst.margins.top; |
||||||
|
} |
||||||
|
if(ls) { |
||||||
|
ui.position.left = inst._convertPositionTo("relative", { top: 0, left: l - inst.helperProportions.width }).left - inst.margins.left; |
||||||
|
} |
||||||
|
if(rs) { |
||||||
|
ui.position.left = inst._convertPositionTo("relative", { top: 0, left: r }).left - inst.margins.left; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
first = (ts || bs || ls || rs); |
||||||
|
|
||||||
|
if(o.snapMode !== "outer") { |
||||||
|
ts = Math.abs(t - y1) <= d; |
||||||
|
bs = Math.abs(b - y2) <= d; |
||||||
|
ls = Math.abs(l - x1) <= d; |
||||||
|
rs = Math.abs(r - x2) <= d; |
||||||
|
if(ts) { |
||||||
|
ui.position.top = inst._convertPositionTo("relative", { top: t, left: 0 }).top - inst.margins.top; |
||||||
|
} |
||||||
|
if(bs) { |
||||||
|
ui.position.top = inst._convertPositionTo("relative", { top: b - inst.helperProportions.height, left: 0 }).top - inst.margins.top; |
||||||
|
} |
||||||
|
if(ls) { |
||||||
|
ui.position.left = inst._convertPositionTo("relative", { top: 0, left: l }).left - inst.margins.left; |
||||||
|
} |
||||||
|
if(rs) { |
||||||
|
ui.position.left = inst._convertPositionTo("relative", { top: 0, left: r - inst.helperProportions.width }).left - inst.margins.left; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
if(!inst.snapElements[i].snapping && (ts || bs || ls || rs || first)) { |
||||||
|
(inst.options.snap.snap && inst.options.snap.snap.call(inst.element, event, $.extend(inst._uiHash(), { snapItem: inst.snapElements[i].item }))); |
||||||
|
} |
||||||
|
inst.snapElements[i].snapping = (ts || bs || ls || rs || first); |
||||||
|
|
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
|
}); |
||||||
|
|
||||||
|
$.ui.plugin.add("draggable", "stack", { |
||||||
|
start: function() { |
||||||
|
var min, |
||||||
|
o = this.data("ui-draggable").options, |
||||||
|
group = $.makeArray($(o.stack)).sort(function(a,b) { |
||||||
|
return (parseInt($(a).css("zIndex"),10) || 0) - (parseInt($(b).css("zIndex"),10) || 0); |
||||||
|
}); |
||||||
|
|
||||||
|
if (!group.length) { return; } |
||||||
|
|
||||||
|
min = parseInt($(group[0]).css("zIndex"), 10) || 0; |
||||||
|
$(group).each(function(i) { |
||||||
|
$(this).css("zIndex", min + i); |
||||||
|
}); |
||||||
|
this.css("zIndex", (min + group.length)); |
||||||
|
} |
||||||
|
}); |
||||||
|
|
||||||
|
$.ui.plugin.add("draggable", "zIndex", { |
||||||
|
start: function(event, ui) { |
||||||
|
var t = $(ui.helper), o = $(this).data("ui-draggable").options; |
||||||
|
if(t.css("zIndex")) { |
||||||
|
o._zIndex = t.css("zIndex"); |
||||||
|
} |
||||||
|
t.css("zIndex", o.zIndex); |
||||||
|
}, |
||||||
|
stop: function(event, ui) { |
||||||
|
var o = $(this).data("ui-draggable").options; |
||||||
|
if(o._zIndex) { |
||||||
|
$(ui.helper).css("zIndex", o._zIndex); |
||||||
|
} |
||||||
|
} |
||||||
|
}); |
||||||
|
|
||||||
|
})(jQuery); |
@ -0,0 +1,372 @@ |
|||||||
|
/*! |
||||||
|
* jQuery UI Droppable 1.10.2 |
||||||
|
* http://jqueryui.com
|
||||||
|
* |
||||||
|
* Copyright 2013 jQuery Foundation and other contributors |
||||||
|
* Released under the MIT license. |
||||||
|
* http://jquery.org/license
|
||||||
|
* |
||||||
|
* http://api.jqueryui.com/droppable/
|
||||||
|
* |
||||||
|
* Depends: |
||||||
|
* jquery.ui.core.js |
||||||
|
* jquery.ui.widget.js |
||||||
|
* jquery.ui.mouse.js |
||||||
|
* jquery.ui.draggable.js |
||||||
|
*/ |
||||||
|
(function( $, undefined ) { |
||||||
|
|
||||||
|
function isOverAxis( x, reference, size ) { |
||||||
|
return ( x > reference ) && ( x < ( reference + size ) ); |
||||||
|
} |
||||||
|
|
||||||
|
$.widget("ui.droppable", { |
||||||
|
version: "1.10.2", |
||||||
|
widgetEventPrefix: "drop", |
||||||
|
options: { |
||||||
|
accept: "*", |
||||||
|
activeClass: false, |
||||||
|
addClasses: true, |
||||||
|
greedy: false, |
||||||
|
hoverClass: false, |
||||||
|
scope: "default", |
||||||
|
tolerance: "intersect", |
||||||
|
|
||||||
|
// callbacks
|
||||||
|
activate: null, |
||||||
|
deactivate: null, |
||||||
|
drop: null, |
||||||
|
out: null, |
||||||
|
over: null |
||||||
|
}, |
||||||
|
_create: function() { |
||||||
|
|
||||||
|
var o = this.options, |
||||||
|
accept = o.accept; |
||||||
|
|
||||||
|
this.isover = false; |
||||||
|
this.isout = true; |
||||||
|
|
||||||
|
this.accept = $.isFunction(accept) ? accept : function(d) { |
||||||
|
return d.is(accept); |
||||||
|
}; |
||||||
|
|
||||||
|
//Store the droppable's proportions
|
||||||
|
this.proportions = { width: this.element[0].offsetWidth, height: this.element[0].offsetHeight }; |
||||||
|
|
||||||
|
// Add the reference and positions to the manager
|
||||||
|
$.ui.ddmanager.droppables[o.scope] = $.ui.ddmanager.droppables[o.scope] || []; |
||||||
|
$.ui.ddmanager.droppables[o.scope].push(this); |
||||||
|
|
||||||
|
(o.addClasses && this.element.addClass("ui-droppable")); |
||||||
|
|
||||||
|
}, |
||||||
|
|
||||||
|
_destroy: function() { |
||||||
|
var i = 0, |
||||||
|
drop = $.ui.ddmanager.droppables[this.options.scope]; |
||||||
|
|
||||||
|
for ( ; i < drop.length; i++ ) { |
||||||
|
if ( drop[i] === this ) { |
||||||
|
drop.splice(i, 1); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
this.element.removeClass("ui-droppable ui-droppable-disabled"); |
||||||
|
}, |
||||||
|
|
||||||
|
_setOption: function(key, value) { |
||||||
|
|
||||||
|
if(key === "accept") { |
||||||
|
this.accept = $.isFunction(value) ? value : function(d) { |
||||||
|
return d.is(value); |
||||||
|
}; |
||||||
|
} |
||||||
|
$.Widget.prototype._setOption.apply(this, arguments); |
||||||
|
}, |
||||||
|
|
||||||
|
_activate: function(event) { |
||||||
|
var draggable = $.ui.ddmanager.current; |
||||||
|
if(this.options.activeClass) { |
||||||
|
this.element.addClass(this.options.activeClass); |
||||||
|
} |
||||||
|
if(draggable){ |
||||||
|
this._trigger("activate", event, this.ui(draggable)); |
||||||
|
} |
||||||
|
}, |
||||||
|
|
||||||
|
_deactivate: function(event) { |
||||||
|
var draggable = $.ui.ddmanager.current; |
||||||
|
if(this.options.activeClass) { |
||||||
|
this.element.removeClass(this.options.activeClass); |
||||||
|
} |
||||||
|
if(draggable){ |
||||||
|
this._trigger("deactivate", event, this.ui(draggable)); |
||||||
|
} |
||||||
|
}, |
||||||
|
|
||||||
|
_over: function(event) { |
||||||
|
|
||||||
|
var draggable = $.ui.ddmanager.current; |
||||||
|
|
||||||
|
// Bail if draggable and droppable are same element
|
||||||
|
if (!draggable || (draggable.currentItem || draggable.element)[0] === this.element[0]) { |
||||||
|
return; |
||||||
|
} |
||||||
|
|
||||||
|
if (this.accept.call(this.element[0],(draggable.currentItem || draggable.element))) { |
||||||
|
if(this.options.hoverClass) { |
||||||
|
this.element.addClass(this.options.hoverClass); |
||||||
|
} |
||||||
|
this._trigger("over", event, this.ui(draggable)); |
||||||
|
} |
||||||
|
|
||||||
|
}, |
||||||
|
|
||||||
|
_out: function(event) { |
||||||
|
|
||||||
|
var draggable = $.ui.ddmanager.current; |
||||||
|
|
||||||
|
// Bail if draggable and droppable are same element
|
||||||
|
if (!draggable || (draggable.currentItem || draggable.element)[0] === this.element[0]) { |
||||||
|
return; |
||||||
|
} |
||||||
|
|
||||||
|
if (this.accept.call(this.element[0],(draggable.currentItem || draggable.element))) { |
||||||
|
if(this.options.hoverClass) { |
||||||
|
this.element.removeClass(this.options.hoverClass); |
||||||
|
} |
||||||
|
this._trigger("out", event, this.ui(draggable)); |
||||||
|
} |
||||||
|
|
||||||
|
}, |
||||||
|
|
||||||
|
_drop: function(event,custom) { |
||||||
|
|
||||||
|
var draggable = custom || $.ui.ddmanager.current, |
||||||
|
childrenIntersection = false; |
||||||
|
|
||||||
|
// Bail if draggable and droppable are same element
|
||||||
|
if (!draggable || (draggable.currentItem || draggable.element)[0] === this.element[0]) { |
||||||
|
return false; |
||||||
|
} |
||||||
|
|
||||||
|
this.element.find(":data(ui-droppable)").not(".ui-draggable-dragging").each(function() { |
||||||
|
var inst = $.data(this, "ui-droppable"); |
||||||
|
if( |
||||||
|
inst.options.greedy && |
||||||
|
!inst.options.disabled && |
||||||
|
inst.options.scope === draggable.options.scope && |
||||||
|
inst.accept.call(inst.element[0], (draggable.currentItem || draggable.element)) && |
||||||
|
$.ui.intersect(draggable, $.extend(inst, { offset: inst.element.offset() }), inst.options.tolerance) |
||||||
|
) { childrenIntersection = true; return false; } |
||||||
|
}); |
||||||
|
if(childrenIntersection) { |
||||||
|
return false; |
||||||
|
} |
||||||
|
|
||||||
|
if(this.accept.call(this.element[0],(draggable.currentItem || draggable.element))) { |
||||||
|
if(this.options.activeClass) { |
||||||
|
this.element.removeClass(this.options.activeClass); |
||||||
|
} |
||||||
|
if(this.options.hoverClass) { |
||||||
|
this.element.removeClass(this.options.hoverClass); |
||||||
|
} |
||||||
|
this._trigger("drop", event, this.ui(draggable)); |
||||||
|
return this.element; |
||||||
|
} |
||||||
|
|
||||||
|
return false; |
||||||
|
|
||||||
|
}, |
||||||
|
|
||||||
|
ui: function(c) { |
||||||
|
return { |
||||||
|
draggable: (c.currentItem || c.element), |
||||||
|
helper: c.helper, |
||||||
|
position: c.position, |
||||||
|
offset: c.positionAbs |
||||||
|
}; |
||||||
|
} |
||||||
|
|
||||||
|
}); |
||||||
|
|
||||||
|
$.ui.intersect = function(draggable, droppable, toleranceMode) { |
||||||
|
|
||||||
|
if (!droppable.offset) { |
||||||
|
return false; |
||||||
|
} |
||||||
|
|
||||||
|
var draggableLeft, draggableTop, |
||||||
|
x1 = (draggable.positionAbs || draggable.position.absolute).left, x2 = x1 + draggable.helperProportions.width, |
||||||
|
y1 = (draggable.positionAbs || draggable.position.absolute).top, y2 = y1 + draggable.helperProportions.height, |
||||||
|
l = droppable.offset.left, r = l + droppable.proportions.width, |
||||||
|
t = droppable.offset.top, b = t + droppable.proportions.height; |
||||||
|
|
||||||
|
switch (toleranceMode) { |
||||||
|
case "fit": |
||||||
|
return (l <= x1 && x2 <= r && t <= y1 && y2 <= b); |
||||||
|
case "intersect": |
||||||
|
return (l < x1 + (draggable.helperProportions.width / 2) && // Right Half
|
||||||
|
x2 - (draggable.helperProportions.width / 2) < r && // Left Half
|
||||||
|
t < y1 + (draggable.helperProportions.height / 2) && // Bottom Half
|
||||||
|
y2 - (draggable.helperProportions.height / 2) < b ); // Top Half
|
||||||
|
case "pointer": |
||||||
|
draggableLeft = ((draggable.positionAbs || draggable.position.absolute).left + (draggable.clickOffset || draggable.offset.click).left); |
||||||
|
draggableTop = ((draggable.positionAbs || draggable.position.absolute).top + (draggable.clickOffset || draggable.offset.click).top); |
||||||
|
return isOverAxis( draggableTop, t, droppable.proportions.height ) && isOverAxis( draggableLeft, l, droppable.proportions.width ); |
||||||
|
case "touch": |
||||||
|
return ( |
||||||
|
(y1 >= t && y1 <= b) || // Top edge touching
|
||||||
|
(y2 >= t && y2 <= b) || // Bottom edge touching
|
||||||
|
(y1 < t && y2 > b) // Surrounded vertically
|
||||||
|
) && ( |
||||||
|
(x1 >= l && x1 <= r) || // Left edge touching
|
||||||
|
(x2 >= l && x2 <= r) || // Right edge touching
|
||||||
|
(x1 < l && x2 > r) // Surrounded horizontally
|
||||||
|
); |
||||||
|
default: |
||||||
|
return false; |
||||||
|
} |
||||||
|
|
||||||
|
}; |
||||||
|
|
||||||
|
/* |
||||||
|
This manager tracks offsets of draggables and droppables |
||||||
|
*/ |
||||||
|
$.ui.ddmanager = { |
||||||
|
current: null, |
||||||
|
droppables: { "default": [] }, |
||||||
|
prepareOffsets: function(t, event) { |
||||||
|
|
||||||
|
var i, j, |
||||||
|
m = $.ui.ddmanager.droppables[t.options.scope] || [], |
||||||
|
type = event ? event.type : null, // workaround for #2317
|
||||||
|
list = (t.currentItem || t.element).find(":data(ui-droppable)").addBack(); |
||||||
|
|
||||||
|
droppablesLoop: for (i = 0; i < m.length; i++) { |
||||||
|
|
||||||
|
//No disabled and non-accepted
|
||||||
|
if(m[i].options.disabled || (t && !m[i].accept.call(m[i].element[0],(t.currentItem || t.element)))) { |
||||||
|
continue; |
||||||
|
} |
||||||
|
|
||||||
|
// Filter out elements in the current dragged item
|
||||||
|
for (j=0; j < list.length; j++) { |
||||||
|
if(list[j] === m[i].element[0]) { |
||||||
|
m[i].proportions.height = 0; |
||||||
|
continue droppablesLoop; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
m[i].visible = m[i].element.css("display") !== "none"; |
||||||
|
if(!m[i].visible) { |
||||||
|
continue; |
||||||
|
} |
||||||
|
|
||||||
|
//Activate the droppable if used directly from draggables
|
||||||
|
if(type === "mousedown") { |
||||||
|
m[i]._activate.call(m[i], event); |
||||||
|
} |
||||||
|
|
||||||
|
m[i].offset = m[i].element.offset(); |
||||||
|
m[i].proportions = { width: m[i].element[0].offsetWidth, height: m[i].element[0].offsetHeight }; |
||||||
|
|
||||||
|
} |
||||||
|
|
||||||
|
}, |
||||||
|
drop: function(draggable, event) { |
||||||
|
|
||||||
|
var dropped = false; |
||||||
|
// Create a copy of the droppables in case the list changes during the drop (#9116)
|
||||||
|
$.each(($.ui.ddmanager.droppables[draggable.options.scope] || []).slice(), function() { |
||||||
|
|
||||||
|
if(!this.options) { |
||||||
|
return; |
||||||
|
} |
||||||
|
if (!this.options.disabled && this.visible && $.ui.intersect(draggable, this, this.options.tolerance)) { |
||||||
|
dropped = this._drop.call(this, event) || dropped; |
||||||
|
} |
||||||
|
|
||||||
|
if (!this.options.disabled && this.visible && this.accept.call(this.element[0],(draggable.currentItem || draggable.element))) { |
||||||
|
this.isout = true; |
||||||
|
this.isover = false; |
||||||
|
this._deactivate.call(this, event); |
||||||
|
} |
||||||
|
|
||||||
|
}); |
||||||
|
return dropped; |
||||||
|
|
||||||
|
}, |
||||||
|
dragStart: function( draggable, event ) { |
||||||
|
//Listen for scrolling so that if the dragging causes scrolling the position of the droppables can be recalculated (see #5003)
|
||||||
|
draggable.element.parentsUntil( "body" ).bind( "scroll.droppable", function() { |
||||||
|
if( !draggable.options.refreshPositions ) { |
||||||
|
$.ui.ddmanager.prepareOffsets( draggable, event ); |
||||||
|
} |
||||||
|
}); |
||||||
|
}, |
||||||
|
drag: function(draggable, event) { |
||||||
|
|
||||||
|
//If you have a highly dynamic page, you might try this option. It renders positions every time you move the mouse.
|
||||||
|
if(draggable.options.refreshPositions) { |
||||||
|
$.ui.ddmanager.prepareOffsets(draggable, event); |
||||||
|
} |
||||||
|
|
||||||
|
//Run through all droppables and check their positions based on specific tolerance options
|
||||||
|
$.each($.ui.ddmanager.droppables[draggable.options.scope] || [], function() { |
||||||
|
|
||||||
|
if(this.options.disabled || this.greedyChild || !this.visible) { |
||||||
|
return; |
||||||
|
} |
||||||
|
|
||||||
|
var parentInstance, scope, parent, |
||||||
|
intersects = $.ui.intersect(draggable, this, this.options.tolerance), |
||||||
|
c = !intersects && this.isover ? "isout" : (intersects && !this.isover ? "isover" : null); |
||||||
|
if(!c) { |
||||||
|
return; |
||||||
|
} |
||||||
|
|
||||||
|
if (this.options.greedy) { |
||||||
|
// find droppable parents with same scope
|
||||||
|
scope = this.options.scope; |
||||||
|
parent = this.element.parents(":data(ui-droppable)").filter(function () { |
||||||
|
return $.data(this, "ui-droppable").options.scope === scope; |
||||||
|
}); |
||||||
|
|
||||||
|
if (parent.length) { |
||||||
|
parentInstance = $.data(parent[0], "ui-droppable"); |
||||||
|
parentInstance.greedyChild = (c === "isover"); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
// we just moved into a greedy child
|
||||||
|
if (parentInstance && c === "isover") { |
||||||
|
parentInstance.isover = false; |
||||||
|
parentInstance.isout = true; |
||||||
|
parentInstance._out.call(parentInstance, event); |
||||||
|
} |
||||||
|
|
||||||
|
this[c] = true; |
||||||
|
this[c === "isout" ? "isover" : "isout"] = false; |
||||||
|
this[c === "isover" ? "_over" : "_out"].call(this, event); |
||||||
|
|
||||||
|
// we just moved out of a greedy child
|
||||||
|
if (parentInstance && c === "isout") { |
||||||
|
parentInstance.isout = false; |
||||||
|
parentInstance.isover = true; |
||||||
|
parentInstance._over.call(parentInstance, event); |
||||||
|
} |
||||||
|
}); |
||||||
|
|
||||||
|
}, |
||||||
|
dragStop: function( draggable, event ) { |
||||||
|
draggable.element.parentsUntil( "body" ).unbind( "scroll.droppable" ); |
||||||
|
//Call prepareOffsets one final time since IE does not fire return scroll events when overflow was caused by drag (see #5003)
|
||||||
|
if( !draggable.options.refreshPositions ) { |
||||||
|
$.ui.ddmanager.prepareOffsets( draggable, event ); |
||||||
|
} |
||||||
|
} |
||||||
|
}; |
||||||
|
|
||||||
|
})(jQuery); |
@ -0,0 +1,169 @@ |
|||||||
|
/*! |
||||||
|
* jQuery UI Mouse 1.10.2 |
||||||
|
* http://jqueryui.com
|
||||||
|
* |
||||||
|
* Copyright 2013 jQuery Foundation and other contributors |
||||||
|
* Released under the MIT license. |
||||||
|
* http://jquery.org/license
|
||||||
|
* |
||||||
|
* http://api.jqueryui.com/mouse/
|
||||||
|
* |
||||||
|
* Depends: |
||||||
|
* jquery.ui.widget.js |
||||||
|
*/ |
||||||
|
(function( $, undefined ) { |
||||||
|
|
||||||
|
var mouseHandled = false; |
||||||
|
$( document ).mouseup( function() { |
||||||
|
mouseHandled = false; |
||||||
|
}); |
||||||
|
|
||||||
|
$.widget("ui.mouse", { |
||||||
|
version: "1.10.2", |
||||||
|
options: { |
||||||
|
cancel: "input,textarea,button,select,option", |
||||||
|
distance: 1, |
||||||
|
delay: 0 |
||||||
|
}, |
||||||
|
_mouseInit: function() { |
||||||
|
var that = this; |
||||||
|
|
||||||
|
this.element |
||||||
|
.bind("mousedown."+this.widgetName, function(event) { |
||||||
|
return that._mouseDown(event); |
||||||
|
}) |
||||||
|
.bind("click."+this.widgetName, function(event) { |
||||||
|
if (true === $.data(event.target, that.widgetName + ".preventClickEvent")) { |
||||||
|
$.removeData(event.target, that.widgetName + ".preventClickEvent"); |
||||||
|
event.stopImmediatePropagation(); |
||||||
|
return false; |
||||||
|
} |
||||||
|
}); |
||||||
|
|
||||||
|
this.started = false; |
||||||
|
}, |
||||||
|
|
||||||
|
// TODO: make sure destroying one instance of mouse doesn't mess with
|
||||||
|
// other instances of mouse
|
||||||
|
_mouseDestroy: function() { |
||||||
|
this.element.unbind("."+this.widgetName); |
||||||
|
if ( this._mouseMoveDelegate ) { |
||||||
|
$(document) |
||||||
|
.unbind("mousemove."+this.widgetName, this._mouseMoveDelegate) |
||||||
|
.unbind("mouseup."+this.widgetName, this._mouseUpDelegate); |
||||||
|
} |
||||||
|
}, |
||||||
|
|
||||||
|
_mouseDown: function(event) { |
||||||
|
// don't let more than one widget handle mouseStart
|
||||||
|
if( mouseHandled ) { return; } |
||||||
|
|
||||||
|
// we may have missed mouseup (out of window)
|
||||||
|
(this._mouseStarted && this._mouseUp(event)); |
||||||
|
|
||||||
|
this._mouseDownEvent = event; |
||||||
|
|
||||||
|
var that = this, |
||||||
|
btnIsLeft = (event.which === 1), |
||||||
|
// event.target.nodeName works around a bug in IE 8 with
|
||||||
|
// disabled inputs (#7620)
|
||||||
|
elIsCancel = (typeof this.options.cancel === "string" && event.target.nodeName ? $(event.target).closest(this.options.cancel).length : false); |
||||||
|
if (!btnIsLeft || elIsCancel || !this._mouseCapture(event)) { |
||||||
|
return true; |
||||||
|
} |
||||||
|
|
||||||
|
this.mouseDelayMet = !this.options.delay; |
||||||
|
if (!this.mouseDelayMet) { |
||||||
|
this._mouseDelayTimer = setTimeout(function() { |
||||||
|
that.mouseDelayMet = true; |
||||||
|
}, this.options.delay); |
||||||
|
} |
||||||
|
|
||||||
|
if (this._mouseDistanceMet(event) && this._mouseDelayMet(event)) { |
||||||
|
this._mouseStarted = (this._mouseStart(event) !== false); |
||||||
|
if (!this._mouseStarted) { |
||||||
|
event.preventDefault(); |
||||||
|
return true; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
// Click event may never have fired (Gecko & Opera)
|
||||||
|
if (true === $.data(event.target, this.widgetName + ".preventClickEvent")) { |
||||||
|
$.removeData(event.target, this.widgetName + ".preventClickEvent"); |
||||||
|
} |
||||||
|
|
||||||
|
// these delegates are required to keep context
|
||||||
|
this._mouseMoveDelegate = function(event) { |
||||||
|
return that._mouseMove(event); |
||||||
|
}; |
||||||
|
this._mouseUpDelegate = function(event) { |
||||||
|
return that._mouseUp(event); |
||||||
|
}; |
||||||
|
$(document) |
||||||
|
.bind("mousemove."+this.widgetName, this._mouseMoveDelegate) |
||||||
|
.bind("mouseup."+this.widgetName, this._mouseUpDelegate); |
||||||
|
|
||||||
|
event.preventDefault(); |
||||||
|
|
||||||
|
mouseHandled = true; |
||||||
|
return true; |
||||||
|
}, |
||||||
|
|
||||||
|
_mouseMove: function(event) { |
||||||
|
// IE mouseup check - mouseup happened when mouse was out of window
|
||||||
|
if ($.ui.ie && ( !document.documentMode || document.documentMode < 9 ) && !event.button) { |
||||||
|
return this._mouseUp(event); |
||||||
|
} |
||||||
|
|
||||||
|
if (this._mouseStarted) { |
||||||
|
this._mouseDrag(event); |
||||||
|
return event.preventDefault(); |
||||||
|
} |
||||||
|
|
||||||
|
if (this._mouseDistanceMet(event) && this._mouseDelayMet(event)) { |
||||||
|
this._mouseStarted = |
||||||
|
(this._mouseStart(this._mouseDownEvent, event) !== false); |
||||||
|
(this._mouseStarted ? this._mouseDrag(event) : this._mouseUp(event)); |
||||||
|
} |
||||||
|
|
||||||
|
return !this._mouseStarted; |
||||||
|
}, |
||||||
|
|
||||||
|
_mouseUp: function(event) { |
||||||
|
$(document) |
||||||
|
.unbind("mousemove."+this.widgetName, this._mouseMoveDelegate) |
||||||
|
.unbind("mouseup."+this.widgetName, this._mouseUpDelegate); |
||||||
|
|
||||||
|
if (this._mouseStarted) { |
||||||
|
this._mouseStarted = false; |
||||||
|
|
||||||
|
if (event.target === this._mouseDownEvent.target) { |
||||||
|
$.data(event.target, this.widgetName + ".preventClickEvent", true); |
||||||
|
} |
||||||
|
|
||||||
|
this._mouseStop(event); |
||||||
|
} |
||||||
|
|
||||||
|
return false; |
||||||
|
}, |
||||||
|
|
||||||
|
_mouseDistanceMet: function(event) { |
||||||
|
return (Math.max( |
||||||
|
Math.abs(this._mouseDownEvent.pageX - event.pageX), |
||||||
|
Math.abs(this._mouseDownEvent.pageY - event.pageY) |
||||||
|
) >= this.options.distance |
||||||
|
); |
||||||
|
}, |
||||||
|
|
||||||
|
_mouseDelayMet: function(/* event */) { |
||||||
|
return this.mouseDelayMet; |
||||||
|
}, |
||||||
|
|
||||||
|
// These are placeholder methods, to be overriden by extending plugin
|
||||||
|
_mouseStart: function(/* event */) {}, |
||||||
|
_mouseDrag: function(/* event */) {}, |
||||||
|
_mouseStop: function(/* event */) {}, |
||||||
|
_mouseCapture: function(/* event */) { return true; } |
||||||
|
}); |
||||||
|
|
||||||
|
})(jQuery); |
@ -0,0 +1,497 @@ |
|||||||
|
/*! |
||||||
|
* jQuery UI Position 1.10.2 |
||||||
|
* http://jqueryui.com
|
||||||
|
* |
||||||
|
* Copyright 2013 jQuery Foundation and other contributors |
||||||
|
* Released under the MIT license. |
||||||
|
* http://jquery.org/license
|
||||||
|
* |
||||||
|
* http://api.jqueryui.com/position/
|
||||||
|
*/ |
||||||
|
(function( $, undefined ) { |
||||||
|
|
||||||
|
$.ui = $.ui || {}; |
||||||
|
|
||||||
|
var cachedScrollbarWidth, |
||||||
|
max = Math.max, |
||||||
|
abs = Math.abs, |
||||||
|
round = Math.round, |
||||||
|
rhorizontal = /left|center|right/, |
||||||
|
rvertical = /top|center|bottom/, |
||||||
|
roffset = /[\+\-]\d+(\.[\d]+)?%?/, |
||||||
|
rposition = /^\w+/, |
||||||
|
rpercent = /%$/, |
||||||
|
_position = $.fn.position; |
||||||
|
|
||||||
|
function getOffsets( offsets, width, height ) { |
||||||
|
return [ |
||||||
|
parseFloat( offsets[ 0 ] ) * ( rpercent.test( offsets[ 0 ] ) ? width / 100 : 1 ), |
||||||
|
parseFloat( offsets[ 1 ] ) * ( rpercent.test( offsets[ 1 ] ) ? height / 100 : 1 ) |
||||||
|
]; |
||||||
|
} |
||||||
|
|
||||||
|
function parseCss( element, property ) { |
||||||
|
return parseInt( $.css( element, property ), 10 ) || 0; |
||||||
|
} |
||||||
|
|
||||||
|
function getDimensions( elem ) { |
||||||
|
var raw = elem[0]; |
||||||
|
if ( raw.nodeType === 9 ) { |
||||||
|
return { |
||||||
|
width: elem.width(), |
||||||
|
height: elem.height(), |
||||||
|
offset: { top: 0, left: 0 } |
||||||
|
}; |
||||||
|
} |
||||||
|
if ( $.isWindow( raw ) ) { |
||||||
|
return { |
||||||
|
width: elem.width(), |
||||||
|
height: elem.height(), |
||||||
|
offset: { top: elem.scrollTop(), left: elem.scrollLeft() } |
||||||
|
}; |
||||||
|
} |
||||||
|
if ( raw.preventDefault ) { |
||||||
|
return { |
||||||
|
width: 0, |
||||||
|
height: 0, |
||||||
|
offset: { top: raw.pageY, left: raw.pageX } |
||||||
|
}; |
||||||
|
} |
||||||
|
return { |
||||||
|
width: elem.outerWidth(), |
||||||
|
height: elem.outerHeight(), |
||||||
|
offset: elem.offset() |
||||||
|
}; |
||||||
|
} |
||||||
|
|
||||||
|
$.position = { |
||||||
|
scrollbarWidth: function() { |
||||||
|
if ( cachedScrollbarWidth !== undefined ) { |
||||||
|
return cachedScrollbarWidth; |
||||||
|
} |
||||||
|
var w1, w2, |
||||||
|
div = $( "<div style='display:block;width:50px;height:50px;overflow:hidden;'><div style='height:100px;width:auto;'></div></div>" ), |
||||||
|
innerDiv = div.children()[0]; |
||||||
|
|
||||||
|
$( "body" ).append( div ); |
||||||
|
w1 = innerDiv.offsetWidth; |
||||||
|
div.css( "overflow", "scroll" ); |
||||||
|
|
||||||
|
w2 = innerDiv.offsetWidth; |
||||||
|
|
||||||
|
if ( w1 === w2 ) { |
||||||
|
w2 = div[0].clientWidth; |
||||||
|
} |
||||||
|
|
||||||
|
div.remove(); |
||||||
|
|
||||||
|
return (cachedScrollbarWidth = w1 - w2); |
||||||
|
}, |
||||||
|
getScrollInfo: function( within ) { |
||||||
|
var overflowX = within.isWindow ? "" : within.element.css( "overflow-x" ), |
||||||
|
overflowY = within.isWindow ? "" : within.element.css( "overflow-y" ), |
||||||
|
hasOverflowX = overflowX === "scroll" || |
||||||
|
( overflowX === "auto" && within.width < within.element[0].scrollWidth ), |
||||||
|
hasOverflowY = overflowY === "scroll" || |
||||||
|
( overflowY === "auto" && within.height < within.element[0].scrollHeight ); |
||||||
|
return { |
||||||
|
width: hasOverflowY ? $.position.scrollbarWidth() : 0, |
||||||
|
height: hasOverflowX ? $.position.scrollbarWidth() : 0 |
||||||
|
}; |
||||||
|
}, |
||||||
|
getWithinInfo: function( element ) { |
||||||
|
var withinElement = $( element || window ), |
||||||
|
isWindow = $.isWindow( withinElement[0] ); |
||||||
|
return { |
||||||
|
element: withinElement, |
||||||
|
isWindow: isWindow, |
||||||
|
offset: withinElement.offset() || { left: 0, top: 0 }, |
||||||
|
scrollLeft: withinElement.scrollLeft(), |
||||||
|
scrollTop: withinElement.scrollTop(), |
||||||
|
width: isWindow ? withinElement.width() : withinElement.outerWidth(), |
||||||
|
height: isWindow ? withinElement.height() : withinElement.outerHeight() |
||||||
|
}; |
||||||
|
} |
||||||
|
}; |
||||||
|
|
||||||
|
$.fn.position = function( options ) { |
||||||
|
if ( !options || !options.of ) { |
||||||
|
return _position.apply( this, arguments ); |
||||||
|
} |
||||||
|
|
||||||
|
// make a copy, we don't want to modify arguments
|
||||||
|
options = $.extend( {}, options ); |
||||||
|
|
||||||
|
var atOffset, targetWidth, targetHeight, targetOffset, basePosition, dimensions, |
||||||
|
target = $( options.of ), |
||||||
|
within = $.position.getWithinInfo( options.within ), |
||||||
|
scrollInfo = $.position.getScrollInfo( within ), |
||||||
|
collision = ( options.collision || "flip" ).split( " " ), |
||||||
|
offsets = {}; |
||||||
|
|
||||||
|
dimensions = getDimensions( target ); |
||||||
|
if ( target[0].preventDefault ) { |
||||||
|
// force left top to allow flipping
|
||||||
|
options.at = "left top"; |
||||||
|
} |
||||||
|
targetWidth = dimensions.width; |
||||||
|
targetHeight = dimensions.height; |
||||||
|
targetOffset = dimensions.offset; |
||||||
|
// clone to reuse original targetOffset later
|
||||||
|
basePosition = $.extend( {}, targetOffset ); |
||||||
|
|
||||||
|
// force my and at to have valid horizontal and vertical positions
|
||||||
|
// if a value is missing or invalid, it will be converted to center
|
||||||
|
$.each( [ "my", "at" ], function() { |
||||||
|
var pos = ( options[ this ] || "" ).split( " " ), |
||||||
|
horizontalOffset, |
||||||
|
verticalOffset; |
||||||
|
|
||||||
|
if ( pos.length === 1) { |
||||||
|
pos = rhorizontal.test( pos[ 0 ] ) ? |
||||||
|
pos.concat( [ "center" ] ) : |
||||||
|
rvertical.test( pos[ 0 ] ) ? |
||||||
|
[ "center" ].concat( pos ) : |
||||||
|
[ "center", "center" ]; |
||||||
|
} |
||||||
|
pos[ 0 ] = rhorizontal.test( pos[ 0 ] ) ? pos[ 0 ] : "center"; |
||||||
|
pos[ 1 ] = rvertical.test( pos[ 1 ] ) ? pos[ 1 ] : "center"; |
||||||
|
|
||||||
|
// calculate offsets
|
||||||
|
horizontalOffset = roffset.exec( pos[ 0 ] ); |
||||||
|
verticalOffset = roffset.exec( pos[ 1 ] ); |
||||||
|
offsets[ this ] = [ |
||||||
|
horizontalOffset ? horizontalOffset[ 0 ] : 0, |
||||||
|
verticalOffset ? verticalOffset[ 0 ] : 0 |
||||||
|
]; |
||||||
|
|
||||||
|
// reduce to just the positions without the offsets
|
||||||
|
options[ this ] = [ |
||||||
|
rposition.exec( pos[ 0 ] )[ 0 ], |
||||||
|
rposition.exec( pos[ 1 ] )[ 0 ] |
||||||
|
]; |
||||||
|
}); |
||||||
|
|
||||||
|
// normalize collision option
|
||||||
|
if ( collision.length === 1 ) { |
||||||
|
collision[ 1 ] = collision[ 0 ]; |
||||||
|
} |
||||||
|
|
||||||
|
if ( options.at[ 0 ] === "right" ) { |
||||||
|
basePosition.left += targetWidth; |
||||||
|
} else if ( options.at[ 0 ] === "center" ) { |
||||||
|
basePosition.left += targetWidth / 2; |
||||||
|
} |
||||||
|
|
||||||
|
if ( options.at[ 1 ] === "bottom" ) { |
||||||
|
basePosition.top += targetHeight; |
||||||
|
} else if ( options.at[ 1 ] === "center" ) { |
||||||
|
basePosition.top += targetHeight / 2; |
||||||
|
} |
||||||
|
|
||||||
|
atOffset = getOffsets( offsets.at, targetWidth, targetHeight ); |
||||||
|
basePosition.left += atOffset[ 0 ]; |
||||||
|
basePosition.top += atOffset[ 1 ]; |
||||||
|
|
||||||
|
return this.each(function() { |
||||||
|
var collisionPosition, using, |
||||||
|
elem = $( this ), |
||||||
|
elemWidth = elem.outerWidth(), |
||||||
|
elemHeight = elem.outerHeight(), |
||||||
|
marginLeft = parseCss( this, "marginLeft" ), |
||||||
|
marginTop = parseCss( this, "marginTop" ), |
||||||
|
collisionWidth = elemWidth + marginLeft + parseCss( this, "marginRight" ) + scrollInfo.width, |
||||||
|
collisionHeight = elemHeight + marginTop + parseCss( this, "marginBottom" ) + scrollInfo.height, |
||||||
|
position = $.extend( {}, basePosition ), |
||||||
|
myOffset = getOffsets( offsets.my, elem.outerWidth(), elem.outerHeight() ); |
||||||
|
|
||||||
|
if ( options.my[ 0 ] === "right" ) { |
||||||
|
position.left -= elemWidth; |
||||||
|
} else if ( options.my[ 0 ] === "center" ) { |
||||||
|
position.left -= elemWidth / 2; |
||||||
|
} |
||||||
|
|
||||||
|
if ( options.my[ 1 ] === "bottom" ) { |
||||||
|
position.top -= elemHeight; |
||||||
|
} else if ( options.my[ 1 ] === "center" ) { |
||||||
|
position.top -= elemHeight / 2; |
||||||
|
} |
||||||
|
|
||||||
|
position.left += myOffset[ 0 ]; |
||||||
|
position.top += myOffset[ 1 ]; |
||||||
|
|
||||||
|
// if the browser doesn't support fractions, then round for consistent results
|
||||||
|
if ( !$.support.offsetFractions ) { |
||||||
|
position.left = round( position.left ); |
||||||
|
position.top = round( position.top ); |
||||||
|
} |
||||||
|
|
||||||
|
collisionPosition = { |
||||||
|
marginLeft: marginLeft, |
||||||
|
marginTop: marginTop |
||||||
|
}; |
||||||
|
|
||||||
|
$.each( [ "left", "top" ], function( i, dir ) { |
||||||
|
if ( $.ui.position[ collision[ i ] ] ) { |
||||||
|
$.ui.position[ collision[ i ] ][ dir ]( position, { |
||||||
|
targetWidth: targetWidth, |
||||||
|
targetHeight: targetHeight, |
||||||
|
elemWidth: elemWidth, |
||||||
|
elemHeight: elemHeight, |
||||||
|
collisionPosition: collisionPosition, |
||||||
|
collisionWidth: collisionWidth, |
||||||
|
collisionHeight: collisionHeight, |
||||||
|
offset: [ atOffset[ 0 ] + myOffset[ 0 ], atOffset [ 1 ] + myOffset[ 1 ] ], |
||||||
|
my: options.my, |
||||||
|
at: options.at, |
||||||
|
within: within, |
||||||
|
elem : elem |
||||||
|
}); |
||||||
|
} |
||||||
|
}); |
||||||
|
|
||||||
|
if ( options.using ) { |
||||||
|
// adds feedback as second argument to using callback, if present
|
||||||
|
using = function( props ) { |
||||||
|
var left = targetOffset.left - position.left, |
||||||
|
right = left + targetWidth - elemWidth, |
||||||
|
top = targetOffset.top - position.top, |
||||||
|
bottom = top + targetHeight - elemHeight, |
||||||
|
feedback = { |
||||||
|
target: { |
||||||
|
element: target, |
||||||
|
left: targetOffset.left, |
||||||
|
top: targetOffset.top, |
||||||
|
width: targetWidth, |
||||||
|
height: targetHeight |
||||||
|
}, |
||||||
|
element: { |
||||||
|
element: elem, |
||||||
|
left: position.left, |
||||||
|
top: position.top, |
||||||
|
width: elemWidth, |
||||||
|
height: elemHeight |
||||||
|
}, |
||||||
|
horizontal: right < 0 ? "left" : left > 0 ? "right" : "center", |
||||||
|
vertical: bottom < 0 ? "top" : top > 0 ? "bottom" : "middle" |
||||||
|
}; |
||||||
|
if ( targetWidth < elemWidth && abs( left + right ) < targetWidth ) { |
||||||
|
feedback.horizontal = "center"; |
||||||
|
} |
||||||
|
if ( targetHeight < elemHeight && abs( top + bottom ) < targetHeight ) { |
||||||
|
feedback.vertical = "middle"; |
||||||
|
} |
||||||
|
if ( max( abs( left ), abs( right ) ) > max( abs( top ), abs( bottom ) ) ) { |
||||||
|
feedback.important = "horizontal"; |
||||||
|
} else { |
||||||
|
feedback.important = "vertical"; |
||||||
|
} |
||||||
|
options.using.call( this, props, feedback ); |
||||||
|
}; |
||||||
|
} |
||||||
|
|
||||||
|
elem.offset( $.extend( position, { using: using } ) ); |
||||||
|
}); |
||||||
|
}; |
||||||
|
|
||||||
|
$.ui.position = { |
||||||
|
fit: { |
||||||
|
left: function( position, data ) { |
||||||
|
var within = data.within, |
||||||
|
withinOffset = within.isWindow ? within.scrollLeft : within.offset.left, |
||||||
|
outerWidth = within.width, |
||||||
|
collisionPosLeft = position.left - data.collisionPosition.marginLeft, |
||||||
|
overLeft = withinOffset - collisionPosLeft, |
||||||
|
overRight = collisionPosLeft + data.collisionWidth - outerWidth - withinOffset, |
||||||
|
newOverRight; |
||||||
|
|
||||||
|
// element is wider than within
|
||||||
|
if ( data.collisionWidth > outerWidth ) { |
||||||
|
// element is initially over the left side of within
|
||||||
|
if ( overLeft > 0 && overRight <= 0 ) { |
||||||
|
newOverRight = position.left + overLeft + data.collisionWidth - outerWidth - withinOffset; |
||||||
|
position.left += overLeft - newOverRight; |
||||||
|
// element is initially over right side of within
|
||||||
|
} else if ( overRight > 0 && overLeft <= 0 ) { |
||||||
|
position.left = withinOffset; |
||||||
|
// element is initially over both left and right sides of within
|
||||||
|
} else { |
||||||
|
if ( overLeft > overRight ) { |
||||||
|
position.left = withinOffset + outerWidth - data.collisionWidth; |
||||||
|
} else { |
||||||
|
position.left = withinOffset; |
||||||
|
} |
||||||
|
} |
||||||
|
// too far left -> align with left edge
|
||||||
|
} else if ( overLeft > 0 ) { |
||||||
|
position.left += overLeft; |
||||||
|
// too far right -> align with right edge
|
||||||
|
} else if ( overRight > 0 ) { |
||||||
|
position.left -= overRight; |
||||||
|
// adjust based on position and margin
|
||||||
|
} else { |
||||||
|
position.left = max( position.left - collisionPosLeft, position.left ); |
||||||
|
} |
||||||
|
}, |
||||||
|
top: function( position, data ) { |
||||||
|
var within = data.within, |
||||||
|
withinOffset = within.isWindow ? within.scrollTop : within.offset.top, |
||||||
|
outerHeight = data.within.height, |
||||||
|
collisionPosTop = position.top - data.collisionPosition.marginTop, |
||||||
|
overTop = withinOffset - collisionPosTop, |
||||||
|
overBottom = collisionPosTop + data.collisionHeight - outerHeight - withinOffset, |
||||||
|
newOverBottom; |
||||||
|
|
||||||
|
// element is taller than within
|
||||||
|
if ( data.collisionHeight > outerHeight ) { |
||||||
|
// element is initially over the top of within
|
||||||
|
if ( overTop > 0 && overBottom <= 0 ) { |
||||||
|
newOverBottom = position.top + overTop + data.collisionHeight - outerHeight - withinOffset; |
||||||
|
position.top += overTop - newOverBottom; |
||||||
|
// element is initially over bottom of within
|
||||||
|
} else if ( overBottom > 0 && overTop <= 0 ) { |
||||||
|
position.top = withinOffset; |
||||||
|
// element is initially over both top and bottom of within
|
||||||
|
} else { |
||||||
|
if ( overTop > overBottom ) { |
||||||
|
position.top = withinOffset + outerHeight - data.collisionHeight; |
||||||
|
} else { |
||||||
|
position.top = withinOffset; |
||||||
|
} |
||||||
|
} |
||||||
|
// too far up -> align with top
|
||||||
|
} else if ( overTop > 0 ) { |
||||||
|
position.top += overTop; |
||||||
|
// too far down -> align with bottom edge
|
||||||
|
} else if ( overBottom > 0 ) { |
||||||
|
position.top -= overBottom; |
||||||
|
// adjust based on position and margin
|
||||||
|
} else { |
||||||
|
position.top = max( position.top - collisionPosTop, position.top ); |
||||||
|
} |
||||||
|
} |
||||||
|
}, |
||||||
|
flip: { |
||||||
|
left: function( position, data ) { |
||||||
|
var within = data.within, |
||||||
|
withinOffset = within.offset.left + within.scrollLeft, |
||||||
|
outerWidth = within.width, |
||||||
|
offsetLeft = within.isWindow ? within.scrollLeft : within.offset.left, |
||||||
|
collisionPosLeft = position.left - data.collisionPosition.marginLeft, |
||||||
|
overLeft = collisionPosLeft - offsetLeft, |
||||||
|
overRight = collisionPosLeft + data.collisionWidth - outerWidth - offsetLeft, |
||||||
|
myOffset = data.my[ 0 ] === "left" ? |
||||||
|
-data.elemWidth : |
||||||
|
data.my[ 0 ] === "right" ? |
||||||
|
data.elemWidth : |
||||||
|
0, |
||||||
|
atOffset = data.at[ 0 ] === "left" ? |
||||||
|
data.targetWidth : |
||||||
|
data.at[ 0 ] === "right" ? |
||||||
|
-data.targetWidth : |
||||||
|
0, |
||||||
|
offset = -2 * data.offset[ 0 ], |
||||||
|
newOverRight, |
||||||
|
newOverLeft; |
||||||
|
|
||||||
|
if ( overLeft < 0 ) { |
||||||
|
newOverRight = position.left + myOffset + atOffset + offset + data.collisionWidth - outerWidth - withinOffset; |
||||||
|
if ( newOverRight < 0 || newOverRight < abs( overLeft ) ) { |
||||||
|
position.left += myOffset + atOffset + offset; |
||||||
|
} |
||||||
|
} |
||||||
|
else if ( overRight > 0 ) { |
||||||
|
newOverLeft = position.left - data.collisionPosition.marginLeft + myOffset + atOffset + offset - offsetLeft; |
||||||
|
if ( newOverLeft > 0 || abs( newOverLeft ) < overRight ) { |
||||||
|
position.left += myOffset + atOffset + offset; |
||||||
|
} |
||||||
|
} |
||||||
|
}, |
||||||
|
top: function( position, data ) { |
||||||
|
var within = data.within, |
||||||
|
withinOffset = within.offset.top + within.scrollTop, |
||||||
|
outerHeight = within.height, |
||||||
|
offsetTop = within.isWindow ? within.scrollTop : within.offset.top, |
||||||
|
collisionPosTop = position.top - data.collisionPosition.marginTop, |
||||||
|
overTop = collisionPosTop - offsetTop, |
||||||
|
overBottom = collisionPosTop + data.collisionHeight - outerHeight - offsetTop, |
||||||
|
top = data.my[ 1 ] === "top", |
||||||
|
myOffset = top ? |
||||||
|
-data.elemHeight : |
||||||
|
data.my[ 1 ] === "bottom" ? |
||||||
|
data.elemHeight : |
||||||
|
0, |
||||||
|
atOffset = data.at[ 1 ] === "top" ? |
||||||
|
data.targetHeight : |
||||||
|
data.at[ 1 ] === "bottom" ? |
||||||
|
-data.targetHeight : |
||||||
|
0, |
||||||
|
offset = -2 * data.offset[ 1 ], |
||||||
|
newOverTop, |
||||||
|
newOverBottom; |
||||||
|
if ( overTop < 0 ) { |
||||||
|
newOverBottom = position.top + myOffset + atOffset + offset + data.collisionHeight - outerHeight - withinOffset; |
||||||
|
if ( ( position.top + myOffset + atOffset + offset) > overTop && ( newOverBottom < 0 || newOverBottom < abs( overTop ) ) ) { |
||||||
|
position.top += myOffset + atOffset + offset; |
||||||
|
} |
||||||
|
} |
||||||
|
else if ( overBottom > 0 ) { |
||||||
|
newOverTop = position.top - data.collisionPosition.marginTop + myOffset + atOffset + offset - offsetTop; |
||||||
|
if ( ( position.top + myOffset + atOffset + offset) > overBottom && ( newOverTop > 0 || abs( newOverTop ) < overBottom ) ) { |
||||||
|
position.top += myOffset + atOffset + offset; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
}, |
||||||
|
flipfit: { |
||||||
|
left: function() { |
||||||
|
$.ui.position.flip.left.apply( this, arguments ); |
||||||
|
$.ui.position.fit.left.apply( this, arguments ); |
||||||
|
}, |
||||||
|
top: function() { |
||||||
|
$.ui.position.flip.top.apply( this, arguments ); |
||||||
|
$.ui.position.fit.top.apply( this, arguments ); |
||||||
|
} |
||||||
|
} |
||||||
|
}; |
||||||
|
|
||||||
|
// fraction support test
|
||||||
|
(function () { |
||||||
|
var testElement, testElementParent, testElementStyle, offsetLeft, i, |
||||||
|
body = document.getElementsByTagName( "body" )[ 0 ], |
||||||
|
div = document.createElement( "div" ); |
||||||
|
|
||||||
|
//Create a "fake body" for testing based on method used in jQuery.support
|
||||||
|
testElement = document.createElement( body ? "div" : "body" ); |
||||||
|
testElementStyle = { |
||||||
|
visibility: "hidden", |
||||||
|
width: 0, |
||||||
|
height: 0, |
||||||
|
border: 0, |
||||||
|
margin: 0, |
||||||
|
background: "none" |
||||||
|
}; |
||||||
|
if ( body ) { |
||||||
|
$.extend( testElementStyle, { |
||||||
|
position: "absolute", |
||||||
|
left: "-1000px", |
||||||
|
top: "-1000px" |
||||||
|
}); |
||||||
|
} |
||||||
|
for ( i in testElementStyle ) { |
||||||
|
testElement.style[ i ] = testElementStyle[ i ]; |
||||||
|
} |
||||||
|
testElement.appendChild( div ); |
||||||
|
testElementParent = body || document.documentElement; |
||||||
|
testElementParent.insertBefore( testElement, testElementParent.firstChild ); |
||||||
|
|
||||||
|
div.style.cssText = "position: absolute; left: 10.7432222px;"; |
||||||
|
|
||||||
|
offsetLeft = $( div ).offset().left; |
||||||
|
$.support.offsetFractions = offsetLeft > 10 && offsetLeft < 11; |
||||||
|
|
||||||
|
testElement.innerHTML = ""; |
||||||
|
testElementParent.removeChild( testElement ); |
||||||
|
})(); |
||||||
|
|
||||||
|
}( jQuery ) ); |
@ -0,0 +1,799 @@ |
|||||||
|
/* |
||||||
|
* jQuery UI Resizable 1.8.1 |
||||||
|
* |
||||||
|
* Copyright (c) 2010 AUTHORS.txt (http://jqueryui.com/about)
|
||||||
|
* Dual licensed under the MIT (MIT-LICENSE.txt) |
||||||
|
* and GPL (GPL-LICENSE.txt) licenses. |
||||||
|
* |
||||||
|
* http://docs.jquery.com/UI/Resizables
|
||||||
|
* |
||||||
|
* Depends: |
||||||
|
* jquery.ui.core.js |
||||||
|
* jquery.ui.mouse.js |
||||||
|
* jquery.ui.widget.js |
||||||
|
*/ |
||||||
|
(function($) { |
||||||
|
|
||||||
|
$.widget("ui.resizable", $.ui.mouse, { |
||||||
|
widgetEventPrefix: "resize", |
||||||
|
options: { |
||||||
|
alsoResize: false, |
||||||
|
animate: false, |
||||||
|
animateDuration: "slow", |
||||||
|
animateEasing: "swing", |
||||||
|
aspectRatio: false, |
||||||
|
autoHide: false, |
||||||
|
containment: false, |
||||||
|
ghost: false, |
||||||
|
grid: false, |
||||||
|
handles: "e,s,se", |
||||||
|
helper: false, |
||||||
|
maxHeight: null, |
||||||
|
maxWidth: null, |
||||||
|
minHeight: 10, |
||||||
|
minWidth: 10, |
||||||
|
zIndex: 1000 |
||||||
|
}, |
||||||
|
_create: function() { |
||||||
|
|
||||||
|
var self = this, o = this.options; |
||||||
|
this.element.addClass("ui-resizable"); |
||||||
|
|
||||||
|
$.extend(this, { |
||||||
|
_aspectRatio: !!(o.aspectRatio), |
||||||
|
aspectRatio: o.aspectRatio, |
||||||
|
originalElement: this.element, |
||||||
|
_proportionallyResizeElements: [], |
||||||
|
_helper: o.helper || o.ghost || o.animate ? o.helper || 'ui-resizable-helper' : null |
||||||
|
}); |
||||||
|
|
||||||
|
//Wrap the element if it cannot hold child nodes
|
||||||
|
if(this.element[0].nodeName.match(/canvas|textarea|input|select|button|img/i)) { |
||||||
|
|
||||||
|
//Opera fix for relative positioning
|
||||||
|
if (/relative/.test(this.element.css('position')) && $.browser.opera) |
||||||
|
this.element.css({ position: 'relative', top: 'auto', left: 'auto' }); |
||||||
|
|
||||||
|
//Create a wrapper element and set the wrapper to the new current internal element
|
||||||
|
this.element.wrap( |
||||||
|
$('<div class="ui-wrapper" style="overflow: hidden;"></div>').css({ |
||||||
|
position: this.element.css('position'), |
||||||
|
width: this.element.outerWidth(), |
||||||
|
height: this.element.outerHeight(), |
||||||
|
top: this.element.css('top'), |
||||||
|
left: this.element.css('left') |
||||||
|
}) |
||||||
|
); |
||||||
|
|
||||||
|
//Overwrite the original this.element
|
||||||
|
this.element = this.element.parent().data( |
||||||
|
"resizable", this.element.data('resizable') |
||||||
|
); |
||||||
|
|
||||||
|
this.elementIsWrapper = true; |
||||||
|
|
||||||
|
//Move margins to the wrapper
|
||||||
|
this.element.css({ marginLeft: this.originalElement.css("marginLeft"), marginTop: this.originalElement.css("marginTop"), marginRight: this.originalElement.css("marginRight"), marginBottom: this.originalElement.css("marginBottom") }); |
||||||
|
this.originalElement.css({ marginLeft: 0, marginTop: 0, marginRight: 0, marginBottom: 0}); |
||||||
|
|
||||||
|
//Prevent Safari textarea resize
|
||||||
|
this.originalResizeStyle = this.originalElement.css('resize'); |
||||||
|
this.originalElement.css('resize', 'none'); |
||||||
|
|
||||||
|
//Push the actual element to our proportionallyResize internal array
|
||||||
|
this._proportionallyResizeElements.push(this.originalElement.css({ position: 'static', zoom: 1, display: 'block' })); |
||||||
|
|
||||||
|
// avoid IE jump (hard set the margin)
|
||||||
|
this.originalElement.css({ margin: this.originalElement.css('margin') }); |
||||||
|
|
||||||
|
// fix handlers offset
|
||||||
|
this._proportionallyResize(); |
||||||
|
|
||||||
|
} |
||||||
|
|
||||||
|
this.handles = o.handles || (!$('.ui-resizable-handle', this.element).length ? "e,s,se" : { n: '.ui-resizable-n', e: '.ui-resizable-e', s: '.ui-resizable-s', w: '.ui-resizable-w', se: '.ui-resizable-se', sw: '.ui-resizable-sw', ne: '.ui-resizable-ne', nw: '.ui-resizable-nw' }); |
||||||
|
if(this.handles.constructor == String) { |
||||||
|
|
||||||
|
if(this.handles == 'all') this.handles = 'n,e,s,w,se,sw,ne,nw'; |
||||||
|
var n = this.handles.split(","); this.handles = {}; |
||||||
|
|
||||||
|
for(var i = 0; i < n.length; i++) { |
||||||
|
|
||||||
|
var handle = $.trim(n[i]), hname = 'ui-resizable-'+handle; |
||||||
|
var axis = $('<div class="ui-resizable-handle ' + hname + '"></div>'); |
||||||
|
// increase zIndex of sw, se, ne, nw axis
|
||||||
|
//TODO : this modifies original option
|
||||||
|
if(/sw|se|ne|nw/.test(handle)) axis.css({ zIndex: ++o.zIndex }); |
||||||
|
|
||||||
|
//TODO : What's going on here?
|
||||||
|
if ('se' == handle) { |
||||||
|
axis.addClass('ui-icon ui-icon-gripsmall-diagonal-se'); |
||||||
|
}; |
||||||
|
|
||||||
|
//Insert into internal handles object and append to element
|
||||||
|
this.handles[handle] = '.ui-resizable-'+handle; |
||||||
|
this.element.append(axis); |
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
|
|
||||||
|
this._renderAxis = function(target) { |
||||||
|
|
||||||
|
target = target || this.element; |
||||||
|
|
||||||
|
for(var i in this.handles) { |
||||||
|
|
||||||
|
if(this.handles[i].constructor == String) |
||||||
|
this.handles[i] = $(this.handles[i], this.element).show(); |
||||||
|
|
||||||
|
//Apply pad to wrapper element, needed to fix axis position (textarea, inputs, scrolls)
|
||||||
|
if (this.elementIsWrapper && this.originalElement[0].nodeName.match(/textarea|input|select|button/i)) { |
||||||
|
|
||||||
|
var axis = $(this.handles[i], this.element), padWrapper = 0; |
||||||
|
|
||||||
|
//Checking the correct pad and border
|
||||||
|
padWrapper = /sw|ne|nw|se|n|s/.test(i) ? axis.outerHeight() : axis.outerWidth(); |
||||||
|
|
||||||
|
//The padding type i have to apply...
|
||||||
|
var padPos = [ 'padding', |
||||||
|
/ne|nw|n/.test(i) ? 'Top' : |
||||||
|
/se|sw|s/.test(i) ? 'Bottom' : |
||||||
|
/^e$/.test(i) ? 'Right' : 'Left' ].join(""); |
||||||
|
|
||||||
|
target.css(padPos, padWrapper); |
||||||
|
|
||||||
|
this._proportionallyResize(); |
||||||
|
|
||||||
|
} |
||||||
|
|
||||||
|
//TODO: What's that good for? There's not anything to be executed left
|
||||||
|
if(!$(this.handles[i]).length) |
||||||
|
continue; |
||||||
|
|
||||||
|
} |
||||||
|
}; |
||||||
|
|
||||||
|
//TODO: make renderAxis a prototype function
|
||||||
|
this._renderAxis(this.element); |
||||||
|
|
||||||
|
this._handles = $('.ui-resizable-handle', this.element) |
||||||
|
.disableSelection(); |
||||||
|
|
||||||
|
//Matching axis name
|
||||||
|
this._handles.mouseover(function() { |
||||||
|
if (!self.resizing) { |
||||||
|
if (this.className) |
||||||
|
var axis = this.className.match(/ui-resizable-(se|sw|ne|nw|n|e|s|w)/i); |
||||||
|
//Axis, default = se
|
||||||
|
self.axis = axis && axis[1] ? axis[1] : 'se'; |
||||||
|
} |
||||||
|
}); |
||||||
|
|
||||||
|
//If we want to auto hide the elements
|
||||||
|
if (o.autoHide) { |
||||||
|
this._handles.hide(); |
||||||
|
$(this.element) |
||||||
|
.addClass("ui-resizable-autohide") |
||||||
|
.hover(function() { |
||||||
|
$(this).removeClass("ui-resizable-autohide"); |
||||||
|
self._handles.show(); |
||||||
|
}, |
||||||
|
function(){ |
||||||
|
if (!self.resizing) { |
||||||
|
$(this).addClass("ui-resizable-autohide"); |
||||||
|
self._handles.hide(); |
||||||
|
} |
||||||
|
}); |
||||||
|
} |
||||||
|
|
||||||
|
//Initialize the mouse interaction
|
||||||
|
this._mouseInit(); |
||||||
|
|
||||||
|
}, |
||||||
|
|
||||||
|
destroy: function() { |
||||||
|
|
||||||
|
this._mouseDestroy(); |
||||||
|
|
||||||
|
var _destroy = function(exp) { |
||||||
|
$(exp).removeClass("ui-resizable ui-resizable-disabled ui-resizable-resizing") |
||||||
|
.removeData("resizable").unbind(".resizable").find('.ui-resizable-handle').remove(); |
||||||
|
}; |
||||||
|
|
||||||
|
//TODO: Unwrap at same DOM position
|
||||||
|
if (this.elementIsWrapper) { |
||||||
|
_destroy(this.element); |
||||||
|
var wrapper = this.element; |
||||||
|
wrapper.after( |
||||||
|
this.originalElement.css({ |
||||||
|
position: wrapper.css('position'), |
||||||
|
width: wrapper.outerWidth(), |
||||||
|
height: wrapper.outerHeight(), |
||||||
|
top: wrapper.css('top'), |
||||||
|
left: wrapper.css('left') |
||||||
|
}) |
||||||
|
).remove(); |
||||||
|
} |
||||||
|
|
||||||
|
this.originalElement.css('resize', this.originalResizeStyle); |
||||||
|
_destroy(this.originalElement); |
||||||
|
|
||||||
|
return this; |
||||||
|
}, |
||||||
|
|
||||||
|
_mouseCapture: function(event) { |
||||||
|
var handle = false; |
||||||
|
for (var i in this.handles) { |
||||||
|
if ($(this.handles[i])[0] == event.target) { |
||||||
|
handle = true; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
return !this.options.disabled && handle; |
||||||
|
}, |
||||||
|
|
||||||
|
_mouseStart: function(event) { |
||||||
|
|
||||||
|
var o = this.options, iniPos = this.element.position(), el = this.element; |
||||||
|
|
||||||
|
this.resizing = true; |
||||||
|
this.documentScroll = { top: $(document).scrollTop(), left: $(document).scrollLeft() }; |
||||||
|
|
||||||
|
// bugfix for http://dev.jquery.com/ticket/1749
|
||||||
|
// daniel:absolute情况下页面滚动条跳回最上方... so注释
|
||||||
|
// if (el.is('.ui-draggable') || (/absolute/).test(el.css('position'))) {
|
||||||
|
// el.css({ position: 'absolute', top: iniPos.top, left: iniPos.left });
|
||||||
|
// }
|
||||||
|
|
||||||
|
//Opera fixing relative position 新的resizable没有这条 opera应该不需要了
|
||||||
|
// if ($.browser.opera && (/relative/).test(el.css('position')))
|
||||||
|
// el.css({ position: 'relative', top: 'auto', left: 'auto' });
|
||||||
|
|
||||||
|
this._renderProxy(); |
||||||
|
|
||||||
|
var curleft = num(this.helper.css('left')), curtop = num(this.helper.css('top')); |
||||||
|
|
||||||
|
if (o.containment) { |
||||||
|
curleft += $(o.containment).scrollLeft() || 0; |
||||||
|
curtop += $(o.containment).scrollTop() || 0; |
||||||
|
} |
||||||
|
|
||||||
|
//Store needed variables
|
||||||
|
this.offset = this.helper.offset(); |
||||||
|
this.position = { left: curleft, top: curtop }; |
||||||
|
this.size = this._helper ? { width: el.outerWidth(), height: el.outerHeight() } : { width: el.width(), height: el.height() }; |
||||||
|
this.originalSize = this._helper ? { width: el.outerWidth(), height: el.outerHeight() } : { width: el.width(), height: el.height() }; |
||||||
|
this.originalPosition = { left: curleft, top: curtop }; |
||||||
|
this.sizeDiff = { width: el.outerWidth() - el.width(), height: el.outerHeight() - el.height() }; |
||||||
|
this.originalMousePosition = { left: event.pageX, top: event.pageY }; |
||||||
|
|
||||||
|
//Aspect Ratio
|
||||||
|
this.aspectRatio = (typeof o.aspectRatio == 'number') ? o.aspectRatio : ((this.originalSize.width / this.originalSize.height) || 1); |
||||||
|
|
||||||
|
var cursor = $('.ui-resizable-' + this.axis).css('cursor'); |
||||||
|
$('body').css('cursor', cursor == 'auto' ? this.axis + '-resize' : cursor); |
||||||
|
|
||||||
|
el.addClass("ui-resizable-resizing"); |
||||||
|
this._propagate("start", event); |
||||||
|
return true; |
||||||
|
}, |
||||||
|
|
||||||
|
_mouseDrag: function(event) { |
||||||
|
|
||||||
|
//Increase performance, avoid regex
|
||||||
|
var el = this.helper, o = this.options, props = {}, |
||||||
|
self = this, smp = this.originalMousePosition, a = this.axis; |
||||||
|
|
||||||
|
var dx = (event.pageX-smp.left)||0, dy = (event.pageY-smp.top)||0; |
||||||
|
var trigger = this._change[a]; |
||||||
|
if (!trigger) return false; |
||||||
|
|
||||||
|
// Calculate the attrs that will be change
|
||||||
|
var data = trigger.apply(this, [event, dx, dy]), ie6 = $.browser.msie && $.browser.version < 7, csdif = this.sizeDiff; |
||||||
|
|
||||||
|
if (this._aspectRatio || event.shiftKey) |
||||||
|
data = this._updateRatio(data, event); |
||||||
|
|
||||||
|
data = this._respectSize(data, event); |
||||||
|
|
||||||
|
// plugins callbacks need to be called first
|
||||||
|
this._propagate("resize", event); |
||||||
|
|
||||||
|
el.css({ |
||||||
|
top: this.position.top + "px", left: this.position.left + "px", |
||||||
|
width: this.size.width + "px", height: this.size.height + "px" |
||||||
|
}); |
||||||
|
|
||||||
|
if (!this._helper && this._proportionallyResizeElements.length) |
||||||
|
this._proportionallyResize(); |
||||||
|
|
||||||
|
this._updateCache(data); |
||||||
|
|
||||||
|
// calling the user callback at the end
|
||||||
|
this._trigger('resize', event, this.ui()); |
||||||
|
|
||||||
|
return false; |
||||||
|
}, |
||||||
|
|
||||||
|
_mouseStop: function(event) { |
||||||
|
|
||||||
|
this.resizing = false; |
||||||
|
var o = this.options, self = this; |
||||||
|
|
||||||
|
if(this._helper) { |
||||||
|
var pr = this._proportionallyResizeElements, ista = pr.length && (/textarea/i).test(pr[0].nodeName), |
||||||
|
soffseth = ista && $.ui.hasScroll(pr[0], 'left') /* TODO - jump height */ ? 0 : self.sizeDiff.height, |
||||||
|
soffsetw = ista ? 0 : self.sizeDiff.width; |
||||||
|
|
||||||
|
var s = { width: (self.size.width - soffsetw), height: (self.size.height - soffseth) }, |
||||||
|
left = (parseInt(self.element.css('left'), 10) + (self.position.left - self.originalPosition.left)) || null, |
||||||
|
top = (parseInt(self.element.css('top'), 10) + (self.position.top - self.originalPosition.top)) || null; |
||||||
|
|
||||||
|
if (!o.animate) |
||||||
|
this.element.css($.extend(s, { top: top, left: left })); |
||||||
|
|
||||||
|
self.helper.height(self.size.height); |
||||||
|
self.helper.width(self.size.width); |
||||||
|
|
||||||
|
if (this._helper && !o.animate) this._proportionallyResize(); |
||||||
|
} |
||||||
|
|
||||||
|
$('body').css('cursor', 'auto'); |
||||||
|
|
||||||
|
this.element.removeClass("ui-resizable-resizing"); |
||||||
|
|
||||||
|
this._propagate("stop", event); |
||||||
|
|
||||||
|
if (this._helper) this.helper.remove(); |
||||||
|
return false; |
||||||
|
|
||||||
|
}, |
||||||
|
|
||||||
|
_updateCache: function(data) { |
||||||
|
var o = this.options; |
||||||
|
this.offset = this.helper.offset(); |
||||||
|
if (isNumber(data.left)) this.position.left = data.left; |
||||||
|
if (isNumber(data.top)) this.position.top = data.top; |
||||||
|
if (isNumber(data.height)) this.size.height = data.height; |
||||||
|
if (isNumber(data.width)) this.size.width = data.width; |
||||||
|
}, |
||||||
|
|
||||||
|
_updateRatio: function(data, event) { |
||||||
|
|
||||||
|
var o = this.options, cpos = this.position, csize = this.size, a = this.axis; |
||||||
|
|
||||||
|
if (data.height) data.width = (csize.height * this.aspectRatio); |
||||||
|
else if (data.width) data.height = (csize.width / this.aspectRatio); |
||||||
|
|
||||||
|
if (a == 'sw') { |
||||||
|
data.left = cpos.left + (csize.width - data.width); |
||||||
|
data.top = null; |
||||||
|
} |
||||||
|
if (a == 'nw') { |
||||||
|
data.top = cpos.top + (csize.height - data.height); |
||||||
|
data.left = cpos.left + (csize.width - data.width); |
||||||
|
} |
||||||
|
|
||||||
|
return data; |
||||||
|
}, |
||||||
|
|
||||||
|
_respectSize: function(data, event) { |
||||||
|
|
||||||
|
var el = this.helper, o = this.options, pRatio = this._aspectRatio || event.shiftKey, a = this.axis, |
||||||
|
ismaxw = isNumber(data.width) && o.maxWidth && (o.maxWidth < data.width), ismaxh = isNumber(data.height) && o.maxHeight && (o.maxHeight < data.height), |
||||||
|
isminw = isNumber(data.width) && o.minWidth && (o.minWidth > data.width), isminh = isNumber(data.height) && o.minHeight && (o.minHeight > data.height); |
||||||
|
|
||||||
|
if (isminw) data.width = o.minWidth; |
||||||
|
if (isminh) data.height = o.minHeight; |
||||||
|
if (ismaxw) data.width = o.maxWidth; |
||||||
|
if (ismaxh) data.height = o.maxHeight; |
||||||
|
|
||||||
|
var dw = this.originalPosition.left + this.originalSize.width, dh = this.position.top + this.size.height; |
||||||
|
var cw = /sw|nw|w/.test(a), ch = /nw|ne|n/.test(a); |
||||||
|
|
||||||
|
if (isminw && cw) data.left = dw - o.minWidth; |
||||||
|
if (ismaxw && cw) data.left = dw - o.maxWidth; |
||||||
|
if (isminh && ch) data.top = dh - o.minHeight; |
||||||
|
if (ismaxh && ch) data.top = dh - o.maxHeight; |
||||||
|
|
||||||
|
// fixing jump error on top/left - bug #2330
|
||||||
|
var isNotwh = !data.width && !data.height; |
||||||
|
if (isNotwh && !data.left && data.top) data.top = null; |
||||||
|
else if (isNotwh && !data.top && data.left) data.left = null; |
||||||
|
|
||||||
|
return data; |
||||||
|
}, |
||||||
|
|
||||||
|
_proportionallyResize: function() { |
||||||
|
|
||||||
|
var o = this.options; |
||||||
|
if (!this._proportionallyResizeElements.length) return; |
||||||
|
var element = this.helper || this.element; |
||||||
|
|
||||||
|
for (var i=0; i < this._proportionallyResizeElements.length; i++) { |
||||||
|
|
||||||
|
var prel = this._proportionallyResizeElements[i]; |
||||||
|
|
||||||
|
if (!this.borderDif) { |
||||||
|
var b = [prel.css('borderTopWidth'), prel.css('borderRightWidth'), prel.css('borderBottomWidth'), prel.css('borderLeftWidth')], |
||||||
|
p = [prel.css('paddingTop'), prel.css('paddingRight'), prel.css('paddingBottom'), prel.css('paddingLeft')]; |
||||||
|
|
||||||
|
this.borderDif = $.map(b, function(v, i) { |
||||||
|
var border = parseInt(v,10)||0, padding = parseInt(p[i],10)||0; |
||||||
|
return border + padding; |
||||||
|
}); |
||||||
|
} |
||||||
|
|
||||||
|
if ($.browser.msie && !(!($(element).is(':hidden') || $(element).parents(':hidden').length))) |
||||||
|
continue; |
||||||
|
|
||||||
|
prel.css({ |
||||||
|
height: (element.height() - this.borderDif[0] - this.borderDif[2]) || 0, |
||||||
|
width: (element.width() - this.borderDif[1] - this.borderDif[3]) || 0 |
||||||
|
}); |
||||||
|
|
||||||
|
}; |
||||||
|
|
||||||
|
}, |
||||||
|
|
||||||
|
_renderProxy: function() { |
||||||
|
|
||||||
|
var el = this.element, o = this.options; |
||||||
|
this.elementOffset = el.offset(); |
||||||
|
|
||||||
|
if(this._helper) { |
||||||
|
|
||||||
|
this.helper = this.helper || $('<div style="overflow:hidden;"></div>'); |
||||||
|
|
||||||
|
// fix ie6 offset TODO: This seems broken
|
||||||
|
var ie6 = $.browser.msie && $.browser.version < 7, ie6offset = (ie6 ? 1 : 0), |
||||||
|
pxyoffset = ( ie6 ? 2 : -1 ); |
||||||
|
|
||||||
|
this.helper.addClass(this._helper).css({ |
||||||
|
width: this.element.outerWidth() + pxyoffset, |
||||||
|
height: this.element.outerHeight() + pxyoffset, |
||||||
|
position: 'absolute', |
||||||
|
left: this.elementOffset.left - ie6offset +'px', |
||||||
|
top: this.elementOffset.top - ie6offset +'px', |
||||||
|
zIndex: ++o.zIndex //TODO: Don't modify option
|
||||||
|
}); |
||||||
|
|
||||||
|
this.helper |
||||||
|
.appendTo("body") |
||||||
|
.disableSelection(); |
||||||
|
|
||||||
|
} else { |
||||||
|
this.helper = this.element; |
||||||
|
} |
||||||
|
|
||||||
|
}, |
||||||
|
|
||||||
|
_change: { |
||||||
|
e: function(event, dx, dy) { |
||||||
|
return { width: this.originalSize.width + dx }; |
||||||
|
}, |
||||||
|
w: function(event, dx, dy) { |
||||||
|
var o = this.options, cs = this.originalSize, sp = this.originalPosition; |
||||||
|
return { left: sp.left + dx, width: cs.width - dx }; |
||||||
|
}, |
||||||
|
n: function(event, dx, dy) { |
||||||
|
var o = this.options, cs = this.originalSize, sp = this.originalPosition; |
||||||
|
return { top: sp.top + dy, height: cs.height - dy }; |
||||||
|
}, |
||||||
|
s: function(event, dx, dy) { |
||||||
|
return { height: this.originalSize.height + dy }; |
||||||
|
}, |
||||||
|
se: function(event, dx, dy) { |
||||||
|
return $.extend(this._change.s.apply(this, arguments), this._change.e.apply(this, [event, dx, dy])); |
||||||
|
}, |
||||||
|
sw: function(event, dx, dy) { |
||||||
|
return $.extend(this._change.s.apply(this, arguments), this._change.w.apply(this, [event, dx, dy])); |
||||||
|
}, |
||||||
|
ne: function(event, dx, dy) { |
||||||
|
return $.extend(this._change.n.apply(this, arguments), this._change.e.apply(this, [event, dx, dy])); |
||||||
|
}, |
||||||
|
nw: function(event, dx, dy) { |
||||||
|
return $.extend(this._change.n.apply(this, arguments), this._change.w.apply(this, [event, dx, dy])); |
||||||
|
} |
||||||
|
}, |
||||||
|
|
||||||
|
_propagate: function(n, event) { |
||||||
|
$.ui.plugin.call(this, n, [event, this.ui()]); |
||||||
|
(n != "resize" && this._trigger(n, event, this.ui())); |
||||||
|
}, |
||||||
|
|
||||||
|
plugins: {}, |
||||||
|
|
||||||
|
ui: function() { |
||||||
|
return { |
||||||
|
originalElement: this.originalElement, |
||||||
|
element: this.element, |
||||||
|
helper: this.helper, |
||||||
|
position: this.position, |
||||||
|
size: this.size, |
||||||
|
originalSize: this.originalSize, |
||||||
|
originalPosition: this.originalPosition |
||||||
|
}; |
||||||
|
} |
||||||
|
|
||||||
|
}); |
||||||
|
|
||||||
|
$.extend($.ui.resizable, { |
||||||
|
version: "1.8.1" |
||||||
|
}); |
||||||
|
|
||||||
|
/* |
||||||
|
* Resizable Extensions |
||||||
|
*/ |
||||||
|
|
||||||
|
$.ui.plugin.add("resizable", "alsoResize", { |
||||||
|
|
||||||
|
start: function(event, ui) { |
||||||
|
|
||||||
|
var self = $(this).data("resizable"), o = self.options; |
||||||
|
|
||||||
|
var _store = function(exp) { |
||||||
|
$(exp).each(function() { |
||||||
|
$(this).data("resizable-alsoresize", { |
||||||
|
width: parseInt($(this).width(), 10), height: parseInt($(this).height(), 10), |
||||||
|
left: parseInt($(this).css('left'), 10), top: parseInt($(this).css('top'), 10) |
||||||
|
}); |
||||||
|
}); |
||||||
|
}; |
||||||
|
|
||||||
|
if (typeof(o.alsoResize) == 'object' && !o.alsoResize.parentNode) { |
||||||
|
if (o.alsoResize.length) { o.alsoResize = o.alsoResize[0]; _store(o.alsoResize); } |
||||||
|
else { $.each(o.alsoResize, function(exp, c) { _store(exp); }); } |
||||||
|
}else{ |
||||||
|
_store(o.alsoResize); |
||||||
|
} |
||||||
|
}, |
||||||
|
|
||||||
|
resize: function(event, ui){ |
||||||
|
var self = $(this).data("resizable"), o = self.options, os = self.originalSize, op = self.originalPosition; |
||||||
|
|
||||||
|
var delta = { |
||||||
|
height: (self.size.height - os.height) || 0, width: (self.size.width - os.width) || 0, |
||||||
|
top: (self.position.top - op.top) || 0, left: (self.position.left - op.left) || 0 |
||||||
|
}, |
||||||
|
|
||||||
|
_alsoResize = function(exp, c) { |
||||||
|
$(exp).each(function() { |
||||||
|
var el = $(this), start = $(this).data("resizable-alsoresize"), style = {}, css = c && c.length ? c : ['width', 'height', 'top', 'left']; |
||||||
|
|
||||||
|
$.each(css || ['width', 'height', 'top', 'left'], function(i, prop) { |
||||||
|
var sum = (start[prop]||0) + (delta[prop]||0); |
||||||
|
if (sum && sum >= 0) |
||||||
|
style[prop] = sum || null; |
||||||
|
}); |
||||||
|
|
||||||
|
//Opera fixing relative position
|
||||||
|
if (/relative/.test(el.css('position')) && $.browser.opera) { |
||||||
|
self._revertToRelativePosition = true; |
||||||
|
el.css({ position: 'absolute', top: 'auto', left: 'auto' }); |
||||||
|
} |
||||||
|
|
||||||
|
el.css(style); |
||||||
|
}); |
||||||
|
}; |
||||||
|
|
||||||
|
if (typeof(o.alsoResize) == 'object' && !o.alsoResize.nodeType) { |
||||||
|
$.each(o.alsoResize, function(exp, c) { _alsoResize(exp, c); }); |
||||||
|
}else{ |
||||||
|
_alsoResize(o.alsoResize); |
||||||
|
} |
||||||
|
}, |
||||||
|
|
||||||
|
stop: function(event, ui){ |
||||||
|
var self = $(this).data("resizable"); |
||||||
|
|
||||||
|
//Opera fixing relative position
|
||||||
|
if (self._revertToRelativePosition && $.browser.opera) { |
||||||
|
self._revertToRelativePosition = false; |
||||||
|
el.css({ position: 'relative' }); |
||||||
|
} |
||||||
|
|
||||||
|
$(this).removeData("resizable-alsoresize-start"); |
||||||
|
} |
||||||
|
}); |
||||||
|
|
||||||
|
$.ui.plugin.add("resizable", "animate", { |
||||||
|
|
||||||
|
stop: function(event, ui) { |
||||||
|
var self = $(this).data("resizable"), o = self.options; |
||||||
|
|
||||||
|
var pr = self._proportionallyResizeElements, ista = pr.length && (/textarea/i).test(pr[0].nodeName), |
||||||
|
soffseth = ista && $.ui.hasScroll(pr[0], 'left') /* TODO - jump height */ ? 0 : self.sizeDiff.height, |
||||||
|
soffsetw = ista ? 0 : self.sizeDiff.width; |
||||||
|
|
||||||
|
var style = { width: (self.size.width - soffsetw), height: (self.size.height - soffseth) }, |
||||||
|
left = (parseInt(self.element.css('left'), 10) + (self.position.left - self.originalPosition.left)) || null, |
||||||
|
top = (parseInt(self.element.css('top'), 10) + (self.position.top - self.originalPosition.top)) || null; |
||||||
|
|
||||||
|
self.element.animate( |
||||||
|
$.extend(style, top && left ? { top: top, left: left } : {}), { |
||||||
|
duration: o.animateDuration, |
||||||
|
easing: o.animateEasing, |
||||||
|
step: function() { |
||||||
|
|
||||||
|
var data = { |
||||||
|
width: parseInt(self.element.css('width'), 10), |
||||||
|
height: parseInt(self.element.css('height'), 10), |
||||||
|
top: parseInt(self.element.css('top'), 10), |
||||||
|
left: parseInt(self.element.css('left'), 10) |
||||||
|
}; |
||||||
|
|
||||||
|
if (pr && pr.length) $(pr[0]).css({ width: data.width, height: data.height }); |
||||||
|
|
||||||
|
// propagating resize, and updating values for each animation step
|
||||||
|
self._updateCache(data); |
||||||
|
self._propagate("resize", event); |
||||||
|
|
||||||
|
} |
||||||
|
} |
||||||
|
); |
||||||
|
} |
||||||
|
|
||||||
|
}); |
||||||
|
|
||||||
|
$.ui.plugin.add("resizable", "containment", { |
||||||
|
|
||||||
|
start: function(event, ui) { |
||||||
|
var self = $(this).data("ui-resizable"), o = self.options, el = self.element; |
||||||
|
var oc = o.containment, ce = (oc instanceof $) ? oc.get(0) : (/parent/.test(oc)) ? el.parent().get(0) : oc; |
||||||
|
if (!ce) return; |
||||||
|
|
||||||
|
self.containerElement = $(ce); |
||||||
|
|
||||||
|
if (/document/.test(oc) || oc == document) { |
||||||
|
self.containerOffset = { left: 0, top: 0 }; |
||||||
|
self.containerPosition = { left: 0, top: 0 }; |
||||||
|
|
||||||
|
self.parentData = { |
||||||
|
element: $(document), left: 0, top: 0, |
||||||
|
width: $(document).width(), height: $(document).height() || document.body.parentNode.scrollHeight |
||||||
|
}; |
||||||
|
} |
||||||
|
|
||||||
|
// i'm a node, so compute top, left, right, bottom
|
||||||
|
else { |
||||||
|
var element = $(ce), p = []; |
||||||
|
$([ "Top", "Right", "Left", "Bottom" ]).each(function(i, name) { p[i] = num(element.css("padding" + name)); }); |
||||||
|
|
||||||
|
self.containerOffset = element.offset(); |
||||||
|
self.containerPosition = element.position(); |
||||||
|
self.containerSize = { height: (element.innerHeight() - p[3]), width: (element.innerWidth() - p[1]) }; |
||||||
|
|
||||||
|
var co = self.containerOffset, ch = self.containerSize.height, cw = self.containerSize.width, |
||||||
|
width = ($.ui.hasScroll(ce, "left") ? ce.scrollWidth : cw ), height = ($.ui.hasScroll(ce) ? ce.scrollHeight : ch); |
||||||
|
|
||||||
|
self.parentData = { |
||||||
|
element: ce, left: co.left, top: co.top, width: width, height: height |
||||||
|
}; |
||||||
|
} |
||||||
|
}, |
||||||
|
|
||||||
|
resize: function(event, ui) { |
||||||
|
var self = $(this).data("resizable"), o = self.options, |
||||||
|
ps = self.containerSize, co = self.containerOffset, cs = self.size, cp = self.position, |
||||||
|
pRatio = self._aspectRatio || event.shiftKey, cop = { top:0, left:0 }, ce = self.containerElement; |
||||||
|
|
||||||
|
if (ce[0] != document && (/static/).test(ce.css('position'))) cop = co; |
||||||
|
|
||||||
|
if (cp.left < (self._helper ? co.left : 0)) { |
||||||
|
self.size.width = self.size.width + (self._helper ? (self.position.left - co.left) : (self.position.left - cop.left)); |
||||||
|
if (pRatio) self.size.height = self.size.width / o.aspectRatio; |
||||||
|
self.position.left = o.helper ? co.left : 0; |
||||||
|
} |
||||||
|
|
||||||
|
if (cp.top < (self._helper ? co.top : 0)) { |
||||||
|
self.size.height = self.size.height + (self._helper ? (self.position.top - co.top) : self.position.top); |
||||||
|
if (pRatio) self.size.width = self.size.height * o.aspectRatio; |
||||||
|
self.position.top = self._helper ? co.top : 0; |
||||||
|
} |
||||||
|
|
||||||
|
self.offset.left = self.parentData.left+self.position.left; |
||||||
|
self.offset.top = self.parentData.top+self.position.top; |
||||||
|
|
||||||
|
var woset = Math.abs( (self._helper ? self.offset.left - cop.left : (self.offset.left - cop.left)) + self.sizeDiff.width ), |
||||||
|
hoset = Math.abs( (self._helper ? self.offset.top - cop.top : (self.offset.top - co.top)) + self.sizeDiff.height ); |
||||||
|
|
||||||
|
var isParent = self.containerElement.get(0) == self.element.parent().get(0), |
||||||
|
isOffsetRelative = /relative|absolute/.test(self.containerElement.css('position')); |
||||||
|
|
||||||
|
if(isParent && isOffsetRelative) woset -= self.parentData.left; |
||||||
|
|
||||||
|
if (woset + self.size.width >= self.parentData.width) { |
||||||
|
self.size.width = self.parentData.width - woset; |
||||||
|
if (pRatio) self.size.height = self.size.width / self.aspectRatio; |
||||||
|
} |
||||||
|
|
||||||
|
if (hoset + self.size.height >= self.parentData.height) { |
||||||
|
self.size.height = self.parentData.height - hoset; |
||||||
|
if (pRatio) self.size.width = self.size.height * self.aspectRatio; |
||||||
|
} |
||||||
|
}, |
||||||
|
|
||||||
|
stop: function(event, ui){ |
||||||
|
var self = $(this).data("resizable"), o = self.options, cp = self.position, |
||||||
|
co = self.containerOffset, cop = self.containerPosition, ce = self.containerElement; |
||||||
|
|
||||||
|
var helper = $(self.helper), ho = helper.offset(), w = helper.outerWidth() - self.sizeDiff.width, h = helper.outerHeight() - self.sizeDiff.height; |
||||||
|
|
||||||
|
if (self._helper && !o.animate && (/relative/).test(ce.css('position'))) |
||||||
|
$(this).css({ left: ho.left - cop.left - co.left, width: w, height: h }); |
||||||
|
|
||||||
|
if (self._helper && !o.animate && (/static/).test(ce.css('position'))) |
||||||
|
$(this).css({ left: ho.left - cop.left - co.left, width: w, height: h }); |
||||||
|
|
||||||
|
} |
||||||
|
}); |
||||||
|
|
||||||
|
$.ui.plugin.add("resizable", "ghost", { |
||||||
|
|
||||||
|
start: function(event, ui) { |
||||||
|
|
||||||
|
var self = $(this).data("resizable"), o = self.options, cs = self.size; |
||||||
|
|
||||||
|
self.ghost = self.originalElement.clone(); |
||||||
|
self.ghost |
||||||
|
.css({ opacity: .25, display: 'block', position: 'relative', height: cs.height, width: cs.width, margin: 0, left: 0, top: 0 }) |
||||||
|
.addClass('ui-resizable-ghost') |
||||||
|
.addClass(typeof o.ghost == 'string' ? o.ghost : ''); |
||||||
|
|
||||||
|
self.ghost.appendTo(self.helper); |
||||||
|
|
||||||
|
}, |
||||||
|
|
||||||
|
resize: function(event, ui){ |
||||||
|
var self = $(this).data("resizable"), o = self.options; |
||||||
|
if (self.ghost) self.ghost.css({ position: 'relative', height: self.size.height, width: self.size.width }); |
||||||
|
}, |
||||||
|
|
||||||
|
stop: function(event, ui){ |
||||||
|
var self = $(this).data("resizable"), o = self.options; |
||||||
|
if (self.ghost && self.helper) self.helper.get(0).removeChild(self.ghost.get(0)); |
||||||
|
} |
||||||
|
|
||||||
|
}); |
||||||
|
|
||||||
|
$.ui.plugin.add("resizable", "grid", { |
||||||
|
|
||||||
|
resize: function(event, ui) { |
||||||
|
var self = $(this).data("resizable"), o = self.options, cs = self.size, os = self.originalSize, op = self.originalPosition, a = self.axis, ratio = o._aspectRatio || event.shiftKey; |
||||||
|
o.grid = typeof o.grid == "number" ? [o.grid, o.grid] : o.grid; |
||||||
|
var ox = Math.round((cs.width - os.width) / (o.grid[0]||1)) * (o.grid[0]||1), oy = Math.round((cs.height - os.height) / (o.grid[1]||1)) * (o.grid[1]||1); |
||||||
|
|
||||||
|
if (/^(se|s|e)$/.test(a)) { |
||||||
|
self.size.width = os.width + ox; |
||||||
|
self.size.height = os.height + oy; |
||||||
|
} |
||||||
|
else if (/^(ne)$/.test(a)) { |
||||||
|
self.size.width = os.width + ox; |
||||||
|
self.size.height = os.height + oy; |
||||||
|
self.position.top = op.top - oy; |
||||||
|
} |
||||||
|
else if (/^(sw)$/.test(a)) { |
||||||
|
self.size.width = os.width + ox; |
||||||
|
self.size.height = os.height + oy; |
||||||
|
self.position.left = op.left - ox; |
||||||
|
} |
||||||
|
else { |
||||||
|
self.size.width = os.width + ox; |
||||||
|
self.size.height = os.height + oy; |
||||||
|
self.position.top = op.top - oy; |
||||||
|
self.position.left = op.left - ox; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
}); |
||||||
|
|
||||||
|
var num = function(v) { |
||||||
|
return parseInt(v, 10) || 0; |
||||||
|
}; |
||||||
|
|
||||||
|
var isNumber = function(value) { |
||||||
|
return !isNaN(parseInt(value, 10)); |
||||||
|
}; |
||||||
|
|
||||||
|
})(jQuery); |
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,521 @@ |
|||||||
|
/*! |
||||||
|
* jQuery UI Widget 1.10.2 |
||||||
|
* http://jqueryui.com
|
||||||
|
* |
||||||
|
* Copyright 2013 jQuery Foundation and other contributors |
||||||
|
* Released under the MIT license. |
||||||
|
* http://jquery.org/license
|
||||||
|
* |
||||||
|
* http://api.jqueryui.com/jQuery.widget/
|
||||||
|
*/ |
||||||
|
(function( $, undefined ) { |
||||||
|
|
||||||
|
var uuid = 0, |
||||||
|
slice = Array.prototype.slice, |
||||||
|
_cleanData = $.cleanData; |
||||||
|
$.cleanData = function( elems ) { |
||||||
|
for ( var i = 0, elem; (elem = elems[i]) != null; i++ ) { |
||||||
|
try { |
||||||
|
$( elem ).triggerHandler( "remove" ); |
||||||
|
// http://bugs.jquery.com/ticket/8235
|
||||||
|
} catch( e ) {} |
||||||
|
} |
||||||
|
_cleanData( elems ); |
||||||
|
}; |
||||||
|
|
||||||
|
$.widget = function( name, base, prototype ) { |
||||||
|
var fullName, existingConstructor, constructor, basePrototype, |
||||||
|
// proxiedPrototype allows the provided prototype to remain unmodified
|
||||||
|
// so that it can be used as a mixin for multiple widgets (#8876)
|
||||||
|
proxiedPrototype = {}, |
||||||
|
namespace = name.split( "." )[ 0 ]; |
||||||
|
|
||||||
|
name = name.split( "." )[ 1 ]; |
||||||
|
fullName = namespace + "-" + name; |
||||||
|
|
||||||
|
if ( !prototype ) { |
||||||
|
prototype = base; |
||||||
|
base = $.Widget; |
||||||
|
} |
||||||
|
|
||||||
|
// create selector for plugin
|
||||||
|
$.expr[ ":" ][ fullName.toLowerCase() ] = function( elem ) { |
||||||
|
return !!$.data( elem, fullName ); |
||||||
|
}; |
||||||
|
|
||||||
|
$[ namespace ] = $[ namespace ] || {}; |
||||||
|
existingConstructor = $[ namespace ][ name ]; |
||||||
|
constructor = $[ namespace ][ name ] = function( options, element ) { |
||||||
|
// allow instantiation without "new" keyword
|
||||||
|
if ( !this._createWidget ) { |
||||||
|
return new constructor( options, element ); |
||||||
|
} |
||||||
|
|
||||||
|
// allow instantiation without initializing for simple inheritance
|
||||||
|
// must use "new" keyword (the code above always passes args)
|
||||||
|
if ( arguments.length ) { |
||||||
|
this._createWidget( options, element ); |
||||||
|
} |
||||||
|
}; |
||||||
|
// extend with the existing constructor to carry over any static properties
|
||||||
|
$.extend( constructor, existingConstructor, { |
||||||
|
version: prototype.version, |
||||||
|
// copy the object used to create the prototype in case we need to
|
||||||
|
// redefine the widget later
|
||||||
|
_proto: $.extend( {}, prototype ), |
||||||
|
// track widgets that inherit from this widget in case this widget is
|
||||||
|
// redefined after a widget inherits from it
|
||||||
|
_childConstructors: [] |
||||||
|
}); |
||||||
|
|
||||||
|
basePrototype = new base(); |
||||||
|
// we need to make the options hash a property directly on the new instance
|
||||||
|
// otherwise we'll modify the options hash on the prototype that we're
|
||||||
|
// inheriting from
|
||||||
|
basePrototype.options = $.widget.extend( {}, basePrototype.options ); |
||||||
|
$.each( prototype, function( prop, value ) { |
||||||
|
if ( !$.isFunction( value ) ) { |
||||||
|
proxiedPrototype[ prop ] = value; |
||||||
|
return; |
||||||
|
} |
||||||
|
proxiedPrototype[ prop ] = (function() { |
||||||
|
var _super = function() { |
||||||
|
return base.prototype[ prop ].apply( this, arguments ); |
||||||
|
}, |
||||||
|
_superApply = function( args ) { |
||||||
|
return base.prototype[ prop ].apply( this, args ); |
||||||
|
}; |
||||||
|
return function() { |
||||||
|
var __super = this._super, |
||||||
|
__superApply = this._superApply, |
||||||
|
returnValue; |
||||||
|
|
||||||
|
this._super = _super; |
||||||
|
this._superApply = _superApply; |
||||||
|
|
||||||
|
returnValue = value.apply( this, arguments ); |
||||||
|
|
||||||
|
this._super = __super; |
||||||
|
this._superApply = __superApply; |
||||||
|
|
||||||
|
return returnValue; |
||||||
|
}; |
||||||
|
})(); |
||||||
|
}); |
||||||
|
constructor.prototype = $.widget.extend( basePrototype, { |
||||||
|
// TODO: remove support for widgetEventPrefix
|
||||||
|
// always use the name + a colon as the prefix, e.g., draggable:start
|
||||||
|
// don't prefix for widgets that aren't DOM-based
|
||||||
|
widgetEventPrefix: existingConstructor ? basePrototype.widgetEventPrefix : name |
||||||
|
}, proxiedPrototype, { |
||||||
|
constructor: constructor, |
||||||
|
namespace: namespace, |
||||||
|
widgetName: name, |
||||||
|
widgetFullName: fullName |
||||||
|
}); |
||||||
|
|
||||||
|
// If this widget is being redefined then we need to find all widgets that
|
||||||
|
// are inheriting from it and redefine all of them so that they inherit from
|
||||||
|
// the new version of this widget. We're essentially trying to replace one
|
||||||
|
// level in the prototype chain.
|
||||||
|
if ( existingConstructor ) { |
||||||
|
$.each( existingConstructor._childConstructors, function( i, child ) { |
||||||
|
var childPrototype = child.prototype; |
||||||
|
|
||||||
|
// redefine the child widget using the same prototype that was
|
||||||
|
// originally used, but inherit from the new version of the base
|
||||||
|
$.widget( childPrototype.namespace + "." + childPrototype.widgetName, constructor, child._proto ); |
||||||
|
}); |
||||||
|
// remove the list of existing child constructors from the old constructor
|
||||||
|
// so the old child constructors can be garbage collected
|
||||||
|
delete existingConstructor._childConstructors; |
||||||
|
} else { |
||||||
|
base._childConstructors.push( constructor ); |
||||||
|
} |
||||||
|
|
||||||
|
$.widget.bridge( name, constructor ); |
||||||
|
}; |
||||||
|
|
||||||
|
$.widget.extend = function( target ) { |
||||||
|
var input = slice.call( arguments, 1 ), |
||||||
|
inputIndex = 0, |
||||||
|
inputLength = input.length, |
||||||
|
key, |
||||||
|
value; |
||||||
|
for ( ; inputIndex < inputLength; inputIndex++ ) { |
||||||
|
for ( key in input[ inputIndex ] ) { |
||||||
|
value = input[ inputIndex ][ key ]; |
||||||
|
if ( input[ inputIndex ].hasOwnProperty( key ) && value !== undefined ) { |
||||||
|
// Clone objects
|
||||||
|
if ( $.isPlainObject( value ) ) { |
||||||
|
target[ key ] = $.isPlainObject( target[ key ] ) ? |
||||||
|
$.widget.extend( {}, target[ key ], value ) : |
||||||
|
// Don't extend strings, arrays, etc. with objects
|
||||||
|
$.widget.extend( {}, value ); |
||||||
|
// Copy everything else by reference
|
||||||
|
} else { |
||||||
|
target[ key ] = value; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
return target; |
||||||
|
}; |
||||||
|
|
||||||
|
$.widget.bridge = function( name, object ) { |
||||||
|
var fullName = object.prototype.widgetFullName || name; |
||||||
|
$.fn[ name ] = function( options ) { |
||||||
|
var isMethodCall = typeof options === "string", |
||||||
|
args = slice.call( arguments, 1 ), |
||||||
|
returnValue = this; |
||||||
|
|
||||||
|
// allow multiple hashes to be passed on init
|
||||||
|
options = !isMethodCall && args.length ? |
||||||
|
$.widget.extend.apply( null, [ options ].concat(args) ) : |
||||||
|
options; |
||||||
|
|
||||||
|
if ( isMethodCall ) { |
||||||
|
this.each(function() { |
||||||
|
var methodValue, |
||||||
|
instance = $.data( this, fullName ); |
||||||
|
if ( !instance ) { |
||||||
|
return $.error( "cannot call methods on " + name + " prior to initialization; " + |
||||||
|
"attempted to call method '" + options + "'" ); |
||||||
|
} |
||||||
|
if ( !$.isFunction( instance[options] ) || options.charAt( 0 ) === "_" ) { |
||||||
|
return $.error( "no such method '" + options + "' for " + name + " widget instance" ); |
||||||
|
} |
||||||
|
methodValue = instance[ options ].apply( instance, args ); |
||||||
|
if ( methodValue !== instance && methodValue !== undefined ) { |
||||||
|
returnValue = methodValue && methodValue.jquery ? |
||||||
|
returnValue.pushStack( methodValue.get() ) : |
||||||
|
methodValue; |
||||||
|
return false; |
||||||
|
} |
||||||
|
}); |
||||||
|
} else { |
||||||
|
this.each(function() { |
||||||
|
var instance = $.data( this, fullName ); |
||||||
|
if ( instance ) { |
||||||
|
instance.option( options || {} )._init(); |
||||||
|
} else { |
||||||
|
$.data( this, fullName, new object( options, this ) ); |
||||||
|
} |
||||||
|
}); |
||||||
|
} |
||||||
|
|
||||||
|
return returnValue; |
||||||
|
}; |
||||||
|
}; |
||||||
|
|
||||||
|
$.Widget = function( /* options, element */ ) {}; |
||||||
|
$.Widget._childConstructors = []; |
||||||
|
|
||||||
|
$.Widget.prototype = { |
||||||
|
widgetName: "widget", |
||||||
|
widgetEventPrefix: "", |
||||||
|
defaultElement: "<div>", |
||||||
|
options: { |
||||||
|
disabled: false, |
||||||
|
|
||||||
|
// callbacks
|
||||||
|
create: null |
||||||
|
}, |
||||||
|
_createWidget: function( options, element ) { |
||||||
|
element = $( element || this.defaultElement || this )[ 0 ]; |
||||||
|
this.element = $( element ); |
||||||
|
this.uuid = uuid++; |
||||||
|
this.eventNamespace = "." + this.widgetName + this.uuid; |
||||||
|
this.options = $.widget.extend( {}, |
||||||
|
this.options, |
||||||
|
this._getCreateOptions(), |
||||||
|
options ); |
||||||
|
|
||||||
|
this.bindings = $(); |
||||||
|
this.hoverable = $(); |
||||||
|
this.focusable = $(); |
||||||
|
|
||||||
|
if ( element !== this ) { |
||||||
|
$.data( element, this.widgetFullName, this ); |
||||||
|
this._on( true, this.element, { |
||||||
|
remove: function( event ) { |
||||||
|
if ( event.target === element ) { |
||||||
|
this.destroy(); |
||||||
|
} |
||||||
|
} |
||||||
|
}); |
||||||
|
this.document = $( element.style ? |
||||||
|
// element within the document
|
||||||
|
element.ownerDocument : |
||||||
|
// element is window or document
|
||||||
|
element.document || element ); |
||||||
|
this.window = $( this.document[0].defaultView || this.document[0].parentWindow ); |
||||||
|
} |
||||||
|
|
||||||
|
this._create(); |
||||||
|
this._trigger( "create", null, this._getCreateEventData() ); |
||||||
|
this._init(); |
||||||
|
}, |
||||||
|
_getCreateOptions: $.noop, |
||||||
|
_getCreateEventData: $.noop, |
||||||
|
_create: $.noop, |
||||||
|
_init: $.noop, |
||||||
|
|
||||||
|
destroy: function() { |
||||||
|
this._destroy(); |
||||||
|
// we can probably remove the unbind calls in 2.0
|
||||||
|
// all event bindings should go through this._on()
|
||||||
|
this.element |
||||||
|
.unbind( this.eventNamespace ) |
||||||
|
// 1.9 BC for #7810
|
||||||
|
// TODO remove dual storage
|
||||||
|
.removeData( this.widgetName ) |
||||||
|
.removeData( this.widgetFullName ) |
||||||
|
// support: jquery <1.6.3
|
||||||
|
// http://bugs.jquery.com/ticket/9413
|
||||||
|
.removeData( $.camelCase( this.widgetFullName ) ); |
||||||
|
this.widget() |
||||||
|
.unbind( this.eventNamespace ) |
||||||
|
.removeAttr( "aria-disabled" ) |
||||||
|
.removeClass( |
||||||
|
this.widgetFullName + "-disabled " + |
||||||
|
"ui-state-disabled" ); |
||||||
|
|
||||||
|
// clean up events and states
|
||||||
|
this.bindings.unbind( this.eventNamespace ); |
||||||
|
this.hoverable.removeClass( "ui-state-hover" ); |
||||||
|
this.focusable.removeClass( "ui-state-focus" ); |
||||||
|
}, |
||||||
|
_destroy: $.noop, |
||||||
|
|
||||||
|
widget: function() { |
||||||
|
return this.element; |
||||||
|
}, |
||||||
|
|
||||||
|
option: function( key, value ) { |
||||||
|
var options = key, |
||||||
|
parts, |
||||||
|
curOption, |
||||||
|
i; |
||||||
|
|
||||||
|
if ( arguments.length === 0 ) { |
||||||
|
// don't return a reference to the internal hash
|
||||||
|
return $.widget.extend( {}, this.options ); |
||||||
|
} |
||||||
|
|
||||||
|
if ( typeof key === "string" ) { |
||||||
|
// handle nested keys, e.g., "foo.bar" => { foo: { bar: ___ } }
|
||||||
|
options = {}; |
||||||
|
parts = key.split( "." ); |
||||||
|
key = parts.shift(); |
||||||
|
if ( parts.length ) { |
||||||
|
curOption = options[ key ] = $.widget.extend( {}, this.options[ key ] ); |
||||||
|
for ( i = 0; i < parts.length - 1; i++ ) { |
||||||
|
curOption[ parts[ i ] ] = curOption[ parts[ i ] ] || {}; |
||||||
|
curOption = curOption[ parts[ i ] ]; |
||||||
|
} |
||||||
|
key = parts.pop(); |
||||||
|
if ( value === undefined ) { |
||||||
|
return curOption[ key ] === undefined ? null : curOption[ key ]; |
||||||
|
} |
||||||
|
curOption[ key ] = value; |
||||||
|
} else { |
||||||
|
if ( value === undefined ) { |
||||||
|
return this.options[ key ] === undefined ? null : this.options[ key ]; |
||||||
|
} |
||||||
|
options[ key ] = value; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
this._setOptions( options ); |
||||||
|
|
||||||
|
return this; |
||||||
|
}, |
||||||
|
_setOptions: function( options ) { |
||||||
|
var key; |
||||||
|
|
||||||
|
for ( key in options ) { |
||||||
|
this._setOption( key, options[ key ] ); |
||||||
|
} |
||||||
|
|
||||||
|
return this; |
||||||
|
}, |
||||||
|
_setOption: function( key, value ) { |
||||||
|
this.options[ key ] = value; |
||||||
|
|
||||||
|
if ( key === "disabled" ) { |
||||||
|
this.widget() |
||||||
|
.toggleClass( this.widgetFullName + "-disabled ui-state-disabled", !!value ) |
||||||
|
.attr( "aria-disabled", value ); |
||||||
|
this.hoverable.removeClass( "ui-state-hover" ); |
||||||
|
this.focusable.removeClass( "ui-state-focus" ); |
||||||
|
} |
||||||
|
|
||||||
|
return this; |
||||||
|
}, |
||||||
|
|
||||||
|
enable: function() { |
||||||
|
return this._setOption( "disabled", false ); |
||||||
|
}, |
||||||
|
disable: function() { |
||||||
|
return this._setOption( "disabled", true ); |
||||||
|
}, |
||||||
|
|
||||||
|
_on: function( suppressDisabledCheck, element, handlers ) { |
||||||
|
var delegateElement, |
||||||
|
instance = this; |
||||||
|
|
||||||
|
// no suppressDisabledCheck flag, shuffle arguments
|
||||||
|
if ( typeof suppressDisabledCheck !== "boolean" ) { |
||||||
|
handlers = element; |
||||||
|
element = suppressDisabledCheck; |
||||||
|
suppressDisabledCheck = false; |
||||||
|
} |
||||||
|
|
||||||
|
// no element argument, shuffle and use this.element
|
||||||
|
if ( !handlers ) { |
||||||
|
handlers = element; |
||||||
|
element = this.element; |
||||||
|
delegateElement = this.widget(); |
||||||
|
} else { |
||||||
|
// accept selectors, DOM elements
|
||||||
|
element = delegateElement = $( element ); |
||||||
|
this.bindings = this.bindings.add( element ); |
||||||
|
} |
||||||
|
|
||||||
|
$.each( handlers, function( event, handler ) { |
||||||
|
function handlerProxy() { |
||||||
|
// allow widgets to customize the disabled handling
|
||||||
|
// - disabled as an array instead of boolean
|
||||||
|
// - disabled class as method for disabling individual parts
|
||||||
|
if ( !suppressDisabledCheck && |
||||||
|
( instance.options.disabled === true || |
||||||
|
$( this ).hasClass( "ui-state-disabled" ) ) ) { |
||||||
|
return; |
||||||
|
} |
||||||
|
return ( typeof handler === "string" ? instance[ handler ] : handler ) |
||||||
|
.apply( instance, arguments ); |
||||||
|
} |
||||||
|
|
||||||
|
// copy the guid so direct unbinding works
|
||||||
|
if ( typeof handler !== "string" ) { |
||||||
|
handlerProxy.guid = handler.guid = |
||||||
|
handler.guid || handlerProxy.guid || $.guid++; |
||||||
|
} |
||||||
|
|
||||||
|
var match = event.match( /^(\w+)\s*(.*)$/ ), |
||||||
|
eventName = match[1] + instance.eventNamespace, |
||||||
|
selector = match[2]; |
||||||
|
if ( selector ) { |
||||||
|
delegateElement.delegate( selector, eventName, handlerProxy ); |
||||||
|
} else { |
||||||
|
element.bind( eventName, handlerProxy ); |
||||||
|
} |
||||||
|
}); |
||||||
|
}, |
||||||
|
|
||||||
|
_off: function( element, eventName ) { |
||||||
|
eventName = (eventName || "").split( " " ).join( this.eventNamespace + " " ) + this.eventNamespace; |
||||||
|
element.unbind( eventName ).undelegate( eventName ); |
||||||
|
}, |
||||||
|
|
||||||
|
_delay: function( handler, delay ) { |
||||||
|
function handlerProxy() { |
||||||
|
return ( typeof handler === "string" ? instance[ handler ] : handler ) |
||||||
|
.apply( instance, arguments ); |
||||||
|
} |
||||||
|
var instance = this; |
||||||
|
return setTimeout( handlerProxy, delay || 0 ); |
||||||
|
}, |
||||||
|
|
||||||
|
_hoverable: function( element ) { |
||||||
|
this.hoverable = this.hoverable.add( element ); |
||||||
|
this._on( element, { |
||||||
|
mouseenter: function( event ) { |
||||||
|
$( event.currentTarget ).addClass( "ui-state-hover" ); |
||||||
|
}, |
||||||
|
mouseleave: function( event ) { |
||||||
|
$( event.currentTarget ).removeClass( "ui-state-hover" ); |
||||||
|
} |
||||||
|
}); |
||||||
|
}, |
||||||
|
|
||||||
|
_focusable: function( element ) { |
||||||
|
this.focusable = this.focusable.add( element ); |
||||||
|
this._on( element, { |
||||||
|
focusin: function( event ) { |
||||||
|
$( event.currentTarget ).addClass( "ui-state-focus" ); |
||||||
|
}, |
||||||
|
focusout: function( event ) { |
||||||
|
$( event.currentTarget ).removeClass( "ui-state-focus" ); |
||||||
|
} |
||||||
|
}); |
||||||
|
}, |
||||||
|
|
||||||
|
_trigger: function( type, event, data ) { |
||||||
|
var prop, orig, |
||||||
|
callback = this.options[ type ]; |
||||||
|
|
||||||
|
data = data || {}; |
||||||
|
event = $.Event( event ); |
||||||
|
event.type = ( type === this.widgetEventPrefix ? |
||||||
|
type : |
||||||
|
this.widgetEventPrefix + type ).toLowerCase(); |
||||||
|
// the original event may come from any element
|
||||||
|
// so we need to reset the target on the new event
|
||||||
|
event.target = this.element[ 0 ]; |
||||||
|
|
||||||
|
// copy original event properties over to the new event
|
||||||
|
orig = event.originalEvent; |
||||||
|
if ( orig ) { |
||||||
|
for ( prop in orig ) { |
||||||
|
if ( !( prop in event ) ) { |
||||||
|
event[ prop ] = orig[ prop ]; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
this.element.trigger( event, data ); |
||||||
|
return !( $.isFunction( callback ) && |
||||||
|
callback.apply( this.element[0], [ event ].concat( data ) ) === false || |
||||||
|
event.isDefaultPrevented() ); |
||||||
|
} |
||||||
|
}; |
||||||
|
|
||||||
|
$.each( { show: "fadeIn", hide: "fadeOut" }, function( method, defaultEffect ) { |
||||||
|
$.Widget.prototype[ "_" + method ] = function( element, options, callback ) { |
||||||
|
if ( typeof options === "string" ) { |
||||||
|
options = { effect: options }; |
||||||
|
} |
||||||
|
var hasOptions, |
||||||
|
effectName = !options ? |
||||||
|
method : |
||||||
|
options === true || typeof options === "number" ? |
||||||
|
defaultEffect : |
||||||
|
options.effect || defaultEffect; |
||||||
|
options = options || {}; |
||||||
|
if ( typeof options === "number" ) { |
||||||
|
options = { duration: options }; |
||||||
|
} |
||||||
|
hasOptions = !$.isEmptyObject( options ); |
||||||
|
options.complete = callback; |
||||||
|
if ( options.delay ) { |
||||||
|
element.delay( options.delay ); |
||||||
|
} |
||||||
|
if ( hasOptions && $.effects && $.effects.effect[ effectName ] ) { |
||||||
|
element[ method ]( options ); |
||||||
|
} else if ( effectName !== method && element[ effectName ] ) { |
||||||
|
element[ effectName ]( options.duration, options.easing, callback ); |
||||||
|
} else { |
||||||
|
element.queue(function( next ) { |
||||||
|
$( this )[ method ](); |
||||||
|
if ( callback ) { |
||||||
|
callback.call( element[ 0 ] ); |
||||||
|
} |
||||||
|
next(); |
||||||
|
}); |
||||||
|
} |
||||||
|
}; |
||||||
|
}); |
||||||
|
|
||||||
|
})( jQuery ); |
@ -0,0 +1,33 @@ |
|||||||
|
/** |
||||||
|
* Created by zcf on 2016/9/22. |
||||||
|
*/ |
||||||
|
BI.Slider = BI.inherit(BI.Widget, { |
||||||
|
_defaultConfig: function () { |
||||||
|
return BI.extend(BI.Slider.superclass._defaultConfig.apply(this, arguments), { |
||||||
|
baseCls: "bi-single-button-button" |
||||||
|
}); |
||||||
|
}, |
||||||
|
_init: function () { |
||||||
|
BI.extend(BI.Slider.superclass._init.apply(this, arguments)); |
||||||
|
this.slider = BI.createWidget({ |
||||||
|
type: "bi.icon_button", |
||||||
|
cls: "widget-button-icon button-button", |
||||||
|
iconWidth: 14, |
||||||
|
iconHeight: 14, |
||||||
|
height: 14, |
||||||
|
width: 14 |
||||||
|
}); |
||||||
|
BI.createWidget({ |
||||||
|
type: "bi.absolute", |
||||||
|
element: this, |
||||||
|
items: [{ |
||||||
|
el: this.slider, |
||||||
|
top: 7, |
||||||
|
left: -7 |
||||||
|
}], |
||||||
|
width: 0, |
||||||
|
height: 14 |
||||||
|
}); |
||||||
|
} |
||||||
|
}); |
||||||
|
BI.shortcut("bi.single_slider_slider", BI.Slider); |
@ -0,0 +1,279 @@ |
|||||||
|
/** |
||||||
|
* Created by zcf on 2016/9/22. |
||||||
|
*/ |
||||||
|
BI.SingleSlider = BI.inherit(BI.Widget, { |
||||||
|
_constant: { |
||||||
|
EDITOR_WIDTH: 90, |
||||||
|
EDITOR_HEIGHT: 30, |
||||||
|
HEIGHT: 28, |
||||||
|
SLIDER_WIDTH_HALF: 15, |
||||||
|
SLIDER_WIDTH: 30, |
||||||
|
SLIDER_HEIGHT: 30, |
||||||
|
TRACK_HEIGHT: 24 |
||||||
|
}, |
||||||
|
_defaultConfig: function () { |
||||||
|
return BI.extend(BI.SingleSlider.superclass._defaultConfig.apply(this, arguments), { |
||||||
|
baseCls: "bi-single-button bi-button-track" |
||||||
|
}); |
||||||
|
}, |
||||||
|
_init: function () { |
||||||
|
BI.SingleSlider.superclass._init.apply(this, arguments); |
||||||
|
|
||||||
|
var self = this; |
||||||
|
var c = this._constant; |
||||||
|
this.enable = false; |
||||||
|
this.value = ""; |
||||||
|
|
||||||
|
this.grayTrack = BI.createWidget({ |
||||||
|
type: "bi.layout", |
||||||
|
cls: "gray-track", |
||||||
|
height: 6 |
||||||
|
}); |
||||||
|
this.blueTrack = BI.createWidget({ |
||||||
|
type: "bi.layout", |
||||||
|
cls: "blue-track bi-high-light-background", |
||||||
|
height: 6 |
||||||
|
}); |
||||||
|
this.track = this._createTrackWrapper(); |
||||||
|
|
||||||
|
this.slider = BI.createWidget({ |
||||||
|
type: "bi.single_slider_slider" |
||||||
|
}); |
||||||
|
this.slider.element.draggable({ |
||||||
|
axis: "x", |
||||||
|
containment: this.grayTrack.element, |
||||||
|
scroll: false, |
||||||
|
drag: function (e, ui) { |
||||||
|
var percent = (ui.position.left) * 100 / (self._getGrayTrackLength()); |
||||||
|
var significantPercent = BI.parseFloat(percent.toFixed(1));//直接对计算出来的百分数保留到小数点后一位,相当于分成了1000份。
|
||||||
|
self._setBlueTrack(significantPercent); |
||||||
|
self._setLabelPosition(significantPercent); |
||||||
|
var v = self._getValueByPercent(significantPercent); |
||||||
|
self.label.setValue(v); |
||||||
|
self.value = v; |
||||||
|
}, |
||||||
|
stop: function (e, ui) { |
||||||
|
var percent = (ui.position.left) * 100 / (self._getGrayTrackLength()); |
||||||
|
var significantPercent = BI.parseFloat(percent.toFixed(1)); |
||||||
|
self._setSliderPosition(significantPercent); |
||||||
|
self.fireEvent(BI.SingleSlider.EVENT_CHANGE); |
||||||
|
} |
||||||
|
}); |
||||||
|
var sliderVertical = BI.createWidget({ |
||||||
|
type: "bi.vertical", |
||||||
|
items: [{ |
||||||
|
type: "bi.absolute", |
||||||
|
items: [this.slider] |
||||||
|
}], |
||||||
|
hgap: c.SLIDER_WIDTH_HALF, |
||||||
|
height: c.SLIDER_HEIGHT |
||||||
|
}); |
||||||
|
sliderVertical.element.click(function (e) { |
||||||
|
if (self.enable) { |
||||||
|
var offset = e.clientX - self.element.offset().left - c.SLIDER_WIDTH_HALF; |
||||||
|
var trackLength = self.track.element[0].scrollWidth; |
||||||
|
var percent = 0; |
||||||
|
if (offset < 0) { |
||||||
|
percent = 0 |
||||||
|
} |
||||||
|
if (offset > 0 && offset < (trackLength - c.SLIDER_WIDTH)) { |
||||||
|
percent = offset * 100 / self._getGrayTrackLength(); |
||||||
|
} |
||||||
|
if (offset > (trackLength - c.SLIDER_WIDTH)) { |
||||||
|
percent = 100 |
||||||
|
} |
||||||
|
var significantPercent = BI.parseFloat(percent.toFixed(1)); |
||||||
|
self._setAllPosition(significantPercent); |
||||||
|
var v = self._getValueByPercent(significantPercent); |
||||||
|
self.label.setValue(v); |
||||||
|
self.value = v; |
||||||
|
self.fireEvent(BI.SingleSlider.EVENT_CHANGE); |
||||||
|
} |
||||||
|
}); |
||||||
|
this.label = BI.createWidget({ |
||||||
|
type: "bi.sign_editor", |
||||||
|
cls: "button-editor-button bi-border", |
||||||
|
errorText: "", |
||||||
|
height: c.HEIGHT, |
||||||
|
width: c.EDITOR_WIDTH, |
||||||
|
allowBlank: false, |
||||||
|
validationChecker: function (v) { |
||||||
|
return self._checkValidation(v); |
||||||
|
}, |
||||||
|
quitChecker: function (v) { |
||||||
|
return self._checkValidation(v); |
||||||
|
} |
||||||
|
}); |
||||||
|
this.label.on(BI.SignEditor.EVENT_CONFIRM, function () { |
||||||
|
var percent = self._getPercentByValue(this.getValue()); |
||||||
|
var significantPercent = BI.parseFloat(percent.toFixed(1)); |
||||||
|
self._setAllPosition(significantPercent); |
||||||
|
self.fireEvent(BI.SingleSlider.EVENT_CHANGE); |
||||||
|
}); |
||||||
|
this._setVisible(false); |
||||||
|
BI.createWidget({ |
||||||
|
type: "bi.absolute", |
||||||
|
element: this, |
||||||
|
items: [{ |
||||||
|
el: { |
||||||
|
type: "bi.vertical", |
||||||
|
items: [{ |
||||||
|
type: "bi.absolute", |
||||||
|
items: [{ |
||||||
|
el: this.track, |
||||||
|
width: "100%", |
||||||
|
height: c.TRACK_HEIGHT |
||||||
|
}] |
||||||
|
}], |
||||||
|
hgap: 7, |
||||||
|
height: c.TRACK_HEIGHT |
||||||
|
}, |
||||||
|
top: 33, |
||||||
|
left: 0, |
||||||
|
width: "100%" |
||||||
|
}, { |
||||||
|
el: sliderVertical, |
||||||
|
top: 30, |
||||||
|
left: 0, |
||||||
|
width: "100%" |
||||||
|
}, { |
||||||
|
el: { |
||||||
|
type: "bi.vertical", |
||||||
|
items: [{ |
||||||
|
type: "bi.absolute", |
||||||
|
items: [this.label] |
||||||
|
}], |
||||||
|
rgap: c.EDITOR_WIDTH, |
||||||
|
height: c.EDITOR_HEIGHT |
||||||
|
}, |
||||||
|
top: 0, |
||||||
|
left: 0, |
||||||
|
width: "100%" |
||||||
|
}] |
||||||
|
}) |
||||||
|
}, |
||||||
|
|
||||||
|
_createTrackWrapper: function () { |
||||||
|
return BI.createWidget({ |
||||||
|
type: "bi.absolute", |
||||||
|
items: [{ |
||||||
|
el: { |
||||||
|
type: "bi.vertical", |
||||||
|
items: [{ |
||||||
|
type: "bi.absolute", |
||||||
|
items: [{ |
||||||
|
el: this.grayTrack, |
||||||
|
top: 0, |
||||||
|
left: 0, |
||||||
|
width: "100%" |
||||||
|
}, { |
||||||
|
el: this.blueTrack, |
||||||
|
top: 0, |
||||||
|
left: 0, |
||||||
|
width: "0%" |
||||||
|
}] |
||||||
|
}], |
||||||
|
hgap: 8, |
||||||
|
height: 8 |
||||||
|
}, |
||||||
|
top: 8, |
||||||
|
left: 0, |
||||||
|
width: "100%" |
||||||
|
}] |
||||||
|
}) |
||||||
|
}, |
||||||
|
|
||||||
|
_checkValidation: function (v) { |
||||||
|
return !(BI.isNull(v) || v < this.min || v > this.max) |
||||||
|
}, |
||||||
|
|
||||||
|
_setBlueTrack: function (percent) { |
||||||
|
this.blueTrack.element.css({"width": percent + "%"}); |
||||||
|
}, |
||||||
|
|
||||||
|
_setLabelPosition: function (percent) { |
||||||
|
this.label.element.css({"left": percent + "%"}); |
||||||
|
}, |
||||||
|
|
||||||
|
_setSliderPosition: function (percent) { |
||||||
|
this.slider.element.css({"left": percent + "%"}); |
||||||
|
}, |
||||||
|
|
||||||
|
_setAllPosition: function (percent) { |
||||||
|
this._setSliderPosition(percent); |
||||||
|
this._setLabelPosition(percent); |
||||||
|
this._setBlueTrack(percent); |
||||||
|
}, |
||||||
|
|
||||||
|
_setVisible: function (visible) { |
||||||
|
this.slider.setVisible(visible); |
||||||
|
this.label.setVisible(visible); |
||||||
|
}, |
||||||
|
|
||||||
|
_getGrayTrackLength: function () { |
||||||
|
return this.grayTrack.element[0].scrollWidth |
||||||
|
}, |
||||||
|
|
||||||
|
_getValueByPercent: function (percent) { |
||||||
|
var thousandth = BI.parseInt(percent * 10); |
||||||
|
return (((this.max - this.min) * thousandth) / 1000 + this.min); |
||||||
|
}, |
||||||
|
|
||||||
|
_getPercentByValue: function (v) { |
||||||
|
return (v - this.min) * 100 / (this.max - this.min); |
||||||
|
}, |
||||||
|
|
||||||
|
getValue: function () { |
||||||
|
return this.value; |
||||||
|
}, |
||||||
|
|
||||||
|
setValue: function (v) { |
||||||
|
var value = BI.parseFloat(v); |
||||||
|
if ((!isNaN(value))) { |
||||||
|
if (this._checkValidation(value)) { |
||||||
|
this.value = value; |
||||||
|
} |
||||||
|
if (value > this.max) { |
||||||
|
this.value = this.max; |
||||||
|
} |
||||||
|
if (value < this.min) { |
||||||
|
this.value = this.min; |
||||||
|
} |
||||||
|
} |
||||||
|
}, |
||||||
|
|
||||||
|
setMinAndMax: function (v) { |
||||||
|
var minNumber = BI.parseFloat(v.min); |
||||||
|
var maxNumber = BI.parseFloat(v.max); |
||||||
|
if ((!isNaN(minNumber)) && (!isNaN(maxNumber)) && (maxNumber > minNumber )) { |
||||||
|
this.min = minNumber; |
||||||
|
this.max = maxNumber; |
||||||
|
} |
||||||
|
}, |
||||||
|
|
||||||
|
reset: function () { |
||||||
|
this._setVisible(false); |
||||||
|
this.enable = false; |
||||||
|
this.value = ""; |
||||||
|
this.min = 0; |
||||||
|
this.max = 0; |
||||||
|
this._setBlueTrack(0); |
||||||
|
}, |
||||||
|
|
||||||
|
populate: function () { |
||||||
|
if (!isNaN(this.min) && !isNaN(this.max)) { |
||||||
|
this._setVisible(true); |
||||||
|
this.enable = true; |
||||||
|
this.label.setErrorText(BI.i18nText("BI-Please_Enter") + this.min + "-" + this.max + BI.i18nText("BI-Basic_De") + BI.i18nText("BI-Basic_Number")); |
||||||
|
if (BI.isNumeric(this.value) || BI.isNotEmptyString(this.value)) { |
||||||
|
this.label.setValue(this.value); |
||||||
|
this._setAllPosition(this._getPercentByValue(this.value)); |
||||||
|
} else { |
||||||
|
this.label.setValue(this.max); |
||||||
|
this._setAllPosition(100); |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
}); |
||||||
|
BI.SingleSlider.EVENT_CHANGE = "EVENT_CHANGE"; |
||||||
|
BI.shortcut("bi.single_slider", BI.SingleSlider); |
@ -0,0 +1,244 @@ |
|||||||
|
/** |
||||||
|
* normal single slider |
||||||
|
* Created by Young on 2017/6/21. |
||||||
|
*/ |
||||||
|
BI.SingleSliderNormal = BI.inherit(BI.Widget, { |
||||||
|
|
||||||
|
_constant: { |
||||||
|
EDITOR_WIDTH: 90, |
||||||
|
EDITOR_HEIGHT: 30, |
||||||
|
HEIGHT: 28, |
||||||
|
SLIDER_WIDTH_HALF: 15, |
||||||
|
SLIDER_WIDTH: 30, |
||||||
|
SLIDER_HEIGHT: 30, |
||||||
|
TRACK_HEIGHT: 24 |
||||||
|
}, |
||||||
|
|
||||||
|
props: { |
||||||
|
baseCls: "bi-single-button bi-button-track", |
||||||
|
minMax: { |
||||||
|
min: 0, |
||||||
|
max: 100 |
||||||
|
}, |
||||||
|
color: "#3f8ce8" |
||||||
|
}, |
||||||
|
|
||||||
|
render: function () { |
||||||
|
var self = this; |
||||||
|
var c = this._constant; |
||||||
|
var track = this._createTrack(); |
||||||
|
this.slider = BI.createWidget({ |
||||||
|
type: "bi.single_slider_slider" |
||||||
|
}); |
||||||
|
this.slider.element.draggable({ |
||||||
|
axis: "x", |
||||||
|
containment: this.grayTrack.element, |
||||||
|
scroll: false, |
||||||
|
drag: function (e, ui) { |
||||||
|
var percent = (ui.position.left) * 100 / (self._getGrayTrackLength()); |
||||||
|
var significantPercent = BI.parseFloat(percent.toFixed(1));//直接对计算出来的百分数保留到小数点后一位,相当于分成了1000份。
|
||||||
|
self._setBlueTrack(significantPercent); |
||||||
|
var v = self._getValueByPercent(significantPercent); |
||||||
|
self.value = v; |
||||||
|
self.fireEvent(BI.SingleSliderNormal.EVENT_DRAG, v); |
||||||
|
}, |
||||||
|
stop: function (e, ui) { |
||||||
|
var percent = (ui.position.left) * 100 / (self._getGrayTrackLength()); |
||||||
|
var significantPercent = BI.parseFloat(percent.toFixed(1)); |
||||||
|
self._setSliderPosition(significantPercent); |
||||||
|
self.fireEvent(BI.SingleSlider.EVENT_CHANGE); |
||||||
|
} |
||||||
|
}); |
||||||
|
|
||||||
|
var sliderVertical = BI.createWidget({ |
||||||
|
type: "bi.vertical", |
||||||
|
items: [{ |
||||||
|
type: "bi.absolute", |
||||||
|
items: [this.slider] |
||||||
|
}], |
||||||
|
hgap: c.SLIDER_WIDTH_HALF, |
||||||
|
height: c.SLIDER_HEIGHT |
||||||
|
}); |
||||||
|
sliderVertical.element.click(function (e) { |
||||||
|
if (self.enable) { |
||||||
|
var offset = e.clientX - self.element.offset().left - c.SLIDER_WIDTH_HALF; |
||||||
|
var trackLength = self.track.element[0].scrollWidth; |
||||||
|
var percent = 0; |
||||||
|
if (offset < 0) { |
||||||
|
percent = 0 |
||||||
|
} |
||||||
|
if (offset > 0 && offset < (trackLength - c.SLIDER_WIDTH)) { |
||||||
|
percent = offset * 100 / self._getGrayTrackLength(); |
||||||
|
} |
||||||
|
if (offset > (trackLength - c.SLIDER_WIDTH)) { |
||||||
|
percent = 100 |
||||||
|
} |
||||||
|
var significantPercent = BI.parseFloat(percent.toFixed(1)); |
||||||
|
self._setAllPosition(significantPercent); |
||||||
|
var v = self._getValueByPercent(significantPercent); |
||||||
|
self.value = v; |
||||||
|
self.fireEvent(BI.SingleSlider.EVENT_CHANGE); |
||||||
|
} |
||||||
|
}); |
||||||
|
|
||||||
|
return { |
||||||
|
type: "bi.absolute", |
||||||
|
element: this, |
||||||
|
items: [{ |
||||||
|
el: { |
||||||
|
type: "bi.vertical", |
||||||
|
items: [{ |
||||||
|
type: "bi.absolute", |
||||||
|
items: [{ |
||||||
|
el: track, |
||||||
|
width: "100%", |
||||||
|
height: c.TRACK_HEIGHT |
||||||
|
}] |
||||||
|
}], |
||||||
|
hgap: 7, |
||||||
|
height: c.TRACK_HEIGHT |
||||||
|
}, |
||||||
|
top: 3, |
||||||
|
left: 0, |
||||||
|
width: "100%" |
||||||
|
}, { |
||||||
|
el: sliderVertical, |
||||||
|
top: 0, |
||||||
|
left: 0, |
||||||
|
width: "100%" |
||||||
|
}] |
||||||
|
} |
||||||
|
}, |
||||||
|
|
||||||
|
_createTrack: function () { |
||||||
|
var self = this; |
||||||
|
var c = this._constant; |
||||||
|
this.grayTrack = BI.createWidget({ |
||||||
|
type: "bi.layout", |
||||||
|
cls: "gray-track", |
||||||
|
height: 6 |
||||||
|
}); |
||||||
|
this.blueTrack = BI.createWidget({ |
||||||
|
type: "bi.layout", |
||||||
|
cls: "blue-track", |
||||||
|
height: 6 |
||||||
|
}); |
||||||
|
this.blueTrack.element.css({"background-color": this.options.color}); |
||||||
|
|
||||||
|
return { |
||||||
|
type: "bi.absolute", |
||||||
|
items: [{ |
||||||
|
el: { |
||||||
|
type: "bi.vertical", |
||||||
|
items: [{ |
||||||
|
type: "bi.absolute", |
||||||
|
items: [{ |
||||||
|
el: this.grayTrack, |
||||||
|
top: 0, |
||||||
|
left: 0, |
||||||
|
width: "100%" |
||||||
|
}, { |
||||||
|
el: this.blueTrack, |
||||||
|
top: 0, |
||||||
|
left: 0, |
||||||
|
width: "0%" |
||||||
|
}] |
||||||
|
}], |
||||||
|
hgap: 8, |
||||||
|
height: 8 |
||||||
|
}, |
||||||
|
top: 8, |
||||||
|
left: 0, |
||||||
|
width: "100%" |
||||||
|
}], |
||||||
|
ref: function (ref) { |
||||||
|
self.track = ref; |
||||||
|
} |
||||||
|
} |
||||||
|
}, |
||||||
|
|
||||||
|
_checkValidation: function (v) { |
||||||
|
return !(BI.isNull(v) || v < this.min || v > this.max) |
||||||
|
}, |
||||||
|
|
||||||
|
_setBlueTrack: function (percent) { |
||||||
|
this.blueTrack.element.css({"width": percent + "%"}); |
||||||
|
}, |
||||||
|
|
||||||
|
_setSliderPosition: function (percent) { |
||||||
|
this.slider.element.css({"left": percent + "%"}); |
||||||
|
}, |
||||||
|
|
||||||
|
_setAllPosition: function (percent) { |
||||||
|
this._setSliderPosition(percent); |
||||||
|
this._setBlueTrack(percent); |
||||||
|
}, |
||||||
|
|
||||||
|
_setVisible: function (visible) { |
||||||
|
this.slider.setVisible(visible); |
||||||
|
}, |
||||||
|
|
||||||
|
_getGrayTrackLength: function () { |
||||||
|
return this.grayTrack.element[0].scrollWidth |
||||||
|
}, |
||||||
|
|
||||||
|
_getValueByPercent: function (percent) { |
||||||
|
var thousandth = BI.parseInt(percent * 10); |
||||||
|
return (((this.max - this.min) * thousandth) / 1000 + this.min); |
||||||
|
}, |
||||||
|
|
||||||
|
_getPercentByValue: function (v) { |
||||||
|
return (v - this.min) * 100 / (this.max - this.min); |
||||||
|
}, |
||||||
|
|
||||||
|
getValue: function () { |
||||||
|
return this.value; |
||||||
|
}, |
||||||
|
|
||||||
|
setValue: function (v) { |
||||||
|
var value = BI.parseFloat(v); |
||||||
|
if ((!isNaN(value))) { |
||||||
|
if (this._checkValidation(value)) { |
||||||
|
this.value = value; |
||||||
|
} |
||||||
|
if (value > this.max) { |
||||||
|
this.value = this.max; |
||||||
|
} |
||||||
|
if (value < this.min) { |
||||||
|
this.value = this.min; |
||||||
|
} |
||||||
|
} |
||||||
|
}, |
||||||
|
|
||||||
|
setMinAndMax: function (v) { |
||||||
|
var minNumber = BI.parseFloat(v.min); |
||||||
|
var maxNumber = BI.parseFloat(v.max); |
||||||
|
if ((!isNaN(minNumber)) && (!isNaN(maxNumber)) && (maxNumber > minNumber )) { |
||||||
|
this.min = minNumber; |
||||||
|
this.max = maxNumber; |
||||||
|
} |
||||||
|
}, |
||||||
|
|
||||||
|
reset: function () { |
||||||
|
this._setVisible(false); |
||||||
|
this.enable = false; |
||||||
|
this.value = ""; |
||||||
|
this.min = 0; |
||||||
|
this.max = 0; |
||||||
|
this._setBlueTrack(0); |
||||||
|
}, |
||||||
|
|
||||||
|
populate: function () { |
||||||
|
if (!isNaN(this.min) && !isNaN(this.max)) { |
||||||
|
this._setVisible(true); |
||||||
|
this.enable = true; |
||||||
|
if (BI.isNumeric(this.value) || BI.isNotEmptyString(this.value)) { |
||||||
|
this._setAllPosition(this._getPercentByValue(this.value)); |
||||||
|
} else { |
||||||
|
this._setAllPosition(100); |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
}); |
||||||
|
BI.SingleSliderNormal.EVENT_DRAG = "EVENT_DRAG"; |
||||||
|
BI.shortcut("bi.single_slider_normal", BI.SingleSliderNormal); |
@ -0,0 +1,151 @@ |
|||||||
|
/** |
||||||
|
* 普通控件 |
||||||
|
* |
||||||
|
* @class BI.MultiDateCard |
||||||
|
* @extends BI.Widget |
||||||
|
* @abstract |
||||||
|
*/ |
||||||
|
BI.MultiDateCard = BI.inherit(BI.Widget, { |
||||||
|
|
||||||
|
constants: { |
||||||
|
lgap: 80, |
||||||
|
itemHeight: 35, |
||||||
|
defaultEditorValue: "1" |
||||||
|
}, |
||||||
|
|
||||||
|
_defaultConfig: function () { |
||||||
|
return $.extend(BI.MultiDateCard.superclass._defaultConfig.apply(this, arguments), {}); |
||||||
|
}, |
||||||
|
|
||||||
|
dateConfig: function () { |
||||||
|
|
||||||
|
}, |
||||||
|
|
||||||
|
defaultSelectedItem: function () { |
||||||
|
|
||||||
|
}, |
||||||
|
|
||||||
|
_init: function () { |
||||||
|
BI.MultiDateCard.superclass._init.apply(this, arguments); |
||||||
|
var self = this, opts = this.options; |
||||||
|
|
||||||
|
this.label = BI.createWidget({ |
||||||
|
type: 'bi.label', |
||||||
|
height: this.constants.itemHeight, |
||||||
|
textAlign: "left", |
||||||
|
text: BI.i18nText("BI-Multi_Date_Relative_Current_Time"), |
||||||
|
cls: 'bi-multidate-inner-label bi-tips' |
||||||
|
}); |
||||||
|
this.radioGroup = BI.createWidget({ |
||||||
|
type: "bi.button_group", |
||||||
|
chooseType: 0, |
||||||
|
items: BI.createItems(this.dateConfig(), { |
||||||
|
type: 'bi.multidate_segment', |
||||||
|
height: this.constants.itemHeight |
||||||
|
}), |
||||||
|
layouts: [{ |
||||||
|
type: "bi.vertical" |
||||||
|
}] |
||||||
|
}); |
||||||
|
|
||||||
|
this.radioGroup.on(BI.Controller.EVENT_CHANGE, function (type) { |
||||||
|
if (type === BI.Events.CONFIRM) { |
||||||
|
self.fireEvent(BI.MultiDateCard.EVENT_CHANGE); |
||||||
|
} |
||||||
|
}); |
||||||
|
this.radioGroup.on(BI.ButtonGroup.EVENT_CHANGE, function () { |
||||||
|
self.setValue(self.getValue()); |
||||||
|
self.fireEvent(BI.MultiDateCard.EVENT_CHANGE); |
||||||
|
}); |
||||||
|
BI.createWidget({ |
||||||
|
element: this, |
||||||
|
type: 'bi.center_adapt', |
||||||
|
lgap: this.constants.lgap, |
||||||
|
items: [{ |
||||||
|
type: 'bi.vertical', |
||||||
|
items: [this.label, this.radioGroup] |
||||||
|
}] |
||||||
|
}); |
||||||
|
}, |
||||||
|
|
||||||
|
getValue: function () { |
||||||
|
var button = this.radioGroup.getSelectedButtons()[0]; |
||||||
|
var type = button.getValue(), value = button.getInputValue(); |
||||||
|
return { |
||||||
|
type: type, |
||||||
|
value: value |
||||||
|
} |
||||||
|
}, |
||||||
|
|
||||||
|
_isTypeAvaliable: function (type) { |
||||||
|
var res = false; |
||||||
|
BI.find(this.dateConfig(), function (i, item) { |
||||||
|
if (item.value === type) { |
||||||
|
res = true; |
||||||
|
return true; |
||||||
|
} |
||||||
|
}); |
||||||
|
return res; |
||||||
|
}, |
||||||
|
|
||||||
|
setValue: function (v) { |
||||||
|
var self = this; |
||||||
|
if (BI.isNotNull(v) && this._isTypeAvaliable(v.type)) { |
||||||
|
this.radioGroup.setValue(v.type); |
||||||
|
BI.each(this.radioGroup.getAllButtons(), function (i, button) { |
||||||
|
if (button.isEditorExist() === true && button.isSelected()) { |
||||||
|
button.setInputValue(v.value); |
||||||
|
} else { |
||||||
|
button.setInputValue(self.constants.defaultEditorValue); |
||||||
|
} |
||||||
|
}); |
||||||
|
} else { |
||||||
|
this.radioGroup.setValue(this.defaultSelectedItem()); |
||||||
|
BI.each(this.radioGroup.getAllButtons(), function (i, button) { |
||||||
|
button.setInputValue(self.constants.defaultEditorValue); |
||||||
|
}); |
||||||
|
} |
||||||
|
}, |
||||||
|
|
||||||
|
getCalculationValue: function () { |
||||||
|
var valueObject = this.getValue(); |
||||||
|
var type = valueObject.type, value = valueObject.value; |
||||||
|
switch (type) { |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_DAY_PREV: |
||||||
|
return new Date().getOffsetDate(-1 * value); |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_DAY_AFTER: |
||||||
|
return new Date().getOffsetDate(value); |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_DAY_TODAY: |
||||||
|
return new Date(); |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_MONTH_PREV: |
||||||
|
return new Date().getBeforeMultiMonth(value); |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_MONTH_AFTER: |
||||||
|
return new Date().getAfterMultiMonth(value); |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_MONTH_BEGIN: |
||||||
|
return new Date(new Date().getFullYear(), new Date().getMonth(), 1); |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_MONTH_END: |
||||||
|
return new Date(new Date().getFullYear(), new Date().getMonth(), (new Date().getLastDateOfMonth()).getDate()); |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_QUARTER_PREV: |
||||||
|
return new Date().getBeforeMulQuarter(value); |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_QUARTER_AFTER: |
||||||
|
return new Date().getAfterMulQuarter(value); |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_QUARTER_BEGIN: |
||||||
|
return new Date().getQuarterStartDate(); |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_QUARTER_END: |
||||||
|
return new Date().getQuarterEndDate(); |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_WEEK_PREV: |
||||||
|
return new Date().getOffsetDate(-7 * value); |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_WEEK_AFTER: |
||||||
|
return new Date().getOffsetDate(7 * value); |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_YEAR_PREV: |
||||||
|
return new Date((new Date().getFullYear() - 1 * value), new Date().getMonth(), new Date().getDate()); |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_YEAR_AFTER: |
||||||
|
return new Date((new Date().getFullYear() + 1 * value), new Date().getMonth(), new Date().getDate()); |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_YEAR_BEGIN: |
||||||
|
return new Date(new Date().getFullYear(), 0, 1); |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_YEAR_END: |
||||||
|
return new Date(new Date().getFullYear(), 11, 31); |
||||||
|
} |
||||||
|
} |
||||||
|
}); |
||||||
|
BI.MultiDateCard.EVENT_CHANGE = "EVENT_CHANGE"; |
@ -0,0 +1,247 @@ |
|||||||
|
/** |
||||||
|
* 日期控件 |
||||||
|
* @class BI.MultiDateCombo |
||||||
|
* @extends BI.Widget |
||||||
|
*/ |
||||||
|
BI.MultiDateCombo = BI.inherit(BI.Single, { |
||||||
|
constants: { |
||||||
|
popupHeight: 259, |
||||||
|
popupWidth: 270, |
||||||
|
comboAdjustHeight: 1, |
||||||
|
border: 1, |
||||||
|
DATE_MIN_VALUE: "1900-01-01", |
||||||
|
DATE_MAX_VALUE: "2099-12-31" |
||||||
|
}, |
||||||
|
_defaultConfig: function () { |
||||||
|
return BI.extend(BI.MultiDateCombo.superclass._defaultConfig.apply(this, arguments), { |
||||||
|
baseCls: 'bi-multidate-combo bi-border', |
||||||
|
height: 24 |
||||||
|
}); |
||||||
|
}, |
||||||
|
_init: function () { |
||||||
|
BI.MultiDateCombo.superclass._init.apply(this, arguments); |
||||||
|
var self = this, opts = this.options; |
||||||
|
this.storeTriggerValue = ""; |
||||||
|
var date = new Date(); |
||||||
|
this.storeValue = null; |
||||||
|
this.trigger = BI.createWidget({ |
||||||
|
type: 'bi.date_trigger', |
||||||
|
min: this.constants.DATE_MIN_VALUE, |
||||||
|
max: this.constants.DATE_MAX_VALUE |
||||||
|
}); |
||||||
|
this.trigger.on(BI.DateTrigger.EVENT_KEY_DOWN, function () { |
||||||
|
if (self.combo.isViewVisible()) { |
||||||
|
self.combo.hideView(); |
||||||
|
} |
||||||
|
}); |
||||||
|
this.trigger.on(BI.DateTrigger.EVENT_STOP, function () { |
||||||
|
if (!self.combo.isViewVisible()) { |
||||||
|
self.combo.showView(); |
||||||
|
} |
||||||
|
}); |
||||||
|
this.trigger.on(BI.DateTrigger.EVENT_TRIGGER_CLICK, function () { |
||||||
|
self.combo.toggle(); |
||||||
|
}); |
||||||
|
this.trigger.on(BI.DateTrigger.EVENT_FOCUS, function () { |
||||||
|
self.storeTriggerValue = self.trigger.getKey(); |
||||||
|
if (!self.combo.isViewVisible()) { |
||||||
|
self.combo.showView(); |
||||||
|
} |
||||||
|
self.fireEvent(BI.MultiDateCombo.EVENT_FOCUS); |
||||||
|
}); |
||||||
|
this.trigger.on(BI.DateTrigger.EVENT_ERROR, function () { |
||||||
|
self.storeValue = { |
||||||
|
year: date.getFullYear(), |
||||||
|
month: date.getMonth() |
||||||
|
}; |
||||||
|
self.popup.setValue(); |
||||||
|
self.fireEvent(BI.MultiDateCombo.EVENT_ERROR); |
||||||
|
}); |
||||||
|
this.trigger.on(BI.DateTrigger.EVENT_VALID, function () { |
||||||
|
self.fireEvent(BI.MultiDateCombo.EVENT_VALID); |
||||||
|
}); |
||||||
|
this.trigger.on(BI.DateTrigger.EVENT_CHANGE, function () { |
||||||
|
self.fireEvent(BI.MultiDateCombo.EVENT_CHANGE); |
||||||
|
}); |
||||||
|
this.trigger.on(BI.DateTrigger.EVENT_CONFIRM, function () { |
||||||
|
if (self.combo.isViewVisible()) { |
||||||
|
return; |
||||||
|
} |
||||||
|
var dateStore = self.storeTriggerValue; |
||||||
|
var dateObj = self.trigger.getKey(); |
||||||
|
if (BI.isNotEmptyString(dateObj) && !BI.isEqual(dateObj, dateStore)) { |
||||||
|
self.storeValue = self.trigger.getValue(); |
||||||
|
self.setValue(self.trigger.getValue()); |
||||||
|
} else if (BI.isEmptyString(dateObj)) { |
||||||
|
self.storeValue = null; |
||||||
|
self.trigger.setValue(); |
||||||
|
} |
||||||
|
self.fireEvent(BI.MultiDateCombo.EVENT_CONFIRM); |
||||||
|
}); |
||||||
|
this.popup = BI.createWidget({ |
||||||
|
type: "bi.multidate_popup", |
||||||
|
min: this.constants.DATE_MIN_VALUE, |
||||||
|
max: this.constants.DATE_MAX_VALUE |
||||||
|
}); |
||||||
|
this.popup.on(BI.MultiDatePopup.BUTTON_CLEAR_EVENT_CHANGE, function () { |
||||||
|
self.setValue(); |
||||||
|
self.combo.hideView(); |
||||||
|
self.fireEvent(BI.MultiDateCombo.EVENT_CONFIRM); |
||||||
|
}); |
||||||
|
this.popup.on(BI.MultiDatePopup.BUTTON_lABEL_EVENT_CHANGE, function () { |
||||||
|
var date = new Date(); |
||||||
|
self.setValue({ |
||||||
|
year: date.getFullYear(), |
||||||
|
month: date.getMonth(), |
||||||
|
day: date.getDate() |
||||||
|
}); |
||||||
|
self.combo.hideView(); |
||||||
|
self.fireEvent(BI.MultiDateCombo.EVENT_CONFIRM); |
||||||
|
}); |
||||||
|
this.popup.on(BI.MultiDatePopup.BUTTON_OK_EVENT_CHANGE, function () { |
||||||
|
self.setValue(self.popup.getValue()); |
||||||
|
self.combo.hideView(); |
||||||
|
self.fireEvent(BI.MultiDateCombo.EVENT_CONFIRM); |
||||||
|
}); |
||||||
|
this.popup.on(BI.MultiDatePopup.CALENDAR_EVENT_CHANGE, function () { |
||||||
|
self.setValue(self.popup.getValue()); |
||||||
|
self.combo.hideView(); |
||||||
|
//self.fireEvent(BI.MultiDateCombo.EVENT_CHANGE);
|
||||||
|
self.fireEvent(BI.MultiDateCombo.EVENT_CONFIRM); |
||||||
|
}); |
||||||
|
this.combo = BI.createWidget({ |
||||||
|
type: 'bi.combo', |
||||||
|
toggle: false, |
||||||
|
isNeedAdjustHeight: false, |
||||||
|
isNeedAdjustWidth: false, |
||||||
|
el: this.trigger, |
||||||
|
adjustLength: this.constants.comboAdjustHeight, |
||||||
|
popup: { |
||||||
|
el: this.popup, |
||||||
|
maxHeight: this.constants.popupHeight, |
||||||
|
width: this.constants.popupWidth, |
||||||
|
stopPropagation: false |
||||||
|
} |
||||||
|
}); |
||||||
|
this.combo.on(BI.Combo.EVENT_BEFORE_POPUPVIEW, function () { |
||||||
|
self.popup.setValue(self.storeValue); |
||||||
|
self.fireEvent(BI.MultiDateCombo.EVENT_BEFORE_POPUPVIEW); |
||||||
|
}); |
||||||
|
|
||||||
|
var triggerBtn = BI.createWidget({ |
||||||
|
type: "bi.trigger_icon_button", |
||||||
|
cls: "bi-trigger-date-button chart-date-normal-font", |
||||||
|
width: 30, |
||||||
|
height: 23 |
||||||
|
}); |
||||||
|
triggerBtn.on(BI.TriggerIconButton.EVENT_CHANGE, function () { |
||||||
|
if (self.combo.isViewVisible()) { |
||||||
|
self.combo.hideView(); |
||||||
|
} else { |
||||||
|
self.combo.showView(); |
||||||
|
} |
||||||
|
}); |
||||||
|
this.changeIcon = BI.createWidget({ |
||||||
|
type: "bi.icon_button", |
||||||
|
cls: "bi-trigger-date-change widget-date-h-change-font", |
||||||
|
width: 30, |
||||||
|
height: 23 |
||||||
|
}); |
||||||
|
|
||||||
|
|
||||||
|
var leftPart = BI.createWidget({ |
||||||
|
type: "bi.absolute", |
||||||
|
items: [{ |
||||||
|
el: this.combo, |
||||||
|
top: 0, |
||||||
|
left: 0, |
||||||
|
right: 0, |
||||||
|
bottom: 0 |
||||||
|
}, { |
||||||
|
el: triggerBtn, |
||||||
|
top: 0, |
||||||
|
left: 0 |
||||||
|
}] |
||||||
|
}); |
||||||
|
|
||||||
|
BI.createWidget({ |
||||||
|
type: "bi.htape", |
||||||
|
element: this, |
||||||
|
items: [leftPart, { |
||||||
|
el: this.changeIcon, |
||||||
|
width: 30 |
||||||
|
}], |
||||||
|
ref: function (_ref) { |
||||||
|
self.comboWrapper = _ref; |
||||||
|
} |
||||||
|
}) |
||||||
|
}, |
||||||
|
|
||||||
|
_checkDynamicValue: function (v) { |
||||||
|
var type = null; |
||||||
|
if (BI.isNotNull(v)) { |
||||||
|
type = v.type |
||||||
|
} |
||||||
|
switch (type) { |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_YEAR_PREV: |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_YEAR_AFTER: |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_YEAR_BEGIN: |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_YEAR_END: |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_QUARTER_PREV: |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_QUARTER_AFTER: |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_QUARTER_BEGIN: |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_QUARTER_END: |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_MONTH_PREV: |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_MONTH_AFTER: |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_MONTH_BEGIN: |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_MONTH_END: |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_WEEK_PREV: |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_WEEK_AFTER: |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_DAY_PREV: |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_DAY_AFTER: |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_DAY_TODAY: |
||||||
|
this.changeIcon.setVisible(true); |
||||||
|
this.comboWrapper.attr("items")[1].width = 30; |
||||||
|
this.comboWrapper.resize(); |
||||||
|
break; |
||||||
|
default: |
||||||
|
this.comboWrapper.attr("items")[1].width = 0; |
||||||
|
this.comboWrapper.resize(); |
||||||
|
this.changeIcon.setVisible(false); |
||||||
|
break; |
||||||
|
} |
||||||
|
}, |
||||||
|
|
||||||
|
setValue: function (v) { |
||||||
|
this.storeValue = v; |
||||||
|
this.popup.setValue(v); |
||||||
|
this.trigger.setValue(v); |
||||||
|
this._checkDynamicValue(v) |
||||||
|
}, |
||||||
|
getValue: function () { |
||||||
|
return this.storeValue; |
||||||
|
}, |
||||||
|
getKey: function () { |
||||||
|
return this.trigger.getKey(); |
||||||
|
}, |
||||||
|
hidePopupView: function () { |
||||||
|
this.combo.hideView(); |
||||||
|
} |
||||||
|
}); |
||||||
|
BI.shortcut('bi.multidate_combo', BI.MultiDateCombo); |
||||||
|
|
||||||
|
BI.MultiDateCombo.EVENT_CONFIRM = "EVENT_CONFIRM"; |
||||||
|
BI.MultiDateCombo.EVENT_FOCUS = "EVENT_FOCUS"; |
||||||
|
BI.MultiDateCombo.EVENT_CHANGE = "EVENT_CHANGE"; |
||||||
|
BI.MultiDateCombo.EVENT_VALID = "EVENT_VALID"; |
||||||
|
BI.MultiDateCombo.EVENT_ERROR = "EVENT_ERROR"; |
||||||
|
BI.MultiDateCombo.EVENT_BEFORE_POPUPVIEW = "BI.MultiDateCombo.EVENT_BEFORE_POPUPVIEW"; |
||||||
|
|
||||||
|
BI.extend(BI.MultiDateCombo, { |
||||||
|
MULTI_DATE_YMD_CARD: 1, |
||||||
|
MULTI_DATE_YEAR_CARD: 2, |
||||||
|
MULTI_DATE_QUARTER_CARD: 3, |
||||||
|
MULTI_DATE_MONTH_CARD: 4, |
||||||
|
MULTI_DATE_WEEK_CARD: 5, |
||||||
|
MULTI_DATE_DAY_CARD: 6 |
||||||
|
}); |
@ -0,0 +1,43 @@ |
|||||||
|
/** |
||||||
|
* 普通控件 |
||||||
|
* |
||||||
|
* @class BI.DayCard |
||||||
|
* @extends BI.MultiDateCard |
||||||
|
*/ |
||||||
|
BI.DayCard = BI.inherit(BI.MultiDateCard, { |
||||||
|
|
||||||
|
_defaultConfig: function () { |
||||||
|
return $.extend(BI.DayCard.superclass._defaultConfig.apply(this, arguments), { |
||||||
|
baseCls: 'bi-multidate-daycard' |
||||||
|
}); |
||||||
|
}, |
||||||
|
|
||||||
|
_init: function () { |
||||||
|
BI.DayCard.superclass._init.apply(this, arguments); |
||||||
|
}, |
||||||
|
|
||||||
|
dateConfig: function () { |
||||||
|
return [{ |
||||||
|
isEditorExist: true, |
||||||
|
selected: true, |
||||||
|
text: BI.i18nText("BI-Multi_Date_Day_Prev"), |
||||||
|
value: BICst.DATE_TYPE.MULTI_DATE_DAY_PREV |
||||||
|
}, |
||||||
|
{ |
||||||
|
isEditorExist: true, |
||||||
|
text: BI.i18nText("BI-Multi_Date_Day_Next"), |
||||||
|
value: BICst.DATE_TYPE.MULTI_DATE_DAY_AFTER |
||||||
|
}, |
||||||
|
{ |
||||||
|
isEditorExist: false, |
||||||
|
value: BICst.DATE_TYPE.MULTI_DATE_DAY_TODAY, |
||||||
|
text: BI.i18nText("BI-Multi_Date_Today") |
||||||
|
}]; |
||||||
|
}, |
||||||
|
|
||||||
|
defaultSelectedItem: function () { |
||||||
|
return BICst.DATE_TYPE.MULTI_DATE_DAY_PREV |
||||||
|
} |
||||||
|
}); |
||||||
|
BI.DayCard.EVENT_CHANGE = "EVENT_CHANGE"; |
||||||
|
BI.shortcut('bi.daycard', BI.DayCard); |
@ -0,0 +1,47 @@ |
|||||||
|
/** |
||||||
|
* 普通控件 |
||||||
|
* |
||||||
|
* @class BI.MonthCard |
||||||
|
* @extends BI.MultiDateCard |
||||||
|
*/ |
||||||
|
BI.MonthCard = BI.inherit(BI.MultiDateCard, { |
||||||
|
_defaultConfig: function () { |
||||||
|
return $.extend(BI.MonthCard.superclass._defaultConfig.apply(this, arguments), { |
||||||
|
baseCls: 'bi-multidate-monthcard' |
||||||
|
}); |
||||||
|
}, |
||||||
|
|
||||||
|
_init: function () { |
||||||
|
BI.MonthCard.superclass._init.apply(this, arguments); |
||||||
|
}, |
||||||
|
|
||||||
|
dateConfig: function () { |
||||||
|
return [{ |
||||||
|
selected: true, |
||||||
|
isEditorExist: true, |
||||||
|
value: BICst.DATE_TYPE.MULTI_DATE_MONTH_PREV, |
||||||
|
text: BI.i18nText("BI-Multi_Date_Month_Prev") |
||||||
|
}, |
||||||
|
{ |
||||||
|
isEditorExist: true, |
||||||
|
value: BICst.DATE_TYPE.MULTI_DATE_MONTH_AFTER, |
||||||
|
text: BI.i18nText("BI-Multi_Date_Month_Next") |
||||||
|
}, |
||||||
|
{ |
||||||
|
value: BICst.DATE_TYPE.MULTI_DATE_MONTH_BEGIN, |
||||||
|
isEditorExist: false, |
||||||
|
text: BI.i18nText("BI-Multi_Date_Month_Begin") |
||||||
|
}, |
||||||
|
{ |
||||||
|
value: BICst.DATE_TYPE.MULTI_DATE_MONTH_END, |
||||||
|
isEditorExist: false, |
||||||
|
text: BI.i18nText("BI-Multi_Date_Month_End") |
||||||
|
}]; |
||||||
|
}, |
||||||
|
|
||||||
|
defaultSelectedItem: function () { |
||||||
|
return BICst.DATE_TYPE.MULTI_DATE_MONTH_PREV; |
||||||
|
} |
||||||
|
}); |
||||||
|
BI.MonthCard.EVENT_CHANGE = "EVENT_CHANGE"; |
||||||
|
BI.shortcut('bi.monthcard', BI.MonthCard); |
@ -0,0 +1,312 @@ |
|||||||
|
/** |
||||||
|
* 日期控件 |
||||||
|
* @class BI.MultiDatePopup |
||||||
|
* @extends BI.Widget |
||||||
|
*/ |
||||||
|
BI.MultiDatePopup = BI.inherit(BI.Widget, { |
||||||
|
constants: { |
||||||
|
tabHeight: 30, |
||||||
|
tabWidth: 42, |
||||||
|
titleHeight: 27, |
||||||
|
itemHeight: 30, |
||||||
|
triggerHeight: 24, |
||||||
|
buttonWidth: 90, |
||||||
|
buttonHeight: 25, |
||||||
|
cardHeight: 229, |
||||||
|
cardWidth: 270, |
||||||
|
popupHeight: 259, |
||||||
|
popupWidth: 270, |
||||||
|
comboAdjustHeight: 1, |
||||||
|
ymdWidth: 58, |
||||||
|
lgap: 2, |
||||||
|
border: 1 |
||||||
|
}, |
||||||
|
_defaultConfig: function () { |
||||||
|
return BI.extend(BI.MultiDatePopup.superclass._defaultConfig.apply(this, arguments), { |
||||||
|
baseCls: 'bi-multidate-popup', |
||||||
|
width: 268, |
||||||
|
height: 260 |
||||||
|
}); |
||||||
|
}, |
||||||
|
_init: function () { |
||||||
|
BI.MultiDatePopup.superclass._init.apply(this, arguments); |
||||||
|
var self = this, opts = this.options; |
||||||
|
this.storeValue = ""; |
||||||
|
this.textButton = BI.createWidget({ |
||||||
|
type: 'bi.text_button', |
||||||
|
forceCenter: true, |
||||||
|
cls: 'bi-multidate-popup-label bi-border-left bi-border-right bi-border-top', |
||||||
|
shadow: true, |
||||||
|
text: BI.i18nText("BI-Multi_Date_Today") |
||||||
|
}); |
||||||
|
this.textButton.on(BI.TextButton.EVENT_CHANGE, function () { |
||||||
|
self.fireEvent(BI.MultiDatePopup.BUTTON_lABEL_EVENT_CHANGE); |
||||||
|
}); |
||||||
|
this.clearButton = BI.createWidget({ |
||||||
|
type: "bi.text_button", |
||||||
|
forceCenter: true, |
||||||
|
cls: 'bi-multidate-popup-button bi-border-top', |
||||||
|
shadow: true, |
||||||
|
text: BI.i18nText("BI-Basic_Clear") |
||||||
|
}); |
||||||
|
this.clearButton.on(BI.TextButton.EVENT_CHANGE, function () { |
||||||
|
self.fireEvent(BI.MultiDatePopup.BUTTON_CLEAR_EVENT_CHANGE); |
||||||
|
}); |
||||||
|
this.okButton = BI.createWidget({ |
||||||
|
type: "bi.text_button", |
||||||
|
forceCenter: true, |
||||||
|
cls: 'bi-multidate-popup-button bi-border-top', |
||||||
|
shadow: true, |
||||||
|
text: BI.i18nText("BI-Basic_OK") |
||||||
|
}); |
||||||
|
this.okButton.on(BI.TextButton.EVENT_CHANGE, function () { |
||||||
|
self.fireEvent(BI.MultiDatePopup.BUTTON_OK_EVENT_CHANGE); |
||||||
|
}); |
||||||
|
this.dateTab = BI.createWidget({ |
||||||
|
type: 'bi.tab', |
||||||
|
tab: { |
||||||
|
cls: "bi-multidate-popup-tab bi-border-bottom", |
||||||
|
height: this.constants.tabHeight, |
||||||
|
items: BI.createItems([{ |
||||||
|
text: BI.i18nText("BI-Multi_Date_YMD"), |
||||||
|
value: BI.MultiDateCombo.MULTI_DATE_YMD_CARD, |
||||||
|
width: this.constants.ymdWidth |
||||||
|
}, { |
||||||
|
text: BI.i18nText("BI-Multi_Date_Year"), |
||||||
|
value: BI.MultiDateCombo.MULTI_DATE_YEAR_CARD |
||||||
|
}, { |
||||||
|
text: BI.i18nText("BI-Multi_Date_Quarter"), |
||||||
|
value: BI.MultiDateCombo.MULTI_DATE_QUARTER_CARD |
||||||
|
}, { |
||||||
|
text: BI.i18nText("BI-Multi_Date_Month"), |
||||||
|
value: BI.MultiDateCombo.MULTI_DATE_MONTH_CARD |
||||||
|
}, { |
||||||
|
text: BI.i18nText("BI-Multi_Date_Week"), |
||||||
|
value: BI.MultiDateCombo.MULTI_DATE_WEEK_CARD |
||||||
|
}, { |
||||||
|
text: BI.i18nText("BI-Multi_Date_Day"), |
||||||
|
value: BI.MultiDateCombo.MULTI_DATE_DAY_CARD |
||||||
|
}], { |
||||||
|
width: this.constants.tabWidth, |
||||||
|
textAlign: "center", |
||||||
|
height: this.constants.itemHeight, |
||||||
|
cls: 'bi-multidate-popup-item bi-list-item-active' |
||||||
|
}), |
||||||
|
layouts: [{ |
||||||
|
type: 'bi.left' |
||||||
|
}] |
||||||
|
}, |
||||||
|
cardCreator: function (v) { |
||||||
|
switch (v) { |
||||||
|
case BI.MultiDateCombo.MULTI_DATE_YMD_CARD: |
||||||
|
self.ymd = BI.createWidget({ |
||||||
|
type: "bi.date_calendar_popup", |
||||||
|
min: self.options.min, |
||||||
|
max: self.options.max |
||||||
|
}); |
||||||
|
self.ymd.on(BI.DateCalendarPopup.EVENT_CHANGE, function () { |
||||||
|
self.fireEvent(BI.MultiDatePopup.CALENDAR_EVENT_CHANGE); |
||||||
|
}); |
||||||
|
return self.ymd; |
||||||
|
case BI.MultiDateCombo.MULTI_DATE_YEAR_CARD: |
||||||
|
self.year = BI.createWidget({ |
||||||
|
type: "bi.yearcard" |
||||||
|
}); |
||||||
|
self.year.on(BI.MultiDateCard.EVENT_CHANGE, function (v) { |
||||||
|
self._setInnerValue(self.year, v); |
||||||
|
}); |
||||||
|
return self.year; |
||||||
|
case BI.MultiDateCombo.MULTI_DATE_QUARTER_CARD: |
||||||
|
self.quarter = BI.createWidget({ |
||||||
|
type: 'bi.quartercard' |
||||||
|
}); |
||||||
|
self.quarter.on(BI.MultiDateCard.EVENT_CHANGE, function (v) { |
||||||
|
self._setInnerValue(self.quarter, v); |
||||||
|
}); |
||||||
|
return self.quarter; |
||||||
|
case BI.MultiDateCombo.MULTI_DATE_MONTH_CARD: |
||||||
|
self.month = BI.createWidget({ |
||||||
|
type: 'bi.monthcard' |
||||||
|
}); |
||||||
|
self.month.on(BI.MultiDateCard.EVENT_CHANGE, function (v) { |
||||||
|
self._setInnerValue(self.month, v); |
||||||
|
}); |
||||||
|
return self.month; |
||||||
|
case BI.MultiDateCombo.MULTI_DATE_WEEK_CARD: |
||||||
|
self.week = BI.createWidget({ |
||||||
|
type: 'bi.weekcard' |
||||||
|
}); |
||||||
|
self.week.on(BI.MultiDateCard.EVENT_CHANGE, function (v) { |
||||||
|
self._setInnerValue(self.week, v); |
||||||
|
}); |
||||||
|
return self.week; |
||||||
|
case BI.MultiDateCombo.MULTI_DATE_DAY_CARD: |
||||||
|
self.day = BI.createWidget({ |
||||||
|
type: 'bi.daycard' |
||||||
|
}); |
||||||
|
self.day.on(BI.MultiDateCard.EVENT_CHANGE, function (v) { |
||||||
|
self._setInnerValue(self.day, v); |
||||||
|
}); |
||||||
|
return self.day; |
||||||
|
} |
||||||
|
} |
||||||
|
}); |
||||||
|
this.dateTab.setSelect(BI.MultiDateCombo.MULTI_DATE_YMD_CARD); |
||||||
|
this.cur = BI.MultiDateCombo.MULTI_DATE_YMD_CARD; |
||||||
|
this.dateTab.on(BI.Tab.EVENT_CHANGE, function () { |
||||||
|
var v = self.dateTab.getSelect(); |
||||||
|
switch (v) { |
||||||
|
case BI.MultiDateCombo.MULTI_DATE_YMD_CARD: |
||||||
|
var date = this.getTab(self.cur).getCalculationValue(); |
||||||
|
self.ymd.setValue({ |
||||||
|
year: date.getFullYear(), |
||||||
|
month: date.getMonth(), |
||||||
|
day: date.getDate() |
||||||
|
}); |
||||||
|
self._setInnerValue(self.ymd); |
||||||
|
break; |
||||||
|
case BI.MultiDateCombo.MULTI_DATE_YEAR_CARD: |
||||||
|
self.year.setValue(self.storeValue); |
||||||
|
self._setInnerValue(self.year); |
||||||
|
break; |
||||||
|
case BI.MultiDateCombo.MULTI_DATE_QUARTER_CARD: |
||||||
|
self.quarter.setValue(self.storeValue); |
||||||
|
self._setInnerValue(self.quarter); |
||||||
|
break; |
||||||
|
case BI.MultiDateCombo.MULTI_DATE_MONTH_CARD: |
||||||
|
self.month.setValue(self.storeValue); |
||||||
|
self._setInnerValue(self.month); |
||||||
|
break; |
||||||
|
case BI.MultiDateCombo.MULTI_DATE_WEEK_CARD: |
||||||
|
self.week.setValue(self.storeValue); |
||||||
|
self._setInnerValue(self.week); |
||||||
|
break; |
||||||
|
case BI.MultiDateCombo.MULTI_DATE_DAY_CARD: |
||||||
|
self.day.setValue(self.storeValue); |
||||||
|
self._setInnerValue(self.day); |
||||||
|
break; |
||||||
|
} |
||||||
|
self.cur = v; |
||||||
|
}); |
||||||
|
this.dateButton = BI.createWidget({ |
||||||
|
type: "bi.grid", |
||||||
|
items: [[this.clearButton, this.textButton, this.okButton]] |
||||||
|
}); |
||||||
|
BI.createWidget({ |
||||||
|
element: this, |
||||||
|
type: "bi.vtape", |
||||||
|
items: [{ |
||||||
|
el: this.dateTab |
||||||
|
}, { |
||||||
|
el: this.dateButton, |
||||||
|
height: 30 |
||||||
|
}] |
||||||
|
}); |
||||||
|
}, |
||||||
|
_setInnerValue: function (obj) { |
||||||
|
if (this.dateTab.getSelect() === BI.MultiDateCombo.MULTI_DATE_YMD_CARD) { |
||||||
|
this.textButton.setValue(BI.i18nText("BI-Multi_Date_Today")); |
||||||
|
this.textButton.setEnable(true); |
||||||
|
} else { |
||||||
|
var date = obj.getCalculationValue(); |
||||||
|
date = date.print("%Y-%x-%e"); |
||||||
|
this.textButton.setValue(date); |
||||||
|
this.textButton.setEnable(false); |
||||||
|
} |
||||||
|
}, |
||||||
|
setValue: function (v) { |
||||||
|
this.storeValue = v; |
||||||
|
var self = this, date; |
||||||
|
var type, value; |
||||||
|
if (BI.isNotNull(v)) { |
||||||
|
type = v.type || BICst.DATE_TYPE.MULTI_DATE_CALENDAR; |
||||||
|
value = v.value; |
||||||
|
if (BI.isNull(value)) { |
||||||
|
value = v; |
||||||
|
} |
||||||
|
} |
||||||
|
switch (type) { |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_YEAR_PREV: |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_YEAR_AFTER: |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_YEAR_BEGIN: |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_YEAR_END: |
||||||
|
this.dateTab.setSelect(BICst.MULTI_DATE_YEAR_CARD); |
||||||
|
this.year.setValue({type: type, value: value}); |
||||||
|
this.cur = BICst.MULTI_DATE_YEAR_CARD; |
||||||
|
self._setInnerValue(this.year); |
||||||
|
break; |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_QUARTER_PREV: |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_QUARTER_AFTER: |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_QUARTER_BEGIN: |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_QUARTER_END: |
||||||
|
this.dateTab.setSelect(BICst.MULTI_DATE_QUARTER_CARD); |
||||||
|
this.cur = BICst.MULTI_DATE_QUARTER_CARD; |
||||||
|
this.quarter.setValue({type: type, value: value}); |
||||||
|
self._setInnerValue(this.quarter); |
||||||
|
break; |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_MONTH_PREV: |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_MONTH_AFTER: |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_MONTH_BEGIN: |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_MONTH_END: |
||||||
|
this.dateTab.setSelect(BICst.MULTI_DATE_MONTH_CARD); |
||||||
|
this.cur = BICst.MULTI_DATE_MONTH_CARD; |
||||||
|
this.month.setValue({type: type, value: value}); |
||||||
|
self._setInnerValue(this.month); |
||||||
|
break; |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_WEEK_PREV: |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_WEEK_AFTER: |
||||||
|
this.dateTab.setSelect(BICst.MULTI_DATE_WEEK_CARD); |
||||||
|
this.cur = BICst.MULTI_DATE_WEEK_CARD; |
||||||
|
this.week.setValue({type: type, value: value}); |
||||||
|
self._setInnerValue(this.week); |
||||||
|
break; |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_DAY_PREV: |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_DAY_AFTER: |
||||||
|
case BICst.DATE_TYPE.MULTI_DATE_DAY_TODAY: |
||||||
|
this.dateTab.setSelect(BICst.MULTI_DATE_DAY_CARD); |
||||||
|
this.cur = BICst.MULTI_DATE_DAY_CARD; |
||||||
|
this.day.setValue({type: type, value: value}); |
||||||
|
self._setInnerValue(this.day); |
||||||
|
break; |
||||||
|
default: |
||||||
|
if (BI.isNull(value) || BI.isEmptyObject(value)) { |
||||||
|
var date = new Date(); |
||||||
|
this.dateTab.setSelect(BI.MultiDateCombo.MULTI_DATE_YMD_CARD); |
||||||
|
this.ymd.setValue({ |
||||||
|
year: date.getFullYear(), |
||||||
|
month: date.getMonth(), |
||||||
|
day: date.getDate() |
||||||
|
}); |
||||||
|
this.textButton.setValue(BI.i18nText("BI-Multi_Date_Today")); |
||||||
|
} else { |
||||||
|
this.dateTab.setSelect(BI.MultiDateCombo.MULTI_DATE_YMD_CARD); |
||||||
|
this.ymd.setValue(value); |
||||||
|
this.textButton.setValue(BI.i18nText("BI-Multi_Date_Today")); |
||||||
|
} |
||||||
|
this.textButton.setEnable(true); |
||||||
|
break; |
||||||
|
} |
||||||
|
}, |
||||||
|
getValue: function () { |
||||||
|
var tab = this.dateTab.getSelect(); |
||||||
|
switch (tab) { |
||||||
|
case BI.MultiDateCombo.MULTI_DATE_YMD_CARD: |
||||||
|
return this.ymd.getValue(); |
||||||
|
case BI.MultiDateCombo.MULTI_DATE_YEAR_CARD: |
||||||
|
return this.year.getValue(); |
||||||
|
case BI.MultiDateCombo.MULTI_DATE_QUARTER_CARD: |
||||||
|
return this.quarter.getValue(); |
||||||
|
case BI.MultiDateCombo.MULTI_DATE_MONTH_CARD: |
||||||
|
return this.month.getValue(); |
||||||
|
case BI.MultiDateCombo.MULTI_DATE_WEEK_CARD: |
||||||
|
return this.week.getValue(); |
||||||
|
case BI.MultiDateCombo.MULTI_DATE_DAY_CARD: |
||||||
|
return this.day.getValue(); |
||||||
|
} |
||||||
|
} |
||||||
|
}); |
||||||
|
BI.MultiDatePopup.BUTTON_OK_EVENT_CHANGE = "BUTTON_OK_EVENT_CHANGE"; |
||||||
|
BI.MultiDatePopup.BUTTON_lABEL_EVENT_CHANGE = "BUTTON_lABEL_EVENT_CHANGE"; |
||||||
|
BI.MultiDatePopup.BUTTON_CLEAR_EVENT_CHANGE = "BUTTON_CLEAR_EVENT_CHANGE"; |
||||||
|
BI.MultiDatePopup.CALENDAR_EVENT_CHANGE = "CALENDAR_EVENT_CHANGE"; |
||||||
|
BI.shortcut('bi.multidate_popup', BI.MultiDatePopup); |
@ -0,0 +1,48 @@ |
|||||||
|
/** |
||||||
|
* 普通控件 |
||||||
|
* |
||||||
|
* @class BI.QuarterCard |
||||||
|
* @extends BI.MultiDateCard |
||||||
|
*/ |
||||||
|
BI.QuarterCard = BI.inherit(BI.MultiDateCard, { |
||||||
|
|
||||||
|
_defaultConfig: function () { |
||||||
|
return $.extend(BI.QuarterCard.superclass._defaultConfig.apply(this, arguments), { |
||||||
|
baseCls: 'bi-multidate-quartercard' |
||||||
|
}); |
||||||
|
}, |
||||||
|
|
||||||
|
_init: function () { |
||||||
|
BI.QuarterCard.superclass._init.apply(this, arguments); |
||||||
|
}, |
||||||
|
|
||||||
|
dateConfig: function () { |
||||||
|
return [{ |
||||||
|
selected: true, |
||||||
|
value: BICst.DATE_TYPE.MULTI_DATE_QUARTER_PREV, |
||||||
|
isEditorExist: true, |
||||||
|
text: BI.i18nText("BI-Multi_Date_Quarter_Prev") |
||||||
|
}, |
||||||
|
{ |
||||||
|
value: BICst.DATE_TYPE.MULTI_DATE_QUARTER_AFTER, |
||||||
|
isEditorExist: true, |
||||||
|
text: BI.i18nText("BI-Multi_Date_Quarter_Next") |
||||||
|
}, |
||||||
|
{ |
||||||
|
value: BICst.DATE_TYPE.MULTI_DATE_QUARTER_BEGIN, |
||||||
|
isEditorExist: false, |
||||||
|
text: BI.i18nText("BI-Multi_Date_Quarter_Begin") |
||||||
|
}, |
||||||
|
{ |
||||||
|
value: BICst.DATE_TYPE.MULTI_DATE_QUARTER_END, |
||||||
|
isEditorExist: false, |
||||||
|
text: BI.i18nText("BI-Multi_Date_Quarter_End") |
||||||
|
}] |
||||||
|
}, |
||||||
|
|
||||||
|
defaultSelectedItem: function () { |
||||||
|
return BICst.DATE_TYPE.MULTI_DATE_QUARTER_PREV; |
||||||
|
} |
||||||
|
}); |
||||||
|
BI.QuarterCard.EVENT_CHANGE = "EVENT_CHANGE"; |
||||||
|
BI.shortcut('bi.quartercard', BI.QuarterCard); |
@ -0,0 +1,127 @@ |
|||||||
|
/** |
||||||
|
* 普通控件 |
||||||
|
* |
||||||
|
* @class BI.MultiDateSegment |
||||||
|
* @extends BI.Single |
||||||
|
*/ |
||||||
|
BI.MultiDateSegment = BI.inherit(BI.Single, { |
||||||
|
constants: { |
||||||
|
itemHeight: 24, |
||||||
|
maxGap: 15, |
||||||
|
minGap: 10, |
||||||
|
textWidth: 30, |
||||||
|
defaultEditorValue: "1" |
||||||
|
}, |
||||||
|
|
||||||
|
_defaultConfig: function () { |
||||||
|
return $.extend(BI.MultiDateSegment.superclass._defaultConfig.apply(this, arguments), { |
||||||
|
baseCls: 'bi-multidate-segment', |
||||||
|
text: "", |
||||||
|
width: 130, |
||||||
|
height: 30, |
||||||
|
isEditorExist: true, |
||||||
|
selected: false, |
||||||
|
defaultEditorValue: "1" |
||||||
|
}); |
||||||
|
}, |
||||||
|
|
||||||
|
_init: function () { |
||||||
|
BI.MultiDateSegment.superclass._init.apply(this, arguments); |
||||||
|
var self = this, opts = this.options; |
||||||
|
this.radio = BI.createWidget({ |
||||||
|
type: "bi.radio", |
||||||
|
selected: opts.selected |
||||||
|
}); |
||||||
|
this.radio.on(BI.Controller.EVENT_CHANGE, function (v) { |
||||||
|
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); |
||||||
|
}); |
||||||
|
this.textEditor = BI.createWidget({ |
||||||
|
type: 'bi.text_editor', |
||||||
|
value: this.constants.defaultEditorValue, |
||||||
|
title: function () { |
||||||
|
return self.textEditor.getValue(); |
||||||
|
}, |
||||||
|
cls: 'bi-multidate-editor', |
||||||
|
width: this.constants.textWidth, |
||||||
|
height: this.constants.itemHeight |
||||||
|
}); |
||||||
|
this.textEditor.on(BI.Controller.EVENT_CHANGE, function (v) { |
||||||
|
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); |
||||||
|
}); |
||||||
|
this.text = BI.createWidget({ |
||||||
|
type: "bi.label", |
||||||
|
textAlign: "left", |
||||||
|
cls: 'bi-multidate-normal-label', |
||||||
|
text: opts.text, |
||||||
|
height: this.constants.itemHeight |
||||||
|
}); |
||||||
|
this._createSegment(); |
||||||
|
}, |
||||||
|
_createSegment: function () { |
||||||
|
if (this.options.isEditorExist === true) { |
||||||
|
return BI.createWidget({ |
||||||
|
element: this, |
||||||
|
type: 'bi.left', |
||||||
|
items: [{ |
||||||
|
el: { |
||||||
|
type: "bi.center_adapt", |
||||||
|
items: [this.radio], |
||||||
|
height: this.constants.itemHeight |
||||||
|
}, |
||||||
|
lgap: 0 |
||||||
|
}, |
||||||
|
{ |
||||||
|
el: { |
||||||
|
type: "bi.center_adapt", |
||||||
|
items: [this.textEditor], |
||||||
|
widgetName: 'textEditor' |
||||||
|
}, |
||||||
|
lgap: this.constants.maxGap |
||||||
|
}, |
||||||
|
{ |
||||||
|
el: this.text, |
||||||
|
lgap: this.constants.minGap |
||||||
|
}] |
||||||
|
}); |
||||||
|
} |
||||||
|
return BI.createWidget({ |
||||||
|
element: this, |
||||||
|
type: 'bi.left', |
||||||
|
items: [{ |
||||||
|
el: { |
||||||
|
type: "bi.center_adapt", |
||||||
|
items: [this.radio], |
||||||
|
height: this.constants.itemHeight |
||||||
|
}, |
||||||
|
lgap: 0 |
||||||
|
}, |
||||||
|
{ |
||||||
|
el: this.text, |
||||||
|
lgap: this.constants.maxGap |
||||||
|
}] |
||||||
|
}) |
||||||
|
}, |
||||||
|
setSelected: function (v) { |
||||||
|
if (BI.isNotNull(this.radio)) { |
||||||
|
this.radio.setSelected(v); |
||||||
|
this.textEditor.setEnable(v); |
||||||
|
} |
||||||
|
}, |
||||||
|
isSelected: function () { |
||||||
|
return this.radio.isSelected(); |
||||||
|
}, |
||||||
|
getValue: function () { |
||||||
|
return this.options.value; |
||||||
|
}, |
||||||
|
getInputValue: function () { |
||||||
|
return this.textEditor.getValue() | 0; |
||||||
|
}, |
||||||
|
setInputValue: function (v) { |
||||||
|
this.textEditor.setValue(v); |
||||||
|
}, |
||||||
|
isEditorExist: function () { |
||||||
|
return this.options.isEditorExist; |
||||||
|
} |
||||||
|
}); |
||||||
|
BI.MultiDateSegment.EVENT_CHANGE = "EVENT_CHANGE"; |
||||||
|
BI.shortcut('bi.multidate_segment', BI.MultiDateSegment); |
@ -0,0 +1,37 @@ |
|||||||
|
/** |
||||||
|
* 普通控件 |
||||||
|
* |
||||||
|
* @class BI.WeekCard |
||||||
|
* @extends BI.MultiDateCard |
||||||
|
*/ |
||||||
|
BI.WeekCard = BI.inherit(BI.MultiDateCard, { |
||||||
|
_defaultConfig: function () { |
||||||
|
return $.extend(BI.WeekCard.superclass._defaultConfig.apply(this, arguments), { |
||||||
|
baseCls: 'bi-multidate-weekcard' |
||||||
|
}); |
||||||
|
}, |
||||||
|
|
||||||
|
_init: function () { |
||||||
|
BI.WeekCard.superclass._init.apply(this, arguments); |
||||||
|
}, |
||||||
|
|
||||||
|
dateConfig: function () { |
||||||
|
return [{ |
||||||
|
selected: true, |
||||||
|
isEditorExist: true, |
||||||
|
text: BI.i18nText("BI-Multi_Date_Week_Prev"), |
||||||
|
value: BICst.DATE_TYPE.MULTI_DATE_WEEK_PREV |
||||||
|
}, |
||||||
|
{ |
||||||
|
isEditorExist: true, |
||||||
|
text: BI.i18nText("BI-Multi_Date_Week_Next"), |
||||||
|
value: BICst.DATE_TYPE.MULTI_DATE_WEEK_AFTER |
||||||
|
}]; |
||||||
|
}, |
||||||
|
|
||||||
|
defaultSelectedItem: function () { |
||||||
|
return BICst.DATE_TYPE.MULTI_DATE_WEEK_PREV; |
||||||
|
} |
||||||
|
}); |
||||||
|
BI.WeekCard.EVENT_CHANGE = "EVENT_CHANGE"; |
||||||
|
BI.shortcut('bi.weekcard', BI.WeekCard); |
@ -0,0 +1,47 @@ |
|||||||
|
/** |
||||||
|
* 普通控件 |
||||||
|
* |
||||||
|
* @class BI.YearCard |
||||||
|
* @extends BI.MultiDateCard |
||||||
|
*/ |
||||||
|
BI.YearCard = BI.inherit(BI.MultiDateCard, { |
||||||
|
_defaultConfig: function () { |
||||||
|
return $.extend(BI.YearCard.superclass._defaultConfig.apply(this, arguments), { |
||||||
|
baseCls: 'bi-multidate-yearcard' |
||||||
|
}); |
||||||
|
}, |
||||||
|
|
||||||
|
_init: function () { |
||||||
|
BI.YearCard.superclass._init.apply(this, arguments); |
||||||
|
}, |
||||||
|
|
||||||
|
dateConfig: function () { |
||||||
|
return [{ |
||||||
|
selected: true, |
||||||
|
isEditorExist: true, |
||||||
|
text: BI.i18nText("BI-Multi_Date_Year_Prev"), |
||||||
|
value: BICst.DATE_TYPE.MULTI_DATE_YEAR_PREV |
||||||
|
}, |
||||||
|
{ |
||||||
|
isEditorExist: true, |
||||||
|
text: BI.i18nText("BI-Multi_Date_Year_Next"), |
||||||
|
value: BICst.DATE_TYPE.MULTI_DATE_YEAR_AFTER |
||||||
|
}, |
||||||
|
{ |
||||||
|
isEditorExist: false, |
||||||
|
value: BICst.DATE_TYPE.MULTI_DATE_YEAR_BEGIN, |
||||||
|
text: BI.i18nText("BI-Multi_Date_Year_Begin") |
||||||
|
}, |
||||||
|
{ |
||||||
|
isEditorExist: false, |
||||||
|
value: BICst.DATE_TYPE.MULTI_DATE_YEAR_END, |
||||||
|
text: BI.i18nText("BI-Multi_Date_Year_End") |
||||||
|
}] |
||||||
|
}, |
||||||
|
|
||||||
|
defaultSelectedItem: function () { |
||||||
|
return BICst.DATE_TYPE.MULTI_DATE_YEAR_PREV; |
||||||
|
} |
||||||
|
}); |
||||||
|
BI.YearCard.EVENT_CHANGE = "EVENT_CHANGE"; |
||||||
|
BI.shortcut('bi.yearcard', BI.YearCard); |
@ -0,0 +1,189 @@ |
|||||||
|
/** |
||||||
|
* Created by Baron on 2015/10/19. |
||||||
|
*/ |
||||||
|
BI.TimeInterval = BI.inherit(BI.Single, { |
||||||
|
constants: { |
||||||
|
height: 25, |
||||||
|
width: 25, |
||||||
|
lgap: 15, |
||||||
|
offset: -15, |
||||||
|
timeErrorCls: "time-error", |
||||||
|
DATE_MIN_VALUE: "1900-01-01", |
||||||
|
DATE_MAX_VALUE: "2099-12-31" |
||||||
|
}, |
||||||
|
_defaultConfig: function () { |
||||||
|
var conf = BI.TimeInterval.superclass._defaultConfig.apply(this, arguments); |
||||||
|
return BI.extend(conf, { |
||||||
|
extraCls: "bi-time-interval" |
||||||
|
}) |
||||||
|
}, |
||||||
|
_init: function () { |
||||||
|
var self = this; |
||||||
|
BI.TimeInterval.superclass._init.apply(this, arguments); |
||||||
|
|
||||||
|
this.left = this._createCombo(); |
||||||
|
this.right = this._createCombo(); |
||||||
|
this.label = BI.createWidget({ |
||||||
|
type: 'bi.label', |
||||||
|
height: this.constants.height, |
||||||
|
width: this.constants.width, |
||||||
|
text: "-" |
||||||
|
}); |
||||||
|
BI.createWidget({ |
||||||
|
element: self, |
||||||
|
type: "bi.center", |
||||||
|
hgap: 15, |
||||||
|
height: this.constants.height, |
||||||
|
items: [{ |
||||||
|
type: "bi.absolute", |
||||||
|
items: [{ |
||||||
|
el: self.left, |
||||||
|
left: this.constants.offset, |
||||||
|
right: 0, |
||||||
|
top: 0, |
||||||
|
bottom: 0 |
||||||
|
}] |
||||||
|
}, { |
||||||
|
type: "bi.absolute", |
||||||
|
items: [{ |
||||||
|
el: self.right, |
||||||
|
left: 0, |
||||||
|
right: this.constants.offset, |
||||||
|
top: 0, |
||||||
|
bottom: 0 |
||||||
|
}] |
||||||
|
}] |
||||||
|
}); |
||||||
|
BI.createWidget({ |
||||||
|
type: "bi.horizontal_auto", |
||||||
|
element: this, |
||||||
|
items: [ |
||||||
|
self.label |
||||||
|
] |
||||||
|
}); |
||||||
|
}, |
||||||
|
|
||||||
|
_createCombo: function () { |
||||||
|
var self = this; |
||||||
|
var combo = BI.createWidget({ |
||||||
|
type: 'bi.multidate_combo' |
||||||
|
}); |
||||||
|
combo.on(BI.MultiDateCombo.EVENT_ERROR, function () { |
||||||
|
self._clearTitle(); |
||||||
|
self.element.removeClass(self.constants.timeErrorCls); |
||||||
|
self.fireEvent(BI.TimeInterval.EVENT_ERROR); |
||||||
|
}); |
||||||
|
|
||||||
|
combo.on(BI.MultiDateCombo.EVENT_VALID, function(){ |
||||||
|
BI.Bubbles.hide("error"); |
||||||
|
var smallDate = self.left.getKey(), bigDate = self.right.getKey(); |
||||||
|
if (self._check(smallDate, bigDate) && self._compare(smallDate, bigDate)) { |
||||||
|
self._setTitle(BI.i18nText("BI-Time_Interval_Error_Text")); |
||||||
|
self.element.addClass(self.constants.timeErrorCls); |
||||||
|
BI.Bubbles.show("error", BI.i18nText("BI-Time_Interval_Error_Text"), self, { |
||||||
|
offsetStyle: "center" |
||||||
|
}); |
||||||
|
self.fireEvent(BI.TimeInterval.EVENT_ERROR); |
||||||
|
} else { |
||||||
|
self._clearTitle(); |
||||||
|
self.element.removeClass(self.constants.timeErrorCls); |
||||||
|
} |
||||||
|
}); |
||||||
|
|
||||||
|
combo.on(BI.MultiDateCombo.EVENT_FOCUS, function(){ |
||||||
|
BI.Bubbles.hide("error"); |
||||||
|
var smallDate = self.left.getKey(), bigDate = self.right.getKey(); |
||||||
|
if (self._check(smallDate, bigDate) && self._compare(smallDate, bigDate)) { |
||||||
|
self._setTitle(BI.i18nText("BI-Time_Interval_Error_Text")); |
||||||
|
self.element.addClass(self.constants.timeErrorCls); |
||||||
|
BI.Bubbles.show("error", BI.i18nText("BI-Time_Interval_Error_Text"), self, { |
||||||
|
offsetStyle: "center" |
||||||
|
}); |
||||||
|
self.fireEvent(BI.TimeInterval.EVENT_ERROR); |
||||||
|
} else { |
||||||
|
self._clearTitle(); |
||||||
|
self.element.removeClass(self.constants.timeErrorCls); |
||||||
|
} |
||||||
|
}); |
||||||
|
|
||||||
|
combo.on(BI.MultiDateCombo.EVENT_BEFORE_POPUPVIEW, function () { |
||||||
|
self.left.hidePopupView(); |
||||||
|
self.right.hidePopupView(); |
||||||
|
}); |
||||||
|
//combo.on(BI.MultiDateCombo.EVENT_CHANGE, function () {
|
||||||
|
// BI.Bubbles.hide("error");
|
||||||
|
// var smallDate = self.left.getKey(), bigDate = self.right.getKey();
|
||||||
|
// if (self._check(smallDate, bigDate) && self._compare(smallDate, bigDate)) {
|
||||||
|
// self._setTitle(BI.i18nText("BI-Time_Interval_Error_Text"));
|
||||||
|
// self.element.addClass(self.constants.timeErrorCls);
|
||||||
|
// BI.Bubbles.show("error", BI.i18nText("BI-Time_Interval_Error_Text"), self, {
|
||||||
|
// offsetStyle: "center"
|
||||||
|
// });
|
||||||
|
// self.fireEvent(BI.TimeInterval.EVENT_ERROR);
|
||||||
|
// } else {
|
||||||
|
// self._clearTitle();
|
||||||
|
// self.element.removeClass(self.constants.timeErrorCls);
|
||||||
|
// }
|
||||||
|
//});
|
||||||
|
|
||||||
|
combo.on(BI.MultiDateCombo.EVENT_CONFIRM, function(){ |
||||||
|
BI.Bubbles.hide("error"); |
||||||
|
var smallDate = self.left.getKey(), bigDate = self.right.getKey(); |
||||||
|
if (self._check(smallDate, bigDate) && self._compare(smallDate, bigDate)) { |
||||||
|
self._setTitle(BI.i18nText("BI-Time_Interval_Error_Text")); |
||||||
|
self.element.addClass(self.constants.timeErrorCls); |
||||||
|
self.fireEvent(BI.TimeInterval.EVENT_ERROR); |
||||||
|
}else{ |
||||||
|
self._clearTitle(); |
||||||
|
self.element.removeClass(self.constants.timeErrorCls); |
||||||
|
self.fireEvent(BI.TimeInterval.EVENT_CHANGE); |
||||||
|
} |
||||||
|
}); |
||||||
|
return combo; |
||||||
|
}, |
||||||
|
_dateCheck: function (date) { |
||||||
|
return Date.parseDateTime(date, "%Y-%x-%d").print("%Y-%x-%d") == date || Date.parseDateTime(date, "%Y-%X-%d").print("%Y-%X-%d") == date || Date.parseDateTime(date, "%Y-%x-%e").print("%Y-%x-%e") == date || Date.parseDateTime(date, "%Y-%X-%e").print("%Y-%X-%e") == date; |
||||||
|
}, |
||||||
|
_checkVoid: function (obj) { |
||||||
|
return !Date.checkVoid(obj.year, obj.month, obj.day, this.constants.DATE_MIN_VALUE, this.constants.DATE_MAX_VALUE)[0]; |
||||||
|
}, |
||||||
|
_check: function (smallDate, bigDate) { |
||||||
|
var smallObj = smallDate.match(/\d+/g), bigObj = bigDate.match(/\d+/g); |
||||||
|
return this._dateCheck(smallDate) && Date.checkLegal(smallDate) && this._checkVoid({ |
||||||
|
year: smallObj[0], |
||||||
|
month: smallObj[1], |
||||||
|
day: smallObj[2] |
||||||
|
}) && this._dateCheck(bigDate) && Date.checkLegal(bigDate) && this._checkVoid({ |
||||||
|
year: bigObj[0], |
||||||
|
month: bigObj[1], |
||||||
|
day: bigObj[2] |
||||||
|
}); |
||||||
|
}, |
||||||
|
_compare: function (smallDate, bigDate) { |
||||||
|
smallDate = Date.parseDateTime(smallDate, "%Y-%X-%d").print("%Y-%X-%d"); |
||||||
|
bigDate = Date.parseDateTime(bigDate, "%Y-%X-%d").print("%Y-%X-%d"); |
||||||
|
return BI.isNotNull(smallDate) && BI.isNotNull(bigDate) && smallDate > bigDate; |
||||||
|
}, |
||||||
|
_setTitle: function (v) { |
||||||
|
this.left.setTitle(v); |
||||||
|
this.right.setTitle(v); |
||||||
|
this.label.setTitle(v); |
||||||
|
}, |
||||||
|
_clearTitle: function () { |
||||||
|
this.left.setTitle(""); |
||||||
|
this.right.setTitle(""); |
||||||
|
this.label.setTitle(""); |
||||||
|
}, |
||||||
|
setValue: function (date) { |
||||||
|
date = date || {}; |
||||||
|
this.left.setValue(date.start); |
||||||
|
this.right.setValue(date.end); |
||||||
|
}, |
||||||
|
getValue: function () { |
||||||
|
return {start: this.left.getValue(), end: this.right.getValue()}; |
||||||
|
} |
||||||
|
}); |
||||||
|
BI.TimeInterval.EVENT_VALID = "EVENT_VALID"; |
||||||
|
BI.TimeInterval.EVENT_ERROR = "EVENT_ERROR"; |
||||||
|
BI.TimeInterval.EVENT_CHANGE = "EVENT_CHANGE"; |
||||||
|
BI.shortcut("bi.time_interval", BI.TimeInterval); |
Loading…
Reference in new issue