mirror of
				https://git.sleeping.town/mirrors/foxy-moxy
				synced 2025-11-03 18:12:17 -08:00 
			
		
		
		
	Linting with "test"
This commit is contained in:
		
							parent
							
								
									e32a19b954
								
							
						
					
					
						commit
						c5a8acc12d
					
				
					 6 changed files with 219 additions and 211 deletions
				
			
		
							
								
								
									
										11
									
								
								circle.yml
									
										
									
									
									
										Normal file
									
								
							
							
						
						
									
										11
									
								
								circle.yml
									
										
									
									
									
										Normal file
									
								
							| 
						 | 
					@ -0,0 +1,11 @@
 | 
				
			||||||
 | 
					dependencies:
 | 
				
			||||||
 | 
					  pre:
 | 
				
			||||||
 | 
					    - sudo apt-get install libgif-dev
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					machine:
 | 
				
			||||||
 | 
					  node:
 | 
				
			||||||
 | 
					    version: 6.7.0
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					test:
 | 
				
			||||||
 | 
					  override:
 | 
				
			||||||
 | 
					    - npm run lint
 | 
				
			||||||
| 
						 | 
					@ -7,10 +7,10 @@ const bg = {
 | 
				
			||||||
  green: '#63D6A3',
 | 
					  green: '#63D6A3',
 | 
				
			||||||
  blue: '#358EFF',
 | 
					  blue: '#358EFF',
 | 
				
			||||||
  salmon: '#FF9B7A',
 | 
					  salmon: '#FF9B7A',
 | 
				
			||||||
    coral:      '#F96854',
 | 
					  coral: '#F96854'
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
module.exports = {
 | 
					module.exports = {
 | 
				
			||||||
  head: head,
 | 
					  head: head,
 | 
				
			||||||
  bg: bg
 | 
					  bg: bg
 | 
				
			||||||
};
 | 
					}
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
							
								
								
									
										50
									
								
								js/fox.js
									
										
									
									
									
								
							
							
						
						
									
										50
									
								
								js/fox.js
									
										
									
									
									
								
							| 
						 | 
					@ -1,25 +1,21 @@
 | 
				
			||||||
const Chance = require('chance');
 | 
					const Chance = require('chance')
 | 
				
			||||||
const colors = require('./constants/colors.js');
 | 
					const colors = require('./constants/colors.js')
 | 
				
			||||||
 | 
					
 | 
				
			||||||
const hsl = function (h, s, l) {
 | 
					const hsl = function (h, s, l) {
 | 
				
			||||||
  return "hsl(" + h + "," + s + "%, " + l + "%)";
 | 
					  return 'hsl(' + h + ',' + s + '%, ' + l + '%)'
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
const Fox = function (IMG_WIDTH, IMG_HEIGHT, seed) {
 | 
					const Fox = function (IMG_WIDTH, IMG_HEIGHT, seed) {
 | 
				
			||||||
  if (seed) {
 | 
					  const chance = seed ? new Chance(seed) : new Chance()
 | 
				
			||||||
    chance = new Chance(seed);
 | 
					 | 
				
			||||||
  } else {
 | 
					 | 
				
			||||||
    chance = new Chance();
 | 
					 | 
				
			||||||
  }
 | 
					 | 
				
			||||||
 | 
					
 | 
				
			||||||
  // origin: head top left corner
 | 
					  // origin: head top left corner
 | 
				
			||||||
  const kappa = chance.floating({min: 0.2, max: 0.45})
 | 
					  const kappa = chance.floating({min: 0.2, max: 0.45})
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  const headColor = (function () {
 | 
					  const headColor = (function () {
 | 
				
			||||||
      const level = chance.floating({min: 0, max: 1});
 | 
					    const level = chance.floating({min: 0, max: 1})
 | 
				
			||||||
      const result = [];
 | 
					    const result = []
 | 
				
			||||||
      const min = colors.head.brick;
 | 
					    const min = colors.head.brick
 | 
				
			||||||
      const max = colors.head.yellow;
 | 
					    const max = colors.head.yellow
 | 
				
			||||||
    for (let i = 0; i < min.length; i++) {
 | 
					    for (let i = 0; i < min.length; i++) {
 | 
				
			||||||
      result.push(min[i] + (max[i] - min[i]) * level)
 | 
					      result.push(min[i] + (max[i] - min[i]) * level)
 | 
				
			||||||
    }
 | 
					    }
 | 
				
			||||||
| 
						 | 
					@ -30,14 +26,14 @@ const Fox = function (IMG_WIDTH, IMG_HEIGHT, seed) {
 | 
				
			||||||
    width: 0.6 * IMG_WIDTH,
 | 
					    width: 0.6 * IMG_WIDTH,
 | 
				
			||||||
    height: 0.6 * IMG_HEIGHT,
 | 
					    height: 0.6 * IMG_HEIGHT,
 | 
				
			||||||
    kappa: kappa,
 | 
					    kappa: kappa,
 | 
				
			||||||
    color: headColor,
 | 
					    color: headColor
 | 
				
			||||||
  }
 | 
					  }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  const origin = {x: IMG_WIDTH / 2 - head.width / 2, y: 0.5 * IMG_HEIGHT - head.height / 2};
 | 
					  const origin = {x: IMG_WIDTH / 2 - head.width / 2, y: 0.5 * IMG_HEIGHT - head.height / 2}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  const ears = (function (origin, headWidth, headHeight, headColor) {
 | 
					  const ears = (function (origin, headWidth, headHeight, headColor) {
 | 
				
			||||||
    const offsetX = chance.floating({min: 0.17 * headWidth, max: 0.2 * headWidth});
 | 
					    const offsetX = chance.floating({min: 0.17 * headWidth, max: 0.2 * headWidth})
 | 
				
			||||||
    const angle = chance.floating({min: 0.05 * Math.PI, max: 0.2 * Math.PI});
 | 
					    const angle = chance.floating({min: 0.05 * Math.PI, max: 0.2 * Math.PI})
 | 
				
			||||||
    return {
 | 
					    return {
 | 
				
			||||||
      color: headColor,
 | 
					      color: headColor,
 | 
				
			||||||
      kappa: 0.9 * kappa,
 | 
					      kappa: 0.9 * kappa,
 | 
				
			||||||
| 
						 | 
					@ -55,15 +51,15 @@ const Fox = function (IMG_WIDTH, IMG_HEIGHT, seed) {
 | 
				
			||||||
        width: 0.4 * headWidth,
 | 
					        width: 0.4 * headWidth,
 | 
				
			||||||
        height: 0.8 * headHeight
 | 
					        height: 0.8 * headHeight
 | 
				
			||||||
      }
 | 
					      }
 | 
				
			||||||
    };
 | 
					    }
 | 
				
			||||||
  }(origin, head.width, head.height, head.color));
 | 
					  }(origin, head.width, head.height, head.color))
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  const eyes = (function (origin, headWidth, headHeight) {
 | 
					  const eyes = (function (origin, headWidth, headHeight) {
 | 
				
			||||||
    // TODO: color
 | 
					    // TODO: color
 | 
				
			||||||
    const offsetY = chance.floating({min: -0.05 * headHeight, max: -0.025 * headHeight});
 | 
					    const offsetY = chance.floating({min: -0.05 * headHeight, max: -0.025 * headHeight})
 | 
				
			||||||
    const offsetX = chance.floating({min: 0.13 * headWidth, max: 0.25 * headWidth});
 | 
					    const offsetX = chance.floating({min: 0.13 * headWidth, max: 0.25 * headWidth})
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    const eyeHeight = chance.floating({min: 0.08 * headHeight, max: 0.13 * headHeight});
 | 
					    const eyeHeight = chance.floating({min: 0.08 * headHeight, max: 0.13 * headHeight})
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    return {
 | 
					    return {
 | 
				
			||||||
      height: eyeHeight,
 | 
					      height: eyeHeight,
 | 
				
			||||||
| 
						 | 
					@ -79,7 +75,7 @@ const Fox = function (IMG_WIDTH, IMG_HEIGHT, seed) {
 | 
				
			||||||
        y: origin.y + (headHeight / 2) + offsetY
 | 
					        y: origin.y + (headHeight / 2) + offsetY
 | 
				
			||||||
      }
 | 
					      }
 | 
				
			||||||
    }
 | 
					    }
 | 
				
			||||||
  }(origin, head.width, head.height));
 | 
					  }(origin, head.width, head.height))
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  const nose = {
 | 
					  const nose = {
 | 
				
			||||||
    x: origin.x + (head.width / 2),
 | 
					    x: origin.x + (head.width / 2),
 | 
				
			||||||
| 
						 | 
					@ -100,20 +96,20 @@ const Fox = function (IMG_WIDTH, IMG_HEIGHT, seed) {
 | 
				
			||||||
    width: chance.floating({min: 0.5 * IMG_WIDTH, max: IMG_WIDTH}),
 | 
					    width: chance.floating({min: 0.5 * IMG_WIDTH, max: IMG_WIDTH}),
 | 
				
			||||||
    height: chance.floating({min: 1.7 * (IMG_HEIGHT - eyes.left.y), max: 1.85 * (IMG_HEIGHT - eyes.left.y)})
 | 
					    height: chance.floating({min: 1.7 * (IMG_HEIGHT - eyes.left.y), max: 1.85 * (IMG_HEIGHT - eyes.left.y)})
 | 
				
			||||||
  }
 | 
					  }
 | 
				
			||||||
  head.mask = mask;
 | 
					  head.mask = mask
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  return {
 | 
					  return {
 | 
				
			||||||
    canvas: {
 | 
					    canvas: {
 | 
				
			||||||
      height: IMG_HEIGHT,
 | 
					      height: IMG_HEIGHT,
 | 
				
			||||||
      width: IMG_WIDTH,
 | 
					      width: IMG_WIDTH,
 | 
				
			||||||
      color: chance.pickone(Object.keys(colors.bg).map(function (key) {return colors.bg[key];}))
 | 
					      color: chance.pickone(Object.keys(colors.bg).map(function (key) { return colors.bg[key] }))
 | 
				
			||||||
    },
 | 
					    },
 | 
				
			||||||
    head: head,
 | 
					    head: head,
 | 
				
			||||||
    ears: ears,
 | 
					    ears: ears,
 | 
				
			||||||
    eyes: eyes,
 | 
					    eyes: eyes,
 | 
				
			||||||
    nose: nose,
 | 
					    nose: nose,
 | 
				
			||||||
    mouth: mouth
 | 
					    mouth: mouth
 | 
				
			||||||
  };
 | 
					  }
 | 
				
			||||||
};
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
module.exports = Fox;
 | 
					module.exports = Fox
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
							
								
								
									
										189
									
								
								js/render-fox.js
									
										
									
									
									
								
							
							
						
						
									
										189
									
								
								js/render-fox.js
									
										
									
									
									
								
							| 
						 | 
					@ -1,36 +1,36 @@
 | 
				
			||||||
const renderFox = function (canvas, opts) {
 | 
					const renderFox = function (canvas, opts) {
 | 
				
			||||||
    const width = opts.canvas.width;
 | 
					  const width = opts.canvas.width
 | 
				
			||||||
    const height = opts.canvas.height;
 | 
					  const height = opts.canvas.height
 | 
				
			||||||
    const ctx = canvas.getContext('2d');
 | 
					  const ctx = canvas.getContext('2d')
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    ctx.fillStyle = opts.canvas.color;
 | 
					  ctx.fillStyle = opts.canvas.color
 | 
				
			||||||
    ctx.fillRect(0, 0, width, height);
 | 
					  ctx.fillRect(0, 0, width, height)
 | 
				
			||||||
    renderEars(ctx, opts.ears);
 | 
					  renderEars(ctx, opts.ears)
 | 
				
			||||||
    renderHead(ctx, opts.head);
 | 
					  renderHead(ctx, opts.head)
 | 
				
			||||||
    renderEyes(ctx, opts.eyes);
 | 
					  renderEyes(ctx, opts.eyes)
 | 
				
			||||||
    renderNose(ctx, opts.nose);
 | 
					  renderNose(ctx, opts.nose)
 | 
				
			||||||
    renderMouth(ctx, opts.mouth);
 | 
					  renderMouth(ctx, opts.mouth)
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    shift_canvas(ctx, width, height, 0, 0.06 * height);
 | 
					  shiftCanvas(ctx, width, height, 0, 0.06 * height)
 | 
				
			||||||
};
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
function shift_canvas(ctx, w, h, dx, dy) {
 | 
					function shiftCanvas (ctx, w, h, dx, dy) {
 | 
				
			||||||
  const topImage = ctx.getImageData(0, 0, w, h);
 | 
					  const topImage = ctx.getImageData(0, 0, w, h)
 | 
				
			||||||
  const bottomImage = ctx.getImageData(0, h - dy, w, h);
 | 
					  const bottomImage = ctx.getImageData(0, h - dy, w, h)
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  ctx.clearRect(0, 0, w, h);
 | 
					  ctx.clearRect(0, 0, w, h)
 | 
				
			||||||
  ctx.putImageData(bottomImage, 0, 0);
 | 
					  ctx.putImageData(bottomImage, 0, 0)
 | 
				
			||||||
  ctx.putImageData(topImage, dx, dy);
 | 
					  ctx.putImageData(topImage, dx, dy)
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
function renderHead (ctx, opts) {
 | 
					function renderHead (ctx, opts) {
 | 
				
			||||||
    ctx.save();
 | 
					  ctx.save()
 | 
				
			||||||
    ctx.translate(ctx.canvas.width/2, ctx.canvas.height/2);
 | 
					  ctx.translate(ctx.canvas.width / 2, ctx.canvas.height / 2)
 | 
				
			||||||
    ctx.rotate(Math.PI / 4);
 | 
					  ctx.rotate(Math.PI / 4)
 | 
				
			||||||
    drawEllipseByCenter(ctx, 0, 0, opts.width, opts.height, opts.color, null, opts.kappa);
 | 
					  drawEllipseByCenter(ctx, 0, 0, opts.width, opts.height, opts.color, null, opts.kappa)
 | 
				
			||||||
    ctx.restore();
 | 
					  ctx.restore()
 | 
				
			||||||
    ctx.clip();
 | 
					  ctx.clip()
 | 
				
			||||||
    drawEllipseByCenter(ctx, ctx.canvas.width / 2, ctx.canvas.height, opts.mask.width, opts.mask.height, '#fff', '#fff', 0.5);
 | 
					  drawEllipseByCenter(ctx, ctx.canvas.width / 2, ctx.canvas.height, opts.mask.width, opts.mask.height, '#fff', '#fff', 0.5)
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
function renderEars (ctx, opts) {
 | 
					function renderEars (ctx, opts) {
 | 
				
			||||||
| 
						 | 
					@ -38,73 +38,72 @@ function renderEars(ctx, opts) {
 | 
				
			||||||
    x: ctx.canvas.width / 2,
 | 
					    x: ctx.canvas.width / 2,
 | 
				
			||||||
    y: ctx.canvas.height / 2
 | 
					    y: ctx.canvas.height / 2
 | 
				
			||||||
  }
 | 
					  }
 | 
				
			||||||
    ctx.save();
 | 
					  ctx.save()
 | 
				
			||||||
    ctx.translate(offset.x, offset.y);
 | 
					  ctx.translate(offset.x, offset.y)
 | 
				
			||||||
    ctx.rotate(-opts.left.angle);
 | 
					  ctx.rotate(-opts.left.angle)
 | 
				
			||||||
    drawEllipseByCenter(ctx, opts.left.x - offset.x, opts.left.y - offset.y, opts.left.width, opts.left.height, opts.color, null, opts.kappa);
 | 
					  drawEllipseByCenter(ctx, opts.left.x - offset.x, opts.left.y - offset.y, opts.left.width, opts.left.height, opts.color, null, opts.kappa)
 | 
				
			||||||
    ctx.restore();
 | 
					  ctx.restore()
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    ctx.save();
 | 
					  ctx.save()
 | 
				
			||||||
    ctx.translate(offset.x, offset.y);
 | 
					  ctx.translate(offset.x, offset.y)
 | 
				
			||||||
    ctx.rotate(-opts.right.angle);
 | 
					  ctx.rotate(-opts.right.angle)
 | 
				
			||||||
    drawEllipseByCenter(ctx, opts.right.x - offset.x, opts.right.y - offset.y, opts.right.width, opts.right.height, opts.color, null, opts.kappa);
 | 
					  drawEllipseByCenter(ctx, opts.right.x - offset.x, opts.right.y - offset.y, opts.right.width, opts.right.height, opts.color, null, opts.kappa)
 | 
				
			||||||
    ctx.restore();
 | 
					  ctx.restore()
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
function renderEyes (ctx, opts) {
 | 
					function renderEyes (ctx, opts) {
 | 
				
			||||||
  switch (opts.style) {
 | 
					  switch (opts.style) {
 | 
				
			||||||
      case "ellipse":
 | 
					    case 'ellipse':
 | 
				
			||||||
        drawEllipseByCenter(ctx, opts.left.x, opts.left.y, opts.width, opts.height, "black", null, 0.5);
 | 
					      drawEllipseByCenter(ctx, opts.left.x, opts.left.y, opts.width, opts.height, 'black', null, 0.5)
 | 
				
			||||||
        drawEllipseByCenter(ctx, opts.right.x, opts.right.y, opts.width, opts.height, "black", null, 0.5);
 | 
					      drawEllipseByCenter(ctx, opts.right.x, opts.right.y, opts.width, opts.height, 'black', null, 0.5)
 | 
				
			||||||
        break;
 | 
					      break
 | 
				
			||||||
      case "smiley":
 | 
					    case 'smiley':
 | 
				
			||||||
        ctx.strokeStyle = "black";
 | 
					      ctx.strokeStyle = 'black'
 | 
				
			||||||
        ctx.beginPath();
 | 
					      ctx.beginPath()
 | 
				
			||||||
        ctx.moveTo(opts.left.x - opts.width, opts.left.y + opts.height);
 | 
					      ctx.moveTo(opts.left.x - opts.width, opts.left.y + opts.height)
 | 
				
			||||||
        ctx.bezierCurveTo(opts.left.x - opts.width, opts.left.y + opts.height, opts.left.x, opts.left.y, opts.left.x + opts.width, opts.left.y + opts.height);
 | 
					      ctx.bezierCurveTo(opts.left.x - opts.width, opts.left.y + opts.height, opts.left.x, opts.left.y, opts.left.x + opts.width, opts.left.y + opts.height)
 | 
				
			||||||
        ctx.lineWidth = 2;
 | 
					      ctx.lineWidth = 2
 | 
				
			||||||
        ctx.stroke();
 | 
					      ctx.stroke()
 | 
				
			||||||
        ctx.closePath();
 | 
					      ctx.closePath()
 | 
				
			||||||
 | 
					
 | 
				
			||||||
        ctx.beginPath();
 | 
					      ctx.beginPath()
 | 
				
			||||||
        ctx.moveTo(opts.right.x - opts.width, opts.right.y + opts.height);
 | 
					      ctx.moveTo(opts.right.x - opts.width, opts.right.y + opts.height)
 | 
				
			||||||
        ctx.bezierCurveTo(opts.right.x - opts.width, opts.right.y + opts.height, opts.right.x, opts.right.y, opts.right.x + opts.width, opts.right.y + opts.height);
 | 
					      ctx.bezierCurveTo(opts.right.x - opts.width, opts.right.y + opts.height, opts.right.x, opts.right.y, opts.right.x + opts.width, opts.right.y + opts.height)
 | 
				
			||||||
        ctx.lineWidth = 2;
 | 
					      ctx.lineWidth = 2
 | 
				
			||||||
        ctx.stroke();
 | 
					      ctx.stroke()
 | 
				
			||||||
        ctx.closePath();
 | 
					      ctx.closePath()
 | 
				
			||||||
        break;
 | 
					      break
 | 
				
			||||||
      case "none":
 | 
					    case 'none':
 | 
				
			||||||
        break;
 | 
					      break
 | 
				
			||||||
  }
 | 
					  }
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
function renderNose (ctx, opts) {
 | 
					function renderNose (ctx, opts) {
 | 
				
			||||||
 | 
					  ctx.strokeStyle = 'black'
 | 
				
			||||||
  ctx.strokeStyle = "black";
 | 
					  ctx.beginPath()
 | 
				
			||||||
  ctx.beginPath();
 | 
					  ctx.moveTo(opts.x - opts.width / 2, opts.y - opts.height / 2)
 | 
				
			||||||
  ctx.moveTo(opts.x - opts.width/2, opts.y - opts.height/2);
 | 
					  ctx.bezierCurveTo(opts.x - opts.width / 2, opts.y - opts.height / 2, opts.x, opts.y - opts.height, opts.x + opts.width / 2, opts.y - opts.height / 2)
 | 
				
			||||||
  ctx.bezierCurveTo(opts.x - opts.width/2, opts.y - opts.height/2, opts.x, opts.y - opts.height, opts.x + opts.width/2, opts.y - opts.height/2);
 | 
					  ctx.bezierCurveTo(opts.x + opts.width / 2, opts.y - opts.height / 2, opts.x + opts.width / 2, opts.y + opts.height / 2, opts.x, opts.y + opts.height / 2)
 | 
				
			||||||
  ctx.bezierCurveTo(opts.x + opts.width/2, opts.y - opts.height/2, opts.x + opts.width/2, opts.y + opts.height/2, opts.x, opts.y + opts.height/2);
 | 
					  ctx.bezierCurveTo(opts.x, opts.y + opts.height / 2, opts.x - opts.width / 2, opts.y + opts.height / 2, opts.x - opts.width / 2, opts.y - opts.height / 2)
 | 
				
			||||||
  ctx.bezierCurveTo(opts.x, opts.y + opts.height/2, opts.x - opts.width/2, opts.y + opts.height/2, opts.x - opts.width/2, opts.y - opts.height/2);
 | 
					  ctx.fillStyle = 'black'
 | 
				
			||||||
  ctx.fillStyle = "black";
 | 
					  ctx.fill()
 | 
				
			||||||
  ctx.fill();
 | 
					  ctx.stroke()
 | 
				
			||||||
  ctx.stroke();
 | 
					 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
function renderMouth (ctx, opts) {
 | 
					function renderMouth (ctx, opts) {
 | 
				
			||||||
  ctx.strokeStyle = "black";
 | 
					  ctx.strokeStyle = 'black'
 | 
				
			||||||
  ctx.lineWidth = 0.01 * ctx.canvas.width;
 | 
					  ctx.lineWidth = 0.01 * ctx.canvas.width
 | 
				
			||||||
  ctx.beginPath();
 | 
					  ctx.beginPath()
 | 
				
			||||||
  switch (opts.style) {
 | 
					  switch (opts.style) {
 | 
				
			||||||
    case "smirk":
 | 
					    case 'smirk':
 | 
				
			||||||
      ctx.moveTo(opts.x - opts.width/2, opts.y - opts.height/2);
 | 
					      ctx.moveTo(opts.x - opts.width / 2, opts.y - opts.height / 2)
 | 
				
			||||||
      ctx.bezierCurveTo(opts.x - opts.width / 2, opts.y - opts.height / 2,
 | 
					      ctx.bezierCurveTo(opts.x - opts.width / 2, opts.y - opts.height / 2,
 | 
				
			||||||
        opts.x - opts.width / 2, opts.y + opts.height / 2,
 | 
					        opts.x - opts.width / 2, opts.y + opts.height / 2,
 | 
				
			||||||
        opts.x + opts.width / 2, opts.y
 | 
					        opts.x + opts.width / 2, opts.y
 | 
				
			||||||
      )
 | 
					      )
 | 
				
			||||||
      break;
 | 
					      break
 | 
				
			||||||
    case "cat":
 | 
					    case 'cat':
 | 
				
			||||||
      ctx.moveTo(opts.x - opts.width/2, opts.y + opts.height/2);
 | 
					      ctx.moveTo(opts.x - opts.width / 2, opts.y + opts.height / 2)
 | 
				
			||||||
      ctx.bezierCurveTo(opts.x - opts.width / 2, opts.y + opts.height / 2,
 | 
					      ctx.bezierCurveTo(opts.x - opts.width / 2, opts.y + opts.height / 2,
 | 
				
			||||||
        opts.x, opts.y + opts.height / 2,
 | 
					        opts.x, opts.y + opts.height / 2,
 | 
				
			||||||
        opts.x, opts.y - opts.height / 2
 | 
					        opts.x, opts.y - opts.height / 2
 | 
				
			||||||
| 
						 | 
					@ -114,38 +113,38 @@ function renderMouth(ctx, opts) {
 | 
				
			||||||
        opts.x, opts.y + opts.height / 2,
 | 
					        opts.x, opts.y + opts.height / 2,
 | 
				
			||||||
        opts.x + opts.width / 2, opts.y + opts.height / 2
 | 
					        opts.x + opts.width / 2, opts.y + opts.height / 2
 | 
				
			||||||
      )
 | 
					      )
 | 
				
			||||||
      break;
 | 
					      break
 | 
				
			||||||
  }
 | 
					  }
 | 
				
			||||||
  ctx.stroke();
 | 
					  ctx.stroke()
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
function drawEllipseByCenter (ctx, cx, cy, w, h, color, fillColor, kappa) {
 | 
					function drawEllipseByCenter (ctx, cx, cy, w, h, color, fillColor, kappa) {
 | 
				
			||||||
  drawEllipse(ctx, cx - w/2.0, cy - h/2.0, w, h, color, fillColor, kappa);
 | 
					  drawEllipse(ctx, cx - w / 2.0, cy - h / 2.0, w, h, color, fillColor, kappa)
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
function drawEllipse (ctx, x, y, w, h, color, fillColor, kappa = 0.3) {
 | 
					function drawEllipse (ctx, x, y, w, h, color, fillColor, kappa = 0.3) {
 | 
				
			||||||
  const ox = (w / 2) * kappa; // control point offset horizontal
 | 
					  const ox = (w / 2) * kappa // control point offset horizontal
 | 
				
			||||||
  const oy = (h / 2) * kappa; // control point offset vertical
 | 
					  const oy = (h / 2) * kappa // control point offset vertical
 | 
				
			||||||
  const xe = x + w;           // x-end
 | 
					  const xe = x + w           // x-end
 | 
				
			||||||
  const ye = y + h;           // y-end
 | 
					  const ye = y + h           // y-end
 | 
				
			||||||
  const xm = x + w / 2;       // x-middle
 | 
					  const xm = x + w / 2       // x-middle
 | 
				
			||||||
  const ym = y + h / 2;       // y-middle
 | 
					  const ym = y + h / 2       // y-middle
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  if (color) {
 | 
					  if (color) {
 | 
				
			||||||
    ctx.strokeStyle = color;
 | 
					    ctx.strokeStyle = color
 | 
				
			||||||
  }
 | 
					  }
 | 
				
			||||||
  ctx.beginPath();
 | 
					  ctx.beginPath()
 | 
				
			||||||
  ctx.moveTo(x, ym);
 | 
					  ctx.moveTo(x, ym)
 | 
				
			||||||
  ctx.bezierCurveTo(x, ym - oy, xm - ox, y, xm, y);
 | 
					  ctx.bezierCurveTo(x, ym - oy, xm - ox, y, xm, y)
 | 
				
			||||||
  ctx.bezierCurveTo(xm + ox, y, xe, ym - oy, xe, ym);
 | 
					  ctx.bezierCurveTo(xm + ox, y, xe, ym - oy, xe, ym)
 | 
				
			||||||
  ctx.bezierCurveTo(xe, ym + oy, xm + ox, ye, xm, ye);
 | 
					  ctx.bezierCurveTo(xe, ym + oy, xm + ox, ye, xm, ye)
 | 
				
			||||||
  ctx.bezierCurveTo(xm - ox, ye, x, ym + oy, x, ym);
 | 
					  ctx.bezierCurveTo(xm - ox, ye, x, ym + oy, x, ym)
 | 
				
			||||||
  fillColor = fillColor || color;
 | 
					  fillColor = fillColor || color
 | 
				
			||||||
  if (fillColor) {
 | 
					  if (fillColor) {
 | 
				
			||||||
    ctx.fillStyle = fillColor;
 | 
					    ctx.fillStyle = fillColor
 | 
				
			||||||
    ctx.fill();
 | 
					    ctx.fill()
 | 
				
			||||||
  }
 | 
					  }
 | 
				
			||||||
  ctx.stroke();
 | 
					  ctx.stroke()
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
module.exports = renderFox;
 | 
					module.exports = renderFox
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
							
								
								
									
										14
									
								
								run.js
									
										
									
									
									
								
							
							
						
						
									
										14
									
								
								run.js
									
										
									
									
									
								
							| 
						 | 
					@ -1,13 +1,13 @@
 | 
				
			||||||
const cluster = require('express-cluster');
 | 
					const cluster = require('express-cluster')
 | 
				
			||||||
const app = require('./server.js');
 | 
					const app = require('./server.js')
 | 
				
			||||||
 | 
					
 | 
				
			||||||
const activePort = process.env.PORT || 3000;
 | 
					const activePort = process.env.PORT || 3000
 | 
				
			||||||
 | 
					
 | 
				
			||||||
cluster((worker) => {
 | 
					cluster((worker) => {
 | 
				
			||||||
  app.listen(activePort, () => {
 | 
					  app.listen(activePort, () => {
 | 
				
			||||||
        console.log('worker ' + worker.id + ' is listening on port ' + activePort);
 | 
					    console.log('worker ' + worker.id + ' is listening on port ' + activePort)
 | 
				
			||||||
    });
 | 
					  })
 | 
				
			||||||
}, {
 | 
					}, {
 | 
				
			||||||
  'respawn': true, // workers will restart on failure
 | 
					  'respawn': true, // workers will restart on failure
 | 
				
			||||||
    'verbose': true, // logs what happens to console
 | 
					  'verbose': true // logs what happens to console
 | 
				
			||||||
});
 | 
					})
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
							
								
								
									
										58
									
								
								server.js
									
										
									
									
									
								
							
							
						
						
									
										58
									
								
								server.js
									
										
									
									
									
								
							| 
						 | 
					@ -1,42 +1,44 @@
 | 
				
			||||||
 | 
					/* eslint no-unused-vars: ["error", { "varsIgnorePattern": "newrelic" }] */
 | 
				
			||||||
 | 
					
 | 
				
			||||||
try {
 | 
					try {
 | 
				
			||||||
  const newrelic = require('newrelic');
 | 
					  const newrelic = require('newrelic')
 | 
				
			||||||
} catch (e) {
 | 
					} catch (e) {
 | 
				
			||||||
  console.error("WARNING unable to load newrelic")
 | 
					  console.error('WARNING unable to load newrelic')
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
const express = require('express');
 | 
					const express = require('express')
 | 
				
			||||||
const uuid = require('uuid/v4');
 | 
					const uuid = require('uuid/v4')
 | 
				
			||||||
const sanitize = require('sanitize-filename');
 | 
					const sanitize = require('sanitize-filename')
 | 
				
			||||||
const Canvas = require('canvas');
 | 
					const Canvas = require('canvas')
 | 
				
			||||||
 | 
					
 | 
				
			||||||
const Fox = require('./js/fox.js');
 | 
					const Fox = require('./js/fox.js')
 | 
				
			||||||
const renderFox = require('./js/render-fox.js');
 | 
					const renderFox = require('./js/render-fox.js')
 | 
				
			||||||
 | 
					
 | 
				
			||||||
function composeImage (width, height, seed) {
 | 
					function composeImage (width, height, seed) {
 | 
				
			||||||
    seed = seed || uuid();
 | 
					  seed = seed || uuid()
 | 
				
			||||||
    const fox = Fox(width, height, seed);
 | 
					  const fox = Fox(width, height, seed)
 | 
				
			||||||
    const canvas = new Canvas(width, height);
 | 
					  const canvas = new Canvas(width, height)
 | 
				
			||||||
    renderFox(canvas, fox);
 | 
					  renderFox(canvas, fox)
 | 
				
			||||||
    return canvas;
 | 
					  return canvas
 | 
				
			||||||
};
 | 
					};
 | 
				
			||||||
 | 
					
 | 
				
			||||||
const cacheTimeout = 60 * 60 * 24 * 30;
 | 
					const cacheTimeout = 60 * 60 * 24 * 30
 | 
				
			||||||
const app = express();
 | 
					const app = express()
 | 
				
			||||||
 | 
					
 | 
				
			||||||
app.get('/healthcheck', (req, res) => {
 | 
					app.get('/healthcheck', (req, res) => {
 | 
				
			||||||
    res.status(200).end();
 | 
					  res.status(200).end()
 | 
				
			||||||
});
 | 
					})
 | 
				
			||||||
 | 
					
 | 
				
			||||||
app.get('/:width/:seed', (req, res) => {
 | 
					app.get('/:width/:seed', (req, res) => {
 | 
				
			||||||
    let width = parseInt(req.params.width) || 400;
 | 
					  let width = parseInt(req.params.width) || 400
 | 
				
			||||||
    if (width > 400) width = 400;
 | 
					  if (width > 400) width = 400
 | 
				
			||||||
    const seed = sanitize(req.params.seed) || uuid();
 | 
					  const seed = sanitize(req.params.seed) || uuid()
 | 
				
			||||||
    const canvas = composeImage(width, width, seed);
 | 
					  const canvas = composeImage(width, width, seed)
 | 
				
			||||||
    const buffer = canvas.toBuffer();
 | 
					  const buffer = canvas.toBuffer()
 | 
				
			||||||
    res.set('Cache-Control', 'max-age=' + cacheTimeout);
 | 
					  res.set('Cache-Control', 'max-age=' + cacheTimeout)
 | 
				
			||||||
    res.set('Content-length', buffer.length);
 | 
					  res.set('Content-length', buffer.length)
 | 
				
			||||||
    res.type('png');
 | 
					  res.type('png')
 | 
				
			||||||
    res.end(buffer, 'binary');
 | 
					  res.end(buffer, 'binary')
 | 
				
			||||||
});
 | 
					})
 | 
				
			||||||
 | 
					
 | 
				
			||||||
module.exports = app;
 | 
					module.exports = app
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue