summaryrefslogtreecommitdiffstats
path: root/toolkit/content/widgets
diff options
context:
space:
mode:
authorjanekptacijarabaci <janekptacijarabaci@seznam.cz>2018-02-14 13:38:47 +0100
committerjanekptacijarabaci <janekptacijarabaci@seznam.cz>2018-02-14 13:38:47 +0100
commitc87dbe6922ec79f988744f5aab0cde1a166292e6 (patch)
tree97480be1bafd7f5c294af3e00fb8e73325785d6d /toolkit/content/widgets
parent260e399a1ff7756cda9b6320a801f1198b27604a (diff)
downloadUXP-c87dbe6922ec79f988744f5aab0cde1a166292e6.tar
UXP-c87dbe6922ec79f988744f5aab0cde1a166292e6.tar.gz
UXP-c87dbe6922ec79f988744f5aab0cde1a166292e6.tar.lz
UXP-c87dbe6922ec79f988744f5aab0cde1a166292e6.tar.xz
UXP-c87dbe6922ec79f988744f5aab0cde1a166292e6.zip
Bug 1325922: [DateTimePicker] Add arrows svg file and style month-year button for date picker
Diffstat (limited to 'toolkit/content/widgets')
-rw-r--r--toolkit/content/widgets/datepicker.js19
-rw-r--r--toolkit/content/widgets/spinner.js9
-rw-r--r--toolkit/content/widgets/timepicker.js7
3 files changed, 27 insertions, 8 deletions
diff --git a/toolkit/content/widgets/datepicker.js b/toolkit/content/widgets/datepicker.js
index d3f0fd1a4..7453b67eb 100644
--- a/toolkit/content/widgets/datepicker.js
+++ b/toolkit/content/widgets/datepicker.js
@@ -174,7 +174,8 @@ function DatePicker(context) {
*/
_attachEventListeners() {
window.addEventListener("message", this);
- document.addEventListener("click", this);
+ document.addEventListener("mouseup", this, { passive: true });
+ document.addEventListener("mousedown", this);
},
/**
@@ -188,16 +189,28 @@ function DatePicker(context) {
this.handleMessage(event);
break;
}
- case "click": {
+ case "mousedown": {
+ // Use preventDefault to keep focus on input boxes
+ event.preventDefault();
+ event.target.setCapture();
+
if (event.target == this.context.buttonLeft) {
+ event.target.classList.add("active");
this.state.dateKeeper.setMonthByOffset(-1);
this._update();
} else if (event.target == this.context.buttonRight) {
+ event.target.classList.add("active");
this.state.dateKeeper.setMonthByOffset(1);
this._update();
}
break;
}
+ case "mouseup": {
+ if (event.target == this.context.buttonLeft || event.target == this.context.buttonRight) {
+ event.target.classList.remove("active");
+ }
+
+ }
}
},
@@ -307,6 +320,7 @@ function DatePicker(context) {
this.context.monthYear.textContent = this.state.dateFormat(props.dateObj);
if (props.isVisible) {
+ this.context.monthYear.classList.add("active");
this.components.month.setState({
value: props.month,
items: props.months,
@@ -323,6 +337,7 @@ function DatePicker(context) {
});
this.state.firstOpened = false;
} else {
+ this.context.monthYear.classList.remove("active");
this.state.isMonthSet = false;
this.state.isYearSet = false;
this.state.firstOpened = true;
diff --git a/toolkit/content/widgets/spinner.js b/toolkit/content/widgets/spinner.js
index b3d996fb5..059e151fc 100644
--- a/toolkit/content/widgets/spinner.js
+++ b/toolkit/content/widgets/spinner.js
@@ -268,11 +268,11 @@ function Spinner(props, context) {
* Attach event listeners to the spinner and buttons.
*/
_attachEventListeners() {
- const { spinner } = this.elements;
+ const { spinner, container } = this.elements;
spinner.addEventListener("scroll", this, { passive: true });
- document.addEventListener("mouseup", this, { passive: true });
- document.addEventListener("mousedown", this);
+ container.addEventListener("mouseup", this, { passive: true });
+ container.addEventListener("mousedown", this, { passive: true });
},
/**
@@ -290,9 +290,6 @@ function Spinner(props, context) {
break;
}
case "mousedown": {
- // Use preventDefault to keep focus on input boxes
- event.preventDefault();
- event.target.setCapture();
this.state.mouseState = {
down: true,
layerX: event.layerX,
diff --git a/toolkit/content/widgets/timepicker.js b/toolkit/content/widgets/timepicker.js
index f438e9ec6..544032e9f 100644
--- a/toolkit/content/widgets/timepicker.js
+++ b/toolkit/content/widgets/timepicker.js
@@ -218,6 +218,7 @@ function TimePicker(context) {
},
_attachEventListeners() {
window.addEventListener("message", this);
+ document.addEventListener("mousedown", this);
},
/**
@@ -231,6 +232,12 @@ function TimePicker(context) {
this.handleMessage(event);
break;
}
+ case "mousedown": {
+ // Use preventDefault to keep focus on input boxes
+ event.preventDefault();
+ event.target.setCapture();
+ break;
+ }
}
},