Creating a Widget to Autoplay Control Values

How to:

You can insert a widget on an HTML page to automatically submit values in a control at specific intervals. The control can be linked to a report, chart, or map.

You can enable the autoplay setting for the widget in the Tasks & Animations panel. The widget selected may require the following configurations:

When the autoplay widget displays, select a control on your page from the drop-down menu in the widget. You can hide the drop-down menu by making a selection or pressing the Esc key. When you press the play button in the autoplay widget, the value in the selected control changes based on the specified time interval.

You can also create an autoplay control that is the sole input control for a parameter, unassociated with any control on the page. This is called a virtual control. You can do this in one of two ways:

You must create a task to display a virtual control autoplay widget using the Tasks & Animations panel.

Procedure: How to Create a Widget to Autoplay Control Values

  1. Create an XML parameter report to use for the map. For example:
    TABLE FILE BASEAPP/WF_RETAIL_LITE
    SUM
    WF_RETAIL_LITE.WF_RETAIL_SALES.REVENUE_US
    WF_RETAIL_LITE.WF_RETAIL_SALES.GROSS_PROFIT_US
    BY WF_RETAIL_LITE.WF_RETAIL_GEOGRAPHY_STORE.COUNTRY_NAME
    WHERE WF_RETAIL_LITE.WF_RETAIL_TIME_SALES.TIME_DATE_YEAR_COMPONENT EQ &TIME_DATE_YEAR_COMPONENT.(FIND WF_RETAIL_LITE.WF_RETAIL_TIME_SALES.TIME_DATE_YEAR_COMPONENT,
    WF_RETAIL_LITE.WF_RETAIL_TIME_SALES.TIME_DATE_YEAR_COMPONENT IN 
    baseapp/wf_retail_lite|FORMAT=YYMDy).Sale,Year:.QUOTEDSTRING;
    ON TABLE SET PAGE-NUM NOLEAD
    ON TABLE SET ASNAMES ON
    ON TABLE NOTOTAL
    ON TABLE PCHOLD FORMAT XML
    ON TABLE SET HTMLCSS ON
    END
  2. Create a new HTML page.
  3. In the Objects group, click ESRI Map to draw an Esri map component on the canvas.
  4. From the Requests & Data Sources panel, select the New drop-down arrow, point to External Request, and then click WebFOCUS Procedure.
  5. Right-click the report in the Requests & Data Sources panel and click Create Controls for Parameters, as shown in the following image.
  6. In the New Parameters dialog box:
    1. In the Control Type column, right-click Calendar.
    2. Select New control.
    3. Select Slider.
    4. Select Horizontal.

    The populated New Parameters dialog box is shown in the following image.


    New parameters dialog selecting slider
  7. Click OK.

    The horizontal slider is added to the HTML page, as shown in the following image.

  8. Select the Parameters tab and drag the slider over emfobject1 (the map object) to draw a line to symbolize the chaining of objects. The arrow indicates the direction of the chaining, as shown in the following image.
  9. Return to the Design tab, select the map object, and open the Settings panel.
  10. On the Settings panel:
    • Select Layer1.
    • For the Request value, select the name of the XML report.
    • For the Geographic Role, select Country (Name).
    • For the Column(s) that match the role, select COUNTRY_NAME.
    • For the Layer Attributes, select REVENUE_US and GROSS_PROFIT_US.
    • For the Enable Popups attribute, select On.
    • For the Default Extent attribute, select On.
    • For the Use attribute, select Color.
    • For the Using Field attribute, select GROSS_PROFIT_US.
    • For the Color Scheme attribute, select red to green.

    The populated Settings panel is shown in the following image.

  11. Multi-select the Submit, Reset, and Schedule buttons in the form and delete them, as shown in the following image.
  12. On the Tasks & Animations panel:
    • Delete task 2 and task 3.
    • Create a new task.
    • For the Trigger Type attribute, select Click.
    • Select the form of the control to add the Trigger Identifier.
    • Select form1.
    • For the Requests/Actions attribute, select Show Autoplay widget.

    The populated Tasks & Animations panel is shown in the following image.

  13. On the Tasks & Animations panel:
    • Create a new task.
    • For the Trigger Type attribute, select Selection Changed.
    • Select the form of the control to add the Trigger Identifier.
    • Select slider1.
    • For the Requests/Actions attribute, select Execute Task and then select load.

    The populated Tasks & Animations panel is shown in the following image.

  14. Select the slider control in the HTML canvas.
  15. On the Settings panel, select Limit values returned and change the value to 6, as shown in the following image.
    Settings panel with Limit values returned set to 6
  16. Select the map component in the HTML canvas.
  17. From the Properties panel, change Map: Basemap to Dark Gray Canvas Map, as shown in the following image.
  18. Run the HTML page, as shown in the following image.
  19. Click within the slider form.
  20. Select Sale,Year: from the Autoplay Widget drop-down list, as shown in the following image.
  21. Drag to reposition the widget, so that it does not cover the map or the control.
  22. Click the play button.

    Note: As the slider moves automatically, from year to year, the map is refreshed with the data for the corresponding year.