Design

How it works

Header (Homepage)

Header is composed of :

• A wedia logo : redirects to the homepage of the application

• A wedia-transfer icon : opens wedia transfer app

• “Boards” : redirects to “my boards” page

• “My workspaces” : redirects to creative review workspace

• A Notification icon : opens the notification popin

• Menu icon : opens the main menu

Header (Search Pages)

Header is composed of :

• A wedia logo : redirects to the homepage of the DAM

• Universes drop-Down menu :

  • Default universes are all assets, all videos

  • The universes menu list predefined queries

  • Additional universes can be defined at the project level

  • Separators can space out universes

• Search icon + Search bar with auto-complete + number of results corresponding to the total number of asset :

  • Search as you type is available

  • By default, all indexed properties will be analyzed (text, list, document contents)

  • It is possible to list the properties that should be part of this suggest, and exclude other full text search properties from the suggester

  • List of full text search properties that come with starter kit is available in the document Assets Structure

• A wedia-transfer icon : opens wedia transfer app

• “Boards” : redirects to “my boards” page

• “My workspaces” : redirects to creative review workspace

• A Notification icon : opens the notification popin

• Menu icon : opens the main menu

Header (other pages)

Header is composed of :

• A wedia logo : redirects to the homepage of the application

• A wedia-transfer icon : opens wedia transfer app

• “Boards” : redirects to “my boards” page

• “My workspaces” : redirects to creative review workspace

• A Notification icon : opens the notification popin

• Menu icon : opens the main menu

Standard configuration

The universes menu are manageable from an easy-to-use, out-of-the-box settings interface provided with starter kit from the 2023.1.0 WEDIA release.

➡️ More information

From the 2023.3.0 WEDIA release, logos are also manageable from this interface

Advanced Configuration for developpers

Customize your logos

Go to administration interface DAM Branding

Expected sizes and formats are described on this page : UI configuration checklist

Add universes (cursors or queries)

Queries

There are no conditions for the full text search bar to display in the dam page. It will always show.

On the home page however, the full text search bar is not visible.

Here is an overview:

Cursors

By default, there are 2 cursors already configured : “All assets” and “All videos“. It also possible to add personalized cursors.

Default cursors

Here is it’s overview of the default cursors:

{
  "path": "dam/asset",
  "max": 60,
  "orderby": "created desc",
  "limit": 20,
  "withRights": true,
  "maxchildren": 6,
  "sortByRelevanceIfFulltext": true,
  "i18nQuery": true,
  "cacheDuration": "20000",
  "haveAssetNature": true,
  "staticQuery": {}
}

{
  "path": "dam/asset",
  "max": 60,
  "staticQuery": {
    "assetnature": {
      "dof": {
        "code":"video"
      }
    }
  },
  "orderby": "created desc",
  "limit": 200,
  "haveAssetNature": true
}

Adding a new cursor

When adding a new cursor, there are a few steps to take.

First, we’ll have to add it to $.dam.contexts.json. Here is an example with a cursor called “allProducts”:

[
  {
    "cursor":"allAssets",
    "disableResourceSubFilter": true
  },
  {
    "cursor": "allVideos",
    "disableResourceSubFilter": true
  },
  {
    "cursor": "allProduct",
    "disableResourceSubFilter": true
  }
]

Then we have to create a file in $.common.cursors.<cursor-name-in-kebab-case>.json. In our example, we’ll have : $.common.cursors.all-product.json

We have to fill in the file with the basic information and a specific query:

{
    "path": "dam/asset",
    "max": 60,
    "orderby": "created desc",
    "limit": 20,
    "withRights": true,
    "maxchildren": 6,
    "sortByRelevanceIfFulltext": true,
    "i18nQuery": true,
    "cacheDuration": "20000",
    "haveAssetNature": true,
    "staticQuery": {
      "and": [
        {"width":{"eq":3450}},
        {"height":{"eq":5175}}
      ]
    }
  }
  

Here, we ask that the cursor displays all assets that have a width of 3450px and a height of 5175px.

Finally, don’t forget to add the translation key in the appropriate plugin. It has to be as follow:

global.schemaNames.<nameOfCursor>.cursor

In our example, the translation key would be: global.schemaNames.allProducts.cursor.

Separators

It is also possible to add separators to space out cursors. To do so, add null between each object of a cursor in the $.dam.contexts.json, like so:

[
  [...]
  {
    "cursor": "allVideos",
    "disableResourceSubFilter": true
  },
  null,
  {
    "cursor": "allVideos",
    "disableResourceSubFilter": true
  }
]

Here is an overview of what a separator would look like:

without separators	with separators

Disabling cursors

We can disable the visiblity of the cursors in the dam explorer page by setting to false the $.dam.behaviors.display-contexts-filter.json.

Deactivating boards

The board icon depends on only one parameter: a board feature.

Here’s it’s overview: