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