Skip to content
elakian edited this page Aug 3, 2011 · 1 revision

Background

WireIt is an open-source javascript library for creating circuit-esque wiring diagrams. These diagrams consist of three main components: containers, terminals and wires. If we think about the wiring diagram as a graph, the containers are our nodes, the terminals define where it is possible to place edges, and the wires are our edges.

We use these wiring diagrams to provide an intuitive visualization for instrument-specific data reduction pipelines. For our purposes, nodes are black boxes for processing (loading, reducing, and saving files), terminals ensure that each node gets what it needs, and wires direct flow and allow access to the data in their various states as they flow through the pipeline.

Wiring Editor

Data reduction is instrument specific. Since we hope to allow instrument scientists to create their own reduction templates/pipelines, this specificity presents something of a problem. We do not want, for example, users of Instrument A to have to sift through dozens of reduction modules that are not appropriate for their instrument.

As such, Wiring Editor (a WireIt plugin) becomes an important tool. Wiring Editor allows us to provide a language for each instrument, defining the containers and connectivity relevant for that instrument.

Loading

###Status:

We are now able to send an Ajax request from the client side to the server side, and return a JSON object defining a particular WireIt diagram that is then displayed by the Wiring Editor. This loading process is mediated by our adapter (static/lib/tracks/test_adapter.js), and involves methods defined for the Wiring Editor class (static/lib/wireit/plugins/editor/js/WiringEditor.js).

###The Loading Process:

  1. The WiringEditor.load method is called (by the load button, or the page loading), see static/lib/wireit/plugins/editor/js/WiringEditor.js and static/lib/wireit/plugins/editor/js/BaseEditor.js
  2. The WiringEditor.adapter.listWirings method, defined in the adapter, is called with the Wiring Editor's language name, and success and failure reactions passed in
  3. The listWirings method sends a post request (line 63) to the url 'listWirings/' carrying with it the language name
  4. django sees this request (urls.py) and performs the view (tracks/views.py) associated with a request to that url, which is at this point to dump a hard-coded json object
  5. Having successfully connected, the adapter parses the returned json object and indicates that there has been a success (line 67)
  6. This success triggers the WiringEditor.onLoadSuccess method of the Wiring Editor, which pretty much takes care of the rest

Goals:

  1. Save wiring diagrams to and load wiring diagrams from a database.

Saving

We can now, on a click to the Wiring Editor 'save' button, send the current wiring diagram displayed to the server as a post request. This is controlled by the adapter's saveWiring method and the WiringEditor's save, saveModuleSuccess, and saveModuleFailure.

Run Reduction

On a click to a wire, the current wiring diagram is sent to the server as a post request. This is controlled by the adapter's runReduction method and the WiringEditor's runReduction, runModuleSuccess, and runModuleFailure. runModuleSuccess currently displays a plotting object passed back as a response to the request.

Listeners

The WireIt guide (http://dev.lshift.net/james/wireit/wireit/guide.html) presents some helpful information and examples on listening for mouse events. ... It seems as though overriding the prototype methods might be the most straightforward approach.

Clone this wiki locally