<commit_before><!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>iPlanningPoker</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<style>
@page {
    size: a4;
    margin: 30mm 20mm 40mm 25mm;

    @bottom-left {
        content: "iPlanningPoker";
        font-family: "Helvetica Neue", Helvetica, sans-serif;
        font-size: 1em;
        color: #aaa;
        padding-left: 3.75em;
    }

    @bottom-right {
        content: counter(page);
        font-family: "Helvetica Neue", Helvetica, sans-serif;
        font-size: 1em;
        color: #aaa;
    }

    @footnotes {
        margin-bottom: -13mm;
    }
}

html { 
    color: #333;
    font-size: 1em;
    line-height: 1.6;
    font-family: "Helvetica Neue", Helvetica, sans-serif;
    text-rendering: optimizeLegibility; 
}

footer {
    clear: both;
}

a {
  color: #333;
  text-decoration: none;
}

h1,
h2,
h3,
h4,
p,
figure figcaption,
figure.inline {
    clear: both;
    font-weight: normal;
    padding-left: 60px;
}

ul {
    padding-left: 40px;
}

h1 {
    font-size: 3em;
}

h2 {
    font-size: 2em;
}

h3 {
    font-size: 1.5em;
}

h4 {
    font-size: 1.25em;
}

p {
    font-size: 1em;
}

pre.code,
p.code {
    padding-left: 40px;
}

pre.code code,
p.code code {
    font-size: 0.7em;
    display: block;
    border-left: 1px solid #126396;
    padding: 0.5em 0 0.5em 19px;
    background-color: #f6f6f6;
}

ul li {
    padding-bottom: 1em;
}

table {
    border-collapse: collapse;
}

table td,
table th {
    padding: 0.2em 0.4em;
    border: 1px solid #ddd;
    font-size: 0.75em;
    text-align: left;
}

figure {
    padding: 1.5em 0;
    margin: 0;
}

figure img {
    max-width: 100%;
}

figure table {
    margin-bottom: 1em;
}

figure figcaption {
    font-size: 0.75em;
}

figure.inline figcaption {
    padding-left: 0;
}

a[href^="http"]:after {
    content: attr(href);
    float: footnote;
    margin-left: 60px;
    counter-increment: footnote;
    font-size: 0.75em;
    footnote-style-position: inside;
}

a[href^="http"]:after::footnote-call {
    content: " [" counter(footnote) "]";
    font-size: 1.3em;
}

a[href^="http"]:after::footnote-marker {
    content: "[" counter(footnote) "] ";
}

div.chapter {
    counter-increment: chapter;
    counter-reset: footnote;
    margin-top: 3em;
}

div.chapter h2 {
    padding-left: 0;
}

div.chapter h2:before {
    content: counter(chapter);
    width: 1.5em;
    padding-right: 0.375em;
    display: inline-block;
    text-align: right;
}

div.chapter h3 {
    counter-increment: sub-chapter;
    padding-left: 0;
}

div.chapter h3:before {
    content: counter(chapter) "." counter(sub-chapter);
    width: 2em;
    padding-right: 0.5em;
    display: inline-block;
    text-align: right;
}

h3.break,
div.chapter {
    page-break-before: always;
}

#front {
    page-break-after: always;
}

#front h1 {
    margin: 1em 0 0.5em 0;
}

#front .logo {
    display: none;
}

#front .screenshot {
    padding-top: 4em;
    padding-bottom: 0em;
    margin-left: -0.5em;
}

#front,
#second {
    margin-bottom: 3em;
}

#toc,
#toc ol,
#figures {
    list-style-type: none;
    padding: 0;
    margin: 0;
}

#toc > li {
    padding-bottom: 1em;
}

#toc a:after,
#figures a:after {
    content: " " leader(".") " " target-counter(attr(href), page);
}

#toc .chapter {
    display: inline-block;
    padding-left: 1em;
    padding-right: 0.75em;
    text-align: left;
    width: 2em;
}

#figure-aufwand table td:not(:first-child) {
    text-align: center;
}
    
#figure-aufwand table tr.total td {
    font-weight: bold;
}

@media screen {

    html {
        font-size: 0.8em;
    }

    body {
        margin: 3em 0 4em 0;
    }

    p {
        padding-right: 3em;
    }

    a {
        color: #1b60a7;
    }

    a[href^="http"]:after {
        display: none;
    }

    #front h1 {
        margin: 1em 0 0 0;
    }

    #front .logo {
        display: block;
        padding-bottom: 2em;
    }

    #front .screenshot {
        display: none;
    }

    #second,
    div.chapter {
        border-top: 1px solid #ddd;
    }

    pre.code code,
    p.code code {
        font-size: 0.9em;
    }
}

@media screen and (min-width: 40.5em) {

    html {
        font-size: 1em;
    }

    body {
        margin: 4em 3em 6em 3em;
    }

    #second,
    div.chapter {
        max-width: 40em;
    }

    #front {
        position: relative;
        top: -4em;
        left: -3em;
        width: 100%;
        padding: 4em 3em 2em 3em;
        margin-bottom: -4em;
    }

    #front h1 {
        margin: 1em 0 5.5em 0;
    }

    #front .logo {
        display: block;
        position: fixed;
        margin: 0;
        padding: 0;
        top: 4em;
        right: 4.5em;
        width: 50px;
        height: 50px;
        opacity: 0.1;
        -webkit-transition: opacity 0.5s linear;
        -moz-transition: opacity 0.5s linear;
    }

    #front:hover .logo {
        opacity: 1;
    }
}

</style>
<script>

function item(node, id, chapter, subChapter) {

    var li, a, spanChapter, spanTitle;

    node.setAttribute('id', id);

    li = document.createElement('li');

    a = document.createElement('a');
    a.setAttribute('href', '#' + id);

    chapter = '' + chapter;
    if (typeof subChapter != 'undefined') {
        chapter += '.' + subChapter;
    }

    spanChapter = document.createElement('span');
    spanChapter.setAttribute('class', 'chapter');
    spanChapter.appendChild(document.createTextNode(chapter));
    a.appendChild(spanChapter);

    spanTitle = document.createElement('span');
    spanTitle.setAttribute('class', 'title');
    spanTitle.appendChild(document.createTextNode(node.innerHTML));
    a.appendChild(spanTitle);

    li.appendChild(a);

    return li;
}

function toc() {

    var headers = document.getElementsByTagName('h2'),
        toc = document.getElementById('toc'),
        i, j, node, id, chapter, li, childs, ol;

    // skip first header (TOC)
    for (i = 1; i < headers.length; i++) {

        node = headers[i];
        id = 'chapter-' + i;
        li = item(node, id, i);

        childs = node.parentNode.getElementsByTagName("h3");
        ol = document.createElement('ol');

        for (j = 0; j < childs.length; j++) {

            node = childs[j];
            id = 'chapter-' + i + '-' + (j + 1);
            sli = item(node, id, i, j + 1);
            ol.appendChild(sli); 
        }

        li.appendChild(ol);
        toc.appendChild(li);
    }
}

function figures() {

    var captions = document.getElementsByTagName('figcaption'),
        figures = document.getElementById('figures'),
        i, caption, figure, li, a;

    for (i = 0; i < captions.length; i++) {

        caption = captions[i];
        figure = caption.parentNode;

        caption.innerHTML = 'Abb. ' + (i + 1) + ' ' + caption.innerHTML;

        li = document.createElement('li');

        a = document.createElement('a');
        a.setAttribute('href', '#' + figure.getAttribute('id'));

        a.appendChild(document.createTextNode(caption.textContent));

        li.appendChild(a);
        figures.appendChild(li); 
    }
}

function init() {

    figures();
    toc();
}

</script>
</head>
<body onload="init();">

<div id="front">
<p>
ZHAW Zürcher Hochschule für Angewandte Wissenschaften<br/>
Bachelorstudium Informatik<br/>
Semestarbeit<br/>
Dozent: <NAME><br/>
Frühlingssemester 2013
</p>
<h1>iPlanningPoker</h1>
<p class="logo">
<img src="" width="50" height="50" />
</p>
<p class="screenshot">
<img src="" width="207" height="410" />
</p>
<p>
<NAME>, <a href="mailto:<EMAIL>"><EMAIL></a><br/>
19. Juni 2013
</p>
</div>

<div id="second">
<h2>Inhaltsverzeichnis</h2>
<ol id="toc"></ol>
</div>

<div class="chapter">
<h2>Einleitung</h2>

<h3>Ausgangslage</h3>
<p>
Das Planning Poker ist ein Teilbestand der agilen Projektmethode Scrum. Viele Teams kennen die Probleme des Planning Pokers:
</p>
<ul>
    <li>Zu wenige Kartendecks sind vorhanden oder erst gar nicht auffindbar</li>
    <li>Das Timing beim Aufdecken der Karten stimmt nicht</li>
    <li>In einem grossen Raum kann es schwierig sein, die verschiedenen Werte der Karten von den Kollegen zu sehen.</li>
</ul>
<p>
Diese Punkte sollen mit der App angegangen werden um ein flüssigeres Ablaufen des Prozess zu fördern.
</p>

<h3>Ziele der Arbeit</h3>
<p>
Die Entwicklung einer universellen App. Dies erlaubt es die App sowohl auf dem iPhone wie auch auf dem iPad einzusetzen. Zur Unterstützung der Kommunikation zwischen den iPhones und dem iPad wird das Apple eigene Framework GameKit eingesetzt. Das Framework GameKit wird verwendet, da es bereits eine Grundlegende Funktion für die Verknüpfung von verschiedenen iOS Geräten bereitstellt.
</p>

<p>
Das vorrangige Ziel ist es mit der App eine unkomplizierte Verbindung und Kommunikation zwischen mehreren mobile Geräten erfolgreich umzusetzen.
</p>

<p>
Das iPad wird dabei als "Server" agieren und die Verbindung mit den iPhones aufbauen. Der User hat dann die Möglichkeit auf dem iPhone eine Karte auszuwählen. Die Karte wird dann verdeckt auf dem iPad angezeigt. Sobald alle User eine Karte gewählt haben, werden die Karten auf dem iPad aufgedeckt und eine neue Runde kann beginnen.
</p>

<h3>Aufgabenstellung</h3>
<p>Folgende Aufgabenstellungen wurden definiert:</p>
<ul>
    <li>Definition der Anforderungen der zu entwickelnden iOS App</li>
    <li>Analyse der GameKit API</li>
    <li>Definition des Netzwerkverkehrs</li>
    <li>Umsetzung einer universellen iOS App</li>
</ul>
</div>

<div class="chapter">
    <h2>Projektmanagement</h2>
    
    <h3>Projektplanung</h3>
    <p>
    Der folgende Projektplan gibt einen Überblick über den Ablauf des Projekts
    und dessen wichtigsten Meilensteine.
    </p>

    <figure id="figure-gantt">
    <table>
        <colgroup>
            <col width="160" />
            <col width="25" />
            <col width="25" />
            <col width="25" />
            <col width="25" />
            <col width="25" />
            <col width="25" />
            <col width="25" />
            <col width="25" />
            <col width="25" />
            <col width="25" />
            <col width="25" />
            <col width="25" />
            <col width="25" />
            <col width="25" />
            <col width="25" />
            <col width="25" />
            <col width="25" />
            <col width="25" />
            <col width="25" />
            <col width="25" />
        </colgroup>
        <thead>
            <tr>
                <th>&#160;</th>
                <th colspan="2">April</th>
                <th colspan="4">Mai</th>
                <th colspan="4">Juni</th>
                <th colspan="4">Juli</th>
                <th colspan="4">September</th>
                <th colspan="2">Oktober</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>Freigabe der Arbeit</td>
                <td colspan="4" style="border-left: 0;">◆ 19.04.13</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
            </tr>
            <tr>
                <td>Kick-Off-Meeting</td>
                <td>&#160;</td>
                <td colspan="4" style="border-left: 0;">◆ 25.04.13</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
            </tr>
            <tr>
                <td>Umsetzung</td>
                <td colspan="16" style="background-color: #e8f0f8;">&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
            </tr>
            <tr>
                <td>Dokumentation</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td colspan="15" style="background-color: #e8f0f8;">&#160;</td>
            </tr>
            <tr>
                <td>Design-Review</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td colspan="4" style="border-left: 0;">◆ ?</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
            </tr>
            <tr>
                <td>Abgabe der Arbeit</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td colspan="4" style="border-left: 0;">◆ 19.10.13</td>
            </tr>
            <tr>
                <td>Abschlusspräsentation</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td colspan="4" style="border-left: 0;">◆ ?</td>
            </tr>
        </tbody>
    </table>
    <figcaption>Projektplanung</figcaption>
    </figure>

    <h3 class="break">Aufwand</h3>

    <p>
    Laut <a href="https://ebs.zhaw.ch/files/ebs_files/Reglemente/Bachelor/Semesterarbeit/a_Reglement-Semesterarbeit_Studiengang-Informatik_V4.1.pdf">Reglement</a>
    sollte der Aufwand für die Fertigstellung der Semestarbeit mindestens
    120h betragen. Entsprechend wurde die Planung darauf ausgelegt.
    </p>

    <figure id="figure-aufwand" class="inline">
        <table>
            <colgroup>
                <col width="200" />
                <col width="100" />
                <col width="100" />
            </colgroup>
            <thead>
                <tr>
                    <th>Beschreibung</th>
                    <th>Soll</th>
                    <th>Ist</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td>Projekt aufsetzen</td>
                    <td>3h</td>
                    <td>2.5h</td>
                </tr>
                <tr>
                    <td>Kick-Of-Meeting</td>
                    <td>1h</td>
                    <td></td>
                </tr>
                <tr>
                    <td>Design-Review</td>
                    <td>3h</td>
                    <td></td>
                </tr>
                <tr>
                    <td>Schlusspräsentation</td>
                    <td>2h</td>
                    <td></td>
                </tr>
                <tr>
                    <td>Requirements Engineering iOS App</td>
                    <td>4h</td>
                    <td></td>
                </tr>
                <tr>
                    <td>Bearbeitung GameKit API</td>
                    <td>4h</td>
                    <td></td>
                </tr>
                <tr>
                    <td>Internetsuche nach GameKit</td>
                    <td>2h</td>
                    <td></td>
                </tr>
                <tr>
                    <td>Definition Netzwerkverkehrs</td>
                    <td>1h</td>
                    <td></td>
                </tr>
                <tr>
                    <td>Continuous Integration</td>
                    <td>2h</td>
                    <td></td>
                </tr>
                <tr>
                    <td>Integration GameKit in App</td>
                    <td>2h</td>
                    <td></td>
                </tr>
                <tr>
                    <td>Client/Server Kommunikation</td>
                    <td>20h</td>
                    <td></td>
                </tr>
                <tr>
                    <td>Client GUI</td>
                    <td>10h</td>
                    <td></td>
                </tr>
                <tr>
                    <td>Server GUI</td>
                    <td>10h</td>
                    <td></td>
                </tr>
                <tr>
                    <td>Testing</td>
                    <td>10h</td>
                    <td></td>
                </tr>
                <tr>
                    <td>Dokumentation</td>
                    <td>32h</td>
                    <td></td>
                </tr>
                <tr>
                    <td>Reserve</td>
                    <td>8h</td>
                    <td></td>
                </tr>
                <tr class="total">
                    <td>Total</td>
                    <td>120h</td>
                    <td>2.5h</td>
                </tr>
            </tbody>
        </table>
        <figcaption>Soll / Ist Vergleich Aufwand</figcaption>
    </figure>

    <h3>Dokumentation</h3>

    <p>
    Die Dokumentation wurde rein in HTML und CSS geschrieben. Das Inhalts- und das
    Abbildungsverzeichnis wurden dynamisch mit JavaScript generiert. Um die Seite
    auch korrekt ausdrucken zu können, wurde die Software
    <a href="http://www.princexml.com/">Prince</a> verwendet, welche HTML-Seiten
    in PDFs umwandelt. Dadurch konnte diese Dokumentation gleich wie der Source-Code
    der Applikation selbst mit der Versionverwaltungssoftware Git verwaltet und über
    den Online-Service <a href="https://github.com/">GitHub</a> geteilt werden.
    </p>
    
    <h3>Sourcecode</h3>
    
    <p>
    Der Sourcecode der iOS App ist ebenfalls mit der Versionsverwaltungssoftware
    Git verwaltet und kann über den Online-Service GitHub abgerufen werden.
    </p>
    
    <h3>Open Source</h3>
    <p>
        Es wurde entschieden den Sourcecode wie auch die Dokumentaion als Open Source
        zur Verfügung zu stellen. Als Lizenz wurde die <a href="https://raw.github.com/gabac/iPlanningPoker/master/LICENSE">MIT License</a> gewählt.
    </p>
</div>

<div class="chapter">
<h2>Planning Poker</h2>

<p>Planning Poker ist ein Schätzverfahren, welches in der agilen Projektmethode Scrum zum Einsatz kommt.</p>

<p>Mit Hilfe von Planning Poker wird die Komplexität von User Stories(Requirements) geschätzt. Das Schätzen
    wird mit Hilfe von Spielkarten erledigt. Diese haben typischerweise die Werte der Fibonacci Reihe:
    1, 2, 3, 5, 8, 13, 20, 40, 100. Optional gibt es noch Karten mit dem Wert 0, einem Fragezeichen(Unsicher)
    und einer Kaffeetasse(Pause). Die Fibonacci Reihe wurde gewählt, weil es schwieriger grosse komplexe
    User Stories zu schätzen.</p>

<p>Das Prinzip ist simpel. Jede User Story wird besprochen und offene Fragen werden untereinander geklärt.
    Sind keine weiteren Fragen mehr vorhanden entscheidet sich jeder Entwickler, verdeckt, für eine
    Spielkarte. Haben sich alle Entwickler für eine Karte entschieden werden diese gemeinsam aufgedeckt.
    Durch die verdeckte Karte wird der Einfluss von anderen Entwickler minimiert und es muss eine eigene
    Entscheidung gefallen werden.</p>
    
<figure id="figure-kartendeck" class="inline">
    <img src="images/CrispPlanningPokerDeck.jpg" />
    <figcaption>Beispielhaftes <a href="http://en.wikipedia.org/wiki/File:CrispPlanningPokerDeck.jpg">Kartendeck</a></figcaption>
</figure>

</div>

<div class="chapter">
<h2>Anforderungen an die iOS App</h2><commit_msg>Added links to github repos<commit_after><!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>iPlanningPoker</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<style>
@page {
    size: a4;
    margin: 30mm 20mm 40mm 25mm;

    @bottom-left {
        content: "iPlanningPoker";
        font-family: "Helvetica Neue", Helvetica, sans-serif;
        font-size: 1em;
        color: #aaa;
        padding-left: 3.75em;
    }

    @bottom-right {
        content: counter(page);
        font-family: "Helvetica Neue", Helvetica, sans-serif;
        font-size: 1em;
        color: #aaa;
    }

    @footnotes {
        margin-bottom: -13mm;
    }
}

html { 
    color: #333;
    font-size: 1em;
    line-height: 1.6;
    font-family: "Helvetica Neue", Helvetica, sans-serif;
    text-rendering: optimizeLegibility; 
}

footer {
    clear: both;
}

a {
  color: #333;
  text-decoration: none;
}

h1,
h2,
h3,
h4,
p,
figure figcaption,
figure.inline {
    clear: both;
    font-weight: normal;
    padding-left: 60px;
}

ul {
    padding-left: 40px;
}

h1 {
    font-size: 3em;
}

h2 {
    font-size: 2em;
}

h3 {
    font-size: 1.5em;
}

h4 {
    font-size: 1.25em;
}

p {
    font-size: 1em;
}

pre.code,
p.code {
    padding-left: 40px;
}

pre.code code,
p.code code {
    font-size: 0.7em;
    display: block;
    border-left: 1px solid #126396;
    padding: 0.5em 0 0.5em 19px;
    background-color: #f6f6f6;
}

ul li {
    padding-bottom: 1em;
}

table {
    border-collapse: collapse;
}

table td,
table th {
    padding: 0.2em 0.4em;
    border: 1px solid #ddd;
    font-size: 0.75em;
    text-align: left;
}

figure {
    padding: 1.5em 0;
    margin: 0;
}

figure img {
    max-width: 100%;
}

figure table {
    margin-bottom: 1em;
}

figure figcaption {
    font-size: 0.75em;
}

figure.inline figcaption {
    padding-left: 0;
}

a[href^="http"]:after {
    content: attr(href);
    float: footnote;
    margin-left: 60px;
    counter-increment: footnote;
    font-size: 0.75em;
    footnote-style-position: inside;
}

a[href^="http"]:after::footnote-call {
    content: " [" counter(footnote) "]";
    font-size: 1.3em;
}

a[href^="http"]:after::footnote-marker {
    content: "[" counter(footnote) "] ";
}

div.chapter {
    counter-increment: chapter;
    counter-reset: footnote;
    margin-top: 3em;
}

div.chapter h2 {
    padding-left: 0;
}

div.chapter h2:before {
    content: counter(chapter);
    width: 1.5em;
    padding-right: 0.375em;
    display: inline-block;
    text-align: right;
}

div.chapter h3 {
    counter-increment: sub-chapter;
    padding-left: 0;
}

div.chapter h3:before {
    content: counter(chapter) "." counter(sub-chapter);
    width: 2em;
    padding-right: 0.5em;
    display: inline-block;
    text-align: right;
}

h3.break,
div.chapter {
    page-break-before: always;
}

#front {
    page-break-after: always;
}

#front h1 {
    margin: 1em 0 0.5em 0;
}

#front .logo {
    display: none;
}

#front .screenshot {
    padding-top: 4em;
    padding-bottom: 0em;
    margin-left: -0.5em;
}

#front,
#second {
    margin-bottom: 3em;
}

#toc,
#toc ol,
#figures {
    list-style-type: none;
    padding: 0;
    margin: 0;
}

#toc > li {
    padding-bottom: 1em;
}

#toc a:after,
#figures a:after {
    content: " " leader(".") " " target-counter(attr(href), page);
}

#toc .chapter {
    display: inline-block;
    padding-left: 1em;
    padding-right: 0.75em;
    text-align: left;
    width: 2em;
}

#figure-aufwand table td:not(:first-child) {
    text-align: center;
}
    
#figure-aufwand table tr.total td {
    font-weight: bold;
}

@media screen {

    html {
        font-size: 0.8em;
    }

    body {
        margin: 3em 0 4em 0;
    }

    p {
        padding-right: 3em;
    }

    a {
        color: #1b60a7;
    }

    a[href^="http"]:after {
        display: none;
    }

    #front h1 {
        margin: 1em 0 0 0;
    }

    #front .logo {
        display: block;
        padding-bottom: 2em;
    }

    #front .screenshot {
        display: none;
    }

    #second,
    div.chapter {
        border-top: 1px solid #ddd;
    }

    pre.code code,
    p.code code {
        font-size: 0.9em;
    }
}

@media screen and (min-width: 40.5em) {

    html {
        font-size: 1em;
    }

    body {
        margin: 4em 3em 6em 3em;
    }

    #second,
    div.chapter {
        max-width: 40em;
    }

    #front {
        position: relative;
        top: -4em;
        left: -3em;
        width: 100%;
        padding: 4em 3em 2em 3em;
        margin-bottom: -4em;
    }

    #front h1 {
        margin: 1em 0 5.5em 0;
    }

    #front .logo {
        display: block;
        position: fixed;
        margin: 0;
        padding: 0;
        top: 4em;
        right: 4.5em;
        width: 50px;
        height: 50px;
        opacity: 0.1;
        -webkit-transition: opacity 0.5s linear;
        -moz-transition: opacity 0.5s linear;
    }

    #front:hover .logo {
        opacity: 1;
    }
}

</style>
<script>

function item(node, id, chapter, subChapter) {

    var li, a, spanChapter, spanTitle;

    node.setAttribute('id', id);

    li = document.createElement('li');

    a = document.createElement('a');
    a.setAttribute('href', '#' + id);

    chapter = '' + chapter;
    if (typeof subChapter != 'undefined') {
        chapter += '.' + subChapter;
    }

    spanChapter = document.createElement('span');
    spanChapter.setAttribute('class', 'chapter');
    spanChapter.appendChild(document.createTextNode(chapter));
    a.appendChild(spanChapter);

    spanTitle = document.createElement('span');
    spanTitle.setAttribute('class', 'title');
    spanTitle.appendChild(document.createTextNode(node.innerHTML));
    a.appendChild(spanTitle);

    li.appendChild(a);

    return li;
}

function toc() {

    var headers = document.getElementsByTagName('h2'),
        toc = document.getElementById('toc'),
        i, j, node, id, chapter, li, childs, ol;

    // skip first header (TOC)
    for (i = 1; i < headers.length; i++) {

        node = headers[i];
        id = 'chapter-' + i;
        li = item(node, id, i);

        childs = node.parentNode.getElementsByTagName("h3");
        ol = document.createElement('ol');

        for (j = 0; j < childs.length; j++) {

            node = childs[j];
            id = 'chapter-' + i + '-' + (j + 1);
            sli = item(node, id, i, j + 1);
            ol.appendChild(sli); 
        }

        li.appendChild(ol);
        toc.appendChild(li);
    }
}

function figures() {

    var captions = document.getElementsByTagName('figcaption'),
        figures = document.getElementById('figures'),
        i, caption, figure, li, a;

    for (i = 0; i < captions.length; i++) {

        caption = captions[i];
        figure = caption.parentNode;

        caption.innerHTML = 'Abb. ' + (i + 1) + ' ' + caption.innerHTML;

        li = document.createElement('li');

        a = document.createElement('a');
        a.setAttribute('href', '#' + figure.getAttribute('id'));

        a.appendChild(document.createTextNode(caption.textContent));

        li.appendChild(a);
        figures.appendChild(li); 
    }
}

function init() {

    figures();
    toc();
}

</script>
</head>
<body onload="init();">

<div id="front">
<p>
ZHAW Zürcher Hochschule für Angewandte Wissenschaften<br/>
Bachelorstudium Informatik<br/>
Semestarbeit<br/>
Dozent: <NAME><br/>
Frühlingssemester 2013
</p>
<h1>iPlanningPoker</h1>
<p class="logo">
<img src="" width="50" height="50" />
</p>
<p class="screenshot">
<img src="" width="207" height="410" />
</p>
<p>
<NAME>, <a href="mailto:<EMAIL>"><EMAIL></a><br/>
19. Juni 2013
</p>
</div>

<div id="second">
<h2>Inhaltsverzeichnis</h2>
<ol id="toc"></ol>
</div>

<div class="chapter">
<h2>Einleitung</h2>

<h3>Ausgangslage</h3>
<p>
Das Planning Poker ist ein Teilbestand der agilen Projektmethode Scrum. Viele Teams kennen die Probleme des Planning Pokers:
</p>
<ul>
    <li>Zu wenige Kartendecks sind vorhanden oder erst gar nicht auffindbar</li>
    <li>Das Timing beim Aufdecken der Karten stimmt nicht</li>
    <li>In einem grossen Raum kann es schwierig sein, die verschiedenen Werte der Karten von den Kollegen zu sehen.</li>
</ul>
<p>
Diese Punkte sollen mit der App angegangen werden um ein flüssigeres Ablaufen des Prozess zu fördern.
</p>

<h3>Ziele der Arbeit</h3>
<p>
Die Entwicklung einer universellen App. Dies erlaubt es die App sowohl auf dem iPhone wie auch auf dem iPad einzusetzen. Zur Unterstützung der Kommunikation zwischen den iPhones und dem iPad wird das Apple eigene Framework GameKit eingesetzt. Das Framework GameKit wird verwendet, da es bereits eine Grundlegende Funktion für die Verknüpfung von verschiedenen iOS Geräten bereitstellt.
</p>

<p>
Das vorrangige Ziel ist es mit der App eine unkomplizierte Verbindung und Kommunikation zwischen mehreren mobile Geräten erfolgreich umzusetzen.
</p>

<p>
Das iPad wird dabei als "Server" agieren und die Verbindung mit den iPhones aufbauen. Der User hat dann die Möglichkeit auf dem iPhone eine Karte auszuwählen. Die Karte wird dann verdeckt auf dem iPad angezeigt. Sobald alle User eine Karte gewählt haben, werden die Karten auf dem iPad aufgedeckt und eine neue Runde kann beginnen.
</p>

<h3>Aufgabenstellung</h3>
<p>Folgende Aufgabenstellungen wurden definiert:</p>
<ul>
    <li>Definition der Anforderungen der zu entwickelnden iOS App</li>
    <li>Analyse der GameKit API</li>
    <li>Definition des Netzwerkverkehrs</li>
    <li>Umsetzung einer universellen iOS App</li>
</ul>
</div>

<div class="chapter">
    <h2>Projektmanagement</h2>
    
    <h3>Projektplanung</h3>
    <p>
    Der folgende Projektplan gibt einen Überblick über den Ablauf des Projekts
    und dessen wichtigsten Meilensteine.
    </p>

    <figure id="figure-gantt">
    <table>
        <colgroup>
            <col width="160" />
            <col width="25" />
            <col width="25" />
            <col width="25" />
            <col width="25" />
            <col width="25" />
            <col width="25" />
            <col width="25" />
            <col width="25" />
            <col width="25" />
            <col width="25" />
            <col width="25" />
            <col width="25" />
            <col width="25" />
            <col width="25" />
            <col width="25" />
            <col width="25" />
            <col width="25" />
            <col width="25" />
            <col width="25" />
            <col width="25" />
        </colgroup>
        <thead>
            <tr>
                <th>&#160;</th>
                <th colspan="2">April</th>
                <th colspan="4">Mai</th>
                <th colspan="4">Juni</th>
                <th colspan="4">Juli</th>
                <th colspan="4">September</th>
                <th colspan="2">Oktober</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>Freigabe der Arbeit</td>
                <td colspan="4" style="border-left: 0;">◆ 19.04.13</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
            </tr>
            <tr>
                <td>Kick-Off-Meeting</td>
                <td>&#160;</td>
                <td colspan="4" style="border-left: 0;">◆ 25.04.13</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
            </tr>
            <tr>
                <td>Umsetzung</td>
                <td colspan="16" style="background-color: #e8f0f8;">&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
            </tr>
            <tr>
                <td>Dokumentation</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td colspan="15" style="background-color: #e8f0f8;">&#160;</td>
            </tr>
            <tr>
                <td>Design-Review</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td colspan="4" style="border-left: 0;">◆ ?</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
            </tr>
            <tr>
                <td>Abgabe der Arbeit</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td colspan="4" style="border-left: 0;">◆ 19.10.13</td>
            </tr>
            <tr>
                <td>Abschlusspräsentation</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td>&#160;</td>
                <td colspan="4" style="border-left: 0;">◆ ?</td>
            </tr>
        </tbody>
    </table>
    <figcaption>Projektplanung</figcaption>
    </figure>

    <h3 class="break">Aufwand</h3>

    <p>
    Laut <a href="https://ebs.zhaw.ch/files/ebs_files/Reglemente/Bachelor/Semesterarbeit/a_Reglement-Semesterarbeit_Studiengang-Informatik_V4.1.pdf">Reglement</a>
    sollte der Aufwand für die Fertigstellung der Semestarbeit mindestens
    120h betragen. Entsprechend wurde die Planung darauf ausgelegt.
    </p>

    <figure id="figure-aufwand" class="inline">
        <table>
            <colgroup>
                <col width="200" />
                <col width="100" />
                <col width="100" />
            </colgroup>
            <thead>
                <tr>
                    <th>Beschreibung</th>
                    <th>Soll</th>
                    <th>Ist</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td>Projekt aufsetzen</td>
                    <td>3h</td>
                    <td>2.5h</td>
                </tr>
                <tr>
                    <td>Kick-Of-Meeting</td>
                    <td>1h</td>
                    <td></td>
                </tr>
                <tr>
                    <td>Design-Review</td>
                    <td>3h</td>
                    <td></td>
                </tr>
                <tr>
                    <td>Schlusspräsentation</td>
                    <td>2h</td>
                    <td></td>
                </tr>
                <tr>
                    <td>Requirements Engineering iOS App</td>
                    <td>4h</td>
                    <td></td>
                </tr>
                <tr>
                    <td>Bearbeitung GameKit API</td>
                    <td>4h</td>
                    <td></td>
                </tr>
                <tr>
                    <td>Internetsuche nach GameKit</td>
                    <td>2h</td>
                    <td></td>
                </tr>
                <tr>
                    <td>Definition Netzwerkverkehrs</td>
                    <td>1h</td>
                    <td></td>
                </tr>
                <tr>
                    <td>Continuous Integration</td>
                    <td>2h</td>
                    <td></td>
                </tr>
                <tr>
                    <td>Integration GameKit in App</td>
                    <td>2h</td>
                    <td></td>
                </tr>
                <tr>
                    <td>Client/Server Kommunikation</td>
                    <td>20h</td>
                    <td></td>
                </tr>
                <tr>
                    <td>Client GUI</td>
                    <td>10h</td>
                    <td></td>
                </tr>
                <tr>
                    <td>Server GUI</td>
                    <td>10h</td>
                    <td></td>
                </tr>
                <tr>
                    <td>Testing</td>
                    <td>10h</td>
                    <td></td>
                </tr>
                <tr>
                    <td>Dokumentation</td>
                    <td>32h</td>
                    <td></td>
                </tr>
                <tr>
                    <td>Reserve</td>
                    <td>8h</td>
                    <td></td>
                </tr>
                <tr class="total">
                    <td>Total</td>
                    <td>120h</td>
                    <td>2.5h</td>
                </tr>
            </tbody>
        </table>
        <figcaption>Soll / Ist Vergleich Aufwand</figcaption>
    </figure>

    <h3>Dokumentation</h3>

    <p>
    Die Dokumentation wurde rein in HTML und CSS geschrieben. Das Inhalts- und das
    Abbildungsverzeichnis wurden dynamisch mit JavaScript generiert. Um die Seite
    auch korrekt ausdrucken zu können, wurde die Software
    <a href="http://www.princexml.com/">Prince</a> verwendet, welche HTML-Seiten
    in PDFs umwandelt. Dadurch konnte diese Dokumentation gleich wie der Source-Code
    der Applikation selbst mit der Versionverwaltungssoftware Git verwaltet und über
    den Online-Service <a href="https://github.com/">GitHub</a> geteilt werden.
    </p>
    
    <h3>Sourcecode</h3>
    
    <p>
    Der Sourcecode der iOS App ist ebenfalls mit der Versionsverwaltungssoftware
    Git verwaltet und kann über den Online-Service GitHub abgerufen werden.
    </p>
    
    <h3>Open Source</h3>
    <p>
        Es wurde entschieden den Sourcecode wie auch die Dokumentaion als Open Source
        zur Verfügung zu stellen. Als Lizenz wurde die <a href="https://raw.github.com/gabac/iPlanningPoker/master/LICENSE">MIT License</a> gewählt.
    </p>
    <p>
        Die GitHub Repositories sind unter diesen zwei Adressen zu finden:
    </p>
    <ul>
        <li>iOS App: <a href="https://github.com/gabac/iPlanningPoker">https://github.com/gabac/iPlanningPoker</a></li>
        <li>Dokumentation: <a href="https://github.com/gabac/iPlanningPoker-doc">https://github.com/gabac/iPlanningPoker-doc</a></li>
    </ul>
    
</div>

<div class="chapter">
<h2>Planning Poker</h2>

<p>Planning Poker ist ein Schätzverfahren, welches in der agilen Projektmethode Scrum zum Einsatz kommt.</p>

<p>Mit Hilfe von Planning Poker wird die Komplexität von User Stories(Requirements) geschätzt. Das Schätzen
    wird mit Hilfe von Spielkarten erledigt. Diese haben typischerweise die Werte der Fibonacci Reihe:
    1, 2, 3, 5, 8, 13, 20, 40, 100. Optional gibt es noch Karten mit dem Wert 0, einem Fragezeichen(Unsicher)
    und einer Kaffeetasse(Pause). Die Fibonacci Reihe wurde gewählt, weil es schwieriger grosse komplexe
    User Stories zu schätzen.</p>

<p>Das Prinzip ist simpel. Jede User Story wird besprochen und offene Fragen werden untereinander geklärt.
    Sind keine weiteren Fragen mehr vorhanden entscheidet sich jeder Entwickler, verdeckt, für eine
    Spielkarte. Haben sich alle Entwickler für eine Karte entschieden werden diese gemeinsam aufgedeckt.
    Durch die verdeckte Karte wird der Einfluss von anderen Entwickler minimiert und es muss eine eigene
    Entscheidung gefallen werden.</p>
    
<figure id="figure-kartendeck" class="inline">
    <img src="images/CrispPlanningPokerDeck.jpg" />
    <figcaption>Beispielhaftes <a href="http://en.wikipedia.org/wiki/File:CrispPlanningPokerDeck.jpg">Kartendeck</a></figcaption>
</figure>

</div>

<div class="chapter">
<h2>Anforderungen an die iOS App</h2>
{'fraction_non_alphanumeric': 0.15138658449869638, 'fraction_numerical': 0.031808485423086036, 'mean_word_length': 1.6226766954683907, 'pattern_counts': {'":': 0, '<': 1149, '<?xml version=': 0, '>': 1145, 'https://': 10, 'lorem ipsum': 0, 'www.': 2, 'xml': 2}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '1261332', 'n_tokens_mistral': 15487, 'n_tokens_neox': 14175, 'n_words': 3104}