Use items as the key for soundscape lists

Using the index was causing weird problems during deletion. It would
get offset.

src/components/Menu.vue

@@ -2,19 +2,11 @@
   <div id="menu">
     <div class="list-label">Sounds</div>
     <div class="list">
-      <draggable
-        v-for="(source, index) in presetSources"
-        :key="index"
-        :node="source"
-      />
+      <draggable v-for="source in presetSources" :key="source" :node="source" />
     </div>
     <div class="list-label">Filters</div>
     <div class="list">
-      <draggable
-        v-for="(source, index) in presetFilters"
-        :key="index"
-        :node="source"
-      />
+      <draggable v-for="filter in presetFilters" :key="filter" :node="filter" />
     </div>
     <div class="list-label">Presets</div>
     <div class="list">

src/components/SoundscapeComp.vue

@@ -2,8 +2,8 @@
   <div class="soundscape">
     <div class="soundscape-section">
       <source-node
-        v-for="(source, index) in soundscape.sources"
-        :key="index"
+        v-for="source in soundscape.sources"
+        :key="source"
         :source="source"
         v-on:delete="deleteSource(source)"
       >
@@ -17,8 +17,8 @@
     </div>
     <div class="soundscape-section">
       <filter-node
-        v-for="(filter, index) in soundscape.filters"
-        :key="index"
+        v-for="filter in soundscape.filters"
+        :key="filter"
         :filter="filter"
         v-on:delete="deleteFilter(filter)"
       >