• 1
• 2
• 3
• 4
• 5
• 6
• 7
• 8
• 9
• 10
• 11
• 12
• 13
• 14
• 15
• 16
• 17
• 18
• 19
• 20
• 21
• 22
• 23
• 24
• 25
• 26
• 27
• 28
• 29
• 30
• 31
• 32
• 33
• 34
• 35
• 36
• 37
• 38
• 39
• 40
• 41
• 42
• 43
• 44
• 45
• 46
• 47
• 48
• 49
• 50
• 51
• 52
• 53
• 54
• 55
• 56
• 57
• 58
• 59
• 60
• 61
• 62
• 63
• 64
• 65
• 66
• 67
• 68
• 69
• 70
• 71
• 72
• 73
• 74
• 75
• 76
• 77
• 78
• 79
• 80
• 81
• 82
• 83
• 84
• 85
• 86
• 87
• 88
• 89
• 90
• 91
• 92
• 93
• 94
• 95
• 96
• 97
• 98
• 99
• 100
• 101
• 102
• 103
• 104
• 105
• 106
• 107
• 108
• 109
• 110
• 111
• 112
• 113
• 114
• 115
• 116
• 117
• 118
• 119
• 120
• 121
• 122
• 123
• 124
• 125
• 126
• 127
• 128
• 129
• 130
• 131
• 132
• 133
• 134
• 135
• 136
• 137
• 138
• 139
• 140
• 141
• 142
• 143
• 144
• 145
• 146
• 147
• 148
• 149
• 150
• 151
• 152
• 153
• 154
• 155
• 156
• 157
• 158
• 159
• 160
• 161
• 162
• 163
• 164
• 165
• 166
• 167

import { Program } from '@pixi/core';

type TemplateData = Array<{
    id: string;
    args: string[];
    position: { start: number; end: number };
    type: 'field' | 'function';
}>;

export type MacroData = {
    [id: string]: string | ((...args: string[]) => string);
};

const MACRO_PATTERN = /%([\w$]+)(\([\w$, ]*\))?%/g;

/**
 * Helper class to create and manage a program template.
 *
 * @public
 */
export class ProgramTemplate
{
    public vertexTemplateSrc: string;
    public fragmentTemplateSrc: string;
    public name: string;

    protected programCache: Map<string, Program>;
    protected vertexMacroData: TemplateData;
    protected fragmentMacroData: TemplateData;

    /**
     * @param vertexTemplateSrc - vertex shader template
     * @param fragmentTemplateSrc - fragment shader template
     * @param name - name of the shader template. This is used to generate the names for generated programs.
     */
    constructor(vertexTemplateSrc?: string, fragmentTemplateSrc?: string, name = 'pixi-shader-template')
    {
        /**
         * The vertex shader template
         */
        this.vertexTemplateSrc = vertexTemplateSrc || Program.defaultVertexSrc;

        /**
         * The fragment shader template
         */
        this.fragmentTemplateSrc = fragmentTemplateSrc || Program.defaultFragmentSrc;

        /**
         * The name for generated programs
         */
        this.name = name;

        /**
         * The cache of generated programs for each passed macro value.
         */
        this.programCache = new Map<string, Program>();

        /**
         * The macros used in the vertex shader
         */
        this.vertexMacroData = this.extractData(this.vertexTemplateSrc);

        /**
         * The macros used in the fragment shader
         */
        this.fragmentMacroData = this.extractData(this.fragmentTemplateSrc);
    }

    /**
     * Generates a shader program from this template and passed macro-data.
     *
     * @param data - data providing the values of the macros in the shader template
     * @param name - optional name, if another name is desired
     * @return the generated shader program
     */
    generateProgram(data: MacroData, name: string): Program
    {
        const vertexSrc = this.processData(this.vertexTemplateSrc, this.vertexMacroData, data);
        const fragmentSrc = this.processData(this.fragmentTemplateSrc, this.fragmentMacroData, data);
        const key = vertexSrc + fragmentSrc;
        const memo = this.programCache.get(key);

        if (memo)
        {
            return memo;
        }

        const program = new Program(vertexSrc, fragmentSrc, name || this.name || 'pixi-processed-shader');

        this.programCache.set(key, program);

        return program;
    }

    /**
     * Extracts the macros used in the template source.
     *
     * @param templateSrc - the shader template source
     */
    protected extractData(templateSrc: string): TemplateData
    {
        const data = [];
        const pattern = new RegExp(MACRO_PATTERN);

        let macroMatch;

        while ((macroMatch = pattern.exec(templateSrc)) !== null)
        {
            const id = macroMatch[1];
            let args = macroMatch[2];

            if (args)
            {
                args = args.slice(1, -1).split(',').map((arg) => arg.trim());
            }

            data.push({
                id,
                args,
                position: { start: macroMatch.index, end: macroMatch.index + macroMatch[0].length },
                type: args ? 'function' : 'field',
            });
        }

        return data;
    }

    /**
     * Evaluates the macros in the template and generates the shader's source.
     *
     * @param templateSrc - template source
     * @param macros - data defining the macros in the template source
     * @param data - data providing the values for the macros
     * @return the generated shader source
     */
    protected processData(templateSrc: string, macros: TemplateData, data: MacroData): string
    {
        let generatedSrc = templateSrc;

        // Process the last macros first so that positions of the unevaluated macros don't change
        for (let i = macros.length - 1; i >= 0; i--)
        {
            const macro = macros[i];
            const id = macro.id;
            const value = data[id];

            let macroValue = '';

            if (typeof value === 'function')
            {
                macroValue = value(...macro.args);
            }
            else
            {
                // Coerce the value to a string
                macroValue = `${value}`;
            }

            generatedSrc = generatedSrc.slice(0, macro.position.start)
                + macroValue
                + generatedSrc.slice(macro.position.end);
        }

        return generatedSrc;
    }
}