Text on a curve in Phaser 3 using path follower and renderTexture

I don’t think I’ve seen this particular combination of established techniques used together before, maybe someone will find it useful. The code is working on Codepen.

I have added a curvedText function in the Codepen, even though it is not referenced in the create, and include just the function below. I am not familiar with the structure of Codepen so I am not quite sure how to tweak the syntax so that it picks up the Phaser code for this in a separate function, but I trust that curvedText would work correctly when pasted into your Phaser scene class.

curvedText(
    start = {x:200,y:300}, 
    middle = {x:400,y:200}, 
    end = {x:600,y:300}, 
    arc = 0.3, 
    bannertext = "REWARDS", 
    bannerstyle = {fontSize:20,fontFamily:"Verdana",color:"#44bb44"}
    startat = 0.2, 
    duration = 1000,
    debug = false ) {

    let path = new Phaser.Curves.Path(start.x, start.y);
    path.splineTo([ 
        (start.x + middle.x)/2, middle.y - (middle.y - start.y) * (arc),
        middle.x, middle.y,
        (middle.x + end.x)/2, middle.y - (middle.y - start.y) * (arc),
        end.x, end.y
        ]);

    let characters = bannertext.split(''), rendered = [];
    if (debug)
        {
        const graphics = this.add.graphics();
        graphics.lineStyle(1, 0x444444, 1);
        path.draw(graphics, 128);

        this.add.text(start.x - 100,start.y - 150,"startat = "+startat);
        this.add.text(start.x - 100,start.y - 100,"bannertext.length = "+bannertext.length);

        let letter = [];
        }

    characters.forEach ((char,i) => {

        rendered[i] = this.add.renderTexture(-1000, -1000, bannerstyle.fontSize*2, bannerstyle.fontSize*2).setOrigin(0.5);
        rendered[i].draw(this.add.sprite(-1000,-1000,'furn','greenpixel').setDisplaySize(bannerstyle.fontSize*2,bannerstyle.fontSize*2).setOrigin(0.5),0,0);
        rendered[i].draw(this.add.text(-1000,-1000,char,bannerstyle).setColor("#44bb44").setOrigin(0.5),0,0);
        this.add.follower(path, start.x, start.y, rendered[i].texture)
            .startFollow({duration: duration,
                startAt: startat,
                to: i/(bannertext.length-1) * (1-startat*2) + startat,
                rotateToPath: true,
                verticalAdjust: true
            });

        if (debug)
            {
            letter[i] = this.add.renderTexture(100*i+200,100, bannerstyle.fontSize*2, bannerstyle.fontSize*2).setOrigin(0.5);
            letter[i].draw(this.add.text(-1000,-1000,char,bannerstyle).setOrigin(0.5),0,0);
            this.add.text(100*i+200,50*i+800, "i/(bannertext.length-1) * (1-startat*2) + startat = "+(i/(bannertext.length-1) * (1-startat*2) + startat),{fontSize:15,fontFamily:"Verdana"}).setOrigin(0.5)
            }

        });

    }