Human Computer Interaction » History » Version 3

Aleksander Bešir, 14.12.2010 17:02

1 1 Aleksander Bešir
h1. Human Machine Interface
2 1 Aleksander Bešir
3 1 Aleksander Bešir
{{toc}}
4 1 Aleksander Bešir
5 1 Aleksander Bešir
h2. 1 Basic concept
6 1 Aleksander Bešir
7 1 Aleksander Bešir
h3. 1.1 Hardware
8 1 Aleksander Bešir
9 1 Aleksander Bešir
p. The HMI will will be realised as a website. It will run on an Apache Tomcat http server, which will not run on the same device as Eneraptor's logic. Instead it will run on an independent proxy server.
10 1 Aleksander Bešir
11 1 Aleksander Bešir
p=. !HMI_website_overall.png!
12 1 Aleksander Bešir
13 1 Aleksander Bešir
p. The intended server-side html generating aplication is Tomcat's Jasper, making JSP the intended website programming language.
14 1 Aleksander Bešir
15 1 Aleksander Bešir
h3. 1.2 Functions specifications
16 1 Aleksander Bešir
17 1 Aleksander Bešir
p. The actual website functions depend on what functions do the _logic_ and _archive and statistics_ modules offer. The website will require some authentication for users to access it. Two permission types are planned - _admin_ and _viewer_. Users with viewer permission will be able to review certain information, but will not be able to execute any commands that would change how the _logic_ and _archive and statistics_ modules work.
18 1 Aleksander Bešir
19 1 Aleksander Bešir
p. The planned website functions are:
20 1 Aleksander Bešir
21 1 Aleksander Bešir
p=. !HMI_website_functions.png!
22 1 Aleksander Bešir
23 1 Aleksander Bešir
_Functions marked with (?) need to be discussed._
24 1 Aleksander Bešir
25 1 Aleksander Bešir
h3. 1.3 Development steps
26 1 Aleksander Bešir
27 1 Aleksander Bešir
# Installing and configuring Apache Tomcat on a computer
28 1 Aleksander Bešir
# Building custom framework for the HMI website
29 1 Aleksander Bešir
# Using the framework to build and design the website
30 1 Aleksander Bešir
# Connecting the website's functions with logic's functions
31 1 Aleksander Bešir
32 1 Aleksander Bešir
h2. 2 Installing and configuring Apache Tomcat on a computer
33 1 Aleksander Bešir
34 1 Aleksander Bešir
h3. 2.1 Java and Tomcat setup
35 1 Aleksander Bešir
36 1 Aleksander Bešir
In this step we need to set up a computer, that we will use as our proxy server, which will run the Eneraptor's HMI web application. During development of the HMI web application, this was used:
37 1 Aleksander Bešir
38 1 Aleksander Bešir
| _Requirement_                     | _Used version_       |
39 1 Aleksander Bešir
| Server machine architecture       | Virtual x86          |
40 1 Aleksander Bešir
| Operating System                  | Ubuntu Server 10.10  |
41 1 Aleksander Bešir
| Java development kit              | openJDK-6-jdk        |
42 1 Aleksander Bešir
| Servlet container and http server | Apache Tomcat 6.0.29 |
43 1 Aleksander Bešir
44 1 Aleksander Bešir
In order to use Eneraptor's HMI, you will need software mentioned above. If you need some help installing Java and Tomcat, check:
45 1 Aleksander Bešir
[[Installing Java and Tomcat]]
46 1 Aleksander Bešir
47 1 Aleksander Bešir
After the installation, these files need to be configured:
48 1 Aleksander Bešir
* conf/tomcat-users.xml
49 1 Aleksander Bešir
50 1 Aleksander Bešir
h2. 3 Web application architecture (from user's point of view)
51 1 Aleksander Bešir
52 1 Aleksander Bešir
The HMI web application will look and feel much like well known Cisco Linksys home router's administration web page(attachment:Linksys_admin_page.jpg). The conceptual look of the HMI is:
53 1 Aleksander Bešir
54 1 Aleksander Bešir
!Eneraptor_GUI.png!
55 1 Aleksander Bešir
56 1 Aleksander Bešir
The functions and data on the image above are just dummies (for now). The image shows the basic application's levels:
57 1 Aleksander Bešir
58 1 Aleksander Bešir
| _Level_ | _Level name_ | _Component name_ | _Description_ |
59 1 Aleksander Bešir
|       1 | Sections     | Section          | The top and main menu (eg. Status, Log, Statistics, ...) |
60 1 Aleksander Bešir
|       2 | SubSections  | SubSection       | Every level 1 Section has it's own level 2 menu (eg. level 1 Setup has level 2 Subsections like Basic Setup, Security, ...) |
61 1 Aleksander Bešir
|       3 | Topics       | Topic            | Every level 2 SubSection is divided by different number of Topics (represented by black-boxed text in the left part of the image above) A Topic is a group of SubTopics |
62 1 Aleksander Bešir
|       4 | SubTopics    | SubTopic         | A SubTopic is a group of Tools that are dependent on each other. |
63 1 Aleksander Bešir
|       5 | Tools        | Tool             | Every Tool is either a text fiels, button, input box, radio button, graph, etc. It represents a single control or view object which is highly dependent on othre Tools in the same SubTopic |
64 1 Aleksander Bešir
65 1 Aleksander Bešir
To get the better feeling how the web application is structured, observe the example image above and the tree structure shown below. The tree structure shows, how a user has to navigate, in order to turn the Logic Unit's power on.
66 1 Aleksander Bešir
67 1 Aleksander Bešir
!Level_hierarchy.png!
68 1 Aleksander Bešir
69 3 Aleksander Bešir
-To achieve this, an independent open source framework is being currently built. This framework will then be used to create Eneraptor's web application.-
70 1 Aleksander Bešir
71 3 Aleksander Bešir
-Why use a framework?
72 3 Aleksander Bešir
Once we have a working framework, web application building speeds up rapidly. Patching web application and adding new features become very easy.-
73 1 Aleksander Bešir
74 3 Aleksander Bešir
-Why create a new Framework?
75 3 Aleksander Bešir
There are really many frameworks, that would be useful for our project, but they are very powerful. We want a really lightweight framework, that will be able of doing, what we need, and nothing else. And since there are many projects, that would need such a framework, we will develop it and license it as open source.-
76 1 Aleksander Bešir
77 3 Aleksander Bešir
-The framework's conceptual name for the time of it's development is Flat framework.-
78 1 Aleksander Bešir
79 2 Aleksander Bešir
_14. 12. 2010 update: The custom open source framework development has ben dropped. The Eneraptor's HCI is and will be simple enough, that realizing a full framework for it would require relatively too much additional time. Insted, the HMI will implement the same hierarchy described above, not a framework. Creating a custom framework could be a future project._
80 1 Aleksander Bešir
81 1 Aleksander Bešir
h2. References
82 1 Aleksander Bešir
83 1 Aleksander Bešir
# Chopra, Vivek, et al., _Professional Apache Tomcat 6_, Wrox - Wiley, 2007
84 1 Aleksander Bešir
# Basham, Bryan, et al., _Head First Servlets and JSP™_, O’Reilly, 2008
85 1 Aleksander Bešir
86 1 Aleksander Bešir
h2. Attachments