2 Toegepaste informatica, reeks 1B 05 mei 2010 Dynamische Websites Opdracht: Projectmap Student: Yannick Reekmans
1 Verslag
1.1 Code Mijn code is gevalideerde XHTML 1.0 strict en ook de CSS is helemaal gevalideerd. Bij de CSS worden er wel warnings en errors gegeven omdat er gebruik gemaakt wordt van CSS3- en vendorspecifieke opties (zoals border-radius). De PHP-code schrijven was niet echt een probleem, want ik had reeds voorkennis van PHP. Er waren enkel wat problemen om de juiste PEAR-packages geïnstalleerd te krijgen op de testserver maar ook dat was redelijk snel opgelost. Ik heb er ook voor gekozen om de template van de PHP-code te scheiden, zodat er gemakkelijk van design zou kunnen gewisseld worden. Ook heb ik geprobeerd om zo goed mogelijk de PHP style guide te volgen en heb ik mij gebaseerd op de CodeIgniter.com style guide voor CodeIgniter projecten om zo degelijk mogelijke code te schrijven.
05 mei 2010
pg. 1 van 19
KHLeuven, dept. G&T, 2Ti
Bij de database waren er iets meer moeilijkheden en waren er een hoop pogingen nodig om een degelijke structuur bij elkaar te krijgen. XHTML en CSS waren, door het prachtige vak Webdesign, uiteraard geen enkel probleem om gemaakt te krijgen.
1.2 Project Het project was uiteindelijk meer dan te doen, ook omwille van de goede ondersteuning van de docent en de andere mensen die betrokken waren. Zij hebben mij altijd op weg geholpen en alles gezorgd zodat ik zonder problemen kon verder werken. De aangeleverde API voor de uurroosters was niet helemaal perfect, waardoor ik ook al gehoord heb dat mijn project enkel zal gebruikt worden als “idee” door de ICT-dienst om zelf iets gelijkaardig te ontwikkelen, als ze de API aangepast hebben. Met het opleidingsonderdeel zelf had ik niet echt problemen, mede door de ervaring die ik al had met HTML, CSS, PHP, MySQL etc.
05 mei 2010
pg. 2 van 19
KHLeuven, dept. G&T, 2Ti
2 Logboek Tabel 2.1: Logboek Dynamische Websites
05 mei 2010
Datum
Activiteit
Uur
08/02 08/02 11/02 15/02 15/02 22/02 22/02 03/03 29/03 30/03 07/04 08/04 09/04 22/04 23/04 26/04 03/05 03/05
Theorieles Labo Afmaken oefeningen + aanmaak portfoliopagina Labo Afwerken oefeningen Theorieles Labo Afwerken oefeningen Labo Afwerken oefeningen Start project: layout Project: basisfuncties Project: basisfuncties Project: inlogfuncties Project: database creation Project: persoonlijke uurroosters Project: tussentijdse verdediging Project: fixen van magische kapotgegane dingen Totaal
1 1 1,5 1 0,5 1 1 1 1 1 8 6 6 5 2 8 0,25 9 54,25
pg. 3 van 19
KHLeuven, dept. G&T, 2Ti
3 Sitespecificatie 3.1 KHLeuven: Persoonlijke Lessenroosters Ik denk dat de titel voor zichzelf spreekt.
3.2 Doelpubliek Studenten (eventueel ook docenten) van de KH Leuven.
3.3 Doel De mini-site opteert voor een integratie in het huidige portaal (http://portaal.khleuven.be) of als een aparte website (door gebruik te maken van de Centrale Login) en heeft als doel om de gebruikers de kans te geven een persoonlijk lessenrooster te bekijken.
3.4 Dynamische pagina’s • Instellingenpagina: gebruiker krijgt de kans om vakken en reeksen te selecteren die hij wil zien op zijn lessenrooster + eventueel andere instellingen aan te passen (bvb. standaardview). • Lessenroosterpagina (van/tot week zijn te selecteren): – Basisoverzicht zoals de huidige manier – anderen? • Output: – Afdruk versie – Digitaal bestand: pdf (ev. anderen?) – Kalenderbestand waarop kan geabbonneerd worden (probleem => hoe inloggen?) – anderen?
3.5 Rollen Binnen deze website bevinden zich niet echt veel rollen, dit komt omdat de pagina’s gegenereerd worden op basis van een externe API en er dus geen echte verschillende rollen nodig zijn. Ik zie wel een onderscheid tussen ingelogde en niet-ingelogde studenten/docenten. Studenten/docenten horen ingelogd te zijn anders kan de applicatie niet weten voor welke persoon de persoonlijke lessenrooster ingeladen moet worden.
05 mei 2010
pg. 4 van 19
KHLeuven, dept. G&T, 2Ti
3.6 Eventuele Problemen 3.6.1 Abonneren op kalenderbestand We bepalen dat er ingelogd moet worden om een persoonlijk lessenrooster te bezichtigen. Is er de mogelijkheid om het inloggen te laten gebeuren door de kalenderapplicatie (bvb. iCal)? Want anders kan deze functionaliteit niet aangeboden worden, tenzij we het inloggen niet verplicht maken voor reeds gegenereerde ics-bestanden.
3.6.2 Speciale dingen in het lessenrooster De gebruiker kan zelf bepalen wat hij te zien krijgt in zijn lessenrooster en op basis daarvan zou dat gegenereerd moeten worden. Sinds kort worden er in de huidige lessenroosters ook examens, infomomenten en andere “speciallekes” toegevoegd. Het lessenrooster zou dus elk speciaal iets uit al zijn jaren en reeksen moeten kunnen weergeven.
05 mei 2010
pg. 5 van 19
KHLeuven, dept. G&T, 2Ti
4 Functionele analyse 4.1 Onderwerp Persoonlijke lessenroosters voor studenten van de KHL.
4.2 Doelstellingen • Studenten kunnen zelf aanduiden welke vakken zij op hun lessenrooster willen zien • Studenten krijgen verschillende mogelijkheden van weergave: op de website, iCal-formaat. • Studenten vinden gedetailleerde uitleg over hoe ze de functies moeten gebruiken.
4.3 Doelgroepen Studenten van de Katholieke Hogeschool Leuven. Persona: zie bijlage 4.9.1.
4.4 Gebruikersmodel Student • de mogelijkheid om de standaard lessenroosters te bekijken; • alle vakken op één pagina te selecteren; • duidelijke feedback (eventueel welk veld verkeerd ingevuld werd, naam databank); • de mogelijkheid om zijn persoonlijk rooster op verschillende manieren te bekijken: tabelvorm, schemavorm, iCal, . . .
4.5 Rollen en functionaliteiten van de dynamische pagina’s Use case diagramma Bezoeker 1. Krijgt de keuze: a) de standaardlessenroosters bekijken, of b) in te loggen
05 mei 2010
pg. 6 van 19
KHLeuven, dept. G&T, 2Ti
Student 1. logt in 2. registreert vakken 3. bekijkt lessenrooster op het scherm in tabelvorm of schemavorm 4. drukt lessenrooster af in tabelvorm of schemavorm (pdf) 5. abonneert met zijn kalenderapplicatie op ics 6. verwijdert vakken
4.6 Use Cases Zie bijlage 4.10.
4.7 Inhoud en structuur Inhoud en structuur worden gevisualiseerd in de sitemap in bijlage 4.11. Alle pagina’s zijn verbonden met de databank. 1. Home/Uurrooster weergave: index.php • Als niet-ingelogd: – Mogelijkheid om in te loggen – Mogelijkheid om de standaardlessenroosters te bekijken • Als ingelogd: – Weergave van het persoonlijke lessenrooster van de huidige lesweek – Mogelijkheid om de periode van het lessenrooster te wijzigen – Mogelijkheid om de weergave van het lessenrooster te wijzigen – Mogelijkheid om het lessenrooster af te drukken 2. Uurrooster afdrukken: uurrooster_print.php • enkel toegankelijk met login - rol: student • te downloaden pdf 3. Vak registratie: vakken_registratie.php • enkel toegankelijk met login - rol: student • invulvelden om de correcte vakken te selecteren – dropdownbox met de departementen – dropdownbox met de reeksen – checkboxen met alle vakken – submit-knop • lijstje van reeds-opgeslagen vakken, per departement en reeks
05 mei 2010
pg. 7 van 19
KHLeuven, dept. G&T, 2Ti
4. Vak verwijderen: vakken_overzicht.php • invulvelden om vakken te verwijderen – checkboxen bij alle reeds opgeslagen vakken, onderverdeeld per departement en reeks – submit-knop
4.8 Formulieren en databank Zie bijlage 4.12. Werk elke functionaliteit gedetailleerd uit. Noteer volgende gegevens: • methode van het formulier (post of get); • alle formuliervelden «en hun kenmerken (type input, naam, attributen, . . . ); • naam van veranderlijken die je uit de databank haalt (+ naam van de kolom van de databank); • idem voor veranderlijken die je naar de databank schrijft; • Als je veranderlijken uit een ander formulier/andere functionaliteit recupereert: naam van de functionaliteit en naam van de veranderlijken.
05 mei 2010
pg. 8 van 19
KHLeuven, dept. G&T, 2Ti
4.9 Bijlagen 4.9.1 Persona Student: Bram Vandencasteele
• 21 jaar; • ongehuwd, woont bij zijn ouders, zit op kot; • student Toegepaste Informatica; • zeer gedreven computerfanaat: is dagelijkse gebruiker en kan het systeem tot op het bot testen; • gebruikt het internet zowel voor professionele doelen (leerstof verwerken, uurroosters raadplegen) als voor persoonlijk gebruik (MSN, muziek downloaden, . . . ); • favoriete sites: twitter.com en facebook.com; • persoonlijke doelen: succesvol consultancy bedrijf opstarten; • doel van de applicatie: uurroosters raadplegen. Student: Nele Boeraeve
• 19 jaar; • ongehuwd, woont thuis, pendelt met de wagen naar school; • student Lerarenopleiding Diest; • basiscomputergebruikster: dagelijkse gebruiker, de computer moet gewoon werken;
05 mei 2010
pg. 9 van 19
KHLeuven, dept. G&T, 2Ti
• gebruikt het internet professioneel (leerstof verwerken, uurroosters raadplegen) en voor persoonlijk gebruik (MSN, netlog, . . . ); • favoriete sites: netlog.com, flair.be; • persoonlijke doelen: geliefde lerares worden; • doel van de applicatie: uurroosters raadplegen.
05 mei 2010
pg. 10 van 19
KHLeuven, dept. G&T, 2Ti
4.10 Use Cases 4.10.1 Use Case 1: Inloggen Naam
inloggen
Samenvatting
student logt in met zijn studentennummer en wachtwoord
Actoren
student
Aannames
–
Resultaat
student is ingelogd
Beschrijving
1. student vult studentennummer in; 2. student vult wachtwoord in; 3. student verstuurt het formulier; 4. systeem toont bevestigingsscherm.
Uitzonderingen 1a. student vult studentennummer niet in; 1b. systeem geeft foutmelding; 1c. systeem toont het formulier opnieuw, maar correcte gegevens blijven ingevuld. 2a. student vult wachtwoord niet in; 2b. systeem geeft foutmelding; 2c. systeem toont het formulier opnieuw, maar correcte gegevens blijven ingevuld. 3a. systeem controleert studentennummer en wachtwoord 3b. als correct, systeem gaat verder naar stap 4. Indien niet correct, systeem gaat naar 3c; 3c. systeem toont het formulier opnieuw en geeft feedback, maar correcte gegevens blijven ingevuld.
05 mei 2010
pg. 11 van 19
KHLeuven, dept. G&T, 2Ti
4.10.2 Use Case 2: Vakregistratie Naam
Vakregistratie
Samenvatting
Student geeft aan welke vakken op zijn lessenrooster moeten verschijnen
Actoren
student
Aannames
student is ingelogd
Resultaat
wijziging is doorgevoerd in de databank en student ziet aangepast uurrooster
Beschrijving
1. Student krijgt lijst van departementen 2. Student krijgt, afhankelijk van het gekozen departement, de bijbehorende reeksen 3. Student verkrijgt een lijst van vakken 4. Student duidt aan welke vakken hij wil opnemen in zijn lessenrooster 5. Student verstuurt het formulier 6. Systeem slaat de gegevens op in de databank 7. Student krijgt zijn aangepaste lessenrooster te zien
Uitzonderingen
05 mei 2010
Uitzonderingen gegooid door de API
pg. 12 van 19
KHLeuven, dept. G&T, 2Ti
4.10.3 Use Case 3: Schermweergave Naam
Schermweergave
Samenvatting
Student bekijkt het uurrooster
Actoren
student
Aannames
student is ingelogd
Resultaat
Uurrooster wordt gepresenteerd op het scherm
Beschrijving
1. Student krijgt de keuze tussen de verschillende weergave opties 2. Student kan kiezen voor welke periode het uurrooster weergegeven moet worden 3. Systeem geeft het uurrooster weer, naargelang de meegegeven opties
Uitzonderingen
Uitzonderingen gegooid door de API
4.10.4 Use Case 4: Vakken verwijderen Naam
Vakken verwijderen
Samenvatting
Student verwijdert vakken uit het uurrooster
Actoren
student
Aannames
student is ingelogd
Resultaat
Databank wordt aangepast en uurrooster wordt gepresenteerd op het scherm
Beschrijving
1. Student krijgt een lijstje van de gekozen vakken 2. Student deselecteert de vakken die hij wil verwijderen 3. Systeem past de databank aan 4. Systeem geeft het aangepaste uurrooster weer
05 mei 2010
pg. 13 van 19
KHLeuven, dept. G&T, 2Ti
4.10.5 Use Case 4: Uurrooster exporteren (pdf) Naam
Uurrooster exporteren
Samenvatting
Systeem bezorgt de student een pdf-versie van het lessenrooster
Actoren
student
Aannames
student is ingelogd student heeft een uurrooster op zijn scherm staan
Resultaat
Student krijgt een pdf-versie van het uurrooster
Beschrijving
1. Student duwt op de knop “exporteren” 2. Systeem genereert een pdf-versie van de huidige weergave van het uurrooster
Uitzonderingen
05 mei 2010
Uitzonderingen gegooid door de API
pg. 14 van 19
KHLeuven, dept. G&T, 2Ti
4.11 Sitemap
05 mei 2010
pg. 15 van 19
KHLeuven, dept. G&T, 2Ti
4.12 Formulieren 4.12.1 Formulier op index.php: student selecteert “van week” en “tot week”
05 mei 2010
pg. 16 van 19
KHLeuven, dept. G&T, 2Ti
4.12.2 Formulier op vakken_registratie.php: student selecteert weer te geven vakken
05 mei 2010
pg. 17 van 19
KHLeuven, dept. G&T, 2Ti
4.12.3 Formulier op vakken_overzicht.php: student deselecteert niet meer weer te geven vakken
05 mei 2010
pg. 18 van 19
KHLeuven, dept. G&T, 2Ti
5 Gebruikersnamen en wachtwoorden Er zijn geen gebruikersnamen of wachtwoorden nodig, ze kunnen (voorlopig) gewoon uit een dropdown keuzelijst geselecteerd worden.
05 mei 2010
pg. 19 van 19
KHLeuven, dept. G&T, 2Ti
