spacedeck-open/views/partials/tool/toolbar-elements.html

<div class="toolbar toolbar-elements" v-bind:class="{in:toolbar_artifacts_in,out:!toolbar_artifacts_in}" v-show="!is_active_space_role('viewer') && active_space_loaded">

  <div class="btn-group light vertical">

    <a class="btn btn-icon btn-transparent"
       title="<%=__("home")%>" href="/spaces"
       v-if="(!active_space.parent_space_id && !guest_nickname && !embedded)">
      <span class="icon icon-folder"></span>
    </a>

    <a class="btn btn-icon btn-dark"
       title="Parent Folder"
       href="/folders/{{active_space.parent_space_id}}"
       v-if="(active_space.parent_space_id && !guest_nickname && !embedded)">

      <span class="icon icon-sd6 icon-svg"></span>
    </a>

    <button class="btn btn-divider"></button>

    <button class="btn btn-icon-labeled btn-transparent" v-on:click="start_pan()" v-bind:class="{active:active_tool=='pan'}" title="<%=__("tool_pan")%>">
      <span class="icon icon-move"></span>
      <span class="icon-label"><%=__("tool_pan")%></span>
    </button>

    <div class="dropdown top left light" v-bind:class="{open:opened_dialog=='shapes'}">
      <div class="btn-collapse in" title="<%=__("tool_shape")%>">
        <button class="btn btn-transparent btn-icon-labeled" v-bind:class="{open:opened_dialog=='shapes'}" v-on:click="open_dialog('shapes')">
          <span class="icon icon-shapes"></span>
          <span class="icon-label"><%=__("tool_shape")%></span>
        </button>
      </div>

      <div class="dialog">
        <%- include("./shapes.html") %>
      </div>
    </div>

    <button class="btn btn-icon-labeled btn-transparent" v-on:click="start_drawing_scribble()" v-bind:class="{active:active_tool=='scribble'}" title="<%=__("tool_scribble")%>">
      <span class="icon icon-tool-scribble"></span>
      <span class="icon-label"><%=__("tool_scribble")%></span>
    </button>

    <button class="btn btn-icon-labeled btn-transparent" v-on:click="start_drawing_arrow()" v-bind:class="{active:active_tool=='arrow'}" title="<%=__("tool_arrow")%>">
      <span class="icon icon-tool-arrow"></span>
      <span class="icon-label"><%=__("tool_arrow")%></span>
    </button>

    <button class="btn btn-icon-labeled btn-transparent" v-on:click="start_drawing_line()" v-bind:class="{active:active_tool=='line'}" title="<%=__("tool_line")%>">
      <span class="icon icon-tool-line"></span>
      <span class="icon-label"><%=__("tool_line")%></span>
    </button>

    <div class="dropdown bottom light center">
      <div class="btn-collapse in">
        <input type="file" multiple v-on:change="handle_image_file_upload($event)" id="image_file_upload" class="btn btn-transparent btn-icon-labeled" style="position: absolute; z-index: 1; opacity: 0;">
        <button class="btn btn-transparent btn-icon-labeled" title="<%=__("media")%>">
          <span class="icon icon-upload"></span>
          <span class="icon-label" ><%=__("media")%></span>
        </button>
      </div>
    </div>

    <div class="dropdown bottom light center">
      <div class="btn-collapse in">
        <button class="btn btn-transparent btn-icon-labeled" v-on:click="start_adding_note()" v-bind:class="{active:active_tool=='note'}" title="<%=__("tool_text")%>">
          <span class="icon icon-tool-text"></span>
          <span class="icon-label"><%=__("tool_text")%></span>
        </button>
      </div>
    </div>

    <div class="dropdown top left light" v-bind:class="{open:opened_dialog=='zones'}">
      <div class="btn-collapse in">
        <button class="btn btn-transparent btn-icon-labeled" v-bind:class="{open:opened_dialog=='zones'}" v-on:click="open_dialog('zones')" title="<%=__("tool_zones")%>">
          <span class="icon icon-zone"></span>
          <span class="icon-label"><%=__("tool_zones")%></span>
        </button>
      </div>

      <div class="dialog">
        <%- include("./zones.html") %>
      </div>
    </div>

    <button class="btn btn-divider" v-show="logged_in"></button>

    <div class="dropdown top left center" v-show="logged_in" v-bind:class="{open:opened_dialog=='background'}">
      <div class="btn-collapse in">
        <button class="btn btn-transparent btn-icon-labeled" v-bind:class="{open:opened_dialog=='background'}" v-on:click="open_dialog('background')" title="<%=__("tool_canvas")%>">
          <span class="letter">bg</span>
          <span class="icon-label"><%=__("tool_canvas")%></span>
        </button>
      </div>

      <div class="dialog">
        <%- include("./background.html") %>
      </div>
    </div>

    <button class="btn btn-transparent btn-icon-labeled"
            v-if="active_space_role=='admin'"
            v-on:click="activate_access()"
            title="<%= __('share') %>">
      <span class="icon icon-share"></span>
      <span class="icon-label"><%= __('share') %></span>
    </button>

    <!--
            <li v-on:click="edit_space_title()" v-if="logged_in">
              <span>
                <span class="icon icon-sm icon-tag"></span>
                <span><%=  __('rename') %></span>
              </span>
            </li>
            -->
    <button class="btn btn-transparent btn-icon-labeled" title="Start Presentation (others follow what you see)" v-on:click="toggle_present_mode()" v-bind:class="{open:present_mode}">
      <span class="icon icon-presentation"></span>
      <span class="icon-label"><%= __('present') %></span>
    </button>

  </div>
</div>