updated tc help info, closes #125

conda/js/src/components/toolchain/GraphicalEditorHelpModal.jsx

@@ -49,7 +49,7 @@ class GraphicalEditorHelpModal extends React.PureComponent<Props> {
 					</p>
 					<h5>Change the information of a block?</h5>
 					<p>
-						Left-clicking on a block will bring up the Block Editor modal, which lets you change the block name, add &amp; remove &amp; rename inputs and outputs, change the synchronized channel, and delete the block.
+						Left-clicking on a block will bring up the Block Editor modal, which lets you change the block name, add &amp; remove &amp; rename inputs and outputs, change the synchronized channel, and delete the block. Remember to click <i>Save Changes</i>! If you want to discard your changes, you can either click outside of the modal or click the <b>x</b> button on the top-right corner.
 					</p>
 					<h5>Create a connection?</h5>
 					<p>
@@ -63,6 +63,10 @@ class GraphicalEditorHelpModal extends React.PureComponent<Props> {
 					<p>
 						The editor only displays connections connected to selected blocks. For example, to only see connections to/from Block X, select Block X (via shift+clicking on the block).
 					</p>
+					<h5>Insert blocks from another toolchain, an algorithm, or a database?</h5>
+					<p>
+						Right-click on the background grid and select <i>Insert Object Here</i> to insert blocks for an object relative to the position of your mouse. A modal will pop up, and lets you insert a toolchain, algorithm, or part of a database, to easily create toolchains using BEAT objects that you already have created.
+					</p>
 					<h3>Keyboard Shortcuts</h3>
 					<Table striped>
 						<thead>
@@ -73,6 +77,17 @@ class GraphicalEditorHelpModal extends React.PureComponent<Props> {
 							</tr>
 						</thead>
 						<tbody>
+							<tr>
+								<td>
+									Pan
+								</td>
+								<td><pre className='preInline'>
+									Middle-click and move
+								</pre></td>
+								<td>
+									The preferred way to pan around the editor is to use a mouse with middle-click functionality. You can middle-click anywhere in the canvas and then move your mouse to pan around on both axis. If this does not work for you, you may need to turn on <i>autoscrolling</i> in your browser settings.
+								</td>
+							</tr>
 							<tr>
 								<td>
 									Pan vertically
@@ -136,7 +151,7 @@ class GraphicalEditorHelpModal extends React.PureComponent<Props> {
 							</tr>
 							<tr>
 								<td>
-									Open a context menu
+									Open a context (right-click) menu
 								</td>
 								<td><pre className='preInline'>
 									Right click
@@ -180,6 +195,24 @@ class GraphicalEditorHelpModal extends React.PureComponent<Props> {
 									</span>
 								</td>
 								<td>
+									You can also create a connection by clicking on the black rectangle of an output and then clicking on the black rectangle of an input. This lets you create connections between distant blocks and move around the canvas.
+								</td>
+							</tr>
+							<tr>
+								<td>
+									Create an Algorithm based on a block
+								</td>
+								<td>
+									<pre className='preInline'>
+										Left click
+									</pre>
+									{' '}
+									<span>
+										on the block to bring up the block editor. At the top of the modal, enter the username and name for the algorithm to be created, and click the <i>Create</i> button to generate an algorithm based off of the connections, inputs, and outputs of the block. You will have to edit the algorithm in the editor to choose the types, and to add any any parameters or results.
+									</span>
+								</td>
+								<td>
+									This only works for normal and analyzer blocks. If you do not see your new algorithm, refresh the browser tab/window.
 								</td>
 							</tr>
 							<tr>
@@ -192,14 +225,12 @@ class GraphicalEditorHelpModal extends React.PureComponent<Props> {
 									</pre>
 								</td>
 								<td>
-									Some elements in the editor have extra information found by hovering over the element for a couple seconds.
+									Blocks and connections in the editor have extra information found by hovering over the element for a couple seconds.
 								</td>
 							</tr>
 						</tbody>
 					</Table>
 				</ModalBody>
-				<ModalFooter>
-				</ModalFooter>
 			</Modal>
 		);
 	}