Human Computer Interaction » History » Version 1
Aleksander Bešir, 13.12.2010 17:21
1 | 1 | Aleksander Bešir | h1. Human Machine Interface |
---|---|---|---|
2 | |||
3 | {{toc}} |
||
4 | |||
5 | h2. 1 Basic concept |
||
6 | |||
7 | h3. 1.1 Hardware |
||
8 | |||
9 | 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 | |||
11 | p=. !HMI_website_overall.png! |
||
12 | |||
13 | p. The intended server-side html generating aplication is Tomcat's Jasper, making JSP the intended website programming language. |
||
14 | |||
15 | h3. 1.2 Functions specifications |
||
16 | |||
17 | 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 | |||
19 | p. The planned website functions are: |
||
20 | |||
21 | p=. !HMI_website_functions.png! |
||
22 | |||
23 | _Functions marked with (?) need to be discussed._ |
||
24 | |||
25 | h3. 1.3 Development steps |
||
26 | |||
27 | # Installing and configuring Apache Tomcat on a computer |
||
28 | # Building custom framework for the HMI website |
||
29 | # Using the framework to build and design the website |
||
30 | # Connecting the website's functions with logic's functions |
||
31 | |||
32 | h2. 2 Installing and configuring Apache Tomcat on a computer |
||
33 | |||
34 | h3. 2.1 Java and Tomcat setup |
||
35 | |||
36 | 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 | |||
38 | | _Requirement_ | _Used version_ | |
||
39 | | Server machine architecture | Virtual x86 | |
||
40 | | Operating System | Ubuntu Server 10.10 | |
||
41 | | Java development kit | openJDK-6-jdk | |
||
42 | | Servlet container and http server | Apache Tomcat 6.0.29 | |
||
43 | |||
44 | In order to use Eneraptor's HMI, you will need software mentioned above. If you need some help installing Java and Tomcat, check: |
||
45 | [[Installing Java and Tomcat]] |
||
46 | |||
47 | After the installation, these files need to be configured: |
||
48 | * conf/tomcat-users.xml |
||
49 | |||
50 | h2. 3 Web application architecture (from user's point of view) |
||
51 | |||
52 | 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 | |||
54 | !Eneraptor_GUI.png! |
||
55 | |||
56 | The functions and data on the image above are just dummies (for now). The image shows the basic application's levels: |
||
57 | |||
58 | | _Level_ | _Level name_ | _Component name_ | _Description_ | |
||
59 | | 1 | Sections | Section | The top and main menu (eg. Status, Log, Statistics, ...) | |
||
60 | | 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 | | 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 | | 4 | SubTopics | SubTopic | A SubTopic is a group of Tools that are dependent on each other. | |
||
63 | | 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 | |||
65 | 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 | |||
67 | !Level_hierarchy.png! |
||
68 | |||
69 | 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 | |||
71 | Why use a framework? |
||
72 | Once we have a working framework, web application building speeds up rapidly. Patching web application and adding new features become very easy. |
||
73 | |||
74 | Why create a new Framework? |
||
75 | 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 | |||
77 | The framework's conceptual name for the time of it's development is Flat framework. |
||
78 | |||
79 | h2. 4 The Flat framework |
||
80 | |||
81 | Flat (Free Linksys-like Admin Tools) framework is a light-weight framework being developed by us. It will be used for Eneraptor's web application. |
||
82 | |||
83 | The framework has 5 levels (layers) as shown in the previous topic's image above. These are _Sections_, _SubSections_, _Topics_, _SubTopics_ and _Tools_. |
||
84 | |||
85 | h2. References |
||
86 | |||
87 | # Chopra, Vivek, et al., _Professional Apache Tomcat 6_, Wrox - Wiley, 2007 |
||
88 | # Basham, Bryan, et al., _Head First Servlets and JSP™_, O’Reilly, 2008 |
||
89 | |||
90 | h2. Attachments |