Trace Systems, Inc

Suppose you'd like to set things up so that when you click that button on your browser, a signal gets sent to your TCPmaker PIC dedicated web server board over the network (or over the web!) to light up an LED that is connected to, say, pin RJ7 on the PIC18F97J60 EtherPIC on your device.

TCPmaker makes that really, really easy!

First, you create an Integer Variable called D1 in TCPmaker's Visual Page Designer, and then you associate it with a button called Pb1 on one of your pages.

When TCPmaker generates ethernet controller software for your project, it will create a file called mtGen.c, which is where you'll customize your generated code. Toward the top of this file, you'll find a comment block with a helpful summary of all the variables you have created for your project, that looks something like this.  (We've highlighted the entry for our variable D1 below:)

//*****************************************************************************

//

// Variable Declarations:

// ======================

// The following variables were created in TCPmaker's Visual Page Designer, for

// the purpose of transferring specific, named data items between the device

// and the PC browser:

//

// Integer Variables:

// ==================

//    D1  (id="i0")

//    D2  (id="i1")

//    D3  (id="i2")

//    D4  (id="i3")

//    D5  (id="i4")

//    D6  (id="i5")

//    D7  (id="i6")

//    D8  (id="i7")

//    Btn0  (id="i8")

//    Btn1  (id="i9")

//    Btn2  (id="i10")

//    Btn3  (id="i11")

//

// Numeric Variables:

// ==================

//    Pot1  (id="n0")

//    Degrees  (id="n2")

//

// String Variables:

// =================

//    Sv0  (id="s0")

//    Sv1  (id="s1")

//

// Variables that travel either into or out of the device are declared

// here.

//

//*****************************************************************************

Just below this comment block, you'll find a couple of declarations for your variable D1, that look like this:

// Variable D1 - Diode D1 connected to RJ7

//  D1  **In**  **Out**

//  is used by these controls in browser layout:

//    Pb1 --- Page: Class=Pg

//

//

int D1;                   // Data transfer variable as created in Visual Page Designer

unsigned char D1TxFlag;   // Transmit flag for this variable: set True to send

Farther down in the file, you'll find an event handler procedure for this variable.  TCPmaker's software framework will make sure that this event handler gets called any time the variable D1 gets changed. That will happen automatically whenever the user presses or releases the Pb1 button that you put in your layout.

You can cause your PIC processor to turn that LED on or off by adding just one line of code (highlighted) to the event handler that TCPmaker created for variable D1, shown below:

// Event handler for variable:  D1 - Diode D1 connected to RJ7

void eventD1(void)

{

// Variable has just arrived, so add your code to DO something with it here:

PORTJbits.RJ7 = D1;  // This is the only code you need to add to light LED

}

All we did was to assign the new value of variable D1 to the digital I/O pin that the LED is connected to. It's as simple as that!

So, whenever the user presses or releases that Pb1 button in your layout, here's what happens:

1. A signal automatically gets sent from your PC browser, over the Ethernet cable (and possibly over the World Wide Web, depending on where your device is located) to your device, with the new value of variable D1.
2. TCPmaker's software framework in the PIC recognizes that signal, and places the new value into the variable D1 in your PIC.
3. It then calls the eventD1( ) handler, to inform your code that this new value has arrived, and that something should be done with it.
4. The code you added to this event handler does whatever you want to do with the new value of this variable. In this case, we turned an LED on or off, but you can do whatever you want.