UNPKG

autograph

Version:

A visual data routing automation tool.

100 lines (76 loc) 4.18 kB
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>JSDoc: Source: SelectionTool.js</title> <script src="scripts/prettify/prettify.js"> </script> <script src="scripts/prettify/lang-css.js"> </script> <!--[if lt IE 9]> <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script> <![endif]--> <link type="text/css" rel="stylesheet" href="styles/prettify-tomorrow.css"> <link type="text/css" rel="stylesheet" href="styles/jsdoc-default.css"> </head> <body> <div id="main"> <h1 class="page-title">Source: SelectionTool.js</h1> <section> <article> <pre class="prettyprint source"><code>/* * Draw a dashed line rect when clicking and dragging across the autograph SVG * * @module SelectionTool */ define(['d3'], function(d3){ return function(controlLayer) { var selectLineFunction = d3.svg.line() .x(function (d) { return d.x; }) .y(function (d) { return d.y; }) .interpolate("linear-closed"); var selectStart = null; var selectRect = null; var selectDragger = d3.behavior.drag(); selectDragger.on("dragstart", function(){ selectStart = { x: d3.event.sourceEvent.offsetX, y: d3.event.sourceEvent.offsetY }; selectRect = controlLayer.append("path") .style("stroke", '#bbb') .style("fill", 'none') .style("stroke-dasharray", ("3, 3")); }); selectDragger.on("drag", function () { var data = [ selectStart, { x:d3.event.x, y:selectStart.y}, { x:d3.event.x, y:d3.event.y}, { x:selectStart.x, y:d3.event.y} ]; selectRect.attr("d", selectLineFunction(data)); }); selectDragger.on("dragend", function(){ selectRect.remove(); }); return selectDragger; } }); </code></pre> </article> </section> </div> <nav> <h2><a href="index.html">Index</a></h2><h3>Modules</h3><ul><li><a href="module-autograph.html">autograph</a></li><li><a href="module-BaseComponent.html">BaseComponent</a></li><li><a href="module-BaseComponentView.html">BaseComponentView</a></li><li><a href="module-ComponentCollection.html">ComponentCollection</a></li><li><a href="module-ComponentLibrary.html">ComponentLibrary</a></li><li><a href="module-CursorModel.html">CursorModel</a></li><li><a href="TerminalModel_.html">models/TerminalModel</a></li><li><a href="module-PositionedModel.html">PositionedModel</a></li><li><a href="module-SelectionTool.html">SelectionTool</a></li><li><a href="module-TerminalModel.html">TerminalModel</a></li><li><a href="module-WebviewComponentView.html">WebviewComponentView</a></li><li><a href="module-WireModel.html">WireModel</a></li></ul><h3>Classes</h3><ul><li><a href="BaseComponentView.html">BaseComponentView</a></li><li><a href="ButtonComponent.html">ButtonComponent</a></li><li><a href="ButtonComponentView.html">ButtonComponentView</a></li><li><a href="ClockComponent.html">ClockComponent</a></li><li><a href="ComponentLibrary.html">ComponentLibrary</a></li><li><a href="DelayComponent.html">DelayComponent</a></li><li><a href="EchoComponentView.html">EchoComponentView</a></li><li><a href="HTTPClientComponentView.html">HTTPClientComponentView</a></li><li><a href="TerminalModel.html">models/TerminalModel</a></li><li><a href="PositionedModel.html">PositionedModel</a></li><li><a href="TerminalModel__.html">TerminalModel</a></li><li><a href="ValueComponentView.html">ValueComponentView</a></li><li><a href="WebviewComponentView.html">WebviewComponentView</a></li><li><a href="WireModel.html">WireModel</a></li></ul><h3>Global</h3><ul><li><a href="global.html#addContent">addContent</a></li><li><a href="global.html#hilight">hilight</a></li><li><a href="global.html#initialize">initialize</a></li><li><a href="global.html#render">render</a></li></ul> </nav> <br clear="both"> <footer> Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.2.2</a> on Wed May 07 2014 22:03:07 GMT-0500 (CDT) </footer> <script> prettyPrint(); </script> <script src="scripts/linenumber.js"> </script> </body> </html>