Prak1_Complete

Praktikum1_Kai/webteams/app/application.py

@@ -19,28 +19,33 @@ class Application_cl(object):
 
    
 	#-------------------------------------------------------
-	def index(self, form="NULL"): 
+	def index(self, form=None): 
 	#-------------------------------------------------------
 		if(form == "0"):
-			return self.createListAufz_p()
+			return self.createList_p(form)
 		elif(form == "1"):
-			return self.createList_p()
+			return self.createList_p(form)
-		elif(form == "NULL"):
+		elif(form == None):
-			return self.createList_p()
+			if (self.liste == 0):
+				self.liste = 1;
+				return self.createList_p("0")
+			else:
+				return self.createList_p("1")
 	@cherrypy.expose
 
 
 	#-------------------------------------------------------
-	def add(self): 
+	def add(self, form=None): 
 	#-------------------------------------------------------
-		return self.createForm_p()
+		
+		return self.createForm_p(form)
 	@cherrypy.expose
 
 
 	#-------------------------------------------------------
-	def edit(self, id): 
+	def edit(self, id, form=None): 
 	#-------------------------------------------------------
-		return self.createForm_p(id)
+		return self.createForm_p(form, id)
 	@cherrypy.expose
 
 
@@ -75,12 +80,12 @@ class Application_cl(object):
 
 
 	#-------------------------------------------------------
-	def delete(self, id): 
+	def delete(self, id, form=None): 
 	#-------------------------------------------------------
 		# Eintrag löschen, dann Liste neu anzeigen
 		self.db_o.delete_px(id)
-
+		print("Delete",form)
-		return self.createListAufz_p()
+		return self.createList_p(form)
 	@cherrypy.expose
 	
 
@@ -96,27 +101,17 @@ class Application_cl(object):
 
 
 	#-------------------------------------------------------
-	def createList_p(self): 
+	def createList_p(self, form): 
 	#-------------------------------------------------------
-		print("---------- List ----------")
 		data_o = self.db_o.read_px()
 		# mit diesen Daten Markup erzeugen 
+		print("List: ", form)
 
-		return self.view_o.createList_px(data_o)
+		return self.view_o.createList_px(data_o, form)
 
 
 	#-------------------------------------------------------
-	def createListAufz_p(self): 
+	def createForm_p(self, form, id_spl = None): 
-	#-------------------------------------------------------
-		print("---------- ListAufz ----------")
-		data_o = self.db_o.read_px()
-		# mit diesen Daten Markup erzeugen 
-
-		return self.view_o.createListAufz_px(data_o)	
-
-
-	#-------------------------------------------------------
-	def createForm_p(self, id_spl = None): 
 	#-------------------------------------------------------
 		if id_spl != None:
 			data_o = self.db_o.read_px(id_spl)
@@ -124,7 +119,7 @@ class Application_cl(object):
 			data_o = self.db_o.getDefault_px()
 		
 		# mit diesen Daten Markup erzeugen
-		return self.view_o.createForm_px(id_spl, data_o)
+		return self.view_o.createForm_px(id_spl, data_o, form)
 
 
 # EOF

Praktikum1_Kai/webteams/app/view.py

@@ -24,15 +24,15 @@ class View_cl(object):
 
 
 	#-------------------------------------------------------
-	def createList_px(self, data_opl): 
+	def createList_px(self, data_opl, form=None): 
 	#-------------------------------------------------------
 		# hier müsste noch eine Fehlerbehandlung ergänzt werden !
+		print("CreateList: ", form)
 		markup_s = ''
+		if (form == "0" or form == None):
 			markup_s += self.readFile_p('list0.tpl')
 			markupV_s = self.readFile_p('list1.tpl')
 			lineT_o = string.Template(markupV_s)
-		
-		# mehrfach nutzen, um die einzelnen Zeilen der Tabelle zu erzeugen 
 			for loop_i in range(0,15):
 				data_a = data_opl[str(loop_i)]
 				markup_s += lineT_o.safe_substitute (name1_s=data_a[0]
@@ -45,16 +45,10 @@ class View_cl(object):
 				,	semesteranzahl2_s=data_a[7]
 				,	id_s=str(loop_i)
 				)
-
 			markup_s += self.readFile_p('list2.tpl')
-
 			return markup_s
 
-	#-------------------------------------------------------
+		elif(form == "1"):
-	def createListAufz_px(self, data_opl): 
-	#-------------------------------------------------------
-		# hier müsste noch eine Fehlerbehandlung ergänzt werden !
-		markup_s = ''
 			markup_s += self.readFile_p('listaufz0.tpl')
 			markupV_s = self.readFile_p('listaufz1.tpl')
 			lineT_o = string.Template(markupV_s)
@@ -72,19 +66,21 @@ class View_cl(object):
 				,	semesteranzahl2_s=data_a[7]
 				,	id_s=str(loop_i)
 				)
-
 			markup_s += self.readFile_p('listaufz2.tpl')
-
 			return markup_s
 
 			
+		
+
+
 	#-------------------------------------------------------
-	def createForm_px(self, id_spl, data_opl): 
+	def createForm_px(self, id_spl, data_opl, form): 
 	#-------------------------------------------------------
 		# hier müsste noch eine Fehlerbehandlung ergänzt werden !
 		markup_s = ''
 		markup_s += self.readFile_p('form0.tpl')
 		markupV_s = self.readFile_p('form1.tpl')
+		markupV_s += self.readFile_p('form2.tpl')
 		lineT_o = string.Template(markupV_s)
 		markup_s += lineT_o.safe_substitute (name1_s=data_opl[0]
 		,	vorname1_s=data_opl[1]
@@ -95,8 +91,9 @@ class View_cl(object):
 		,	matrnr2_s=data_opl[6]
 		,	semesteranzahl2_s=data_opl[7]
 		,	id_s=id_spl
+		,	form_s=form
 		)
-		markup_s += self.readFile_p('form2.tpl')
+		
 
 		return markup_s
 

Praktikum1_Kai/webteams/content/webteams.js

@@ -9,6 +9,7 @@ function confirmDelete_p (event_opl) {
 		}
 		else
 		{
+			event_opl.preventDefault();
 			return false;
 		}
 	}

Praktikum1_Kai/webteams/data/webteams.json

@@ -1 +1 @@
-{"13": ["", "", "", "", "", "", "", ""], "12": ["", "", "", "", "", "", "", ""], "2": ["", "", "", "", "", "", "", ""], "7": ["", "", "", "", "", "", "", ""], "6": ["", "", "", "", "", "", "", ""], "0": ["", "", "", "", "", "", "", ""], "3": ["", "", "", "", "", "", "", ""], "5": ["", "", "", "", "", "", "", ""], "8": ["", "", "", "", "", "", "", ""], "11": ["", "", "", "", "", "", "", ""], "9": ["", "", "", "", "", "", "", ""], "10": ["", "", "", "", "", "", "", ""], "4": ["", "", "", "", "", "", "", ""], "1": ["", "", "", "", "", "", "", ""], "14": ["", "", "", "", "", "", "", ""]}
+{"9": ["", "", "", "", "", "", "", ""], "3": ["", "", "", "", "", "", "", ""], "11": ["", "", "", "", "", "", "", ""], "13": ["", "", "", "", "", "", "", ""], "2": ["", "", "", "", "", "", "", ""], "14": ["", "", "", "", "", "", "", ""], "10": ["", "", "", "", "", "", "", ""], "4": ["", "", "", "", "", "", "", ""], "8": ["", "", "", "", "", "", "", ""], "12": ["", "", "", "", "", "", "", ""], "0": ["", "", "", "", "", "", "", ""], "7": ["", "", "", "", "", "", "", ""], "6": ["", "", "", "", "", "", "", ""], "5": ["", "", "", "", "", "", "", ""], "1": ["", "", "", "", "", "", "", ""]}

Praktikum1_Kai/webteams/doc/Dokumentation- WEB Praktikum 1.html

@@ -0,0 +1,418 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+
+<meta charset="utf-8">
+<title>Dokumentation- WEB Praktikum 1</title>
+
+
+<style type="text/css">
+body {
+  font-family: Helvetica, arial, sans-serif;
+  font-size: 14px;
+  line-height: 1.6;
+  padding-top: 10px;
+  padding-bottom: 10px;
+  background-color: white;
+  padding: 30px; }
+
+body > *:first-child {
+  margin-top: 0 !important; }
+body > *:last-child {
+  margin-bottom: 0 !important; }
+
+a {
+  color: #4183C4; }
+a.absent {
+  color: #cc0000; }
+a.anchor {
+  display: block;
+  padding-left: 30px;
+  margin-left: -30px;
+  cursor: pointer;
+  position: absolute;
+  top: 0;
+  left: 0;
+  bottom: 0; }
+
+h1, h2, h3, h4, h5, h6 {
+  margin: 20px 0 10px;
+  padding: 0;
+  font-weight: bold;
+  -webkit-font-smoothing: antialiased;
+  cursor: text;
+  position: relative; }
+
+h1:hover a.anchor, h2:hover a.anchor, h3:hover a.anchor, h4:hover a.anchor, h5:hover a.anchor, h6:hover a.anchor {
+  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA09pVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoMTMuMCAyMDEyMDMwNS5tLjQxNSAyMDEyLzAzLzA1OjIxOjAwOjAwKSAgKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6OUM2NjlDQjI4ODBGMTFFMTg1ODlEODNERDJBRjUwQTQiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6OUM2NjlDQjM4ODBGMTFFMTg1ODlEODNERDJBRjUwQTQiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo5QzY2OUNCMDg4MEYxMUUxODU4OUQ4M0REMkFGNTBBNCIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo5QzY2OUNCMTg4MEYxMUUxODU4OUQ4M0REMkFGNTBBNCIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PsQhXeAAAABfSURBVHjaYvz//z8DJYCRUgMYQAbAMBQIAvEqkBQWXI6sHqwHiwG70TTBxGaiWwjCTGgOUgJiF1J8wMRAIUA34B4Q76HUBelAfJYSA0CuMIEaRP8wGIkGMA54bgQIMACAmkXJi0hKJQAAAABJRU5ErkJggg==) no-repeat 10px center;
+  text-decoration: none; }
+
+h1 tt, h1 code {
+  font-size: inherit; }
+
+h2 tt, h2 code {
+  font-size: inherit; }
+
+h3 tt, h3 code {
+  font-size: inherit; }
+
+h4 tt, h4 code {
+  font-size: inherit; }
+
+h5 tt, h5 code {
+  font-size: inherit; }
+
+h6 tt, h6 code {
+  font-size: inherit; }
+
+h1 {
+  font-size: 28px;
+  color: black; }
+
+h2 {
+  font-size: 24px;
+  border-bottom: 1px solid #cccccc;
+  color: black; }
+
+h3 {
+  font-size: 18px; }
+
+h4 {
+  font-size: 16px; }
+
+h5 {
+  font-size: 14px; }
+
+h6 {
+  color: #777777;
+  font-size: 14px; }
+
+p, blockquote, ul, ol, dl, li, table, pre {
+  margin: 15px 0; }
+
+hr {
+  background: transparent url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAECAYAAACtBE5DAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBNYWNpbnRvc2giIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6OENDRjNBN0E2NTZBMTFFMEI3QjRBODM4NzJDMjlGNDgiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6OENDRjNBN0I2NTZBMTFFMEI3QjRBODM4NzJDMjlGNDgiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo4Q0NGM0E3ODY1NkExMUUwQjdCNEE4Mzg3MkMyOUY0OCIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo4Q0NGM0E3OTY1NkExMUUwQjdCNEE4Mzg3MkMyOUY0OCIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PqqezsUAAAAfSURBVHjaYmRABcYwBiM2QSA4y4hNEKYDQxAEAAIMAHNGAzhkPOlYAAAAAElFTkSuQmCC) repeat-x 0 0;
+  border: 0 none;
+  color: #cccccc;
+  height: 4px;
+  padding: 0;
+}
+
+body > h2:first-child {
+  margin-top: 0;
+  padding-top: 0; }
+body > h1:first-child {
+  margin-top: 0;
+  padding-top: 0; }
+  body > h1:first-child + h2 {
+    margin-top: 0;
+    padding-top: 0; }
+body > h3:first-child, body > h4:first-child, body > h5:first-child, body > h6:first-child {
+  margin-top: 0;
+  padding-top: 0; }
+
+a:first-child h1, a:first-child h2, a:first-child h3, a:first-child h4, a:first-child h5, a:first-child h6 {
+  margin-top: 0;
+  padding-top: 0; }
+
+h1 p, h2 p, h3 p, h4 p, h5 p, h6 p {
+  margin-top: 0; }
+
+li p.first {
+  display: inline-block; }
+li {
+  margin: 0; }
+ul, ol {
+  padding-left: 30px; }
+
+ul :first-child, ol :first-child {
+  margin-top: 0; }
+
+dl {
+  padding: 0; }
+  dl dt {
+    font-size: 14px;
+    font-weight: bold;
+    font-style: italic;
+    padding: 0;
+    margin: 15px 0 5px; }
+    dl dt:first-child {
+      padding: 0; }
+    dl dt > :first-child {
+      margin-top: 0; }
+    dl dt > :last-child {
+      margin-bottom: 0; }
+  dl dd {
+    margin: 0 0 15px;
+    padding: 0 15px; }
+    dl dd > :first-child {
+      margin-top: 0; }
+    dl dd > :last-child {
+      margin-bottom: 0; }
+
+blockquote {
+  border-left: 4px solid #dddddd;
+  padding: 0 15px;
+  color: #777777; }
+  blockquote > :first-child {
+    margin-top: 0; }
+  blockquote > :last-child {
+    margin-bottom: 0; }
+
+table {
+  padding: 0;border-collapse: collapse; }
+  table tr {
+    border-top: 1px solid #cccccc;
+    background-color: white;
+    margin: 0;
+    padding: 0; }
+    table tr:nth-child(2n) {
+      background-color: #f8f8f8; }
+    table tr th {
+      font-weight: bold;
+      border: 1px solid #cccccc;
+      margin: 0;
+      padding: 6px 13px; }
+    table tr td {
+      border: 1px solid #cccccc;
+      margin: 0;
+      padding: 6px 13px; }
+    table tr th :first-child, table tr td :first-child {
+      margin-top: 0; }
+    table tr th :last-child, table tr td :last-child {
+      margin-bottom: 0; }
+
+img {
+  max-width: 100%; }
+
+span.frame {
+  display: block;
+  overflow: hidden; }
+  span.frame > span {
+    border: 1px solid #dddddd;
+    display: block;
+    float: left;
+    overflow: hidden;
+    margin: 13px 0 0;
+    padding: 7px;
+    width: auto; }
+  span.frame span img {
+    display: block;
+    float: left; }
+  span.frame span span {
+    clear: both;
+    color: #333333;
+    display: block;
+    padding: 5px 0 0; }
+span.align-center {
+  display: block;
+  overflow: hidden;
+  clear: both; }
+  span.align-center > span {
+    display: block;
+    overflow: hidden;
+    margin: 13px auto 0;
+    text-align: center; }
+  span.align-center span img {
+    margin: 0 auto;
+    text-align: center; }
+span.align-right {
+  display: block;
+  overflow: hidden;
+  clear: both; }
+  span.align-right > span {
+    display: block;
+    overflow: hidden;
+    margin: 13px 0 0;
+    text-align: right; }
+  span.align-right span img {
+    margin: 0;
+    text-align: right; }
+span.float-left {
+  display: block;
+  margin-right: 13px;
+  overflow: hidden;
+  float: left; }
+  span.float-left span {
+    margin: 13px 0 0; }
+span.float-right {
+  display: block;
+  margin-left: 13px;
+  overflow: hidden;
+  float: right; }
+  span.float-right > span {
+    display: block;
+    overflow: hidden;
+    margin: 13px auto 0;
+    text-align: right; }
+
+code, tt {
+  margin: 0 2px;
+  padding: 0 5px;
+  white-space: nowrap;
+  border: 1px solid #eaeaea;
+  background-color: #f8f8f8;
+  border-radius: 3px; }
+
+pre code {
+  margin: 0;
+  padding: 0;
+  white-space: pre;
+  border: none;
+  background: transparent; }
+
+.highlight pre {
+  background-color: #f8f8f8;
+  border: 1px solid #cccccc;
+  font-size: 13px;
+  line-height: 19px;
+  overflow: auto;
+  padding: 6px 10px;
+  border-radius: 3px; }
+
+pre {
+  background-color: #f8f8f8;
+  border: 1px solid #cccccc;
+  font-size: 13px;
+  line-height: 19px;
+  overflow: auto;
+  padding: 6px 10px;
+  border-radius: 3px; }
+  pre code, pre tt {
+    background-color: transparent;
+    border: none; }
+
+sup {
+    font-size: 0.83em;
+    vertical-align: super;
+    line-height: 0;
+}
+* {
+	-webkit-print-color-adjust: exact;
+}
+@media screen and (min-width: 914px) {
+    body {
+        width: 854px;
+        margin:0 auto;
+    }
+}
+@media print {
+	table, pre {
+		page-break-inside: avoid;
+	}
+	pre {
+		word-wrap: break-word;
+	}
+}
+</style>
+
+
+</head>
+
+<body>
+
+<h1 id="toc_0">Dokumentation: WEB Praktikum 1</h1>
+
+<h2 id="toc_1">Aufbau der Webanwendung</h2>
+
+<h3 id="toc_2">Varianten des Webclients</h3>
+
+<ul>
+<li>Variante 1: Liste Tabelle</li>
+<li>Variante 2: Liste als Aufzählung</li>
+<li>Variante 3: Formular zur Eingabe/Modifizierung</li>
+</ul>
+
+<h3 id="toc_3">Aufbau des Webservers</h3>
+
+<ul>
+<li>Server (Weiterleitung der Anfragen)
+
+<ul>
+<li>Application (Reaktion auf Web-Anfragen, Weiterleitung)
+
+<ul>
+<li>View (Verarbeiten der Templates mit übergebenen Variablen)</li>
+<li>Database (Verwaltung der abgespeicherten Werte)</li>
+</ul></li>
+</ul></li>
+</ul>
+
+<h2 id="toc_4">Durchgeführte Ergänzungen</h2>
+
+<ul>
+<li>Formulare:
+
+<ul>
+<li>hinzufügen von Semesteranzahl</li>
+<li>hinzufügen von zweiter Person</li>
+<li>Abbrechen</li>
+</ul></li>
+<li>CSS</li>
+<li>Löschen von Teams (mit Rückfrage JS)</li>
+<li>verschiedene Ansichten
+
+<ul>
+<li>Liste Tabelle</li>
+<li>Liste Aufzählung</li>
+<li>Modus wechsel</li>
+<li>History Funktion</li>
+</ul></li>
+</ul>
+
+<h2 id="toc_5">Beschreibung des HTTP-Datenverkehrs</h2>
+
+<h3 id="toc_6">beim Start der Anwendung</h3>
+
+<ul>
+<li>beim Aufruf der HTML-Seite, wird ohne weitere Angabe, die Anfrage an die Funktion Index in der application.py weitergeleitet</li>
+</ul>
+
+<h3 id="toc_7">bei Speichern von Formulardaten</h3>
+
+<ul>
+<li>Aufruf der Funktion &quot;save&quot; in der application.py</li>
+</ul>
+
+<h3 id="toc_8">verwenden Sie Screenshots der &quot;Netzwerkanalyse&quot; des Webbrowsers und geben Sie an:</h3>
+
+<ul>
+<li><img src="/Users/kai/sciebo/GitLab/WEB/Praktikum1_Kai/webteams/doc/startseite.png" alt="alt text"></li>
+<li>welche Anfragen an den Webserver geschickt werden (HTTP-Methode, URI, Inhalt der Anfrage
+
+<ul>
+<li>GET /</li>
+<li>GET webteams.js</li>
+<li>GET webteams.css<br></li>
+</ul></li>
+<li>welche Antworten der Webserver liefert (Inhalt beschreiben)
+
+<ul>
+<li>/
+
+<ul>
+<li>HTML</li>
+<li>stellt das Grundgerüst der Seite dar</li>
+</ul></li>
+<li>webteams.css
+
+<ul>
+<li>Inhalt der CSS-Datei</li>
+<li>beschreibt, wie die Seite dargestellt werden soll</li>
+</ul></li>
+<li>webteams.js
+
+<ul>
+<li>Inhalt der JavaScript-Datei</li>
+<li>beinhaltet Funktionen, die zur Laufzeit ausgeführt werden sollen</li>
+</ul></li>
+</ul></li>
+</ul>
+
+
+
+
+</body>
+
+</html>

Praktikum1_Kai/webteams/doc/Dokumentation- WEB Praktikum 1.md

@@ -0,0 +1,52 @@
+# Dokumentation: WEB Praktikum 1
+
+## Aufbau der Webanwendung
+### Varianten des Webclients
+- Variante 1: Liste Tabelle
+- Variante 2: Liste als Aufzählung
+- Variante 3: Formular zur Eingabe/Modifizierung
+
+### Aufbau des Webservers
+- Server (Weiterleitung der Anfragen)
+	- Application (Reaktion auf Web-Anfragen, Weiterleitung)
+		- View (Verarbeiten der Templates mit übergebenen Variablen)
+		- Database (Verwaltung der abgespeicherten Werte)
+
+## Durchgeführte Ergänzungen
+- Formulare:
+	- hinzufügen von Semesteranzahl
+	- hinzufügen von zweiter Person
+	- Abbrechen
+- CSS
+- Löschen von Teams (mit Rückfrage JS)
+- verschiedene Ansichten
+	- Liste Tabelle
+	- Liste Aufzählung
+	- Modus wechsel
+	- History Funktion
+
+## Beschreibung des HTTP-Datenverkehrs
+### beim Start der Anwendung
+- beim Aufruf der HTML-Seite, wird ohne weitere Angabe, die Anfrage an die Funktion Index in der application.py weitergeleitet
+
+
+### bei Speichern von Formulardaten
+- Aufruf der Funktion "save" in der application.py
+
+
+### verwenden Sie Screenshots der "Netzwerkanalyse" des Webbrowsers und geben Sie an:
+- ![alt text](/Users/kai/sciebo/GitLab/WEB/Praktikum1_Kai/webteams/doc/startseite.png)
+- welche Anfragen an den Webserver geschickt werden (HTTP-Methode, URI, Inhalt der Anfrage
+	- GET /
+	- GET webteams.js
+	- GET webteams.css	
+- welche Antworten der Webserver liefert (Inhalt beschreiben)
+	- /
+		- HTML
+		- stellt das Grundgerüst der Seite dar
+	- webteams.css
+		- Inhalt der CSS-Datei
+		- beschreibt, wie die Seite dargestellt werden soll
+	- webteams.js
+		- Inhalt der JavaScript-Datei
+		- beinhaltet Funktionen, die zur Laufzeit ausgeführt werden sollen

Praktikum1_Kai/webteams/doc/Dokumentation_Pandoc.html

@@ -0,0 +1,90 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="utf-8">
+  <meta name="generator" content="pandoc">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes">
+  <title></title>
+  <style type="text/css">code{white-space: pre;}</style>
+  <!--[if lt IE 9]>
+    <script src="//cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv-printshiv.min.js"></script>
+  <![endif]-->
+</head>
+<body>
+<h1 id="dokumentation-web-praktikum-1">Dokumentation: WEB Praktikum 1</h1>
+<h2 id="aufbau-der-webanwendung">Aufbau der Webanwendung</h2>
+<h3 id="varianten-des-webclients">Varianten des Webclients</h3>
+<ul>
+<li>Variante 1: Liste Tabelle</li>
+<li>Variante 2: Liste als Aufzählung</li>
+<li>Variante 3: Formular zur Eingabe/Modifizierung</li>
+</ul>
+<h3 id="aufbau-des-webservers">Aufbau des Webservers</h3>
+<ul>
+<li>Server (Weiterleitung der Anfragen)
+<ul>
+<li>Application (Reaktion auf Web-Anfragen, Weiterleitung)
+<ul>
+<li>View (Verarbeiten der Templates mit übergebenen Variablen)</li>
+<li>Database (Verwaltung der abgespeicherten Werte)</li>
+</ul></li>
+</ul></li>
+</ul>
+<h2 id="durchgeführte-ergänzungen">Durchgeführte Ergänzungen</h2>
+<ul>
+<li>Formulare:
+<ul>
+<li>hinzufügen von Semesteranzahl</li>
+<li>hinzufügen von zweiter Person</li>
+<li>Abbrechen</li>
+</ul></li>
+<li>CSS</li>
+<li>Löschen von Teams (mit Rückfrage JS)</li>
+<li>verschiedene Ansichten
+<ul>
+<li>Liste Tabelle</li>
+<li>Liste Aufzählung</li>
+<li>Modus wechsel</li>
+<li>History Funktion</li>
+</ul></li>
+</ul>
+<h2 id="beschreibung-des-http-datenverkehrs">Beschreibung des HTTP-Datenverkehrs</h2>
+<h3 id="beim-start-der-anwendung">beim Start der Anwendung</h3>
+<ul>
+<li>beim Aufruf der HTML-Seite, wird ohne weitere Angabe, die Anfrage an die Funktion Index in der application.py weitergeleitet</li>
+</ul>
+<h3 id="bei-speichern-von-formulardaten">bei Speichern von Formulardaten</h3>
+<ul>
+<li>Aufruf der Funktion &quot;save&quot; in der application.py</li>
+</ul>
+<h3 id="verwenden-sie-screenshots-der-netzwerkanalyse-des-webbrowsers-und-geben-sie-an">verwenden Sie Screenshots der &quot;Netzwerkanalyse&quot; des Webbrowsers und geben Sie an:</h3>
+<ul>
+<li><img src="/Users/kai/sciebo/GitLab/WEB/Praktikum1_Kai/webteams/doc/startseite.png" alt="alt text" /></li>
+<li>welche Anfragen an den Webserver geschickt werden (HTTP-Methode, URI, Inhalt der Anfrage
+<ul>
+<li>GET /</li>
+<li>GET webteams.js</li>
+<li>GET webteams.css<br />
+</li>
+</ul></li>
+<li>welche Antworten der Webserver liefert (Inhalt beschreiben)
+<ul>
+<li>/
+<ul>
+<li>HTML</li>
+<li>stellt das Grundgerüst der Seite dar</li>
+</ul></li>
+<li>webteams.css
+<ul>
+<li>Inhalt der CSS-Datei</li>
+<li>beschreibt, wie die Seite dargestellt werden soll</li>
+</ul></li>
+<li>webteams.js
+<ul>
+<li>Inhalt der JavaScript-Datei</li>
+<li>beinhaltet Funktionen, die zur Laufzeit ausgeführt werden sollen</li>
+</ul></li>
+</ul></li>
+</ul>
+</body>
+</html>

Praktikum1_Kai/webteams/template/form2.tpl

@@ -2,8 +2,7 @@
 				<input class="button" type="submit" value="Speichern" />
 			</div>
 		</form>
-		
+		<form id="idWTForm" action="/index/$form_s" method="POST">
-		<form id="idWTForm" action="/index" method="POST">
 			<div>
 				<input class="button" type="submit" value="Abbrechen" />
 			</div>

Praktikum1_Kai/webteams/template/list1.tpl

@@ -1,5 +1,5 @@
 			<tr> <!-- HIER müssen Sie eine Ergänzung vornehmen --> 
 				<td>$name1_s</td><td>$vorname1_s</td><td>$matrnr1_s</td><td>$semesteranzahl1_s</td>
 				<td>$name2_s</td><td>$vorname2_s</td><td>$matrnr2_s</td><td>$semesteranzahl2_s</td>
-				<td><a href="/edit/$id_s">bearbeiten</a>&nbsp;<a class="clDelete" href="/delete/$id_s">löschen</a></td>
+				<td><a href="/edit/$id_s/?form=0">bearbeiten</a>&nbsp;<a class="clDelete" href="/delete/$id_s/?form=0">löschen</a></td>
 			</tr>

Praktikum1_Kai/webteams/template/list2.tpl

@@ -1,7 +1,7 @@
 		</table>
 		<div>
-			<a href="/add">erfassen</a>
+			<a href="/add/?form=0">erfassen</a>
-			<a href="/?form=0">Ansicht</a>
+			<a href="/?form=1">Ansicht</a>
 		</div>
 	</body>
 </html>

Praktikum1_Kai/webteams/template/listaufz1.tpl

@@ -1,5 +1,5 @@
 			<!-- Sie müssen Ergänzungen vornehmen -->
-			<li>Gruppe $id_s: <a href="/edit/$id_s">bearbeiten</a>&nbsp; <a class="clDelete" href="/delete/$id_s">löschen</a> 
+			<li>Gruppe $id_s: <a href="/edit/$id_s/?form=1">bearbeiten</a>&nbsp; <a class="clDelete" href="/delete/$id_s/?form=1">löschen</a> 
 				<ul>
 					<li>$name1_s, $vorname1_s, $matrnr1_s, $semesteranzahl1_s</li>
 					<li>$name2_s, $vorname2_s, $matrnr2_s, $semesteranzahl2_s</li>

Praktikum1_Kai/webteams/template/listaufz2.tpl

@@ -1,7 +1,7 @@
 		</ul>
 		<div>
-			<a href="/add">erfassen</a>
+			<a href="/add/?form=1">erfassen</a>
-			<a href="/?form=1">Ansicht</a>
+			<a href="/?form=0">Ansicht</a>
 		</div>
 	</body>
 </html>