Home Reference Source

References

cables_ui/src/ui

summary
public

C UiOp

public
public

C UiPort

public

C Gui

main singleton class for starting the editor

public
public
public

super class for platform implementations

public

Platform implementation for the community version (https://cables.gl).

public

Platform implementation for the standalone (electron) version.

public
public

General settings of the user interface.

public

F startUi(cfg: *)

Starts the ui/editor.

public

F setUpTheme(theme: {}): *

public

V defaultOps: {"newOpNameSuggestion": string, "defaultOpNames": *, "prefixes": *, "converterOps": *, "jsonPathOps": *, "hideInOpSelect": *, "defaultMathOps": *}

default ops structure for assets, ports, math operations etc.

public

V gui: Gui

public
public
public
public

V GuiText: {"save_screenshot": string, "toggle_sound": string, "toggle_helper": string, "canvas_lens": string, "canvas_switch": string, "canvas_size": string, "canvas_aspect": string, "canvas_zoom": string, "canvas_version": string, "canvas_fps": string, "canvas_ms": string, "renderer_patchbg": string, "renderer_maximize": string, "renderer_setsize": string, "infoarea": string, "nav_patch_new": string, "nav_patch_open": string, "linkAddCircle": string, "timeLineToggle": string, "timeLineTime": string, "tlplay": string, "tlzoomgraph": string, "tlzoomtime": string, "tlnextkey": string, "tltogglegraph": string, "tltoggle": string, "tlautokeyframe": string, "tladdkey": string, "tlactive": string, "tlKeyIconParam": string, "tlhover_scroll": string, "tlhover_ruler": string, "tlhover_animline": string, "tlhover_title": string, "tlhover_display": string, "tlhover_keys_dragarea": string, "tlIpLin": string, "tlIpBez": string, "tlIpClip": string, "tlIpAbs": string, "tlIpCurves": string, "tlloopdelete": string, "tlfit": string, "tlmute": string, "noanims": string, "tlbtnCreate": string, "tlbtnPrev": string, "tlbtnNext": string, "portFloatInput": string, "portFloatDrag": string, "portUnlink": string, "portCreateOp": string, "portAnimKeep": string, "portAnimToggle": string, "portDirIn": string, "portDirOut": string, "portMouseUnlink": string, "portMouseCreate": string, "portObjectSnapshot": string, "patchSelectedMultiOps": string, "patchSelectedOp": string, "projectSettingsPublic": string, "projectSettingsTitle": string, "projectSettingsExample": string, "projectExportNotSaved": string, "projectBackupNotSaved": string, "projectNotSaved": string, "editorTab": string, "searchResult": string, "dragfile": string, "editor": string, "patch": string, "canvas": string, "projectFiles": string, "undevLogo": string, "minimize_tabpanel": string, "tab_files": string, "tab_code": string, "tab_doc": string, "tab_preview": string, "tab_op": string, "tab_history": string, "tab_keyframes": string, "tab_variables": string, "tab_patchconnection": string, "tab_profiler": string, "tab_bookmarks": string, "tab_debug": string, "tab_screen": string, "electron_openfolder": string, "download_screenshot": string, "minimapContainer": string, "timelineui": string, "op_background": string, "op_title": string, "bookmark_added": string, "bookmark_removed": string, "timeline_overview": string, "timeline_frames": string, "timeline_time": string, "timeline_progress": string, "timeline_keys": string, "usersettings": string, "texpreview": string, "valueChangerHover": string, "valueChangerInput": string, "open_new_window": string, "settings": string, "working_connected_to": string, "working_connected_needs_connections_to": string, "working_connected_needs_connections_or_string": string, "working_shouldNotBeChildOf": string, "notOptimizedBrowser_title": string, "notOptimizedBrowser_text": string, "filemanager_delete_file": string, "filemanager_file_search": string, "filemanager_file_open": string, "filemanager_file_download": string, "filemanager_file_refresh": string, "filemanager_file_upload": string, "filemanager_file_add": string, "filemanager_file_create": string, "filemanager_reupload": string, "filemanager_copy_file_url": string, "filemanager_edit_file": string, "editorSaveButton": string, "editorFormatButton": string, "cmd_centerpatch": string, "cmd_zoomin": string, "cmd_zoomout": string, "cmd_savepatch": string, "cmd_addop": string, "cmd_patchsettings": string, "patch_hint_overlay_empty": string, "patch_hint_overlay_outofbounds": string, "guestHint": string, "opselect_intro": string, "opselect_typemore": string, "opselect_notfound": string, "opselect_addop": string, "summary_settings": string, "summary_analyze": string, "outline_filter_bookmarks": string, "outline_filter_subpatchops": string, "outline_filter_commented": string, "outline_filter_comments": string, "outline_filter_areas": string, "outline_filter_colored": string, "preferences": *, "tips": *}

public
public

T LinkObject: *

public
public
public
public
public
public

T theme_colors_namespaces: Object<string, Number[]>

public

T theme_colors_objtypes: Object<string, Number[]>

public
public
public
public
public
public

T theme_textedit: Number

cables_ui/src/ui/api

summary
public
public
public

F bytesArrToBase64(arr: *): *

public

T OpDependency: import("cables-shared-client").OpDependency

public

T LinterDiag: Object

public

T User: *

cables_ui/src/ui/commands

summary
public
public
public

C CmdOps

public
public
public
public

C CmdUi

public
public

V CMD: {}

cables_ui/src/ui/components

summary
public

Manages the bookmarks of a patch.

public
public

Manages the files/assets of the patch.

public

Editor for text files, opened from the file manager.

public

Restricts what the user can do in the editor, e.g.

public

Shows the introduction that explains the gui elements.

public

C Jobs

public
public
public

C OpDocs

Loads and stores the documentation of all ops.

public
public

Searches through the op docs, e.g.

public

Tree view of namespaces in the op select dialog.

public
public
public

Default panel when clicking the patch background, shows the patch summary and tree view.

public

Manages the patch view and provides helper functions for editing the patch.

public

Saved state of the patch and its subpatches, shows the orange icon when there are unsaved changes.

public

Suggestion dialog (rotary mouse select menu).

public

Shows suggestions for linking a port.

public

Texture preview floating over the patchfield.

public

Tree view, e.g.

public
public

Loads and stores user settings, in localStorage and on the server.

public

F convertPorts(p1: *, p2: *, converter: *)

public

F getConverters(p1: Port, p2: Port): *

public

F codeWatcher(port: Port): *

public
public

F createOpDocButton(tab: import("../elements/tabpanel/tab.js").default, editor: EditorBase)

public
public

F DragNDrop()

Handles dragging and dropping files onto the editor to upload them.

public

Sets up global html event listeners like uncaught exceptions, contextmenu, resize etc.

public
public

V Collapsable: {}

public
public
public
public
public

T PortChildren: {portOut: any, children: UiOp[]}

public
public
public
public
public
public
public
public

cables_ui/src/ui/components/canvas

summary
public
public

the icon bar below the renderer canvas

public

cables_ui/src/ui/components/opparampanel

summary
public

Panel showing the parameters (ports) of the selected op.

public
public
public

Listens to user interactions with ports in OpParampanel.

public
public
public

F valueChanger(eleId: string, focus: boolean, portName: string, opid: string)

mouse and keyboard interactions with port parameters

public

V paramsHelper: {"togglePortValBool": *, "updateLinkedColorBoxes": *}

cables_ui/src/ui/components/overlay

summary
public

V helperMeshes: {}

cables_ui/src/ui/components/tabs

summary
public
public

tab panel analyze patch shows information and statistics about the current patch

public

C Chat

public
public
public
public

editor base class...

public

tab panel for editing text and source code using the codemirror editor

public

tab panel for editing text and source code using the ace editor

public
public

Tab for searching through the patch.

public

Debug tab for the patchfield rendering of a gl op.

public
public
public
public

Simple tab that shows html.

public
public
public
public

C LogTab

Tab that shows the output of the cables logger.

public
public

tab panel for managing ops: attachments,libs etc.

public

Tab to edit an attachment of an op.

public

Tab to manage op dependencies like libs or npm modules.

public
public

Debug tab that shows the selected op in serialized form.

public
public

Tab for the user's editor preferences, stored in UserSettings.

public

Debug tab that lists all stored user settings, see UserSettings.

public

CPU profiler for the running patch, shows which ops are most expensive.

public
public

tab panel to profile and analyze GPU performance

public
public

debug: showing uiattribs of currently selected op

public

Debug tab that shows the uiAttribs of the selected op.

public
public

Debug tab that shows the content of an array port.

public
public

Welcome tab of the standalone (electron) editor.

public

T OpDoc: import("cables-shared-client").OpDoc

public

T OpDoc: import("cables-shared-client").OpDoc

public

cables_ui/src/ui/components/timelinesvg

summary
public

cables_ui/src/ui/dialogs

summary
public

gradient editor dialog

public

gradient editor dialog

public

gradient editor dialog

public

Shows a toast when there is a new cables changelog entry.

public

Searchable command palette (cmd/ctrl+p).

public
public

open a modal dialog

public

Opens a modal dialog and shows info about given exception

public

Modal dialog showing a page in an iframe.

public

Modal dialog showing a loading indicator animation.

public

Modal dialog to show and edit the credits of an op.

public

Modal dialog showing a snippet of a source file around a given line.

public
public

C Tips

Tips and tricks dialog with animated tips.

public

File upload dialog.

public

F showShaderErrorCgp(shader: CgpShader, nfo: GPUCompilationInfo, src: *)

public

F showShaderError(shader: *)

public

V oldModalWrap: {"show": *, "showError": *, "prompt": *}

public
public
public

T KeyObject: *

public
public

T ModalDialogButton: Object

public
public

T ModalDialogOptions: Object

configuration object for a modal dialog

public
public
public

T OpDoc: import("cables-shared-client").OpDoc

public

T OpCredit: import("cables-shared-client").OpCredit

public

T OpDoc: import("cables-shared-client").OpDoc

public

T OpDoc: import("cables-shared-client").OpDoc

public
public

cables_ui/src/ui/elements

summary
public

Info bar at the bottom of the window, shows context sensitive shortcuts etc.

public
public

Your class description

public

F hideNotificaton(toastId: *)

public

F notify(title: *, text: *, options: NotificationDisplayOptions): *

notify displays a toast-notification

public

F notifyError(title: *, text: *, options: NotificationDisplayOptions): *

notifyError displays an error as a toast-notification

public

F notifyWarn(title: *, text: string, options: {}): *

public
public

F hideInfo()

public
public

F showInfo(txt: string, param: boolean)

public

F showToolTip(e: object, txt: string, nopadding: boolean)

public

F updateHoverToolTip(event: MouseEvent | Object, port: import("cables").Port, overlink: boolean | import("../glpatch/gllink.js").default)

public

V contextMenu: ContextMenu

public
public
public

configuration object for loading a patch

cables_ui/src/ui/elements/canvasoverlays

summary
public
public
public
public
public

cables_ui/src/ui/elements/tabpanel

summary
public
public

stores opened editors to reopen when loading ui

public

Main tab panel left of the patchfield, can be minimized.

public

Tab panel for the attachments of an op.

public

Tab panel for the dependencies of an op.

public

Tab panel that contains tabs.

public
public
public

T cbData: *

public

T OpDoc: import("cables-shared-client").OpDoc

public

T TabOptions: import("./tab.js").TabOptions

public

T OpDoc: import("cables-shared-client").OpDoc

public

T TabOptions: import("./tab.js").TabOptions

public

T TabOptions: *

public

cables_ui/src/ui/gldraw

summary
public
public

draw splines, e.g.

public

C GlRect

Rectangle data for GlRectInstancer.

public

Draws many rectangles quickly using GPU instancing (e.g.

public
public

draw splines, e.g.

public

C GlText

Draws text with an msdf font texture, using GlRectInstancer.

public

Writes text with an msdf font texture, using GlRectInstancer.

public
public

T GlRectOptions: Object

public
public

cables_ui/src/ui/glpatch

summary
public
public

C GlArea

public

Renders the cable of a link.

public
public

simple line e.g.

public
public
public

C GlLink

A link on the patchfield, drawn with GlCable.

public

C GlOp

Renders an op on the patchfield (GlPatch).

public

Renders the patchfield.

public

C GlPort

Renders a port of a GlOp on the GlPatch.

public

Selection area, shown when dragging the mouse on the patchfield.

public

Canvas of the patchfield (GlPatch).

public
public
public

Viewbox of current patch

public

Mouse state: buttons, position, dragging etc.

public
public

Detects shaking an op, which unlinks it.

public

C Snap

Snaps ops, ports etc.

public

Draws data visualizations on the patchfield (e.g.

public
public
public
public

cables_ui/src/ui/gltimeline

summary
public

WebGL timeline.

public

Canvas of the timeline (GlTimeline).

public

Timeline line showing the animation of a port.

public
public

C TlKey

public

C TlKeys

Renders the keys of an animation in the timeline.

public
public

Time ruler of the timeline.

public

C tlHead

Time head (current time marker) of the timeline.

public
public

C tlView

public

T TlConfig: *

public
public

T TlTitleOptions: object

cables_ui/src/ui/socketcluster

summary
public
public
public
public
public

C ScUi

public
public

F PatchConnectionReceiver(patch: any, options: any, connector: any)

public

F PatchConnectionSender(patch: any)

public

cables_ui/src/ui/utils

summary
public

Manages keybindings for hotkeys/shortcuts.

public
public

F getHandleBarHtml(name: string, obj: object): *

public

F handleBarPrecompiled(name: *): *

public

F escapeHTML(string: *): *

public
public

T KeyOptions: *