close

Filter

loading table of contents...

Studio Developer Manual / Version 2404

Table Of Contents

9.17.2 Configure an Action to Open a Work Area Tab

In most cases you will use an action to open your own tab. In the example, a button is plugged into the Favorites toolbar. Clicking the button triggers an OpenTabAction to open the browse tab.

import Config from "@jangaroo/runtime/Config";
import EditorMainNavigationToolbar from "@coremedia/studio-client.main.editor-components/sdk/desktop/maintoolbar/EditorMainNavigationToolbar.ts"
import AddItemsPlugin from "@coremedia/studio-client.ext.ui-components/plugins/AddItemsPlugin";
import Button from "@jangaroo/ext-ts/button/Button";
import OpenTabAction from "@coremedia/studio-client.main.editor-components/sdk/actions/OpenTabAction";
import BrowseTab from "./BrowseTab";

Config(EditorMainNavigationToolbar, {
  plugins: [
    Config(AddItemsPlugin, {
      items: [
        //...
        Config(Button, {
          itemId: "browseTab",
          baseAction: new OpenTabAction({
            tab: Config(BrowseTab),
          }),
        }),
      ],
      //...
    }),
  ],
})

Example 9.70. Adding a button to open a tab


The BrowseTab from above is configured as the tab configuration parameter of OpenTabAction. A new browse tab is then opened every time when clicking the button. In addition, all open browse tabs will be reopened in the work area after the reload of CoreMedia Studio. For that CoreMedia Studio stores the xtypes of the open tabs as user preference when opening, closing or selecting tabs. When loading the work area instances of the xtypes are generated and added to the work area. This is basically why you should configure each tab in a separate TypeScript class. Nevertheless, you will see below in Section 9.17.4, “Storing the State of a Work Area Tab” how you can save other state of the tab than the xtype in the user preference.

Search Results

Table Of Contents
warning

Your Internet Explorer is no longer supported.

Please use Mozilla Firefox, Google Chrome, or Microsoft Edge.