@itwin/frontend-devtools/lib/esm/effects/FlipImage.js

Debug menu and supporting UI widgets

/*---------------------------------------------------------------------------------------------
* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
* See LICENSE.md in the project root for license terms and full copyright notice.
*--------------------------------------------------------------------------------------------*/
/** @packageDocumentation
 * @module Effects
 */
import { Tool, UniformType, VaryingType } from "@itwin/core-frontend";
import { parseArgs } from "../tools/parseArgs";
import { AddEffectTool, refreshViewportsForEffect } from "./EffectTools";
let flipHorizontal = false;
let flipVertical = false;
let flipColor = false;
/** An extremely simple and mostly useless effect intended to demonstrate the basics of creating a screen-space effect.
 * It flips the Viewport's image on the x and/or y axis, and/or inverts the color of each pixel.
 * @beta
 */
export class FlipImageEffect extends AddEffectTool {
    static toolId = "FlipImageEffect";
    get effectName() { return "flip"; }
    get textureCoordFromPosition() { return true; }
    get source() {
        return {
            // Compute texture coordinate for use in fragment shader.
            vertex: `
        void effectMain(vec4 pos) {
          vec2 uv = textureCoordFromPosition(pos);
          if (u_flipHorizontal)
            uv.x = 1.0 - uv.x;

          if (u_flipVertical)
            uv.y = 1.0 - uv.y;

          v_uv = uv;
        }`,
            // Sample the original image to flip on x and/or y axis, then invert its color.
            fragment: `
        vec4 effectMain() {
          vec4 color = sampleSourcePixel();
          if (u_flipColor) {
            color.r = 1.0 - color.r;
            color.g = 1.0 - color.g;
            color.b = 1.0 - color.b;
          }

          return color;
        }`,
            // Because we're moving pixels around, we must tell the render system where the source pixel was originally located - otherwise
            // element locate will not work correctly.
            sampleSourcePixel: "return TEXTURE(u_diffuse, v_uv);",
        };
    }
    defineEffect(builder) {
        // Don't bother applying the effect if nothing is to be flipped.
        builder.shouldApply = (_context) => flipHorizontal || flipVertical || flipColor;
        // Define the varying for the texture coordinate.
        builder.addVarying("v_uv", VaryingType.Vec2);
        // Hook up the uniforms.
        builder.addUniform({
            name: "u_flipHorizontal",
            type: UniformType.Bool,
            bind: (uniform, _context) => uniform.setUniform1i(flipHorizontal ? 1 : 0),
        });
        builder.addUniform({
            name: "u_flipVertical",
            type: UniformType.Bool,
            bind: (uniform, _context) => uniform.setUniform1i(flipVertical ? 1 : 0),
        });
        builder.addUniform({
            name: "u_flipColor",
            type: UniformType.Bool,
            bind: (uniform, _context) => uniform.setUniform1i(flipColor ? 1 : 0),
        });
    }
}
/** Configure the [[FlipImageEffect]].
 * @beta
 */
export class FlipImageConfig extends Tool {
    static toolId = "FlipImageConfig";
    static get minArgs() { return 0; }
    static get maxArgs() { return 3; }
    async run(horizontal, vertical, color) {
        flipHorizontal = !!horizontal;
        flipVertical = !!vertical;
        flipColor = !!color;
        refreshViewportsForEffect("fdt flip");
        return true;
    }
    async parseAndRun(...input) {
        const args = parseArgs(input);
        return this.run(args.getBoolean("h"), args.getBoolean("v"), args.getBoolean("c"));
    }
}
//# sourceMappingURL=FlipImage.js.map