Fill areas drawn by bezier curves?

[spinnerbox]

I am using this code:

var sp = new phaser.Point(frmX, frmY + halfCupboardDepth + thickness),
    mp = new phaser.Point(frmX, frmY),
    ep = new phaser.Point(leftWallShiftX, frmY);

frnConstr.Utility.drawBezierCurve(graphics, sp, mp, ep, 1, borderColor, 1);

ep = new phaser.Point(frmX, frmX, frmY + halfCupboardDepth + thickness * 2);
mp = new phaser.Point(frmX, frmY + thickness);
ep = new phaser.Point(leftWallShiftX, frmY + thickness);
frnConstr.Utility.drawBezierCurve(graphics, sp, mp, ep, 1, borderColor, 1);

where: drawBezierCurve() is:

drawBezierCurve: function (graphics, sp, mp, ep, borderWidth, borderColor, borderAlpha) {
    graphics.lineStyle(borderWidth, borderColor, borderAlpha);
    graphics.moveTo(sp.x, sp.y);
    graphics.bezierCurveTo(sp.x, sp.y, mp.x, mp.y, ep.x, ep.y);
}

An it is drawing this drawing:

Yes the green areas were drawn by other code but the above code draws just curved lines. I would like to fill the area between those two curves and 

the area below the second curve in-between the green area and the second curve. 

How can I do that? Should I draw first rectangle and then call bezierCurveTo() to make it curved.

Well tried with polygon but it didn't do the trick. What do i miss?

[spinnerbox]

Could I possibly take a list of points on the bezier curve and draw polygon with those points?

Is there some sort of getPointOnCurve() method?

 

[Fatalist]

Have you tried beginFill/endFill?

[spinnerbox]

Ok. Improvement

But how to add another point to fill the leftover triangle?

[spinnerbox]

By using moveTo() and lineTo() methods I got to this result:

But cannot accept it because of the strike-trough line. Need it in one piece white. I basically drew triangle below the curved area of white.

[Fatalist]

So you did endFill 2 times? Do it only once in the end:

beginFill

moveTo  / lineTo

bezierCurveTo...

endFill

 

[spinnerbox]

Ok I removed the commented out line and it worked. So yes it is possible. Thanks

graphics.beginFill(0xffffff, 1);
graphics.lineStyle(borderWidth, borderColor, borderAlpha);
graphics.moveTo(sp.x, sp.y);
graphics.bezierCurveTo(sp.x, sp.y, mp.x, mp.y, ep.x, ep.y);
// graphics.moveTo(ep.x, ep.y); I removed this one
graphics.lineTo(ep.x, sp.y);
graphics.lineTo(sp.x, sp.y);
graphics.endFill();

 

[Fatalist]

No problem, glad it worked.