#session-screen.screen.secondary[layout="screen" layout-id="session" layout-arg="id"]
  .content-head
    .content-icon
      = image_tag "shared/icon_session.png", {:height => 19, :width => 19}
    h1
      | session
  .content-body
    #session-controls
      a#session-resync.button-grey.resync.left
        = image_tag "content/icon_resync.png", {:align => "texttop", :height => 14, :width => 12}
        |  RESYNC 
      a#session-settings-button.button-grey.left[layout-link="session-settings"]
        = image_tag "content/icon_settings_sm.png", {:align => "texttop", :height => 12, :width => 12}
        |  SETTINGS 
      a.button-grey.left[layout-link="share-dialog"]
        = image_tag "content/icon_share.png", {:align => "texttop", :height => 12, :width => 12}
        |  SHARE 
      .block
        .label
          | VOLUME:
        #volume.fader.lohi[mixer-id=""]
      .block.monitor-mode-holder
        .label
          | MIX:
        select.monitor-mode.easydropdown
          option.label[value="personal"]
            | Personal
          option[value="master"]
            | Master
      a#session-leave.button-grey.right.leave[href="/client#/home"]
        | X  LEAVE
    #tracks
      .content-scroller
        .content-wrapper
          .session-mytracks
            h2
              | my tracks
            #track-settings.session-add[style="display:block;" layout-link="configure-tracks"]
              = image_tag "content/icon_settings_lg.png", {:width => 18, :height => 18}
              span
                | Settings
            .session-tracks-scroller
              #session-mytracks-container
              #voice-chat.voicechat[style="display:none;" mixer-id=""]
                .voicechat-label
                  | CHAT
                .voicechat-gain
                .voicechat-mute.enabled[control="mute" mixer-id=""]
          .session-livetracks
            h2
              | live tracks
            .session-add[layout-link="select-invites"]
              a#session-invite-musicians[href="#"]
                = image_tag "content/icon_add.png", {:width => 19, :height => 19, :align => "texttop"}
                |   Invite Musicians 
            .session-tracks-scroller
              #session-livetracks-container
                .when-empty.livetracks
                  |  No other musicians 
                  br
                  |  are in your session 
              br[clear="all"]
              #recording-start-stop.recording
                a
                  = image_tag "content/recordbutton-off.png", {:width => 20, :height => 20, :align => "absmiddle"}
                  |   
                  span#recording-status
                    | Make a Recording
          .session-recordings
            h2
              | other audio
            .session-recording-name-wrapper
              .session-recording-name.left
                | (No recording loaded)
              .session-add.right
                a#close-playback-recording[href="#"]
                  = image_tag "content/icon_close.png", {:width => 18, :height => 20, :align => "texttop"}
                  |   Close
            .session-tracks-scroller
              #session-recordedtracks-container
                .when-empty.recordings
                  span.open-media-file-header
                    = image_tag "content/icon_folder.png", {width:22, height:20}
                    |  Open:
                  ul.open-media-file-options
                    li
                      a#open-a-recording[href="#"]
                        | Recording
                    - if Rails.application.config.jam_tracks_available
                      li
                        a#open-a-jamtrack[href="#"]
                          | JamTrack
                    li
                      a#open-a-backingtrack[href="#"]
                        | Audio File
                .when-empty.use-metronome-header
                  = image_tag "content/icon_metronome.png", {width:22, height:20}
                  a#open-a-metronome[href="#"]
                    | Use Metronome
              br[clear="all"]
              = render "play_controls"
= render "configureTrack"
= render "addTrack"
= render "addNewGear"
= render "error"
= render "sessionSettings"
script#template-session-track[type="text/template"]  
  .session-track.track client-id="{clientId}" track-id="{trackId}"
    .track-vu-left.mixer-id="{vuMixerId}_vul" 
    .track-vu-right.mixer-id="{vuMixerId}_vur" 
    .track-label
      span.name-text="{name}"
    #div-track-close.track-close.op30 track-id="{trackId}" 
      =image_tag("content/icon_closetrack.png", {width: 12, height: 12})
    div class="{avatarClass}" 
      img src="{avatar}" 
    .track-instrument class="{preMasteredClass}" 
      img height="45" src="{instrumentIcon}" width="45" 
    .track-gain mixer-id="{mixerId}" 
    .track-icon-mute class="{muteClass}" control="mute" mixer-id="{muteMixerId}" 
    .track-icon-loop.hidden control="loop"
      input#loop-button type="checkbox" value="loop" Loop
    .track-connection.grey mixer-id="{mixerId}_connection"  
      CONNECTION  
    .disabled-track-overlay
    .metronome-selects.hidden
      select.metronome-select.metro-sound title="Metronome Sound"
        option.label value="Beep"  Bleep
        option.label value="Click" Click
        option.label value="Snare"  Drum
      br
      select.metronome-select.metro-tempo title="Metronome Tempo"
        - metronome_tempos.each do |t|
          option.label value=t
            =t

script#template-option type="text/template" 
  option value="{value}" title="{label}" selected="{selected}"
    ="{label}"

script#template-genre-option type="text/template" 
  option value="{value}"
    ="{label}"