diff --git a/img/test1.png b/img/test1.png new file mode 100644 index 0000000..78bf98a Binary files /dev/null and b/img/test1.png differ diff --git a/js/texture.js b/js/texture.js new file mode 100644 index 0000000..62516bd --- /dev/null +++ b/js/texture.js @@ -0,0 +1,31 @@ +/* Franz.js - Client side color swatches (Texture library) + * + * @Author Ryan McGrath (http://twitter.com/ryanmcgrath) + * @Author Dominick Pham (http://twitter.com/enotionz) + */ + +var texture = { + /* Temporary, might be consolidated into main library down the road */ + ctx: {}, + canvas: {}, + + /* texture.draw() + * + * @Param: drawingCanvas - id of the canvas to draw on + * @Param: baseImage - base image to use (generally a semi-transparent PNG) + * @Param: colorArray - array of colors to use in the texture (Right now, this only accepts two colors, primary and secondary) + */ + draw: function(drawingCanvas, baseImage, colorArray) { + texture.canvas = document.getElementById(drawingCanvas); + texture.ctx = texture.canvas.getContext('2d'); + + var img = new Image(); + + img.onload = function() { + texture.ctx.fillStyle = colorArray[0]; + texture.ctx.fillRect(0, 0, 50, 50); + texture.ctx.drawImage(img, 0, 0, 50, 50); + } + img.src = baseImage; + } +} diff --git a/texture.php b/texture.php new file mode 100644 index 0000000..e577247 --- /dev/null +++ b/texture.php @@ -0,0 +1,31 @@ + + + + + Franz - client side color palettes from logos + + + + + +

Franz - client side color swatches (Texture testing)

+ +
+ + + + Draw Texture +
+ + + + +