1 /** 2 A class that display a repeating texture that can optionall be offset in either 3 the x or y axis 4 @author <a href="mailto:matthewcasperson@gmail.com">Matthew Casperson</a> 5 @class 6 */ 7 function RepeatingGameObject() 8 { 9 /** The width that the final image will take up 10 @type Number 11 */ 12 this.width = 0; 13 /** The height that the final image will take up 14 @type Number 15 */ 16 this.height = 0; 17 /** How much of the scrollX and scrollY to apply when drawing 18 @type Number 19 */ 20 this.scrollFactor = 1; 21 22 /** 23 Initialises this object 24 @return A reference to the initialised object 25 */ 26 this.startupRepeatingGameObject = function(image, x, y, z, width, height, scrollFactor) 27 { 28 this.startupVisualGameObject(image, x, y, z); 29 this.width = width; 30 this.height = height; 31 this.scrollFactor = scrollFactor; 32 return this; 33 } 34 35 /** 36 Clean this object up 37 */ 38 this.shutdownstartupRepeatingGameObject = function() 39 { 40 this.shutdownVisualGameObject(); 41 } 42 43 /** 44 Draws this element to the back buffer 45 @param dt Time in seconds since the last frame 46 @param context The context to draw to 47 @param xScroll The global scrolling value of the x axis 48 @param yScroll The global scrolling value of the y axis 49 */ 50 this.draw = function(dt, canvas, xScroll, yScroll) 51 { 52 var areaDrawn = [0, 0]; 53 54 for (var y = 0; y < this.height; y += areaDrawn[1]) 55 { 56 for (var x = 0; x < this.width; x += areaDrawn[0]) 57 { 58 // the top left corner to start drawing the next tile from 59 var newPosition = [this.x + x, this.y + y]; 60 // the amount of space left in which to draw 61 var newFillArea = [this.width - x, this.height - y]; 62 // the first time around you have to start drawing from the middle of the image 63 // subsequent tiles alwyas get drawn from the top or left 64 var newScrollPosition = [0, 0]; 65 if (x==0) newScrollPosition[0] = xScroll * this.scrollFactor; 66 if (y==0) newScrollPosition[1] = yScroll * this.scrollFactor; 67 areaDrawn = this.drawRepeat(canvas, newPosition, newFillArea, newScrollPosition); 68 } 69 } 70 } 71 72 this.drawRepeat = function(canvas, newPosition, newFillArea, newScrollPosition) 73 { 74 // find where in our repeating texture to start drawing (the top left corner) 75 var xOffset = Math.abs(newScrollPosition[0]) % this.image.width; 76 var yOffset = Math.abs(newScrollPosition[1]) % this.image.height; 77 var left = newScrollPosition[0]<0?this.image.width-xOffset:xOffset; 78 var top = newScrollPosition[1]<0?this.image.height-yOffset:yOffset; 79 var width = newFillArea[0] < this.image.width-left?newFillArea[0]:this.image.width-left; 80 var height = newFillArea[1] < this.image.height-top?newFillArea[1]:this.image.height-top; 81 82 // draw the image 83 canvas.drawImage(this.image, left, top, width, height, newPosition[0], newPosition[1], width, height); 84 85 return [width, height]; 86 } 87 88 89 } 90 RepeatingGameObject.prototype = new VisualGameObject();