A Button object can be fully configured during instantiation by overriding their paint and geometry properties, as well as defining any other SVG attribute, including transform, in the extra object property. Buttons take symbol, image, text, quicktip. Thee default shape (rect) can be overridden by defining the shape property, either a reference from the Shapes library or defined on the fly.
Entirely mechanized construction with implemented system logic. Parallel scopes allow single definition with deep nested submenus. User events and functions.
A Slider object has an extended set of properties for complete control over appearance and behavior.
The slider class is designed for easy use and management and can meet with any common situation – Pergola also defines the Scrollbar class, a system component for objects like windows and combo-boxes. User events and functions.
A panel is a multi-purpose alternative container to the window. Typical uses are dialogs, panel with tabs, panel with layouts, or simple static. User events and functions (on dialog's OK DialogButton).
The pergola.loadSVG() function allows to encapsulate the downloaded document in any specified container. Thus, for example, a window or any object can invoke pergola.loadSVG() specifying another container. Options allow to merge or replace the old content, and to reset the scale.
A taskbar is a system object. One instance, pergola.taskbar, is created at runtime and displayed upon creation of the first window (only). Window tabs are descendants of the taskbar group. Window previews reflect dynamically updated contents of the windows, including transformations.
These are subclasses of the Button class. The purposes of ToolButton are a typical visual design and the on-and-off switch functionality, which also enables tool buttons to behave as radio buttons. The CommandButton class relates to window commands. User events and functions.
Instantiatiation of a quick tip is done through the
quicktip property of those classes that implement it (Button and its subclasses). It can reference a tip from the quicktip.js repository file, where system tips are stored and where you can define your reusable tips, or can be defined on the fly. The text can be formatted as an array of lines or as a string using the "\n" escape sequence for new lines separator.
Quick tips can be static or mouse-tracking, and the popup delay, which can be configured globally in the skin file, can be overridden for the instance.
It now uses pergola.Key input. Takes caption and value type appendix. Optional icrement and decrement buttons. The realTime property can be set to true for objects that only require little processing/rendering. min and max properties for thresholds of numeric type. The maxLength property determines the maximum number of characters for alphanumeric type. Overflow checks with closest value inserted option. User events and functions.
Patterns are just defined, they are not appended to the defs at runtime. A pattern definition is a function. Variations are very easily obtained by passing values to override the deafault values of a pattern. The function returns the URL string.
Markers. A pattern definition is a function. The markers element is appended to the defs if it doesn't exist. The function returns the URL string.
Configured for using Bing tiles, it uses custom parts of Polymaps for 100% SVG and an extended geoJson parser. This application example shows how to implement options in menus: Views (Aerial, Aerial With Labels, Road); layers and features, with extended capabilities for adding SVG objects; longitude latitude graticule (with frequency dependent of the zoom level); etc. To define a mapping window you simply set its type property to “map”.
The Window class extends its prototype with specific mapping methods and tools which override the regular transformation tools. The tools send tile requests rather than applying transformations. The scrollbars are theoretically infinite in any direction and send requests as well.
For this example the d3.js library is plugged in.
Four D3 examples are loaded and encapsulated in windows. A menu and an additional tool for transitions were added to the Stream example window.
Interactivity example between the “stream” and “force” windows.
A single D3 example (based on http://bl.ocks.org/1216850) in a window.
The worms (charts) react to mouse moves. This adaptation uses the pergola dragarea, which is resized and positioned to the window's geometry through the pergola.resize.resize() method. This ensures that the mouse coordinates and the resulting animation are consistent with the window's position.
Some simple artwork in a window, and an empty window.