#68 #66 #30 #51: Ablagetypen-, Ortstypen- und Fundattributtypenverwal…

…tung auf ViewModelArchitektur, Listenformulare und Einzelelementformulare umgestellt; kleinere Verwesserungen; Toast-Nachrichten eingebracht
robertgruening · May 8, 2019 · 8b4bc20 · 8b4bc20
1 parent 3455133
commit 8b4bc20
Show file tree

Hide file tree

Showing 40 changed files with 2,618 additions and 295 deletions.
diff --git a/doc/Entwicklerhandbuch.md b/doc/Entwicklerhandbuch.md
@@ -12,8 +12,9 @@
     1. [Mehrschichtenarchitektur](#42-mehrschichtenarchitektur)
     1. [Web-Service-Architektur](#43-web-service-architektur)
     1. [Entwurfsmuster](#44-entwurfsmuster)
-1. [Logfunktion](#5-logfunktion)
-1. [Releasemanagement](#6-releasemanagement)
+1. [Benutzerführung](#5-benutzerfhrung)
+1. [Logfunktion](#6-logfunktion)
+1. [Releasemanagement](#7-releasemanagement)
 
 ## 1. Entwicklungsumgebung
 
@@ -123,12 +124,30 @@ Ein oder mehrere *Beobachter* können sich bei einem *Subjekt* für ein oder meh
 
 ![Beobachtermuster am Beispiel der WebServiceClients und ViewModels des AblageTypes](Beobachter.jpg)  
 *Abbildung 3 - Beobachtermuster am Beispiel der WebServiceClients und ViewModels des AblageTypes*
+
+## 5. Benutzerführung
+
+Das Konzept der Benutzerführung (User Experience - UX) gliedert sich in mehrere Aspekte. Zu den wichtigsten Themen gehört die Definition der Zielgruppen, die mit der Anwendung zu tun haben. An ihnen orientiert sich das im Folgenden beschriebene Benutzungskonzept.
+
+### 5.1. Zielgruppen
+
+Die Anwendung richtet sich an unterschiedliche Zielgruppen (Stakeholder), die unterschiedliche Ziele, Wünsche, Fertigkeiten und Erfahrungen haben. In diesem Kapitel werden die Zielgruppen durch [Personas](https://en.wikipedia.org/wiki/Persona_(user_experience)) wiedergegeben. Es sei darauf hingewiesen, dass die Vollständigkeit der Beschreibung und die Priorisierung einer Persona von der Entwicklung der Applikation abhängt. Weil aus praktischen und logischen Gründen Daten zuerst eingegeben werden müssen, bevor sie durchsucht oder analysiert werden können, werden Personas bevorzugt beschrieben, die überwiegend Daten eingeben. Dies kann beispielsweise im Rahmen einer Inventur geschehen.
+
+#### 5.1.1. Archivarin
+
+Die Persona *Archivarin* heißt Gabi, ist 55 Jahre alt, verheiratet und hat zwei Kinder, die bereits außer Haus sind. Sie ist schon seit zehn Jahren in der archäologischen Arbeitsgruppe des Ortes tätig und gehört zu den aktiven Mitgliedern. Gabi hat ein abgeschlossenes Studium der Völkerkunde und arbeitet für ein Museum, für das sie Schriften anferrtigt und Vorträge hält. Im Bereich von Text- und Tabellenprogrammen hat Gabi grundlegende Kenntnisse. Weil man bei Softwareprogrammen jedoch an sie viele Dinge mitdenken muss, z. B. Vorbereiten von Daten, wünscht sie sich ein System, das "mitdenkt", sie führt, sodass sie mit wenig Aufwand ihr Ziel erreicht.
+
+Als Archivarin empfielt Gabi Richtlinien für die Verwaltung des Archivs und sorgt für deren Einhaltung.
+
+### 5.1. Systembenachrichtigungen
+
+Das System erzeugt an mehreren Stellen der verschiedenen Anwendungsteile unterschiedliche Nachrichten. Diese richten sich an unterschiedliche Zielgruppen. 
 
-## 5. Logfunktion
+## 6. Logfunktion
 
 Eine wesentliche Neuerung auf der Serverseite ist das Protokollieren des Programmablaufes und der verarbeiteten Daten mittels log4php. Dies unterstützt sowohl den Entwicklungsprozess, als auch die Fehlersuche im Produktivsystem.
 
-## 6. Releasemanagement
+## 7. Releasemanagement
 
 Jedes Jahr soll es eine Hauptversion geben. Dazwischen soll mindestens eine Zwischenversion erscheinen. Der Zweck der Zwischenversion ist, die "Must Have"-Anforderungen umzusetzen und Rückmeldungen der Anwender für die Hauptversion zu sammeln. Die nachfolgenden Zwischenversionen oder die Hauptversion setzen das Benutzer-Feedback um und ergänzen die Anwendung um Funktionen der Kategorie "Should Have" und "Nice To Have".
 

diff --git a/src/AblageType/Form.html b/src/AblageType/Form.html
@@ -18,13 +18,15 @@
 	<script type="text/javascript" src="../js/page.js"></script>
 	<!-- observer pattern data structure -->
 	<script type="text/javascript" src="../js/ui/GuiClient.js"></script>
+	<!-- model -->
+	<script type="text/javascript" src="../js/models/AblageType.js"></script>
 	<!-- web service client -->
 	<script type="text/javascript" src="../js/webServiceClients/WebServiceClient.js"></script>
 	<script type="text/javascript" src="../js/webServiceClients/WebServiceClientAblageType.js"></script>
 	<script type="text/javascript" src="../js/factories/webServiceClientFactory.js"></script>
 	<!-- view model -->
-	<script type="text/javascript" src="../js/viewModels/ViewModelList.js"></script>
-	<script type="text/javascript" src="../js/viewModels/ViewModelListAblageType.js"></script>
+	<script type="text/javascript" src="../js/viewModels/ViewModelForm.js"></script>
+	<script type="text/javascript" src="../js/viewModels/ViewModelFormAblageType.js"></script>
 	<script type="text/javascript" src="../js/factories/viewModelFactory.js"></script>
 	<!-- view -->
 	<script type="text/javascript" src="../js/views/AblageType/Form.js"></script>
@@ -53,11 +55,38 @@
 	<div id=navigation class="notToPrint"></div>
 	<div id=breadcrumb class="notToPrint"></div>
 	<div id=content>
-		<div class=form>
+		<div id=form class=form>
 			<div class=formBlock>
 				<h2>Formular</h2>
-				<div id=gridContainer></div>
+				<ul id=toolBar class=notToPrint>
+					<li><a id=buttonNew title=anlegen class=linkButton><i class="fas fa-plus"></i><label>Anlegen</label></a></li>
+					<li><a id=buttonSave title=speichern class=linkButton><i class="fas fa-save"></i><label>Speichern</label></a></li>
+					<li><a id=buttonUndo title="Änderungen verwerfen" class=linkButton><i class="fas fa-undo-alt"></i><label>Änderungen verwerfen</label></a></li>
+					<li><a id=buttonDelete title=löschen class="linkButton riskyAction"><i class="fas fa-trash-alt"></i><label>Löschen</label></a></li>
+					<li><a id=buttonToList title="Liste öffnen" class=linkButton><i class="fas fa-list"></i><label>Liste öffnen</label></a></li>
+				</ul>
+				<div id=divBezeichnung class=fieldBlock>
+					<div class=fieldDescription>
+						<i class="help notToPrint fas fa-question-circle" title="Bezeichnung des Ablagetypen. Dieser muss eindeutig sein."></i>
+						<label>Bezeichnung: </label>
+					</div>
+					<div class=fieldValue>
+						<div name="messages"></div>
+						<input id=textboxBezeichnung type=text class=field />
+					</div>
+				</div>
+				<div id=divCountOfAblagen class=fieldBlock>
+					<div class=fieldDescription>
+						<i class="help notToPrint fas fa-question-circle" title="Anzahl der Ablagen, die diesen Typ haben."></i>
+						<label>Anzahl von Ablagen: </label>
+					</div>
+					<div class=fieldValue>
+						<div name="messages"></div>
+						<label id=labelCountOfAblagen class=field></label>
+					</div>
+				</div>
 			</div>
+			<div id=dialogDelete title=Löschen class=dialog></div>
 		</div>
 	</div>
 </body>
diff --git a/src/AblageType/List.html b/src/AblageType/List.html
@@ -0,0 +1,71 @@
+<!doctype html>
+<html>
+
+<head>
+	<meta charset="utf-8">
+	<!-- javascript frameworks etc. -->
+	<script type="text/javascript" src="../js/jquery.min.js"></script>
+	<script type="text/javascript" src="../js/ui/jquery-ui/jquery-ui.js"></script>
+	<script type="text/javascript" src="../js/solid.min.js"></script>
+	<!-- controls -->
+	<script type="text/javascript" src="../js/controls/jsgrid/jsgrid.min.js"></script>
+	<script type="text/javascript" src="../js/controls/jsgrid/i18n/jsgrid-de.js"></script>
+	<script type="text/javascript" src="../js/controls/jquery.toast.min.js"></script>
+	<script type="text/javascript" src="../js/controls/control.Navigation.js"></script>
+	<script type="text/javascript" src="../js/controls/control.Breadcrumb.js"></script>
+	<script type="text/javascript" src="../js/controls/control.ErrorMessageBox.js"></script>
+	<!-- basic page functions -->
+	<script type="text/javascript" src="../js/page.js"></script>
+	<!-- observer pattern data structure -->
+	<script type="text/javascript" src="../js/ui/GuiClient.js"></script>
+	<!-- web service client -->
+	<script type="text/javascript" src="../js/webServiceClients/WebServiceClient.js"></script>
+	<script type="text/javascript" src="../js/webServiceClients/WebServiceClientAblageType.js"></script>
+	<script type="text/javascript" src="../js/factories/webServiceClientFactory.js"></script>
+	<!-- view model -->
+	<script type="text/javascript" src="../js/viewModels/ViewModelList.js"></script>
+	<script type="text/javascript" src="../js/viewModels/ViewModelListAblageType.js"></script>
+	<script type="text/javascript" src="../js/factories/viewModelFactory.js"></script>
+	<!-- view -->
+	<script type="text/javascript" src="../js/views/AblageType/List.js"></script>
+
+	<!-- javascript frameworks etc. -->
+	<link rel="stylesheet" type="text/css" href="../js/ui/jquery-ui/jquery-ui.css" />
+	<link rel="stylesheet" type="text/css" href="../css/solid.css" />
+	<link rel="stylesheet" type="text/css" href="../css/fontawesome.min.css" />
+	<!-- page -->
+	<link rel="stylesheet" type="text/css" href="../css/page.css" />
+	<!-- controls -->
+	<link rel="stylesheet" type="text/css" href="../js/controls/jsgrid/jsgrid.min.css" />
+	<link rel="stylesheet" type="text/css" href="../js/controls/jsgrid/jsgrid-theme.min.css" />
+	<link rel="stylesheet" type="text/css" href="../css/grid.css" />
+	<link rel="stylesheet" type="text/css" href="../css/jquery.toast.min.css" />
+	<link rel="stylesheet" type="text/css" href="../css/form.css" />
+	<link rel="stylesheet" type="text/css" href="../css/navigation.css" />
+	<link rel="stylesheet" type="text/css" href="../css/breadcrumb.css" />
+	<link rel="stylesheet" type="text/css" href="../css/clipboard.css" />
+	<!-- print -->
+	<link rel="stylesheet" type="text/css" href="../css/print.css" media="print" />
+	<link rel=icon type="image/png" href="../images/system/IconMunin_001.png">
+	<title>Ablagetyp</title>
+</head>
+
+<body>
+	<div id=navigation class="notToPrint"></div>
+	<div id=breadcrumb class="notToPrint"></div>
+	<div id=content>
+		<div class=form>
+			<div class=formBlock>
+				<h2>Liste</h2>
+				<ul id=toolBar>
+					<li><a id=buttonNew title=anlegen class=linkButton><i class="fas fa-plus"></i><label>Anlegen</label></a></li>
+					<li><a id=buttonEdit title=bearbeiten class=linkButton><i class="fas fa-edit"></i><label>Bearbeiten</label></a></li>
+					<li><a id=buttonDelete title=löschen class="linkButton riskyAction"><i class="fas fa-trash-alt"></i><label>Löschen</label></a></li>
+					<li><a id=buttonReload title="neu laden" class="linkButton"><i class="fas fa-sync-alt"></i><label>neu laden</label></a></li>
+				</ul>
+				<div id=gridContainer></div>
+			</div>
+			<div id=dialogDelete title=Löschen class=dialog></div>
+		</div>
+	</div>
+</body>
diff --git a/src/Fund/Form.html b/src/Fund/Form.html
@@ -73,6 +73,12 @@
 	<div id=content>
 		<div class=form>
 			<div class=formBlock>
+				<ul id=toolBar class=notToPrint>
+					<li><a id=buttonNew title=anlegen class=linkButton><i class="fas fa-plus"></i><label>Anlegen</label></a></li>
+					<li><a id=buttonSave title=speichern class=linkButton><i class="fas fa-save"></i><label>Speichern</label></a></li>
+					<li><a id=buttonUndo title="Änderungen verwerfen" class="linkButton"><i class="fas fa-undo-alt"></i><label>Änderungen verwerfen</label></a></li>
+					<li><a id=buttonDelete title=löschen class="linkButton riskyAction"><i class="fas fa-trash-alt"></i><label>Löschen</label></a></li>
+				</ul>
 				<div id=divFundAttribute class=fieldBlock>
 					<div class=fieldDescription>
 						<i class="help notToPrint fas fa-question-circle" title="Attribute, die den Fund beschreiben, z. B. Material, Zeitstellung oder Verzierung."></i>
@@ -166,12 +172,6 @@
 						<a id=buttonSelectAblage title="auswählen" class="notToPrint linkButton"><i class="fas fa-edit"></i></a>
 					</div>
 				</div>
-				<div class="buttonBlock notToPrint">
-					<input type=button id=buttonNew value=Neu />
-					<input type=button id=buttonSave value=Speichern />
-					<input type=button id=buttonUndo value="Änderungen verwerfen" />
-					<input type=button id=buttonDelete value=Löschen />
-				</div>
 			</div>
 		</div>
 		<div id=dialogSelectFundAttribut title="Fundattribut auswählen" class=dialog>

diff --git a/src/FundAttributType/Form.html b/src/FundAttributType/Form.html
@@ -1,5 +1,6 @@
 <!doctype html>
 <html>
+
 <head>
 	<meta charset="utf-8">
 	<!-- javascript frameworks etc. -->
@@ -17,17 +18,19 @@
 	<script type="text/javascript" src="../js/page.js"></script>
 	<!-- observer pattern data structure -->
 	<script type="text/javascript" src="../js/ui/GuiClient.js"></script>
+	<!-- model -->
+	<script type="text/javascript" src="../js/models/FundAttributType.js"></script>
 	<!-- web service client -->
 	<script type="text/javascript" src="../js/webServiceClients/WebServiceClient.js"></script>
 	<script type="text/javascript" src="../js/webServiceClients/WebServiceClientFundAttributType.js"></script>
 	<script type="text/javascript" src="../js/factories/webServiceClientFactory.js"></script>
 	<!-- view model -->
-	<script type="text/javascript" src="../js/viewModels/ViewModelList.js"></script>
-	<script type="text/javascript" src="../js/viewModels/ViewModelListFundAttributType.js"></script>
+	<script type="text/javascript" src="../js/viewModels/ViewModelForm.js"></script>
+	<script type="text/javascript" src="../js/viewModels/ViewModelFormFundAttributType.js"></script>
 	<script type="text/javascript" src="../js/factories/viewModelFactory.js"></script>
 	<!-- view -->
 	<script type="text/javascript" src="../js/views/FundAttributType/Form.js"></script>
-	
+
 	<!-- javascript frameworks etc. -->
 	<link rel="stylesheet" type="text/css" href="../js/ui/jquery-ui/jquery-ui.css" />
 	<link rel="stylesheet" type="text/css" href="../css/solid.css" />
@@ -47,15 +50,43 @@
 	<link rel=icon type="image/png" href="../images/system/IconMunin_001.png">
 	<title>Fundattributtyp</title>
 </head>
-<body>		
+
+<body>
 	<div id=navigation class="notToPrint"></div>
 	<div id=breadcrumb class="notToPrint"></div>
 	<div id=content>
-	    <div class=form>
-		    <div class=formBlock>
-                <h2>Formular</h2>
-                <div id=gridContainer></div>
+		<div id=form class=form>
+			<div class=formBlock>
+				<h2>Formular</h2>
+				<ul id=toolBar class=notToPrint>
+					<li><a id=buttonNew title=anlegen class=linkButton><i class="fas fa-plus"></i><label>Anlegen</label></a></li>
+					<li><a id=buttonSave title=speichern class=linkButton><i class="fas fa-save"></i><label>Speichern</label></a></li>
+					<li><a id=buttonUndo title="Änderungen verwerfen" class=linkButton><i class="fas fa-undo-alt"></i><label>Änderungen verwerfen</label></a></li>
+					<li><a id=buttonDelete title=löschen class="linkButton riskyAction"><i class="fas fa-trash-alt"></i><label>Löschen</label></a></li>
+					<li><a id=buttonToList title="Liste öffnen" class=linkButton><i class="fas fa-list"></i><label>Liste öffnen</label></a></li>
+				</ul>
+				<div id=divBezeichnung class=fieldBlock>
+					<div class=fieldDescription>
+						<i class="help notToPrint fas fa-question-circle" title="Bezeichnung des Fundattributtypen. Dieser muss eindeutig sein."></i>
+						<label>Bezeichnung: </label>
+					</div>
+					<div class=fieldValue>
+						<div name="messages"></div>
+						<input id=textboxBezeichnung type=text class=field />
+					</div>
+				</div>
+				<div id=divCountOfFundAttributen class=fieldBlock>
+					<div class=fieldDescription>
+						<i class="help notToPrint fas fa-question-circle" title="Anzahl der Fundattribute, die diesen Typ haben."></i>
+						<label>Anzahl von Fundattributen: </label>
+					</div>
+					<div class=fieldValue>
+						<div name="messages"></div>
+						<label id=labelCountOfFundAttributen class=field></label>
+					</div>
+				</div>
 			</div>
-        </div>
-    </div>
+			<div id=dialogDelete title=Löschen class=dialog></div>
+		</div>
+	</div>
 </body>
diff --git a/src/FundAttributType/List.html b/src/FundAttributType/List.html
@@ -0,0 +1,71 @@
+<!doctype html>
+<html>
+
+<head>
+	<meta charset="utf-8">
+	<!-- javascript frameworks etc. -->
+	<script type="text/javascript" src="../js/jquery.min.js"></script>
+	<script type="text/javascript" src="../js/ui/jquery-ui/jquery-ui.js"></script>
+	<script type="text/javascript" src="../js/solid.min.js"></script>
+	<!-- controls -->
+	<script type="text/javascript" src="../js/controls/jsgrid/jsgrid.min.js"></script>
+	<script type="text/javascript" src="../js/controls/jsgrid/i18n/jsgrid-de.js"></script>
+	<script type="text/javascript" src="../js/controls/jquery.toast.min.js"></script>
+	<script type="text/javascript" src="../js/controls/control.Navigation.js"></script>
+	<script type="text/javascript" src="../js/controls/control.Breadcrumb.js"></script>
+	<script type="text/javascript" src="../js/controls/control.ErrorMessageBox.js"></script>
+	<!-- basic page functions -->
+	<script type="text/javascript" src="../js/page.js"></script>
+	<!-- observer pattern data structure -->
+	<script type="text/javascript" src="../js/ui/GuiClient.js"></script>
+	<!-- web service client -->
+	<script type="text/javascript" src="../js/webServiceClients/WebServiceClient.js"></script>
+	<script type="text/javascript" src="../js/webServiceClients/WebServiceClientFundAttributType.js"></script>
+	<script type="text/javascript" src="../js/factories/webServiceClientFactory.js"></script>
+	<!-- view model -->
+	<script type="text/javascript" src="../js/viewModels/ViewModelList.js"></script>
+	<script type="text/javascript" src="../js/viewModels/ViewModelListFundAttributType.js"></script>
+	<script type="text/javascript" src="../js/factories/viewModelFactory.js"></script>
+	<!-- view -->
+	<script type="text/javascript" src="../js/views/FundAttributType/List.js"></script>
+
+	<!-- javascript frameworks etc. -->
+	<link rel="stylesheet" type="text/css" href="../js/ui/jquery-ui/jquery-ui.css" />
+	<link rel="stylesheet" type="text/css" href="../css/solid.css" />
+	<link rel="stylesheet" type="text/css" href="../css/fontawesome.min.css" />
+	<!-- page -->
+	<link rel="stylesheet" type="text/css" href="../css/page.css" />
+	<!-- controls -->
+	<link rel="stylesheet" type="text/css" href="../js/controls/jsgrid/jsgrid.min.css" />
+	<link rel="stylesheet" type="text/css" href="../js/controls/jsgrid/jsgrid-theme.min.css" />
+	<link rel="stylesheet" type="text/css" href="../css/grid.css" />
+	<link rel="stylesheet" type="text/css" href="../css/jquery.toast.min.css" />
+	<link rel="stylesheet" type="text/css" href="../css/form.css" />
+	<link rel="stylesheet" type="text/css" href="../css/navigation.css" />
+	<link rel="stylesheet" type="text/css" href="../css/breadcrumb.css" />
+	<link rel="stylesheet" type="text/css" href="../css/clipboard.css" />
+	<!-- print -->
+	<link rel="stylesheet" type="text/css" href="../css/print.css" media="print" />
+	<link rel=icon type="image/png" href="../images/system/IconMunin_001.png">
+	<title>Fundattributtyp</title>
+</head>
+
+<body>
+	<div id=navigation class="notToPrint"></div>
+	<div id=breadcrumb class="notToPrint"></div>
+	<div id=content>
+		<div class=form>
+			<div class=formBlock>
+				<h2>Liste</h2>
+				<ul id=toolBar>
+					<li><a id=buttonNew title=anlegen class=linkButton><i class="fas fa-plus"></i><label>Anlegen</label></a></li>
+					<li><a id=buttonEdit title=bearbeiten class=linkButton><i class="fas fa-edit"></i><label>Bearbeiten</label></a></li>
+					<li><a id=buttonDelete title=löschen class="linkButton riskyAction"><i class="fas fa-trash-alt"></i><label>Löschen</label></a></li>
+					<li><a id=buttonReload title="neu laden" class="linkButton"><i class="fas fa-sync-alt"></i><label>neu laden</label></a></li>
+				</ul>
+				<div id=gridContainer></div>
+			</div>
+			<div id=dialogDelete title=Löschen class=dialog></div>
+		</div>
+	</div>
+</body>