freeswitch/html5/verto/verto_communicator/src/partials/settings.html

<div id="settings" ng-controller="SettingsController">
  <div class="content">
    <div class="col-md-4">

      <div class="form-group" ng-show="mydata.useVideo">
        <label for="settings-camera">{{ 'CAMERA_SETTINGS' | translate }}</label>
        <select name="camera" id="settings-camera" class="form-control"
                ng-model="mydata.selectedVideo" ng-options="item.id as item.label for item in verto.data.videoDevices">
        </select>
      </div>

      <div class="form-group" ng-show="mydata.useVideo">
        <label for="settings-share-device">{{ 'SHARE_DEVICE' | translate }}</label>
        <select name="share-device" id="settings-share-device" class="form-control"
                ng-model="mydata.selectedShare" ng-options="item.id as item.label for item in verto.data.shareDevices">
        </select>
      </div>

      <div class="form-group">
        <label for="settings-microphone">{{ 'MIC_SETTINGS' | translate}}</label>
        <select name="microphone" id="settings-microphone" class="form-control"
                ng-model="mydata.selectedAudio" ng-options="item.id as item.label for item in verto.data.audioDevices">
        </select>
      </div>

      <div class="form-group">
        <label for="settings-microphone">
          {{ 'SPEAKER' | translate }}
          <span ng-show="!speakerFeature" class="unsupported">
            {{ 'SPEAKER_FEATURE' | translate }}
          </span>
        </label>
        <select name="microphone" id="settings-microphone" class="form-control" ng-disabled="!speakerFeature"
                ng-model="mydata.selectedSpeaker" ng-options="item.id as item.label for item in verto.data.speakerDevices">
        </select>
      </div>

      <div class="form-group">
        <label for="settings-framerate">{{ 'BEST_FRAME_RATE' | translate }}</label>
        <select name="settings-framerate" id="settings-framerate" class="form-control"
                ng-model="mydata.bestFrameRate"
                ng-options="item.id as item.label for item in verto.framerate"></select>
      </div>

      <a class="btn btn-primary" href="" ng-click="showPreview()">{{ 'PREVIEW_SETTINGS' | translate }}</a>
      <a class="btn btn-primary" href="" ng-click="refreshDeviceList()">{{ 'REFRESH_DEVICE_LIST' | translate }}</a>
    </div>
    <div class="col-md-4">
      <div class="form-group">
        <label for="settings-microphone">{{ 'GENERAL_SETTINGS' | translate }}</label>
        <div class="checkbox">
          <label>
            <input type="checkbox" name="use_video" value="mydata.useVideo" ng-model="mydata.useVideo">
            <span ng-bind="'USE_VIDEO' | translate"></span>
          </label>
        </div>
        <div class="checkbox">
          <label>
            <input type="checkbox" name="use_stereo_audio" ng-value="mydata.useStereo" ng-model="mydata.useStereo">
            <span ng-bind="'USE_STEREO_AUDIO' | translate"></span>
          </label>
        </div>
        <div class="checkbox">
          <label>
            <input type="checkbox" name="use_stun" ng-value="mydata.useSTUN" ng-model="mydata.useSTUN">
            <span ng-bind="'USE_STUN' | translate"></span>
          </label>
        </div>
        <div class="checkbox">
          <label>
            <input type="checkbox" name="mirror_input" ng-value="mydata.mirrorInput" ng-model="mydata.mirrorInput">
            <span ng-bind="'SCALE_VIDEO' | translate"></span>
          </label>
        </div>
        <div class="checkbox">
          <label>
            <input type="checkbox" name="ask_recover_call" ng-value="mydata.askRecoverCall" ng-model="mydata.askRecoverCall">
            <span ng-bind="'ASK_BEFORE_RECOVER' | translate"></span>
          </label>
        </div>

        <div class="form-group">
          <label for="settings-language">{{ 'LANGUAGE' | translate }}</label>
          <select name="mylanguage" id="settings-language" class="form-control"
                  ng-model="mydata.language" ng-change="changedLanguage(mydata.language)"
                  ng-options="item.id as item.name for item in languages">
          </select>
        </div>

        <div class="form-group">
          <label for="settings-microphone">{{ 'AUDIO_SETTINGS' | translate }}</label>
          <div class="checkbox">
            <label>
              <input type="checkbox" name="googEchoCancellation" value="mydata.googEchoCancellation" ng-model="mydata.googEchoCancellation">
              <span ng-bind="'ECHO_CANCEL' | translate"></span>
            </label>
          </div>
          <div class="checkbox">
            <label>
              <input type="checkbox" name="googNoiseSuppression" value="mydata.googNoiseSuppression" ng-model="mydata.googNoiseSuppression">
              <span ng-bind="'NOISE_SUPPRESSION' | translate"></span>
            </label>
          </div>
          <div class="checkbox">
            <label>
              <input type="checkbox" name="googHighpassFilter" value="mydata.googHighpassFilter" ng-model="mydata.googHighpassFilter">
              <span ng-bind="'HIGHPASS_FILTER' | translate"></span>
            </label>
          </div>
        </div>
      </div>
    </div>

    <div class="col-md-4">

      <div class="form-group">
        <label>{{ 'VIDEO_SETTINGS' | translate }}</label> <br>
        <input type="hidden" name="use_dedenc" ng-value="mydata.useDedenc" ng-model="mydata.useDedenc">


        <div ng-show="mydata.useDedenc" class="dedicated_encoder">
          <p>{{ 'REMOTE_ENCODER' | translate }}</b>
        </div>

        <div class="checkbox">
          <label>
            <input type="checkbox" ng-model="mydata.autoBand" ng-change="checkAutoBand(mydata.autoBand)">
            <span ng-bind="'AUTO_SPEED_RES' | translate"></span>
          </label>
        </div>

        <div class="checkbox" ng-show="mydata.autoBand">
          <label>
            <input type="checkbox" ng-model="mydata.testSpeedJoin">
            <span ng-bind="'RECHECK_BANDWIDTH' | translate"></span>
          </label>
        </div>

        <a ng-show="mydata.autoBand" class="btn btn-primary" href="" ng-click="testSpeed()">{{ 'CHECK_NETWORK_SPEED' | translate }}</a> <span ng-bind="speedMsg"></span>

        <div ng-show="!mydata.autoBand">
          <label for="video-quality">{{ 'VIDEO_QUALITY' | translate }}</label>
          <select name="video_quality" id="video-quality" class="form-control"
                  ng-disabled="mydata.autoBand"
                  ng-model="mydata.vidQual"
                  ng-change="checkVideoQuality(mydata.vidQual)"
                  ng-options="item.id as item.label for item in verto.videoQuality"></select>
        </div>

        <div ng-show="!mydata.autoBand">
          <label for="incoming-bandwidth">{{ 'MAX_INCOMING_BANDWIDTH' | translate }}</label>
          <select name="incoming_bandwidth" id="incoming-bandwidth" class="form-control"
                  ng-model="mydata.incomingBandwidth"
      	    ng-change="checkUseDedRemoteEncoder(mydata.incomingBandwidth)"
                  ng-options="item.id as item.label for item in verto.bandwidth"></select>
        </div>

        <div ng-show="!mydata.autoBand">
          <label for="outgoing-bandwidth">{{ 'MAX_OUTGOING_BANDWIDTH' | translate }}</label>
          <select name="outgoing_bandwidth" id="outgoing-bandwidth" class="form-control"
                  ng-model="mydata.outgoingBandwidth"
                  ng-options="item.id as item.label for item in verto.bandwidth"></select>
        </div>
      </div>
    </div>
  </div>
</div>