Adding a model to the WebAdmin Console - struct-by-lightning/wpi-suite GitHub Wiki

WebAdmin Console Overview

The WebAdmin is a Java Servlet Page (JSP) that gives users tools for manipulating the Core Server's models. Theses tools are in the form of HTML forms that use AJAX to submit commands to the server. In the vanilla implementations of the Core Server, only the User and Project models are included in the WebAdmin.

Developers can extend the console to include Model Forms for any model (e.g. Defect) loaded into the server. The WebAdmin includes javascript scripts to automate the Model Form creation (see: createModelField(..)). In this way, we provide an alternative path to manipulate the database that does not depend on front-end code in development.

The WebAdmin console is accessed via http://localhost:8080/WPISuite/. The JSP code lives in WPISuite/WebContent/WEB-INF/index.jsp.


Adding a new model to the WebAdmin

Adding a new model to the WebAdmin requires a developer to perform three steps:

  1. Add model specification variables: Title, API path, attribute array (String[]), and attribute length (number of attributes).
  2. Call the createModelScript(..) script so the JSP generates the javascript code needed to contact the API.
  3. Call the createModelField(..) script so the JSP generates the Model Form based on step 1's variables.

The User and Project models have already been specified in the JSP. Following the pattern of these should allow you to add a new Model. If this is not straight-forward, take a look at the walkthrough below.


Walkthrough

Prerequisites

  1. A model & entity manager have been created and can be packaged as a JAR.
  2. The module JAR has been loaded into the server's WEB-INF/lib folder.
  3. The JAR has been added to the server project's buildpath. For this tutorial, we will be using the PostBoard module as an example. Specifically, we would like to add a field to the WebAdmin for the PostBoardMessage model.

Step 1: Defining the Model specification variables

The first step to adding a new Model Field is to provide model specification variables. The specification variables are defined in the JSP around lines 9 or 11.

Here, you will see how the User and Project models are described. Each model has the following variables:

  1. Title
  2. API Path (of the form /)
  3. Attribute array (one for each in the Model's constructor)
  4. Attribute Length

The PostBoard module's Message contains two fields: message, date. The message field is the only variable needed for the constructor, thus it is the only field that the WebAdmin needs to provide in the Model Form. As such the PostBoardMessage module has the following specification variables:

String postboardpostboardmessagetitle = "PostboardPostboardMessage";
String postboardpostboardmessagepath = "postboard/postboardmessage";
String[] postboardpostboardmessage = {
		"message"
};
int postboardpostboardmessagelength = 1;

With these specified, we can now move onto step 2.

Step 2: Add a call to the Model API Script creation script

The next step is fairly simple: we just need to add a call to the createModelScript(..). This script creates the javascript API interaction functions for the Model. These functions are used by the Model Forms to perform the actions requested by the user.

Invoking the createModelField(..) script in a JSP requires you to wrap the call in "<%= =>" markup tags. These markup tags simply tell the JSP to call the script when generating the page.

The user and project models call this function at line ~84 in the JSP. Below these lines, add the following:

<%= createModelScript(postboardpostboardmessagetitle, postboardpostboardmessagepath, postboardpostboardmessage, postboardpostboardmessagelength %>

Step 3: Add a call to the Model Form automation script

Finally, we need to call the createModelField(..). This script generates the HTML form for the model, creating buttons for each of the CRUD actions.

The User and Project models add this function call starting at ~line 184 (with a few other extras enabling other functionality).

Thus, to add the PostBoard Message model to the WebAdmin, we must add the following line:

<%= createModelField(postboardpostboardmessagetitle, postboardpostboardmessagepath, postboardpostboardmessage, postboardpostboardmessagelength) %>

Now rebuild the project, fire up the server, and pull up http://localhost:8080/WPISuite/. The new model field should show up at the bottom of the page (or where ever you placed the <%= => field script call).

Notes

After following these steps, you may receive a NullPointerException from Java Date functions as a response. Fear not! This is simply because PostBoardMessage has a Date field and the WebAdmin does not construct the PostBoardMessage with a Date field by default.

⚠️ **GitHub.com Fallback** ⚠️