AggregationWizardView Constructor

Syntax

PP.TS.Ui.AggregationWizardView (settings);

Parameters

settings. JSON object that contains values of component properties.

Description

The AggregationWizardView constructor creates an instance of the AggregationWizardView class.

Example

To execute the example, in the HEAD tag of the HTML page specify links to the following JS files:

Add the following code to ensure that the example is displayed correctly in different browsers:

<script type="text/javascript">
	if (window.devicePixelRatio == 2) // Retina
		PP.scriptManager.loadStyles(["../build/PP.retina.css", "../build/PP.App.retina.css", "../build/PP.Express.retina.css", "../build/PP.TS.retina.css", "../build/PP.Metabase.retina.css"]);
	else if (PP.IsIE && PP.IEVer < 8) // Old IE
		PP.scriptManager.loadStyles(["../build/PP.css", "../build/PP.App.css", "../build/PP.Express.css", "../build/PP.TS.css", "../build/PP.Metabase.css", "../build/PP_IE7.css"]);
	else // All other
		PP.scriptManager.loadStyles(["../build/PP.css", "../build/PP.App.css", "../build/PP.Express.css", "../build/PP.TS.css", "../build/PP.Metabase.css"]);
</script>

The workbook with the 5183 key should also be available.

In the <body> tag as the value of the onLoad attribute specify name of the function executed after page body loading is finished:

<body onselectstart="return false" class="PPNoSelect" onload="Ready()">
<div class="PPSlidePanel LeftSided PPWorkbookSlide PPC">
 <div class="PPNavigationBar PPC PPTSNavBread" style="width: 302px;height: 400px;">
  <div class="Layout">
   <div class="PPNavItm PPC">
    <div class="PPNavItemView">
     <div class="PPScrollBox PPC">
      <div class="PPScrollContent">
       <div class="PPNavItemContent">
        <div class="PPPanelContent" id='example' style="width: 250px;height: 400px;">
         </div>
        </div>
       </div>
      </div>
     </div>
    </div>
   </div>
  </div>
</div>
</body>

At the end of the document insert code to set styles to the document.body node, which correspond to the client's operating system:

<script type="text/javascript">
    PP.initOS(document.body);
</script>

In the SCRIPT tag add the following script:

<script type="text/javascript">
	// Determine language settings for resources
	PP.setCurrentCulture(PP.Cultures.ru);	
	// Declare variables
	var ctrl;		
	function Ready() //body load event handler
	{
		waiter = new PP.Ui.Waiter();
		metabase = new PP.Mb.Metabase(
		{
			Id: "WAREHOUSE",
			UserCreds: { UserName: "user", Password: "password" },
			StartRequest: function () {
				waiter.show();
			},
			EndRequest: function () {
				waiter.hide();
			},
			Error: function (sender, args) {
				alert(args.ResponseText);
			}
		});
			// Open repository connection
			metabase.open();
			var tsService = new PP.TS.TSService({ Metabase: metabase });
			var key = 5183;
			var wbk;
			tsService.openDocument(key, onFirstOpened);
			function onFirstOpened(sender, args)
			{
				var wbk = args.Workbook;
				//Create a view instance of aggregation parameter panel
				ctrl = new PP.TS.Ui.AggregationWizardView({
				Source: wbk, 
				IsRTL: False
			});
				//Add "example" to DOM node
				ctrl.addToNode("example");				
				console.log("Set state of the AggregationWizardView component");
				var tsMethod =({interpolate:{type: "Repeat"}});
				ctrl.setCurrentState(tsMethod);			
				console.log("Output the current state to the console");
				var currentState = ctrl.getCurrentState();
				console.log(currentState);			
				console.log("Get aggregation type by time");
				var methodType = ctrl.getMethodType(tsMethod);
				console.log(methodType);
		}
	}
</script>

After executing the example the HTML page will contain the aggregation parameters panel, that looks as follows:

The browser console will show JSON object that contains state of the AggregationWizardView component, and type of time aggregation.

See also:

AggregationWizardView