var YellowPalette = Container.expand(function () {
	var self = Container.call(this);
	var paletteGraphics = self.createAsset('yellowPalette', 'Yellow Palette Graphics', .5, .5);
	self.colors = [0xFFFF00];
	self.on('down', function (obj) {
		var pos = obj.event.getLocalPosition(self);
		currentColor = self.colors[0];
	});
});
var PurplePalette = Container.expand(function () {
	var self = Container.call(this);
	var paletteGraphics = self.createAsset('purplePalette', 'Purple Palette Graphics', .5, .5);
	self.colors = [0x800080];
	self.on('down', function (obj) {
		var pos = obj.event.getLocalPosition(self);
		currentColor = self.colors[0];
	});
});
var RedPalette = Container.expand(function () {
	var self = Container.call(this);
	var paletteGraphics = self.createAsset('redPalette', 'Red Palette Graphics', .5, .5);
	self.colors = [0xFF0000];
	self.on('down', function (obj) {
		var pos = obj.event.getLocalPosition(self);
		currentColor = self.colors[0];
	});
});
var GreenPalette = Container.expand(function () {
	var self = Container.call(this);
	var paletteGraphics = self.createAsset('greenPalette', 'Green Palette Graphics', .5, .5);
	self.colors = [0x008000];
	self.on('down', function (obj) {
		var pos = obj.event.getLocalPosition(self);
		currentColor = self.colors[0];
	});
});
var BlackPalette = Container.expand(function () {
	var self = Container.call(this);
	var paletteGraphics = self.createAsset('blackPalette', 'Black Palette Graphics', .5, .5);
	self.colors = [0x000000];
	self.on('down', function (obj) {
		var pos = obj.event.getLocalPosition(self);
		currentColor = self.colors[0];
	});
});
var PinkPalette = Container.expand(function () {
	var self = Container.call(this);
	var paletteGraphics = self.createAsset('pinkPalette', 'Pink Palette Graphics', .5, .5);
	self.colors = [0xFFC0CB];
	self.on('down', function (obj) {
		var pos = obj.event.getLocalPosition(self);
		currentColor = self.colors[0];
	});
});
var OrangePalette = Container.expand(function () {
	var self = Container.call(this);
	var paletteGraphics = self.createAsset('orangePalette', 'Orange Palette Graphics', .5, .5);
	self.colors = [0xFFA500];
	self.on('down', function (obj) {
		var pos = obj.event.getLocalPosition(self);
		currentColor = self.colors[0];
	});
});
var BluePalette = Container.expand(function () {
	var self = Container.call(this);
	var paletteGraphics = self.createAsset('bluePalette', 'Blue Palette Graphics', .5, .5);
	self.colors = [0x0000FF];
	self.on('down', function (obj) {
		var pos = obj.event.getLocalPosition(self);
		currentColor = self.colors[0];
	});
});
var Pixel = Container.expand(function () {
	var self = Container.call(this);
	var pixelGraphics = self.createAsset('pixel', 'Pixel Graphics', .5, .5);
	self.color = 0x000000;
	self.setColor = function (color) {
		self.color = color;
		pixelGraphics.tint = color;
	};
	self.isDragging = false;
	self.on('down', function (obj) {
		self.setColor(currentColor);
		self.isDragging = true;
	});
	self.on('up', function (obj) {
		self.isDragging = false;
	});
	self.on('move', function (obj) {
		if (self.isDragging) {
			self.setColor(currentColor);
		}
	});
	stage.on('up', function (obj) {
		self.isDragging = false;
	});
});
var Palette = Container.expand(function () {
	var self = Container.call(this);
	var paletteGraphics = self.createAsset('palette', 'Palette Graphics', .5, .5);
	self.colors = [0xFF0000, 0x00FF00, 0x0000FF, 0xFFFF00, 0xFF00FF, 0x00FFFF, 0xFFFFFF, 0x000000, 0x808080];
	self.isDragging = false;
	stage.on('up', function (obj) {
		if (palette.isDragging) {
			palette.isDragging = false;
		}
	});
});
var currentColor = 0x000000;
var Game = Container.expand(function () {
	var self = Container.call(this);
	stage.on('move', function (obj) {
		if (self.palette.isDragging) {
			var touchPosition = obj.event.getLocalPosition(self);
			palette.x = touchPosition.x + palette.dragOffsetX;
			palette.y = touchPosition.y + palette.dragOffsetY;
		}
	});
	var pixels = [];
	self.palette = self.addChild(new Palette());
	self.palette.x = 2048 / 2;
	palette.y = 2732 - palette.height / 2;
	palette.on('down', function (obj) {
		palette.isDragging = true;
		var touchPosition = obj.event.getLocalPosition(self);
		palette.dragOffsetX = palette.x - touchPosition.x;
		palette.dragOffsetY = palette.y - touchPosition.y;
	});
	stage.on('up', function (obj) {
		if (palette.isDragging) {
			palette.isDragging = false;
		}
	});
	var pinkPalette = self.addChild(new PinkPalette());
	pinkPalette.x = palette.x - palette.width / 2 - pinkPalette.width / 2;
	pinkPalette.y = palette.y;
	var redPalette = self.addChild(new RedPalette());
	redPalette.x = pinkPalette.x;
	redPalette.y = pinkPalette.y - redPalette.height;
	var greenPalette = self.addChild(new GreenPalette());
	greenPalette.x = redPalette.x;
	greenPalette.y = redPalette.y - greenPalette.height;
	var bluePalette = self.addChild(new BluePalette());
	bluePalette.x = 2048 / 2;
	bluePalette.y = palette.y - bluePalette.height;
	var orangePalette = self.addChild(new OrangePalette());
	orangePalette.x = 2048 / 2;
	orangePalette.y = bluePalette.y - orangePalette.height;
	var blackPalette = self.addChild(new BlackPalette());
	blackPalette.x = palette.x + palette.width / 2 + blackPalette.width / 2;
	blackPalette.y = palette.y;
	var yellowPalette = self.addChild(new YellowPalette());
	yellowPalette.x = blackPalette.x;
	yellowPalette.y = blackPalette.y - yellowPalette.height;
	var purplePalette = self.addChild(new PurplePalette());
	purplePalette.x = yellowPalette.x;
	purplePalette.y = yellowPalette.y - purplePalette.height;
	var gridSize = 50;
	var pixelSize = 2048 / gridSize;
	for (var i = 0; i < gridSize; i++) {
		for (var j = 0; j < gridSize; j++) {
			var pixel = self.addChild(new Pixel());
			pixel.x = i * pixelSize + pixelSize / 2;
			pixel.y = j * pixelSize + pixelSize / 2;
			pixels.push(pixel);
		}
	}
	LK.on('tick', function () {
		pixels.forEach(function (pixel) {
			if (pixel.isDragging) {
				pixel.setColor(currentColor);
			}
		});
	});
});