Customizer class

[avonian]

@jalmasi @eldinor this is not an actual issue but since we don't have a developer channel I'm creating this ticket just to inform you guys and will close once you acknowledge.

I created a 'Customizer' class (https://github.com/SoundStageFM/soundstage-vr/commit/7258420ab0c9577a39b9d1325aad54860a5d0b43) which will read event config in order to customize environments (including custom posters which Andrei worked on - fyi I deleted that branch since that code is now merged into main)

To see custom posters you can add the following to the .env.local "posters":[{"name":"posterLeft_1280-666","width":3.84,"height":2,"posX":-5,"posY":4.45,"posZ":-5.5,"rotationY":-90,"url":"https://www.youredm.com/wp-content/uploads/2020/09/Launch-Promo-Landscape.jpg"},{"name":"posterLeft_1-1","width":2,"height":2,"posX":-5,"posY":4.45,"posZ":-2,"rotationY":-90,"url":"https://www.soundstage.fm/storage/photos/m682Pgdu3AIjWMAZA6UIjYWy7TKemMkr2D8lG4j4.png"},{"name":"posterLeft_3-4_1","width":1.8,"height":2.4,"posX":-5,"posY":4.45,"posZ":1.5,"rotationY":-90,"url":"https://www.soundstage.fm/storage/photos/NsLIxIB39n6jZHjjVyd70UxEEzwqRM9ErTWgwfDl.jpg"},{"name":"posterLeft_3-4_2","width":1.8,"height":2.4,"posX":-5,"posY":4.45,"posZ":4,"rotationY":-90,"url":"https://www.soundstage.fm/storage/photos/ZP5RxnLdO8YcxYNpeeCPYQ4BLRZ0CvnCKV4y2X3V.png"},{"name":"posterCenter_16-9","width":4.8,"height":2.7,"posX":2,"posY":4.45,"posZ":-8.57,"rotationY":180,"url":"https://www.soundstage.fm/storage/photos/ERJGCrb9uJWoqsLK3aFHKJWyu0a6bfBhgZCUqLTa.png"},{"name":"posterRight_3-1","width":6,"height":2,"posX":9.23,"posY":4.45,"posZ":0,"rotationY":90,"url":"https://pbs.twimg.com/profile_banners/1153539090777878528/1602776851/1500x500"},{"name":"posterCorner_3-4","width":3,"height":4,"posX":8.2,"posY":4.3,"posZ":-7.5,"rotationY":135,"url":"https://www.soundstage.fm/storage/photos/NsLIxIB39n6jZHjjVyd70UxEEzwqRM9ErTWgwfDl.jpg"}]

[jalmasi]

Works for me. However, 1) .env.local is getting uglier and becoming unmanageable 2) event config not subject to version control

I'd prefer to have something like

config/ josip.json andrei.json ara.json 2021-04-25-sundayparty.json 2021-04-29-thisandthatartist.json ... .env.local: VUE_APP_DEMO_CONFIG=josip.json and the web app would just send json file name.

Not sure how to do it though due to packaging constraints, i.e. how our app can load a json file. Seems super simple: https://stackoverflow.com/questions/43735486/load-static-json-file-in-webpack

And now I just discovered I can't attach json file to github ticket :) Well, here's the example, inline:

{
  "event_slug":"josips-dev-space",
  "alias":"Josip",
  "role":"staff",
  "permissions":{
    "access_backstage":true,
    "spawn_backstage":false,
    "access_ramp":true,
    "broadcast":true,
    "moderator":true, 
    "stage_controls": true
  },
  "mediaSoup":{
    "url":"wss:\/\/mediasoup.soundstage.fm"
  },
  "highFidelity":{
    "url":"api-pro.highfidelity.com",
    "token":"eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJhcHBfaWQiOiJmMzRlZmViZC00YWRjLTRlZTMtOWNkNS0yOGE3OTcwOThhZmQiLCJ1c2VyX2lkIjoiam9zaXAiLCJzcGFjZV9pZCI6ImQxYmM3Yjg0LTUwYmUtNDU0Zi04Yzc4LTczNmVhN2Q0NzYwYSIsInN0YWNrIjoiYXVkaW9uZXQtbWl4ZXItYXBpLXByby0wNSJ9.S2StFJf2VpOQyNnpqL79P5cngUDcN1UvdVWYT-cpYO4"
  },
  "posters":[
    {
      "name":"posterLeft_1280-666",
      "width":3.84,
      "height":2,
      "posX":-5,
      "posY":4.45,
      "posZ":-5.5,
      "rotationY":-90,
      "url":"https://www.youredm.com/wp-content/uploads/2020/09/Launch-Promo-Landscape.jpg"
    },
    {
      "name":"posterLeft_1-1",
      "width":2,
      "height":2,
      "posX":-5,
      "posY":4.45,
      "posZ":-2,
      "rotationY":-90,
      "url":"https://www.soundstage.fm/storage/photos/m682Pgdu3AIjWMAZA6UIjYWy7TKemMkr2D8lG4j4.png"
    },
    {
      "name":"posterLeft_3-4_1",
      "width":1.8,
      "height":2.4,
      "posX":-5,
      "posY":4.45,
      "posZ":1.5,
      "rotationY":-90,
      "url":"https://www.soundstage.fm/storage/photos/NsLIxIB39n6jZHjjVyd70UxEEzwqRM9ErTWgwfDl.jpg"
    },
    {
      "name":"posterLeft_3-4_2",
      "width":1.8,
      "height":2.4,
      "posX":-5,
      "posY":4.45,
      "posZ":4,
      "rotationY":-90,
      "url":"https://www.soundstage.fm/storage/photos/ZP5RxnLdO8YcxYNpeeCPYQ4BLRZ0CvnCKV4y2X3V.png"
    },
    {
      "name":"posterCenter_16-9",
      "width":4.8,
      "height":2.7,
      "posX":2,
      "posY":4.45,
      "posZ":-8.57,
      "rotationY":180,
      "url":"https://www.soundstage.fm/storage/photos/ERJGCrb9uJWoqsLK3aFHKJWyu0a6bfBhgZCUqLTa.png"
    },
    {
      "name":"posterRight_3-1",
      "width":6,
      "height":2,
      "posX":9.23,
      "posY":4.45,
      "posZ":0,
      "rotationY":90,
      "url":"https://pbs.twimg.com/profile_banners/1153539090777878528/1602776851/1500x500"
    },
    {
      "name":"posterCorner_3-4",
      "width":3,
      "height":4,
      "posX":8.2,
      "posY":4.3,
      "posZ":-7.5,
      "rotationY":135,
      "url":"https://www.soundstage.fm/storage/photos/NsLIxIB39n6jZHjjVyd70UxEEzwqRM9ErTWgwfDl.jpg"
    }
  ]
}

[avonian]

event config not subject to version control

I wouldn't place too much concern on that right now, I think it will be a while before i turns into a serious pain point worth addressing.

config/ josip.json andrei.json ara.json 2021-04-25-sundayparty.json 2021-04-29-thisandthatartist.json

for real events the configs are retreived via web service, see the ajax at https://github.com/SoundStageFM/soundstage-vr/blob/ce92d3168b3369d9089b125c5343fa4ecce3c115/src/ui/App.vue#L306

the only issue is local dev for you/me/andrei. personally i'm not too fond of including json files with tokens and such in our builds, it's not really a best practice.

it's not hard to beautify/stingify these things, just use this when you need to work with it https://codebeautify.org/jsonviewer

[jalmasi]

Well then skip tokens, include posters only, and other space properties to come.

[avonian]

Good point, I'll handle it shortly :)

[avonian]

@jalmasi @eldinor config system has been updated https://github.com/SoundStageFM/soundstage-vr/commit/c07aee15bb2366fb1b4631cc3308bd418b4e7ca9

in the new system we have a config folder with a base.config.js, and your own custom config for local dev (e.g. ara.config.js) which you are free to modify and commit

after pulling look at .env.sample in order to update your .env.local, as you can see it's pretty self-explanatory:

VUE_APP_API_URL=https://dev.www.soundstage.fm
VUE_APP_SERVER_URL=wss://vr.soundstage.fm/vrspace
VUE_APP_DEMO_CONFIG=ara.config.js VUE_APP_HIGH_FIDELITY_TOKEN=xxxxxxxxxxxxxxxxxx VUE_APP_SKIP_WELCOME=false