var tutorialIconArrow = { components: [
	{
		c: TransformComponent,
		d: {
			x: 0,
			y: 0,
			scaleX: 1/128,
			scaleY: 1/128,
			zIndex: 1
		}
	},
	{
		c: SpriteComponent,
		d: {
			layer: LayerDefinitions.LAYER_FLOOR_OBJECTS,
			sheet: "ui",
			name: "ui-base-icon-arrow-down",
		}
	},
	{
		c: TweenerComponent,
		d: {
			component: "SpriteComponent",
			field: "alpha",
			duration: 1,
			values: [1,0.5,1],
			repeat: true,
		}
	},
]};

var tutorialIconLeftClick = { components: [
	{
		c: TransformComponent,
		d: {
			x: 0,
			y: 0.4,
			zIndex: 4
		}
	},
	{
		c: SpriteComponent,
		d: {
			layer: LayerDefinitions.LAYER_FLOOR_OBJECTS,
			sheet: "ui_tutorial",
			name: "tutorial",
			defaultAnimationName: "ClickLeft",
		}
	},
]};

var tutorialIconRightClick = { components: [
	{
		c: TransformComponent,
		d: {
			x: 0,
			y: 0.4,
			zIndex: 4
		}
	},
	{
		c: SpriteComponent,
		d: {
			layer: LayerDefinitions.LAYER_FLOOR_OBJECTS,
			sheet: "ui_tutorial",
			name: "tutorial",
			defaultAnimationName: "ClickRight",
		}
	},
]};

var tutorialIconRightClickTop = { components: [
	{
		c: TransformComponent,
		d: {
			x: 0,
			y: 0.4,
			zIndex: 4
		}
	},
	{
		c: SpriteComponent,
		d: {
			layer: LayerDefinitions.LAYER_OVERHEAD,
			sheet: "ui_tutorial",
			name: "tutorial",
			defaultAnimationName: "ClickRight",
		}
	},
	{
		c: CircuitComponent,
		d: {
			toggleComponents: ["SpriteComponent"],
		}
	},
]};

var tutorialIconMiddle = { components: [
	{
		c: TransformComponent,
		d: {
			x: 0,
			y: 0.4,
			zIndex: 4
		}
	},
	{
		c: SpriteComponent,
		d: {
			layer: LayerDefinitions.LAYER_FLOOR_OBJECTS,
			sheet: "ui_tutorial",
			name: "tutorial",
			defaultAnimationName: "Wheel",
		}
	},
]};

var tutorialIconArrows = { components: [
	{
		c: TransformComponent,
		d: {
			x: 0,
			y: 0.4,
			zIndex: 4
		}
	},
	{
		c: SpriteComponent,
		d: {
			layer: LayerDefinitions.LAYER_FLOOR_OBJECTS,
			sheet: "ui_tutorial",
			name: "tutorial",
			defaultAnimationName: "Arrows",
		}
	},
]};

var tutorialIconRightDrag = { components: [
	{
		c: TransformComponent,
		d: {
			x: 0,
			y: 0.4,
			zIndex: 4
		}
	},
	{
		c: SpriteComponent,
		d: {
			layer: LayerDefinitions.LAYER_FLOOR_OBJECTS,
			sheet: "ui_tutorial",
			name: "tutorial",
			defaultAnimationName: "RightDrag",
		}
	},
]};

var tutorialBase = { components: [
	{
		c: TransformComponent,
		d: {
			x: 0,
			y: 0,
			scaleX: 1,
			scaleY: 1,
			zIndex: 4
		}
	},
	{
		c: PixelTextComponent,
		d: {
			text: "Tutorial text field",
			align: TextAlign.center,
			spacing: -2,
			spaceWidth: 9,
			lineHeight: 70,
			fontDefinition: {
				layer: LayerDefinitions.LAYER_FLOOR_OBJECTS,
				sheet: "fontGreasyStroke",
				scale: 1 / 3,
				tint: 0xe0b86c,
				alpha: 0.85
			}
		}
	},
	{
		c: CircuitComponent,
		d: {
			toggleComponents: ["PixelTextComponent"],
		}
	},
]};

var tutorialText = { components: [
	{
		c: TransformComponent,
		d: {
			x: 0,
			y: 0,
			scaleX: 1,
			scaleY: 1,
			zIndex: 4
		}
	},
	{
		c: PixelTextComponent,
		d: {
			text: "Tutorial text field",
			align: TextAlign.center,
			spacing: -2,
			spaceWidth: 9,
			lineHeight: 70,
			fontDefinition: {
				layer: LayerDefinitions.LAYER_FLOOR_OBJECTS,
				sheet: "fontGreasyStroke",
				scale: 1 / 3,
				tint: 0xe0b86c,
				alpha: 0.85
			}
		}
	},
]};

var tutorialBaseHigh = { components: [
	{
		c: TransformComponent,
		d: {
			x: 0,
			y: 0,
			scaleX: 1,
			scaleY: 1,
			zIndex: 4
		}
	},
	{
		c: PixelTextComponent,
		d: {
			text: "Tutorial text field",
			align: TextAlign.center,
			spacing: -2,
			spaceWidth: 9,
			lineHeight: 70,
			fontDefinition: {
				layer: LayerDefinitions.LAYER_IN_GAME_UI,
				sheet: "fontGreasyStroke",
				scale: 1 / 3,
				tint: 0xe0b86c,
				alpha: 0.85
			}
		}
	},
	{
		c: CircuitComponent,
		d: {
			toggleComponents: ["PixelTextComponent"],
		}
	},
]};

var tutorialBaseHighDelay = { components: [
	{
		c: TransformComponent,
		d: {
			x: 0,
			y: 0,
			scaleX: 1,
			scaleY: 1,
			zIndex: 4
		}
	},
	{
		c: PixelTextComponent,
		d: {
			text: "Tutorial text field",
			align: TextAlign.center,
			spacing: -2,
			spaceWidth: 9,
			lineHeight: 70,
			fontDefinition: {
				layer: LayerDefinitions.LAYER_IN_GAME_UI,
				sheet: "fontGreasyStroke",
				scale: 1 / 3,
				tint: 0xe0b86c,
				alpha: 0
			}
		}
	},
	{
		c: TweenerComponent,
		d: {
			component: "PixelTextComponent",
			field: "alpha",
			duration: 18,
			values: [1, 1, 1, 1, 1, 1],
			repeat: false,
		}
	},
/*	{
		c: CircuitComponent,
		d: {
			toggleComponents: ["PixelTextComponent"],
		}
	},
*/
]};

var tutorialBaseHighDelayAlignLeft = { extend: tutorialBaseHighDelay, components: [
	{
		c: PixelTextComponent,
		d: {
			align: TextAlign.left,
		}
	},
]};

var tutorialSelect = { extend: tutorialBase, components: [
	{
		c: PixelTextComponent,
		d: {
			text: "$tutorialSelect",
		}
	},
	{
		c: TweenerComponent,
		d: {
			component: "PixelTextComponent",
			field: "alpha",
			duration: 1,
			values: [0, 0, 0, 0, 0, 1],
			repeat: false,
		}
	},
	{
		c: CircuitComponent,
		d: {
			toggleComponents: ["PixelTextComponent", "SpriteComponent"],
		}
	},
], children: [
	tutorialIconLeftClick
]};

var tutorialLook = { extend: tutorialBase, components: [
	{
		c: PixelTextComponent,
		d: {
			text: "$tutorialLook",
		}
	},
	{
		c: CircuitComponent,
		d: {
			toggleComponents: ["PixelTextComponent", "SpriteComponent"],
		}
	},
], children: [
//	tutorialIconRightDrag
]};

var tutorialPick = { extend: tutorialBase, components: [
	{
		c: PixelTextComponent,
		d: {
			text: "$tutorialPick",
		}
	},
	{
		c: CircuitComponent,
		d: {
			toggleComponents: ["PixelTextComponent", "SpriteComponent"],
		}
	},
], children: [
	tutorialIconRightClick
]};

var tutorialInventory = { extend: tutorialBase, components: [
	{
		c: PixelTextComponent,
		d: {
			text: "$tutorialInventory",
		}
	},
	{
		c: CircuitComponent,
		d: {
			toggleComponents: ["PixelTextComponent", "SpriteComponent"],
		}
	},
], children: [
	tutorialIconRightClick
]};

var tutorialAttack = { extend: tutorialBase, components: [
	{
		c: PixelTextComponent,
		d: {
			text: "$tutorialAttack",
		}
	},
], children: [
	tutorialIconRightClick
]};

var tutorialPause = { extend: tutorialBase, components: [
	{
		c: PixelTextComponent,
		d: {
			text: "$tutorialPause",
		}
	},
	{
		c: CircuitComponent,
		d: {
			toggleComponents: ["PixelTextComponent"],
		}
	},
]};

var tutorialZoom = { extend: tutorialBase, components: [
	{
		c: PixelTextComponent,
		d: {
			text: "$tutorialZoom",
		}
	},
	{
		c: CircuitComponent,
		d: {
			toggleComponents: ["PixelTextComponent", "SpriteComponent"],
		}
	},
], children: [
	tutorialIconMiddle
]};

var tutorialCameraMove = { extend: tutorialBase, components: [
	{
		c: PixelTextComponent,
		d: {
			text: "$tutorialCamera",
			alpha: 0.4
		}
	},
	{
		c: TweenerComponent,
		d: {
			component: "PixelTextComponent",
			field: "alpha",
			duration: 1,
			values: [0, 0, 0, 0, 0, 1],
			repeat: false,
		}
	},
	{
		c: CircuitComponent,
		d: {
			toggleComponents: ["PixelTextComponent", "SpriteComponent"],
		}
	},
], children: [
	tutorialIconArrows
]};

var tutorialCallCops = { extend: tutorialBase, components: [
	{
		c: PixelTextComponent,
		d: {
			text: "$tutorialCops",
		}
	},
	{
		c: TweenerComponent,
		d: {
			component: "PixelTextComponent",
			field: "alpha",
			duration: 1,
			values: [0, 0, 0, 0, 0, 1],
			repeat: false,
		}
	},
]};

var tutorialHoldup = { extend: tutorialBase, components: [
	{
		c: PixelTextComponent,
		d: {
			text: "$tutorialIntimidate",
		}
	},
	{
		c: CircuitComponent,
		d: {
			toggleComponents: ["PixelTextComponent"],
		}
	},
]};

var tutorialCommand = { extend: tutorialBase, components: [
	{
		c: PixelTextComponent,
		d: {
			text: "$tutorialCommand",
		}
	},
	{
		c: CircuitComponent,
		d: {
			toggleComponents: ["PixelTextComponent"],
		}
	},
]};

var goonCommandMarker = { components: [
	{
		c: RigidBodyComponent,
		d: {
			isKinematic: false,
			isSensor: true,
			dynamicFriction: 0,
			density: 0.001, // Without this, goonCommandMaker weighs the same as goon and goon needs to push this around while moving
		}
	},
	{
		c: ColliderComponent,
		d: {
			// Fow now make the command marker the same size as the goon
			// In the future we can make a larger click target to the marker
			// This radius cannot be bigger that the goon's collider radius as that makes the goon
			// get stuck on walls
			radius: 0.24 * 1,
			collisionGroup: CollisionCategoryDefinitions.CC_PLANNING_TARGET,
			senses: [CollisionCategoryDefinitions.CC_MOUSE, CollisionCategoryDefinitions.CC_HOTSPOTS, CollisionCategoryDefinitions.CC_STATIC_OBSTACLE, CollisionCategoryDefinitions.CC_DYNAMIC_OBSTACLE, CollisionCategoryDefinitions.CC_DOORS, CollisionCategoryDefinitions.CC_CHARACTERS]
		}
	},
	{
		c: TransformComponent,
		d: {
			x: 0,
			y: 0,
			zIndex: 100
		}
	},
]};
