Skip to content

Commit

Permalink
Merge pull request #182 from Benjythebee/add/overlayTextureManager
Browse files Browse the repository at this point in the history
Working great! :) we just need to update docs, will add a new issue for it :)
  • Loading branch information
memelotsqui authored Nov 21, 2024
2 parents 1187e9b + 0d24410 commit 3e6f7b9
Show file tree
Hide file tree
Showing 15 changed files with 739 additions and 122 deletions.
2 changes: 1 addition & 1 deletion public/manifest.json
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@
"name": "Anata",
"description": "Male",
"portrait": "./assets/portraitImages/male.jpg",
"manifest":"https://m3-org.github.io/loot-assets/anata/male/manifest.json",
"manifest":"./loot-assets/anata/male/manifest.json",
"format": "vrm"
},
{
Expand Down
68 changes: 68 additions & 0 deletions src/components/decals/decalGrid.jsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,68 @@
import React from "react";
import styles from "../../pages/Appearance.module.css";
import cancel from '../../images/cancel.png';
import {SceneContext} from "../../context/SceneContext";
import CustomButton from "../custom-button";
import {combineURLs} from "../../library/load-utils";
import DecalItem from "./decalItem";

const DecalGridView = ({selectedTraitGroup,onBack})=>{
const {decalManager,characterManager} = React.useContext(SceneContext);
const [selectedDecals, setSelectedDecals] = React.useState([]);

const decals = selectedTraitGroup.getAllDecals();
React.useEffect(()=>{
const selected= Array.from(decalManager.applied.keys())
setSelectedDecals(selected.map((x)=>x));
},[])


return (
<div className={styles["selector-container-column"]}>
<CustomButton
theme="dark"
text={"Back"}
size={14}
className={styles.buttonLeft}
onClick={onBack}
/>
<div className={styles["selector-container"]} >
<DecalItem key={"empty"}
src={cancel}
active={false}
select={()=>{
decalManager.removeAllOverlayedTextures()
setSelectedDecals([]);
}}
/>
{decals.map((decal)=>{
const path = combineURLs(characterManager.manifestData.getTraitsDirectory(),decal.thumbnail);

return (
<DecalItem
key={decal.id}
src={path}
active={selectedDecals.includes(decal.id)}
select={()=>{
if(selectedDecals.includes(decal.id)){
decalManager.removeOverlayTexture(decal.id).then(()=>{
setSelectedDecals(selectedDecals.filter((x)=>x!==decal.id));
})

}else{
decalManager.loadOverlayTexture(selectedTraitGroup,decal.id).then(()=>{
setSelectedDecals(selectedDecals.concat([decal.id]));
})
}
}}
/>
)
})}
</div>

</div>
)
}


export default DecalGridView;
21 changes: 21 additions & 0 deletions src/components/decals/decalItem.jsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
import React from 'react';
import styles from "../../pages/Appearance.module.css"
import {TokenBox} from '../token-box';

const DecalItem = ({active,src,select})=>{

return (
<div
className={`${styles["selectorButton"]}`}
onClick={select}
>
<TokenBox
size={56}
icon={src||''}
rarity={active ? "mythic" : "none"}
/>
</div>
)
}

export default DecalItem;
3 changes: 3 additions & 0 deletions src/context/SceneContext.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@ export const SceneProvider = (props) => {
const [characterManager, setCharacterManager] = useState(null)
const [loraDataGenerator, setLoraDataGenerator] = useState(null)
const [spriteAtlasGenerator, setSpriteAtlasGenerator] = useState(null)
const [decalManager, setDecalManager] = useState(null)
const [thumbnailsGenerator, setThumbnailsGenerator] = useState(null)
const [sceneElements, setSceneElements] = useState(null)
const [animationManager, setAnimationManager] = useState(null)
Expand Down Expand Up @@ -46,6 +47,7 @@ export const SceneProvider = (props) => {
setSceneElements(sceneElements);
setAnimationManager(characterManager.animationManager)
setLookAtManager(characterManager.lookAtManager)
setDecalManager(characterManager.overlayedTextureManager)
setControls(controls);
setLoraDataGenerator(new LoraDataGenerator(characterManager))
setSpriteAtlasGenerator(new SpriteAtlasGenerator(characterManager))
Expand Down Expand Up @@ -132,6 +134,7 @@ export const SceneProvider = (props) => {
manifest,
setManifest,
scene,
decalManager,
characterManager,
loraDataGenerator,
spriteAtlasGenerator,
Expand Down
Binary file added src/images/sticker.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading

0 comments on commit 3e6f7b9

Please sign in to comment.