# browser control (skin)

Source: https://ref.dm-lang.org/skin/control/browser/

### Browser-specific parameters
- [auto-format](https://ref.dm-lang.org/skin/param/auto-format.md)
- [inner-background-color](https://ref.dm-lang.org/skin/param/inner-background-color.md)
- [on-hide](https://ref.dm-lang.org/skin/param/on-hide.md)
- [on-show](https://ref.dm-lang.org/skin/param/on-show.md)
- [show-history](https://ref.dm-lang.org/skin/param/show-history.md)
- [show-url](https://ref.dm-lang.org/skin/param/show-url.md)
- [use-title](https://ref.dm-lang.org/skin/param/use-title.md)


A browser panel integrated into the skin.

Browsers are capable of displaying HTML documents, and can also interact with the skin.

## Browsers and popups

A longstanding behavior of BYOND is the ability to create a new browser window by sending an extra argument to the [browse()](https://ref.dm-lang.org/proc/browse.md) proc. Since the advent of skins in BYOND 4.0, this behavior was kept. When you create a new browser popup, the window name you specify for the popup is used for the name of a new [window control](https://ref.dm-lang.org/skin/control/main.md), and within that window there will be a new browser control simply called `browser`.

If you want to interact with the new browser, its full "decorated" [id](https://ref.dm-lang.org/skin/param/id.md) is `*windowname*.browser`.

## Running JavaScript from DM

Sending [output()](https://ref.dm-lang.org/proc/output.md) to a browser will send a document to display there, but if you follow the browser's control name with a colon and a function name, you can call a JavaScript function in the document displayed within that browser.

```dm
var/list/info = list("name"="fridge", "power"=12)
// send {"name":"fridge","power":12} to a JavaScript function
usr << output(url_encode(json_encode(info)), "mybrowser:myJSfunction")
```

The text that you send as output will be parsed like URL parameters, where mutliple arguments to the function are separated by `&` or `;`, which is why [url_encode()](https://ref.dm-lang.org/proc/url_encode.md) is wrapped around the [json_encode()](https://ref.dm-lang.org/proc/json_encode.md) call in this example.

## More browser options

These topics cover more advanced uses of the browser control.

**[BYOND object (JavaScript)](https://ref.dm-lang.org/skin/control/browser/BYOND.md)**

> Shortcuts for client interaction

**[winset and winget (JavaScript)](https://ref.dm-lang.org/skin/control/browser/winset.md)**

> Interact with the skin via JavaScript

**[byondStorage (browser control)](https://ref.dm-lang.org/skin/control/browser/byondStorage.md)**

> Provides persistent storage options for small data

## Pages

- [BYOND object (JavaScript)](https://ref.dm-lang.org/skin/control/browser/BYOND.md)
- [byondStorage (browser control)](https://ref.dm-lang.org/skin/control/browser/byondStorage.md)
- [winset and winget (JavaScript)](https://ref.dm-lang.org/skin/control/browser/winset.md)
