Make a date selector for logs with Export Block Descriptors in viewON

This is the first example in a series of posts about using Export Block Descriptors in viewON projects. To view the other examples as well as helpful resources, return to the main post.

Example 1 - Date Selector

image

  1. Add text boxes for the day, month, and year of the start and end times
  2. Add a button for submitting the dates
  3. Add a text element below for displaying the Export Block Descriptor
  4. Each element has a unique ID that will let us access it programmatically. Select an element, navigate to the “Graph. properties" tab on the left, and open the ID tab as shown here:

1-2_element_id

  1. Select the submit button we added and open the Actions tab below
  2. At the bottom left, click New → Execute → viewON Script. This code will execute when a user clicks the button

1-3_script

Once this JavaScript section has been created, we can start writing code, placing it in the box shown at the end of the above .gif.

//Grab the values from each text box
var startDay = $("#UID_1644863300644").val();
var startMonth = $("#UID_1644863303575").val();
var startYear = $("#UID_1644863305655").val();
var endDay = $("#UID_1644863313672").val();
var endMonth = $("#UID_1644863313674").val();
var endYear = $("#UID_1644863313676").val();

//construct the date string, then add it to fixed part of the query, then add that to the end of the request URL
var date = "$st" + startDay + startMonth + startYear + "_000000$et" + endDay + endMonth + endYear + "_000000";
var query = "$dtHT$ftT$fnyourdata.csv" + date;
var url = "http://192.168.120.53/rcgi.bin/ParamForm?AST_Param=" + query;

//Show the final EBD string and download from the request URL
$("#UID_1645129739687").html(query);
window.open(url, "download");

Let’s break this down line by line:

  • $(“#MyElementID”) retrieves the HTML element with the given ID, then the .val() function retrieves the text inserted into that field. We do this with each text box
  • The first of the next three statements starts the EBD with the date parameters, $st and $et
  • The second appends the date parameters to the part of the EBD that will not change
  • Finally, the third adds the full EBD to the end of the URL that is used for submitting Export Block Descriptors directly to the Ewon, rather than through the planner or an alarm. The first part will be your Ewon’s IP address, while the rest - /rcgi.bin/ParamForm?AST_Param= - will be fixed.
  • With the full EBD constructed and attached to the URL, we can send the EBD to the Ewon
  • The second to last statement replaces the text initially reading “EBD string will appear here” with whatever the final EBD is
  • The last statement opens the full URL to download the resulting historical log.
1 Like