The HTML5 Canvas Text API - HTML5 Canvas - page 115

//Box
context.strokeStyle = "#000000";
context.strokeRect(5, 5, theCanvas.width-10, theCanvas.height-10);
//Text
context.textBaseline = textBaseline;
context.textAlign = textAlign;
context.font = fontWeight + " " + fontStyle + " " + fontSize + "px " + fontFace;
context.shadowColor = shadowColor;
context.shadowOffsetX = shadowX;
context.shadowOffsetY = shadowY;
context.shadowBlur = shadowBlur;
context.globalAlpha = textAlpha;
var xPosition = (theCanvas.width/2);
var yPosition = (theCanvas.height/2);
var metrics = context.measureText(message);
var textWidth = metrics.width;
var tempColor;
if (fillType == "colorFill") {
tempColor = textFillColor;
} else if (fillType == "linearGradient") {
var gradient = context.createLinearGradient(xPosition-
textWidth/2, yPosition, textWidth, yPosition);
gradient.addColorStop(0,textFillColor);
gradient.addColorStop(.6,textFillColor2);
tempColor = gradient;
} else if (fillType == "radialGradient") {
var gradient = context.createRadialGradient(xPosition, yPosition,
fontSize, xPosition+textWidth, yPosition, 1);
gradient.addColorStop(0,textFillColor);
gradient.addColorStop(.6,textFillColor2);
tempColor = gradient;
} else if (fillType == "pattern") {
var tempColor = context.createPattern(pattern,"repeat")
} else {
tempColor = textFillColor;
}
switch(fillOrStroke) {
case "fill":
context.fillStyle = tempColor;
context.fillText (message, xPosition,yPosition);
break;
case "stroke":
context.strokeStyle = tempColor;
context.strokeText (message, xPosition,yPosition);
break;
case "both":
context.fillStyle = tempColor;
context.fillText (message, xPosition,yPosition);
context.strokeStyle = "#000000";