54
Univerzitet u Beogradu Matematički fakultet Simić Aleksandra Projekat i implementacija informacionog sistema za zadavanje, pregledanje i rešavanje programerskih zadataka MASTER RAD Beograd, Oktobar 2015

Projekat i implementacija informacionog sistema za zadavanje

Embed Size (px)

Citation preview

Page 1: Projekat i implementacija informacionog sistema za zadavanje

Univerzitet u Beogradu

Matematički fakultet

Simić Aleksandra

Projekat i implementacijainformacionog sistema za zadavanje,

pregledanje i rešavanje programerskihzadataka

MASTER RAD

Beograd, Oktobar 2015

Page 2: Projekat i implementacija informacionog sistema za zadavanje

Univerzitet u Beogradu - Matematički fakultetMASTER RAD

Autor: Simić AleksandraNaslov: Projekat i implementacija informacionog

sistema za zadavanje, pregledanje i rešavanje programerskih zadataka

Mentor: dr Saša Malkov, Matematički fakultetČlanovi komisije: dr Vladimir Filipović, Matematički fakultet

dr Mladen Nikolić, Matematički fakultetDatum: x.10.2015

2

Page 3: Projekat i implementacija informacionog sistema za zadavanje

Rezime

Informacioni sistemi predstavljaju jednu od najvažnijih oblasti računarstva.Sa druge strane, zadavanje, pregledanje i rešavanje programerskih zadatakaimaju veliki značaj u procesu školovanja informatičara. Značaj teme ovog radaje u povezivanju ovih oblasti.Cilj rada je da se projektuje i implementira veb zasnovani informacioni sistemza zadavanje, rešavanje i pregledanje programerskih zadataka. Sistem sadržidve namenski različite celine:

• Prva celina pruža interfejs preko kog će nastavnici moći da zadajudomaće zadatke u okviru postojećih kurseva, a studenti će moći dapostavljaju rešenja ovih zadataka i da odmah dobiju povratneinformacije o tačnosti rešenja i potencijalnim greškama. Nastavnici ćebiti obavešteni o aktivnostima studenata i moći će da ispravljaju ocenekoje je sistem dodelio.

• Druga celina omogućava studentima da u svoje slobodno vremeusavršavaju programerska znanja na pažljivo odabranim i razvrstanimzadacima za vežbu. Predlaganjem i dodavanjem zadataka će se zajednobaviti nastavno osoblje i studenti.

Sam postupak ocenjivanja rešenja nije deo ovog rada, već predstavlja posebanprojekat.

3

Page 4: Projekat i implementacija informacionog sistema za zadavanje

Sadržaj1 UVOD.....................................................................................................................52 ANALIZA................................................................................................................5

2.1 Analiza procesa nastave programerskih predmeta...........................................................52.2 Dijagrami toka podataka..................................................................................................72.3 Slučajevi upotrebe...........................................................................................................9

3 PROJEKTOVANJE.................................................................................................183.1 Projektovanje baze podataka.........................................................................................183.2 Shema baze podataka.....................................................................................................233.3 Korisnicki interfejs........................................................................................................23

4 IMPLEMENTACIJA...............................................................................................354.1 Baza podataka................................................................................................................354.2 Serverski deo aplikacije.................................................................................................354.3 Klijentski deo aplikacije................................................................................................414.4 Arhitektura aplikacije.....................................................................................................464.5 Korišćeni alati................................................................................................................46

5 DISKUSIJA............................................................................................................466 ZAKLJUČAK.........................................................................................................47DODATAK...............................................................................................................49

A – Sheme svih tabela baze podataka..................................................................................49REFERENCE............................................................................................................54

4

Page 5: Projekat i implementacija informacionog sistema za zadavanje

1 UVODRad opisuje projekat i implementaciju informacionog sistema za zadavanje,pregledanje i rešavanje programerskih zadataka - Dr. Webgrade. Sistem jeosmišljen sa ciljem da pruži pomoć pri usavršavanju programerskog znanjastudenata kroz mnoštvo različitih, kako domaćih zadataka, tako i zadatakanamenjenih za vežbu. Dodatno, plan je da sistem bude korišćen usvakodnevnoj nastavi na svim nivoima.

2 ANALIZA

2.1 Analiza procesa nastave programerskih predmeta

Kursevi

Svake godine studenti se upisuju na predviđene kurseve. Kurs se smatrauspešno položenim ako je student ispunio sve svoje obaveze na tom kursu,propisane od strane zaduženog lica. Zaduženo lice je koordinator kursa.Ukoliko kurs ima jednog predmetnog nastavnika on je ujedno i koordinator.Ako usled velikog broja studenata na kursu postoji više predmetnihnastavnika, jedan od njih je najčešće koordinator. Propisane obaveze su:predispitne obaveze i ispit. Predispitne obaveze su sačinjene od nekekombinacije teorijskih i praktičnih testova, kolokvijuma, seminarskih radova idomaćih zadataka. Ideja predispitnih obaveza je da studenti redovnije radepredmet i kao posledica toga, da ga bolje ga savladaju. Uprkos tome, veliki brojkurseva od predispitnih obaveza ima samo jedan kolokvijum, čime se nepostiže željeni efekat predispitnih obaveza.

Nastava programerskih predmeta se realizije kroz predavanja i vežbe, koji nemoraju biti usko povezani. Na predavanjima se rade teorijski koncepti bitni zataj kurs, dok se na vežbama rešavaju programerski problemi. Nastavnicipredaju korišćenjem prezentacija, koje su napravljene na osnovu stručneliterature ili direktno pišu sadržaj na tabli i pružaju dodatna objašnjenja.Predavanja retko obuhvataju veći broj programskih kodova, a čak i onda kadih obuhvataju, studenti ih ne kucaju, već oni samo bivaju prikazani kaododatni primeri.

U slučaju vežbi, koncept je značajno drugačiji, međutim pokazuje se da i natom polju postoji problem. Kako se praktično znanje (programiranje) retkoopsežnije obrađuje na profesorskim predavanjima, vežbe postaju opterećenekoličinom gradiva koja treba se pređe. Posledica je da količina usvojenoggradiva i to šta je student sposoban samostalno da isprogramira, najčešće nisuna željenom nivou.

Problemi

Glavne probleme predstavljaju mala prolaznost kurseva, koja vodi ka tome da

5

Page 6: Projekat i implementacija informacionog sistema za zadavanje

previše studenata sluša taj kurs, premali broj programerskih kodova kojeprosečan student uspešno iskuca za vreme kursa i slično. Da bi ove tvrdnjebile potkrepljene primerima, ovo su konkretni rezultati u okviru nekihpredmeta:

1. Programiranje 2, I smer, školska 2012/2013 godina:

◦ kurs je pohađalo 260 studenata

◦ kurs je položio 61 student (23.5%)

2. Prevođenje programskih jezika, I smer, školska 2012/2013 godina

◦ kurs je pohađalo 94 studenata

◦ kurs je položilo 28 studenata (42%)

3. Operativni sistemi, I smer, školska 2012/2013

◦ kurs je pohađalo 94 studenata

◦ kurs je položilo 20 studenata (21.3%)

Što se navedenih predmeta tiče, rezultati su slični i ako se pogledaju drugeškolske godine. Bitno je navesti još neke predmete čija prolaznost nije loša, ačiji koncept može značajno da se promeni tako da se podigne nivo znanja kodstudenata. Na algoritamskim predmetima nema kodiranja, nego se sveobjašnjava u pseudo-kodu. Kao posledica toga, studenti nemaju predstavu oimplementacionim aspektima algoritama koje uče. Ne znaju na koje sveprobleme mogu da naiđu, pa samim tim ni kako da ih reše.

Sa druge strane, asistenti često stavljaju akcenat na određene delove gradivakoje bi sudenti trebalo da usavrše samostalnim radom. Kako je to samoneformalna sugestija, čije se ispunjenje ne proverava, studenti običnozanemare predloženo na svoju štetu.

Ideja je da se korišćenjem sistema Dr. Webgrade uvede formalna obaveza čijese ispunjenje lako prati. Dodatno, studenti će se navikavati da moraju dazadovolje forme ulaza i izlaza, sa kojima će se sretati na kolokvijumima iispitima, kao i da ispoštuju zadata memorijska i vremenska ograničenja.Navedene prednosti koje sistem pruža bi trebalo da u velikoj meri povećajuznanje, pa samim tim i prolaznost studenata na programerskim kursevima.

Nastavnici će takođe imati dosta koristi od samog sistema. Prvenstveno,oslobodjeni su pregledanja radova - sistem to radi za njih. Dodatno, pružen imje jako dobar interfejs za pregledanje studentskih kodova i eventualnupromenu broja poena, ukoliko smatraju da student zaslužuje manje ili višepoena. Pored toga, na raspolaganju su im statistike za svaki predmet, odnosnostatistike za svaki domaći zadatak, iz kojih mogu da vide koliko studenata jerešilo koji zadatak i iz kog broja pokušaja. Na osnovu toga mogu da zaključujukoje gradivo su studenti bolje, odnosno lošije usvojili i da na vežbama staveakcenat na to lošije usvojeno gradivo.

6

Page 7: Projekat i implementacija informacionog sistema za zadavanje

2.2 Dijagrami toka podatakaNa dijagramu konteksta svi procesi sistema su predstavljeni jednim procesom– Rad sa programerskim zadacima. Prikazano je sa kojim entitetima(Nastavnik, Student, Moderator) i skladištima podataka (Baza podataka) sisteminteraguje.

Slika 1: Dijagram konteksta sistema

Na dijagramu prvog nivoa glavni proces delimo na dva podprocesa:

1. Rad sa domaćim zadacima

2. Rad sa zadacima za vežbu

Slika 2: Dijagram toka podataka, nivo 1

Što se tiče dijagrama drugog nivoa, tu su detaljnije opisani procesi „Rad sadomaćim zadacima“ i „Rad sa zadacima za vežbu“. Pored toga, precizno suprikazani tokovi podataka između entiteta, procesa i skladišta podataka.

Proces „Rad sa domaćim zadacima“ se sastoji od 6 potprocesa: „Pregledzadataka po kursevima“, „Rešavanje zadatka“, „Dodavanje zadatka“,„Ažuriranje zadatka“, „Pregledanje rešenja“ i „Pregledanje statistike“ (slika 3).

7

Page 8: Projekat i implementacija informacionog sistema za zadavanje

Slika 3: Dijagram toka podataka, nivo 2, modul „Rad sa domaćim zadacima“

Slika 4: Dijagram toka podataka, nivo 2, modul „Rad sa zadacima za vežbu“

8

Page 9: Projekat i implementacija informacionog sistema za zadavanje

Proces „Rad sa zadacima za vežbu“ se takođe sastoji iz 6 potprocesa i oni su:„Rešavanje zadatka“, „Predlaganje novog zadatka“, „Odobravanje predloženogzadatka“, „Dodavanje novog zadatka“, „Ažuriranje zadatka“ i „Pregledanjestatistike“ (slika 4).

2.3 Slučajevi upotrebe

2.3.1. Modul domaći

U okviru modula za domaće zadatke prepoznati su sledeći slučajevi upotrebe:

1. Pregledanje domaćih zadataka po kursevima

2. Rešavanje domaćeg zadatka

3. Dodavanje novog domaćeg zadatka

4. Ažuriranje domaćeg zadatka

5. Pregledanje rešenja domaćeg zadatka

6. Pregledanje statistike domaćeg zadatka

Slika 5a: Dijagram slučajeva upotrebe za modul domaći zadaci

2.3.1.1 Pregledanje domaćih zadataka po kursevima

1. Kratak opis: Student bira kurs za koji želi da vidi domaće zadatke.Prikazuje mu se lista domaćih zadataka za izabrani kurs.

2. Učesnik: Student

3. Preduslovi: Student je upisan na neki kurs u tekućoj školskoj godini.

4. Postuslovi: Otvorena je stranica sa domaćim zadacima za izabrani kurs.

5. Osnovni tok:

Student bira kurs za koji želi da vidi domaće zadatke.

Prikazuju se dve liste zadataka:

9

Page 10: Projekat i implementacija informacionog sistema za zadavanje

1. Zadaci koje student može da rešava

2. Zadaci kojima je prošao rok za izradu

Za svaki zadatak se prikazuje naziv, period trajanja domaćeg zadatka,broj poena koje zadatak nosi i maksimalan broj poena koje je studentostvario na tom zadatku (ako ga do tog trenutka nije rešavao, prikazaćese 0)

Student može da izabere neki od zadataka iz prve liste i time prelazi naslučaj upotrebe „Rešavanje domaćeg zadatka“.

6. Alternativni tok:

Nema domaćih zadataka: Ukoliko na izabranom kursu nema domaćihzadataka, studentu se prikazuje odgovarajuća poruka.

2.3.1.2 Rešavanje domaćeg zadatka

1. Kratak opis: Student postavlja rešenje za izabrani domaći zadatak.Sistem ocenjuje okačeno rešenje na osnovu test primera i obaveštavastudenta o broju osvojenih poena.

2. Učesnik: Student

3. Preduslovi: Student je upisan na bar jedan kurs na kom postoji barjedan domaći zadatak.

4. Postuslovi: Student je obavešten o tačnosti rešenja koje je okačio.

5. Osnovni tok:

Student bira neki od ponuđenih domaćih zadataka.

Za izabrani zadatak se prikazuje: naziv, tekst, vremensko ograničenje,memorijsko ograničenje, lista ponudjenih programskih jezika u kojimaje moguće rešiti zadatak, rok za izradu, dosadašnji broj pokušaja togstudenta da reši zadatak kao i najveći broj poena osvojen pri timpokušajima.

Student označava programski jezik koji je koristio za rešavanje zadatka.

Student šalje fajl sa rešenjem.

Student bira opciju „Pošalji“.

Sistem vrši ocenjivanje zadatka na zadatim test primerima.

Kako koji test primer prođe ili ne prođe, sistem o tome obaveštavastudenta.

Po završetku testiranja, sistem ispisuje konačan broj poena, kao iporuku za svaki od test primera.

Poruke mogu biti:

1. Tačno rešenje

2. Netačno rešenje

3. Prekoračenje vremenskog ograničenja

4. Prekoračenje memorijskog ograničenja

5. Greška pri kompajliranju (sa porukom o grešci koji je kompajlervratio)

10

Page 11: Projekat i implementacija informacionog sistema za zadavanje

6. Greška pri izvršavanju (sa porukom o grešci koju je ocenjivačvratio)

6. Alternativni tokovi:

Izabrani programski jezik i vrsta datoteke u kojoj je smeštenorešenje se ne poklapaju: Rešenje neće biti poslato na obradu. Sistemprikazuje odgovarajuću poruku.

Napuštanje stranice dok je ocenjivanje još uvek u toku: Sistemboduje okačeno rešenje sa 0 poena i broj pokušaja rešavanja zadatka seuvećava za 1.

2.3.1.3 Dodavanje novog domaćeg zadatka

1. Kratak opis: Nastavnik zadaje novi domaći zadatak u okviru nekog odkurseva koje predaje.

2. Učesnik: Nastavnik

3. Preduslovi: Nastavnik predaje bar jedan kurs u tekućoj školskoj godini

4. Postuslovi: Postavljen je novi domaći zadatak i svi studenti koji suupisani na odgovarajući kurs (kod nastavnika koji je zadao zadatak zataj kurs) su obavešteni o tome.

5. Osnovni tok:

Nastavnik bira kurs za koji želi da zada novi domaći zadatak.

Nastavnik bira opciju „Dodaj novi domaći“.

Sistem prikazuje formular za dodavanje novog domaćeg zadatka nakom se nalaze polja za unos:

1. Naziva zadatka

2. Teksta zadatka

3. Test primera

4. Programskih jezika u kojima student može da reši taj zadatak

5. Vremenskog ograničenja

6. Memorijskog ograničenja

7. Perioda trajanja domaćeg zadatka

8. Broja poena koje on nosi

Nastavnik unosi podatke u formular.

Nastavnik bira opciju „Dodaj“.

Sistem čuva domaći zadatak.

Sistem obaveštava sve studente koji slušaju odgovarajući kurs kod ovognastavnika o tome da je postavljen novi domaći zadatak.

6. Alternativni tokovi:

Neispravan unos: Ukoliko nastavnik propusti da unese neki odpodataka ili unese neispravan podatak, sistem ispisuje odgovarajućuporuku.

11

Page 12: Projekat i implementacija informacionog sistema za zadavanje

Prekid unosa: Ukoliko nastavnik napusti trenutnu stranicu, unos novogzadatka se obustavlja i uneti podaci neće biti zapamćeni.

2.3.1.4 Ažuriranje domaćeg zadatka

1. Kratak opis: Nastavnik ažurira neki od domaćih zadataka zadataka kojeje prethodno zadao.

2. Učesnik: Nastavnik

3. Preduslovi: Nastavnik je prethodno zadao bar jedan domaći zadatak.

4. Postuslovi: Zadatak je izmenjen i studenti su obavešteni o izmeni.

5. Osnovni tok:

Nastavnik bira kurs.

Sistem ispisuje listu svih domaćih zadataka koje je nastavnik zadao naizabranom kursu.

Nastavnik bira da izmeni domaći zadatak klikom na opciju „Izmenidomaći“.

Sistem prikazuje formular popunjen prethodno unetim podacima.

Nastavnik unosi izmene.

Nastavnik bira opciju „Potvrdi izmene“.

Sistem snima izmene.

Sistem obaveštava sve studente koji slušaju odgovarajući kurs kod ovognastavnika o izmenama domaćeg zadatka.

6. Alternativni tokovi:

Neispravan unos: Ukoliko nastavnik izostavi da unese neki od podatakaili unese neispravan podatak, sistem ispisuje odgovarajuću poruku.

Prekid unosa: Ukoliko nastavnik napusti trenutnu stranicu, unetipodaci neće biti zapamćeni.

2.3.1.5 Pregledanje rešenja domaćeg zadatka

1. Kratak opis: Nastavnik pregleda kodove koje su studenti okačili kaorešenja domaćeg zadatka i ukoliko misli da je to potrebno, vrši promenubroja poena koje je sistem dodelio nekom studentu na tom zadatku.

2. Učesnik: Nastavnik

3. Preduslovi: Nastavnik je zadao bar jedan domaći zadatak.

4. Postuslovi: Ukoliko je nastavnik promenio broj poena za nekogstudenta, ta promena je sačuvana u bazi i student je obavešten o tome.

5. Osnovni tok:

Nastavnik bira kurs.

Sistem ispisuje listu svih domaćih zadataka koje je nastavnik zadao naizabranom kursu.

Nastavnik bira da pregleda studentska rešenja, izborom opcije„Pregledaj rešenja“ .

12

Page 13: Projekat i implementacija informacionog sistema za zadavanje

Sistem prikazuje listu studenata koji su pokušali da reše zadatak. Uzsvakog studenta stoji maksimalan broj poena koji su osvojili pri timpokušajima, kao i dve opcije: „Pregledaj najbolje rešenje“ i „Pregledaj svarešenja“.

1. Nastavnik bira opciju „Pregledaj najbolje rešenje“:

Sistem prikazuje rešenje kojem je dodeljeno najviše poena, a kojeje okačio taj student.

Nastavnik pregleda kod.

1.1 Nastavnik vrši promenu broja poena za tog studenta.

Nastavnik potvrđuje promenu klikom na dugme „Potvrdi“.

Sistem snima promenu.

Sistem obaveštava studenta o promeni.

1.2 Nastavnik prelazi na sledećeg studenta klikom na dugme „Sledeći“.

1.3 Nastavnik prelazi na prethodnog studenta klikom na dugme „Prethodni“.

Nastavnik ponavlja prethodna tri koraka dokle god smatra da je topotrebno.

2. Nastavnik bira opciju „Pregledaj sva rešenja“

Sistem prikazuje listu svih rešenja koje je okačio jedan student. Zasvako rešenje prikazuje broj poena koji mu je dodeljen i datumkada je to rešenje postavljeno. Datu listu je moguće sortirati kakopo broju poena, tako i po datumu.

Nastavnik bira da pregleda neko od rešenja izborom opcije„Pregledaj rešenje“.

Nastavnik pregleda kod.

1.1 Nastavnik vrši promenu broja poena za tog studenta.

Nastavnik potvrđuje promenu klikom na dugme „Potvrdi“.

Sistem snima promenu.

Sistem obaveštava studenta o promeni.

1.2 Nastavnik prelazi na sledeće rešenje izborom opcije „Sledećerešenje“.

1.3 Nastvanik prelazi na prethodno rešenje izborom opcije„Prethodno rešenje“.

Nastavnik ponavlja prethodna tri koraka dokle god smatra da jeto potrebno.

6. Alternativni tokovi:

Neispravan unos: Ukoliko nastavnik unese veći broj poena nego što tajzadatak nosi, sistem ispisuje odgovarajuću poruku.

Prekid unosa: Ukoliko nastavnik napusti stranicu pre nego što potvrdiunos broja poena, uneti podaci neće biti zapamćeni.

13

Page 14: Projekat i implementacija informacionog sistema za zadavanje

2.3.1.6 Pregledanje statistike domaćih zadataka

1. Kratak opis: Nastavnik pregleda statistike domaćeg zadatka.

2. Učesnik: Nastavnik

3. Preduslovi: Nastavnik je zadao bar jedan domaći zadatak.

4. Postuslovi: Nastavnik ima uvid u sve statistike vezane za domaćizadatak.

5. Osnovni tok:

Nastavnik bira kurs.

Sistem prikazuje:

1. Listu domaćih zadataka

2. Listu studenata koji slušaju taj kurs

3. Statističke podatke za svaki od domaćih zadataka.

Nastavnik pregleda statistike.

6. Alternativni tokovi: /

2.3.2. Modul vežbanje

U okviru modula vežbanje prepoznati su sledeći slučajevi upotrebe:

1. Rešavanje zadatka za vežbu

2. Predlaganje novog zadatka za vežbu

3. Odobravanje predloženog zadatka

4. Dodavanje novog zadatka za vežbu

5. Ažuriranje zadatka za vežbu

6. Pregledanje statistike zadatka za vežbu

Slika 5b: Dijagram slučajeva upotrebe za modul vežbanje

14

Page 15: Projekat i implementacija informacionog sistema za zadavanje

2.3.2.1 Rešavanje zadatka za vežbu

1. Kratak opis: Student postavlja rešenje za izabrani zadatak za vežbu.Sistem ocenjuje okačeno rešenje na osnovu test primera i obaveštavastudenta o tačnosti rešenja.

2. Učesnik: Student

3. Preduslovi: Na sistemu postoji bar jedan zadatak za vežbu.

4. Postuslovi: Rešenje je sačuvano i student je obavešten o tačnosti togrešenja.

5. Osnovni tok:

Student bira neki od ponuđenih zadataka za vežbu.

Za izabrani zadatak se prikazuje: naziv, tekst, vremensko ograničenje,memorijsko ograničenje, lista ponudjenih programskih jezika u kojimaje moguće rešiti zadatak, dosadašnji broj pokušaja tog studenta da rešizadatak kao i najveći broj poena osvojen pri tim pokušajima.

Student bira programski jezik koji je koristio za rešavanje zadatka.

Student bira fajl sa rešenjem.

Student bira opciju „Pošalji“.

Sistem vrši ocenjivanje zadatka na zadatim test primerima.

Kako koji test primer prođe ili ne prođe, sistem o tome obaveštavastudenta.

Po završetku testiranja, sistem ispisuje konačan broj poena, kao iporuku za svaki od test primera.

Poruke mogu biti:

1. Tačno rešenje

2. Netačno rešenje

3. Prekorašenje vremenskog ograničenja

4. Prekoračenje memorijskog ograničenja

5. Greška pri kompajliranju (sa porukom o grešci koji je kompajlervratio)

6. Greška pri izvršavanju (sa porukom o grešci koju je ocenjivačvratio)

6. Alternativni tokovi:

Izabrani programski jezik i ekstenzija rešenja se ne poklapaju:Rešenje neće biti poslato na obradu. Sistem prikazuje odgovarajućuporuku.

Napuštanje stranice dok je ocenjivanje još uvek u toku: Sistemboduje okačeno rešenje sa 0 poena i broj pokušaja rešavanja zadatka seuvećava za 1.

2.3.2.2 Predlaganje novog zadatka za vežbu

1. Kratak opis: Nastavnik ili student (u daljem tekstu „Akter“), predlažu daneki zadatak bude svrstan među zadatke za vežbu. Ovakvi zadaci, da bi

15

Page 16: Projekat i implementacija informacionog sistema za zadavanje

bili prikazani, moraju biti odobreni od strane moderatora sistema.

2. Učesnici: Nastavnik, Student

3. Preduslovi: /

4. Postuslovi: Predloženi zadatak je snimljen i moderator je obavešten otome.

5. Osnovni tok:

Akter bira da predloži novi zadatak izborom opcije „Dodaj novizadatak“.

Sistem prikazuje formular za dodavanje novog zadatka na kom senalaze polja za unos:

1. Naziva zadatka

2. Teksta zadatka

3. Test primera

4. Vremenskog ograničenja

5. Memorijskog ograničenja

6. Kategorije

Akter unosi podatke u formular.

Akter bira opciju „Dodaj“.

Sistem pamti predlog zadatka za vežbu.

Sistem obaveštava moderatora o ovom predlogu.

6. Alternativni tokovi:

Neispravan unos: Ukoliko akter izostavi da unese neki od obaveznihpodataka ili unese neispravan podatak, sistem ispisuje odgovarajućuporuku.

Prekid unosa: Ukoliko akter napusti trenutnu stranicu, uneti podacineće biti zapamćeni.

2.3.2.3 Odobravanje predloženog zadatka

1. Kratak opis: Moderator vrši proveru nekog od predloženih zadataka zavežbu i odlučuje da odobri ili odbije taj zadatak. Osoba koja je predložilataj zadatak biva obaveštena o odluci moderatora

2. Učesnik: Moderator

3. Preduslovi: Postoji bar jedan predložen zadatak za vežbu.

4. Postuslovi: Zadatak je usvojen ili odbijen i osoba koja ga je predložila jeobaveštena o tome.

5. Osnovni tok:

Moderator pregleda sve predloge izborom opcije „Lista predloženihzadataka“.

Sistem prikazuje listu zadataka. Uz svaki od zadataka stoji i ko ga je ikada predložio i opcija „Vidi detalje“.

Moderator bira opciju „Vidi detalje“.

16

Page 17: Projekat i implementacija informacionog sistema za zadavanje

Sistem prikazuje popunjen formular predloga zadatka za vežbu.

Moderator proverava sve unete podatke.

Moderator po potrebi vrši izmene nekih podataka.

1.1 Moderator odobrava predlog zadatka izborom opcije „Odobri“.

1.2 Moderator odbija predlog zadatka izborom opcije „Odbij“.

Sistem obaveštava korisnika koji je predložio zadatak o odlucimoderatora.

6. Alternativni tokovi:

Neispravan unos: Ukoliko moderator izostavi da unese neki odpodataka ili unese neispravan podatak, sistem ispisuje odgovarajućuporuku.

Prekid unosa: Ukoliko moderator napusti stranicu, promene neće bitizapamćene.

2.3.2.4 Dodavanje novog zadatka za vežbu

1. Kratak opis: Moderator zadaje novi zadatak za vežbu.

2. Učesnik: Moderator

3. Preduslovi: /

4. Postuslovi: Postavljen je novi zadatak za vežbu.

5. Osnovni tok:

Moderator bira opciju „Dodaj novi zadatak“.

Sistem prikazuje formular za dodavanje novog zadatka za vežbu na komse nalaze polja za unos:

1. Naziva zadatka

2. Teksta zadatka

3. Test primera

4. Vremenskog ograničenja

5. Memorijskog ograničenja

6. Kategorija

Moderator unosi podatke u formular.

Moderator bira opciju „Dodaj“.

Sistem potvrđuje da je zadatak uspešno dodat.

6. Alternativni tokovi:

Neispravan unos: Ukoliko moderator izostavi da unese neki odpodataka ili unese neispravan podatak, sistem ispisuje odgovarajućuporuku.

Prekid unosa: Ukoliko moderator napusti trenutnu stranicu, unosnovog zadatka se obustavlja i uneti podaci neće biti zapamćeni.

2.3.2.5 Ažuriranje zadatka za vežbu

1. Kratak opis: Moderator ažurira neki od zadataka koje je prethodno

17

Page 18: Projekat i implementacija informacionog sistema za zadavanje

dodao.

2. Učesnik: Moderator

3. Preduslovi: Moderator je prethodno dodao bar jedan zadatak za vežbu.

4. Postuslovi: Zadatak za vežbu je uspešno izmenjen.

5. Osnovni tok:

Moderator otvara listu svih zadataka izborom opcije „Zadaci za vežbu“.

Sistem prikazuje zadatke i uz svaki zadatak nalazi se opcija „Izmeni“.

Moderator bira da izmeni zadatak klikom na ovu opciju.

Sistem prikazuje formular popunjen prethodno unetim podacima.

Moderator unosi izmene.

Moderator bira opciju „Potvrdi izmene“.

Sistem potvrđuje da je zadatak uspešno promenjen.

6. Alternativni tokovi:

Neispravan unos: Ukoliko moderator izostavi neki od podataka iliunese neispravan podatak, sistem ispisuje odgovarajuću poruku.

Prekid unosa: Ukoliko moderator napusti trenutnu stranicu, unetipodaci neće biti zapamćeni.

2.3.2.6 Pregledanje statistike zadataka za vežbu

1. Kratak opis: Nastavnik, Student ili Moderator (u daljem tekstu korisniksistema) pregleda statističke podatke nekog zadatka za vežbu.

2. Učesnici: Nastavnik, Student, Moderator

3. Preduslovi: /

4. Postuslovi: Korisnik sistema ima uvid u statističe podatke vezane zaizabrani zadatak.

5. Osnovni tok:

Korisnik sistema otvara listu svih zadataka izborom opcije „Zadaci zavežbu“.

Sistem prikazuje listu zadataka, pri čemu uz svaki od zadataka postojiopcija „Statistike“.

Korisnik sistema bira pomenutu opciju.

Sistem prikazuje statističke podatke vezane za izabrani zadatak.

6. Alternativni tokovi: /

3 PROJEKTOVANJE

3.1 Projektovanje baze podatakaRadi preglednosti i boljeg razumevanja, baza podataka će takođe biti opisanakroz dva glavna modula: domaći zadaci i zadaci za vežbu. Neki od entiteta subitni za oba modula, pa se iz tih razloga navode po dva puta (iz različitog ugla),

18

Page 19: Projekat i implementacija informacionog sistema za zadavanje

ali oni se odnose na jedan isti entitet (npr. ProgrammingLanguage iliAssignment).

3.1.1. Modul domaći zadaci

Detaljnom analizom slučajeva upotrebe, prepoznati su sledeći nezavisnientiteti, kao i podaci koji opisuju taj entitet:

1. Zadatak (Assignment) – Predstavlja jedan zadatak (kako domaćizadatak tako i zadatak za vežbu). Može se opisati pomoću sledećihpodataka:

◦ Naziv zadatka

◦ Tekst zadatka

◦ Vremensko ograničenje

◦ Memorijsko ograničenje

◦ Primeri za testiranje

◦ Kategorija – u slučaju domaćeg zadatka ovo polje će imativrednost 0

◦ Autor zadatka – u slučaju domaćeg zadatka ovo polje će imativrednost NULL

2. Domaći zadatak (Homework) – predstavlja jedan domaći zadatak.Može se opisati pomoću sledećih podataka:

◦ Profesor koji je zadao zadatak

◦ Kurs u okviru kog je zadat zadatak

◦ Od kada do kada je moguće poslati rešenje zadatka (period izrade)

◦ Broj poena koje zadatak nosi

◦ Svi podaci o zadatku koji su navedeni u okviru entitetaAssignment

3. Rešenje domaćeg zadatka (HomeworkSolution) – predstavlja jedanpokušaj rešavanja domaćeg zadatka. Može se opisati pomoću sledećihpodataka:

◦ Domaći zadatak za koji je poslato rešenje

◦ Student koji je pokušao da reši zadatak

◦ Vreme kada je poslao rešenje

◦ Rešenje zadatka (programski kod koji je student poslao)

◦ Broj poena koje je sistem dodelio tom rešenju

4. Programski jezik (ProgrammingLanguage) – Predstavlja jedanprogramski jezik u kom je moguće slati rešenja zadataka. Može seopisati pomoću sledećih podataka:

◦ Naziv programskog jezika

19

Page 20: Projekat i implementacija informacionog sistema za zadavanje

5. Kurs (Course) – Predstavlja jedan predmet (kurs) koji se drži u tekućojškolskoj godini. Može se opisati pomoću sledećih podataka:

◦ Naziv predmeta

◦ Oznaka predmeta

◦ Semestar u kom se predmet sluša (1 ili 2)

6. Korisnik (User) – Predstavlja jednog korisnika sistema. Može se opisatipomoću sledećih podataka:

◦ Korisničko ime

◦ Šifra

◦ Ime

◦ Prezime

◦ Tip korisnika (Nastavnik, Student, Moderator)

◦ E-mail adresa

◦ Slika

7. Nastavnik (Professor) – Predstavlja jednog nastavnika. Može se opisatipomoću svih podataka koji su već navedeni u tabeli User.

8. Student (Student) – Predstavlja jednog studenta. Može se opisatipomoću sledećih podataka:

◦ Broj indeksa

◦ Svi podaci koji su već navedeni u tabeli User

Primetimo da jednom domaćem zadatku može biti pridruženo višeprogramskih jezika u kojima je moguće rešiti taj zadatak, kao i da jedanprogramski jezik može biti pridružen većem broju domaćih zadataka. Zbogtoga nastaje asocijativni entitet HomeworkProgrammingLanguage.

Takođe, jedan nastavnik može držati više predmeta (kurseva), ali i jedanpredmet može držati više nastavnika. Kao posledica, nastaje asocijativnientitet ProfessorCourse. Slično, jedan student može slušati više predmeta i najednom predmetu može biti upisano više studenata, odakle nastaje asocijativnientitet StudentCourse.

Dobijeni dijagram entiteta i odnosa prikazan je na slici 6.

3.1.2. Modul vežbanje

Detaljnom analizom slučajeva upotrebe, prepoznati su sledeći nezavisnientiteti, kao i podaci koji opisuju taj entitet:

1. Zadatak (Assignment) – predstavlja jedan zadatak za vežbu koji jepredložio bilo koji korisnik sistema, a koji je odobren od stranemoderatora sistema. Može se opisati pomoću sledećih podataka:

◦ Naziv

◦ Tekst zadatka

20

Page 21: Projekat i implementacija informacionog sistema za zadavanje

◦ Vremensko ograničenje za rešavanje

◦ Memorijsko ograničenje za rešavanje

◦ Kategorija u kojoj se zadatak nalazi

◦ Programski jezici u kojima je moguće rešiti zadatak

◦ Težina zadatka (vrednost 1-5)

◦ Test primeri

◦ Korisnik sistema koji je autor zadatka

◦ Polje koje će označavati status zadaka (da li je u pitanju predlogzadatka, zadatak u pripremi ili kompletiran zadatak)

2. Programski jezik (ProgrammingLanguage) – predstavlja jedanprogramski jezik u kom je moguće rešiti neki od zadataka. Može seopisati pomoću sledećih podataka:

◦ Naziv programskog jezika

3. Kategorija (Category) – predstavlja jednu kategoriju zadatka za vežbu.Radi finije podele i bolje organizacije, svaka kategorija ima tačno jednuroditeljsku kategoriju. Može se opisati pomoću sledećih podataka:

◦ Naziv kategorije

◦ Naziv roditeljske kategorije

4. Rešenje zadatka (AssignmentSubmission) – predstavlja jedno rešenjenekog od zadataka za vežbu. Ovde se čuva samo najbolje rešenje zasvakog korisnika sistema. Može se opisati pomoću sledećih podataka:

◦ Korisnik koji je pokušao da reši zadatak

◦ Zadatak koji je pokušao da reši

◦ Rešenje koje je korisnik poslao

◦ Procenat tačnosti rešenja

◦ Broj pokušaja da se reši zadatak

Primetimo da jednom zadatku može biti pridruženo više programskih jezika ukojima je moguće rešiti taj zadatak, kao i da jedan programski jezik može bitipridružen većem broju zadataka. Odavde nastaje asocijativni entitetAssignmentProgrammingLanguage. Dobijeni dijagram entiteta i odnosaprikazan je na slici 6.

21

Page 22: Projekat i implementacija informacionog sistema za zadavanje

Slika 6: Dijagram entiteta i odnosa

22

Page 23: Projekat i implementacija informacionog sistema za zadavanje

3.2 Shema baze podatakaPrevođenjem entiteta i njihovih međusobnih odnosa u tabele dobija se shemabaze podataka prikazana u tabeli 1.

Tabela Opis

Assignment Podaci o zadacima

Homework Podaci o domaćim zadacima

ProgrammingLanguage Podaci o programskim jezicima

HomeworkSolution Podaci o rešenjima domaćih zadataka

User Podaci o korisnicima

Professor Podaci o nastavnicima

Student Podaci o studentima

Course Podaci o predmetima

ProfessorCoursePodaci koji opisuju koji nastavnik drži koji predmet

StudentCoursePodaci koji opisuju koji student sluša koji predmet kod kog nastavnika

HomeworkProgrammingLanguagePodaci koji opisuju koji domaći zadatak je moguće rešiti u kom programskom jeziku

Category Podaci o kategorijama zadataka za vežbu

AssignmentProgrammingLanguagePodaci koji opisuju koji zadatak za vežbu je moguće rešiti u kom programskom jeziku

AssignmentSubmission Podaci o rešenjima zadataka za vežbu

Notification Podaci o obaveštenjimaTabela 1: Shema baze podataka

U dodatku A je dat detaljan opis svih tabela sheme baze podataka.

3.3 Korisnicki interfejs

3.3.1 Deo aplikacije namenjen nastavnicima

Kada se uloguju na sistem, nastavnicima se prikazuje njihova početnastranica. Na njoj imaju pregled svih obaveštenja, kao i listu kurseva koje drže(slika 7). U nastavku naziva predmeta stoji broj koji predstavlja broj domaćihzadataka koji je zadat u okviru tog predmeta.

23

Page 24: Projekat i implementacija informacionog sistema za zadavanje

Slika 7: Početna stranica za nastavnike

Izborom nekog od predmeta, prikazuje se stranica sa listom svih domaćihzadataka koje je nastavnik zadao u okviru tog predmeta ili odgovarajućaporuka, ukoliko nastavnik nije zadao nijedan zadatak (slika 8). Primetimo dapored opcije za dodavanje novog domaćeg zadatka, za svaki od postojećihzadataka postoje dve opcije: „Izmeni domaći“ i „Pregledaj rešenja“.

Slika 8: Lista domaćih zadataka za izabrani kurs

Izborom opcije „Dodaj novi domaći“ nastavniku se otvara formular za unos novog domaćeg zadatka. (slika 9)

24

Page 25: Projekat i implementacija informacionog sistema za zadavanje

Slika 9: Formular za dodavanje novog domaćeg zadatka

Ukoliko nastavnik:

• unese broj poena koji je manji ili jednak 0

• ne izabere ni jedan programski jezik u kom je moguće rešiti zadatak

• unese vremensko ili memorijsko ograničenje koje je manje ili jednako 0

• ne izabere test primere

sistem će ispisati odgovarajuću poruku i zadatak neće biti sačuvan.

Ovde je bitno napomenuti na koji način se ispravno zadaju test primeri. Kakopostoji više načina čitanja ulaza (standardni ulaz, argumenti komandne linije,datoteke), kao i ispisivanja izlaza (standardni izlaz, datoteka), a sam sistemomogućava korišćenje svih mogućih kombinacija ulaza, kao i izbor jednog oddva načina izlaza, format za zadavanje test primera je sledeći:

Ulaz koji student treba da očekuje sa standardnog ulaza je potrebno smestiti ufajlove sa nazivom 0.input, 1.input, …, n.input, gde je n+1 ukupan broj testprimera. Ulaz koji student treba da očekuje kao argumente komandne linije jepotrebno smestiti u fajlove sa nazivom 0.args, 1.args, …, n.args. Ulaz kojistudent treba da očekuje iz datoteka je potrebno smestiti u arhive sa nazivom0.zip, 1.zip,..., n.zip. Vrlo je bitno napomenuti da je u ove arhive mogućesmestiti više datoteka koji će se nalaziti u proizvoljnoj hijerarhijidirektorijuma.

Očekivani izlaz je potrebno smestiti u fajlove sa nazivom 0.output, 1.output, …,n.output. Ukoliko je potrebno izlaz upisati u neku datoteku, naziv te datotekeje potrebno upisati u formular (slika 9), u suprotnom će se izlazom izstudentskog programa smatrati standardni izlaz.

25

Page 26: Projekat i implementacija informacionog sistema za zadavanje

Slika 10: Formular za izmenu domaćeg zadatka

Izborom opcije „Izmeni domaći“ (sa slike 8), prikazuje se formular prikazan naslici 9, popunjen podacima koje je nastavnik prethodno uneo za taj domaći(slika 10).

Ukoliko nastavnik želi da pogleda prethodno zadate test primere, sistem mupruža tu mogućnost. Na ovom formularu postoji malo zeleno dugme (levo odopcije „Izaberi test primere“) koje služi za preuzimanje prethodnopostavljenih test primera. Nakon preuzimanja ovih test primera, akonastavnik ne zada nove, stari test primeri će ostati važeći.

Izborom opcije „Pregledaj rešenja“ (sa slike 8) prikazuje se lista studenata kojisu pokušali da reše domaći zadatak. (slika 11)

Slika 11: Lista studenata koji su pokušali da reše domaći zadatak

Ovde se za svakog studenta prikazuju dve opcije: „Rešenje sa najviše poena“ i„Sva rešenja“.

Izborom prve opcije nastavniku se otvara prozor u kome se prikazuje kod kojije okačio izabrani student. Ovo predstavlja najuspešniji pokušaj rešavanjazadatka za tog studenta.

26

Page 27: Projekat i implementacija informacionog sistema za zadavanje

Slika 12: Pregled studentskog koda

Ovde nastavnik ima opciju da promeni broj poena koje je sistem dodeliostudentu, unosom broja poena i izborom opcije „Promeni“. Pored ovoganastavnik može da prolazi kroz listu najboljih rešenja svih studenata izboromopcija „Prethodni student“, odnosno „Sledeći student“.

Izborom opcije „Sva rešenja“ sa slike 11, nastavniku se prikazuju svi pokušajiizabranog studenta da reši taj domaći zadatak. (slika 13)

Slika 13: Pregled svih pokušaja rešavanja zadatka za jednog studenta

Primetimo da za svaki od pokušaja postoji prikazano vreme, broj osvojenihpoena i opcija da se pregleda rešenje. Izborom opcije „Pregledaj rešenje“prikazuje se prozor identičan onome na slici 12, samo što ovde postoje opcije„Sledeće rešenje“, odnosno „Prethodno rešenje“, koje služe za listanje okačenih

27

Page 28: Projekat i implementacija informacionog sistema za zadavanje

rešenja izabranog studenta.

3.3.2 Deo aplikacije namenjen studentima

Nakon što se uloguje na sistem, studentu se prikazuje njegova početna stranicana kojoj se nalazi lista kurseva koje sluša i sva njegova obaveštenja (slika 14).

Primetimo da su nova obaveštenja (ona koje student nije prethodno video)obojena plavom bojom.

Slika 14: Početna stranica za studenta

Izborom kursa, studentu se zatim prikazuje lista svih domaćih zadataka koji suzadani u okviru tog kursa. Ovi zadaci su podeljeni u dve grupe: aktivni zadaci izadaci kojima je prošao rok za izradu. Za zadatke iz druge grupe student nemože da šalje rešenja.

Slika 15: Lista domaćih zadataka

Uz svaki zadatak je prikazano trajanje, kao i maksimalan broj poena koje je student osvojio na tom zadatku.

Klikom na naziv nekog od aktivnih domaćih zadataka studentu se prikazuje

28

Page 29: Projekat i implementacija informacionog sistema za zadavanje

formular sa detaljima zadatka i opcijom za kačenje rešenja

Slika 16: Formular za kačenje rešenja zadatka

Da bi se rešenje poslalo na pregledanje, neophodno je izabrati neki odponudjenih programskih jezika i obezbediti da se ekstenzija okačene datotekepoklapa sa izabranim programskim jezikom.

Izborom opcije „Pošalji“ rešenje se šalje na pregledanje. Rezultati testiranja seprikazuju odmah ispod. Kako koji test primer prođe ili ne prođe testove, takose ti podaci prikazuju studentu (slike 17, 18, 19).

Slika 17: Primer kačenja rešenja

29

Page 30: Projekat i implementacija informacionog sistema za zadavanje

Slika 18: Primer rezultata testiranja za netačno rešenje

Slika 19: Primer rezultata testiranja za tačno rešenje

3.3.3 Deo aplikacije koji je zajednički za nastavnike i studente

I nastavnici i studenti (u daljem tekstu korisnici) u glavnom meniju imajuopciju „Zadaci za vežbu“. U okviru tog padajućeg menija, nalaze se 3 opcije:„Lista svih zadataka“, „Rang lista“ i „Dodaj novi zadatak“ (slika 20).

Slika 20: Deo menija u kom se nalaze opcije vezane za zadatke za vežbu

Izborom opcije „Dodaj novi zadatak“ korisnik može da predloži moderatorunovi zadatak za vežbu. Ovaj formular se razlikuje od formulara za zadavanjenovog domaćeg zadatka po tome što je zadacima za vežbu pridružena težina,koja predstavlja ceo broj od 1 do 5 i služi da se na taj način „boduju“ ovizadaci. Pored toga, svaki od zadataka za vežbu pripada nekoj kategoriji koja senalazi u okviru nekog domena (roditeljske kategorije). Zbog toga je prvopotrebno izabrati domen, a zatim u okviru tog domena neku od ponuđenihkategorija. (slika 21)

30

Page 31: Projekat i implementacija informacionog sistema za zadavanje

Slika 21: Formular za slanje predloga novom zadatka za vežbu

Na primer, jedan od postojećih domena je „Algoritmi“, a zatim se unutar njeganalaze kategorije kao što su „Grafovi“, „Niske“, „Sortiranje“... Takođe, ovdevećina polja nije obavezna za unos, tj. ako korisnik nije siguran na koji načintreba da popuni neka od polja formulara, može da ih ostavi praznim, a to ćezatim moderator koji bude obrađivao predlog zadatka ispravno popuniti.

Iz ovih razloga, dodatno postoji i polje „Napomena“, gde korisnik koji predlažezadatak može da napiše bilo kakve instrukcije za moderatora ukoliko smatrada je to potrebno.

Izborom opcije „Lista svih zadataka“ iz glavnog menija (slika 20), korisniku seprikazuje lista svih domena sa kategorijama koje im pripadaju. (slika 22)

Slika 22: Lista domena i kategorija

Izborom nekog od domena, prikazuje se stranica sa svim zadacima iz togdomena, razvrstanim po kategorijama (slika 23). Izborom kategorija sa levestrane, menja se spisak zadataka u središnjem delu. Primetimo da postoji poljeza pretragu, koje se koristi za pretragu zadataka po naslovu. Pored ovoga,

31

Page 32: Projekat i implementacija informacionog sistema za zadavanje

zadaci su, radi bolje preglednosti, podeljeni na stranice (eng. pagination). Naslici su, radi ilustracije, postavljena 4 zadatka na jednu stranicu. U praksi će tobiti 20 ili 30 zadataka. Zvezdice koje stoje uz svaki zadatak označavaju njegovutežinu.

Slika 23: Lista zadataka za vežbu, razvrstanih po kategorijama

Klikom na naslov zadatka, otvara se stranica za njegovo rešavanje, vrlo sličnaonoj za rešavanje domaćeg zadatka. Proces ocenjivanja zadatka je identičan, asamim tim i prikaz rezultata, samo što ne postoji broj osvojenih poena, većprocent tačnosti rešenja. Na ovoj stranici se nalazi i rang lista rešenja za tajzadatak, sortirana prvo po rezultatu testiranja, a zatim po broju pokušaja(slika 24).

Slika 24: Rešavanje zadatka za vežbu

Izborom opcije „Rang lista“ iz glavnog menija prikazuje se globalna rang listasvih zadataka za vežbu. Skor se računa kao suma svih težina rešenih zadatakapomnožena sa osvojenim procentom na tim zadacima (slika 25).

32

Page 33: Projekat i implementacija informacionog sistema za zadavanje

Slika 25: Prikaz rang liste

3.3.4 Moderatorski deo aplikacije

Nakon što se uloguje, moderatoru se prikazuje njegova početna stranica.Glavni meni je prikazan na slici 26.

Slika 26: Glavni meni na moderetorskoj stranici

Opcija „Zadaci za vežbanje“ izgleda isto kao i kod Studenta i Nastavnika.

Opcija „Dodaj novi zadatak“ predstavlja prikaz formulara za zadavanje novogzadatka za vežbu. Ovaj formular je identičan kao kod opcije „Predlaganjezadatka za vežbu“ kod ostalih korisnika, samo što se u slučaju moderatora ovajzadatak direktno snima u bazu među zadatke za vežbu, jer ga nije potrebnododatno odobriti.

Opcija „Predlozi zadataka za vežbu“ predstavlja prikaz liste svih predloženihzadataka za vežbu koji do sada nisu odobreni ili odbijeni.

Slika 27: Lista predloga zadataka za vežbu

Izborom opcije „Pregledaj predlog“ moderatoru se prikazuje popunjenformular za zadavanje novog zadatka za vežbu (slika 28).

33

Page 34: Projekat i implementacija informacionog sistema za zadavanje

Slika 28: Obrada predloga zadatka za vežbu

Moderator može da promeni sve podatke na formularu koje smatrapogrešnim. Takodje, ima opciju da preuzme postavljene test primere, da ihproveri i da okači izmenjene ukoliko smatra da treba. Ako ne okači neke drugetest primere, prethodno okačeni test primeri će se smatrati ispravnim.

Moderator ovde ima 3 opcije:

1. Odustani – da napusti obradu predloga zadatka

2. Prihvati predlog zadatka – zadatak se smešta među sve ostale zadatke zavežbu i postaje dostupan za rešavanje i korisnik koji ga je predložio bivaobavešten o tome (slika 29).

3. Odbaci predlog zadatka – zadatak se trajno briše sa sistema i korisnikkoji ga je predložio biva obavešten o tome (slika 30).

Slika 29: Obaveštenje o odbijanju predloga

34

Page 35: Projekat i implementacija informacionog sistema za zadavanje

Slika 30: Obaveštenje o prihvatanju predloga

4 IMPLEMENTACIJA

4.1 Baza podatakaZa implementaciju aplikacije koriščena je baza podataka MySQL. Radi lakšegupravljanja podacima, korišćen je i PhpMyAdmin [3]. To je besplatan alat,pisan u jeziku PHP, koji podržava izvođenje raznih operacija nad MySQLbazama podataka. Osnovna razlika u odnosu na rad iz komandne linije je utome što je korisniku ovog alata pružen jasan korisnički interfejs. Putem ovoginterfejsa mnoge stvari se mogu brže i efikasnije uraditi (pogotovopregledavanje struktura tabela i podataka u njima). Jedina mana se ogleda utome što je nezgodno ažurirati bazu podataka sa većim količinama podataka.Međutim, za operacije ovog tipa najčešće se koriste pomoćni programi (eng.utilities), kao što je na primer LOAD, pa PhpMyAdmin predstavlja dobar izbor.

4.2 Serverski deo aplikacijeKao što je prethodno rečeno, serverski deo aplikacije je implementiran ujeziku PHP. Ovaj sloj ima tri glavne uloge:

1. Komunikacija sa bazom podataka

2. Primanje zahteva i isporučivanje rezultata

3. Komunikacija sa ocenjivačem zadataka

4.2.1 Komunikacija sa bazom podataka

Ova komunikacija se vrši korišćenjem ekstezije „PHP Data Object“ (PDO) kojasluži za pristupanje bazi podataka iz programskog jezika PHP. PDO pružatakozvani apstraktni sloj za pristupanje podacima (end. data-access abstractionlayer) koji omogućava da, bez obzira na to koju bazu podataka koristimo,možemo da koristimo iste funkcije za izvršavanje upita i dohvatanje podataka.Ali da ne dođe do zabune, PDO ne omogućava apstrakciju baze podataka (eng.database abstraction), što znači da nema opciju da preformuliše napisaneupite, tako da oni mogu da se koriste na nekoj drugoj bazi podataka.

35

Page 36: Projekat i implementacija informacionog sistema za zadavanje

self::$db->connection = new PDO( 'mysql:localhost;dbname=web4graderDb', 'root',

'');Programski kod 1: Konekcija na bazu podataka korišćenjem PDO konstruktora

U programskom kodu 1 je prikazan način na koji se vrši povezivanje sa bazompodataka. Kao što vidimo, dovoljno je pozvati konstruktor PDO objekta, kojikao prvi argument prima informacije o bazi podataka, hostu i nazivu bazepodataka. Naredna dva argumenta su korisničko ime i šifra.

Taj objekat se dalje koristi pri izvršavanju upita nad bazom i dohvatanjapodataka. Neke od najčešće korišćenih funkcija su:

1. public PDOStatement PDO::prepare(string $statement [,array options])

2. public bool PDOStatement::bindParam(mixed $param, mixed &$var [, int $dataType = PDO::PARAM_STR [,int $length [,mixed $options]]])

3. public bool PDOStatement::execute ([array $input_params])

4. public array PDOStatement::fetchAll([int $fetchStyle [, mixed $fetch_arg [, array ctro_args]]])

U nastavku sledi kratak opis svake od njih.

Funkcija prepare priprema SQL upit za izvršavanje.

Kada su upiti oblika „select * from tabela where ime='Ana'“, ne postoji razlogza bilo kakvo pripremanje ovih upita. Ali, ako imamo upite sa nekimparametrom (npr. Ana se prosledjuje kao parametar smešten u promenljivu$ime), onda tu postoje 2 pristupa. Prvi pristup je naivan, konstruiše se upitjednostavnim nadovezivanjem niski (programski kod 2).

$upit = "select * from tabela where ime='".$ime."'";Programski kod 2: Konstruisanje upita nadovezivanjem niski

U ovom jednostavnom primeru, izgleda kao da je ovaj pristup korektan. Alitreba imati u vidu da su parametri koji stižu za ove upite, najčešće parametrikoji su stigli sa klijentske strane, unešeni od strane korisnika. Zlonamerankorisnik bi umesto da unese željeno ime, mogao da unese „ ' or 1=1--“. Na ovajnačin se, nadovezivanjem niski, dobija upit prikazan u programskom kodu 3.

$upit = "select * from tabela where ime=' ' or 1=1 --' ";

Programski kod 3: Upit dobijen nadovezivanjem niski

Na ovaj način će zlonameran korisnik doći do svih podataka iz neke tabele jerće uslov u where sekciji uvek biti tačan, a `--` je oznaka za komentar i sve štoje navedeno nakon toga (u ovom slučaju samo jedan apostrof) će se ignorisati.

Ovo je poznat bezbednosni problem i zove se „Umetanje SQL upita“ (eng. SQLinjection).

Kao rešenje za ovaj problem koriste se takozvani pripremljeni upiti. Ideja je dase na sva mesta u upitu gde treba da se nadje neki prosledjeni parametar stavioznaka oblika :ime_parametra. Sam upit u sebi može imati više ovakvihoznaka.Njih je posle potrebno zameniti pravim vrednostima tih parametara.

36

Page 37: Projekat i implementacija informacionog sistema za zadavanje

Funkcija prepare se koristi baš u ovu svrhu – da pripremi upite, tako da se teoznake posle mogu povezati sa svojim parametrima i da sam upit možeispravno da se izvrši. Druga prednost korišćenja pripremljenih upita superformanse. U trenutku poziva prepare funkcije vrši se sintaksa proveraupita. Ukoliko isti upit treba da se izvrši više puta sa različitim parametrima,dovoljno je samo jednom pripremiti taj upit, što predstavlja značajnu uštedu uodnosu na situaciju gde u petlji svaki put pravimo novi upit nadovezivanjemniski.

Kao rezultat izvršavanja prepare funkcije dobija se objekat tipaPDOStatement.

Funkcija bindParam se koristi za povezivanje oznaka oblika :ime_parametra ikonkretnih prosleđenih parametara. Treba obratiti pažnju na to da je drugiargument referenca na prosleđeni parametar, što znači da će se taj parametarubaciti u upit tek pri pozivu execute funkcije.

Funkcija execute izvršava upit koji je prethodno pripremljen pozivomprepare funkcije. Ukoliko upit sadrži parametre, neophodno je prethodnopozvati bindParam funkciju, inače se poziv execute funkcije neće ispravnoizvršiti.

Funkcija fetchAll dohvata sve redove koje je upit vratio i smešta ih u niz.

Primer korišćenja svih ovih funkcija naveden u programskom kodu 4.

public function getAllStudentsForCourse($professorId, $courseId) { $query = "select *". "from web4graderDb.Student s ". "join web4graderDb.StudentCourse sc on sc.StudentId = s.Id". "where sc.CourseId = :cid and sc.ProfessorId = :pid"; $stmt = self::$db->connection->prepare($query); $stmt->bindParam(":pid", $professorId, PDO::PARAM_INT); $stmt->bindParam(":cid", $courseId, PDO::PARAM_INT); $stmt->execute(); return $stmt->fetchAll(PDO::FETCH_OBJ);}

Programski kod 4: Primer korišćenja PDO funkcija

Ovde je ilustrovano korišćenje nekih najosnovnijih funkcija. PDO ekstenzija jevrlo bogata i dobro dokumentovana i više informacija o tome se može naći nazvaničnom sajtu PHP-a [4].

4.2.2 Prihvatanje zahteva i isporučivanje rezultata

Serverski deo aplikacije je sa stanovišta organizacije podeljen na dva dela. Prvideo čine php fajlovi koji služe za komunikaciju sa bazom podataka. U njima senalaze samo funkcije koje vrše izvršavanje upita, sličnih onome koji jenaveden u programskom kodu 4. Drugi deo aplikacije čine servisi. Oni primajuzahteve od klijenta, zatim pozivaju odredjene funkcije baze podataka i terezultate prosleđuju dalje klijentu.

37

Page 38: Projekat i implementacija informacionog sistema za zadavanje

Slika 31: Organizacija datoteka na serveru

Pogledajmo organizaciju datoteka na serveru, prikazanu na slici 31. Udirektorijumu DbProxies se nalaze prethodno pomenute datoteke safunkcijama za komunikaciju sa bazom podataka, dok se u direktorijumuServices nalaze servisi koji koriste te funkcije.

Svi servisi su po organizaciji vrlo slični, pa će biti prikazan jedan od njih, npr.professorServices:

Na početku datoteke je potrebno uključiti php datoteke koje sadrže funkcije zakomunikaciju sa bazom podataka, a koje će biti korišćene. U ovom slučaju tosu homeworkDbProxy i professorDbProxy (Programski kod 5).

include_once("../DbProxies/homeworkDbProxy.php");include_once("../DbProxies/professorDbProxy.php");

Programski kod 5: Uključivanje potrebnih datoteka

Dalje, zahteve upućene ka professorServices može slati samo nastavnik koji jeulogovan na sistem. Iz tog razloga se vrši provera da li je taj uslov ispunjen(programski kod 6).

session_start();if(isset($_SESSION['userTypeName']) && $_SESSION['userTypeName'] != "professor") return;

Programski kod 6: Provera da li je zahtev došao od ulogovanog nastavnika

Zatim je potrebno instancirati objekte za komunikaciju sa bazom podataka(koji su implementirani kao Unikat) i ustanoviti koji metod je korišćen uzahtevu (GET, POST, PUT, DELETE, …) (programski kod 7).

$method = $_SERVER['REQUEST_METHOD'];$dbHw = HomeworkDbProxy::getInstance();$dbProf = ProfessorDbProxy::getInstance();

Programski kod 7: Dohvatanje metoda i instanciranje objekata za komunikaciju sa bazompodataka

U nastavku datoteke se nalazi prvo grananje po tome koji je metod u pitanju,pa zatim grananje po traženoj akciji (programski kod 8).

38

Page 39: Projekat i implementacija informacionog sistema za zadavanje

if($method == "POST"){ switch ($_POST['action']){ case 'updateHomework':

... break; case 'addHomework':

... break;

... }}else if ($method == 'GET') { switch($_GET['action']){ case 'initCourseInfo': ... break; case 'initHomeworkDetails': ... break;

... }}

Programski kod 8: Prikaz grananja prvo po metodi, pa zatim po traženoj akciji

Na primer, kada profesor uđe na stranicu za neki kurs, potrebno je da mu seprikažu svi domaći zadaci na tom kursu i lista svih studenata koji slušaju tajkurs. U tom trenutku se vrši GET poziv sa akcijom `initCourseInfo`. Kod kojiće se izvršiti prikazan je u programskom kodu 9.

case 'initCourseInfo': $courseId = $_GET['courseId']; $professorId = $_GET['professorId']; $res = new stdClass(); $res->students = $dbProf->getAllStudentsForCourse($professorId, $courseId); $res->homeworkList = $dbHw->getHomeworkList($professorId, $courseId); echo json_encode($res); break;

Programski kod 9: Izvršavanje akcije „initCourseInfo“

Prvo se, iz globalnog asocijativnog GET niza, pročitaju podaci koji su primljenina server. Zatim se pozovu funkcije koje, na osnovu prosleđenih parametara,čitaju podatke iz baze podataka. Na kraju se ti podaci vraćaju klijentu.

Slično važi i za sve ostale zahteve i servise.

4.2.3 Komunikacija sa ocenjivačem

Iako mu se pristupa direktno iz PHP-a, ocenjivač je spoljna komponenta kojane pripada ovom jeziku. Na početku datoteke u kojoj želimo da koristimoocenjivač, potrebno je uključiti datoteku grader.php (programski kod 10).

include_once('grader.php');Programski kod 10: Uključivanje interfejsa ocenjivača

Pored uključivanja navedene datoteke, potrebno je da ocenjivač budedostupan PHP interpreteru. Interfejs ocenjivača je implementiran kao PHP

39

Page 40: Projekat i implementacija informacionog sistema za zadavanje

ekstenzija. Zbog toga je potrebno da se odgovarajuća dinamička biblioteka,koja ovu ekstenziju implementira, nalazi u podrazumevanom direktorijumuza PHP ekstenzije. Dodatno, potrebno je u PHP konfiguraciji (php.ini datoteka)naznačiti da želimo da koristimo ovu ekstenziju, navođenjem extension=libgrader_php.so, pri čemu je libgrader_php.so pomenuta dinamička biblioteka.

Sledeće funkcije čine interfejs ocenjivača:

1. grader::save_tests($relativePathToTestDir,$zippedData,$len)

2. grader::submit_task($testsDir, $fileName, $fileCont);

3. grader::get_task_status($taskId)

Funkcija save_tests je uvedena zato što postoji mogućnost da se ocenjivač i Vebserver nalaze na različitim mašinama. U tom slučaju, potrebno je snimiti testprimere na udaljenu mašinu gde se ocenjivač nalazi, što je i svrha ovefunkcije. Ovo se radi da bi se izbeglo ponovljeno slanje istih test primera, kojiće biti korišćeni prilikom ocenjivanja više različitih rešenja jednog zadatka.Prilikom snimanja test primera navodi se isključivo relativna putanja.

Funkcija submit_task vrši slanje studentskog rešenja na obradu ocenjivaču.Kao parametre prima putanju do direktorijuma gde se nalaze test primeri, imedatoteke sa rešenjem i njen sadržaj, a kao povratnu vrednost vraćaidentifikator pomoću koga se mogu dohvatati informacije o izvršavanjustudentskog rešenja. Ispravan poziv ove funkcije je dat u programskom kodu11.

$taskId = grader::submit_task($path, $fileName, $fileContent);Programski kod 11: Primer ispravnog poziva funkcije submit_task

Ono što je bitno za performanse Veb aplikacije je da ovaj poziv nije blokirajući.Ocenjivač će odmah vratiti pomenuti identifikator, tj. neće se čekati na krajobrade rešenja.

Funkcija get_task_status služi za proveru trenutnog stanja obrade rešenjazadatka. Prima identifikator koji je vratila funkcija submit_task i kao povratnuvrednost vraća status. Ovaj status se nalazi u JSON formatu. Ispravan pozivove funkcije dat je u programskom kodu 12.

$response = grader::get_task_status($taskId);Programski kod 12: Primer ispravnog poziva funkcije get_task_status

Kada se pozove funkcija json_decode nad objektom $response, dobija seobjekat koji ima polja state, test0, test1, …, testn. Polje state može imativrednosti:

• waiting – zadatak nije stigao na red za ocenjivanje

• finished – ocenjivanje je završeno

• running – ocenjivanje je u toku

• compiling – kompajliranje programa je u toku

• internal_error – interna greška ocenjivača

40

Page 41: Projekat i implementacija informacionog sistema za zadavanje

• malformed_request – greška pri pozivu ocenjivača

• compile_error – greška pri kompilaciji

Ocenjivač ocenjuje rešenje tako što proverava njegovu tačnost na zadatim testprimerima. Kako ocenjivač završi sa kojim test primerom, tako taj rezultattestiranja postaje dostupan. Ti rezultati se nalaze u poljima sa nazivomtest0, ..., testn. Ova polja mogu imati vrednost:

• correct_result – tačan rezultat

• incorrect_result – neispravan rezultat

• memory_limit – prekoračeno memorijsko ograničenje

• time_limit – prekoračeno vremensko ograničenje

• runtime_error – greška pri izvršavanju

Proces ocenjivanja studentskog rešenja je sledeći:

1. Student šalje rešenje na server

2. Na serveru se poziva funkcija submit_task

3. Server vraća klijentu poruku da je rešenje uspešno poslato na obradu

4. Klijent šalje zahtev za proveru stanja

5. Server poziva funkciju get_task_status i vraća klijentu status

6. Klijent prikazuje rezultate do tada obrađenih test primera

Koraci 4-6 se ponavljaju dok god se za status ne dobije neko od završnihstanja („finished“ ili neka od grešaka).

Nekada je zgodno videti konkretan izlaz koji je studentski program proizveo.Ocenjivač pruža mogućnost da se za prosleđeni taskId, dobije kompresovanidirektorijum u kome se nalaze izlazi iz studentskog programa za svaki testprimer. Ovakav pristup problemu omogućava Veb aplikaciji da smanji mrežnitransport time što će se ove informacije prosleđivati korisnicima tek naeksplicitni zahtev.

4.3 Klijentski deo aplikacijeKlijentski deo aplikacije predstavlja skup html stranica, njima pridruženihstilova, kao i skup skriptova, napisanih u programskom jeziku JavaScript.

Postoje tri glavne html stranice. Sve ostale stranice su parcijalne, tj. umeću seu neku od glavnih stranica.

Prva od njih je index.html koja služi isključivo za logovanje na sistem. Ovastranica sadrži formular na kom se nalaze polja za unos korisničkog imena išifre i dugme za logovanje na sistem. Ukoliko neko ko nije ulogovan na sistempokuša da uđe na bilo koju drugu stranicu sistema, biće preusmeren napomenutu stranicu za logovanje.

Druga stranica je startPage.php. Ovo je osnovna stranica za celokupnu kakostudentsku, tako i nastavničku aplikaciju. Na njoj se nalaze samo navigacija,

41

Page 42: Projekat i implementacija informacionog sistema za zadavanje

donje zaglavlje (eng. footer) i mesto na koje će biti umetane parcijalne htmlstranice. Prethodno je pomenuto da je pri izradi aplikacije intenzivnokorišćena biblioteka Angular.js. Za umetanje parcijalnih stranica upotrebljavase direktiva ng-view ove biblioteke, koja obezbeđuje da se na mestu na kom jedirektiva navedena ubaci odgovarajuća parcijalna stranica. Sledeće pitanjekoje se postavlja jeste na koji način se postiže da se u pravom trenutku učitaprava parcijalna stranica. Ovo se postiže takozvanim rutiranjem (eng. routing).To je još jedna funkcionalnost koju nam obezbeđuje Angular.js biblioteka. Svešto je potrebno uraditi je navesti kojoj putanji u URI-ju odgovara kojaparcijalna stranica (programski kod 13).

drWebgradeApp.config(['$routeProvider', function ($routerProvider){ $routerProvider. when('/professor/:professorId', { templateUrl: 'Partial/p_homePage.html' }). when('/professor/:professorId/course/:courseId', { templateUrl: 'Partial/p_homeworkList.html' }). when('/professor/:professorId/course/:courseId/hw/:homeworkId', { templateUrl: 'Partial/p_homeworkDetails.html' }). when('/professor/:professorId/course/:courseId/hws/:homeworkId', { templateUrl: 'Partial/p_homeworkSolutions.html' }). when('/student/:studentId', { templateUrl: 'Partial/s_homePage.html' }). when('/course/:courseId', { templateUrl: 'Partial/p_homeworkList.html' }). when('/s_homeworkList/:studentId/:courseId', { templateUrl: 'Partial/s_homeworkList.html' }). when('/s_homeworkDetails/:studentId/:courseId/:homeworkId', { templateUrl: 'Partial/s_homeworkDetails.html' }). when('/assignmentList', { templateUrl: 'Partial/a_assignmentDomainList.html' }). when('/assignmentList/:domain', { templateUrl: 'Partial/a_assignmentCategoryList.html' }). when('/assignmentList/:domain/:assignmentId', { templateUrl: 'Partial/a_assignmentDetails.html' }). when('/assignmentRangList', { templateUrl: 'Partial/a_rangList.html' }). when('/addNewAssignment', { templateUrl: 'Partial/a_addNewAssignment.html' }) .otherwise({

42

Page 43: Projekat i implementacija informacionog sistema za zadavanje

redirectTo:'/' });

Programski kod 13: Rutiranje korišćenjem ngRoute modula

Pored toga što obezbeđuje učitavanje odgovarajuće parcijalne stranice, onanam omogućava i prosledjivanje parametara u putanji URI-ja. Na primer,ukoliko se unese putanja "…/student/1" treba da se učita početna stranica zastudenta čiji je identifikator 1. Kao što može da se vidi u programskom kodu13, ovaj identifikator je imenovan sa :studentId. U odgovarajućoj JavaScriptdatoteci koja učitava sve informacije o tom studentu, moguće je pristupitiunešenom parametru navođenjem: $routeParams.studentId.

Dalje, potrebno je povezati svako od pomenutih parcijalnih stranica sa nekomJavaScript datotekom, kako bi se za svaku stranicu obezbedili odgovarajućipodaci. Ovo se postiže korišćenjem ng-controller direktive. Prvo je potrebnodefinisati kontroler u okvoru JavaScript datoteke (programski kod 14).

angular.module('studentModule').controller('StudentInfoController', ['$http', '$routeParams', 'configConstants', function($http, $routeParams, $configConstants){

//Authorisation check $http({ method: 'POST', async: false, url: $configConstants.SERVER_URL+

$configConstants.USER_AUTHENTICATION_SERVICE, data: { action:'getLoggedUser'} }).success(function (data) { if (data.userTypeName != "student" ||

data.userId != $routeParams.studentId) { location.hash = "forbiddenPage"; } });

//Fields this.courses=[]; this.studentId = $routeParams.studentId; var self = this; //Init $http({ url: $configConstants.SERVER_URL+$configConstants.STUDENT_SERVICE, method: 'GET', params: {action: 'getStudentInfo', studentId:this.studentId } }).success(function(data){ self.courses=data.courses; if(data.image != "") $('#studentProfileImage').attr('src', 'data:image/*;base64,'+data.image); else $('#studentProfileImage').attr('src', '../Images/noimage.png'); self.firstName = data.firstName; self.lastName= data.lastName;

43

Page 44: Projekat i implementacija informacionog sistema za zadavanje

self.notifications = data.notifications; $http({ url: $configConstants.SERVER_URL+$configConstants.STUDENT_SERVICE, method: 'POST', data: {action: 'seeNotifications'} }); });

//Redirect to chosen homework this.showHomeworkList = function(courseId, studentId){

window.location = "../Views/startPage.php#/s_homeworkList/" + studentId + "/" + courseId;

}}]);

Programski kod 14: Kompletan kontroler za studentsku početnu stranicu.

Kontroler mora biti definisan u okviru nekog modula (u ovom slučaju to jestudentModule). Pri definiciji, prvi argument predstavlja naziv kontrolera. Ovoje bitno, jer će se taj naziv koristiti u okviru html stranica za povezivanjestranice i kontrolera. Sledeći argument je niz koji sadrži listu komponenata(koju mogu činiti provajderi kao što je $routeProvider, servisi kao što je $http islično), a zatim funkciju koja sadrži svu logiku nekog dela klijentske aplikacije(u ovom slučaju studentske početne stranice) i koja koristi prethodnonavedene komponente.

Kao što je prethodno pomenuto, svakoj parcijalnoj stranici je potrebnopridružiti odgovarajući kontroler. Ovo se postiže ng-controller direktivom,prikazanom u programskom kodu 15. Kada se u ovoj direktivi navede, naprimer StrudentInfoController as si, to označava da u nastavku dokumentaumesto punog imena kontrolera može da se piše samo si.

Primetimo da si.studentId iz programskog koda 15 zapravo predstavljaself.studentId iz programskog koda 14. Na ovaj način se vrši povezivanje svihpodataka iz kontrolera sa poljima u html datotekama. Treba imati na umu daje ovo povezivanje dvostruko – promene u kontroleru menjaju podatke nahtml stranici, ali i promene u okviru html stranice dovode do promenepodataka u kontroleru (nema potrebe za eksplicitnim dohvatanjem podataka).

Bitno je napomenuti da objekat si ima domen nivo bloka html elementa u komje naveden.

<div ng-controller="StudentInfoController as si" class="..."> <ol class="breadcrumb"> <li class="active">

<a href="#/student/{{si.studentId}}"> Početna </a> </li>

</ol> <div class="col-md-6"> <div class="panel panel-default"> <div class="panel-heading"> <h3 class="panel-title"> Kursevi </h3>

44

Page 45: Projekat i implementacija informacionog sistema za zadavanje

</div> <div class="panel-body"> <div ng-repeat="course in si.courses" class="..."> <a ng-click= "si.showHomeworkList(course.id,

si.studentId)"> {{course.name}}</a>

<span class="badge">{{course.homeworkCount}}</span> </div> </div> </div> </div>

<div class="col-md-6"> <div class="panel panel-default"> <div class="panel-heading"> <h3 class="panel-title">

Obavestenja</h3>

</div> <div class="panel-body" style="..."> <div > <pre ng-repeat="notification in si.notifications"

ng-class="{'list-group-item-info': notification.isSeen==0, 'list-group-item-warning': notification.isSeen!=0}"

class="list-group-item"> {{notification.datetime}}<br/>{{notification.message}}

</pre> </div> </div> </div> </div></div>

Programski kod 15: Kompletna stranica s_homePage.html

Ovim je u potpunosti opisan jedan deo studentske aplikacije. Svi ostali delovisu implementirani na analogan način (odgovarajuća paricijalna stranica seumeće u startPage.php, njoj se pridružuje odgovarajući kontroler koji vršikomunikaciju sa serverom, prikuplja potrebne podatke i time obezbeđuje daoni mogu biti prikazani u okviru stranice).

U svakom od kontrolera su primenjivane neke uobičajene prakse. Jedna odnjih je da se prvo vrši provera autorizacije (da li korisnik koji je posetiostranicu ima pravo na to). Zatim se prikupljaju parametri iz putanje URI-ja(ukoliko ih ima). Nakon toga se vrši http get zahtev koji prikuplja podatkerelevantne za tu stranicu. Ono što sledi posle toga varira od kontrolera dokontrolera, a zavisi od složenosti posla za koji je određeni kontroler zadužen.U radu je akcenat stavljen na to da jedan kontroler izvršava jedan celovitposao i da se poslovi koje izvršavaju dva kontrolera međusobno ne preklapaju.Takođe, svaki kontroler ovog dela aplikacije se nalazi u posebnoj datoteci iukoliko je deo studentske aplikacije, ima naziv s_<ime>Controller (npr.s_homePageController.js), u slučaju nastavničke aplikacije p_<ime>Controlleri u slučaju dela aplikacije gde se nalaze zadaci za vežbu a_<ime>Controller.

45

Page 46: Projekat i implementacija informacionog sistema za zadavanje

Pored ovoga, i odgovarajuće parcijalne stranice imaju identična imena (npr.s_homePage.html), tako da je jednoznačno određeno koji kontroler odgovarakojoj stranici.

Treći veliki deo aplikacije je onaj namenjen moderatoru. Ovo je poseban deojer moderator ima potpuno drugaciju ulogu od ostalih korisnika sistema. On jetaj koji je zadužen da odobrava zadatke, da prati rad sistema i ostalihkorisnika i slično. Glavna stranica je adminPage.php. Strukturno je ista kao istartPage.php. Parcijalne stranice i kontroleri koji odgovaraju njima susmešteni u datoteke:

admin_assignmentProposalList.html, admin_assignmentProposalDetails.html iadmin_assignmentProposalController.js.

4.4 Arhitektura aplikacijeDr. Webgrade je implementiran kao troslojna veb aplikacija. Slojevi itehnologije koje se koriste u njima su:

1. Prezentacioni sloj (HTML5, CSS, JavaScript uz intenzivno korišćenjebiblioteke Angular.js)

2. Središnji sloj – zadužen za komunikaciju između prezentacionog sloja isloja podataka, kao i za povezivanje sa ocenjivačem zadataka (koji nijedeo ovog projekta). (PHP)

3. Sloj podataka (MySQL baza podataka)

Pošto serverski sloj samo prima klijentske zahteve i isporučuje podatke, a svaobrada tih podataka se vrši unutar klijentskih skriptova, može se reći i da je upitanju arhitektura bogatih (teških) klijenata.

4.5 Korišćeni alati Pri izradi rada i aplikacije, korišćeni su sledeći alati:

1. PHPStorm [1]

2. Visual Paradigm Community Edition, Verzija 12.1 [2]

5 DISKUSIJARad opisuje osnovne elemente ovog sistema. Planirano je da se u budućnostiradi na proširivanju opisanog sistema.

Neki od planova su sledeći:

1. Bilo bi dobro da sistem omogući da nastavnik napiše sam svoju funkcijuza poređenje rezultata (koju će zatim snimiti i nuditi kao opciju, danastavnik ne bi morao svaki put iznova da je zadaje). Trenutna verzijavrši poređenje na jednakost (izuzimajući beline). U nekim slučajevima jezgodno drugačije porediti rezultate (npr. za poređenje decimalnihbrojeva bi bilo zgodno porediti sa određenom tačnošću).

46

Page 47: Projekat i implementacija informacionog sistema za zadavanje

2. Bilo bi dobro da sistem omogući da nastavnik može da okači nekiobrazac koda (eng. template code) koji bi bio dostupan studentu uz tekstzadatka i student bi morao da rešava zadatak modifikujući taj obrazac.Ovo je posebno zgodno u situacijama kada je cilj da studentimplementira samo neke funkcije, a da ostatak koda izgleda onako kakoto nastavnik želi.

3. Bilo bi dobro da sistem omogući da nastavnik može da vidi izlaz izstudentskog programa. U trenutnoj verziji sistema, nastavnik ima uvid uto koliko poena je sistem dodelio studentskom rešenju, ali ne i detaljanopis ocenjivanja tog rešenja (koje test primere je program prošao, a kojene i koja je razlika izmedju očekivanog izlaza i izlaza koji je proizveostudentski program).

4. Bilo bi dobro da sistem omogući ocenjivanje zadataka čije rešenje možeda čini više datoteka (sa potencijalno različitim ekstenzijama).

5. Bilo bi dobro da sistem omogući pravljenje i ocenjivanje nekih verzijateorijskih testova.

6. Bilo bi dobro da sistem omogući pravljenje i slušanje lekcija na nekutemu. Na primer, tema može da bude: „Programski jezik C“. Sistem trebada omogući da neko lice (nastavnik, moderator ili čak i student) može daformira lekcije (eng. tutorial) na tu temu tako što će navoditinaizmenično tekst koji opisuje neki segment jezika C i zadatke kojitestiraju da li je slušalac dobro savladao prethodno opisano. Ideja je daslušalac ne može da pređe na sledeći deo lekcija dok ne reši uspešno svezadatke iz prethodnog dela.

7. Bilo bi dobro da sistem omogući organizovanje takmičenja izprogramiranja. Ukoliko neki korisnik sistema želi da organizujetakmičenje, dovoljno je da zada sve zadatke i da postavi datum i trajanjetakmičenja. Studenti treba da imaju pristup listi postavljenih takmičenjai ukoliko su zainteresovani, treba da mogu da se prijave za bilo koje odnjih. U trenutku početka takmičenja, zadaci treba da postanu vidljivi zasve studente koji su se prijavili. Tokom trajanja takmičenja, studenti bimogli da vide trenutnu rang listu, čima bi imali uvid u to koliko su boljiili lošiji od ostalih takmičara. Rana verzija ovog informacionog sistemaje već korišćena na takmičenju u programiranju na Matermatičkomfakultetu - „MATF Challenge 2015“ i ova ideja proizlazi iz uspešnerealizacije tog takmičenja.

8. Bilo bi dobro da sistem omogući da grupa studenata može zajednički darešava neki domaći zadatak.

6 ZAKLJUČAKU radu su opisani projekat i implementacija veb zasnovanog informacionogsistema Dr.Webgrade koji bi trebalo da pomogne studentima programiranja dabrže i lakše usvoje gradivo koje se odnosi na programerske predmete.

47

Page 48: Projekat i implementacija informacionog sistema za zadavanje

Sistem omogućava nastavnicima da zadaju kako domaće zadatke, tako izadatke za vežbu. Sistem vrši ocenjivanje tih zadataka, na osnovu test primerakoje je nastavnik zadao. Ukoliko želi, nastavnik može da pregleda kodove kojesu studenti poslali i da eventualno koriguje broj poena koje im je sistemdodelio.

Studenti imaju mogućnost da pokušaju da reše sve pomenute zadatke, kao i daodmah dobiju informacije o tačnosti svog rešenja. Pored toga, mogu i dapredlažu svoje zadatke. Obradu tih predloga vrši moderator sistema. On jejedini korisnik koji može direktno da dodaje nove zadatke za vežbu.

Za implementaciju sistema korišćeni su programski jezici PHP i JavaScript,baza podataka MySQL, jezik za obeleževanje HTML i jezik za uređivanje stilaCSS. U okviru programskog jezika JavaScript, dosta je korišćena Angular.jsbiblioteka. Prednost ove biblioteke u odnosu na druge je to što je jako dobrodizajnirana, ima širok interfejs, jednostavna je za korišćenje, ima vrlo detaljnudokumentaciju, itd.

Kao što se može zaključiti iz prethodnog poglavlja, mesta za proširenje ipoboljšanje sistema ima dosta i na tome će se raditi u budućnosti. Nadam se daće ovaj sistem biti od koristiti i studentima i nastavnicima i da će se uspešnoupotrebljavati na fakultetu u okviru što većeg broja kurseva.

48

Page 49: Projekat i implementacija informacionog sistema za zadavanje

DODATAK

A – Sheme svih tabela baze podatakaPrimarni ključevi su obeleženi podebljanim slovima, dok su spoljni ključeviobeleženi iskošenim slovima.

Assignment

Kolona Tip Nullvrednost

Podrazumevanavrednost

Opis

Id Int Ne Nema Identifikator zadatka

Text Text Ne Nema Tekst zadatka

TimeLimit Varchar Da NULL Vremensko ograničenje

MemoryLimit Varchar Da NULL Memorijskoograničenje

TestCasesNum Int Ne 0 Broj postavljenih testprimera

Title Varchar Ne Nema Naslov zadatka

IsHomework TinyInt Ne 1 Polje koje označava da li je zadatak domaći zadatak ili zadatak za vežbu

CategoryId Int Ne 0 Identifikator kategorijekoja je pridružena zadatku za vežbu. Ako je u pitanju domaći zadatak, ovo polje ima vrednost 0.

Difficulty Int Ne 3 Težina zadatka (ceo broj između 1 i 5)

UserId Int Ne Nema Identifikator korisnika koji je autor zadatka.

State Int Ne Nema Stanje zadatka:0 – neodobren predlog zadatka1 – zadatak u pripremi2 – kompletiran zadatak

Note Varchar Da Nema Napomena upućena moderatoru u slučaju da je u pitanju predlog zadatka za vežbu.

49

Page 50: Projekat i implementacija informacionog sistema za zadavanje

Homework

Kolona Tip Nullvrednost

Podrazumevanavrednost

Opis

Id Int Ne Nema Identifikator domaćeg zadatka

ProfessorId Int Ne Nema Identifikator nastavnika koji je zadao domaći zadatak

CourseId Int Ne Nema Identifikator kursa u okviru kog je zadat domaći zadatak

AssignmentId Int Ne Nema Identifikator odgovarajućeg zadatka.

ActiveFrom Date Ne Nema Datum od kog domaći zadatak postaje aktivan

ActiveTo Date Ne Nema Datum do kog je domaći zadatak akvivan

Points Int Ne Nema Broj poena koje domaćizadatak nosi

ProgrammingLanguage

Kolona Tip Nullvrednost

Podrazumevanavrednost

Opis

Id Int Ne Nema Identifikatorprogramskog jezika

Name Varchar Ne Nema Naziv programskog jezika

HomeworkSolution

Kolona Tip Nullvrednost

Podrazumevana vrednost

Opis

HomeworkId Int Ne Nema Identifikator domaćeg zadatka koji student rešava

StudentId Int Ne Nema Identifikator studenta kojirešava domaći zadatak

50

Page 51: Projekat i implementacija informacionog sistema za zadavanje

DateTime Datetime Ne Nema Datum i vreme slanja rešenja zadatka

Solution Text Da NULL Programski kod koji predstavlja rešenje zadatka

EarnedPoints Int Da NULL Poeni koje je sistem dodelio rešenju

TestResults Text Da NULL Rezultat testiranja rešenjana svim test primerima. Ovde se čuva JSON reprezentacija rezultata testiranja.Npr: {"state":"finished", "test0":"correct_result", "test1":"correct_result", "test2":"correct_result"}

TaskId Varchar Da NULL Identifikator procesa koji je testirao zadatak. Ova kolona nema značaj za funkcionalnost, već služi za testiranje i otkrivanje ikorekciju grešaka.

User

Kolona Tip Nullvrednost

Podrazumevanavrednost

Opis

Id Int Ne Nema Identifikator korisnika

Username Varchar Ne Nema Korisničko ime

Password Varchar Ne Nema Šifra

FirstName Varchar Ne Nema Ime korisnika

LastName Varchar Ne Nema Prezime korisnika

UserTypeId Int Ne Nema Identifikator tipa korisnika

Email Varchar Ne Nema Adresa elektronske pošte

Image Mediumtext Ne Nema Slika

51

Page 52: Projekat i implementacija informacionog sistema za zadavanje

Professor

Kolona Tip Nullvrednost

Podrazumevanavrednost

Opis

Id Int Ne Nema Identifikator profesora

Student

Kolona Tip Nullvrednost

Podrazumevanavrednost

Opis

Id Int Ne Nema Identifikator studenta

Index Varchar Ne Nema Broj indeksa

Course

Kolona Tip Nullvrednost

Podrazumevanavrednost

Opis

Id Int Ne Nema Identifikator predmeta

Code Varchar Ne Nema Oznaka predmeta

Name Varchar Ne Nema Naziv predmeta

Semester Int Ne Nema Semestar slušanja

ProfessorCourse

Kolona Tip Nullvrednost

Podrazumevanavrednost

Opis

ProfessorId Int Ne Nema Identifikator nastavnika

CourseId Int Ne Nema Identifikator predmeta

StudentCourse

Kolona Tip Nullvrednost

Podrazumevanavrednost

Opis

StudentId Int Ne Nema Identifikator studenta

ProfessorId Int Ne Nema Identifikator nastavnika

CourseId Int Ne Nema Identifikator predmeta

52

Page 53: Projekat i implementacija informacionog sistema za zadavanje

HomeworkProgrammingLanguage

Kolona Tip Nullvrednost

Podrazumevanavrednost

Opis

HomeworkId Int Ne Nema Identifikator domaćeg zadatka

ProgrammingLanguageId

Int Ne Nema Identifikator programskog jezika

Category

Kolona Tip Nullvrednost

Podrazumevanavrednost

Opis

Id Int Ne Nema Identifikator kategorije

Name Varchar Ne Nema Naziv kategorije

ParentCategory Varchar Ne Nema Naziv roditeljske kategorije - domena

AssignmentProgrammingLanguage

Kolona Tip Nullvrednost

Podrazumevanavrednost

Opis

AssignmentId Int Ne Nema Identifikator zadatka

ProgrammingLanguageId

Int Ne Nema Identifikator programskog jezika

AssignmentSubmission

Kolona Tip Nullvrednost

Podrazumevanavrednost

Opis

AssignmentId Int Ne Nema Identifikator zadatka za vežbu

UserId Int Ne Nema Identifikator korisnika koji je poslao rešenje zadatka za vežbu

Solution Longtext Ne Nema Rešenje koje je student poslao

Points Int Ne 0 Procenat tačnosti rešenja

AttemptsNumber Int Ne 1 Ukupan broj pokušaja

53

Page 54: Projekat i implementacija informacionog sistema za zadavanje

jednog studenta da reši zadatak

TaskId Varchar Ne Nema Identifikator procesa koji je testirao zadatak. Ova kolona nema značaj za funkcionalnost, već služi za testiranje i otkrivanje i korekciju grešaka.

Notification

Kolona Tip Nullvrednost

Podrazumevanavrednost

Opis

Id Int Ne Nema Identifikator obaveštenja

Message Varchar Ne Nema Tekst obaveštenja

Datetime Datetime Ne Nema Datum i vreme slanja obaveštenja

IsSeen TinyInt Ne Nema Polje koje označava da lije korisnik do sada imaoprilike da vidi obaveštenje

UserId Int Ne Nema Korisnik kome je obaveštenje namenjeno

REFERENCE[1] PHP Storm, Zvanični sajt, https://www.jetbrains.com/phpstorm/ (17.09.2015.)

[2] Visual Paradigm Community Edition, Verzija 12.1, http://www.visual-paradigm.com/download/community.jsp (17.09.2015.)

[3] phpMyAdmin, Zvanični sajt, https://www.phpmyadmin.net/ (17.09.2015)

[4] PDO, Zvanična dokumentacija, http://php.net/manual/en/book.pdo.php (17.09.2015)

[5] Angular.js, Zvanična dokumentacija, https://docs.angularjs.org/api (18.09.2015)

54