bigbluebutton-Github/bigbluebutton-html5/app/client/views/modals/modals.html

<template name="bbbSettingsInfo">
  {{{getBBBSettingsInfo}}}
</template>

<!-- listen only | microphone -->
<template name="settingsAudio">
  <fieldset class="desktopSettingsFieldset">
    <legend>Audio Options</legend>
    {{#if amIInAudio}}
      {{#if amIListenOnlyAudio}}
        <!-- display microphone with join -->
        {{> makeButton id="joinMicrophone" btn_class="joinMicrophone settingsButton joinAudioButton" i_class="fi-microphone" rel="tooltip"
        data_placement="bottom" title="Join Microphone"}}
        <!-- display listen only with exit -->
        {{> makeButton id="exitAudio" btn_class="exitAudio settingsButton joinAudioButton" i_class="fi-prohibited" rel="tooltip"
        data_placement="bottom" title="Leave Audio Call"}}
      {{else}}
        <!-- display microphone with exit -->
        {{> makeButton id="exitAudio" btn_class="exitAudio settingsButton joinAudioButton" i_class="fi-prohibited" rel="tooltip"
        data_placement="bottom" title="exit"}}
        <!-- display join listen only -->
        {{> makeButton id="joinListenOnly" btn_class="joinListenOnly settingsButton joinAudioButton" i_class="fi-volume" rel="tooltip"
        data_placement="bottom" title="Join Listen only"}}

        <!-- to be inserted back into the navbar -->
        <!-- different icons for speaking -->
        {{#if isCurrentUserMuted}}
          <!-- if you are muted the button representing your status will show volume off -->
          {{> makeButton btn_class="muteIcon" i_class="glyphicon glyphicon-volume-off" sharingAudio=true rel="tooltip" data_placement="bottom" title="Unmute"}}
        {{else}}
          {{#if isCurrentUserTalking}}
            <!-- you are talking. Display a high volume/volume up representing voice activity -->
            {{> makeButton btn_class="muteIcon" i_class="glyphicon glyphicon-volume-up" sharingAudio=true rel="tooltip" data_placement="bottom" title="Mute"}}
          {{else}}
            <!-- you are not talking. Display low volume/volume down representing no voice activity -->
            {{> makeButton btn_class="muteIcon" i_class="glyphicon glyphicon-volume-down" sharingAudio=true rel="tooltip" data_placement="bottom" title="Mute"}}
          {{/if}}
        {{/if}}
      {{/if}}
    {{else}}
      <!-- display both with join -->
      {{> makeButton id="joinMicrophone" btn_class="joinMicrophone settingsButton joinAudioButton" i_class="fi-microphone"
      rel="tooltip" data_placement="bottom" title="Join Microphone"}}
      {{> makeButton id="joinListenOnly" btn_class="joinListenOnly settingsButton joinAudioButton" i_class="fi-volume"
      rel="tooltip" data_placement="bottom" title="Join Listen only"}}
    {{/if}}
  </fieldset>
</template>

<template name="settingsCloseButton">
  {{#if equals link "x"}}
    <a href="#" class="closeSettings close-reveal-modal" style="font-size: 30px; position: inherit;">&#215;</a>
  {{else}}
    <a href="#" class="closeSettings close-reveal-modal" style="font-size: 12px; position: inherit;"><u>Cancel</u></a>
  {{/if}}
</template>

<template name="settingsSaveButton">
  {{> makeButton id="saveSettings" btn_class="settingsButton"  rel="tooltip"
  title="Save Changes" style="margin-bottom: 0px; background-color: #007095; border-radius: 15px; padding: 5px 10px 5px 10px" text="Save"}}
</template>

<template name="settingsModal">
  <div id="settingsModal" class="reveal-modal medium" data-reveal aria-labelledby="modalTitle" aria-hidden="true" role="dialog" data-options="close_on_background_click:false">
    <div class="bar" style="border-bottom:1px solid grey">
      <p style="float: left">
        <i class="ion-gear-b" style="font-size:30px">
          <span class="modalTitle">BigBlueButton Settings</span>
        </i>
      </p>
      <p style="text-align:right">{{>settingsCloseButton link="x"}}</p>
    </div>

    <div style="padding: 10px; text-align: center;">
      <!-- <p>Share Camera</p> -->
      {{> settingsAudio}}<br/>
      {{> optionsFontSize}}<br/>
      {{> bbbSettingsInfo}}
    </div>

    <div class="bar" style="border-top:1px solid grey; text-align: right;">
      {{>settingsCloseButton link="link"}}
      {{>settingsSaveButton}}
    </div>
</div>
</template>