Tips_tutorials   >   Studiojs202   >   Web App Stats Web Page

Web App Stats Web Page

In this section we will create a remote task and web page that allows a user to enter a date range and receive the current web app stats. In the real world you would put this web page in a password protected admin directory of the web site.

Create Remote Task

First we will create the remote task that responds to the request.

  1. F2 Browser > ContactsWeb library
  2. Right-click the rtBase_abstract class > select Make Subclass
  3. Name the subclass remote task, rtWebAppStats
  4. Override the $construct method.
  5. Add the parameter pParamsRow Row datatype to the method.
  6. Enter the following code in the method.

; Run the superclass code which set the task variables.
Do inherited Returns FlagOK
If FlagOK
   
   ; Convert the string text dates to dates vars.
   Calculate BeginDate as dat(pParamsRow.BeginDate,'y-M-D')
   Calculate EndDate as dat(pParamsRow.EndDate,'y-M-D')
   
   Do webmon.$retWebStatsList(BeginDate,EndDate) Returns List
   If List.$colcount=0
      Calculate FlagOK as kFalse
   Else
      
      Do webmon.$convertWebStatsListToText(List) Returns Text
      If len(Text)
         
         Calculate Text as replaceall(Text,kCr,'<br />')
         
         Do ioHTMLTools.$retHTMLPageTemplate Returns HTML
         
         ; Replace the placeholders with content.
         Calculate HTML as replaceall(HTML,'##LINK##','')
         Calculate HTML as replaceall(HTML,'##JAVASCRIPT##','')
         Calculate HTML as replaceall(HTML,'##TITLE##','Web App Stats')
         Calculate HTML as replaceall(HTML,'##BODY##',Text)
         
         ; Add the HTTP content header.
         Do ioHTMLTools.$addHTTPContentHeader(HTML) Returns FlagOK
         
      End If
   End If
End If
If not(FlagOK)
   
   ; An error occurred. Get the last error as an HTML page.
   Do ioHTMLTools.$retLastErrorHTML() Returns HTML
   
End If

Quit method HTML

Create Web Page

We will now create a web page for getting the web apps stats.

  1. Using your text editor create the following web page:

    <html>

    <head>
    <title>Web App Stats</title>
    <link rel="stylesheet" type="text/css" href="http://localhost/css/master.css" />
    <script type="text/javascript" src="../js/webappstats.js"></script>
    </head>

    <body>

    <div class="container"> <!-- open container div -->

    <div class="title">Web App Stats</div> <!-- title div -->

    <div class="search"> <!-- open search div -->

    <p>
    Enter the date range for the web stats which you would like to view
    and then click the 'View Stats' button
    </p>
    <table>
    <tr>
    <td>Begin Date</td>
    <td><input type="text" id="BeginDate" name="BeginDate" value="2007-01-01" size="15" /></td>
    <td>yyyy-mm-dd</td>
    </tr>
    <tr>
    <td>End Date</td>
    <td><input type="text" id="EndDate" name="EndDate" value="2007-12-31" size="15" /></td>
    <td>yyyy-mm-dd</td>
    </tr>
    <tr>
    <td></td>
    <td><input type="button" value="View Stats" onclick="submitRequestViaFrame()" /></td>
    </tr>
    </table>

    </div> <!-- close search div -->

    <iframe id="ResultsFrame" src="" width="100%" height="100%" scrolling="yes" frameborder="0"></iframe>

    </div> <!-- close container div -->

    <input type="hidden" id="WebAppServerCGI" value="http://localhost/cgi-bin/nph-omniscgi" />
    <input type="hidden" id="OmnisServer" value="5912" />
    <input type="hidden" id="OmnisLibrary" value="ContactsWeb" />
    <input type="hidden" id="OmnisClass" value="rtWebAppStats" />

    </body>
    </html>

  2. Save the web page as WebAppStats.htm to your web server folder.

Create JavaScript File

  1. Using your text editor create the following JavaScript file:

    function pingFile() {

    alert("Ping File");

    }

    function submitRequestViaFrame() {

    // Gather the hidden inputs needed to assemble the URL
    var CGI = document.getElementById("WebAppServerCGI").value
    var OmnisServer = document.getElementById("OmnisServer").value
    var OmnisLibrary = document.getElementById("OmnisLibrary").value
    var OmnisClass = document.getElementById("OmnisClass").value
    var BeginDate = document.getElementById("BeginDate").value
    var EndDate = document.getElementById("EndDate").value

    var URL = CGI + "?" + "OmnisServer=" + OmnisServer + "&OmnisLibrary=" + OmnisLibrary + "&OmnisClass=" + OmnisClass;
    //alert("URL = " + URL);
    URL = URL + "&BeginDate=" + BeginDate + "&EndDate=" + EndDate ;

    // Get a reference to the frame
    var rFrame = document.getElementById("ResultsFrame");

    // Point the frame to the URL
    rFrame.src = URL ;

    }

  2. Save the file as webappstats.js in the js directory of your web server.

Test Web Stats Web Page

  1. Open the web stats web page with FireFox

    http://localhost/WebAppStats.htm
  2. Click the View Stats button.

    All going well the web app stats will be returned to the lower frame of the web page.
  3. Click the View Stats button a few more times. The number of connections should increment each time you click the button.

There you have it! The ability to get your web app stats on-line.

We could get much fancier with the format and presentation of the web app stats report by putting them into a couple of tables on the web page and tinkering with the CSS. I'll leave that for you to do in your spare time. :-)

StudioTips Documentation - Copyright 2006 Vencor Software