|
|
Nooleus Tutorial
Create your first Nooleus diagram... |
||||||||||||||||||
|
This tutorial will guide you through the process of creating a simple diagram, and introduce you to some of the key concepts along the way.  Let's start with some theory... In Nooleus, diagrams are drawn onto Pages. Nooleus always has at least one Page, called the ‘Home’ Page. The Home page is what you see when Nooleus is first started-up.  Pages contain two main types of item:
Nooleus has two modes of operation; View mode and Edit Mode:
Basic Navigation Try grabbing the Page and moving it around; click and hold the left mouse button anywhere on the Page, then move the mouse. In Nooleus, almost anything that can be moved will have inertia applied to its movement. Try grabbing and moving the Page again, but this time release the mouse button while the Page is still moving. The Page will continue to move, gradually slowing to a stop. You will find that this makes navigation of large diagrams far easier. All Pages are 12 major grid squares tall and wide. Try moving to the very edge of the Page. The Page will begin to resist your input as it is dragged beyond its limit. Release the Page and press the Home key on your keyboard to return to the centre of the Page. To aid working with diagrams of different sizes, Pages can be zoomed in and out. Use the scroll wheel on your mouse to do this. Alternatively, you can use the plus and minus keys on your keyboard. Adding a New Object Let’s have a go at editing a page… If you aren’t already there, navigate to the Home Page. Once there, right-click on the page, and select ‘Edit this page’ from the pop-up menu.  You will immediately notice that the major grid lines have turned red. The red lines simply serve as a visual cue to remind us that we’re in edit mode! Let’s add a new Object to the page. We’re going to add an object that will represent your computer (localhost). We will define a single Action for this new Object which will allow you to perform a ping test of localhost. Choose a blank part of the page, and right-click to bring up the menu. You'll notice that the menu has a many more options on it, now that we're in Edit Mode. Choose ‘New Object’.  The ‘New Object’ dialog will appear:  The New Object dialog has two tabs; Details, and Actions. The information on the details tab describes how the object will look on the Page. The Actions tab defines what the Object can do. Enter the following details:
The Dialog should now look like this:  The next step is to define what our object can 'do' - it's Actions. In this case we will define a single Action that will perform a ping test of localhost. Click on the Actions Tab.  Click on the 'New' button. A new blank Action will be created. Give it the name 'Ping Me'. Enter the following command into the command box: ping -t localhost The dialog should now look like this:  Click ‘OK’ to create the object.  We’ve finished editing the page for now, so let’s return to View mode. Right-click on the page again and select ‘Finish Editing’ from the menu. The red grid lines will revert back to their original colour. If you right click on the ‘My PC’ Object, you will see that the Action menu has the ’Ping Me’ action on it. Selecting it will launch a ping test to your computers local network interface. Double-clicking on the Object will also launch the first Action in the list.  That's it - you've created your first Object! Drawing Links between Objects Let’s add another new Object and then draw a link (a line) between it and the ‘My PC’ object from the previous section. This time we will configure and Action to open-up a web page instead of a running program. Put Nooleus back into Edit mode. Then, right-click on an empty part of the Page and create a ‘New Object’. Give the new Object the following properties:
Click ‘OK’ to create the Object. To create a link between the two objects, right-click on one of them, and choose ‘Draw Link’. As you move the mouse around, you will notice that you now have a line attached to it. The line will snap to any objects that you hover close to. Move the mouse over the other object and left-click to place the link. |