thepaperpilot/Advent-Incremental
1
0
Fork 0
mirror of https://github.com/thepaperpilot/Advent-Incremental.git synced 2024-11-22 00:21:34 +00:00
Code Issues Releases Activity Actions

Presents buildings

Browse source
This commit is contained in:
ducdat0507 2022-12-23 21:32:30 +07:00
parent ec71587eab
commit 3313609acf
3 changed files with 321 additions and 19 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

0
src/data/layers/factory-components/rotate_rectangle.png → src/data/layers/factory-components/__placeholder.png
View file

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.9 KiB

After

Width:  |  Height:  |  Size: 2.9 KiB

331
src/data/layers/factory.tsx
View file

@ -33,29 +33,51 @@ import { Direction, WithRequired } from "util/common";
import { ProcessedComputable } from "util/computed"; import { ProcessedComputable } from "util/computed";
import { render, renderGrid, renderRow, VueFeature } from "util/vue"; import { render, renderGrid, renderRow, VueFeature } from "util/vue";
import { computed, ComputedRef, reactive, ref, shallowRef, unref, watchEffect } from "vue"; import { computed, ComputedRef, reactive, ref, shallowRef, unref, watchEffect } from "vue";
import boxes from "./boxes";
import coal from "./coal";
import dyes from "./dyes";
import Factory from "./Factory.vue";
import metal from "./metal";
import oil from "./oil";
import paper from "./paper";
import plastic from "./plastic";
import "./styles/factory.css";
import Toy from "./Toy.vue";
import toys from "./toys";
import trees from "./trees";
import workshop from "./workshop";
import _cloth from "../symbols/cloth.png"; import _cloth from "../symbols/cloth.png";
import _dye from "../symbols/dyes.png"; import _dye from "../symbols/dyes.png";
import _metal from "../symbols/metal.png"; import _metal from "../symbols/metal.png";
import _plastic from "../symbols/plastic.png"; import _plastic from "../symbols/plastic.png";
import boxes from "./boxes"; import _boxes from "../symbols/cardboardBox.png";
import coal from "./coal"; import _wrappingPaper from "../symbols/wrappingPaper.png";
import dyes from "./dyes"; import _ribbon from "../symbols/ribbons.png";
import _bear from "./factory-components/bear.svg"; import _bear from "./factory-components/bear.svg";
import _bearMaker from "./factory-components/bearmaker.svg"; import _bearMaker from "./factory-components/bearmaker.svg";
import _bearWrapper from "./factory-components/__placeholder.png";
import _block from "./factory-components/block.svg"; import _block from "./factory-components/block.svg";
import _blockMaker from "./factory-components/blockmaker.svg"; import _blockMaker from "./factory-components/blockmaker.svg";
import _blockWrapper from "./factory-components/__placeholder.png";
import _bow from "./factory-components/__placeholder.png";
import _bowMaker from "./factory-components/__placeholder.png";
import _bucket from "./factory-components/bucket.svg"; import _bucket from "./factory-components/bucket.svg";
import _bucketMaker from "./factory-components/bucketmaker.svg"; import _bucketMaker from "./factory-components/bucketmaker.svg";
import _bucketShovel from "./factory-components/bucketshovel.svg"; import _bucketShovel from "./factory-components/bucketshovel.svg";
import _bucketShovelMaker from "./factory-components/bucketshovelmaker.svg"; import _bucketShovelMaker from "./factory-components/bucketshovelmaker.svg";
import _bucketShovelWrapper from "./factory-components/__placeholder.png";
import _button from "./factory-components/button.svg"; import _button from "./factory-components/button.svg";
import _buttonMaker from "./factory-components/buttonmaker.svg"; import _buttonMaker from "./factory-components/buttonmaker.svg";
import _circuitBoard from "./factory-components/circuit.svg"; import _circuitBoard from "./factory-components/circuit.svg";
import _circuitBoardMaker from "./factory-components/circuitmaker.svg"; import _circuitBoardMaker from "./factory-components/circuitmaker.svg";
import _clothes from "./factory-components/clothes.svg"; import _clothes from "./factory-components/clothes.svg";
import _clothesMaker from "./factory-components/clothesmaker.svg"; import _clothesMaker from "./factory-components/clothesmaker.svg";
import _clothesWrapper from "./factory-components/__placeholder.png";
import _console from "./factory-components/console.svg"; import _console from "./factory-components/console.svg";
import _consoleMaker from "./factory-components/consolemaker.svg"; import _consoleMaker from "./factory-components/consolemaker.svg";
import _consoleWrapper from "./factory-components/__placeholder.png";
import _conveyor from "./factory-components/conveyor.png"; import _conveyor from "./factory-components/conveyor.png";
import _cursor from "./factory-components/cursor.svg"; import _cursor from "./factory-components/cursor.svg";
import _delete from "./factory-components/delete.svg"; import _delete from "./factory-components/delete.svg";
@ -73,18 +95,11 @@ import _thread from "./factory-components/thread.svg";
import _threadMaker from "./factory-components/threadmaker.svg"; import _threadMaker from "./factory-components/threadmaker.svg";
import _truck from "./factory-components/truck.svg"; import _truck from "./factory-components/truck.svg";
import _truckMaker from "./factory-components/truckmaker.svg"; import _truckMaker from "./factory-components/truckmaker.svg";
import _truckWrapper from "./factory-components/__placeholder.png";
import _wheel from "./factory-components/wheel.svg"; import _wheel from "./factory-components/wheel.svg";
import _wheelMaker from "./factory-components/wheelmaker.svg"; import _wheelMaker from "./factory-components/wheelmaker.svg";
import Factory from "./Factory.vue"; import _wrappedBox from "./factory-components/__placeholder.png";
import metal from "./metal"; import _wrappedBoxMaker from "./factory-components/__placeholder.png";
import oil from "./oil";
import paper from "./paper";
import plastic from "./plastic";
import "./styles/factory.css";
import Toy from "./Toy.vue";
import toys from "./toys";
import trees from "./trees";
import workshop from "./workshop";
const id = "factory"; const id = "factory";
@ -356,7 +371,7 @@ const factory = createLayer(id, () => {
imageSrc: _shed, imageSrc: _shed,
extraImage: _wood, extraImage: _wood,
key: "1", key: "1",
name: "Wood Machine", name: "Wood Warehouse",
type: "processor", type: "processor",
description: computed(() => generateComponentDescription(FACTORY_COMPONENTS.wood)), description: computed(() => generateComponentDescription(FACTORY_COMPONENTS.wood)),
energyCost: 10, energyCost: 10,
@ -371,7 +386,7 @@ const factory = createLayer(id, () => {
imageSrc: _shed, imageSrc: _shed,
extraImage: _cloth, extraImage: _cloth,
key: "2", key: "2",
name: "Cloth Machine", name: "Cloth Warehouse",
type: "processor", type: "processor",
description: computed(() => generateComponentDescription(FACTORY_COMPONENTS.cloth)), description: computed(() => generateComponentDescription(FACTORY_COMPONENTS.cloth)),
energyCost: 10, energyCost: 10,
@ -386,7 +401,7 @@ const factory = createLayer(id, () => {
imageSrc: _shed, imageSrc: _shed,
extraImage: _dye, extraImage: _dye,
key: "3", key: "3",
name: "Dye Machine", name: "Dye Warehouse",
type: "processor", type: "processor",
description: computed(() => generateComponentDescription(FACTORY_COMPONENTS.dye)), description: computed(() => generateComponentDescription(FACTORY_COMPONENTS.dye)),
energyCost: 10, energyCost: 10,
@ -401,7 +416,7 @@ const factory = createLayer(id, () => {
imageSrc: _shed, imageSrc: _shed,
extraImage: _metal, extraImage: _metal,
key: "4", key: "4",
name: "Metal Machine", name: "Metal Warehouse",
type: "processor", type: "processor",
description: computed(() => generateComponentDescription(FACTORY_COMPONENTS.metal)), description: computed(() => generateComponentDescription(FACTORY_COMPONENTS.metal)),
energyCost: 10, energyCost: 10,
@ -416,7 +431,7 @@ const factory = createLayer(id, () => {
imageSrc: _shed, imageSrc: _shed,
extraImage: _plastic, extraImage: _plastic,
key: "5", key: "5",
name: "Plastic Machine", name: "Plastic Warehouse",
type: "processor", type: "processor",
description: computed(() => generateComponentDescription(FACTORY_COMPONENTS.plastic)), description: computed(() => generateComponentDescription(FACTORY_COMPONENTS.plastic)),
energyCost: 10, energyCost: 10,
@ -427,6 +442,54 @@ const factory = createLayer(id, () => {
} }
} }
} as FactoryComponentDeclaration, } as FactoryComponentDeclaration,
boxes: {
imageSrc: _shed,
extraImage: _boxes,
key: "6",
name: "Box Warehouse",
type: "processor",
description: computed(() => generateComponentDescription(FACTORY_COMPONENTS.boxes)),
energyCost: 10,
tick: 1,
outputs: {
boxes: {
amount: 1
}
},
visible: main.days[presentsDay - 1].opened
} as FactoryComponentDeclaration,
wrappingPaper: {
imageSrc: _shed,
extraImage: _wrappingPaper,
key: "7",
name: "Wrapping Paper Warehouse",
type: "processor",
description: computed(() => generateComponentDescription(FACTORY_COMPONENTS.wrappingPaper)),
energyCost: 10,
tick: 1,
outputs: {
wrappingPaper: {
amount: 1
}
},
visible: main.days[presentsDay - 1].opened
} as FactoryComponentDeclaration,
ribbon: {
imageSrc: _shed,
extraImage: _ribbon,
key: "8",
name: "Ribbon Warehouse",
type: "processor",
description: computed(() => generateComponentDescription(FACTORY_COMPONENTS.ribbon)),
energyCost: 10,
tick: 1,
outputs: {
ribbon: {
amount: 1
}
},
visible: main.days[presentsDay - 1].opened
} as FactoryComponentDeclaration,
plank: { plank: {
imageSrc: _plankMaker, imageSrc: _plankMaker,
key: "shift+1", key: "shift+1",
@ -587,6 +650,55 @@ const factory = createLayer(id, () => {
}, },
visible: main.days[advancedDay - 1].opened visible: main.days[advancedDay - 1].opened
} as FactoryComponentDeclaration, } as FactoryComponentDeclaration,
bow: {
imageSrc: _bowMaker,
key: "shift+0",
name: "Wrapped Box Manufacturer",
type: "processor",
description: computed(() => generateComponentDescription(FACTORY_COMPONENTS.bow)),
energyCost: 2,
tick: 1,
inputs: {
ribbon: {
amount: 1
}
},
outputs: {
bow: {
amount: 1
}
},
visible: main.days[presentsDay - 1].opened
} as FactoryComponentDeclaration,
wrappedBox: {
imageSrc: _wrappedBoxMaker,
key: "shift+0",
name: "Wrapped Box Manufacturer",
type: "processor",
description: computed(() => generateComponentDescription(FACTORY_COMPONENTS.wrappedBox)),
energyCost: 2,
tick: 1,
inputs: {
boxes: {
amount: 1
},
wrappingPaper: {
amount: 1
},
bow: {
amount: 1
},
ribbon: {
amount: 1
}
},
outputs: {
wrappedBox: {
amount: 1
}
},
visible: main.days[presentsDay - 1].opened
} as FactoryComponentDeclaration,
blocks: { blocks: {
imageSrc: _blockMaker, imageSrc: _blockMaker,
key: "ctrl+1", key: "ctrl+1",
@ -736,6 +848,144 @@ const factory = createLayer(id, () => {
} }
}, },
visible: main.days[advancedDay - 1].opened visible: main.days[advancedDay - 1].opened
} as FactoryComponentDeclaration,
wrappedBlocks: {
imageSrc: _blockWrapper,
key: "ctrl+shift+1",
name: "Wooden Block Wrapper",
type: "processor",
description: computed(() => generateComponentDescription(FACTORY_COMPONENTS.wrappedBlocks)),
energyCost: 20,
tick: 1,
inputs: {
block: {
amount: 1
},
wrappedBox: {
amount: 1
}
},
outputs: {
wrappedBlock: {
amount: 1
}
},
visible: main.days[presentsDay - 1].opened
} as FactoryComponentDeclaration,
wrappedClothes: {
imageSrc: _clothesWrapper,
key: "ctrl+shift+2",
name: "Clothes Wrapper",
type: "processor",
description: computed(() => generateComponentDescription(FACTORY_COMPONENTS.wrappedClothes)),
energyCost: 20,
tick: 1,
inputs: {
clothes: {
amount: 1
},
wrappedBox: {
amount: 1
}
},
outputs: {
wrappedClothes: {
amount: 1
}
},
visible: main.days[presentsDay - 1].opened
} as FactoryComponentDeclaration,
wrappedTrucks: {
imageSrc: _truckWrapper,
key: "ctrl+shift+3",
name: "Trucks Wrapper",
type: "processor",
description: computed(() => generateComponentDescription(FACTORY_COMPONENTS.wrappedTrucks)),
energyCost: 20,
tick: 1,
inputs: {
trucks: {
amount: 1
},
wrappedBox: {
amount: 1
}
},
outputs: {
wrappedTrucks: {
amount: 1
}
},
visible: main.days[presentsDay - 1].opened
} as FactoryComponentDeclaration,
wrappedBear: {
imageSrc: _bearWrapper,
key: "ctrl+shift+4",
name: "Teddy Bear Wrapper",
type: "processor",
description: computed(() => generateComponentDescription(FACTORY_COMPONENTS.wrappedBear)),
energyCost: 20,
tick: 1,
inputs: {
bear: {
amount: 1
},
wrappedBox: {
amount: 1
}
},
outputs: {
wrappedBear: {
amount: 1
}
},
visible: main.days[presentsDay - 1].opened
} as FactoryComponentDeclaration,
wrappedBucketShovel: {
imageSrc: _bucketShovelWrapper,
key: "ctrl+shift+5",
name: "Shovel and Pail Wrapper",
type: "processor",
description: computed(() => generateComponentDescription(FACTORY_COMPONENTS.wrappedBucketShovel)),
energyCost: 20,
tick: 1,
inputs: {
shovelBucket: {
amount: 1
},
wrappedBox: {
amount: 1
}
},
outputs: {
wrappedShovelBucket: {
amount: 1
}
},
visible: main.days[presentsDay - 1].opened
} as FactoryComponentDeclaration,
wrappedConsole: {
imageSrc: _consoleWrapper,
key: "ctrl+shift+6",
name: "Game Console Wrapper",
type: "processor",
description: computed(() => generateComponentDescription(FACTORY_COMPONENTS.wrappedConsole)),
energyCost: 20,
tick: 1,
inputs: {
console: {
amount: 1
},
wrappedBox: {
amount: 1
}
},
outputs: {
wrappedConsole: {
amount: 1
}
},
visible: main.days[presentsDay - 1].opened
} as FactoryComponentDeclaration } as FactoryComponentDeclaration
} as Record<string, FactoryComponentDeclaration>; } as Record<string, FactoryComponentDeclaration>;
const RESOURCES = { const RESOURCES = {
@ -760,6 +1010,18 @@ const factory = createLayer(id, () => {
name: "Metal", name: "Metal",
imageSrc: _metal imageSrc: _metal
}, },
boxes: {
name: "Boxes",
imageSrc: _boxes
},
wrappingPaper: {
name: "Wrapping Paper",
imageSrc: _wrappingPaper
},
ribbon: {
name: "Ribbon",
imageSrc: _ribbon
},
// Processed resources // Processed resources
plank: { plank: {
name: "Planks", name: "Planks",
@ -793,6 +1055,14 @@ const factory = createLayer(id, () => {
name: "Circuit Board", name: "Circuit Board",
imageSrc: _circuitBoard imageSrc: _circuitBoard
}, },
bow: {
name: "Bow",
imageSrc: _bow
},
wrappedBox: {
name: "Wrapped Box",
imageSrc: _wrappedBox
},
// Toys // Toys
block: { block: {
name: "Wooden Blocks", name: "Wooden Blocks",
@ -817,6 +1087,31 @@ const factory = createLayer(id, () => {
console: { console: {
name: "Game Console", name: "Game Console",
imageSrc: _console imageSrc: _console
},
// Wrapped toys
wrappedBlock: {
name: "Wrapped Wooden Blocks",
imageSrc: _block
},
wrappedClothes: {
name: "Wrapped Clothes",
imageSrc: _clothes
},
wrappedTrucks: {
name: "Wrapped Trucks",
imageSrc: _truck
},
wrappedBear: {
name: "Wrapped Teddy Bear",
imageSrc: _bear
},
wrappedShovelBucket: {
name: "Wrapped Shovel and Pail",
imageSrc: _bucketShovel
},
wrappedConsole: {
name: "Wrapped Game Console",
imageSrc: _console
} }
} as const; } as const;

9
src/data/layers/styles/factory.css
View file

@ -151,8 +151,10 @@
justify-content: space-evenly; justify-content: space-evenly;
align-items: flex-start; align-items: flex-start;
align-content: flex-start; align-content: flex-start;
justify-content: flex-start;
width: 148px; width: 148px;
direction: ltr; direction: ltr;
text-align: left;
} }
.comp-list::after { .comp-list::after {
@ -176,6 +178,11 @@
pointer-events: all; pointer-events: all;
} }
.comp-list .comp > img:first-child {
width: 50px;
height: 50px;
}
.comp-list .comp:nth-child(3)::after, .comp-list .comp:nth-child(3)::after,
.comp-list .comp:nth-child(4)::after { .comp-list .comp:nth-child(4)::after {
content: ""; content: "";
@ -192,7 +199,7 @@
.comp-list .comp:nth-child(4)::after { .comp-list .comp:nth-child(4)::after {
left: -50px; left: -50px;
} }
.comp-list .comp img.selected:not(.producedItem) { .comp-list .comp img.selected, .comp-list .comp img.selected + img {
transform: translate(-5px, -5px); transform: translate(-5px, -5px);
filter: drop-shadow(2px 2px 0 var(--foreground)) drop-shadow(5px 5px 5px #0007); filter: drop-shadow(2px 2px 0 var(--foreground)) drop-shadow(5px 5px 5px #0007);
} }