screenly / playground

Asset Metadata - screenly/playground

Asset metadata in Screenly refers to additional information associated with digital assets, such as images, videos, or documents, which can be used to manage and organize them more effectively. This information can include details like the asset’s title, description, author, creation date, and tags.

Implementing and using asset metadata in Edge Apps can provide several benefits, such as:

  • Improved organization and searchability of assets
  • Automated sorting and filtering of assets based on metadata criteria
  • Ability to display additional asset information alongside the main content

Here are some possible options for implementing asset metadata in Screenly Edge Apps, along with examples for each option:

1. Using JSON metadata files

One way to implement asset metadata in Screenly is to use JSON metadata files that are stored alongside the main asset files. These metadata files can contain any number of key-value pairs that describe the associated asset.

For example, a metadata file for an image asset might look like this:

{
"title": "Sunset over the ocean",
"description": "A beautiful sunset over the ocean, taken on a recent vacation.",
"author": "John Doe",
"date": "2022-01-01",
"tags": ["ocean", "sunset", "vacation"]
}

To use this metadata in an Edge App, you could write code that reads the JSON file and extracts the relevant metadata fields. For example:

const fs = require('fs');
const metadataPath = '/path/to/metadata.json';

const metadata = JSON.parse(fs.readFileSync(metadataPath, 'utf8'));
const title = metadata.title;
const description = metadata.description;
const author = metadata.author;
const date = metadata.date;
const tags = metadata.tags;

// Display the metadata fields on the screen

2. Using HTML metadata tags

Another way to implement asset metadata in Screenly is to use HTML metadata tags that are embedded directly in the HTML code for the Edge App. These tags can include any number of key-value pairs that describe the associated asset.

For example, an HTML file for an image asset might include metadata tags like this:

<!DOCTYPE html>
<html>
<head>
<meta name="title" content="Sunset over the ocean">
<meta name="description" content="A beautiful sunset over the ocean, taken on a recent vacation.">
<meta name="author" content="John Doe">
<meta name="date" content="2022-01-01">
<meta name="tags" content="ocean, sunset, vacation">
</head>
<body>
<img src="/path/to/image.jpg" alt="Sunset over the ocean">
</body>
</html>

To use this metadata in an Edge App, you could write code that extracts the metadata fields from the HTML tags. For example:

const metadata = {
title: document.querySelector('meta[name="title"]').content,
description: document.querySelector('meta[name="description"]').content,
author: document.querySelector('meta[name="author"]').content,
date: document.querySelector('meta[name="date"]').content,
tags: document.querySelector('meta[name="tags"]').content.split(', ')
};

// Display the metadata fields on the screen

3. Using custom HTTP headers

A third way to implement asset metadata in Screenly is to use custom HTTP headers that are included in the HTTP response when the asset is requested. These headers can include any number of key-value pairs that describe the associated asset.

For example, an HTTP response for an image asset might include headers like this:

HTTP/1.1 200 OK
Content-Type: image/jpeg
Content-Length: 12345
X-Title: Sunset over the ocean
X-Description: A beautiful sunset over the ocean, taken on a recent vacation.
X-Author: John Doe
X-Date: 2022-01-01
X-Tags: ocean, sunset, vacation

To use this metadata in an Edge App, you could write code that extracts the metadata fields from the HTTP headers. For example:

const metadata = {
title: request.headers.get('X-Title'),
description: request.headers.get('X-Description'),
author: request.headers.get('X-Author'),
date: request.headers.get('X-Date'),
tags: request.headers.get('X-Tags').split(', ')
};

// Display the metadata fields on the screen

Regardless of which method you choose, it’s important to ensure that the metadata is consistent and accurate, so that it can be used effectively to manage and organize your assets.

Sources: