MAN CAT

MAN Cat

by Alex

HTML

<script src="https://s3.amazonaws.com/f.cl.ly/items/2m0430293G1z02302Q1u/pixi.min.js"></script>

CSS

body {
  margin: 0;
  padding: 0;
}

canvas {
  width: 100vw;
  height: 101vh;
}

JavaScript

w = 1024, h = 768;
var renderer = new PIXI.WebGLRenderer(w, h);

document.body.appendChild(renderer.view);

var stage = new PIXI.Container();
var container = new PIXI.Container();
var foreground = new PIXI.Container();
stage.addChild(container);
stage.addChild(foreground);

var cat, bg, d, f;

PIXI.loader.add('bg', 'https://cldup.com/68ZGvXZPFk.jpg').load(function(loader, resources) { //M3VDxHJ.jpg
  bg = new PIXI.Sprite(resources.bg.texture);
  bg.position.x = w / 2;
  bg.position.y = h / 2;
  bg.scale.x = 1.0; // 1.6
  bg.scale.y = 1.1;
  bg.pivot.x = 1280 / 2; //1509 / 2;
  bg.pivot.y = 960 / 2; //935 / 2;
  container.addChild(bg);
});

var pickles = [];
var counter = 4;
var assets = {
	turbo: 'https://literally.download/HbFTkn+',
  engine: 'https://literally.download/hPPpRg+',
  primeserv: 'https://literally.download/ILSA6h+'
};
PIXI.loader.add('pickle', assets.primeserv)
	.load(function(loader, resources) {
  	var shadow = new PIXI.filters.DropShadowFilter();
  	shadow.distance = 0;
  	shadow.blur = 20;

  	for (i = 0; i < counter; i++) {
    	var p = new PIXI.Sprite(resources.pickle.texture);
    	p.position.y = Math.random() * 400;
    	p.pivot.x = 480 / 2;
    	p.pivot.y = 263 / 2;
    	p.scale.x = 0.5;
    	p.scale.y = 0.5;

    	p.filters = [shadow];

    	pickles[i] = p;
    	foreground.addChild(p);
  	}
	});

PIXI.loader.add('cat',
  'https://s3.amazonaws.com/f.cl.ly/items/070k44422j0l24390L1E/mesmercat.png'
  //'https://s3.amazonaws.com/f.cl.ly/items/2P2q0c353G3I460F2C3L/koenig.png'
).load(function(loader, resources) {
  cat = new PIXI.Sprite(resources.cat.texture);
  cat.pivot.x = 250;
  cat.pivot.y = 320;
  cat.position.x = w / 2;
  cat.position.y = h;
  cat.scale.x = w / 500 * 0.6;
  cat.scale.y = h / 333 * 0.6;
  foreground.addChild(cat);
});


var mousex = w / 2,
  mousey = h / 2;
PIXI.loader.add('catdisplacement',
  'https://s3.amazonaws.com/f.cl.ly/items/0C3m1Q3O051l3K0E3k1S/mesmercatdisplacement.jpg'
 ...