v1.2.0

1.2.0 (2024-11-08)

Embedding Globus-Sourced Assets

With this release, we've included a beta release of rendering Globus-sourced assets as a field on search and result pages.

If you have any issues or feedback related to this new feature, please feel free to open an issue!

Using "type": "globus.embed"

The derived value for the globus.embed field definition should be either:

• The Globus HTTPS Path, with options.collections¹ configured in the static.json file.
• Or, a compatible options object.

Using a property Lookup

In the example below, a preview_url property has been added to the search result – this property is the Globus HTTPS URL of the asset we want to display on the result.

By using the property configuration and a JSON path lookup, we can dynamically source the value from the result. Since we can't derive the Collection from this HTTPS URL, options.collection must also be configured in the field definition. This implementation works well if all of the content in your search index is hosted on the same collection.

// Result Excerpt
{
  "entries": [
    {
      "content": {
        "preview_url": "https://m-eef34f.fa5e.bd7c.data.globus.org/home/globus-shared-user/joebott/file-types/status-chunky-pause.svg"
      }
    }
  ]
}
// Field Definition
{
  "label": "Preview",
  "property": "entries[0].content.preview_url",
  "type": "globus.embed",
  "options": {
    // Providing the collection is REQUIRED to ensure proper authorization for the asset can be programmatically initiated.
    "collection": "996383e6-0c85-4339-a5ea-c3cd855c2692"
  }
}

When your assets are hosted across many collections, and/or you want more control on the options provided to the globus.embed field, an alternative is to use a JSON path lookup to an object. The provided object will then be passed as options. The example below demonstrates this.

// Result Excerpt
{
  "entries": [
    {
      "content": {
        "embed_preview": {
          "collection": "996383e6-0c85-4339-a5ea-c3cd855c2692",
          // When using this options method, you only need to supply the relative `path` to the asset, **not** the HTTPS URL.
          "path": "/home/globus-shared-user/joebott/file-types/status-chunky-pause.svg"
        }
      }
    }
  ]
}
// Field Definition
{
  "label": "Preview",
  "property": "entries[0].content.embed_preview",
  "type": "globus.embed"
}

Using a Hardcoded value

An asset can be "hardcoded" into a field by using value instead of property.

{
  "label": "Embedded Asset",
  "value": "https://m-eef34f.fa5e.bd7c.data.globus.org/home/globus-shared-user/joebott/file-types/status-chunky-pause.svg",
  "type": "globus.embed",
  "options": {
    "collection": "996383e6-0c85-4339-a5ea-c3cd855c2692"
  }
}

Supported Content Types

The default renderer will introspect the Content-Type returned by the asset and do its best to render the result to the screen for the user. Our initial implementation uses the <object> tag for embedding, content type support will be determined by the user's browser.

Plotly Support

We've also introduced the ability to render these Globus-sourced assets as a Plotly chart or graph using the Plotly JavaScript Open Source Graphing Library.

To use this functionality options.renderer should be set to plotly and the sourced asset should be a JSON object that is compatible with Plotly.newPlot single configuration object parameter.

{
  "label": "Plotly Chart",
  "value": "https://m-eef34f.fa5e.bd7c.data.globus.org/home/globus-shared-user/joebott/file-types/plotly/data.json",
  "type": "globus.embed",
  "options": {
    "collection": "996383e6-0c85-4339-a5ea-c3cd855c2692",
    "renderer": "plotly",
    "width": "985px",
    "height": "100%"
  }
}

1. This is currently required to ensure proper programatic authorization for the asset can occur. ↩