Add storybook cutscenes

intro needs some art drawn and boss needs music

data/CutsceneDatabase.js

@@ -0,0 +1,49 @@
+CutsceneDatabase = {};
+
+CutsceneDatabase.intro = {
+	music: "ocean",
+	lines: [
+		{pic: "intro1", "text": "Once upon a time, there\nwas a beautiful undersea\nkingdom."},
+		{pic: "intro2", "text": "The queen ruled over her\nsubjects lovingly, and\neverything was peaceful."},
+		{pic: "intro3", "text": "Soon, her son - the prince\n- was to marry a princess\nfrom far away."},
+		{pic: "intro3", "text": "But on the day of her visit,\nsomething terrible\nhappened..."},
+		{pic: "intro1", "text": "...And the prince woke to\nfind the entire royal guard\nmissing."},
+		{pic: "intro1", "text": "The guards. The queen - his\nmother. And the princess."},
+		{pic: undefined, "text": "Alone, but fearless, he set\noff to find his family."},
+	],
+	end: function() {
+		return Level("Intro");
+	}
+};
+
+CutsceneDatabase.boss = {
+	music: "preboss",
+	lines: [
+		{pic: "boss1", "text": "HEHEHE... SO YOU\nDECIDED TO SHOW UP\nAFTER ALL, I SEE."},
+		{pic: "boss1", "text": "UNFORTUNATELY FOR\nYOU, YOU'RE TOO LATE.\nTHE PRINCESS IS MINE."},
+		{pic: "boss2", "text": "AND NONE OF YOU\nFILTHY SEA CREATURES\nCAN SAVE HER."},
+		{pic: "boss2", "text": "YOUR ENTIRE KINGDOM\nWILL TREMBLE IN MY\nPRESENCE."},
+		{pic: "boss3", "text": "BUT ENOUGH TALK.\nHAVE AT THEE!"},
+	],
+	end: function() {
+		return Level("Boss 1");
+	}
+};
+
+CutsceneDatabase.ending = {
+	music: "ending",
+	lines: [
+		{pic: undefined, "text": "And so, the prince returned\nhome to his subjects."},
+		{pic: undefined, "text": "Everyone in the royal family\ncame back safe and sound."},
+		{pic: undefined, "text": "Except for the princess."
+								// lol length padding
+								+ "                                                                            "
+								+ "                                                                            "},
+	],
+	end: function() {
+		var title = Title();
+		title.z = -50;
+		title.ticCount = 650;
+		return title;
+	}
+};

level/Level.js

@@ -215,6 +215,12 @@ Level = function(levelName) {
 				if (Memory.stage() == "Boss 3" && Memory.global.bossClear) {
 					Memory.storeDolphin(0, 200, -800, 0, -1);
 					Game.setScene(Level("Ending"));
+				} else if (Memory.stage() == "Boss 1" && !Memory.global.bossStarted) {
+					Memory.global.bossStarted = true;
+					Game.setScene(Cutscene("boss"));
+				} else if (Memory.stage() == "Intro" && levelName == "Ending") {
+					Memory.save();
+					Game.setScene(Cutscene("ending"));
 				} else {
 					Memory.loadStage();
 				}

main/Music.js

@@ -7,6 +7,7 @@ Music = (function() {
 		"new-ocean",
 		"cavern",
 		"boss",
+		"ending",
 	];
 	
 	Music.volume = 0.5;

main/Renderer.js

@@ -29,6 +29,14 @@ Renderer = (function() {
 			"assets/tiles/bg-cavern.png",
 			"assets/tiles/bg-boss.png",
 			
+			"assets/cutscene/intro1.png",
+			"assets/cutscene/intro2.png",
+			"assets/cutscene/intro3.png",
+			
+			"assets/cutscene/boss1.png",
+			"assets/cutscene/boss2.png",
+			"assets/cutscene/boss3.png",
+			
 			"assets/type.fnt"
 		]).load(next);
 	}

other/Cutscene.js

@@ -0,0 +1,121 @@
+Cutscene = function(name) {
+	var data = CutsceneDatabase[name];
+	
+	var image, text, currentLine = "";
+	
+	var lineNumber = -1;
+	var lineTimer = 0;
+	
+	var cutscene = Scene();
+	
+	var fade;
+	
+	cutscene.init = function() {
+		if (data.music) {
+			Music.play(data.music, name != "intro");
+		}
+	}
+	
+	cutscene.think = function() {
+		if (!lineTimer) {
+			lineNumber++;
+			
+			currentLine = data.lines[lineNumber];
+			
+			if (!currentLine) {
+				cutscene.think = fadeout;
+				cutscene.stage.setChildIndex(fade, cutscene.stage.children.length - 1);
+				return;
+			}
+			
+			lineTimer = 200;
+			
+			if (text) {
+				cutscene.stage.removeChild(text);
+				text = undefined;
+			}
+			
+			var imagechange = lineNumber == 0 || (data.lines[lineNumber - 1].pic != currentLine.pic);
+			
+			if (imagechange) {
+				if (image) {
+					var oldimg = image;
+					out();
+					
+					function out() {
+						oldimg.alpha -= 0.05;
+						if (oldimg.alpha) {
+							window.setTimeout(out, 20);
+						}
+					}
+				}
+				
+				if (currentLine.pic) {
+					image = PIXI.Sprite.fromImage("assets/cutscene/" + currentLine.pic + ".png");
+					cutscene.stage.addChild(image);
+					image.alpha = 0;
+					unout();
+					
+					function unout() {
+						image.alpha += 0.05;
+						if (image.alpha < 1) {
+							window.setTimeout(unout, 20);
+						}
+					}
+				}
+			}
+			
+			var delay;
+			
+			if (lineNumber == 0) {
+				delay = 1100;
+			} else if (imagechange) {
+				delay = 400;
+			} else {
+				delay = 0;
+			}
+			
+			window.setTimeout(function() {
+				text = Renderer.typewriterText(currentLine.text, 290, 11);
+				cutscene.stage.addChild(text);
+				
+				if (name == "boss") {
+					text.tint = 0xFF0000;
+				}
+			}, delay);
+		}
+		
+		if (text) {
+			if (text.spot >= currentLine.text.length) {
+				lineTimer--;
+				
+				if (Input.pressed("accept")) {
+					lineTimer = 0;
+				}
+				
+			} else if (Input.pressed("accept")) {
+				text.spot = currentLine.text.length - 1;
+			}
+		}
+		
+		if (!fade) {
+			fade = new PIXI.Graphics();
+			fade.beginFill(0);
+			fade.drawRect(0, 0, 500, 280);
+			fade.endFill();
+			cutscene.stage.addChild(fade);
+		} else if (fade.alpha > 0) {
+			fade.alpha -= 0.01;
+		}
+	}
+	
+	function fadeout() {
+		if (fade.alpha < 1) {
+			fade.alpha += 0.01;
+		} else {
+			Game.setScene(data.end());
+		}
+	}
+	
+	return cutscene;
+};

other/Title.js

@@ -68,7 +68,7 @@ Title = function() {
 					Memory.load(true);
 				} else {
 					Memory.clear();
-					Game.setScene(Level("Intro"));
+					Game.setScene(Cutscene("intro"));
 				}
 			}