ferngully-aurelia-tools
Version:
Ferngully Tools for Aurelia
112 lines • 4.44 kB
JavaScript
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
return c > 3 && r && Object.defineProperty(target, key, r), r;
};
var __metadata = (this && this.__metadata) || function (k, v) {
if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
};
import { customElement, bindable, autoinject, containerless } from "aurelia-framework";
import { EditableInputElementService } from "../editable-input-element-service";
import "./editable-inline-select.css";
let EditableInlineSelect = class EditableInlineSelect {
constructor(editableInputElementService) {
this.editableInputElementService = editableInputElementService;
this.classEx = null;
this.isShowing = false;
}
set value(value) {
let selectedOption = this.items.find((option) => { return option.value === value; });
if (selectedOption != null) {
this.text = selectedOption.text;
this._value = value;
}
else {
this.text = "[option with value not found]";
this._value = "";
}
}
get value() {
return this._value;
}
bind() {
this.editableInputElementService.editor = $(this.select);
this.dropdown = this.editableInputElementService.editor.find("span");
let select = $(this.select).find(".dropdown");
select.on("hidden.bs.dropdown", () => {
this.hide();
});
if (this.classEx) {
select.addClass(this.classEx);
}
}
show(element, data, currentValue, onKeyPress, onSave) {
if (!this.isShowing) {
let select = $(this.select);
this.editableInputElementService._show(element);
let ul = select.find("ul");
let items = this.items = data;
ul.empty();
for (let item of items) {
let li = $('<li></li>');
li.append($("<a/>")
.attr('href', "#")
.text(item.text)
.click(() => {
this.itemSelected(item);
return false;
}));
ul.append(li);
}
$(window).on("keydown.editable-inline-select", onKeyPress);
this.value = currentValue;
this.onSave = onSave;
setTimeout(() => {
if (!this.isShowing) {
this.dropdown.dropdown("toggle");
this.isShowing = true;
}
}, 10);
}
}
itemSelected(item) {
this.value = item.value;
this.onSave();
}
hide() {
if (this.isShowing) {
this.editableInputElementService._hide();
$(window).off("keydown.editable-inline-select");
this.dropdown.off("shown.bs.dropdown");
this.dropdown.off("hidden.bs.dropdown");
this.dropdown.dropdown("toggle");
this.isShowing = false;
}
}
get maxLength() {
return this.editableInputElementService.maxLength;
}
detached() {
this.editableInputElementService.detached();
}
attached() {
this.editableInputElementService.attached();
}
static dropdownTextFromValue(dropdownData, value) {
let selectItem = dropdownData.find((dd) => { return dd.value === value; });
return selectItem ? selectItem.text : "";
}
};
__decorate([
bindable,
__metadata("design:type", Object)
], EditableInlineSelect.prototype, "classEx", void 0);
EditableInlineSelect = __decorate([
containerless,
autoinject,
customElement('editable-inline-select'),
__metadata("design:paramtypes", [EditableInputElementService])
], EditableInlineSelect);
export { EditableInlineSelect };
//# sourceMappingURL=editable-inline-select.js.map