JS, Edit

Praktikum2/ppm1/static/functions.js

@@ -0,0 +1,23 @@
+var table = document.getElementById('idList');
+var selected = table.getElementsByClassName('selected');
+var selectedId = 'None';
+table.onclick = highlight;
+
+function select(category) {
+    var id = selectedId;
+    if (id == 'None')
+    {
+        alert("Kein Eintrag ausgewaehlt!");
+    }
+    else
+    {
+        window.location.href = '/detail/?cat=' + category + '&id=' + id;
+    }
+}
+
+function highlight(e) {
+   if (selected[0]) selected[0].className = '';
+   e.target.parentNode.className = 'selected';
+   var tr = e.target.parentNode;
+   selectedId = tr.getAttribute('id');
+}

Praktikum2/ppm1/static/style.css

@@ -0,0 +1,138 @@
+body {
+   font-family: "Open Sans", sans-serif;
+   font-size: 12pt;
+
+   padding: 0;
+   margin: 0;
+}
+
+.clSiteHeader {
+   position: absolute;
+   top: 0;
+   left: 0;
+   right: 0;
+   height: 100px;
+   line-height: 100px;
+   margin: 0;
+   padding: 5px;
+   font-size: 40pt;
+   text-align: center;
+   text-shadow:black 3px 2px;
+   font-family: cursive, fantasy;
+   color: #920B19;
+   background-color: #B6B6B7;
+}
+
+.clContent {
+   position: absolute;
+   top: 110px;  /* height, padding, border, margin von idSiteHeader beachten */
+   left: 0;
+   right: 0;
+   bottom: 0;
+   margin: 0;
+   padding: 5px;
+}
+
+.clContentHeader {
+   position: absolute;
+   top: 20px;
+   left: 0;
+   right: 0;
+   height: 30px;
+   line-height: 30px;
+   margin: 0;
+   padding: 5px;
+   font-size: 18pt;
+   text-align: center;
+}
+
+.clContentArea {
+   position: absolute;
+   top: 80px; /* height, padding, border, margin von idContentHeader beachten */
+   left: 0;
+   right: 0;
+   bottom: 40px;  /* height, padding, border, margin von idButtonArea beachten */
+   margin: 10px 0;
+   margin-left: 10px;
+   padding: 5px;
+}
+
+.clButtonArea {
+   position: absolute;
+   left: 0;
+   right: 0;
+   /*float: left; width: 10px:*/
+   bottom: 0;
+   height: 80px;
+   line-height: 80px;
+   margin: 0;
+   padding: 5px;
+   text-align: center;
+   background-color: #B6B6B7;
+}
+
+.clButtonArea a, input[type="submit"] {
+   margin: 0 5px;
+   padding: 3px 6px;
+   font-size: 14pt;
+   text-decoration: none;
+   border: 2px solid;
+   color: black;
+   background-color: buttonface;
+}
+
+.clButtonArea a:hover, a:visited, a:active {
+   color: black;
+}
+
+#idList {
+   table-layout: fixed;
+   width: auto;
+   border: 2px solid;
+   border-collapse: collapse;
+   margin:auto;
+}
+
+#idList th {
+   text-align: center;
+   padding-left: 5px;
+   background-color: #FFFFFF;
+}
+
+#idList th, #idList td {
+   padding: 3px;
+   border: 2px solid;
+   cursor: pointer;
+}
+
+#idForm .clContentArea {
+   width: 500px;
+   margin: auto;
+}
+
+.selected {
+    background-color: brown;
+    color: #FFF;
+}
+
+.clFormRow {
+   position: relative;
+   height: 30px;
+   margin-bottom: 10px;
+}
+
+.clFormRow label {
+   position: absolute;
+   top: 0;
+   left: 0;
+   width: 240px;
+   text-align: center;
+}
+
+.clFormRow input {
+   position: absolute;
+   top: 0;
+   left: 250px;
+   width: 250px;
+}
+/* EOF */