Never confuse education with intelligence, you can have a PhD and still be an idiot.
- Richard Feynman -



Difference between revisions of "Assignment:Exposing data over http lab2 GUI Client"

From Juneday education
Jump to: navigation, search
(First revision)
 
(Software introduction: added link to github)
Line 33: Line 33:
  
 
You'll need to attend the workshop in order to fully understand the architecture and design of the client. And you need to study some basic stuff, in order to get something out of the workshop.
 
You'll need to attend the workshop in order to fully understand the architecture and design of the client. And you need to study some basic stuff, in order to get something out of the workshop.
 +
 +
There's an online API [https://progund.github.io/systemet-gui-client-docs/docs/ at progund's github].
 
=== Swing User interface ===
 
=== Swing User interface ===
 
The Swing user interface presents the user with a graphical application which lists a set of products in a tabular form. The GUI also presents the user with four input fields:
 
The Swing user interface presents the user with a graphical application which lists a set of products in a tabular form. The GUI also presents the user with four input fields:

Revision as of 17:45, 11 December 2017

Prerequisites - introductory workshop etc

Before starting with this assignment, you should attend the workshop for Lab2, the manuscript for which can be found here (TODO).

Lab 2 - Writing the GUI Client

In this second sub-assignment, we'll write a small GUI client in Java/Swing. This sub-assignment has two goals: You should have a graphical Java application which can

  • display a table of product from the Systembolaget product line.
  • allow the user to enter values for filtering the products, and produce the correct API call for such filters

Technologies which are the focus of this sub assignment include:

  • Swing
  • HTTP URLs (with GET query parameters)
  • Using factories and interfaces to hide implementations
  • Using fake data to be able to postpone some technical parts of the application, yet be able to test it
  • Printing URLs to verify that the filters are correctly produced from the user interface

Software introduction

Your client software consists of a few software modules:

  • The graphical user interface
    • Written in Swing
    • Mainly focused around a JTable and a custom JTableModel
  • The domain class Product (represents a Java object for a Product)
    • This is the data type for the JTableModel
  • A REST Query API for producing REST queries from the user's filter input
    • You'll use a factory to get an ApiAccess object, which let's you access an API
    • You'll implement a FakeApiAccess class which always returns the same set of products, regardless of what Query you send it
  • The REST Query API will also represent a Query (which is what you send to the ApiAccess object)
  • A Query object
    • has a list of parameters
      • A Param (represents a parameter) has a key and a value
    • let's the programmer add parameters to its internal list
    • can return the value from a given key
    • can represent itself as a query string

You'll need to attend the workshop in order to fully understand the architecture and design of the client. And you need to study some basic stuff, in order to get something out of the workshop.

There's an online API at progund's github.

Swing User interface

The Swing user interface presents the user with a graphical application which lists a set of products in a tabular form. The GUI also presents the user with four input fields:

  • Min price
  • Max price
  • Min alcohol
  • Max alcohol

The GUI will react immediately to input changes in the text fields.

The table has a table model, which is capable of displaying rows with Product objects, and also sorting the rows (when the user clicks a column header).

In this sub-assignment, you will get the data (products) from an ApiAccess object, sending it a Query. As in lab1, however, you will totally fake the fetching of products. You will create a fake ApiAccess class, which will always return the same objects, regardless of what Query it gets as an argument.

The first goal of this sub-assignment is for you to see how you can display a table of products in a Swing GUI.

The second goal of this sub-assignment, is for you to verify that the GUI can create the correct Queries for fetching products from the Web API.

Note, that you will not actually contact the Web API in this sub-assignment, only verify that your GUI creates the correct URLs for doing so.

If the user enters 10 in the Min price text field, and 100 in the Max price text field, this should generate a Query for the Web API which reads:

http://localhost:8080/search/products/all?min_price=10&max_price=100

It is enough if your GUI client prints the queries to standard out, for you to be able to test that they are correct and work.

Note, again, that the products displayed in the GUI will not be filtered according to the user input. That's for the third sub-assignment!

This software module is responsible for:

  • Creating a GUI
  • Displaying products in the GUI
  • Allowing for user input in text fields for filtering products

Domain objects

This module (package) only contains the Product class which represents a product from the Systembolaget API.

The REST Query API

This module lets you create Query objects (consisting of key-value pairs) which you can send to an ApiAccess object.

An ApiAccess object, should, given a Query, return a list of Product objects. Again, in this sub-assignment, how the ApiAccess object actually fetches the products, is totally fake. Always returning some objects, allows you to test that the GUI is capable of displaying objects in a tabular fashion.

Your GUI will, given input from the user via the text fields, build up a Query which you can print to the standard out to see that it actually creates a URL which would work for accessing the Web API (Servlet).

Directory overview

The directory layout is as follows:

some files here

Part 1 - Building and running the GUI application

Here we simply learn how to compile everything and run the gui application.

Part 2 - Writing the FakeApiAccess class

You will write a class which implements the ApiAccess interface, and which returns a list of fake products when its fetch(Query) method is called.

A big part of this part is to understand the design and architecture of the gui client provided to you by the teachers.

Faking products you already know how to do, from Lab1.

Part 3 - Printing the generated queries and testing them on the Web API

In this part, you will print the queries generated from the GUI to standard out and use that output to test that the generated query strings actually would work and return the correct JSON from the Servlet Web API.

Getting started

Getting started with part 1

Setting up your environment

In this section we will explain and list the steps needed to set up the development environment for this project.

These steps need only be done once:

Build and start your client

In this section we list the steps needed to build the source code. These steps need to be done every time you:

  • want to build (compile) to check that your source code edits were ok
  • run the GUI with the latest changes
some script

Note: Expand using link to the right if you can't execute the script.

$ chmod u+x *.sh # make all scripts executable

Getting started with Part 2 -

Knowing when you are done

You are done with this task when the following is true:

  • You understand how to
    • build
    • deploy
    • run
    the GUI
  • Can manually query your Web API via HTTP using your generated query strings, and see that the requests works

You shall write in your diary (see workshop for details) what you have written and how that code works. You shall also explain how the overall system works and is intended to work.