Home > Learning > Getting Started

Getting Started

For a short video introduction to the NETLab Toolkit, see the video Intro to the NETLab Toolkit.

Widgets

The NETLab Toolkit widgets are Flash Components that function inside of a normal Flash movie and communicate with a separate application called “Hub” that handles the actual communication with a microcontroller (e.g. Make Controller, Arduino, or XBee).

Widgets are placed on the Flash stage, and can be configured using the Component Inspector. Adjustments can be made in real time to many of the widgets by clicking on buttons and/or setting numbers in the widget interface. Connections between widgets is based on the instance names, so for example, a ClipControl widget can receive sensor readings from an AnalogIn widget by setting the inputSource to the instance name of the AnalogInput widget.

Hub

The Hub is a server that works in the background and communicates with a variety of devices and software. Widgets communicate with the Hub to get input, or send output. Other applications can also communicate with the Hub using the Sockets protocol (e.g. see this explanation of how to get Processing to talk to the Hub).

Follow the steps below to get started using the NETLab Toolkit. You can click on the title of each step to to expose or hide its contents.

Download the NETLab Toolkit » Install the NETLab Toolkit Components » Setup the Microcontrollers » General Use of Widgets » Widget Parameters Saved in an XML File » Using the Flash SWF File Outside of the Flash Application » Firewall Issues »


Go to the Download page and download the release package for your platform.

The release package is a compressed .ZIP file. If your browser and system does not decompress it automatically, you will need to do this before installing the components as explained in the next step.

Powered by Hackadelic Sliding Notes 1.6.5

  • Put the folder of Flash widgets in the right folder of the Adobe Flash Application folder
    • If you have version 3.1.4 or later of the toolkit, you may install the widgets by simply double clicking on the file NETLabFlashWidgets_3_1_X.mxp. This file will launch the Adobe Extension Manager which will do the widget installation for you.
    • OR move the NETLabFlashWidgets folder to the following locations
      • Flash folder>Common>Configuration>Components
  • Put the entire HUB folder into your applications/programs directory (do not separate the Hub application from the folder it comes – if you do, it will not work)
    • The Hub requires that Java be installed on your computer.
      • Mac: Java is installed by default on the Mac up to OS X Snow Leopard (10.6). From Lion (10.7) on, it is optional. When you try launch the Hub the first time, you may be asked to install Java.
      • Windows: Download Java for Windows here if the Hub does not stay open when you launch it. If after installing Java the Hub still does not work, you’ll need to make sure Java is in your “Path” environment variable. The process for setting this up is outlined here  - instructions here or get a windows expert to help you with this since it is a bit complicated. You need to be logged in as an administrator.
    • On the Mac, the most recent version of the Hub requires that you set the application to “Open in 32-bit mode”. To do this, select the NETLabHub application in the Finder, GET INFO (command-I), and check the box that says “Open in 32-bit mode”.
Powered by Hackadelic Sliding Notes 1.6.5


Follow these links for setting up the Microcontroller(s) you are using, and then connecting a sensor

Powered by Hackadelic Sliding Notes 1.6.5

  • Start the Hub application
  • Open Flash and create a new Flash document (AS3 for widgets v3, or AS2 for widgets v2) and set the frame rate to 24fps (for smooth animation showing the sensor values)
  • Open the WINDOW>COMPONENTS palette and drag a widget (e.g. AnalogIn) onto the stage of a Flash document
  • Give the widget an instance name in the Property Inspector (e.g. “input0″)
  • Open the WINDOW>PROPERTIES (CS5) or WINDOW>COMPONENT INSPECTOR (CS3 & CS4) window to view the widget parameters, set the controller type (e.g. arduino) parameter, and any other settings. Often the defaults are fine.
  • Set the controllerInputNum to the port on the controller you are using for your input sensor
  • Save and select CONTROL>TEST MOVIE to run it
  • Click on the “Connect” button at the top right of AnalogInput to establish a connection with the microcontroller (note: with the Arduino and Xbee, it takes a few seconds for the connection to be established).
  • Make changes to the sensor and see them reflected in the AnalogInput indicator.
  • Close the SWF and return the Flash authoring environment
  • Add a ClipControl widget to the stage and in the Component Inspector set its “InputSource” to the name you gave the AnalogInput (e.g. “input0″).
  • Create or import a graphic on the screen, and turn it into a symbol.
  • Set the new symbol’s instance name (e.g. “clip1″).
  • Test the movie again, and experiment with the different ClipControl properties and see how sensor changes affect the symbol.
  • Watch the video Intro to NETLab Toolkit to see all of this in action
Powered by Hackadelic Sliding Notes 1.6.5


Note that any changes you make to a widget while the movie is running, e.g. to the min and max of a AnalogInput widget, are saved in an XML file with the same name as the Flash file. So if the Flash file is named myFirstNet.swf,  the corresponding settings file will be called myFirstNet.xml in the same directory as the SWF. The next time you run the SWF, the run-time settings will be restored to where they were during the previous run.

If you move the SWF, be sure to also move the XML file. Simiarly, if you change the name of the SWF, you can copy the XML file to have the same prefix name and the settings will be preserved for the newly named file. If you do not do this, the settings for all the widgets will return to their defaults.

Powered by Hackadelic Sliding Notes 1.6.5

If you need to run your Flash SWF file outside of the Flash application, e.g. to use it in fullscreen mode, you’ll need to change the Flash security settings for that computer. This is because the widgets in the Flash SWF needs to communicate with the Hub, and that causes a so-called security sandbox violation. To permit the communication between the Hub and Widgets, do the following:

  1. Go to the web page to manage your Flash Security Settings:
  2. In the upper right of this page (under “Global security settings for content creators”), a Flash application will open with a title of “Adobe Flash Player Settings Manager”. Sometimes this is slow, and takes a while to open.
  3. In this Settings Manager, select the middle “Always Allow” button.
  4. Then, click on the pull-down menu “Edit Locations…” and select “Add Location…”
  5. Then click on “Browse for Folder…” and select the folder where your SWF is located, OR simply select your entire hard drive, or desktop, or user folder so you never have to go through this process again. If you are using an external drive for your work, you’ll need to select that.

Now you should be able to run your SWF in the Flash Player, and use command F (Mac) or control F (PC) to go full screen.

Powered by Hackadelic Sliding Notes 1.6.5

On the Mac: If you are working with the Make Controller, or accessing a remote Hub, or having some other mysterious problem where everything seems right but you are not getting data from or to the controller, be sure to check if you have your firewall turned on. If it is, it will prevent things from working write. You can turn it off in System Preferences>Security>Firewall. We’ve also seen problems if Little Snitch is running.

On the PC: Often when you start up the Hub, Windows will let you know that it has blocked the program’s network access. You need to UNBLOCK when this dialog occurs.

Powered by Hackadelic Sliding Notes 1.6.5

Last modified January 25th, 2012