A metadata service is always associated with a specific preview panel. When a content item is opened in a preview panel, it takes some time until its metadata is loaded. This happens asynchronously via the above mentioned message service. Consequently, it is necessary to have a mechanism to listen to the availability of a conten item's metadata. In addition, changes to the metadata may occur when the displayed content item of the preview panel changes. Thus, it is also necessary to listen to metadata changes.

To this end, the method IMetadataService.getMetadataTree() is dependency-tracked. This means that it is possible to listen to changes to the returned metadata tree by using a function value expression (see @coremedia/studio-client.client-core/data/dependencies/DependencyTracker and @coremedia/studio-client.client-core/data/ValueExpressionFactory). The following example is provided to illustrate this process:

import ValueExpressionFactory from "@coremedia/studio-client.client-core/data/ValueExpressionFactory";
import PreviewPanel from "@coremedia/studio-client.main.editor-components/sdk/preview/PreviewPanel";

const previewPnl:PreviewPanel // = ...
ValueExpressionFactory.createFromFunction(()=> {
  const metadataTree = previewPnl.getMetadataService().getMetadataTree();
  return metadataTree.getRoot() ? metadataTree : undefined;
}).loadValue(metadataTree => {
  // metadata tree loaded!
  metadataTree.getAsList() //...
});

In this example MetadataTree.getRoot() is used as an indicator of whether the metadata has already been loaded (if not, the method returns null). A function value expression is created around a function that simply determines the existence of a metadata root node, returning undefined as long as it does not exist. Afterwards the value expression is loaded, which automatically retries to invoke the function until it returns a non undefined value. As soon as it does, the metadata has been loaded and the callback function can now process the metadata tree.