Designer 10.7 | Working with Business Console Gadgets | Getting Started with Business Console Gadgets | Creating a New Business Console Gadget
 
Creating a New Business Console Gadget
In the UI Development perspective, you can create gadgets in a gadget application project, a web application project, or a portlet application project in one of the following views:
*Solutions view
*Navigator view
*Project Explorer view
After you complete the gadget design, publish the gadget, web, or portlet application projects to My webMethods Server to make it available in Business Console AppSpaces.
For information about creating and publishing a project, see webMethods CAF and OpenUI Development Help.
Note:
You need JavaScript knowledge for programming gadgets.
*To create a new gadget
1. Select the UI Development perspective.
2. Select the gadget, web, or portlet application project where you want to create a new gadget, and start the New Business Console Gadget wizard in one of the following ways:
For information about the gadget application project, see Creating a Gadget Application Project. For information about web application and portlet application projects, see webMethods CAF and OpenUI Development Help.
*In the Solutions view, expand User Interfaces, right-click on the project where you want to create a new gadget, and select New Business Console Gadget.
*In the Navigator view or Project Explorer view, right-click on the project where you want to create a new gadget, and select New > Other > Software AG > UI Development > New Business Console Gadget.
3. In the New Business Console Gadget wizard, provide the specification for the new gadget. For information about what values to specify for the new gadget, see New Business Console Gadget Wizard.
The New Business Console Gadget wizard creates the configuration files and definition file for the new gadget. For information about the configuration files and definition file for a gadget, see Gadget Configuration Files and Gadget Definition File.
4. Configure and customize the gadget.
a. Program the gadget depending on the gadget type by doing one of the following:
*To create a gadget without using any pre-defined templates, edit the custom.js file.
*To create a gadget using the AngularJS framework, edit the controller.js and custom.js files.
b. In the Scripts and Styles folders for the gadget, create a script file and style file, respectively.
c. Provide the gadget details on the Gadget Definition Editor tab. To view the Gadget Definition Editor tab, do one of the following:
*In the Solutions view, double-click the gadget.
*In the Navigator view or Package Explorer view, double-click the gadgetDefinition.xml file corresponding to the gadget in the web_or_portlet_application/WebContent/WEB-INF/gadgets/gadgetName_gadgetID folder.
For information about the details to specify, see Gadget Definition Editor.