window

namespace

js/foo_uie_jsplitter.js:4508

Functions for working with the current JSplitter panel and accessing it's properties.

property

DPI

js/foo_uie_jsplitter.js:4525

DPI: number

Window DPI. This value never changes while foobar2000 is running. If you change DPI settings, you must restart the application.

property

DrawMode

js/foo_uie_jsplitter.js:4581

DrawMode: number = 0

Current graphics rendering mode.
0 (default) - GDI+
1 - Direct2D
IMPORTANT: After switching the rendering mode, all drawing objects created for the other mode will be unavailable for use in the current mode.
Therefore, the developer should create all drawing objects only after changing the mode.
Ideally, the mode change should be made in the VERY first line of the main script to avoid accidentally creating objects of the wrong type.
Also, calling any of d2d.* methods for creating objects like fonts, bitmaps or effects, will cause a script crash until the DrawMode is set to 1 at least once (in this case, the resources required for D2D operation are initialized). D2D rendering may differ from GDI and methods for both backends can not be expected to be 100% pixel equivalent.

property

EraseOnRepaint

js/foo_uie_jsplitter.js:4533

EraseOnRepaint: boolean = true

Set whether the JSplitter panel should be cleared with background color before raising on_paint callback.
Default value: true.

Example

"use strict";
window.DrawMode = 0;
window.EraseOnRepaint = false;

let ww = 0;
let wh = 0;

const alphabet = 'アァカサタナハマヤャラワガザダバパイィキシチニヒミリヰギジヂビピウゥクスツヌフムユュルグズブヅプエェケセテネヘメレヱゲゼデベペオォコソトノホモヨョロヲゴゾドボポヴッンABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789@#$%&*';
const fontSize = 16;
const font = gdi.Font("Consolas", fontSize, 1);
const drops = [];

function on_size(width, height) {
    ww = width;
    wh = height;
    if(ww > 0 && wh > 0) {
        const columns = Math.floor(ww / fontSize);
        drops.length = columns;
        for (let i = 0; i < columns; i++) if (isNaN(drops[i])) drops[i] = 0;
    }
}

function on_paint(gr) {
    gr.FillSolidRect(0, 0, ww, wh, 0x0D000000);

    for (let i = 0; i < drops.length; i++) {
    const text = alphabet.charAt(Math.floor(Math.random() * alphabet.length));
    const x = i * fontSize;
    const y = drops[i] * fontSize;

    gr.GdiDrawText(text, font, 0xFF00FF00, x, y, fontSize, fontSize * 4 / 3);

    if (y > wh && Math.random() > 0.975)
        drops[i] = 0;
    else
        drops[i]++;
    }	
}

window.SetInterval(() => { window.Repaint(); }, 50);

propertydeprecated

FoobarWindowHeight

js/foo_uie_jsplitter.js:5248

FoobarWindowHeight: number = 0

Deprecated.

Deprecated compatibility API. It will be removed in a future release. Use fb.Window.Height for new code.

propertydeprecated

FoobarWindowWidth

js/foo_uie_jsplitter.js:5240

FoobarWindowWidth: number = 0

Deprecated.

Deprecated compatibility API. It will be removed in a future release. Use fb.Window.Width for new code.

propertydeprecated

FoobarWindowX

js/foo_uie_jsplitter.js:5224

FoobarWindowX: number = 0

Deprecated.

Deprecated compatibility API. It will be removed in a future release. Use fb.Window.X for new code.

propertydeprecated

FoobarWindowY

js/foo_uie_jsplitter.js:5232

FoobarWindowY: number = 0

Deprecated.

Deprecated compatibility API. It will be removed in a future release. Use fb.Window.Y for new code.

property

HandOnButtons

js/foo_uie_jsplitter.js:5196

HandOnButtons: boolean = false

Switches the mouse cursor for all buttons either to the hand or to the arrow. This property also affects all subsequently created buttons. This property can be changed individually for each button (see ButtonObject class).

propertyreadonly

Height

js/foo_uie_jsplitter.js:4705

Height: number

propertyreadonly

ID

js/foo_uie_jsplitter.js:4594

ID: number

Window handle

propertyreadonly

InstanceType

js/foo_uie_jsplitter.js:4602

InstanceType: number

You need this to determine which GetFontXXX and GetColourXXX methods to use, assuming you want to support both interfaces.
See UIInstanceType
0 - if using Columns UI
1 - if using default UI.

propertyreadonly

IsFocused

js/foo_uie_jsplitter.js:4624

IsFocused: boolean

Indicates whether this JSplitter panel currently has keyboard focus. This reflects the same focus state reported by on_focus: it is true only while the panel window itself owns keyboard focus.

propertyreadonly

IsToolbar

js/foo_uie_jsplitter.js:4613

IsToolbar: boolean

Indicates whether this JSplitter panel is hosted as a toolbar item in Columns UI.
This property is only meaningful when using Columns UI: it is true for a toolbar panel and false for a regular panel.

It is always false in Default User Interface.

propertyreadonly

IsTransparent

js/foo_uie_jsplitter.js:4633

IsTransparent: boolean

Only useful within Panel Stack Splitter (Columns UI component)
Depends on setting inside Spider Monkey Panel Configuration window. You generally use it to determine whether or not to draw a background.

propertyreadonly

IsVisible

js/foo_uie_jsplitter.js:4643

IsVisible: boolean

propertyreadonly

JsMemoryStats

js/foo_uie_jsplitter.js:4696

JsMemoryStats: JsMemoryStats

SpiderMonkey heap and native/external memory statistics. See JsMemoryStats for the returned object properties.

property

MaxHeight

js/foo_uie_jsplitter.js:4711

MaxHeight: number

window.MaxHeight, window.MaxWidth, window.MinHeight and window.MinWidth can be used to lock the panel size.
Do not use if panels are contained within Panel Stack Splitter (Columns UI component) or JSplitter itself

property

MaxWidth

js/foo_uie_jsplitter.js:4719

MaxWidth: number

See window.MaxHeight.

property

MinHeight

js/foo_uie_jsplitter.js:4726

MinHeight: number

See window.MaxHeight.

property

MinWidth

js/foo_uie_jsplitter.js:4733

MinWidth: number

See window.MaxHeight.

propertyreadonly

Name

js/foo_uie_jsplitter.js:4740

Name: string

Returns the panel name set in window.ShowConfigureV2.

propertyreadonly

ScriptInfo

js/foo_uie_jsplitter.js:4763

ScriptInfo: ScriptInfo

Information about the panel's main script. The Path property contains its full native filesystem path, or an empty string for an in-memory script. See ScriptInfo for all properties and source types.

propertyreadonly

Tooltip

js/foo_uie_jsplitter.js:4771

Tooltip: FbTooltip

Get associated tooltip object.

property

TrackMouseEnterLeaveOnPanels

js/foo_uie_jsplitter.js:5205

TrackMouseEnterLeaveOnPanels: boolean = false

Enables tracking of the mouse cursor entering/exiting the panel area. By default = false.
The following functions are used to handle events:
on_panel_mouse_enter(name) - cursor entering the panel area, name is the panel name
on_panel_mouse_leave(name) - cursor leaving the panel area, name is the panel name

property

TrackMouseMoveOnPanels

js/foo_uie_jsplitter.js:5215

TrackMouseMoveOnPanels: boolean = false

Enables tracking of the mouse cursor position within the panel area.
By default = false . The following function is used to handle the event:
on_panel_mouse_move(name, x, y, mask): the event of moving the cursor within the panel area, name is the name of the panel, x, y are the coordinates of the point on the panel.

propertyreadonly

Width

js/foo_uie_jsplitter.js:4779

Width: number

method

ClearInterval

js/foo_uie_jsplitter.js:4799

ClearInterval(timerID)

See clearInterval.

Parameters

Name	Type	Description
`timerID`	`number`

method

ClearProperties

js/foo_uie_jsplitter.js:4785

ClearProperties(reload_panel)

Clears all current panel properties set by window.SetProperty, window.SetProperties or window.ImportProperties

Parameters

Name	Type	Description
`reload_panel = false`optional	`boolean`	If true, reloads panel script after clearing

method

ClearTimeout

js/foo_uie_jsplitter.js:4792

ClearTimeout(timerID)

See clearTimeout.

Parameters

Name	Type	Description
`timerID`	`number`

method

CreateButton

js/foo_uie_jsplitter.js:5131

CreateButton(x, y, images, hover_images)

Creates a button in the splitter. The button will be created in the root of the window and will be placed at the coordinates (x, y). The function is also passed images to set the appearance of the button. The number of states the button can take will depend on the number of images passed to the function. hover_images - button images displayed when the mouse cursor hovers over the button. The function is flexible enough to create different types of buttons

Parameters

Name	Type	Description
`x`	`string`
`y`	`string`
`images`	`*`	// null, string or Array
`hover_images = null`optional	`*`	// null, string or Array

Returns

ButtonObject

Example

var path = fb.FoobarPath + "themes\\lur\\black\\bio.png";
var hpath = fb.FoobarPath + "themes\\lur\\black\\bio_on.png";
// Creates a regular button with the bio.png image, which changes to bio_on.png when the mouse cursor hovers over the button
var a = window.CreateButton(0, 0, path, hpath);
// Creates a checkbox button. The normal state is bio.png, pressed (checkbox checked) - bio_on.png. 
// Note that there are no images for hovering over. 
// Usually, checkboxes do not need them, but you can set them if you want.
var b = window.CreateButton(0, 0, [path, hpath], null);
// You can create a button with three (or more) states. They will switch cyclically when pressed.
// The current state of the button can be obtained using the State property of the button (see ButtonObject class). 
var c = window.CreateButton(0, 0, [path1, path2, path3], [path1_on, path2_on, path3_on]);

method

CreatePopupMenu

js/foo_uie_jsplitter.js:4857

CreatePopupMenu()

Returns

MenuObject

Example source

samples/basic/MainMenuManager All-In-One.jsopen source

method

CreateThemeManager

js/foo_uie_jsplitter.js:4864

CreateThemeManager(class_id)

Parameters

Name	Type	Description
`class_id`	`string`	https://docs.microsoft.com/en-us/windows/win32/controls/parts-and-states

Returns

ThemeManager

Example source

samples/basic/SimpleThemedButton.jsopen source

methoddeprecated

CreateTooltip

js/foo_uie_jsplitter.js:4872

CreateTooltip(font_name, font_size_px, font_style)

Deprecated.

Note: a single panel can have only a single tooltip object. Creating a new tooltip will replace the previous one.

Deprecated: use window.Tooltip and SetFont instead.

Parameters

Name	Type	Description
`[font_name='Segoe`optional	`string`	UI']
`font_size_px = 12`optional	`number`
`font_style = 0`optional	`number`	See FontStyle flags

Returns

FbTooltip

methoddeprecated

DefinePanel

js/foo_uie_jsplitter.js:4806

DefinePanel(name, options)

Deprecated.

Setups panel and script information and available features.
Can be called only once, so it's better to define it directly in the panel Configure menu.

Deprecated: use window.DefineScript instead. Panel name can be changed via window.ShowConfigureV2.

Parameters

Name	Type	Description
`name`	`string`	Script name and panel name
`options = {}`optional	`object`
`options.author = ''`optional	`string`	Script author
`options.version = ''`optional	`string`	Script version
`options.features = undefined`optional	`object`	Additional script features
`options.features.drag_n_drop = false`optional	`boolean`	Indicates if drag_n_drop functionality should be enabled

Throws

Error —

If called for a package script, called more than once, or options / options.features is not an object.

method

DefineScript

js/foo_uie_jsplitter.js:4826

DefineScript(name, options)

Setup the script information.
Can be called only once for the whole panel.

Parameters

Name	Type	Description
`name`	`string`	Script name
`options = {}`optional	`object`
`options.author = ''`optional	`string`	Script author
`options.version = ''`optional	`string`	Script version
`options.features = undefined`optional	`object`	Additional script features
`options.features.drag_n_drop = false`optional	`boolean`	Indicates if drag_n_drop functionality should be enabled
`options.features.grab_focus = true`optional	`boolean`	Indicates if panel should grab mouse focus

Throws

Error —

If called for a package script, called more than once, or options / options.features is not an object.

method

EditScript

js/foo_uie_jsplitter.js:4841

EditScript()

Open the current panel script in the default text editor.
Default text editor can be changed via Edit button on the main tab of window.ShowConfigureV2.

method

ExportProperties

js/foo_uie_jsplitter.js:4847

ExportProperties(fileName)

Exports all current panel properties set by window.SetProperty to file

Relative filesystem paths are resolved as described in utils.ReadTextFile.

Parameters

Name	Type	Description
`fileName`	`string`

Returns

boolean —

If false, then an error occurred during export

method

GetButton

js/foo_uie_jsplitter.js:5158

GetButton(id)

Get a button by its ID

Parameters

Name	Type	Description
`id`	`number`

Returns

ButtonObject

method

GetColourCUI

js/foo_uie_jsplitter.js:4887

GetColourCUI(type, client_guid)

Parameters

Name	Type	Description
`type`	`number`	See ColourTypeCUI enum
`client_guid`optional	`string`	Client GUID

Returns

number —

returns black colour if the requested one is not available.

Throws

Error —

If the panel is not running under Columns UI.

method

GetColourDUI

js/foo_uie_jsplitter.js:4895

GetColourDUI(type)

Parameters

Name	Type	Description
`type`	`number`	See ColourTypeDUI enum

Returns

number —

returns black colour if the requested one is not available.

Throws

Error —

If the panel is not running under Default UI.

method

GetFontCUI

js/foo_uie_jsplitter.js:4902

GetFontCUI(type, client_guid)

Note: see the example in window.GetFontDUI.

Parameters

Name	Type	Description
`type`	`number`	See FontTypeCUI enum
`client_guid`optional	`string`	Client GUID

Returns

?GdiFont —

returns null if the requested font was not found.

Throws

Error —

If the panel is not running under Columns UI.

method

GetFontDUI

js/foo_uie_jsplitter.js:4912

GetFontDUI(type)

Parameters

Name	Type	Description
`type`	`number`	See FontTypeDUI enum

Returns

?GdiFont —

returns null if the requested font was not found.

Throws

Error —

If the panel is not running under Default UI.

Example

// To avoid errors when trying to use the font or access its properties, you
// should use code something like this...
let font = window.GetFontDUI(0);
if (!font) {
   console.log("Unable to determine your default font. Using Segoe UI instead.");
   font = gdi.Font("Segoe UI", 12);
}

method

GetPanel

js/foo_uie_jsplitter.js:5109

GetPanel(caption)

Get an object for accessing the panel by the caption text. The first panel that matches the argument in text will be returned. The panel text is specified in the caption. By default, it has the value of the panel plugin name, but it can be changed either directly in the window title (Show coords -> Click in caption text) or in the Columns UI placer (Use custom title) or in 'Panel list' (right click on JSplitter window)

Parameters

Name	Type	Description
`caption`	`string`

Returns

PanelObject

Throws

Error —

If no child panel exists with the specified name.

method

GetPanelByIndex

js/foo_uie_jsplitter.js:5123

GetPanelByIndex(index)

Get an object for accessing the panel by index. the order depends on the position in the window stack: the bottommost window will have index 0.

Parameters

Name	Type	Description
`index`	`number`

Returns

PanelObject

Throws

Error —

If no child panel exists at index.

method

GetPanelCount

js/foo_uie_jsplitter.js:5117

GetPanelCount()

Get child panels count in JSplitter

Returns

number

method

GetProperties

js/foo_uie_jsplitter.js:4928

GetProperties()

Get all current panel properties set by window.SetProperty, window.SetProperties or window.ImportProperties

Returns

Map —

Map of panel properties

Example

const props = window.GetProperties();
for(const [key, value] of props) console.log(`Key = ${key}, Value = ${value}`);

method

GetProperty

js/foo_uie_jsplitter.js:4938

GetProperty(name, default_val)

Get value of property.
If property does not exist and default_val is not undefined and not null, it will be created with the value of default_val.

Note: leading and trailing whitespace are removed from property name.

Parameters

Name	Type	Description
`name`	`string`
`default_val`optional	`*`

Returns

*

method

ImportProperties

js/foo_uie_jsplitter.js:4951

ImportProperties(fileName, reload_panel)

Imports panel properties from file and (optionally) reloads the panel script
DOES clear all existing panel properties.

Relative filesystem paths are resolved as described in utils.ReadTextFile.

Parameters

Name	Type	Description
`fileName`	`string`
`reload_panel = false`optional	`boolean`	If true, reloads panel script

Returns

boolean —

If false, then an error occurred during import. Also, if an error occurs during import, the panel does not reload.

methoddeprecated

MoveFoobarWindow

js/foo_uie_jsplitter.js:5185

MoveFoobarWindow(x, y, width, height)

Deprecated.

Deprecated compatibility API. It will be removed in a future release. Use fb.Window.Move for new code.

Parameters

Name	Type	Description
`x`	`number`
`y`	`number`
`width`	`number`
`height`	`number`

method

NotifyOthers

js/foo_uie_jsplitter.js:4963

NotifyOthers(name, info)

This will synchronously trigger on_notify_data(name, info) in other panels.
!!! Beware !!!: data passed via info argument must NOT be used or modified in the source panel after invoking this method.

Legacy compatibility API
Existing scripts can keep using NotifyOthers unchanged. For new asynchronous structured-clone messaging between panels and Workers, prefer BroadcastChannel.

Parameters

Name	Type	Description
`name`	`string`
`info`	`*`

Example

let data = { 
   // some data
};
window.NotifyOthers('have_some_data', data);

data = null; // stop using the object immediately
// AddSomeAdditionalValues(data); // don't try to modify it, since it will affect the object in the other panel as well

method

RadioButtons

js/foo_uie_jsplitter.js:5165

RadioButtons(buttons)

Creates a group of radio buttons. Takes an array of buttons as an argument. Each button must have at least two states, otherwise the function will fail.

Parameters

Name	Type	Description
`buttons`	`Array<ButtonObject>`

Throws

Error —

If buttons contains an invalid button object.

Example

var a = window.CreateButton(0 , 0, [path, hpath], null);
var b = window.CreateButton(30 ,0 , [path, hpath], null);
var c = window.CreateButton(60 ,0 , [path, hpath], null);
window.RadioButtons([a, b, c]);
// Now when you click on one button (state 1), the other will be switch to state 0 and vice versa.

method

Reload

js/foo_uie_jsplitter.js:4983

Reload(clear_properties)

Reloads panel.

Parameters

Name	Type	Description
`clear_properties = false`optional	`boolean`	If true, all panel properties will be cleared before reload

method

RemoveButton

js/foo_uie_jsplitter.js:5179

RemoveButton(button)

Removes a button

Parameters

Name	Type	Description
`button`	`ButtonObject`

method

Repaint

js/foo_uie_jsplitter.js:4989

Repaint(force)

Performance note: don't force the repaint unless it's really necessary - repaint calls might be grouped up when *not forced* which will turn them into a single repaint call, thus reducing the amount of on_paint calls.

Parameters

Name	Type	Description
`force = false`optional	`boolean`	If true, will repaint immediately, otherwise a repaint task will be scheduled.

method

RepaintRect

js/foo_uie_jsplitter.js:4998

RepaintRect(x, y, w, h, force)

Repaints a part of the screen.
Use this instead of window.Repaint on frequently updated areas such as time, bitrate, seekbar, etc.

Performance note: see Performance note in window.Repaint.

Parameters

Name	Type	Description
`x`	`number`
`y`	`number`
`w`	`number`
`h`	`number`
`force = false`optional	`boolean`	If true, will repaint immediately, otherwise a repaint task will be scheduled.

method

SetCursor

js/foo_uie_jsplitter.js:5013

SetCursor(id)

This would usually be used inside the on_mouse_move callback.
Use -1 if you want to hide the cursor.

Parameters

Name	Type	Description
`id`	`number`	See Flags for flags like IDC_ARROW

method

SetInterval

js/foo_uie_jsplitter.js:5021

SetInterval(func, delay)

See setInterval.

Parameters

Name	Type	Description
`func`	`function()`
`delay`	`number`

Returns

number

Throws

Error —

If func is not callable or delay is zero.

method

SetProperties

js/foo_uie_jsplitter.js:5032

SetProperties(values, reload_panel)

Set panel properties from input map and (optionally) reloads the panel script
Does NOT clear existing properties before setting.

Parameters

Name	Type	Description
`values`	`Map`	Map of values to set
`reload_panel = false`optional	`reload_panel`	If true, reloads panel script after setting

Example

const values = new Map([["First value", 1], ["Second value", 2], ["Third value", 3]]);
window.SetProperties(values);

method

SetProperty

js/foo_uie_jsplitter.js:5045

SetProperty(name, val)

Set property value.
Property will be removed, if val is undefined or null.

Property values are saved per panel instance and are remembered between foobar2000 restarts.

Note: leading and trailing whitespace are removed from property name.

Parameters

Name	Type	Description
`name`	`string`
`val`optional	`*`

method

SetShortcutFilter

js/foo_uie_jsplitter.js:5058

SetShortcutFilter(enabled, type_only, suppress_children)

Sets panel shortcut filter.

Parameters

Name	Type	Description
`enabled = true`optional	`boolean`	If true filter is enabled. Suppresses player shortcuts depending on the following two parameters
`type_only = true`optional	`boolean`	If true suppresses only shortcuts that identified as user input (keyboard_shortcut_manager::is_typing_message from SDK used). If false ALL shortcuts are disabled for panel
`suppress_children = false`optional	`boolean`	If true suppresses also shortcuts for all JSplitter's children. Takes into account the parameter type_only only for DUI. For CUI alwas disables ALL shortcuts