Commit 7d872c08 authored by Matija Obreza's avatar Matija Obreza

Instructions text updated

parent 0f98654a
......@@ -97,10 +97,41 @@
</div>
<div id="InstructionsModal" class="reveal" data-reveal aria-labelledby="modalTitle" aria-hidden="true" role="dialog">
<h2 id="modalTitle">Instructions</h2>
<h2 id="modalTitle">How to use the interactive tree editor</h2>
<div class="text">
<h3>Uploading the tree</h2>
<p>
Ding dong.
Go to <b>Current tree</b> drop-down menu, select choose file, choose JSON file with tree stucture that you want to upload, click on upload tree from the same drop-down menu, the tree should appear on the screen, you may have to zoom in or out to see it better.
</p>
<h3>Saving your tree</h3>
<p>
Once you finished editing the tree you can save your work by clicking on the download tree button on the <b>Current tree</b> drop-down menu. If you are working on a large tree we recommend to save your tree few times while you are working on it.
</p>
<h3>Navigation and actions</h3>
<p>
<b>Right-click on a tree node</b> to get the menu for renaming the node, deleting the node and creating children nodes.
</p>
<p>
<b>Dragging</b> can be performed on any node other than root. Dropping can be done on any node.
</p>
<p>
<b>Panning</b> can either be done by dragging an empty part of the SVG around or dragging a node towards an edge.
</p>
<p>
<b>Zooming</b> is performed by either double clicking on an empty part of the SVG or by scrolling the mouse-wheel. To Zoom out hold shift when double-clicking.
</p>
<p>
<b>Expanding and collapsing of nodes</b> is achieved by clicking on the desired node.
</p>
<p>
<b>Do not refresh the page while you are editing the tree to avoid that the current tree is cleared.</b>
</p>
</div>
<a class="close-button" data-close aria-label="Close">&#215;</a>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment