The vco:ListPane component lists virtual machines in the left side of the Web view. You can create a Web view component to show information about each virtual machine in a Web view panel on the right side.

About this task

The Web view panel that displays the virtual machine information requires a Web view component that obtains information from the objects that the vco:ListPane component lists and displays the information on the right. The Web view component that obtains object properties implements the WebObjectComponent class.

Prerequisites

Make sure that you have added a vco:ListPane component to the default.html file and defined the Web view attributes that the component requires.

Procedure

  1. Create a file called panel.html and save it at the root of your working folder.
  2. Add a title to the panel.html file.
    <h3>Virtual Machine Information</h3>
  3. Create a Web view component specification file called DisplayVmInfo.jwc in the \components folder.
  4. Add references to the Tapestry DTD and the WebObjectComponent Java class to the DisplayVmInfo.jwc component specification file.

    You refer to the DTD in the DOCTYPE metatag and use <component-specification> tags to refer to the WebObjectComponent Java class.

    <?xml version="1.0" encoding="UTF-8"?>
    <!DOCTYPE component-specification PUBLIC
    "-//Apache Software Foundation//Tapestry Specification 4.0//EN"
    "http://jakarta.apache.org/tapestry/dtd/Tapestry_4_0.dtd">
    <component-specification class="ch.dunes.web.webview.components.WebObjectComponent">
    </component-specification>
  5. Create a Web view component template called DisplayVmInfo.html in the /components folder.

    The DisplayVmInfo.html file defines how to present the information that the component obtains.

  6. Add a table to the DisplayVmInfo.html file to contain information about the virtual machines that are in the list.
    <table width="200" border="1">
      <tr>
        <td>Virtual machine name</td>
        <td></td>
      </tr>
      <tr>
        <td>Virtual machine attributes</td>
        <td></td>
      </tr>
      <tr>
        <td>Object ID</td>
        <td></td>
      </tr>
    </table>
  7. Add references to the standard Tapestry Insert component and OGNL statements to obtain properties from the array of VC:VirtualMachine objects that the vco:ListPane component obtains.
    <table width="200" border="1">
      <tr>
        <td>Virtual machine name</td>
        <td><vco jwcid="@Insert" value="ognl:get('name')"/></td>
      </tr>
      <tr>
        <td>Object ID</td>
        <td><vco jwcid="@Insert" value="ognl:get('id')"/></td>
      </tr>
    </table>

    The value attributes of the Insert component use the WebObjectComponent.get() methods in OGNL statements to obtain the following properties from the VC:VirtualMachine objects:

    • The name property to display the virtual machine name

    • The id property to display the Orchestrator ID of the virtual machine

  8. Add a reference to the DisplayVmInfo component to the panel.html file.
    <h3>Virtual Machine Information</h3>
    <vco jwcid="@DisplayVmInfo" urlParameter="itemId" />
  9. Open the Virtual Machine Manager Web view in a browser at https://orchestrator_server:8280/vco/vmo/ and click one of the virtual machines in the list on the left.

    Information about the virtual machine you clicked appears on the right.

Results

You created a Web view page that obtains a list of virtual machines from vCenter Server and displays information about each virtual machine in the list.

What to do next

Create a tab in the Virtual Machine Manager Web view to run workflows on objects in from the vSphere inventory.