Programmering eksamensprojekt - Lectio App Roskilde Tekniske Gymnasium - Klasse 3.3 - v. Karl Bjarnason Ditlev Stjerne, Kasper Damgaard og Gustav Gregersen 15-05-2014
Indhold Indledning... 2 Målgruppe... 2 Kravspecifikation... 2 Testspecifikation... 3 Alternativer til vores produkt... 3 Konklusion på alternativer til vores produkt... 4 Personlig integritet på Lectio... 4 User stories... 6 Design... 6 Værktøjer... 8 Teori... 8 Java... 8 Jsoup... 8 Android... 8 Android XML... 9 3-lags arkitektur... 9 Forklaring af variabler... 10 Implementering... 10 Flowchart... 14 Brugertest... 15 Konklusion... 15 Bilag... 16 Bilag 1 - Projektbeskrivelse... 16 Bilag 2 - Beskrivelse af variabler... 19 Bilag 3 - Programkode... 20 Bilag 4 - Brugervejledning... 32 Side 1 af 33
Indledning I denne gruppe bestående af Kasper Damgaard, Ditlev Stjerne og Gustav Gregersen, kunne vi godt tænke os at udvikle en applikation til Android, der gør det muligt at se ens Lectio skema. Appen skal også have mulighed for at gemme ens skema lokalt, sådan det er muligt at se skemaet, uden at have forbindelse til internettet. Meningen med appen er for primært at spare tid på at skulle finde frem til ens skema og derefter loade det. En anden fordel er herudover at man undgår problemer, hvis man ikke har forbindelse til internettet, eller ens forbindelse er meget langsom. Det vigtigste i dette projekt vil være at få applikationen til at hente skemaet først og fremmest. Herefter vil arbejdet gå videre på at få appen til at gemme skemaet. Der vil være nogle flere funktioner der er mulighed for at implementere, fx notifikationer når skemaet bliver ændret, men dette er ikke en prioritet. Målgruppe Vores målgruppe med dette produkt er folk der bruger Lectio, hvilket i de fleste tilfælde vil være elever og lærere på forskellige uddannelsesinstitutioner. Appen er ikke sigtet efter en specifik aldersgruppe, geografisk position og til dels indkomst, da gruppen der kan benytte appen er meget bred. Gruppen dækker over alt mellem alt nye 10. klasseelever på omkring 15 år, til ældre lærere nær pensionsalderen. Uddannelsesstederne er placeret over hele landet. Der er en lille form for økonomisk krav for at bruge appen, da det er nødvendigt at eje en Android smartphone. Kravspecifikation Der vil være forskellige krav til vores krav til vores app, som vi skal forsøge at opfylde under udviklingen. Appen skal hente listen over skoler, når starter Listen med skoler skal gemmes på telefonen for at spare data og øge funktionalitet når telefonen ikke har adgang til internettet Skolerne skal listes op i alfabetisk orden Brugeren skal kunne trykke på den ønskede skole Når brugeren har valgt skole, skal applikationen hente listen med elever og vise dem som liste, efter alfabetet Som med skolenavnene, skal brugeren have mulighed for at springe til et bogstav Når brugeren vælger et navn, skal skemaet for denne person hentes Skemaet skal opbevares lokalt, for at gøre det muligt at se sit skema uden adgang til internet Skemaet skal vises på en liste, et modul per afsnit Side 2 af 33
Testspecifikation Vi har tænkt os, at lave en teknisk test af vores produkt. Vores første mål er, at produktet skal fungere. Måden vi skal teste vores produkt kommer til at være, ved at se om programmet kan downloade HTML-sider. Det skal så være muligt at kunne få vist noget af eller hele HTML-koden i applikationen. Dvs. enten lave en tekst boks, som HTML-koden kan blive skrevet til eller komme op med en besked, som viser en del af koden. Når det lykkes, bliver næste step at finde alle skolernes links i HTML-koden og opsætte dem i en liste. Efter skolerne bliver opsat, som en liste skal det være muligt for brugere, at klikke på en af skolerne og blive sendt videre. Det betyder der skal være en liste med skolernes navne og en liste med tilhørende list med URLs til de forskellige skoler. Måden vi har tænkt os, at teste applikationen er ved både, at køre den på en android emulator og en reel telefon. Alternativer til vores produkt Vi har kigget på alternative appikationer til vores produkt på Google Plays applikation store 1, for at finde ud af, hvordan markedet på nuværende tidspunkt er, i forhold til Lectio applikationer. Udover at finde ud af, hvad udbuddet er på Lectio applikationer vil også finde ud af, hvor meget disse applikationer egentlig kan og hvor mange penge de koster, hvis de ikke er gratis. Den første applikation der popper op, når man søger Lectio på Google Plays app store, er en applikation som hedder Lectio. Ud fra beskrivelsen af applikationen 2, har vi fundet ud af, at personen som har lavet applikationen, har haft den samme tankegang, som vi har. Den kan vise ens lectio skema via mobilen, ved at man finder ens skole og herefter den elevs skema man vil se skemaet for, uden at logge ind. Dette er det samme, som vores kan. Dog har denne applikation videreudviklet, i forhold til vores, da den har nogle af de funktioner, som er det vi havde tænkt os at implantere, i vores videreudvikling af vores produkt. Den kan nemlig huske skemaet så det kan ses uden net forbindelse og den har en søge funktion, så der er mulighed for, at finde skole og elev navn hurtigere. Herudover kan man også skrive noter til dagene, hvilket er noget, som vi ikke selv havde overvejet. Denne applikation er gratis på Google Play store. Den næste Lectio applikation, som er et alternativ til vores produkt, hedder også Lectio 3. Denne applikation er meget ens i forhold til den applikation, som vi lige har beskrevet. Den har dog den feature, at man kan betale 7.50kr for produktet, så man fjerne reklamer. Den kan det samme, som 1 https://play.google.com/store/search?q=lectio&c=apps 2 https://play.google.com/store/apps/details?id=com.sixplus.lectio 3 https://play.google.com/store/apps/details?id=com.applicious.lectio Side 3 af 33
den anden applikation. Dog har udgiveren sagt, at han har tænkt sig at videreudvikle, for at tilføje flere features. Den sidste applikation til lectio som vi vil nævne er en applikation på google play, som er meget ens, i forhold til vores produkt. Appikationen hedder Lectio the app! 4 og ifølge udgiveren er applikationen i en tidlig beta, hvilket det også kan set, da den stort set kan det samme, som vores. Denne applikation ser ikke ud til at være opdateret i en længere periode. Konklusion på alternativer til vores produkt Der er allerede en del Lectio applikationer ude på markedet, og mange af dem er til gratis brug. De nuværende produkter er længere udviklet end vores, hvilket gør, at vi på nuværende tidspunkt ikke har det bedste produkt på markedet, hvis vi udgav det på Google Play store. Det kan være et svært markedet at komme ud på, da mange af de funktioner, som vi mener en Lectio applikation skal have allerede er på markedet. Dette gør, at hvis man skal have en populær Lectio applikation ude på det nuværende markedet, skal der enten nytænkning ind, i forhold til funktioner i produktet, eller der skal tænkes et nyere og mere moderne/brugervenligt design ind, for at tiltrække brugere til at bruge vores produkt, fremfor andres. Personlig integritet på Lectio MaCom s håndtering af personlig data kan være til diskussion. På Lectio bliver store mængder data offentliggjort, uden begrænsninger for, hvem der har adgang til disse data. Enhver person kan gå ind på Lectio og finde et helt personligt skema på hvilken som helst person. Eksempelvis ses nedenfor et billede af et skema for en person på en helt anden uddannelsesinstitution. Det var muligt at tilgå dette, uden at være logget ind. 4 https://play.google.com/store/apps/details?id=appinventor.ai_mlund3n.lectio_11 Side 4 af 33
Personligt skema hentet fra Lectio uden at være logget ind Udover at have adgang til skemaet, er der også offentliggjort, hvad der hedder en studierapport. Her beskrives forskellige forløb eleven har været igennem. Noget af en studierapport offentlig tilgængelig på Lectio Dette offentlige data, har både sine fordele og ulemper, som også kan diskuteres. En pointe med at have skemaet offentligt, kan fx være at forældre kan se, hvornår deres barn har fri. Det er også en mulighed for venner at se dette. Dog er det ikke kun venner der har adgang til informationen og en person med onde hensigter, vil også have fri adgang til alle disse data. Med den mængde Side 5 af 33
data der er til rådighed på Lectio, kunne det også blive muligt at lave sin egen database med forskellige personer. Ved at vide informationer som hvilke fag en person har, kan det til dels være med til at lave en profil af en person i forhold til interesser og lign. Andre muligheder er for fx indbrudstyve, der har mulighed for at se, hvornår lærere er på arbejde. User stories Alexander Alexander åbner Lectio applikationen op. Han vælger den skole, som han går på. Herefter skal han vælge elev. Han bruger bogstav funktionen til at finde sig selv lettere. Han siger, at der burde være et loadingscreen, når applikationen loader navnene. Han vælger sit navn og kan se sit skema helt fint. Benny Benny åbner applikationen op. Benny bruger Lectio applikationen, da han gerne vil finde ud af, hvor henne han skal være i næste time. Det er vigtigt for Benny at applikationen er let at bruge, så han hurtigt kan se sit skema, så han ikke skal bruge alt for meget tid på det. Benny finder hurtigt sig skema frem, da applikationen automatisk åbner hans eget skema op, da applikationen gemmer elevens skema, som er blevet brugt før på applikationen. Anden gymnasieelev Som en gymnasiestudent, vil jeg gerne kunne se mit skema på min mobil, uden at bruge massere af tid på at gå ind på Lectios hjemmeside, hvor jeg skal vente på at tingene loader og ikke er mobil venlig. For at gøre dette vil jeg bruge en Lectio applikation, så jeg hurtigt og nemt kan få mit skema op på min mobil og hvor det er lavet til mobilbrugere. En fordel ville være, at denne applikation kan gemme mit skema, da jeg ikke altid har adgang til internettet. Design Et af de vigtigste punkter i vores applikation er at den har en meget lav guessability og learnability Gulf. Det skal være helt lige til når appen skal bruges, sådan at brugeren ikke bliver i tvivl om, hvordan man gør. Brugeren skal meget hurtigt kunne opnå expert user performance. Hvis det kræver for lang tid for brugeren at lære at bruge appen, vil vi have en lavere chance for at de bruger appen igen. Appen skal være hurtigere og nemmere at bruge, end Lectios hjemmeside, for at brugeren vil have lyst til at bruge den. Det første brugeren bliver mødt med, er en side med de forskellige skoler, der benytter Lectio. Herfra kan brugeren vælge den ønskede skole, hvorefter brugeren vil blive sendt videre til en liste med elever fra skolen. Her vil brugeren så kunne sortere efter forbogstav til et navn og derefter Side 6 af 33
vælge navnet på den person, man ønsker at se skemaet for. For at navigere rundt i listerne skubber brugeren op og ned med fingeren på listen. Udkast til design af skoleliste og elevliste Efter at brugeren har valgt et navn skal skemaet vises. Udkast til design af skemaet Side 7 af 33
Værktøjer Til udviklingen af programmet vil vi benytte Eclipse og Android SDK. Det kan herudover være nødvendigt med flere udvidelser undervejs i udviklingen. Eclipse er både open-source og gratis. Det er primært lavet til Java, men kan sagtens bruge til andre sprog ved brug af forskellige udvidelser. Android SDK en er gratis, open-source og indeholder mange af de nødvendige funktioner til udviklingen som fx debugger og emulator. Teori Java 56 Java er et objektorienteret programmeringssprog. Grundprincippet i sproget er, at lave et program og kunne køre det på en hvilken som helst computer. Java er blevet enormt udbredt siden det blev udgivet i 1995, hvilket kan se spå at det bliver brugt på mere end 3 milliarder mobiltelefoner og mere end 89 % af alle computere. Java er sammensat således at programmer skrevet i det, kan køre på mere eller mindre alle enheder, der har Java installeret. Dette gør det let for udviklere at programmere til flere forskellige systemer, uden at skulle kompilere til alle systemerne. Måden Java kan fungere på så mange forskellige platforme, er ved at benytte en virtuel maskine. Denne virtuelle maskine ved navn Java virtual machine, oversætter den kompilerede kode, kaldet bytecode, til kommandoer for computerens processor. På den måde kan det oversættes til at fungere både på x86 og ARM platforme. Vi benytter Java til at programmere hoveddele af applikationen. Jsoup 7 En vigtig funktion i vores app, er at den skal kunne gennemgå HTML kode og uddrage de nødvendige koder. Til dette benyttes biblioteket jsoup, der også indeholder en API, som kan udvinde den ønskede kode. Jsoup fungerer med størstedelen af HTML og CSS typer og fungerer fint til vores formål. Det er udgivet som open source under MIT-licensen, hvilket betyder at softwaren er gratis og i stor stil at det er tilladt at gøre med koden som man ønsker. I dette projekt benyttes jsoup til at finde navne, links, moduler og lign., som derefter kan bruges. Android 89 Android er et Linux baseret styresystem til håndholdte computere, mobiltelefoner og tablets. Styresystemet bliver udviklet af Open Handset Alliance og ledes af firmaet Google. Tilbage i 2005 blev 5 http://en.wikipedia.org/wiki/java_(programming_language) 6 https://skeptics.stackexchange.com/questions/9870/do-3-billion-devices-run-java 7 http://jsoup.org/ 8 http://en.wikipedia.org/wiki/android_(operating_system) 9 http://da.wikipedia.org/wiki/google_android Side 8 af 33
selskabet Android Inc. Opkøbt af Google. I november 2007 blev Android en åben platform, hvilket resulterede i, at udviklingsgruppen Open Handset Alliance blev dannet. Denne gruppe består af omkring 80 hardware, software og telekommunikationsfirmaer. Denne udviklingsgruppe er gået sammen, for at udvikle åbne standarder. Denne alliance arbejder sammen for at udvikle AOSP, som står for The Android Open Source Projekt. Den første publiceret smartphone med Android blev udgivet den 22. oktober, 2008 og var på telefonen HTC Dream. Android til vores projekt er relevant, da det er det mobil-operativsystem, som vi laver vores applikation til. Android er et stort netværk af udviklere til applikationer, hvor der på nuværende tidspunkt er over en million applikationer i Google Play, og dette antal stiger stadig kraftigt, da applikationer til telefoner er utrolig populære. Da Android er det mest populære operativ styresystem til mobiler, tænkte vi, at det ville være smart, at udvikle vores Lectio applikation til Android. Androids findes flere enheder, end alle Windows og ios enheder tilsammen. Android XML 101112 XML betyder Extensible Markup Language og er et opmærkningssprog (Markup Language). XML er en populær format for deling af data på internettet. I forhold til vores projekt bruger vi XML til at designe vores appikation. Det gør vi med XML, da det gør det muligt for os at adskille præsentationen af vores applikation fra koden, som kontrollerer dens adfærd. En af fordelene med XML er også, at vi kan lave XML layouts for forskellige skærm orienteringer, forskellige enheders skærmstørrelser og forskellige sprog. Herudover har det den fordel at bruge XML, at det gør det lettere for os at visualisere strukturen I vores brugergrænseflade, hvilket gør det lettere at finde fejl, når det forekommer. 3-lags arkitektur Præsentationslaget På præsentationslaget har vi designet en brugerflade, hvor man kan informationer som skole og navn listes op. Logiklaget Hvert navn og skolenavn fungerer som knapper, der leder videre til en anden side. Fx hvis der vælges en skole, bliver navnene på eleverne fra den skole vist på præsentationslaget. Datalaget 10 http://developer.android.com/guide/topics/ui/declaring-layout.html 11 http://www.sitepoint.com/learning-to-parse-xml-data-in-your-android-app/ 12 http://developer.android.com/training/basics/network-ops/xml.html Side 9 af 33
Der er en lang række variabler nødvendige i dette program. Disse benyttes til alt fra at holde større mængder tekst, til at holde et enkelt tal. Herudover er selve applikationens programmering placeret i datalaget, som en.apk fil. De enkelte variabler og deres funktioner kan findes i bilag nr. 2. Forklaring af variabler Integer er en variable, som indeholder helt tal. Integer bliver beskrevet i java, som int. Array er en funktion, som indeholder en række af variabler. String er en variable der indeholder et array af bogstaver. Float er en variable, som kan indeholde decimaltal. I biblioteket Jsoup som vi benytter, anvendes variabeltypen Document, som indeholder html koden til den side der bliver downloadet. Implementering Det første, som blev udviklet i programmet, var funktionen der downloader en HTML side. Til dette bliver her brugt et tilføjet library, Jsoup. Ved første forsøg på at implementere funktionen, som downloader Lectios hjemmeside kom der en fejl meddelelse. Efter undersøgelse fandt vi ud af applikationen skal gives adgang til internettet i en fil, som hedder androidmanifest 13. Her skal der specificeres, hvilke funktioner appen skal bruge. Efter at have defineret det således at appen får lov til at bruge internet, prøvede vi at teste produktet igen. Dette gav samme problem. Her var ikke nogen ændringer i den fejlbesked som kom. Det viste sig, at når man laver en Android app, skal den første aktivitet i applikationen have nogle specielle rettigheder for at have internet. Dette sker kun på versioner af Android efter Android 2.2. Så i kildekoden bliver der givet tilladelse for at give aktiviteten adgang til internettet. Efter at have defineret de ønskede tilladelser blev produktet testet igen. Nu lykkedes det at downloade Lectios hjemmeside. Her kom ikke længere nogen fejlmeddelelse op. Efter HTML siden er blevet hentet ned på telefonen, aktiverer det en funktion i Jsoup, som kan gå ind i HTML koden og udvælge dele af koden, alt efter hvad der ønskes. Doc er den variabel, som indeholder hele HTML koden. Herefter bliver der oprettet en ny variabel kaldet Elements, som finder alle steder i HTML koden, hvor div tagget har Class= buttonheader. Eksempelvis: 13 http://developer.android.com/guide/topics/manifest/permission-element.html Side 10 af 33
<div class= buttonheader textleft > <a href= /lectio/523/default.aspx?lecafdeling=4733693225 >Roskilde Tekniske Gymnasium</a></div> Efter dette går et loop i gang, som tilføjer teksten, der er i mellem de to div tags. I dette tilfælde Roskilde Tekniske Gymnasium, til et array. Dette bliver defineret som mdata. mdata indeholder alle skolenavnene fundet på Lectios oversigt. Den anden del af loopet finder linket til skolen og indsætter dette i et nyt array. Da dette fungerede, begyndte udvikling af, hvordan det skulle blive vist overfor brugeren. Løsningen blev, at lave et listview, som en API i android. Det kan så bruges til at loade mdata variablen ind i. Det giver så en liste over Lectios skoler, som brugeren kan scrolle igennem. Det næste step er så at, når brugeren vælger en skole, skal det finde den tilsvarende skole URL. Det bliver gjort ved, at finde positionen af den skole, som brugeren trykker på. Positionen kommer så ud i et tal fx 50, hvilket altså er linjen for den bestemte skole. Når positionen er fundet, bliver URL en til den skole indsat i mstore som en global string. Figur 1. MainActivity.java Til sidst starter applikationen så en ny aktivitet kaldet Elev.class. Se figur 2, som var først udkast til Elev.class. Aktiviteten er opsat til at vise tekst. Knappen bliver brugt til at få den nederste tekst til at blive vist frem. Her udskriver den to variabler, som indeholder links fra skolens forside, som eleven har valgt. Det bliver brugt til, at tjekke om de rigtige links til siden var valgt. Figur 2. Elev.java Side 11 af 33
Efter det rigtige link var fundet, blev det nu muligt at lave en ny funktion, som downloader listen over elever. Den nye aktivitets første funktion er, at downloade forsiden for den skole elev går på. Herfra finder den linket til skolens elever. Efter at have fundet det rigtige link, bliver siden med elever downloadet til applikationen. Et problem vi oplevede med linket til skolens elever, var at linket til siden over elever kun indeholdt slutningen af linket. Dette betyder at vi bliver nødt til at sammensætte et link. Løsningen til dette var at bruge skolens link https://www.lectio.dk/lectio/523/default.aspx, men dette link slutter med defaut.aspx. Så her skal det efter 523/ fjernes. I starten blev længden af linket til skolen fundet og så blev her lavet en sub string. Denne sub string svarede til /lectio/523/. Dette virkede, men her kom et nyt problem. Dette virkede kun med skoler som havde intervallet fra 100 til 999. Hvis skolen havde under 100 eller over 999, ville programmet ikke kunne få det rigtige link. Derved kom der ikke nogen data tilbage som kunne bruges. For at løse dette problem, blev der opstillet et if statement, som ud fra længden af linket til skolen fandt det passende antal, til den skole brugeren havde valgt. Figur 3. Elev.java I starten blev kun elever med start bogstavet A downloadet. Deres navne blev så indsat i et array, hvorefter det kunne blive vist som en liste for brugeren. Her skete ikke noget når brugeren prøvede at klikke på et navn. Efter at eleverne var indsat skulle der nu laves en ny liste over bogstaver. Eftersom at Lectio sorterer elever efter bogstaver, blev der oprettet en ny funktion, som henter listen med bogstaver og de tilhørende links. Figur 4. Elev.java Side 12 af 33
Den sidste version hentede listen over bogstaver og listen af elever. Når brugeren valgte et bogstav udfører programmet en funktion, som fjerner indholdet i det array med eleverne. Når arrayet er tomt bliver den nye liste med elever indsat og listen bliver tegnet igen med den nye liste. Når brugeren vælger en persons navn bliver url en til den elev sammensat i en string variabel ved navn skema. Skema variablen er sammensat af 3 andre variabler. MainActivity.lectio indeholder https://www.lectio.dk. mstore indeholder fx /lectio/523/skemany.aspx?type=elev&elevid=3482052193 hvilket er linket til brugerens skema. Til sidste bliver her tilføjet forcemobile, hvilket indeholder teksten &forcemobile=1. Hvis det bliver skrevet til sidst i url en til Lectio, vil mobilversionen af siden blive downloadet. Herefter bliver en ny aktivitet åbnet. Den første funktion som bliver i gang sat er at downloade brugerens skema. Efter at have indsat skemaet blev køres appen igen. Den viste skemaet, men det var meget uoverskueligt. Her var ikke nogle måde for brugeren at kunne se hvilke moduler, som tilhørte hvilke dage. Alle modulerne blev lagt ind i arrayet, uden at ændre på opsætningen. Figur 5. mitskema.java Side 13 af 33
Metoden for at lave om på dette blev, at finde op de steder i HTML koden hvor modulerne blev opdelt. Så for hvert sted hvor dagene bliver beskrevet bliver der i arrayet tilføjet et eller ikke nogen data. Derefter finder vi de steder i htmlkoden, hvor datoerne er og indsætter dem i et array. Så bruger vi integer variabler og tildeler dem numre, som passer til de steder, hvor der ikke er noget i arrayet. Så tildeler den dagene der passer til de givne steder i arrayet hvor teksten er dvs. her ikke er nogen tekst i. Flowchart Side 14 af 33
Brugertest For at se hvordan en bruger ville reagere på produktet prøvede vi at give det til en person, som ikke har set det før. Test brugeren brugte 7 tryk på at komme hen til sit skema. Dette var dog ikke fordi brugerne ikke kunne finde rundt, men at der ikke var nogen loadingscreen eller en indikation at programmet arbejdede. Det betød at brugerne ikke troede her var trykket på skærmen og begyndte så at trykke igen. Dette gav anledning til frustrationer hos brugeren. Det betød også at antallet af tryk på skærmen steg til over det dobbelte hvis her bliver set i forhold til at personen ikke skulle scrolle. En anden bruger begyndte at scrolle hele vejen ned til personens navn uden at bruge opslagssystemet, hvilket betød at brugeren brugte lang tid på at finde sit navn. Derudover havde vi to brugere, som benyttede appen som tiltænkt. Konklusion Vi blev ikke færdige mod produktet beskrevet i kravspecifikationen, da det var langt mere omfattende at få downloadet, parset HTML en og vist resultatet, end indledende beregnet. Det lykkedes dog at få den mest essentielle funktion til at fungere, nemlig det at hente og vise en persons skema. Det lykkedes ikke at få skemaet gemt, sådan at appen fungerede uden adgang til internettet. Der er en lille plads på markedet, men det kræver at vores app både har et langt større funktionsspektrum og er driftssikker. Side 15 af 33
Bilag Bilag 1 - Projektbeskrivelse Analyse af problemstilling Ved langsomt eller intet internet, kan det være besværligt eller umuligt at hente Lectio s hjemmeside og dette kan skabe problemer med at bestemme, hvilket lokale man skal være i. Herudover kan der være fejl fra MaCom også forhindre loade Lectio. Ydermere kan der ske skemaændringer, som man ikke altid opdager, inden man er nået op på skolen. Problemet er noget vi både har hørt om fra andre medstuderende samt oplevet selv. Problemformulering Vi vil løse problemet med ikke at have adgang til Lectio s hjemmeside. Målgruppen Vores målgruppe med dette produkt er folk der bruger Lectio, hvilket i de fleste tilfælde vil være elever og lærere på forskellige uddannelsesinstitutioner. Løsningsforslag 1. Den første løsning vi kunne lave var at opstille en server, hvor man opretter sig til en sms service. Serveren tjekker så personens skema for ændringer. Hvis der så er sket en ændring sender server en sms til personen. Fordelen ved dette er personen relativt hurtigt finder ud af, hvis et lokale er ændret eller en time er aflyst Ulempen er produktet kan blive dyrt at vedligeholde, hvis der kommer mange brugere. 2. Anden løsning kunne være at lave en app, som kan downloade brugerens skema. Så brugeren altid har adgang til at se deres skema selv hvis internettet er nede. Fordelen er at brugeren selv kan bestemme hvornår skemaet skal opdateres. Ulempe hvis lectio ændre deres kode skal app en opdateres og dette kan tage lang tid. Vi valgte løsning nr. 2, da vi vurderer at den kan løse problemet på en bedre måde. Nærmere beskrivelse af valgt produkt I gruppen kunne vi godt tænke os at udvikle en applikation til Android, der gør det muligt at se ens skema. Appen skal også have mulighed for at gemme ens skema lokalt, sådan det er muligt at se skemaet, uden at have forbindelse til internettet. Meningen med appen er for primært at spare tid Side 16 af 33
på at skulle finde frem til ens skema og derefter loade det. En anden fordel er herudover at man undgår problemer, hvis man ikke har forbindelse til internettet, eller ens forbindelse er meget langsom. Det vigtigste i dette projekt vil være at få applikationen til at hente skemaet først og fremmest. Herefter vil arbejdet gå videre på at få appen til at gemme skemaet. Der vil være nogle flere funktioner der er mulighed for at implementere, fx notifikationer når skemaet bliver ændret, men dette er ikke en prioritet. Værktøjer Til udviklingen af programmet vil vi benytte Eclipse og Android SDK. Det kan herudover være nødvendigt med flere udvidelser undervejs i udviklingen. Eclipse er både open-source og gratis. Det er primært lavet til Java, men kan sagtens bruge til andre sprog ved brug af forskellige udvidelser. Android SDK en er gratis, open-source og indeholder mange af de nødvendige funktioner til udviklingen som fx debugger og emulator. Budget Der er ingen finansielle ressourcer tilgængelige i dette projekt. Side 17 af 33
Tidsplan Side 18 af 33
Bilag 2 - Beskrivelse af variabler MainActivity.java ArrayList<String> mdata = new ArrayList<String>(); //mdata holder alle lectios skole navne ArrayList<String> mlinks = new ArrayList<String>(); //mlinks indeholder alle url's til de forskellige skoler ArrayAdapter<String> madapter; //madapter er den variable som indeholder data'en til listview'et ListView mlistview; //mlistview loader listview'et med skolerne ind public static String lectio = "https://www.lectio.dk"; public static String mstore; //Global variable som indeholder det link til den skole brugeren vælger. Document doc; // html dokument fra lectio's side Elev.java ArrayAdapter<String> madapter; // indeholder elevernes navne ArrayAdapter<String> madapter2; // indeholder bogstaver a,b,c ArrayList<String> mlinks = new ArrayList<String>(); // indeholder url s til liste over elever og lærer ArrayList<String> eleverlink = new ArrayList<String>(); // indeholder all linkesne til de forskellige elever ArrayList<String> elevertext = new ArrayList<String>(); // indeholder alle elvernes navne ArrayList<String> bs = new ArrayList<String>(); // indeholder alfabetet ArrayList<String> bslink = new ArrayList<String>(); // Har links svarende til de bogstaverne Document doc; // har html koden til skolens lectio side Document doc2; // har html koden til svarende til det elevbogstav brugerne vælger ListView mlistbogstav; // bruger madapter til at loade dataen ind i listviewet ListView mlistelever; // bruger madapter2 til at loade dataen ind i listviewet public static String mstore; // hvis brugeren vælger et elev navn bliver noget af elevens link indsat I denne variable public static String mstore2; // hvis brugeren vælger at trykke på et bogstav bliver noget af linket til dette bogstav indsat public static String skema; // indeholder den fulde url til brugernes skema public static String URL3; // hvis brugeren trykket på et bog stav bliver den her variable brugt til at sammensætte den url, som passer til elev bogstavet String skolenr; // laver en sub string af mstore fra mainactivity, som alt efter hvor langt linket er for skolen tilføjere fx /lectio/523/ til skolenr. String forcemobile = "&forcemobile=1"; // hvis det bliver skrevet i slutningen af lectio s url bliver det mobilversionen String URL = MainActivity.lectio + MainActivity.mStore + forcemobile; // indeholder url en til den skole brugerne har valgt String URL2; // har url en til listen over elever String felev; // har den sidste del af linket til eleverne for skolen Side 19 af 33
Bilag 3 - Programkode MainActivity.java package com.example.lectiologin; import java.util.arraylist; import org.jsoup.jsoup; import org.jsoup.nodes.document; import org.jsoup.nodes.element; import org.jsoup.select.elements; import android.os.bundle; import android.os.strictmode; import android.app.activity; import android.content.intent; import android.view.view; import android.widget.adapterview; import android.widget.arrayadapter; import android.widget.listview; import android.widget.adapterview.onitemclicklistener; public class MainActivity extends Activity { public static String lectio = "https://www.lectio.dk"; public static String mstore; //Global variable som indeholder slinktoschool ArrayList<String> mdata = new ArrayList<String>(); //mdata holder alle lectios skole navne ArrayList<String> mlinks = new ArrayList<String>(); //mlinks indeholder alle url's til de forskellige skoler ArrayAdapter<String> madapter; //madapter er den variable som indeholder data'- en til listview'et String slinktoschool; //slinktoschool er linket til elevens skole ListView mlistview; //mlistview loader listview'et med skolerne ind Document doc; // html dokument fra lectio's side @Override protected void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); setcontentview(r.layout.activity_main); Side 20 af 33
//Skal være her for at kunne bruge internettet i main class if (android.os.build.version.sdk_int > 9) { StrictMode.ThreadPolicy policy = new Strict- Mode.ThreadPolicy.Builder().permitAll().build(); StrictMode.setThreadPolicy(policy); //Siger den skal starte funktion processdata processdata(); mlistview = (ListView) findviewbyid(r.id.listview); madapter = new ArrayAdapter<String>(this, android.r.layout.simple_list_item_1, android.r.id.text1, mdata); mlistview.setadapter(madapter); mlistview.setonitemclicklistener(new OnItemClickListener() { public void onitemclick(adapterview<?> parent, View view, int position, long id) { // Laver en ny variable, som når bliver udført start et nyt vindu Intent activityloginopen = new Intent(MainActivity.this, Elev.class); // Finder den position som personen klikker på int itemposition = position; // Giver den globale variable linket til den skole som personen klikker på mstore = mlinks.get(itemposition); // Starter det nye vindu startactivityforresult(activityloginopen, 0); ); public void processdata() { String URL = "https://www.lectio.dk/lectio/login_list.aspx?forcemobile=1"; try { doc = Jsoup.connect(URL).userAgent("Mozilla/5.0 (Macintosh; U; Intel Mac OS X; de-de) AppleWebKit/523.10.3 (KHTML, like Gecko) Version/3.0.4 Safari/523.10").get(); Side 21 af 33
Elements skolenavne = doc.select(".buttonheader a"); for(element skole: skolenavne) { mdata.add(skole.text()); mlinks.add(skole.attr("href")); catch (Exception ex) { ex.printstacktrace(); mdata.clear(); mdata.add("ingen internetforbindelse: " + ex.tostring()); activity_main.xml <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:paddingbottom="@dimen/activity_vertical_margin" android:paddingleft="@dimen/activity_horizontal_margin" android:paddingright="@dimen/activity_horizontal_margin" android:paddingtop="@dimen/activity_vertical_margin" tools:context=".mainactivity" > <ListView android:id="@+id/listview" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_alignparentleft="true" android:layout_alignparenttop="true" > </ListView> </RelativeLayout> Elev.java package com.example.lectiologin; import java.util.arraylist; Side 22 af 33
import org.jsoup.jsoup; import org.jsoup.nodes.document; import org.jsoup.nodes.element; import org.jsoup.select.elements; import android.app.activity; import android.content.intent; import android.os.bundle; import android.view.view; import android.widget.adapterview; import android.widget.arrayadapter; import android.widget.listview; import android.widget.adapterview.onitemclicklistener; public class Elev extends Activity { ArrayAdapter<String> madapter; ArrayAdapter<String> madapter2; ArrayList<String> mlinks = new ArrayList<String>(); ArrayList<String> eleverlink = new ArrayList<String>(); ArrayList<String> elevertext = new ArrayList<String>(); ArrayList<String> bs = new ArrayList<String>(); ArrayList<String> bslink = new ArrayList<String>(); Document doc; Document doc2; public static String mstore; public static String mstore2; public static String skema; public static String URL3; String skolenr; String forcemobile = "&forcemobile=1"; String URL = MainActivity.lectio + MainActivity.mStore + forcemobile; String URL2; String fskema; ListView mlistelever; ListView mlistbogstav; protected void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); setcontentview(r.layout.activity_elev); Side 23 af 33
// Downloader den skole personen trykker på getweb(); // Finder elev link'et på skolens forside fskema = mlinks.get(3); if (MainActivity.mStore.length() == 45) { skolenr = MainActivity.mStore.substring(0, 10); else if (MainActivity.mStore.length() == 46) { skolenr = MainActivity.mStore.substring(0, 11); else if (MainActivity.mStore.length() == 47){ skolenr = MainActivity.mStore.substring(0, 12); else { skolenr = MainActivity.mStore.substring(0, 13); // Finder den nye URL til oversigten over skolens elever URL2 = MainActivity.lectio + skolenr + fskema + forcemobile; // Downloader listen om elever getwebelev(); // Indsætter listen med a, b, c,... fra eks. "https://www.lectio.dk/lectio/523/findskema.aspx?type=elev" mlistbogstav = (ListView) findviewbyid(r.id.listviewbogstaver); madapter2 = new ArrayAdapter<String>(this, android.r.layout.simple_list_item_1, android.r.id.text1, bs); mlistbogstav.setadapter(madapter2); // Venter på et klik fra brugerne mlistbogstav.setonitemclicklistener(new OnItemClickListener() { public void onitemclick(adapterview<?> parent, View view, int position, long id) { int itemposition = position; getwebelev(); Side 24 af 33
// Giver den globale variable linket til den skole som personen klikker på mstore2 = bslink.get(itemposition); URL3 = MainActivity.lectio + mstore2 + forcemobile; // Fjerner eleverne fra listviewet madapter.clear(); // Downloader den nye side med elever getwebelev2(); // Laver et redraw af listview'et så de nye elever bliver indsat. run(); ); mlistelever = (ListView) findviewbyid(r.id.listviewelever); madapter = new ArrayAdapter<String>(this, android.r.layout.simple_list_item_1, android.r.id.text1, elevertext); mlistelever.setadapter(madapter); mlistelever.setonitemclicklistener(new OnItemClickListener() { public void onitemclick(adapterview<?> parent, View view, int position, long id) { int itemposition = position; // Giver den globale variable linket til den skole som personen klikker på mstore = eleverlink.get(itemposition); skema = MainActivity.lectio + mstore + forcemobile; Intent activitymitskema = new Intent(Elev.this, mitskema.class); startactivityforresult(activitymitskema, 0); Side 25 af 33
); public void getweb(){ try{ doc = Jsoup.connect(URL).userAgent("Mozilla/5.0 (Macintosh; U; Intel Mac OS X; de-de) AppleWebKit/523.10.3 (KHTML, like Gecko) Version/3.0.4 Safari/523.10").get(); Elements links = doc.select("table[class=island] a"); for(element link: links) { mlinks.add(link.attr("href")); catch (Exception ex) { ex.printstacktrace(); mlinks.clear(); mlinks.add("ingen internetforbindelse: " + ex.tostring()); public void getwebelev(){ try{ doc2 = Jsoup.connect(URL2).userAgent("Mozilla/5.0 (Macintosh; U; Intel Mac OS X; de-de) AppleWebKit/523.10.3 (KHTML, like Gecko) Version/3.0.4 Safari/523.10").get(); Elements bogstaver = doc2.select(".floatblock a"); Elements elevskema = doc2.select("table[id=m_content_contenttbl] a"); eleverlink.clear(); bs.clear(); for(element x: bogstaver) { bslink.add(x.attr("href")); bs.add(x.text()); for(element elev: elevskema) { Side 26 af 33
catch (Exception ex){ eleverlink.add(elev.attr("href")); elevertext.add(elev.text()); public void getwebelev2(){ try{ doc2 = Jsoup.connect(URL3).userAgent("Mozilla/5.0 (Macintosh; U; Intel Mac OS X; de-de) AppleWebKit/523.10.3 (KHTML, like Gecko) Version/3.0.4 Safari/523.10").get(); Elements elevskema = doc2.select("table[id=m_content_contenttbl] a"); eleverlink.clear(); for(element elev: elevskema) { eleverlink.add(elev.attr("href")); elevertext.add(elev.text()); catch (Exception ex){ // Laver et redraw af listviewet public void run(){ madapter.notifydatasetchanged(); mlistelever.invalidateviews(); mlistelever.refreshdrawablestate(); Activity_elev.xml <?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" Side 27 af 33
android:layout_height="match_parent" > <TextView android:id="@+id/elevbogstav" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignparentleft="true" android:layout_alignparenttop="true" android:text="elev bogstav:" android:textappearance="?android:attr/textappearancelarge" /> <ListView android:id="@+id/listviewbogstaver" android:layout_width="match_parent" android:layout_height="180dp" android:layout_alignparentleft="true" android:layout_below="@+id/elevbogstav" android:layout_marginleft="0dp" android:layout_margintop="2dp" > </ListView> <TextView android:id="@+id/elever" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignparentleft="true" android:layout_below="@+id/textview1" android:layout_margintop="230dp" android:text="vælg Elev" android:textappearance="?android:attr/textappearancelarge" /> <ListView android:id="@+id/listviewelever" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_alignparentleft="true" android:layout_margintop="260dp" android:layout_marginleft="0dp" > </ListView> Side 28 af 33
</RelativeLayout> mitskema.java package com.example.lectiologin; import java.util.arraylist; import org.jsoup.jsoup; import org.jsoup.nodes.document; import org.jsoup.nodes.element; import org.jsoup.select.elements; import android.app.activity; import android.os.bundle; import android.widget.arrayadapter; import android.widget.button; import android.widget.listview; public class mitskema extends Activity{ ArrayList<String> mskema = new ArrayList<String>(); ArrayList<String> dag2 = new ArrayList<String>(); ArrayAdapter<String> madapter; ListView mlistskema; ListView mlistelever; ListView mlistview; String skema = Elev.skema; String log; Document doc; Button test; Element test2; protected void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); setcontentview(r.layout.activity_skema2); Side 29 af 33
// Starter funktionen getweb, som er download af elevens skema getweb(); mlistview = (ListView) findviewbyid(r.id.listview1); madapter = new ArrayAdapter<String>(this, android.r.layout.simple_list_item_1, android.r.id.text1, mskema); mlistview.setadapter(madapter); // Downloader elevens skema public void getweb(){ try{ doc = Jsoup.connect(skema).userAgent("Mozilla/5.0 (Macintosh; U; Intel Mac OS X; de-de) AppleWebKit/523.10.3 (KHTML, like Gecko) Version/3.0.4 Safari/523.10").get(); // Finder det div tag i html koden som har class navnet "s2mobiltooltip" // og vælger alt det, som har et <a> tag Elements text = doc.select(".s2mobiltooltip a, h4"); Elements dag = doc.select("h4"); // Finder "title" i <a> tagsne og indsætter den tekst, som tilhøere og indsætter det i et array for(element link: text) { mskema.add(link.attr("title")); for(element t: dag) { dag2.add(t.text()); int x = mskema.indexof(""); mskema.set(x, dag2.get(0)); int x2 = mskema.indexof(""); mskema.set(x2, dag2.get(1)); int x3 = mskema.indexof(""); mskema.set(x3, dag2.get(2)); int x4 = mskema.indexof(""); mskema.set(x4, dag2.get(3)); Side 30 af 33
int x5 = mskema.indexof(""); mskema.set(x5, dag2.get(4)); int x6 = mskema.indexof(""); mskema.set(x6, dag2.get(5)); int x7 = mskema.indexof(""); mskema.set(x7, dag2.get(6)); catch (Exception ex) { Activity_skema2.xml <?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" > <ListView android:id="@+id/listview1" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_alignparentleft="true" android:layout_alignparenttop="true" > </ListView> </RelativeLayout> Side 31 af 33
Bilag 4 - Brugervejledning Installering For at køre applikationen fra windows skal her først downloades Eclipse og android SDK. Det gøres fra denne side. http://developer.android.com/sdk/index.html Efter at have downloadet ADT bundlen for windows skal den unzippes. Efter filen er blevet unzippet skal man åbne den fil som hedder SDK manager.exe. Når programmet er åbnet så sæt et flueben ved Android 4.4.2 (API 19) og vælg install packages. Herefter skal man acceptere googles betegnelser for at installere APIen. Når det er blevet downloadet kan Android SDK manageren lukkes. Herefter åben Eclipse mappen og kør Eclipse.exe. Når Eclipse åbnet så vælg et sted du gerne vil have filerne skal gemmes. Efter dette er valgt skal Eclipse lige have et minut til at loade alle filerne fra android osv. Når Eclipse er helt loadet skal android projektet tilføjes. Dette gøres ved at trykke på File->import. I import vælg Android og så existing Android Code Into Workspace. Find placeringen hvor lectiologin projeket er gemt og sæt flueben ved Copy projects into workspace og tryk finish. Når den har loadet filerne brude der til venstre i programmet være en mappe som hedder Lectiologin. Tryk på den lille fil ud fra mappen. Dette brude vise alle filerne for projektet find src mappen og tryk på den lille pil. Gør det samme for com.example.lectiologin. Så burde her kunne ses 3 java filer. For at køre programmet skal en af de 3 filer være åbne så her dobbelt klikkes på en af dem. For at køre programmet trykkes her Ctrl+F11. Metode 1 med android telefon. Sæt telefonen i USB debugging. Dette gøres ved at bruge developer options inde i sættings på telefonen. Tilslut telefonen til computeren med et USB kabel. Tryk Crtl+F11. På telefonen vil her komme en popup, som spørger om tillades fra computerne til at connecte. Tryk ok. På computeren vil her så komme en liste over online devices vælg den som svare til din telefon og tryk ok. Applikationen vil nu blive installeret på telefonen automatisk og åbent. Side 32 af 33
Metode 2 uden en telefon. Hvis det ikke er muligt at bruge en fysik telefon kan her oprettes en emulator. Prøv at kør applikationen ved at trykke på Ctrl+F11. En boks vil komme frem på skærmen, hvor fra denne menu det vil være muligt at oprette en emulator. Når emulatoren er lavet vil programmet automatisk blive kørt på denne. Endelig metode for installationen er produkt er, at vores produkt findes på Google play store, hvor brugeren her kan vælge at download produktet herfra, hvorefter det vil være klar til brug. Brug af produktet Først vælges applikationen på mobilenheden Herefter finder du den skole, som den person du vil se skemaet for går på Nu vælges eleven, som du vil se skemaet for, evt. brug bogstav funktionen for at finde eleven hurtigere Nu kan skemaet for den valgte person ses fra dagens dato og en uge frem. Side 33 af 33