Filtering transloadit plugin results for assembly step

Uppy
1

Hi, thank you for the great tool. I’m using uppy dashboard and the transloadit plugin, to upload files to S3.

This is the code I have on my page, which I got from your manual. It’s basically used “as is” with a little tweak to set the width of the image that is displayed.

.on('transloadit:result', (stepName, result) => {
      // use transloadit encoding result here. 
      console.log('Result here ====>', stepName, result)
      const file = uppy.getFile(result.localId)
      var resultContainer = document.createElement('div')
      resultContainer.innerHTML = `
        <div>
          <h3>Name: ${file.name} ${result.meta.width}</h3>
          <img src="${result.ssl_url}" width="100px" /> <br />
          <a href="${result.ssl_url}">View</a>
        </div>
      `
      document
        .getElementById('uppy-transloadit-result')
        .appendChild(resultContainer)
    })

Given my template steps, when I drag/drop one file to the dashboard, what I end up with per the above code, is a list of five files in my div with an id of uppy-transloadit-result' This includes the original, two intermediate resized files, and two optimized files from the two intermediates. Basically it’s as expected.

What I’d like to do is, filter this code so that I have only the original file URL (step: :original), and the two final step optimized files only (step: compress_image). I don’t need the results from the intermediate steps in this list. I’m afraid I’m inexperienced in javascript, so my apologies in advance: could someone kindly say how can I achieve this?

2

If the step names are consistently known in advance, you can exit from the function early for all other steps:

.on('transloadit:result', (stepName, result) => {
  // skip everything _except_ :original and compress_image
  if (stepName !== ':original' && stepName !== 'compress_image') {
    return
  }
  // ... do the rest of the work here ...
})

If you don’t need those intermediate results at all, you can also set "result": false in your Assembly template for those steps.

3

@goto-bus-stop thanks so much, that works perfectly!

1 Like