-
Notifications
You must be signed in to change notification settings - Fork 1
/
main.tex
453 lines (399 loc) · 16.6 KB
/
main.tex
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
\documentclass[a4paper,12pt]{report}
\addtolength{\oddsidemargin}{-1.cm}
\addtolength{\textwidth}{2cm}
\addtolength{\topmargin}{-2cm}
\addtolength{\textheight}{3.5cm}
\newcommand{\HRule}{\rule{\linewidth}{0.5mm}}
\makeindex
\usepackage{longtable}
\usepackage{graphicx}
\usepackage{makeidx}
\usepackage{hyperref}
\usepackage{verbatim}
\hypersetup{
colorlinks=true,
linkcolor=blue,
filecolor=magenta,
urlcolor=cyan,
}
% define the title
\author{Team vbscript}
\title{ Assignment 2}
\begin{document}
\setlength{\parskip}{6pt}
% generates the title
\begin{titlepage}
\begin{center}
% Upper part of the page
\textsc{\LARGE Department of Computer Science}\\[1.5cm]
\textsc{\Large COS 301 - Mini Project}\\[0.5cm]
% Title
\HRule \\[0.4cm]
{ \huge \bfseries Architectural Specification}\\[0.4cm]
\HRule \\[0.4cm]
% Author and supervisor
\begin{minipage}{0.4\textwidth}
\begin{flushleft} \large
Tshepo {Malesela}
\end{flushleft}
\end{minipage}
\begin{minipage}{0.4\textwidth}
\begin{flushright} \large
\emph{} \\
14211582
\end{flushright}
\end{minipage}
\begin{minipage}{0.4\textwidth}
\begin{flushleft} \large
\emph{} \\
Mfana {Masimula}
\end{flushleft}
\end{minipage}
\begin{minipage}{0.4\textwidth}
\begin{flushright} \large
\emph{} \\
12077713
\end{flushright}
\end{minipage}
\begin{minipage}{0.4\textwidth}
\begin{flushleft} \large
\emph{} \\
Lebelo {Tlou}
\end{flushleft}
\end{minipage}
\begin{minipage}{0.4\textwidth}
\begin{flushright} \large
\emph{} \\
15209190
\end{flushright}
\end{minipage}
\begin{minipage}{0.4\textwidth}
\begin{flushleft} \large
\emph{} \\
Wandera {Henry}
\end{flushleft}
\end{minipage}
\begin{minipage}{0.4\textwidth}
\begin{flushright} \large
\emph{} \\
17253129
\end{flushright}
\end{minipage}
\begin{minipage}{0.4\textwidth}
\begin{flushleft} \large
\emph{} \\
Mandla {Mhlongo}
\end{flushleft}
\end{minipage}
\begin{minipage}{0.4\textwidth}
\begin{flushright} \large
\emph{} \\
29630135
\end{flushright}
\end{minipage}
\vfill
{\large \today}
\end{center}
\end{titlepage}
\footnotesize
\normalsize
\renewcommand{\thesection}{\arabic{section}}
\begin{center}
\tableofcontents
\footnotesize
\normalsize
\end{center}
\renewcommand{\thesection}{\arabic{section}}
\newpage
\begin{center}
\textsc{\LARGE Architectural Requirement Specification}\\[1.5cm]
\textsc{\Large Team VbScript github repository link}\\[0.5cm]
For further references see \href{https://github.com/mfanamasimula/VBScript}{Github}
\today
\end{center}
\newpage
\subsection{Architectural Scope}
\begin{itemize}
\item The System should be accessible at anytime while the user is on campus.
\item The server that host the system and the database is always on.
\item The ability to navigate a given destination on campus
\item The system must know your current location.
\item The system must be able to to give ...
\item The system need to be able to host all the users on campus.
\item Administrative users have more access to the system have CRUD capabilities on events.
\item Each event on the system must have a destination and multiple ways of reaching that destination through the navigation.
\item The system must have the ability to notify users of current event.
\item Users have the ability to set a route based on user constraints such as routes with less pedestrian traffic.
\end{itemize}
\newpage
\subsection{External Interface Requirements}
\subsubsection{User Interface}
\begin{itemize}
\item Standards for ...\\
Fonts - Verdana \\
Images - square, ratio 1:1 \\
Buttons labels - Button( HTML input element ) , LinkButton and ImageButton \\
Color schemes - UP Colors , white , blue and red \\
Field tabbing sequence - row by row \\
\item Standard buttons, functions and navigation links that will
appear on every screen. \\
- Help button \\
- Search button \\
- Users: Login / Logout link \\
- Navigation: always display users current location. \\
- Events: button to navigate to current events on campus. \\\\
\item Shortcut keys.\\
Mobile Devices ( Android / iOS )
\begin{itemize}
\item Volume UP = Open textbox to search New direction
\item Volume DOWN = View events on campus
\end{itemize}
Desktop Computer
\begin{itemize}
\item Ctrl + F = Open textbox to search New direction
\item Ctrl + E = View events on campus
\item Ctrl + Z = logout / logOff
\item Ctrl + Alt + H = Help
\end{itemize}
\item Message dispaly conventions \\
- Dialog box: Error message , usage/help message \\
- Notification icon:
\begin{itemize}
\item Display on login, if user have not subscribe to recieve notifications either via SMS or email.
\item Alert user if any new events have been added or is about to take place.
\end{itemize}
- Status bar: Dispaly users current location at all times. \\
\item Accommodation for visually impaired users.\\
1.) Allowances For Enlarged Text: Stylesheet with large font size whose layout does not break
when text-only zoom is enabled in browser. \\
2.) Use Keyboard Shortcuts to Aid Navigation: Possibly being able to nevigate the whole application
with the use of only shortcut keys. \\
3.) Contrast is Key: Bold text on low contrust items and user ability to highlight text with mouse
( quick trick to increase contrast and to aid visual focus ). \\
\end{itemize}
\subsubsection{Hardware Interface}
\begin{itemize}
\item Supported Device type \\
- WiFi supported divice \\
- Precise location (GPS and network-based) support \\
\item Data and control interaction between the software and hardware \\
\item Communication protocol \\
-
- JSON (JavaScript Object Notation) \\
- Ajax (Asynchronous JavaScript and XML) \\
\end{itemize}
\subsubsection{Software Interface}
\begin{itemize}
\item Databases: \\
- Databases: MongoDB \\
- Operating Systems: \\
\item Operating Systems: \\
Mobile devices: \\
- Android 4.2 (Jelly Bean) or later \\
- iOS 8 or later \\
Desktop:\\
- accessible through Web browsers ( Google chrome or Mozilla Firefox ) @www.nav.up.ac.za
\end{itemize}
\subsubsection{Communicatons Interface}
\newpage
\subsection{Performance Requirements}
\subsubsection{Response Time}
Support 90000 Guests, users and admin.\\
Users consisting of students, lectures, and university employees.\\
The system should be able to withhold the following performance requirement:\\
- 95 percent of all the time (excluding Route Navigation response) the system should respond within 5 seconds.\\
- Less than 10 seconds response time for normal expected route navigation during more than 60 percent of the
time as depicted by conditions on campus.\\
- Atmost 20 seconds allocated for Route Navigation response time, at which Error messages for system failure are
issured eg "Navigation taking longer then expected"
\subsubsection{Workload}
\begin{table}[h!]
\centering
\caption{User scenario statistics.}
\label{tab:table1}
\begin{tabular}{|c|c|c|c|}
\hline
Scenario & Daily Total & Pages & Think Time \\
\hline
New user/Guest & 500 & Register, Login & 1 min \\
\hline
Looking for fun & 2500 & Events, Navigation & 25 seconds\\
\hline
Touring Campus & 150 & Points of interest, Navigation & 25 seconds \\
\hline
Lost on Campus & 4500 & Navigation & 15 seconds\\
\hline
\end{tabular}
\bigskip
Figure : User Traffic \\
\begin{tabular}{l}
\includegraphics{workLoad.png}
\end{tabular}
\end{table}
\subsubsection{Platform}
Not specific. Open to all systems that have WiFi support integration with functional requirement to enable
GPS ( Global Positioning System ) operations. This include standard navigation features such as good graphics
card for mapping directions in any format 2 or 3 dimensonal.
\newpage
\subsection{Design Constraints}
\begin{itemize}
\item The system will only use the Wifi network.
\item The system should be as small as possible, preferably less than 150MB.
\item The system should be user friendly and have a pleasant user interface.
\item The system will be accessible on smart devices mainly using IOS and Android platforms.
\item The system should only perform updates at night when the system work load is presumably significantly less.
\end{itemize}
\newpage
\subsection{Software System Attributes}
\subsubsection{Maintainability}
The system should be simple and easily understandable so as to readily facilitate upgrading of the software when necessary. This will be achieved by using the latest available software at our disposal. A modular design will allow parts of the system to be maintained with affecting the whole system.
\subsubsection{Usability}
A short tutorial must be provided to the user showing the capabilities of the system and how it must be used. This must be in straight forward, easy to learn manner. The state in which the application is closed must be saved. The system must provide suggestions to the user aswell as a help option should the user get lost. The system should allow the user to choose from a list of languages to use for interaction(voice command could added at a later stage). Deploy a friendly game-like interface that'll cater for all age groups.
\subsubsection{Scalability}
The system should still be able to perform optimally even under huge work load and traffic. If the system reaches a bottleneck, it should disable "nice to have" feature and only provide the core basic functionality.
\subsubsection{Reliability}
The system should be able to check for common requests(prospective student looking for the CSC) and load the directly from the server therefore minimising the traffic to the server. The system should continuously perform back-ups in the event that the system crashes or the generators don't kick in quick enough when a power failure occurs. The system should provide suggestions close to the user input if the input searched for is not found. If there are multiple paths to a destinations the system must let the user know about this but the shortest path must be the one suggested to the user.
\subsubsection{Availability}
The system should be available in times where most users are presumed to be on campus(07h00-18h00) aswell as big days on the University calender, UP birthday, Open Day etc.
\newpage
\subsection{UML Design}
\subsubsection{Domain Model}
\begin{figure}[h!]
\includegraphics[width=\linewidth]{R2DomainModel.jpg}
\caption{Domain Model Class Diagram}
\label{fig:R2DomainModel}
\end{figure}
\subsubsection{Class diagrams}
\textbf{Navigation Module}\\
\textbf{Events}\\
\begin{figure}[h!]
\includegraphics[width=\linewidth]{./events/EventModuleClassDiagram.png}
\caption{Events class diagram}
\label{fig:Event Module}
\end{figure}
\textbf{Notification Module}\\
\textbf{Users Module}\\\\
\begin{figure}[h!]
\includegraphics[width=\linewidth]{class.png}
\caption{Users Class diagram}
\label{fig:Users Class diagram}
\end{figure}
\subsubsection{Sequence diagrams}
\textbf{Events Module}
\begin{figure}[h!]
\includegraphics[width=\linewidth]{./events/UserSequenceDiagramEvents.png}
\caption{User sequence diagram}
\label{fig:1}
\end{figure}
\begin{figure}[h!]
\includegraphics[width=\linewidth]{./events/adminSeq.png}
\caption{User sequence diagram}
\label{fig:1}
\end{figure}
\subsubsection{Use Case Diagrams}
\textbf{Navigation Module}\\
\textbf{Events}\\
\begin{figure}[h!]
\includegraphics[width=\linewidth]{./events/User-list-all-events-on-the-system.png}
\caption{User List all event}
\label{fig:UC1}
\end{figure}
\begin{figure}[h!]
\includegraphics[width=\linewidth]{./events/Administrator-user-edit-event-on-the-system.png}
\caption{User List all event}
\label{fig:UC1}
\end{figure}
\begin{flushleft}
\includegraphics[scale=0.5]{./events/Administrator-user-edit-event-on-the-system.png}
\begin{center}
Creating the super user account
\end{center}
\end{flushleft}
\textbf{Notification Module}\\
\textbf{Users Module}\\\\
\begin{figure}[h!]
\includegraphics[width=\linewidth]{usecase.png}
\caption{Admin deletes or edits event}
\label{fig:UC4}
\end{figure}
\subsubsection{Activity Diagrams}
\textbf{Navigation Module}\\
\textbf{Events}\\
\begin{figure}[h!]
\includegraphics[width=\linewidth]{./events/UserListsEvents.png}
\caption{User List events}
\label{fig:1}
\end{figure}
\begin{figure}[h!]
\includegraphics[width=\linewidth]{./events/EventSelectionActivityDiagram.png}
\caption{User selects event}
\label{fig:2}
\end{figure}
\begin{figure}[h!]
\includegraphics[width=\linewidth]{./events/AdminAddEventActivityDiagram.png}
\caption{Admin user adds event}
\label{fig:3}
\end{figure}
\begin{figure}[h!]
\includegraphics[width=\linewidth]{./events/AdminChangeDeleteEventActivityDiagram.png}
\caption{Admin user adds event}
\label{fig:3}
\end{figure}
\textbf{Notification Module}\\
\textbf{Users Module}\\
\begin{figure}[h!]
\includegraphics[width=\linewidth]{activitty.png}
\caption{Users Activity diagram}
\label{fig:Users Activity diagram}
\end{figure}
\newpage
\newpage
\subsection{Design Patterns}
\textbf{User Module}\\
For the User module a Template Method willl be used because since there are 3 classes of different users. In the abstract class User defines the abstract primitive operations that appear as steps in the template method. The concrete classes are Admin, Guest and User which define the primitive operations.
\begin{itemize}
\item Abstract Class : Users.
\item Concrete Class : Admin, Guest and User.
\end{itemize}
\newpage
\subsection{Technology}
Choosing the correct technologies is very important for this project because there may be more than one way of performing a task but choosing the correct method can have other benefits such as better performance.
For this project the technologies have been devided into three categories, The Mobile technologies, The Server-Side Back End technologies, The Website Front-End technologies.
\subsubsection{Server-Side Back End Technologies}
\begin{itemize}
\item CodeIgniter to provide a MVC framework to help with the development.
\item MySQL which will be used to store the system data that will be queried later on.
\item MongoDB for the system database and willbe used corrospondingly with the MYSQL
\item PHP will be the server script language to be used in this project.
\item Linux operating system on the server.
\item Apache for the web server
\end{itemize}
For this project requires reliability, security and performance and the solution of using LAMP (Linux, Apache, MySQL, PHP) which is a certified system with less weakness than more recent back end packages. LAMP is also the ideal choice whhen you look at which languages the students a familiar with.
\subsubsection{Website Front-End Technologies}
\begin{itemize}
\item HTML 5 to define the stucture and content of the website.
\item CSS3 for the styling of the website and to provide animation where needed.
\item Javascript to provide the website with functionality. The javascript will be used to process the return data from server.
\item JQuery will be used with the javascript to provide functionality.
\end{itemize}
\subsubsection{Mobile Application Technologies}
\textbf{Android Application Technologies}
\begin{itemize}
\item Android studio will be the platform for development.
\item Java EE will be used as the programming language with the correct API's.
\item RoboGuice to provide dependancy injection framework for android.
\item GSON for converting Java objects to JSON representation and vice versa.
\end{itemize}
A native android application because native android applications provide some of the fastest performance and user interface. Building a native android application will help with how devices may display and content placement. If we are indeed building a native android application, Java will be the primary programming language.\\\\
\textbf{iOS Application Technologies}
\begin{itemize}
\item Xcode 8/9 as the platform of development.
\item Swift3 which is the programming language used to develop Apple applications.
\item Objective C will be used inline with the Swift for developing apple applications.
\item MapKit framework for providing a map we can change and all the map functionality.
\item OpenGL ES GL Kit for the rendering of the systems interface, this will help with the graphics and look of the application.
\end{itemize}
These form the standard procedure for iOS application development.
\newpage
\subsection{Quality and Feasability Design}
\end{document}