Can someone help me getting the right manifest-structure ?

[alphakanal]

Hi Community!

First of all a happy new year to all and stay healthy!!

I'm pretty new to JavaScript so it's maybe a stupid question but a big deal for me :-) I'm preloading diverse images into my application ( SPA / AngularJS ) - and got stuck into the problem how to structure my PreloadJS manifest the right way.

The Challenge:
I have a collection of stickers
each sticker has got different properties ( name, xpos, ypos ..etc )
each sticker has three different color-versions ( three different background-images to preload )

Now i'm struggling the last few days how to structure my manifest.json ( now i got 3 for each sticker - feels not right ) in a way so i can put the loaded images into a array that i can access them like:

myStickerArray[0].name ( all the properties )
myStickerArray[0].backgroundimage.v1 ( the preloaded image )
myStickerArray[0].backgroundimage.v2 ( the preloaded image )
myStickerArray[0].backgroundimage.v3 ( the preloaded image )

Thanks in advance for every hint!! 

[lannymcnie]

Any reason not to dynamically build the manifest by iterating the sticker arrays?

[alphakanal]

Hi!
The reason why i'd like to make this dynamically is that the stickers that will be loaded depend on the date ( valentine, spring, summer, xmas etc ). I hope i got you right - my english is not native

My solution right now is to load a main-manifest.json which includes a sub-manifest.json for each sticker.
The main-manifest looks like this:

            {
                "manifest": [
                    {"id":"sicker-1", "src": "sticker1_img.json", "type":"manifest",
                        "name":"sticker 1", 
                        "xpos": "10",
                        "img": []
                        
                        },

                    {"id":"sicker-2", "src": "sticker2_img.json", "type":"manifest",
                        "name":"sticker 2", 
                        "xpos": "20",
                        "img": []
                        
                        }

                        
                        
                ]
            }

My sub-manifests :

            {
                "manifest": [
                    {
                        "id": "sticker1-v1",
                        "src": "my-bg.png"
                    },
                    {
                        "id": "sticker1-v2",
                        "src": "my-bg.png"
                    }
                    
                ]
            }

And on the onHandleLoadFile() Function:
I put my manifest-objects ( sticker-1, sticker-2 .... ) into a array. And then i'm filtering the images by id and put them into the img array of the manifest-object they belong

[lannymcnie]

This is a pretty specific use-case. I am closing this. Feel free to reopen if you have any suggestions on implementation, or open an issue with a more specific proposal.