IntraWeb and Websnap

Last Updated: 9/22/2008



Sections above here:
Home  »  Development  »  Page Mode

Sections below here:

Topics in this section:
Page Mode
IntraWeb and Websnap
Working with Page Mode
Creating the IWP Project
IntraWeb Pages (IWP)
Page References

Search Documentation:

This sections provides a brief introduction to how IntraWeb can be integrated with WebSnap. A demo will be built that uses WebSnap to provide the framework, login, and session management. IntraWeb will be used to provide the user interface. In this manner of integration the products are quite complimentary.

Star Trek Demo

The demo is a simple demo that takes a survey of two questions that are of vital importance to the programming community. The two questions are:

  1. Which was the BEST Star Trek movie?
  2. Which was the WORST Star Trek movie?

It will then collect your vote and tabulate it with other voters. To see this, simply run the demo in the browser multiple times. After it tabulates the votes it will generate a small chart displaying the results. Full source code for the demo is included in the demos directory. We have designed it to be simple as possible so as to make it easy to follow. It demonstrates the following:

  1. IntraWeb integration with WebSnap.
  2. Use of IntraWeb Page Mode.
  3. Use of WebSnap session management with IntraWeb.
  4. Use of WebSnap for control of authentication.
  5. Use of IntraWeb to provide the primary web interface.

Creating the Demo 

It is assumed that you are familiar with WebSnap and thus we will just show the IntraWeb specific parts in creating this demo. We started with a standard WebSnap application that contained login support using a TWebUserList and a TLoginFormAdapter.

The first thing that must be done to use IntraWeb with WebSnap is to add a TIWModuleController. To simplify distribution and not require distribution of external files, IntraWeb serves "internal" files from its libraries. IntraWeb has several internal files and as a user you can add more using IntraWeb's API.

TIWModuleController hooks into WebSnap's dispatch mechanism and provides this functionality and other core IntraWeb requirements. This component can also be used to use IntraWeb with WebBroker and is demonstrated in the GuessWB demo that is provided with IntraWeb.

For the TIWModuleController to be effective, the application module also needs a TWebDispatcher. If you application doesn't already have a TWebDispatcher, simply open the application module and add a TWebDispatcher (from the Internet tab) and then a TIWModuleController (from the IntraWeb Control tab). No further changes are required, IntraWeb and WebSnap will do the rest.

Your application module should now look like this:

Next we created a new WebSnap page module. To do this we selected File : New : Other : WebSnap tab : WebSnap Page Module. The dialog is shown here:

After OK is clicked, Delphi will display the New WebSnap Page Module dialog as shown here:

Make the settings match the settings as shown in the figure above and select OK. Delphi will now create a new WebSnap Page Module. It should look like this:

Delete the TPageProducer and create a TIWPageProducer (from the IntraWeb Control tab). The page module should now look like this:

Save the page module and name it Page1Module.pas. Now we need to create an IntraWeb page form. Select File : New : Other : IntraWeb : New Form. Select the Page Form radio button then click OK. Save the form as Page1Form.pas. Now lets go back and link Page1Module to Page1Form. To do this create an OnGetForm event for the TIWPageProducer. The event needs to look like this:

procedure TPage1.IWPageProducer1GetForm(ASender: TIWPageProducer; 

  AWebApplication: TIWApplication; var VForm: TIWPageForm);

begin

  VForm := TformPage1.Create(AWebApplication);

end;

This creates an instance of TformPage1 on demand. So that the unit will compile IWApplication and IWPageForm must also be added to the uses clause.

Now let's go back to Page1Form and create our survey questions. We've created two TIWLabel components, two TIWComboboxes, one TIWButton, and one TIWText. For the combo boxes we have also set the RequireInput = False. Our Page1Form now looks like this:

Next we will add the code for the form's OnCreate event. Double click on the form and enter this code. The code merely loads the text and identifying numbers into the combo boxes.

procedure TformPage1.IWPageFormCreate(Sender: TObject); 


var


  i: TSTMovie;


begin


  for i := Low(i) to High(i) do begin


    cmboBest.Items.AddObject(GMovies[i], TObject(i));


  end;


  (cmboBest.Items);


end;

Now we will add an OnClick event for the button. Double click on the button and add this code:

procedure TformPage1.butnVoteClick(Sender: Tobject); 


var


  LBest: TSTMovie;


  LWorst: TSTMovie;


begin


  LBest := miMotionPicture;


  LWorst := miMotionPicture;


  if cmboBest.ItemIndex = -1 then begin


    textMsg.Lines.Text :=


      'Please select a choice for best Star Trek movie.';


  end else if cmboWorst.ItemIndex = -1 then begin


    textMsg.Lines.Text :=


      'Please select a choice for worst Star Trek movie.';


  end else begin


    LBest := TSTMovie([cmboBest.ItemIndex]);


    LWorst := TSTMovie([cmboWorst.ItemIndex]);


    if LBest = LWorst then begin


      textMsg.Lines.Text := 'Sorry - but you cannot pick the same movie for best
and worst.';


    end else begin


      if WebContext.Session.Values['Confirm'] <> 'Y' then begin


        if LBest = miFinalFrontier then begin


          textMsg.Lines.Text := 'Ugh. The Final Frontier
was truly horrid. Are you sure that is'


           + ' your choice for best?';


          butnVote.Caption := 'Vote with my questionable
choice anyways';


          WebContext.Session.Values['Confirm'] := 'Y';


        end else if LBest = miVoyageHome then begin


          textMsg.Lines.Text := 'Good choice! The Voyage
home was good wasn''t it?';


          butnVote.Caption := 'Record my vote!';


          WebContext.Session.Values['Confirm'] := 'Y';


        end;


      end;


    end;


  end;


  textMsg.Visible := textMsg.Lines.Count > 0;


  if not textMsg.Visible then begin


    RecordVote(LBest, Lworst);


    ProduceResponse := False;


    DispatchPageName('PageResults', WebContext.Response, []);


  end;


end;

Now we could spend a lot of time explaining the above code. But did you notice something? Its all standard Delphi code! So we'll just explain a few lines of interest.

The code checks to see if the user has selected information, and also makes sure that they do not select the same movie for both choices. It also enters in its personal opinion about certain choices and displays messages to the user by making the TIWText component visible. If the TIWText component is not made visible, not messages are displayed and all is well. In this case the code calls RecordVote which is a procedure in Global.pas which is part of the demo. It then sets ProduceResponse to False. This tells IntraWeb not to render this page because we will render it manually, or give WebSnap instructions to do so. Finally we give WebSnap instructions to render a different page module to display the results.

There are a few properties on the form itself that we must set as well.

  1. Set PostToSelf to true. This instructs the form to generate links that will send the data back to this same form. FormAction can be set if you wish the data to be submitted to another form. FormAction and PostToSelf (When true) are mutually exclusive.
  2. Set AutoProcess to true. This instructs the form to automatically parse the HTTP variables and set the component states accordingly. If you wish to control this process manually, you would leave AutoProcess to false.

Next we will create another Page Module and Page Form. The steps are pretty much like the previous one so we will not waste space on this. Instead we will start with a bank page form, PageResultsForm.pas. We have added one TIWImage and loaded a bitmap into it. It looks like this:

From this form we have created only one event. We have put some drawing code in the OnRender event. The OnRender event occurs each time IntraWeb renders a form, prior to it actually being rendered. Here is the code for the OnRender:

procedure TformResults.IWPageFormRender(Sender: Tobject); 


var


  i: TSTMovie;


  LMaxBest: Integer;


  LMaxWorst: Integer;


  LMaxWidth: Integer;


  LVotesBest: Tlist;


  LVotesWorst: Tlist;


begin


  LMaxBest := 0;


  LMaxWorst := 0;


  LMaxWidth := 0;


  LVotesBest := TList.Create; try


    LVotesWorst := TList.Create; try


      GetVotes(LVotesBest, LvotesWorst);


      with imagResults.Picture.Bitmap.Canvas do begin


        Brush.Style := bsClear;


        Font.Color := clBlue;


        Font.Name := 'Script';


        Font.Size := 18;


        for i := Low(i) to High(i) do begin


          TextOut(85, 98 + 24 * Ord(i), Gmovies[i]);


          LMaxWidth := Max(LMaxWidth, TextWidth(GMovies[i]));


          LMaxBest := Max(LMaxBest, Integer(LVotesBest[Ord(i)]));


          LMaxWorst := Max(LMaxWorst, Integer(LVotesWorst[Ord(i)]));


        end;


        TextOut(330, 74, 'Best');


        TextOut(480, 74, 'Worst');


        //


        Brush.Style := bsSolid;


        for i := Low(i) to High(i) do begin


          Brush.Color := Gcolors[i];


          FillRect(Rect(310, 98 + 24 * Ord(i)


           , 310 + Trunc((Integer(LVotesBest[Ord(i)])
/ LMaxBest) * 150)


           , 98 + 24 * Ord(i) + 20));


          Brush.Color := GColors[TSTMovie(Ord(High(i)) –
Ord(i))];


          FillRect(Rect(480, 98 + 24 * Ord(i)


           , 480 + Trunc((Integer(LVotesWorst[Ord(i)])
/ LMaxWorst) * 150)


           , 98 + 24 * Ord(i) + 20));


        end;


      end;


    finally FreeAndNil(LVotesWorst); end;


  finally FreeAndNil(LVotesBest); end;


end;

Running the Demo

We have now covered the important parts of the demo itself. Let's see what it looks like when we run it. First compile and run the demo and then run the Web Application Debugger from the Tools menu. From the Web Application Debugger click on the URL link and then select WebSnapSurvey.Survey in the browser. This will start our demo application. It should look like this:

This screen is produced by WebSnaps login adapter. Enter test for the user name and test for the password and click Login. This screen will now appear:

Now select your choices and click vote. Now it will display the result screen:





(C) 2002-2009 - Atozed Software Ltd.