Example of Creating the Window Component

To execute the example, create an HTML page and perform the following operations:

1. Add links to the PP.css and PP.js files.

2. In the folder with example add a file named icon.png:

2. In the <body> tag place a block with the wnd identifier:

<div style=" margin-left: auto; margin-right: auto; margin-top: 100px; width: 1000px; height: 700px;" id="wnd">
</div>

3. Then on the page inside the <body> tag add a script creating the Window component:

<script type="text/javascript">
// Create the Window component
var win = new PP.Ui.Window({
    ParentNode: document.getElementById("wnd"),
    Caption: "Foresight Analytics Platform", // Caption
    CaptionIcon: "icon.png", // Icon
    Content: "Content", // Contents
    Height: 200,
    Width: 350,
    EnableMove: false // Forbidden to move the window
});
// Open the window
win.show();
</script>

After executing the example, HTML page displays the window:

It is placed in the page center because the show method is set to default parameters.

Clicking the button the window sizes zooms in: the width will be 1000 pixels and the height will be 700 pixels. The button looks as follows :. After clicking the button, the window size zooms down.