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

<template name="whiteboard">
  <div id="{{id}}" class="component">
    {{#if getCurrentSlide}}
      {{>slide}}
      {{forceSlideShow}}
    {{else}}
      {{clearSlide}}
    {{/if}}

    <div id="whiteboard-container" class="{{whiteboardSize}}">
      <div id="whiteboard-paper">
      </div>
      <!-- TODO: Move this to the whiteboardControls -->
      <div class="FABContainer {{#unless hasNoPresentation}}noPresentation{{/unless}}">
        <button type="submit" class="FABTriggerButton">
          <i class="ion-android-hand"></i>
        </button>
        {{#each emojiIcons}}
          <button type="submit" value={{name}} class="{{name}}EmojiButton {{#if equals getCurrentUserEmojiStatus name}}activeEmojiButton{{else}}inactiveEmojiButton{{/if}}">
            {{> icon name=icon size="50"}}
          </button>
        {{/each}}
      </div>
      {{#if isMobile}}
        {{> makeButton btn_class="soaringButton fullscreenButton whiteboardFullscreenButton" i_class="ion-arrow-expand"}}
      {{/if}}
    </div>
    {{#if isCurrentUserPresenter}}
      {{> whiteboardControls}}
    {{/if}}
    {{#if isPollStarted}}
      {{> polling}}
    {{/if}}
  </div>
</template>

<template name="whiteboardControls">
  <div id="whiteboard-controls">
    <div class="whiteboard-buttons-left">
      <!-- TODO: Adjust the presenter uploader for mobile views on iOS devices
                 you cant upload PDFs, only images from camera/gallery -->
      {{#unless isMobile}}
        {{> presenterUploaderControl}}
      {{/unless}}
    </div>
    <div class="whiteboard-buttons-right">
    </div>
    <div class="whiteboard-buttons-center">
      {{#if isCurrentUserPresenter}}
        <div class="whiteboard-buttons-slide">
          {{> makeButton btn_class="prev" i_class="ion-arrow-left-a" rel="tooltip" data_placement="top" title="Previous"}}
          <span class="current">
            {{presentationProgress}}
          </span>
          {{> makeButton btn_class="next" i_class="ion-arrow-right-a" rel="tooltip" data_placement="top" title="Next"}}
        </div>
      {{/if}}
    </div>
  </div>
</template>

<template name="presenterUploaderControl">
  {{#if isCurrentUserPresenter}}
    <div class="presenter-uploader-control {{#if isOpen}}is-open{{/if}}">
      <div class="presenter-uploader-container">
        <ul class="presenter-uploader-file-list">
          {{#each files}}
            {{> presenterUploaderControlFileListItem}}
          {{/each}}
          {{#each presentations}}
            {{> presenterUploaderControlPresentationListItem}}
          {{/each}}
        </ul>
        <div class="presenter-uploader-dropzone" data-dropzone>
          <input type="file" class="presenter-uploader-dropzone-fileinput" multiple />
          <i class="presenter-uploader-dropzone-icon ion-archive"></i>
          <span class="presenter-uploader-dropzone-label">Drop files here <br/>or click to upload</span>
        </div>
        {{> makeButton btn_class="presenter-uploader-control-btn js-close" i_class="ion-ios-close-outline"}}
        <div class="presenter-uploader-tip">
          UPLOAD ANY OFFICE DOCUMENT OR PORTABLE DOCUMENT FORMAT (PDF) FILE.
          <br/>
          FOR BEST RESULTS UPLOAD PDF.
        </div>
      </div>
      {{> makeButton btn_class="presenter-uploader-control-btn js-open" i_class="ion-ios-upload-outline"}}
    </div>
  {{/if}}
</template>

<template name="presenterUploaderControlFileListItem">
  <li class="presenter-uploader-file-item is-uploading">
    <span class="presenter-uploader-file-item-name">
      {{name}}
    </span>
    <span class="presenter-uploader-file-item-progress">
      {{percUploaded}}%
    </span>
  </li>
</template>

<template name="presenterUploaderControlPresentationListItem">
  <li class="presenter-uploader-file-item {{#if current}}current{{/if}}">
    <span class="presenter-uploader-file-item-name" data-action-show>
      {{name}}
    </span>
    <span class="presenter-uploader-file-item-actions">
      {{#unless current}}
        <i class="ion-ios-eye-outline" data-action-show></i>
      {{/unless}}
      <i class="ion-ios-trash-outline" data-action-delete></i>
    </span>
  </li>
</template>