Springs

A user interface for creating connections between two points using flexible wires.

» Source Code | sources.jpg | destinations.jpg | socket.gif

Instructions

To create a patch between a source and a destination, move the mouse over a source socket (the circular shapes), press and then drag the mouse to a destination socket. A patch wire shows the connection. You can also drag from destination to source.

To delete a patch wire, click on it's center.

To re-patch a wire, move the mouse over either near the start or the end of the wire. The wire is highlighted and the socket is shown as disconnected. You can then drag the wire to a new connection.

Try moving the whole patch panel by dragging it's title bar. (This performs slowly in Sun's Java Applet plugin for some reason...).

This applet demonstrates using simple physics simulations, rich visuals, dissolves, and modeless interactions to create a patching system.

Implementation

The idea for this project was inspired by Prolellerhead's Reason.

Strictly speaking, wires suspended between two points follow a catenary curve. However, Ken Perlin pointed out that people don't really pay too much attention to this, and you can use a basic quadratic parametric curve and animate points using Sin/Cos functions to create the sensation that the wires wiggle.

Troubleshooting

This is a Java applet written using Sun's JDK 1.4 and the Sun Java Plugin for Explorer. It has been tested on Windows XP. Your mileage on other platforms may vary.

Download the latest Sun Java Plugin from here: java.sun.com