From 70ba063fd3d67987686c447204a1abd377318570 Mon Sep 17 00:00:00 2001 From: Jason Wu Date: Sat, 1 Jul 2017 12:11:52 -0500 Subject: [PATCH 1/4] Added type definitions for draggabilly --- types/draggabilly/draggabilly-tests.ts | 46 ++++++++++++++++++++++++++ types/draggabilly/index.d.ts | 42 +++++++++++++++++++++++ types/draggabilly/tsconfig.json | 23 +++++++++++++ types/draggabilly/tslint.json | 1 + 4 files changed, 112 insertions(+) create mode 100644 types/draggabilly/draggabilly-tests.ts create mode 100644 types/draggabilly/index.d.ts create mode 100644 types/draggabilly/tsconfig.json create mode 100644 types/draggabilly/tslint.json diff --git a/types/draggabilly/draggabilly-tests.ts b/types/draggabilly/draggabilly-tests.ts new file mode 100644 index 0000000000..6ab38e6c13 --- /dev/null +++ b/types/draggabilly/draggabilly-tests.ts @@ -0,0 +1,46 @@ +import Draggabilly from 'draggabilly'; + +const elem = document.querySelector('.draggable') as Element; + +const draggieA = new Draggabilly('.test'); +const draggieB = new Draggabilly(elem); + +const draggie = new Draggabilly(elem, { + axis: 'x', + containment: true, + grid: [20, 20], + handle: '.handle' +}); + +const draggiePosX: number = draggie.position.x; +const draggiePosY: number = draggie.position.y; + +draggie.on( 'dragMove', (event, pointer, moveVector) => { + const pointerPageX: number = pointer.pageX; + const pointePageY: number = pointer.pageY; + + const moveVectorX: number = moveVector.x; + const moveVectorY: number = moveVector.y; +}); + +draggie.on( 'dragStart', (event, pointer) => {}); + +draggie.on( 'dragEnd', (event, pointer) => {}); + +draggie.on( 'pointerDown', (event, pointer) => {}); + +draggie.on( 'pointerMove', (event, pointer, moveVector) => {}); + +draggie.on( 'pointerUp', (event, pointer) => {}); + +draggie.on( 'staticClick', (event, pointer) => {}); + +draggie.off('dragMove', (event, pointer, moveVector) => {}); + +draggie.once('dragMove', (event, pointer, moveVector) => {}); + +draggie.enable(); + +draggie.disable(); + +draggie.destroy(); diff --git a/types/draggabilly/index.d.ts b/types/draggabilly/index.d.ts new file mode 100644 index 0000000000..3bc3e3a10e --- /dev/null +++ b/types/draggabilly/index.d.ts @@ -0,0 +1,42 @@ +// Type definitions for draggabilly 2.1 +// Project: http://draggabilly.desandro.com/ +// Definitions by: Jason Wu +// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped + +declare module 'draggabilly' { + interface Position { + x: number; + y: number; + } + + export interface DraggabillyOptions { + axis?: 'x' | 'y'; + containment?: Element | string | boolean; + grid?: [number, number]; + handle?: string; + } + + export type DraggabillyEventName = 'dragStart' | 'dragMove' | 'dragEnd' | 'pointerDown' | 'pointerMove' | 'pointerUp' + | 'staticClick'; + + export default class Draggabilly { + position: Position; + + constructor(element: Element | string, options?: DraggabillyOptions); + + on(eventName: DraggabillyEventName, + listener: (event: Event, pointer: MouseEvent | Touch, moveVector: Position) => void): void; + + off(eventName: DraggabillyEventName, + listener: (event: Event, pointer: MouseEvent | Touch, moveVector: Position) => void): void; + + once(eventName: DraggabillyEventName, + listener: (event: Event, pointer: MouseEvent | Touch, moveVector?: Position) => void): void; + + enable(): void; + + disable(): void; + + destroy(): void; + } +} diff --git a/types/draggabilly/tsconfig.json b/types/draggabilly/tsconfig.json new file mode 100644 index 0000000000..32cc6ee235 --- /dev/null +++ b/types/draggabilly/tsconfig.json @@ -0,0 +1,23 @@ +{ + "compilerOptions": { + "module": "commonjs", + "lib": [ + "es6", + "dom" + ], + "noImplicitAny": true, + "noImplicitThis": true, + "strictNullChecks": true, + "baseUrl": "../", + "typeRoots": [ + "../" + ], + "types": [], + "noEmit": true, + "forceConsistentCasingInFileNames": true + }, + "files": [ + "index.d.ts", + "draggabilly-tests.ts" + ] +} diff --git a/types/draggabilly/tslint.json b/types/draggabilly/tslint.json new file mode 100644 index 0000000000..3db14f85ea --- /dev/null +++ b/types/draggabilly/tslint.json @@ -0,0 +1 @@ +{ "extends": "dtslint/dt.json" } From e076754cc7dd747e80d961510923b18ddf1e9c4d Mon Sep 17 00:00:00 2001 From: Jason Wu Date: Sat, 1 Jul 2017 12:46:13 -0500 Subject: [PATCH 2/4] Added TypeScript version --- types/draggabilly/index.d.ts | 8 ++++++-- types/draggabilly/tsconfig.json | 2 +- 2 files changed, 7 insertions(+), 3 deletions(-) diff --git a/types/draggabilly/index.d.ts b/types/draggabilly/index.d.ts index 3bc3e3a10e..c614796ca9 100644 --- a/types/draggabilly/index.d.ts +++ b/types/draggabilly/index.d.ts @@ -2,10 +2,14 @@ // Project: http://draggabilly.desandro.com/ // Definitions by: Jason Wu // Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped +// TypeScript Version: 2.3 + +// export = Backbone; +// export as namespace Backbone; declare module 'draggabilly' { - interface Position { - x: number; + interface Position { + x: number; y: number; } diff --git a/types/draggabilly/tsconfig.json b/types/draggabilly/tsconfig.json index 32cc6ee235..c0873c7293 100644 --- a/types/draggabilly/tsconfig.json +++ b/types/draggabilly/tsconfig.json @@ -7,7 +7,7 @@ ], "noImplicitAny": true, "noImplicitThis": true, - "strictNullChecks": true, + "strictNullChecks": false, "baseUrl": "../", "typeRoots": [ "../" From 1bdaeb9cbfade9ba325392fde20f5e9d57d0c72e Mon Sep 17 00:00:00 2001 From: Jason Wu Date: Sun, 2 Jul 2017 11:47:34 -0500 Subject: [PATCH 3/4] Wrote it as an external module --- types/draggabilly/index.d.ts | 50 ++++++++++++++------------------- types/draggabilly/tsconfig.json | 2 +- 2 files changed, 22 insertions(+), 30 deletions(-) diff --git a/types/draggabilly/index.d.ts b/types/draggabilly/index.d.ts index c614796ca9..f376ea8fbd 100644 --- a/types/draggabilly/index.d.ts +++ b/types/draggabilly/index.d.ts @@ -4,43 +4,35 @@ // Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped // TypeScript Version: 2.3 -// export = Backbone; -// export as namespace Backbone; +export interface Position { + x: number; + y: number; +} -declare module 'draggabilly' { - interface Position { - x: number; - y: number; - } +export interface DraggabillyOptions { + axis?: 'x' | 'y'; + containment?: Element | string | boolean; + grid?: [number, number]; + handle?: string; +} - export interface DraggabillyOptions { - axis?: 'x' | 'y'; - containment?: Element | string | boolean; - grid?: [number, number]; - handle?: string; - } +export type DraggabillyEventName = 'dragStart' | 'dragMove' | 'dragEnd' | 'pointerDown' | 'pointerMove' | 'pointerUp' + | 'staticClick'; - export type DraggabillyEventName = 'dragStart' | 'dragMove' | 'dragEnd' | 'pointerDown' | 'pointerMove' | 'pointerUp' - | 'staticClick'; +export default class Draggabilly { + position: Position; - export default class Draggabilly { - position: Position; + constructor(element: Element | string, options?: DraggabillyOptions); - constructor(element: Element | string, options?: DraggabillyOptions); + on(eventName: DraggabillyEventName, listener: (event: Event, pointer: MouseEvent | Touch, moveVector: Position) => void): Draggabilly; - on(eventName: DraggabillyEventName, - listener: (event: Event, pointer: MouseEvent | Touch, moveVector: Position) => void): void; + off(eventName: DraggabillyEventName, listener: (event: Event, pointer: MouseEvent | Touch, moveVector: Position) => void): Draggabilly; - off(eventName: DraggabillyEventName, - listener: (event: Event, pointer: MouseEvent | Touch, moveVector: Position) => void): void; + once(eventName: DraggabillyEventName, listener: (event: Event, pointer: MouseEvent | Touch, moveVector?: Position) => void): Draggabilly; - once(eventName: DraggabillyEventName, - listener: (event: Event, pointer: MouseEvent | Touch, moveVector?: Position) => void): void; + enable(): void; - enable(): void; + disable(): void; - disable(): void; - - destroy(): void; - } + destroy(): void; } diff --git a/types/draggabilly/tsconfig.json b/types/draggabilly/tsconfig.json index c0873c7293..32cc6ee235 100644 --- a/types/draggabilly/tsconfig.json +++ b/types/draggabilly/tsconfig.json @@ -7,7 +7,7 @@ ], "noImplicitAny": true, "noImplicitThis": true, - "strictNullChecks": false, + "strictNullChecks": true, "baseUrl": "../", "typeRoots": [ "../" From 48df7f24d75d66b6313058c16ede7a4513e3104d Mon Sep 17 00:00:00 2001 From: Jason Wu Date: Tue, 4 Jul 2017 01:08:50 -0500 Subject: [PATCH 4/4] Overloaded functions to support the moveVector parameter for the 'dragMove' and 'pointerMove' events --- types/draggabilly/index.d.ts | 17 ++++++++++++----- 1 file changed, 12 insertions(+), 5 deletions(-) diff --git a/types/draggabilly/index.d.ts b/types/draggabilly/index.d.ts index f376ea8fbd..6307c424ab 100644 --- a/types/draggabilly/index.d.ts +++ b/types/draggabilly/index.d.ts @@ -16,19 +16,26 @@ export interface DraggabillyOptions { handle?: string; } -export type DraggabillyEventName = 'dragStart' | 'dragMove' | 'dragEnd' | 'pointerDown' | 'pointerMove' | 'pointerUp' - | 'staticClick'; +export type DraggabillyClickEventName = 'dragStart' | 'dragEnd' | 'pointerDown' | 'pointerUp' | 'staticClick'; + +export type DraggabillyMoveEventName = 'dragMove' | 'pointerMove'; export default class Draggabilly { position: Position; constructor(element: Element | string, options?: DraggabillyOptions); - on(eventName: DraggabillyEventName, listener: (event: Event, pointer: MouseEvent | Touch, moveVector: Position) => void): Draggabilly; + on(eventName: DraggabillyClickEventName, listener: (event: Event, pointer: MouseEvent | Touch) => void): Draggabilly; - off(eventName: DraggabillyEventName, listener: (event: Event, pointer: MouseEvent | Touch, moveVector: Position) => void): Draggabilly; + on(eventName: DraggabillyMoveEventName, listener: (event: Event, pointer: MouseEvent | Touch, moveVector: Position) => void): Draggabilly; - once(eventName: DraggabillyEventName, listener: (event: Event, pointer: MouseEvent | Touch, moveVector?: Position) => void): Draggabilly; + off(eventName: DraggabillyClickEventName, listener: (event: Event, pointer: MouseEvent | Touch) => void): Draggabilly; + + off(eventName: DraggabillyMoveEventName, listener: (event: Event, pointer: MouseEvent | Touch, moveVector: Position) => void): Draggabilly; + + once(eventName: DraggabillyClickEventName, listener: (event: Event, pointer: MouseEvent | Touch) => void): Draggabilly; + + once(eventName: DraggabillyMoveEventName, listener: (event: Event, pointer: MouseEvent | Touch, moveVector: Position) => void): Draggabilly; enable(): void;