mirror of
https://github.com/wassname/DefinitelyTyped.git
synced 2026-08-20 12:00:53 +08:00
extended-listbox.d.ts version 1.1.x
This commit is contained in:
@@ -4,33 +4,43 @@
|
||||
var $test = $("#test");
|
||||
|
||||
// Create Listbox with defaults
|
||||
var rootElement: any = $test.listbox();
|
||||
var instance: ExtendedListboxInstance = <ExtendedListboxInstance>$test.listbox();
|
||||
|
||||
|
||||
// Create with options
|
||||
var options = <ListBoxOptions>{};
|
||||
options.multiple = true;
|
||||
options.onItemsChanged = (items: ListboxItem[]): void => {
|
||||
console.log(items);
|
||||
};
|
||||
options.searchBar = false;
|
||||
options.searchBarWatermark = "Search";
|
||||
options.searchBarButton = { icon: "fa fa-search", visible: true, onClick: function () { alert(); } };
|
||||
options.getItems = function (): any[] {
|
||||
return ["Test1"];
|
||||
};
|
||||
options.searchBar = false;
|
||||
options.searchBarWatermark = "Search";
|
||||
options.onFilterChanged = (filter): void => {
|
||||
console.log(filter);
|
||||
options.onItemsChanged = (event: ListboxEvent): void => {
|
||||
console.log(event.eventName);
|
||||
console.log(event.args);
|
||||
console.log(event.target);
|
||||
};
|
||||
options.onValueChanged = function (value: any): void {
|
||||
console.log(value);
|
||||
options.onFilterChanged = (event: ListboxEvent): void => {
|
||||
console.log(event.args);
|
||||
};
|
||||
options.onValueChanged = function (event: ListboxEvent): void {
|
||||
console.log(event.args);
|
||||
};
|
||||
options.onItemDoubleClicked = function (event: ListboxEvent): void {
|
||||
console.log(event.args);
|
||||
};
|
||||
options.onItemEnterPressed = function (event: ListboxEvent): void {
|
||||
console.log(event.args);
|
||||
};
|
||||
options.searchBarButton = { icon: "fa fa-search", visible: true, onClick: function () { alert(); } };
|
||||
|
||||
rootElement = $test.listbox(options);
|
||||
instance = <ExtendedListboxInstance>$test.listbox(options);
|
||||
|
||||
|
||||
/////// NEW API ///////
|
||||
|
||||
// Add string item
|
||||
rootElement.listbox("addItem", "Test2");
|
||||
var id = instance.addItem("Test2");
|
||||
|
||||
|
||||
// Add item
|
||||
@@ -42,36 +52,128 @@ item.groupHeader = false;
|
||||
item.id = "ouetioreit";
|
||||
item.index = 0;
|
||||
item.text = "Test3";
|
||||
var id: string = rootElement.listbox("addItem", item);
|
||||
id = instance.addItem(item);
|
||||
|
||||
|
||||
// Remove item
|
||||
rootElement.listbox("removeItem", id);
|
||||
instance.removeItem(id);
|
||||
|
||||
|
||||
// Get item
|
||||
var i: ListboxItem = rootElement.listbox("getItem", id);
|
||||
var i: ListboxItem = instance.getItem(id);
|
||||
|
||||
|
||||
// Get items
|
||||
var allItems: ListboxItem[] = rootElement.listbox("getItems");
|
||||
var allItems: ListboxItem[] = instance.getItems();
|
||||
|
||||
// Get selected items
|
||||
var allItems: ListboxItem[] = instance.getSelection();
|
||||
|
||||
|
||||
// Move item up
|
||||
var newIndex: number = rootElement.listbox("moveItemUp", i.id);
|
||||
var newIndex: number = instance.moveItemUp(i.id);
|
||||
|
||||
|
||||
// Move item down
|
||||
newIndex = rootElement.listbox("moveItemDown", i.id);
|
||||
newIndex = instance.moveItemDown(i.id);
|
||||
|
||||
|
||||
// Move item to top
|
||||
var newIndex: number = instance.moveItemToTop(i.id);
|
||||
|
||||
|
||||
// Move item to bottom
|
||||
newIndex = instance.moveItemToBottom(i.id);
|
||||
|
||||
|
||||
// Clear selection
|
||||
newIndex = rootElement.listbox("clearSelection");
|
||||
instance.clearSelection();
|
||||
|
||||
|
||||
// Enable
|
||||
newIndex = rootElement.listbox("enable", false);
|
||||
instance.enable(false);
|
||||
|
||||
|
||||
// Destroy
|
||||
newIndex = rootElement.listbox("destroy");
|
||||
instance.destroy();
|
||||
|
||||
|
||||
// onValueChanged
|
||||
instance.onValueChanged((event: ListboxEvent) => {
|
||||
console.log(event.args);
|
||||
});
|
||||
|
||||
|
||||
// onItemsChanged
|
||||
instance.onItemsChanged((event: ListboxEvent) => {
|
||||
console.log(event.args);
|
||||
});
|
||||
|
||||
|
||||
// onFilterChanged
|
||||
instance.onFilterChanged((event: ListboxEvent) => {
|
||||
console.log(event.args);
|
||||
});
|
||||
|
||||
|
||||
// onItemEnterPressed
|
||||
instance.onItemEnterPressed((event: ListboxEvent) => {
|
||||
console.log(event.args);
|
||||
});
|
||||
|
||||
|
||||
// onItemDoubleClicked
|
||||
instance.onItemDoubleClicked((event: ListboxEvent) => {
|
||||
console.log(event.args);
|
||||
});
|
||||
|
||||
|
||||
|
||||
/////// LEGACY API ///////
|
||||
|
||||
// Add string item
|
||||
instance.target.listbox("addItem", "Test2");
|
||||
|
||||
|
||||
// Add item
|
||||
var item: ListboxItem = <ListboxItem>{};
|
||||
item.selected = true;
|
||||
item.disabled = false;
|
||||
item.childItems = ["Test4"];
|
||||
item.groupHeader = false;
|
||||
item.id = "ouetioreit";
|
||||
item.index = 0;
|
||||
item.text = "Test3";
|
||||
var id: string = instance.target.listbox("addItem", item);
|
||||
|
||||
|
||||
// Remove item
|
||||
instance.target.listbox("removeItem", id);
|
||||
|
||||
|
||||
// Get item
|
||||
var i: ListboxItem = instance.target.listbox("getItem", id);
|
||||
|
||||
|
||||
// Get items
|
||||
var allItems: ListboxItem[] = instance.target.listbox("getItems");
|
||||
|
||||
|
||||
// Move item up
|
||||
var newIndex: number = instance.target.listbox("moveItemUp", i.id);
|
||||
|
||||
|
||||
// Move item down
|
||||
newIndex = instance.target.listbox("moveItemDown", i.id);
|
||||
|
||||
|
||||
// Clear selection
|
||||
instance.target.listbox("clearSelection");
|
||||
|
||||
|
||||
// Enable
|
||||
instance.target.listbox("enable", false);
|
||||
|
||||
|
||||
// Destroy
|
||||
instance.target.listbox("destroy");
|
||||
|
||||
+104
-6
@@ -1,4 +1,4 @@
|
||||
// Type definitions for extended-listbox 1.0.6
|
||||
// Type definitions for extended-listbox 1.1.x
|
||||
// Project: https://github.com/code-chris/extended-listbox
|
||||
// Definitions by: Christian Kotzbauer <https://github.com/code-chris>
|
||||
// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
|
||||
@@ -59,27 +59,125 @@ interface ListBoxOptions {
|
||||
getItems?: () => any;
|
||||
|
||||
/** callback for selection changes */
|
||||
onValueChanged?: (value: ListboxItem|ListboxItem[]) => void;
|
||||
onValueChanged?: (event: ListboxEvent) => void;
|
||||
|
||||
/** callback for searchBar text changes */
|
||||
onFilterChanged?: (value: string) => void;
|
||||
onFilterChanged?: (event: ListboxEvent) => void;
|
||||
|
||||
/** callback for item changes (item added, item removed, item order) */
|
||||
onItemsChanged?: (value: ListboxItem[]) => void;
|
||||
onItemsChanged?: (event: ListboxEvent) => void;
|
||||
|
||||
/** callback for enter keyPress event on an item */
|
||||
onItemEnterPressed?: (event: ListboxEvent) => void;
|
||||
|
||||
/** callback for doubleClick event on an item */
|
||||
onItemDoubleClicked?: (event: ListboxEvent) => void;
|
||||
}
|
||||
|
||||
interface ListboxEvent {
|
||||
/** unique event name */
|
||||
eventName: string;
|
||||
|
||||
/** target object for which event is triggered */
|
||||
target: JQuery;
|
||||
|
||||
/** any object */
|
||||
args: any;
|
||||
}
|
||||
|
||||
interface ExtendedListboxInstance {
|
||||
/** DOM element of the listbox root */
|
||||
target: JQuery;
|
||||
|
||||
/** Adds a new item to the list */
|
||||
addItem(item: string|ListboxItem): string;
|
||||
|
||||
/** Removes a item from the list */
|
||||
removeItem(identifier: string): void;
|
||||
|
||||
/** Reverts all changes from the DOM */
|
||||
destroy(): void;
|
||||
|
||||
/** Resets the selection state of all items */
|
||||
clearSelection(): void;
|
||||
|
||||
/** Returns a item object for the given id or display text */
|
||||
getItem(identifier: string): ListboxItem;
|
||||
|
||||
/** Returns all item objects */
|
||||
getItems(): ListboxItem[];
|
||||
|
||||
/** Returns all ListboxItem's which are selected */
|
||||
getSelection(): ListboxItem[];
|
||||
|
||||
/** Decreases the index of the matching item by one */
|
||||
moveItemUp(identifier: string): number;
|
||||
|
||||
/** Increases the index of the matching item by one */
|
||||
moveItemDown(identifier: string): number;
|
||||
|
||||
/** Moves item to the bottom of the list */
|
||||
moveItemToBottom(identifier: string): number;
|
||||
|
||||
/** Moves item to the top of the list */
|
||||
moveItemToTop(identifier: string): number;
|
||||
|
||||
/** Enables or disables the whole list and all childs */
|
||||
enable(state: boolean): void;
|
||||
|
||||
/** callback for selection changes */
|
||||
onValueChanged(callback: (event: ListboxEvent) => void): void;
|
||||
|
||||
/** callback for item changes (item added, item removed, item order) */
|
||||
onItemsChanged(callback: (event: ListboxEvent) => void): void;
|
||||
|
||||
/** callback for searchBar text changes */
|
||||
onFilterChanged(callback: (event: ListboxEvent) => void): void;
|
||||
|
||||
/** callback for enter keyPress event on an item */
|
||||
onItemEnterPressed(callback: (event: ListboxEvent) => void): void;
|
||||
|
||||
/** callback for doubleClick event on an item */
|
||||
onItemDoubleClicked(callback: (event: ListboxEvent) => void): void;
|
||||
}
|
||||
|
||||
interface JQuery {
|
||||
listbox(): JQuery;
|
||||
/** constructs a new instance of Listbox on the given DOM item or returns existing */
|
||||
listbox(): ExtendedListboxInstance|ExtendedListboxInstance[];
|
||||
|
||||
/** constructs a new instance of Listbox on the given DOM item */
|
||||
listbox(options: ListBoxOptions): ExtendedListboxInstance|ExtendedListboxInstance[];
|
||||
|
||||
/** @deprecated: use method in ExtendedListboxInstance */
|
||||
listbox(methodName: 'addItem'): string;
|
||||
|
||||
/** @deprecated: use method in ExtendedListboxInstance */
|
||||
listbox(methodName: 'removeItem'): void;
|
||||
|
||||
/** @deprecated: use method in ExtendedListboxInstance */
|
||||
listbox(methodName: 'destroy'): void;
|
||||
|
||||
/** @deprecated: use method in ExtendedListboxInstance */
|
||||
listbox(methodName: 'getItem'): ListboxItem;
|
||||
|
||||
/** @deprecated: use method in ExtendedListboxInstance */
|
||||
listbox(methodName: 'getItems'): ListboxItem[];
|
||||
|
||||
/** @deprecated: use method in ExtendedListboxInstance */
|
||||
listbox(methodName: 'moveItemUp'): number;
|
||||
|
||||
/** @deprecated: use method in ExtendedListboxInstance */
|
||||
listbox(methodName: 'moveItemDown'): number;
|
||||
|
||||
/** @deprecated: use method in ExtendedListboxInstance */
|
||||
listbox(methodName: 'clearSelection'): void;
|
||||
|
||||
/** @deprecated: use method in ExtendedListboxInstance */
|
||||
listbox(methodName: 'enable'): void;
|
||||
|
||||
/** @deprecated: use method in ExtendedListboxInstance */
|
||||
listbox(methodName: string): any;
|
||||
|
||||
/** @deprecated: use method in ExtendedListboxInstance */
|
||||
listbox(methodName: string, methodParameter: any): any;
|
||||
listbox(options: ListBoxOptions): JQuery;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user