Get Started!

Canvas .dash User Options

Per User Custom .dash options, to setup the UI how you want

 

Each user can override certian options in the .dash UI via their Custom JavaScript & CSS settings. These options are found on the Edit Individual User screen.

CodeMirror (Editors) Style

You can alter the style of CodeMirror, the text editer, via some CSS. For Example, some people like to have a different color BG for the editor this can be achieve using some CSS similar to the following :

.CodeMirror {
  background-color:#fcf8e3;
}

This would look similar to :

Alt Background color

Hidden Folders

You can hide unwanted Dynamic Assemblies / Folders from the TreeView via the window.__HIDDEN_FOLDERS__ global var.

For example

window.__HIDDEN_FOLDERS__ = [
  'Canvas.FontAwesome',
  'SiteSetup',  
];

This will hide the Dynamic Assemblies "Canvas.FontAwesome" and "SiteSetup" from the tree view, to reduce clutter.

Cut, Copy & Paste

Cut copy paste p-r

By default the "Cut, Copy & Paste" buttons for the Editor's tool bar are not rendered for the user. You can enable these via the window.__USER_OPTS__ object.

window.__USER_OPTS__ = {
  showCutCopyPaste : true,
};

The showCutCopyPaste flag, when set to true, causes the toolbar to include the buttons for "Cut", "Copy" and "Paste".

Prompt onClose

Sometimes it's all too easy to close browser windows, and if you're writing logic and accidentally close the window - well it's annoying! So to combat accidental window closing, by default, .dash asks you to confirm that you want to re-load the UI.

This can be overridden if you want.

window.__USER_OPTS__ = {
  askBeforeClose : false,
};

The snippet above will disable the prompt and allow the window to close regardless of the state of the content.

ToDo - improve and check edited state of the files then there's no need to ask at all.

Data Transport

The .dash IDE is built on Savnac, which by default will use a WebSocket to communicate with the server if the browser supports sockets.

The Savnac lib will fall-back on XmlHttpRequest (AKA Ajax) for the data transport if the browser doesn't support web sockets.

Some people have found that the XHR is more stable for certain projects, whereas other experience the opposite.

You can take control of how the data is transfered to/from the server via the User's options :

window.__DISABLE_SOCKS__ = true;

This forces the .dash to use XHR when sending the data to/from the server.

Pros / Conns

There are a number of reasons to use WebSockets over XHR, and vice versa however the primary difference is Buffered vs UnBuffered responses & Multi User support.

WebSockets Pros

  • Un-buffered Response. When running Installers, or other long running server processes, the server's responses are sent immediately while the process is still active.

WebSockets Conns

  • Single User. Currently, when the socks transport is used, if the .dash is opened in another Tab or by another browser / user, the socks connection is disconnected.

    This prevents multiple users from editing the same project.

XHR Conns

  • Buffered Response. When running Installers, or other long running server processes, the server's doesn't respond until the process has completed.

XHR Pro

  • Multi-User support. When the Socks are disabled, any number of users can access and edit the content of a project. Which means you can also have multiple tabs or windows open of the same project.

    Currently, you need to be aware of editing the same file in different instances of the editor.

Code Mirror Theme

You can change the code mirror theme to any of the default themes for example the following will set the theme to material :

 window.__CODEMIRROR_THEME__ = 'material';