mason/tools/label_designer/save_and_download.mas

   1 <div class="text-center">
   2     <p>Last Step! Here you can edit additional layout settings and/or save your design.</p>
   3     <p>When you are ready, click 'download' to generate your labels. If you are trying to download a very large set, you will be given the option to download your labels in batches.</p>
   4 </div>
   5 <div id="save-labels-display"></div>
   6 <div style="clear: both"></div>
   7 <div style="margin-top: 40px; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 20px 40px">
   8     <div>
   9         <label>Sort Labels By:</label>
  10         <select class="form-control" id="sort_order_1" name="sort_by" style="max-width: 300px"></select>
  11     </div>
  12
  13     <!-- Additional Sort Options -->
  14     <div id="sort_order_2_container" style="display: none">
  15         <label>...Then by:<span style="font-size: 60%; margin-left: 15px; padding: 5px; border-radius: 5px; background-color: #ccc;">Optional</span></label>
  16         <select class="form-control" id="sort_order_2" name="sort_by" style="max-width: 300px"></select>
  17     </div>
  18     <div id="sort_order_3_container" style="display: none">
  19         <label>...Then by:<span style="font-size: 60%; margin-left: 15px; padding: 5px; border-radius: 5px; background-color: #ccc;">Optional</span></label>
  20         <select class="form-control" id="sort_order_3" name="sort_by" style="max-width: 300px"></select>
  21     </div>
  22
  23     <!-- Trial Layout Sort Options -->
  24     <div id="sort_order_layout_order_container" style="display: none">
  25         <label>...Plot Order:</label>
  26         <select class="form-control" id="sort_order_layout_order" name="sort_by" style="max-width: 300px">
  27             <option value="by_col_serpentine">By Column: Serpentine</option>
  28             <option value="by_col_zigzag">By Column: Zigzag</option>
  29             <option value="by_row_serpentine">By Row: Serpentine</option>
  30             <option value="by_row_zigzag">By Row: Zigzag</option>
  31         </select>
  32     </div>
  33     <div id="sort_order_layout_start_container" style="display: none">
  34         <label>...Starting Plot:</label>
  35         <select class="form-control" id="sort_order_layout_start" name="sort_by" style="max-width: 300px">
  36             <option value="bottom_left">Bottom Left</option>
  37             <option value="top_left">Top Left</option>
  38             <option value="top_right">Top Right</option>
  39             <option value="bottom_right">Bottom Right</option>
  40         </select>
  41     </div>
  42 </div>
  43 <div style="margin-top: 40px; margin-bottom: 40px; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 20px 40px">
  44     <div>
  45         <label>Set margins, # of rows/cols, etc:</label>
  46         <div class="input-group">
  47             <button class="btn btn-primary" id="edit_additional_settings">Edit Additional Settings</button>
  48         </div>
  49     </div>
  50     <div>
  51         <label>Save Label Design:</label>
  52         <div class="input-group" id="save_design_div">
  53             <input type="text" id="save_design_name" class="form-control" placeholder="Enter a name" />
  54             <span class="input-group-btn">
  55                 <button class="btn btn-default" id="d3-save-button" type="button">Save</button>
  56             </span>
  57         </div>
  58     </div>
  59     <div>
  60         <label>Download Labels:</label>
  61         <div class="input-group">
  62             <button id="d3-pdf-button" value="pdf" class="btn btn-primary" style="display:none;">Download pdf</button>
  63             <button id="d3-zpl-button" value="zpl" class="btn btn-primary" style="display:none;">Download zpl file</button>
  64         </div>
  65     </div>
  66 </div>