createCarouselSlideUpload()

in source/webapp/src/lib/js/jsonUploadWizard.js [239:307]


  createCarouselSlideUpload(active = '') {
    const X = JsonUploadWizard.Constants.Carousel.Slide;
    const element = `
    <div
    class="carousel-item ${active}"
    id="${X.Upload.Id}"
    style="height: 400px">
      <div
      class="container"
      style="height: 100%; width: 96%;">
        <div
        class="row d-flex justify-content-center align-items-center"
        style="height: 90%;">
          <!-- graphics -->
          <div class="col-sm-3 px-0 text-center">
            <i class="fas fa-cloud-upload-alt" style="color: #ccc; font-size: 6em"></i>
          </div>

          <!-- content -->
          <div class="col-sm-9 px-0" style="overflow-y:scroll; height:90%;">
            <h4>Almost done</h4>
            <p class="mt-3" style="font-size:1rem; font-weight:300;">
              Click 'Start process' to ingest the file(s).
            </p>
            <ul
            class="list-group list-group-flush"
            id="${X.Upload.Filelist}"
            >
            </ul>
            <div class="mt-4">
              <span class="collapse"
              id=${X.Upload.Error}
              style="font-size:0.8rem; color:#ff0000;"
              >error message....
              </span>
            </div>
          </div>
        </div>

        <div class="row d-flex justify-content-end align-items-end">
          <!-- cancel -->
          <button
          type="button"
          class="btn btn-sm btn-light px-4 mx-1"
          data-action="${X.Cancel.Id}">
            Cancel
          </button>

          <!-- back -->
          <button
          type="button"
          class="btn btn-sm btn-primary px-4 mx-1"
          data-action="${X.FilePicker.Id}">
            Back
          </button>

          <!-- start upload -->
          <button
          type="button"
          class="btn btn-sm btn-success px-4 mx-1"
          data-action="${X.Upload.Action.StartUpload}">
            Start process
          </button>
        </div>
      </div>
    </div>
    `;
    return element;
  }