-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
114 lines (114 loc) · 4.09 KB
/
index.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
<!DOCTYPE html>
<html>
<head>
<title>Internet Technologie - Week 1 - Opdracht 1</title>
<meta lang="nl" charset=utf-8>
<meta name=description content="Opdrachtomschrijving van Joris Mathijssen en Guus Beckett voor het vak Internet Technologie">
<meta name=viewport content="width=device-width, initial-scale=1">
</head>
<body>
<header><!-- Header -->
<a href="#">Home</a>
<a href="joris.html" target="_self">Joris pagina</a>
<a href="guus.html" target="_self">Guus pagina</a>
<a href="special.html" target="_self">special page</a>
</header>
<section>
<article>
<fieldset>
<legend>
<h2><font face="serif" color="#705252">Comfy Corp Web App</font></h2>
</legend>
<p>Onze opdracht wordt het maken van een webinterface voor de SIR 120 PRO radio. Dit interface, of dashboard, kan gebruikt worden voor het instellen van de radio, het opzetten van een alarm en het starten van een stream. <br /> Tijdens deze opdracht zullen we gebruik maken van verschillende technieken besproken onder het kopje technieken.</p>
</fieldset>
</article>
<article>
<fieldset>
<legend>
<h2><font face="serif" color="#705252">Functionele eisen</font></h2>
</legend>
<p></p>
<table border="1" style="width:30%">
<tr>
<td>Eis</td>
<td>Beschrijving</td>
</tr>
<tr>
<td>Kunnen verwisselen van stream</td>
<td>Het realtime kunnen veranderen van de stream op de radio.</td>
</tr>
<tr>
<td>Het ophalen van een status van de radio</td>
<td>Bekijken wat de status is van de radio (gestopt, gestart en welke stream)</td>
</tr>
<tr>
<td>starten van een stream</td>
<td>het kunnen starten van een stream op de radio</td>
</tr>
<tr>
<td>Stoppen van een stream</td>
<td>het kunnen stoppen van een stream op de radio</td>
</tr>
<tr>
<td>Instellen van een alarm</td>
<td>Het instellen van een alarm op de radio</td>
</tr>
<tr>
<td>verwijderen van een alarm</td>
<td>Het verwijderen van een alarm op de radio</td>
</tr>
<tr>
<td>Instellen van een alarm</td>
<td>Het instellen van een alarm op de radio</td>
</tr>
<tr>
<td>Instellen van een volume</td>
<td>Het instellen van een volume op de radio. Deze te kunnen veranderen tijdens het spelen</td>
</tr>
<tr>
<td>Een login methode</td>
<td>Een manier om radios te registreren en in te loggen met deze gegevens.</td>
</tr>
<tr>
<td>Tonen huidig nummer</td>
<td>Laten zien welk nummer er wordt afgespeelt op de radio. (Met coverart)</td>
</tr>
<tr>
<td>Notification system</td>
<td>Tonen in notificatie vorm dat er een nieuwe stream of nummer begint.</td>
</tr>
</table>
</fieldset>
</article>
<article>
<fieldset>
<legend>
<h2><font face="serif" color="#705252">Technieken Toepassen.</font></h2>
</legend>
<p>De volgende technieken zullen worden toegepast</p>
<ul>
<li><strong>HTML5</strong>: Basis layout voor de website en de tekst.</li>
<li><strong>CSS3</strong>: CSS3 wordt gebruikt voor het stylen van de website.</li>
<li><strong>Javascript</strong>: Javascript wordt gebruikt voor de interactie van de gebruiker met de interface.</li>
<li><strong>jQuery</strong>: JQuery wordt gebruikt om data te processen die als Json binnenkomt van de radio.</li>
<li><strong>JSON</strong>: Gebruikt voor de data van radio te ontvangen in de webinterface.</li>
<li><strong>PHP</strong>: Er wordt gebruik gemaakt van php aan de kant van de server om te interacten met de radio.</li>
</ul>
</fieldset>
</article>
</section>
<aside>
<h1>Aside</h1>
</aside>
<footer> <!-- site wide footer -->
<nav>
<p>
<a href="http://guusbeckett.me" target="_blank">Guus Beckett</a> —
<a href="http://jorismathijssen.nl" target="_blank">Joris Mathijssen</a> —
<a href="http://www.avans.nl" target="_blank"><img src="data/img/avans.svg" height="50" alt="Avans Hogeschool logo in SVG format"></a>
</p>
</nav>
<p>Copyright © 2015 Mackett</p>
</footer>
</body>
</html>