diff --git a/content/effects/flip.md b/content/effects/flip.md index f572aeec..b6b45e40 100644 --- a/content/effects/flip.md +++ b/content/effects/flip.md @@ -3,10 +3,10 @@ The Flip effect lets users flip their images before uploading them. Users can choose to flip vertically or horizontally. ```ts -import { Uppload, Rotate } from "uppload"; +import { Uppload, Flip } from "uppload"; const profilePicture = new Uppload(); -profilePicture.use(new Rotate()); +profilePicture.use(new Flip()); ``` ![Screenshot of the Flip effect](/assets/screenshots/flip.png) diff --git a/src/helpers/elements.ts b/src/helpers/elements.ts index 291c0dba..b5ae9236 100644 --- a/src/helpers/elements.ts +++ b/src/helpers/elements.ts @@ -48,6 +48,23 @@ export const safeListen = ( listening.push({ element, type }); }; +/** + * Safely remove an event listener + * @param element - HTML element to remove event listener to + * @param type - Type of event listener to remove + * @param fn - Callback function to associated listener + */ +export const safeUnlisten = ( + element: Element, + type: string, + fn: EventListenerOrEventListenerObject +) => { + const listener = listening.findIndex((a) => a.element === element && a.type === type); + if (listener < 0) return; + element.removeEventListener(type, fn); + listening.splice(listener, 1); +}; + const safeRequestAnimationFrame = (callback: FrameRequestCallback) => { if (window.requestAnimationFrame) return window.requestAnimationFrame(callback); diff --git a/src/helpers/interfaces.ts b/src/helpers/interfaces.ts index d713989d..150f411a 100644 --- a/src/helpers/interfaces.ts +++ b/src/helpers/interfaces.ts @@ -4,6 +4,8 @@ export type IElements = string | string[] | Element | Element[]; export type ITranslator = (key: string, params?: string | string[]) => string; export interface IUppload { + id: string; + wrapper?: string; services: UpploadService[]; effects: UpploadEffect[]; isOpen: boolean; @@ -15,6 +17,8 @@ export interface IUppload { } export interface IUpploadSettings { + id?: string; + wrapper?: string; value?: string; bind?: IElements; call?: IElements; @@ -33,6 +37,7 @@ export interface IUpploadSettings { compressor?: (file: Blob) => Promise; transitionDuration?: number; disableModalClickClose?: boolean; + disableHelp?: boolean; } export interface IHandlersParams { diff --git a/src/helpers/microlink.ts b/src/helpers/microlink.ts index aa863429..52902a97 100644 --- a/src/helpers/microlink.ts +++ b/src/helpers/microlink.ts @@ -19,7 +19,7 @@ export class MicrolinkBaseClass extends UpploadService { exampleURL = ""; validator: (value: string) => boolean = () => true; - template = ({ translate }: IServiceTemplateParams): string => { + template = ({ translate, uppload }: IServiceTemplateParams): string => { return ` + )}?` : ""}