pd_canvas.html

<div id="patch" class="patch">
  <div class="d-flex justify-content-between align-items-center">
    <h6 class="patch-filename" id="patch-filename" style="margin-right: auto; margin-left: auto;"></h6>
    <button id="close-canvas" type="button" class="close" aria-label="Close">
      <span class="p-2" aria-hidden="true">&times;</span>
    </button>
  </div>
  <div class="rounded">
    <!-- Patch menu -->
    <ul class="patch-menu" id="patch-menu">
      <!-- File section -->
      <li id="menu-file">
        <ul class="rounded shadow">
          <li id="file-save"></li>
          <li id="file-saveas"></li>
          <li id="file-download"></li>
          <li id="file-print"></li>
          <li id="file-message"></li>
          <li id="file-close"></li>
        </ul>
      </li>

      <!-- Edit section -->
      <li id="menu-edit">
        <ul class="rounded shadow">
          <li id="edit-undo"></li>
          <li id="edit-redo"></li>
          <li id="edit-cut"></li>
          <li id="edit-copy"></li>
          <li id="edit-paste"></li>
          <li id="edit-paste-clipboard"></li>
          <li id="edit-duplicate"></li>
          <li id="edit-selectall"></li>
          <li id="edit-reselect"></li>
          <li id="edit-tidyup"></li>
          <li id="edit-font"></li>
          <li id="edit-cordinspector">
            <input type="checkbox" class="ml-2" id="cordinspector" />
          </li>
          <li id="edit-find"></li>
          <li id="edit-findagain"></li>
          <li id="edit-finderror"></li>
          <li id="edit-editmode">
            <input type="checkbox" class="ml-2" id="editmode" />
          </li>
        </ul>
      </li>

      <!-- View Section -->
      <li id="menu-view">
        <ul class="rounded shadow">
          <li id="view-zoomin"></li>
          <li id="view-zoomout"></li>
          <li id="view-zoomreset"></li>
          <li id="view-optimalzoom"></li>
          <li id="view-horizzoom"></li>
          <li id="view-vertzoom"></li>
          <li id="view-fullscreen"></li>
        </ul>
      </li>

      <!-- Put Section -->
      <li id="menu-put">
        <ul class="rounded shadow">
          <li id="put-object"></li>
          <li id="put-msgbox"></li>
          <li id="put-number"></li>
          <li id="put-symbol"></li>
          <li id="put-comment"></li>
          <li id="put-dropdown"></li>
          <li id="put-bang"></li>
          <li id="put-toggle"></li>
          <li id="put-number2"></li>
          <li id="put-vslider"></li>
          <li id="put-hslider"></li>
          <li id="put-vradio"></li>
          <li id="put-hradio"></li>
          <li id="put-vu"></li>
          <li id="put-cnv"></li>
          <li id="put-array"></li>
        </ul>
      </li>

      <!-- Window Section -->
      <li id="menu-window">
        <ul class="rounded shadow">
          <li id="window-nextwin"></li>
          <li id="window-prevwin"></li>
          <li id="window-parentwin"></li>
          <li id="window-visible-ancestor"></li>
          <li id="window-pdwin"></li>
        </ul>
      </li>
    </ul>
  </div>

  <!-- Create canvas draw area -->
  <div id="patchsvg_holder_" class="patch-holder">
    <div class="patch_window_svg" id="patch_div_">
      <svg
        xmlns="http://www.w3.org/2000/svg"
        version="1.1"
        id="patchsvg_"
        class="noselect"
        viewBox="0 0 0 0"
      ></svg>
    </div>
  </div>

  <!-- Canvas find -->
  <div id="canvas-find">
    <div id="canvas_find" style="display: none">
      <label
        ><input
          type="text"
          id="canvas_find_text"
          name="canvas_find_text"
          defaultValue="Search in Canvas"
          style="width: 10em"
        />
      </label>
      <button
        type="button"
        id="canvas_find_button"
        data-i18n="[title]canvas.find.search_tt"
      >
        <span data-i18n="canvas.find.search"></span>
      </button>
    </div>
  </div>
</div>