129 lines
3.9 KiB
JavaScript
129 lines
3.9 KiB
JavaScript
import { Application, Assets, Container, Sprite, Rectangle } from "pixi.js";
|
|
import {
|
|
makeDragable,
|
|
backgroundLayout,
|
|
getIntersection,
|
|
makeUnDragable,
|
|
} from "../common";
|
|
import { Game } from "./game";
|
|
|
|
class DropZone {
|
|
constructor(sprite) {
|
|
this.sprite = sprite;
|
|
this.full = false;
|
|
}
|
|
|
|
drop(bottle) {
|
|
if (!this.full) {
|
|
this.full = true;
|
|
bottle.x = this.sprite.x;
|
|
bottle.y = this.sprite.y;
|
|
}
|
|
}
|
|
}
|
|
|
|
export class Fridge extends Game {
|
|
constructor() {
|
|
super();
|
|
|
|
this._bottleCount = 6;
|
|
this._bottlePlaced = 0;
|
|
|
|
const fridgeContainer = new Container();
|
|
fridgeContainer.layout = { width: "50%" };
|
|
const fridge = Sprite.from("frigo");
|
|
fridge.layout = backgroundLayout;
|
|
fridgeContainer.addChild(fridge);
|
|
|
|
const bottleContainer = new Container();
|
|
bottleContainer.layout = {
|
|
width: "50%",
|
|
flexDirection: "row",
|
|
flexWrap: "wrap",
|
|
};
|
|
const crate = Sprite.from("mate_caisse");
|
|
crate.layout = backgroundLayout;
|
|
bottleContainer.addChild(crate);
|
|
|
|
this.gameContainer.addChild(fridgeContainer);
|
|
this.gameContainer.addChild(bottleContainer);
|
|
|
|
const bottles = [];
|
|
this._dropZones = [];
|
|
|
|
const widthPercent = 0.12;
|
|
this.gameContainer.on("layout", (event) => {
|
|
const layoutBox = event.computedLayout;
|
|
for (const bottle of bottles) {
|
|
const width = layoutBox.width * widthPercent;
|
|
bottle.width = width;
|
|
bottle.height = width; // aspectRatio = 1
|
|
if (bottle.x + bottle.width > layoutBox.width) {
|
|
bottle.x = layoutBox.width - bottle.width;
|
|
}
|
|
if (bottle.y + bottle.height > layoutBox.height) {
|
|
bottle.y = layoutBox.height - bottle.height;
|
|
}
|
|
}
|
|
|
|
let i = 0;
|
|
for (const zone of this._dropZones) {
|
|
const width = layoutBox.width * (widthPercent + 0.01);
|
|
zone.sprite.width = width;
|
|
zone.sprite.height = width; // aspectRatio = 1
|
|
zone.sprite.x = i * width;
|
|
zone.sprite.y = 0;
|
|
i++;
|
|
}
|
|
});
|
|
|
|
for (let i = 0; i < this._bottleCount; i++) {
|
|
const sprite = Sprite.from("clubmate_grey");
|
|
this._dropZones.push(new DropZone(sprite));
|
|
this.gameContainer.addChild(sprite);
|
|
|
|
sprite.x = 0;
|
|
sprite.y = 0;
|
|
}
|
|
|
|
for (let i = 0; i < this._bottleCount; i++) {
|
|
const newBottle = Sprite.from("clubmate");
|
|
makeDragable(newBottle, (node) => {
|
|
this._onBottleDrop(node);
|
|
if (this._bottlePlaced >= this._bottleCount) {
|
|
this._win();
|
|
}
|
|
});
|
|
this.gameContainer.addChild(newBottle);
|
|
bottles.push(newBottle);
|
|
|
|
newBottle.x = 800;
|
|
newBottle.y = 0;
|
|
}
|
|
}
|
|
|
|
reset() {}
|
|
|
|
_onBottleDrop(bottle) {
|
|
console.log("dropped at", bottle.position);
|
|
|
|
const intersection = new Rectangle();
|
|
for (const dropZone of this._dropZones) {
|
|
getIntersection(
|
|
dropZone.sprite.getBounds(),
|
|
bottle.getBounds(),
|
|
intersection,
|
|
);
|
|
const intersectArea = intersection.width * intersection.height;
|
|
const bottleArea = bottle.width * bottle.height;
|
|
if (intersectArea > 0.5 * bottleArea) {
|
|
if (!dropZone.full) {
|
|
dropZone.drop(bottle);
|
|
this._bottlePlaced++;
|
|
makeUnDragable(bottle); // maybe not needed
|
|
return;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|