Last active
July 13, 2016 22:02
-
-
Save kylejlin/a292e596270546acee5832ad0859cbe5 to your computer and use it in GitHub Desktop.
A script to generate the logo for my pixelator.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/** | |
* Copyright (c) 2016 Kyle Lin | |
* This is the script for generating a logo for my pixelator (https://leeryank.github.io/pixelator). | |
* I decided not to use it, and chose the one at https://leeryank.github.io/pixelator/images/favicon.ico instead. | |
* The unpixelated version is at https://leeryank.github.io/pixelator/images/unpixelated-favicon.ico . | |
*/ | |
(function(global, exportName, logoSize, bgColor, Pixelator, pixelSize) { | |
var canvas = document.createElement('canvas'), | |
ctx = canvas.getContext('2d'), | |
gradient, | |
colors = [ | |
'#FF0000', | |
'#FF0000', | |
'#FF0000', | |
'#FF8800', | |
'#FFFF00', | |
'#88FF00', | |
'#00FF00', | |
'#00FF88', | |
'#00FFFF', | |
'#0088FF', | |
'#0000FF', | |
'#8800FF', | |
'#FF00FF', | |
'#FF0088' | |
], | |
numOfColors = colors.length, | |
i = numOfColors; | |
canvas.width = logoSize; | |
canvas.height = logoSize; | |
ctx.fillStyle = bgColor; | |
ctx.fillRect(0, 0, logoSize, logoSize); | |
gradient = ctx.createLinearGradient(3, 0, logoSize, logoSize); // You can substitute the given x argument with your own. | |
while (i--) { | |
gradient.addColorStop(i / (numOfColors + 3), colors[i]); | |
} | |
ctx.fillStyle = gradient; | |
ctx.font = logoSize + 'px sans-serif'; | |
ctx.textAlign = 'left'; | |
ctx.textBaseline = 'top'; | |
ctx.fillText('P', 3, 0, logoSize); // You can substitute the given x argument with your own. | |
global[exportName] = (Pixelator ? (new Pixelator(ctx.getImageData(0, 0, logoSize, logoSize))).pixelate(pixelSize, pixelSize).canvas : canvas); | |
})(window, 'logo', 16, '#FFFFFF', window.Pixelator || null, 2); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment