let current_chat = document.getElementById("current_chat")
let controls = document.getElementById("controls")
// Load the stage and characters and stuff
let stage = new babble.Stage("puppet", {
"numCharacters": 3,
"puppetScale": 1.5
},
{"47027bbc-eed0-47a9-84cb-578c34fc8c46:28":{"name":"talking_mouth","type":"sprite","tab":"mouths","location":"47027bbc-eed0-47a9-84cb-578c34fc8c46/28.png","thumbnail":null,"version":1,"panning":[]},"47027bbc-eed0-47a9-84cb-578c34fc8c46:29":{"name":"talking2_mouth","type":"sprite","tab":"mouths","location":"47027bbc-eed0-47a9-84cb-578c34fc8c46/29.png","thumbnail":null,"version":1,"panning":[]},"47027bbc-eed0-47a9-84cb-578c34fc8c46:23":{"name":"funny_eyes","type":"sprite","tab":"eyes","location":"47027bbc-eed0-47a9-84cb-578c34fc8c46/23.png","thumbnail":null,"version":1,"panning":[]},"47027bbc-eed0-47a9-84cb-578c34fc8c46:25":{"name":"happy_mouth","type":"sprite","tab":"mouths","location":"47027bbc-eed0-47a9-84cb-578c34fc8c46/25.png","thumbnail":null,"version":1,"panning":[]},"47027bbc-eed0-47a9-84cb-578c34fc8c46:22":{"name":"body","type":"sprite","tab":"body","location":"47027bbc-eed0-47a9-84cb-578c34fc8c46/22.png","thumbnail":null,"version":1,"panning":[]},"47027bbc-eed0-47a9-84cb-578c34fc8c46:24":{"name":"funny_mouth","type":"sprite","tab":"mouths","location":"47027bbc-eed0-47a9-84cb-578c34fc8c46/24.png","thumbnail":null,"version":1,"panning":[]},"47027bbc-eed0-47a9-84cb-578c34fc8c46:26":{"name":"meh_mouth","type":"sprite","tab":"mouths","location":"47027bbc-eed0-47a9-84cb-578c34fc8c46/26.png","thumbnail":null,"version":1,"panning":[]},"47027bbc-eed0-47a9-84cb-578c34fc8c46:27":{"name":"normal_eyes","type":"sprite","tab":"eyes","location":"47027bbc-eed0-47a9-84cb-578c34fc8c46/27.png","thumbnail":null,"version":1,"panning":[]},"47027bbc-eed0-47a9-84cb-578c34fc8c46:30":{"name":"uwu_eyes","type":"sprite","tab":"eyes","location":"47027bbc-eed0-47a9-84cb-578c34fc8c46/30.png","thumbnail":null,"version":1,"panning":[]},"47027bbc-eed0-47a9-84cb-578c34fc8c46:31":{"name":"uwu_mouth","type":"sprite","tab":"mouths","location":"47027bbc-eed0-47a9-84cb-578c34fc8c46/31.png","thumbnail":null,"version":1,"panning":[]}},
"assets/puppet", loaded);
let pajer = {"deadbonesStyle":false,"name":"Pajer","layers":{"children":[{"name":"body","children":[{"name":"body","rotation":0,"scaleX":1,"scaleY":1,"x":0,"y":-330,"id":"47027bbc-eed0-47a9-84cb-578c34fc8c46:22","leaf":true,"inherit":{},"path":[0,0]}],"inherit":{},"path":[0],"scaleX":-0.5,"scaleY":0.5},{"name":"head","children":[],"head":true,"inherit":{},"path":[1]},{"name":"emotes","head":true,"children":[{"name":"uwu","rotation":0,"scaleX":1,"scaleY":1,"x":0,"y":0,"children":[{"name":"uwu_eyes","rotation":0,"scaleX":1,"scaleY":1,"x":-44.494040351079754,"y":-432.10076571738944,"id":"47027bbc-eed0-47a9-84cb-578c34fc8c46:30","leaf":true,"inherit":{"head":true,"emote":3},"path":[2,0,0]},{"name":"uwu_mouth","rotation":0,"scaleX":1,"scaleY":1,"x":-41.694941376469345,"y":-315.00512527951986,"id":"47027bbc-eed0-47a9-84cb-578c34fc8c46:31","leaf":true,"inherit":{"head":true,"emote":3},"path":[2,0,1]}],"inherit":{"head":true},"path":[2,0],"emote":3},{"name":"funny","rotation":0,"scaleX":1,"scaleY":1,"x":0,"y":0,"children":[{"name":"funny_eyes","rotation":0,"scaleX":1,"scaleY":1,"x":-45.89358983838499,"y":-461.0247884550305,"id":"47027bbc-eed0-47a9-84cb-578c34fc8c46:23","leaf":true,"inherit":{"head":true,"emote":2},"path":[2,1,0]},{"name":"funny_mouth","rotation":0,"scaleX":1,"scaleY":1,"x":-36.096743427248484,"y":-394.31292956014863,"id":"47027bbc-eed0-47a9-84cb-578c34fc8c46:24","leaf":true,"inherit":{"head":true,"emote":2},"path":[2,1,1]}],"inherit":{"head":true},"path":[2,1],"collapsed":true,"emote":2},{"name":"excited","rotation":0,"scaleX":1,"scaleY":1,"x":0,"y":0,"children":[{"name":"normal_eyes","rotation":0,"scaleX":1,"scaleY":1,"x":-44.64999549436159,"y":-438.1792449911571,"id":"47027bbc-eed0-47a9-84cb-578c34fc8c46:27","leaf":true,"inherit":{"head":true,"emote":5},"path":[2,2,0],"emoteLayer":"eyes"},{"name":"talking2_mouth","rotation":0,"scaleX":1,"scaleY":1,"x":-44,"y":-316,"id":"47027bbc-eed0-47a9-84cb-578c34fc8c46:29","leaf":true,"inherit":{"head":true,"emote":5},"path":[2,2,1],"emoteLayer":"mouth"}],"inherit":{"head":true},"path":[2,2],"collapsed":true,"emote":5},{"name":"very happy","rotation":0,"scaleX":1,"scaleY":1,"x":0,"y":0,"children":[{"name":"normal_eyes","rotation":0,"scaleX":1,"scaleY":1,"x":-44.64999549436159,"y":-438.1792449911571,"id":"47027bbc-eed0-47a9-84cb-578c34fc8c46:27","leaf":true,"inherit":{"head":true,"emote":4},"path":[2,3,0],"emoteLayer":"eyes"},{"name":"talking_mouth","rotation":0,"scaleX":1,"scaleY":1,"x":-44.02752385531136,"y":-316.4046747668251,"id":"47027bbc-eed0-47a9-84cb-578c34fc8c46:28","leaf":true,"inherit":{"head":true,"emote":4},"path":[2,3,1],"emoteLayer":"mouth"}],"inherit":{"head":true},"path":[2,3],"collapsed":true,"emote":4},{"name":"meh","rotation":0,"scaleX":1,"scaleY":1,"x":0,"y":0,"emote":1,"children":[{"name":"normal_eyes","rotation":0,"scaleX":1,"scaleY":1,"x":-44.64999549436159,"y":-438.1792449911571,"id":"47027bbc-eed0-47a9-84cb-578c34fc8c46:27","leaf":true,"inherit":{"head":true,"emote":1},"path":[2,4,0],"emoteLayer":"eyes"},{"name":"meh_mouth","rotation":0,"scaleX":1,"scaleY":1,"x":-44.02752385531135,"y":-315.0051252795199,"id":"47027bbc-eed0-47a9-84cb-578c34fc8c46:26","leaf":true,"inherit":{"head":true,"emote":1},"path":[2,4,1],"emoteLayer":"mouth"}],"inherit":{"head":true},"path":[2,4],"collapsed":true},{"name":"happy","emote":0,"children":[{"name":"normal_eyes","rotation":0,"scaleX":1,"scaleY":1,"x":-44.64999549436159,"y":-438.1792449911571,"id":"47027bbc-eed0-47a9-84cb-578c34fc8c46:27","leaf":true,"inherit":{"head":true,"emote":0},"path":[2,5,0],"emoteLayer":"eyes"},{"name":"happy_mouth","rotation":0,"scaleX":1,"scaleY":1,"x":-48.02867537861667,"y":-316.1511667631519,"id":"47027bbc-eed0-47a9-84cb-578c34fc8c46:25","leaf":true,"inherit":{"head":true,"emote":0},"path":[2,5,1],"emoteLayer":"mouth"}],"inherit":{"head":true},"path":[2,5],"collapsed":true}],"inherit":{},"path":[2],"scaleX":-0.5,"scaleY":0.5},{"name":"hat","children":[],"head":true,"inherit":{},"path":[3]},{"name":"props","children":[],"inherit":{},"path":[4]}]},"id":1,"emote":0,"creator":"47027bbc-eed0-47a9-84cb-578c34fc8c46","creatorNick":"Trisha Vinisto","oc":"47027bbc-eed0-47a9-84cb-578c34fc8c46","ocNick":"Trisha Vinisto"}
let start = [
{
"command": "delay",
"delay": 500,
"wait": true
},
{
"command": "add",
"name": "pajer",
"id": "pajer",
"position": 0,
"facingLeft": false,
"emote": "0"
},
{
"command": "move",
"target": "pajer",
"position": 2,
"wait": true
},
{
"command": "chat",
"target": "pajer",
"chatId": "0"
}
]
let stageElement = document.getElementById("puppet")
function loaded() {
stage.resize()
let puppetScale = stage.screen.clientHeight / 567 / stage.puppetStage.scale.y
stage.environment.puppetScale = puppetScale
stage.resize()
window.onresize = () => {
stage.resize()
let puppetScale = stage.screen.clientHeight / 567 / stage.puppetStage.scale.y
stage.environment.puppetScale = puppetScale
stage.resize()
}
startCutscene()
}
function startCutscene() {
let cut = new babble.Cutscene(stage, start, {"pajer": pajer})
let add = cut.actions.add.bind(cut)
cut.actions.add = function(callback, action) {
add(callback, action)
stage.resize()
}
cut.actions.chat = function(callback, action) {
let chats = [{
message: "I'm Anthony, or The Paper Pilot, and I make fun games and tools using code!"
}]
current_chat.style.display = 'block'
this.stage.getPuppet(action.target).setBabbling(true)
chatter(callback, action.target, chats[action.chatId], this.stage, 0)
}
cut.start()
}
function chatter(callback, target, chat, stage, textPos) {
if (textPos++ > chat.message.length) {
stage.getPuppet(target).setBabbling(false)
} else {
current_chat.innerText = chat.message.substring(0, textPos) + "_"
setTimeout(() => {chatter(callback, target, chat, stage, textPos)}, 20)
}
}
// Make player controllable
window.onkeydown = function(e) {
let key = e.keyCode ? e.keyCode : e.which
current_chat.style.display = 'none'
if (key == 32) {
e.preventDefault()
if (stage.getPuppet("pajer").babbling) return
stage.getPuppet("pajer").setBabbling(true)
var temp = babbleEl
babbleEl = babbleEl.cloneNode(true)
temp.parentNode.replaceChild(babbleEl, temp)
babbleEl.className = ''
interval = requestAnimationFrame(showBabble)
}
}
window.onkeyup = function(e) {
let key = e.keyCode ? e.keyCode : e.which
if (key > 48 && key < 55)
stage.getPuppet("pajer").changeEmote(key - 49)
else if (key == 37) {
let puppet = stage.getPuppet("pajer")
if (puppet.facingLeft || puppet.position === stage.environment.numCharacters + 1)
puppet.target--
puppet.facingLeft = true
if (puppet.movingAnim === 0)
puppet.container.scale.x = -stage.environment.puppetScale
stage.dirty = true
} else if (key == 38) stage.getPuppet("pajer").jiggle()
else if (key == 39) {
let puppet = stage.getPuppet("pajer")
if (!puppet.facingLeft || puppet.position === 0)
puppet.target++
puppet.facingLeft = false
if (puppet.movingAnim === 0)
puppet.container.scale.x = stage.environment.puppetScale
stage.dirty = true
} else if (key == 32) {
stage.getPuppet("pajer").setBabbling(false)
babbleEl.className = 'hidden'
cancelAnimationFrame(interval)
e.preventDefault()
}
}
function showControls() {
controls.className = 'show'
}
setTimeout(showControls, 4000)
var interval = null
var babbleEl = document.getElementById("babble")
function showBabble() {
var puppet = stage.getPuppet("pajer")
var x = puppet.container.x + 150
var y = puppet.container.y - 400
if (puppet.facingLeft)
x -= 450
babbleEl.style.top = y + "px"
babbleEl.style.left = x + "px"
interval = requestAnimationFrame(showBabble)
}