/** * @author Inateno / http://inateno.com / http://dreamirl.com */ /** * @constructor TextRenderer * @augments Renderer * @class draw a text<br> * checkout Renderer for standard parameters * @example var hello = new DE.GameObject( { * x: 500, y: 500, * renderer: new DE.TextRenderer( { * "fillColor": "white", "fontSize": "25", * "textAlign": "left", "font": "Calibri", // lol * "paddingX": 5, "backgroundColor": "blue", * "borderSize": 2, "borderColor": "white" * }, 800, 100, "hello" ) * } ); */ define( [ 'DE.Renderer', 'DE.TextRenderer.render', 'DE.CONFIG', 'DE.Sizes', 'DE.CanvasBuffer', 'DE.ImageManager' ], function( Renderer, TextRender, CONFIG, Sizes, CanvasBuffer, ImageManager ) { function TextRenderer( params, width, height, text ) { Renderer.call( this, params ); if ( !params || !width || !height || text == undefined ) throw new Error( "TextRenderer :: Can't instantiate without params, width, height, text" ); this.text = text; this.textAlign = params.textAlign || "center"; this.textBaseline = params.textBaseline || "middle"; this.fontSize = params.fontSize || 20; this.font = params.font || 'Calibri'; this.sizes = new Sizes( width, height, 1, 1, this ); this.sizes._center(); this.paddingX = params.padding || params.paddingX || 0; this.paddingY = params.padding || params.paddingY || 0; this.backgroundColor = params.backgroundColor; this.borderColor = params.borderColor; this.borderSize = params.borderSize || 1; this.backgroundImage = params.backgroundImage; if ( this.backgroundImage && !ImageManager.images[ this.backgroundImage ] ) { console.log( "TextRenderer :: %cCant find given backgroundImage - " + this.backgroundImage + " check your imagesDatas - ignore background" , "color: red" ); this.backgroundImage = undefined; } if ( this.backgroundImage || this.backgroundColor || this.borderColor ) this.background = true; this.init = function() { this.buffer = new CanvasBuffer( this.sizes.width, this.sizes.height ); this.clearBuffer(); } /*** * @public @clearBuffer clear the buffer and redraw text */ this.clearBuffer = function() { this.buffer.ctx.clearRect( 0, 0, this.sizes.width, this.sizes.height ); this.buffer.ctx.font = ( this.fontSize ) + 'pt ' + ( this.font ); this.buffer.ctx.textAlign = this.textAlign; this.buffer.ctx.textBaseline = this.textBaseline; if ( this.background ) { if ( this.backgroundImage ) this.buffer.ctx.drawImage( ImageManager.images[ this.backgroundImage ] , 0, 0, this.sizes.width, this.sizes.height ); else if ( this.backgroundColor ) { this.buffer.ctx.fillStyle = this.backgroundColor; this.buffer.ctx.fillRect( 0, 0, this.sizes.width, this.sizes.height ); } if ( this.borderColor ) { this.buffer.ctx.lineWidth = this.borderSize; this.buffer.ctx.strokeStyle = this.borderColor; this.buffer.ctx.strokeRect( 0, 0, this.sizes.width, this.sizes.height ); this.buffer.ctx.lineWidth = 1; } } var x = ( this.textAlign == "right" ? this.sizes.width - this.paddingX : this.textAlign == "left" ? this.paddingX : this.sizes.width * 0.5 + this.paddingX >> 0 ); var y = ( this.textBaseline == "bottom" ? this.sizes.height - this.paddingY : this.textBaseline == "top" ? this.paddingY : this.sizes.height * 0.5 + this.paddingY >> 0 ); if ( this.fillColor ) { this.buffer.ctx.fillStyle = this.fillColor; if ( this.forceWidth ) this.buffer.ctx.fillText( this.text, x, y, this.sizes.width ); else this.buffer.ctx.fillText( this.text, x, y ); } if ( this.strokeColor ) { if ( this.fillColor ) this.buffer.ctx.globalAlpha = 0.8; this.buffer.ctx.strokeStyle = this.strokeColor; if ( this.forceWidth ) this.buffer.ctx.strokeText( this.text, x, y, this.sizes.width ); else this.buffer.ctx.fillText( this.text, x, y ); } } this.setText = function( text ) { this.text = text; this.clearBuffer(); this.onSetText( text ); } this.onSetText = function( text ){} /*** * @changeSizes ***/ this.setSizes = function( newWidth, newHeight ) { this.sizes.setSizes( newWidth, newHeight ); } /* // */ this.init( params ); } TextRenderer.prototype = new Renderer(); TextRenderer.prototype.constructor = TextRenderer; TextRenderer.prototype.supr = Renderer.prototype; TextRenderer.prototype.DEName = "TextRenderer"; TextRenderer.prototype.render = TextRender; CONFIG.debug.log( "TextRenderer loaded", 3 ); return TextRenderer; } );