importer.html

<dit
>
  <div class="form-group import">
    <label class="import-options">Scene Name</label><input type='text' name="sceneName" />
  </div>
  <div class="form-group import" title="Select where the image is uploaded.">
    <label class="import-options">Storage Type</label>
    <select name="source" class="source-selector">
      {{#select defaultSource}}
      {{#each dataSources as |label key|}}
      <option value="{{key}}">{{label}}</option>
      {{/each}}
      {{/select}}
    </select>
  </div>
  <div class="form-group import">
    <label class="import-options">Image Type/Extension</label>
    <select name="extension">
      {{#select defaultExtension}}
      {{#each imgExtensions as |label key|}}
      <option value="{{key}}">{{label}}</option>
      {{/each}}
      {{/select}}
    </select>
  </div>
  <div class="form-group import convert-section" style="display: none" title="You can save images as webp which will make them a lot smaller, but creation time is a bit longer">
    <label class="import-options">convert to webp <i class="far fa-question-circle"></i></label>
    <input type="checkbox" name="convert-to-webp" {{#if webpConversion}}checked{{/if}}>
  </div>

  <div class="form-group import" title="This is where the image is uploaded. Your path should be relative to your User Data folder. e.g. worlds/yourworld/maps">
    <label class="import-options">Upload Path <i class="far fa-question-circle"></i></label>
    <input class= "path-input" type='text' name="path" value="{{path}}" />
  </div>

  <div class="warning path notification error" style="display: none">
    Your path should be relative to your User Data folder. e.g. worlds/yourworld/maps, or blank to place in the "Data" folder.
  </div>

  <div class="form-group import">
    <label class="import-options"
      title="Fidelity decides how many cave walls to skip - Right is high fidelity, no walls skipped">Fidelity <i class="far fa-question-circle"></i></label>
    <input class="fidelity-input" type="range" min="1" max="6" value="1" name="fidelity">
  </div>
  <div class="warning fidelity notification error" style="display: none">
    Higher Fidelity creates a very large amount of cave walls. Recommended to stay at the minimum.
  </div>
  <div class="form-group import">
    <label class="import-options">Upload Universal VTT (.dd2vtt, .df2vtt, .uvtt)</label>
  </div>
  <div class="form-group import" id="dd-upload-files">
    <button type="button" class="add-file">Add another file</button>
    <input class="file-input" type='file' name='file0' accept=".dd2vtt,.df2vtt,.uvtt" />
    <input class="hidden-input" type='hidden' value="1" name="filecount" />
    <div class="multi-mode-section" style="display: none">
      <label class="import-options">Add walls around single files</label>
      <input type="checkbox" name="walls-around-files" {{#if wallsAroundFiles}}checked{{/if}}>
      <br />
      <label class="import-options">Layout Mode</label>
      <select name="multi-mode">
        {{#select multiImageMode}}
        {{#each multiImageModes as |label key|}}
        <option value="{{key}}">{{label}}</option>
        {{/each}}
        {{/select}}
      </select><br />
      <label class="import-options">Image File Name (also Scenename if empty)</label><input type='text' name="imageFileName" />
    </div>
  </div>
  <div>
    <hr />
    <h3>Advanced:</h3>
    <div class="form-group import">
      <label class="import-options" title="Nudges the walls away from the edge. If you experience issues, leave at 0.">Offset <i class="far fa-question-circle"></i></label>
      <input type="number" min="-3" step="0.1" max="3" value="{{offset}}" name="offset">
    </div>
    <div class="s3-section" style="display: none">
      <div class="form-group import">
        <label class="import-options">Bucket Name for S3 Storage</label><input type='text' name="bucket" value="{{s3Bucket}}" />
      </div>
      <div class="form-group import">
        <label class="import-options">Region Name for S3 Storage</label><input type='text' name="region" value="{{s3Region}}" />
      </div>
    </div>
  </div>

  <button type="submit" class="import-map">Import</button>
</div>