link scenarios to backend

src/components/SceneDesigner/Scene.vue

@@ -1,24 +1,31 @@
 <template>
     <teleport to=".scene-designer" v-if="active">
         <g @mousedown="$emit('target', {target:vd, attrs:['x1', 'y1'], delta: true})" :class="{scene: true, selected}">
-            <svg-icon :src="`/asset/thumb/${modelValue.environment}.webp`" :x="vd.x1" :y="vd.y1" :size="65"></svg-icon>
+            <svg-icon :src="`/asset/thumb/${modelValue.environment||0}.webp`" :x="vd.x1" :y="vd.y1" :size="65"></svg-icon>
         </g>
     </teleport>
     <v-card title="Scene" v-if="selected">
         <v-form class="pa-4">
             <v-text-field density="compact" :label="$l.name" v-model="modelValue.name"></v-text-field>
         </v-form>
-        <v-btn prepend-icon="mdi-panorama-outline" ></v-btn>
+
+        <asset-selector @select="modelValue.environment = $event" type="Scene">
+            <template v-slot:activator="props">
+                <v-btn v-bind="props" icon="mdi-panorama-outline"></v-btn>
+            </template>
+        </asset-selector>
+
     </v-card>
 </template>
 
 <script>
 import SvgIcon from './SvgIcon.vue';
 import Utils from '@/lib/utils';
+import AssetSelector from './AssetSelector.vue';
 
 export default {
   emits:['target'],
-  components: { SvgIcon },
+  components: { SvgIcon, AssetSelector },
     data(){
         return {
             active: false
@@ -28,6 +35,7 @@ export default {
         this.active = true;
     },
     props:{
+        //context: Object,
         modelValue: Object,
         vd: Object,
         selected: Boolean,