This repository has been archived by the owner on Jan 18, 2024. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathREADME.html
181 lines (181 loc) · 14.4 KB
/
README.html
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
<!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>
<style type="text/css">
div.sourceCode { overflow-x: auto; }
table.sourceCode, tr.sourceCode, td.lineNumbers, td.sourceCode {
margin: 0; padding: 0; vertical-align: baseline; border: none; }
table.sourceCode { width: 100%; line-height: 100%; }
td.lineNumbers { text-align: right; padding-right: 4px; padding-left: 4px; color: #aaaaaa; border-right: 1px solid #aaaaaa; }
td.sourceCode { padding-left: 5px; }
code > span.kw { color: #007020; font-weight: bold; } /* Keyword */
code > span.dt { color: #902000; } /* DataType */
code > span.dv { color: #40a070; } /* DecVal */
code > span.bn { color: #40a070; } /* BaseN */
code > span.fl { color: #40a070; } /* Float */
code > span.ch { color: #4070a0; } /* Char */
code > span.st { color: #4070a0; } /* String */
code > span.co { color: #60a0b0; font-style: italic; } /* Comment */
code > span.ot { color: #007020; } /* Other */
code > span.al { color: #ff0000; font-weight: bold; } /* Alert */
code > span.fu { color: #06287e; } /* Function */
code > span.er { color: #ff0000; font-weight: bold; } /* Error */
code > span.wa { color: #60a0b0; font-weight: bold; font-style: italic; } /* Warning */
code > span.cn { color: #880000; } /* Constant */
code > span.sc { color: #4070a0; } /* SpecialChar */
code > span.vs { color: #4070a0; } /* VerbatimString */
code > span.ss { color: #bb6688; } /* SpecialString */
code > span.im { } /* Import */
code > span.va { color: #19177c; } /* Variable */
code > span.cf { color: #007020; font-weight: bold; } /* ControlFlow */
code > span.op { color: #666666; } /* Operator */
code > span.bu { } /* BuiltIn */
code > span.ex { } /* Extension */
code > span.pp { color: #bc7a00; } /* Preprocessor */
code > span.at { color: #7d9029; } /* Attribute */
code > span.do { color: #ba2121; font-style: italic; } /* Documentation */
code > span.an { color: #60a0b0; font-weight: bold; font-style: italic; } /* Annotation */
code > span.cv { color: #60a0b0; font-weight: bold; font-style: italic; } /* CommentVar */
code > span.in { color: #60a0b0; font-weight: bold; font-style: italic; } /* Information */
</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="forum">Forum</h1>
<p>Dominik Hendrix (919866), David Riemann (917593) 9. November 2015</p>
<h2 id="unsere-lösung">Unsere Lösung</h2>
<p>Das Forum wurde mit Python umgesetzt. Wir benutzen das Framework "CherryPy", mit welchem wir mit wenig Aufwand einen funktionstüchtigen Webserver erzeugen und starten können. Daten werden in JSON-Dateien abgelegt und gespeichert.</p>
<p>Um eine effektive Lösung hinsichtlich der Präsentation zu ermöglichen, benutzen wir die Bibliothek "mako". Diese ermöglicht es Python-Code in den Präsentations-Dateien zu verwenden. Die Präsentations-Datei - welche verwendet wird - wird von "mako" ausgewertet und der enthaltene Python-Code wird ausgeführt.</p>
<p>Für die JavaScript-Entwicklung benutzen wir eine Bibliothek namens "jQuery". Diese Bibliothek stellt Methoden bereit, die verschiedenste JavaScript-Funktionen beinhalten, sodass komplexere Funktionalitäten mit weniger Aufwand ausgeführt werden können.</p>
<h2 id="komponenten">Komponenten</h2>
<p>Alle Komponenten sind sehr ähnlich aufgebaut. Sie unterscheiden sich lediglich von den Daten, mit denen die jeweilige Komponente arbeitet.</p>
<h3 id="benutzer">Benutzer</h3>
<h4 id="zweck">Zweck</h4>
<p>Diese Komponente dient der Benutzerverwaltung und Rechteverwaltung. Sie überprüft, ob ein Benutzer angemeldet ist oder ob der angemeldete Benutzer die nötigen Rechte für eine gewisse Aktion hat.</p>
<h4 id="aufbau">Aufbau</h4>
<p>Sie beinhaltet sowohl die Authentifizierung an sich als auch die Verarbeitung für die Präsentation.</p>
<p>Außerdem wird mit dieser Komponente der Benutzer dargestellt. Es werden alle Daten vom eingeloggten Benutzer hier hinterlegt.</p>
<h4 id="zusammenwirken">Zusammenwirken</h4>
<p>Da diese Komponente die Rechteverwaltung und Benutzerverwaltung beinhaltet, wird diese in jeder anderen Komponente benötigt.</p>
<h4 id="api">API</h4>
<h3 id="themen">Themen</h3>
<h4 id="zweck-1">Zweck</h4>
<p>Diese Komponente dient zur Verwaltung von Themen. Man kann damit Themen erstellen, bearbeiten oder löschen.</p>
<h4 id="aufbau-1">Aufbau</h4>
<p>Beinhaltet jeweils eine Methode für einen CRUD-Dialog.</p>
<h4 id="zusammenwirken-1">Zusammenwirken</h4>
<p>Themen werden für die Selektierung der richtigen Diskussionen verwendet.</p>
<h4 id="api-1">API</h4>
<h3 id="diskussionen">Diskussionen</h3>
<h4 id="zweck-2">Zweck</h4>
<p>Hiermit kann man verschiedenste Diskussionen erstellen, bearbeiten und löschen.</p>
<h4 id="aufbau-2">Aufbau</h4>
<p>Beinhaltet jeweils eine Methode für einen CRUD-Dialog.</p>
<h4 id="zusammenwirken-2">Zusammenwirken</h4>
<p>Um die richtigen Beiträge zu erhalten, wird diese Komponente benötigt.</p>
<h4 id="api-2">API</h4>
<h3 id="beiträge">Beiträge</h3>
<h4 id="zweck-3">Zweck</h4>
<p>Um Beiträge anzeigen zu lassen oder mit diesen verschiedene Aktionen auszuführen, benötigt man diese Komponente.</p>
<h4 id="aufbau-3">Aufbau</h4>
<p>Beinhaltet jeweils eine Methode für einen CRUD-Dialog.</p>
<h4 id="zusammenwirken-3">Zusammenwirken</h4>
<h4 id="api-3">API</h4>
<h3 id="datenbank">Datenbank</h3>
<h4 id="zweck-4">Zweck</h4>
<p>Das Datenbank-Objekt dient zur Erstellung, Speicherung, Änderung und Löschung aller Daten.</p>
<h4 id="aufbau-4">Aufbau</h4>
<p>Es wurden für alle verschiedenen Daten mehrere Funktionen eingefügt:</p>
<ul>
<li>Alle laden</li>
<li>Ein laden</li>
<li>Ein erstellen</li>
<li>Ein löschen</li>
<li>Ein speichern</li>
</ul>
<h4 id="funktionen">Funktionen</h4>
<p><strong>Daten laden</strong></p>
<div class="sourceCode"><pre class="sourceCode python"><code class="sourceCode python"><span class="bu">dict</span> load_user()</code></pre></div>
<p>Wird ohne Parameter aufgerufen. Man erhält ein JSON-Objekt, welches <a href="#benutzer-json">weiter unten</a> beschrieben wird.</p>
<div class="sourceCode"><pre class="sourceCode python"><code class="sourceCode python"><span class="bu">dict</span> load_thema(thema_id)</code></pre></div>
<p>Lädt ein Thema. Die Themen-ID (thema_id) muss dafür übergeben werden. <a href="#themen-json">JSON-Struktur</a></p>
<div class="sourceCode"><pre class="sourceCode python"><code class="sourceCode python"><span class="bu">dict</span> load_themen(doSort<span class="op">=</span><span class="va">True</span>)</code></pre></div>
<p>Lädt alle Themen, die in der JSON-Datei enthalten sind. Der zu übergebene Parameter gibt an, ob das zurückgegebene Dictionary sortiert zurückgegeben werden soll.</p>
<div class="sourceCode"><pre class="sourceCode python"><code class="sourceCode python">array<span class="op">|</span><span class="bu">dict</span> load_diskussionen(<span class="va">self</span>, themen_id<span class="op">=</span><span class="va">None</span>, doSort<span class="op">=</span><span class="va">True</span>)</code></pre></div>
<p>Lädt Diskussionen. Wenn der Parameter "themen_id" angegeben wird, werden nur Diskussionen vom Thema mit der Themen-ID geladen. Wenn "doSort" mit True angegeben wird, wird eine sortierte Liste erzeugt. Diese hat folgende Struktur:</p>
<div class="sourceCode"><pre class="sourceCode json"><code class="sourceCode json"><span class="ot">[</span><span class="er">(Diskussions-ID)</span> <span class="er">String</span><span class="ot">,</span> <span class="er">(JSON-Objekt)</span><span class="ot">]</span></code></pre></div>
<p>Der Eintrag mit dem Index "0" widerspiegelt die Diskussions-ID, der Eintrag mit dem Index "1" die eigentlichen Daten. Die Daten sind wie <a href="#diskussionen-json">unten beschrieben</a> strukturiert.</p>
<p>Wird der Parameter "doSort" auf false gesetzt, erhält man ein Dictionary, welches wie <a href="#diskussionen-json">unten beschrieben</a> strukturiert ist.</p>
<h3 id="ansicht">Ansicht</h3>
<h4 id="zweck-5">Zweck</h4>
<p>Dient lediglich zum rendern der nötigen Ausgabe.</p>
<h4 id="aufbau-5">Aufbau</h4>
<p>Eine Funktion pro Präsentation.</p>
<h4 id="zusammenwirken-4">Zusammenwirken</h4>
<p>Wird von den meisten Methoden benutzt, um eine Ausgabe zu erzeugen.</p>
<h4 id="api-4">API</h4>
<h2 id="datenablage">Datenablage</h2>
<p>Um unsere Daten zu speichern benutzen wir keine eigenständige Datenbank, sondern legen die Daten in Dateien ab. Die Daten werden zu einem JSON-String konvertiert und so in die jeweiligen Dateien abgelegt. Es sind 4 verschiedene Datein vorgesehen:</p>
<h3 id="benutzer-json">Benutzer</h3>
<p>In dieser Datei werden die Benutzer inkl. Rollen- und Rechtevergabe gespeichert. Als Index werden die Benutzernamen verwendet, da diese eindeutig sein müssen. Hinter diesem Index steckt ein JSON-Objekt, in dem per "Key-Value" jeweils die verschiedensten Eigenschaften gespeichert werden.</p>
<p>Dieses JSON-Objekt sieht folgendermaßen aus:</p>
<div class="sourceCode"><pre class="sourceCode json"><code class="sourceCode json"><span class="fu">{</span>
<span class="dt">"benutzername"</span><span class="fu">:</span> <span class="fu">{</span>
<span class="dt">"rolle"</span><span class="fu">:</span> <span class="er">String</span><span class="fu">,</span>
<span class="dt">"password"</span><span class="fu">:</span> <span class="er">String</span><span class="fu">,</span>
<span class="dt">"diskussionen"</span><span class="fu">:</span> <span class="er">Array</span>
<span class="fu">}</span>
<span class="fu">}</span></code></pre></div>
<p>In der Eigenschaft "diskussionen" ist ein Array vorzufinden, welches die IDs der Diskussionen beinhaltet, in der der Benutzer Beiträge bearbeiten und löschen kann.</p>
<h3 id="themen-json">Themen</h3>
<p>Die Themen werden mithilfe eines zweidimensionalen JSON-Objektes gespeichert. Hier dient die ID des Themas als Index, hinter dem wieder ein JSON-Objekt steckt, in dem wiederrum die nötigen Eigenschaften für das Thema als "Key-Value-Pairs" gespeichert werden.</p>
<p>Dieses JSON-Objekt sieht folgendermaßen aus:</p>
<div class="sourceCode"><pre class="sourceCode json"><code class="sourceCode json"><span class="fu">{</span>
<span class="dt">"id"</span><span class="fu">:</span> <span class="fu">{</span>
<span class="dt">"name"</span><span class="fu">:</span> <span class="er">String</span><span class="fu">,</span>
<span class="dt">"beschreibung"</span><span class="fu">:</span> <span class="er">String</span>
<span class="fu">}</span>
<span class="fu">}</span></code></pre></div>
<h3 id="diskussionen-json">Diskussionen</h3>
<p>Auch hier werden die Daten als JSON gespeichert. Hier findet man jedoch ein dreidimensionales JSON-Objekt. An oberster Stelle dienen die Themen-IDs als Index der Objekte, in denen die Diskussionen enthalten. Innerhalb eines Objektes ist es wie bei den Themen: Diskussion-IDs dienen als Indizes.</p>
<p>Dieses JSON-Objekt sieht folgendermaßen aus:</p>
<div class="sourceCode"><pre class="sourceCode json"><code class="sourceCode json"><span class="fu">{</span>
<span class="dt">"Themen-ID"</span><span class="fu">:</span> <span class="fu">{</span>
<span class="dt">"Diskussions-ID"</span><span class="fu">:</span> <span class="fu">{</span>
<span class="dt">"beschreibung"</span><span class="fu">:</span> <span class="er">String</span><span class="fu">,</span>
<span class="dt">"name"</span><span class="fu">:</span> <span class="er">String</span><span class="fu">,</span>
<span class="dt">"time"</span><span class="fu">:</span> <span class="er">Double</span>
<span class="fu">}</span>
<span class="fu">}</span>
<span class="fu">}</span></code></pre></div>
<h3 id="beitraege-json">Beiträge</h3>
<p>Die Beiträge werden wie die Diskussionen gespeichert. Allerdings liegen hier an oberster Stelle die Diskussions-IDs als Indizen. Tiefer in das Objekt hinein läuft es sich auf das Gleiche hinaus.</p>
<p>Dieses JSON-Objekt sieht folgendermaßen aus:</p>
<div class="sourceCode"><pre class="sourceCode json"><code class="sourceCode json"><span class="fu">{</span>
<span class="dt">"Diskussions-ID"</span><span class="fu">:</span> <span class="fu">{</span>
<span class="dt">"Beitrags-ID"</span><span class="fu">:</span> <span class="fu">{</span>
<span class="dt">"titel"</span><span class="fu">:</span> <span class="er">String</span><span class="fu">,</span>
<span class="dt">"user"</span><span class="fu">:</span> <span class="er">String</span><span class="fu">,</span>
<span class="dt">"text"</span><span class="fu">:</span> <span class="er">String</span><span class="fu">,</span>
<span class="dt">"time"</span><span class="fu">:</span> <span class="er">Double</span><span class="fu">,</span>
<span class="dt">"deleted"</span><span class="fu">:</span> <span class="er">Boolean</span>
<span class="fu">}</span>
<span class="fu">}</span>
<span class="fu">}</span></code></pre></div>
<h2 id="konfiguration">Konfiguration</h2>
<p>Jedes "Package" wurde manuell auf einen "Unterordner" gelinkt. So ist der "Unterordner" (hier nur im Link zu erkennen) "/themen" für jegliche Aktionen der Themen zuständig. Zusätlich wurden für die CSS- und JS-Dateien Routen definiert. So werden jegliche CSS-Dateien die mit "/css/*" eingebunden werden, auf den Ordner "content/css" geroutet. Analog dazu verhält es sich mit den JS-Dateien.</p>
<p>Weiterhin wurden (als statisch agierende) Objekte an das cherrypy-Objekt in der Eigenschaft "Application" gehangen.</p>
<h2 id="durchführung-und-ergebnisse-der-geforderten-prüfungen">Durchführung und Ergebnisse der geforderten Prüfungen</h2>
<h3 id="w3c-validator-html">W3C-Validator HTML</h3>
<p>Es wurden jegliche HTML-Ausgaben vom W3C-Validator überprüft und für korrekt empfunden</p>
<h3 id="w3c-validator-css">W3C-Validator CSS</h3>
<p>Es wurden jegliche CSS-Ausgaben vom W3C-Validator überprüft und für korrekt empfunden</p>
</body>
</html>