@snap/camera-kit/dist/session/LensKeyboard.js

Camera Kit Web

import { isState, forActions } from "@snap/state-management";
import { Injectable } from "@snap/ts-inject";
import { TypedCustomEvent } from "../events/TypedCustomEvent";
import { TypedEventTarget } from "../events/TypedEventTarget";
import { getLogger } from "../logger/logger";
import { lensStateFactory } from "./lensState";
const logger = getLogger("LensKeyboard");
export class LensKeyboard {
    constructor(lensState) {
        this.lensState = lensState;
        this.active = false;
        this.text = undefined;
        this.reply = () => { };
        this.onElementKeyPress = this.onElementKeyPress.bind(this);
        this.events = new TypedEventTarget();
        this.element = document.createElement("textarea");
        this.element.addEventListener("keypress", this.onElementKeyPress);
        this.uriHandler = {
            uri: "app://textInput/",
            handleRequest: (request, reply) => {
                if (request.uri === "app://textInput/requestKeyboard") {
                    const data = JSON.parse(new TextDecoder().decode(request.data));
                    this.element.value = data.text;
                    this.text = data.text;
                    this.reply = reply;
                    this.active = true;
                    this.notifyClient();
                    this.element.focus();
                }
                else if (request.uri === "app://textInput/dismissKeyboard") {
                    this.active = false;
                    this.sendReply({ keyboardOpen: false });
                    this.notifyClient();
                }
                else {
                    logger.error(new Error(`Unhandled lens keyboard request '${request.uri}'.`));
                }
            },
        };
        lensState.events.pipe(forActions("turnedOff")).subscribe(() => {
            this.dismiss();
        });
    }
    dismiss() {
        this.active = false;
        this.element.value = "";
        this.text = "";
        this.sendReply({ keyboardOpen: false });
        this.notifyClient();
    }
    getElement() {
        return this.element;
    }
    sendInputToLens(text) {
        this.element.value = text;
        this.text = text;
        this.sendReply({
            text: text,
            start: text.length,
            end: text.length,
            done: true,
            shouldNotify: true,
        });
    }
    addEventListener(type, callback, options) {
        this.events.addEventListener(type, callback, options);
    }
    removeEventListener(type, callback) {
        this.events.removeEventListener(type, callback);
    }
    toPublicInterface() {
        return {
            addEventListener: this.addEventListener.bind(this),
            removeEventListener: this.removeEventListener.bind(this),
            sendInputToLens: this.sendInputToLens.bind(this),
            dismiss: this.dismiss.bind(this),
            getElement: this.getElement.bind(this),
        };
    }
    destroy() {
        this.element.removeEventListener("keypress", this.onElementKeyPress);
    }
    sendReply(data) {
        this.reply({
            code: 200,
            description: "",
            contentType: "application/json",
            data: new TextEncoder().encode(JSON.stringify(data)),
        });
    }
    notifyClient() {
        var _a;
        const state = this.lensState.getState();
        if (isState(state, "noLensApplied"))
            return;
        this.events.dispatchEvent(new TypedCustomEvent("active", {
            element: this.element,
            active: this.active,
            text: (_a = this.text) !== null && _a !== void 0 ? _a : "",
            lens: state.data,
        }));
    }
    onElementKeyPress(event) {
        if (event.code === "Enter" && !event.shiftKey) {
            event.preventDefault();
            this.sendInputToLens(this.element.value);
        }
    }
}
export const lensKeyboardFactory = Injectable("lensKeyboard", [lensStateFactory.token], (lensState) => new LensKeyboard(lensState));
//# sourceMappingURL=LensKeyboard.js.map