REACT-DJ USER STORIES

gistfile1.txt

As a user, I want to import songs so I can play them

As a user, I want to play songs

As a user, I want to load a song while another song is play without interrupting the currently playing song

As a user, I want to crossfade between songs, so the music never stops

As a user, I want to have an "auto-mix-mode" so I do not have to manually crossfade between songs

As a user, I want to apply FX to songs so I can get creative and make the mix my own

As a user, I want to loop a section of the currently playing song, so I can create remixes/mashups on the fly

As a user, I want to record my mixes so I can share them

As a user, I want to be able to upload my mixes to soundcloud so I can share them

<app>
  <title></title>
  <dj-panel>
    <deck>
      <turntable></turntable>
      <deck-controls justified="left">
        <equalizer>
          <!-- <radio-buttons></radio-buttons> -->
        </equalizer>
        <volume-control></volume-control>
        <fader title="Deck ${1} Fader" range="100" effect="deck1Fader"></fader>
      </deck-controls>
      <fx-panel>
        <fader title="Reverb" range="100" effect="reverb"></fader>
      </fx-panel>
      <song-search>
        <!-- search soundcloud for songs,
          when clicking load push song to deck playlist -->
      </song-search>
    </deck>
    <deck>
      <turntable></turntable>
      <deck-controls justified="left">
        <equalizer>
          <!-- <radio-buttons></radio-buttons> -->
        </equalizer>
        <volume-control></volume-control>
        <fader title="Deck ${2} Fader" range="100" effect="deckFader"></fader>
      </deck-controls>
      <fx-panel>
        <fader title="Reverb" range="100" effect="reverb"></fader>
      </fx-panel>
      <song-search>
        <!-- search soundcloud for songs,
          when clicking load push song to deck playlist -->
      </song-search>
    </deck>
    <crossfader style="position: absolute"></crossfader>
  </dj-panel>
</app>

const state = {
  deck1: {
    currentSong: Object //song1
    effects: {
      reverb: 0,
      delay: 0,
      etc...
    },
    equalizer: {
      hi: 0,
      mid: 0,
      low: 0
    },
    playback: {
      playing: true
      volumen: 23
    }
    playlist: [
      //song2
      //song3
    ]
  },
  deck2: {
    //same as deck 1
  }
};