67 lines
1.6 KiB
JavaScript
67 lines
1.6 KiB
JavaScript
/* global Pikaday:true */
|
|
import loadScript from "discourse/lib/load-script";
|
|
import {
|
|
default as computed,
|
|
on
|
|
} from "ember-addons/ember-computed-decorators";
|
|
|
|
export default Ember.Component.extend({
|
|
classNames: ["date-picker-wrapper"],
|
|
_picker: null,
|
|
|
|
@on("didInsertElement")
|
|
_loadDatePicker() {
|
|
const input = this.$(".date-picker")[0];
|
|
const container = $("#" + this.containerId)[0];
|
|
|
|
loadScript("/javascripts/pikaday.js").then(() => {
|
|
Ember.run.next(() => {
|
|
let default_opts = {
|
|
field: input,
|
|
container: container || this.$()[0],
|
|
bound: container === undefined,
|
|
format: "YYYY-MM-DD",
|
|
firstDay: 1,
|
|
i18n: {
|
|
previousMonth: I18n.t("dates.previous_month"),
|
|
nextMonth: I18n.t("dates.next_month"),
|
|
months: moment.months(),
|
|
weekdays: moment.weekdays(),
|
|
weekdaysShort: moment.weekdaysShort()
|
|
},
|
|
onSelect: date => {
|
|
const formattedDate = moment(date).format("YYYY-MM-DD");
|
|
|
|
if (this.attrs.onSelect) {
|
|
this.attrs.onSelect(formattedDate);
|
|
}
|
|
|
|
if (!this.element || this.isDestroying || this.isDestroyed) return;
|
|
|
|
this.set("value", formattedDate);
|
|
}
|
|
};
|
|
|
|
this._picker = new Pikaday(_.merge(default_opts, this._opts()));
|
|
});
|
|
});
|
|
},
|
|
|
|
@on("willDestroyElement")
|
|
_destroy() {
|
|
if (this._picker) {
|
|
this._picker.destroy();
|
|
}
|
|
this._picker = null;
|
|
},
|
|
|
|
@computed()
|
|
placeholder() {
|
|
return I18n.t("dates.placeholder");
|
|
},
|
|
|
|
_opts() {
|
|
return null;
|
|
}
|
|
});
|