From 29f7c2c5f0e3380262076e85507713c7f43956b7 Mon Sep 17 00:00:00 2001 From: chasmiccoder Date: Thu, 10 Feb 2022 03:00:18 +0530 Subject: [PATCH] made 1 time cutscene work (kind of) --- images/dhriti.png | Bin 0 -> 1530 bytes images/problem.txt | 6 ++ js/OverworldMap.js | 232 +++++++++++++++++++++++++++++---------------- js/Person.js | 8 +- 4 files changed, 158 insertions(+), 88 deletions(-) create mode 100644 images/dhriti.png create mode 100644 images/problem.txt diff --git a/images/dhriti.png b/images/dhriti.png new file mode 100644 index 0000000000000000000000000000000000000000..d9d300fe5f84e99f7a93e7a6c3c63545ba2d3266 GIT binary patch literal 1530 zcmW-h2{c<-7{_0>p;Xb@Vy|V2b}WMyRgxC5Rb#11e~M6!BGAV{BKNAI>2dPvM(VO0CX&&0rLy7_zDJLsUf)2K*NyX61YIdW6xp% zps7Ih+a(kLpbGrFuwmC>;_{}HP^`vX4qEAep^F6&(zey)FRmz1GB}V@Ng6! zfIUPg9VmwNIo1}26L)Cooo(ml_5$3SN#gpMUFqso>1yP$_`b2Rv6JvuHU~QNYGiGmg zVfx+j^0=gEdR%{}`?)dSjX-W7CQvuz!6Z2td`DMrG_#i(o6gXF zqqRu8wF@&nrX_syWn+!cp4#~RVLdC#qg5t5be{TqvDirM?HWhLYCc+v-wK!r=*Deg>ko^6z{#^Xmd7rN9ID`7RwO~urUcwf2x59DOIaY+&VB_eV zVSQLu1v9^LQj&KwAV(C8Unb|OSoM{wV+xZtcY@Ilq?v?sVLpM`0*F#_T3vrj-)EgF zbW^arOT5T0m`53+>hHHadD12$G35wf-Bn(R5mQt{I!w#N{J95KVQ*sUVwNmfC(xVu zDi8QJM-{*k>#))lWv@hsaQ<51xHY<+ya$RjwauteZv8Q4G0m=J=P{hclrknXdFybu zgOZ}1k!<5~uY$YHij8gHzJVZ{SRif4>Xz+pFD*Q6yBM;fIs);1wg9WwbWv@R%U`!W z=HRv{)wz9j)K(cJsr#Y#gDgy~onU1sW)$Mv1_wK+Gl<+0co^bcJinf$!Mkde7!_Ub z@59l(P2L1W{fht-$@I>K-6<2qmIobVEA?-I(Y|^hk?oL>Y1?eaW%29!ar92M=SSl3 zK#CACe8rOBi{$6~+-UN-z;l!9m+>xRQCf51j1zO_n)f4X(QM|sMYKx@HyoKhz(K#Q zGW8nWzwxuUO>j%a>aHBYdI)FD?lOk9$j>}K1`>95fmRWRjhNqM#KX(>3G*= zyJlzzD&@OXbsnonRP$+M?85}apg7)JS>$1Fb7rh#E2cc5Vsnb2ApG%)b#|SymYny+ z#qEUqBt*bP9iyptO4cYFElTnzqu_KD2`Ji)0_D~|X$bomUGleh`XH7KsX2ctnu;_# zP-AlZwWn^E$^)o%2T}S`!K#b!#;-o%XUTl%*ktYJ`fo&9WX6_XyF!!VMC_tpN@-mU zQX*<3clLMNcO1zB5z?dX_2w8khSof~L!jQ^9F2w`Wn?h!tja5;N?cjlVgmV114;sm z&nIZlPHS7mKbuB+x(X-r7efh71a>+cynkYB^a9;cs&vn`v?`8@6s$&YrYnMJU>$EC zR}Zp!c;)|%h_e-(hHm3>Jlfv}T+1Wd)u~0gCOcnqf`cK|N;U=R!0=4<#mL|P8PIHd zN$VL%k^Dia=2!R(SDDbGUTk)Cln0lzE6zoq_ew(gi$B$M#gvXLpoP%Wk8?Rf(WFz? zR}QtrL8j93!Ep}HZoQn|>JQ^1MiPoZoho#lG?<}B=PFAS7E-n^DLpGmN4K6czTsg# z_v%3DVaqtkd*(7K8X0Dd()JF~{)pwA^Ht)nHjU%9pii{xkeFu4t!^(ne|lr~1$|sp zLwSTGLD%yWvBF*tZG7PRDNH}n0G;=IVymmfPJ{>_@YKI}DKtI}&jYO*@beDxYB(L8 F^*_*>)06-J literal 0 HcmV?d00001 diff --git a/images/problem.txt b/images/problem.txt new file mode 100644 index 0000000..e8c26fd --- /dev/null +++ b/images/problem.txt @@ -0,0 +1,6 @@ +The problem is that when a cutscene is being played, +the game objects pause their behaviour. +But when the cutscene ends, the person's behaviour is starting +from the first item in the behaviour loop. + +We need to be able to pick off from where we left diff --git a/js/OverworldMap.js b/js/OverworldMap.js index f12b644..b7ae691 100644 --- a/js/OverworldMap.js +++ b/js/OverworldMap.js @@ -1,3 +1,30 @@ +let hemanthPath = [ + {who: "hemanth", type: "walk", direction: "right"}, + {who: "hemanth", type: "walk", direction: "right"}, + {who: "hemanth", type: "walk", direction: "right"}, + {who: "hemanth", type: "walk", direction: "right"}, + {who: "hemanth", type: "walk", direction: "right"}, + {who: "hemanth", type: "walk", direction: "right"}, + {who: "hemanth", type: "walk", direction: "right"}, + {who: "hemanth", type: "walk", direction: "right"}, + + {who: "hemanth", type: "stand", direction: "right", time:500}, + {type: "textMessage", text: "Are you up for applying to the technical department?"}, + {type: "textMessage", text: "If so, enter the portal and hit 'Enter'!"}, + + {who: "hemanth", type: "walk", direction: "left"}, + {who: "hemanth", type: "walk", direction: "left"}, + {who: "hemanth", type: "walk", direction: "left"}, + {who: "hemanth", type: "walk", direction: "left"}, + {who: "hemanth", type: "walk", direction: "left"}, + {who: "hemanth", type: "walk", direction: "left"}, + {who: "hemanth", type: "walk", direction: "left"}, + {who: "hemanth", type: "walk", direction: "left"}, +] + +// hemanth's cutscene's set of coordinates +let hemanth_cutscene_set_of_coords = [`${10*32},${9*32}`,`${11*32},${10*9}`,`${12*32},${9*32}`,`${13*32},${9*32}`,`${14*32},${9*32}`,`${15*32},${9*32}`,`${16*32},${9*32}`,`${17*32},${9*32}`,`${18*32},${9*32}`,`${19*32},${9*32}`,]; + class OverworldMap { constructor(config) { // adding a back-reference to the overworld @@ -59,7 +86,7 @@ class OverworldMap { this.isCutscenePlaying = false; // reset npc's to do their normal behaviour - Object.values(this.gameObjects).forEach(object => object.doBehaviorEvent(this)) + Object.values(this.gameObjects).forEach(object => object.doBehaviorEvent(this)); } checkForActionCutscene() { @@ -83,13 +110,28 @@ class OverworldMap { checkForFootstepCutscene() { const hero = this.gameObjects['hero']; const match = this.cutsceneSpaces[`${hero.x},${hero.y}`]; - + // is undefined for normal tiles, but displays the object if you step on a tile that triggers a cutscene // console.log(match); if(!this.isCutscenePlaying && match) { this.startCutscene(match[0].events); // right now it's pulling the behavior at the 0th index. Can be changed depending on the current story } + + + // if hero steps on a 'set' of tiles that triggers 'one' cutscene + // then remove that 'set' of tiles for that corresponding cutscene from cutsceneSpaces + // optimize later, dividing by 32 for now, but use proper utils function later + const hero_tile = `${hero.x},${hero.y}`; + if (hemanth_cutscene_set_of_coords.includes(hero_tile)) { + console.log("before:", this.cutsceneSpaces); + // let tmp = {...this.cutsceneSpa + for(let i = 0; i < hemanth_cutscene_set_of_coords.length; i++) { + delete this.cutsceneSpaces[hemanth_cutscene_set_of_coords[i]]; + } + // this.cutsceneSpaces = [...tmp]; + console.log("after:", this.cutsceneSpaces); + } } addWall(x,y) { @@ -117,8 +159,8 @@ window.OverworldMaps = { hero: new Person({ isPlayerControlled: true, src: "./images/brownGuy1.png", - x: utils.withGrid(18), - y: utils.withGrid(25) + x: utils.withGrid(9), + y: utils.withGrid(10) }), // myDrone: new Person({ @@ -132,9 +174,9 @@ window.OverworldMaps = { // }), npcA: new Person({ - x: utils.withGrid(7), + x: utils.withGrid(19), y: utils.withGrid(9), - src: "./images/npc1.png", + src: "./images/brownGuy1.png", behaviorLoop: [ {type: "stand", direction: "left", time: 800}, {type: "stand", direction: "up", time: 800}, @@ -147,31 +189,42 @@ window.OverworldMaps = { events: [ {type: "textMessage", text: "I'm busy...", faceHero: "npcA"}, {type: "textMessage", text: "Go away!"}, - {who: "hero", type: "walk", direction: "left"} + // {who: "hero", type: "walk", direction: "left"} ] }, - - // saying a different thing later - // { - // events: [ - // {type: "textMessage", text: "Congrats on beating that boss!"} - // ] - // } - ] + ], }), + // // saying a different thing later + // // { + // // events: [ + // // {type: "textMessage", text: "Congrats on beating that boss!"} + // // ] + // // } + // ] + // }), - npcB: new Person({ - x: utils.withGrid(8), - y: utils.withGrid(5), - src: "./images/npc2.png", - // behaviorLoop: [ - // {type: "walk", direction: "left"}, - // {type: "stand", direction: "left", time: 800}, - // {type: "walk", direction: "up"}, - // {type: "walk", direction: "right"}, - // {type: "walk", direction: "down"} - // ] - }), + // npcB: new Person({ + // x: utils.withGrid(8), + // y: utils.withGrid(5), + // src: "./images/brownGuy1.png", + // behaviorLoop: [ + // {type: "walk", direction: "left"}, + // // {type: "stand", direction: "left", time: 800}, + // {type: "walk", direction: "up"}, + // {type: "walk", direction: "right"}, + // {type: "walk", direction: "down"}, + // ], + // talking: [ + // { + // // defined this way so that people can say different things, at different points in time + // events: [ + // {type: "textMessage", text: "It's about drive, it's about power", faceHero: "hemanth"}, + // {type: "textMessage", text: "We stay hungry, we devour!"}, + // // {who: "hero", type: "walk", direction: "left"} + // ] + // }, + // ] + // }), hemanth: new Person({ @@ -179,30 +232,10 @@ window.OverworldMaps = { y: utils.withGrid(10), src: "./images/brownGuy1.png", behaviorLoop: [ - {type:"walk",direction:"right"}, - {type:"walk",direction:"up"}, - {type:"walk",direction:"right"}, - {type:"walk",direction:"right"}, - {type:"walk",direction:"down"}, - {type:"walk",direction:"right"}, - {type:"walk",direction:"right"}, - {type:"walk",direction:"right"}, - {type:"walk",direction:"right"}, - {type:"walk",direction:"right"}, - // {type:"stand",direction:"r",time:500}, - {type:"walk",direction:"down"}, - {type:"walk",direction:"left"}, - {type:"walk",direction:"left"}, - {type:"walk",direction:"left"}, - {type:"walk",direction:"left"}, - {type:"walk",direction:"left"}, - {type:"walk",direction:"down"}, - {type:"walk",direction:"left"}, - {type:"walk",direction:"left"}, - // {type:"stand",direction:"u",time:500}, - {type:"walk",direction:"up"}, - {type:"walk",direction:"left"}, - {type:"walk",direction:"up"}, + {type: "stand", direction: "left", time: 800}, + {type: "stand", direction: "up", time: 800}, + {type: "stand", direction: "right", time: 1200}, + {type: "stand", direction: "up", time: 300} ], talking: [ { @@ -210,48 +243,81 @@ window.OverworldMaps = { events: [ {type: "textMessage", text: "It's about drive, it's about power", faceHero: "hemanth"}, {type: "textMessage", text: "We stay hungry, we devour!"}, - // {who: "hero", type: "walk", direction: "left"} ] }, + ] + }), - // saying a different thing later - // { - // events: [ - // {type: "textMessage", text: "Congrats on beating that boss!"} - // ] - // } + dhriti: new Person({ + x: utils.withGrid(2), + y: utils.withGrid(31), + src: "./images/dhriti.png", + behaviorLoop: [ + {type: "stand", direction: "left", time: 800}, + {type: "stand", direction: "up", time: 800}, + {type: "stand", direction: "right", time: 1200}, + {type: "stand", direction: "up", time: 300} + ], + talking: [ + { + // defined this way so that people can say different things, at different points in time + events: [ + {type: "textMessage", text: "It's about drive, it's about power", faceHero: "dhriti"}, + {type: "textMessage", text: "We stay hungry, we devour!"}, + ] + }, ] }), }, walls: { - [utils.asGridCoord(7,6)]: true, - [utils.asGridCoord(8,6)]: true, - [utils.asGridCoord(7,7)]: true, - [utils.asGridCoord(8,7)]: true, + // [utils.asGridCoord(7,6)]: true, + // [utils.asGridCoord(8,6)]: true, + // [utils.asGridCoord(7,7)]: true, + // [utils.asGridCoord(8,7)]: true, }, cutsceneSpaces: { - [utils.asGridCoord(7,4)]: [ - // doing it this way so that for example if you step on a cutscene space - // and if the cutscene gets over, then the same cutscene should not play when you step on the same tile again - { - events: [ - {who: "npcB", type: "walk", direction: "left"}, - {who: "npcB", type: "stand", direction: "up", time:500}, - {type: "textMessage", text: "You can't be in there!"}, - {who: "npcB", type: "walk", direction: "right"}, - {who: "hero", type: "walk", direction: "down"}, - {who: "hero", type: "walk", direction: "left"}, - ] - } - ], - [utils.asGridCoord(5,10)]: [ - { - events: [ - {type: "changeMap", map: "Kitchen"} // gets referenced in OverworldEvent - ] - } - ] + [utils.asGridCoord(10,9)]: [{events: hemanthPath}], + [utils.asGridCoord(11,9)]: [{events: hemanthPath}], + [utils.asGridCoord(12,9)]: [{events: hemanthPath}], + [utils.asGridCoord(13,9)]: [{events: hemanthPath}], + [utils.asGridCoord(14,9)]: [{events: hemanthPath}], + [utils.asGridCoord(15,9)]: [{events: hemanthPath}], + [utils.asGridCoord(16,9)]: [{events: hemanthPath}], + [utils.asGridCoord(17,9)]: [{events: hemanthPath}], + [utils.asGridCoord(18,9)]: [{events: hemanthPath}], + [utils.asGridCoord(19,9)]: [{events: hemanthPath}], + + + + // [utils.asGridCoord(5,10)]: [ + // { + // events: [ + // {type: "changeMap", map: "Kitchen"} // gets referenced in OverworldEvent + // ] + // } + // ] + // [utils.asGridCoord(7,4)]: [ + // // doing it this way so that for example if you step on a cutscene space + // // and if the cutscene gets over, then the same cutscene should not play when you step on the same tile again + // { + // events: [ + // {who: "npcB", type: "walk", direction: "left"}, + // {who: "npcB", type: "stand", direction: "up", time:500}, + // {type: "textMessage", text: "You can't be in there!"}, + // {who: "npcB", type: "walk", direction: "right"}, + // {who: "hero", type: "walk", direction: "down"}, + // {who: "hero", type: "walk", direction: "left"}, + // ] + // } + // ], + // [utils.asGridCoord(5,10)]: [ + // { + // events: [ + // {type: "changeMap", map: "Kitchen"} // gets referenced in OverworldEvent + // ] + // } + // ] } }, diff --git a/js/Person.js b/js/Person.js index c35c93f..813d771 100644 --- a/js/Person.js +++ b/js/Person.js @@ -12,6 +12,7 @@ class Person extends GameObject { "left": ["x", -2], "right": ["x", 2] } + } update(state) { @@ -30,25 +31,24 @@ class Person extends GameObject { direction: state.arrow }) } - this.updateSprite(state); } } startBehavior(state, behavior) { + // set character direction to whatever behavior has this.direction = behavior.direction; if(behavior.type === "walk") { // stop if space is not free (wall collision) if(state.map.isSpaceTaken(this.x, this.y, this.direction)) { - // if the player bumps into an npc, then once the npc can move, he should start moving behavior.retry && setTimeout(() => { + // this.retrying = true; this.startBehavior(state, behavior); }, 10); - return; // stop the function } @@ -60,7 +60,6 @@ class Person extends GameObject { if(behavior.type === "stand") { this.isStanding = true; - setTimeout(() => { utils.emitEvent("PersonStandComplete", { whoId: this.id @@ -77,7 +76,6 @@ class Person extends GameObject { if(this.movingProgressRemaining === 0) { // walking is finished - utils.emitEvent("PersonWalkingComplete", { whoId: this.id });