Data driven design in web Kęstutis Valinčius Sigitas Povilaitis Rytis Ūsalis Paulius Paškevičius KAUNO TECHNOLOGIJOS UNIVERSITETAS

Sudėtingas žiniatinklio programų plečiamumas Brangus naujo funkcionalumo įgyvendinimas Lėtas tinklalapio interaktyvumo valdymas Aukštos kvalifikacijos specialistų poreikis

Sudėtingas žiniatinklio programų plečiamumas

Brangus naujo funkcionalumo įgyvendinimas

Lėtas tinklalapio interaktyvumo valdymas

Aukštos kvalifikacijos specialistų poreikis

Tinklalapiui pritaikyti duomenimis paremtą architektūrą (Data Driven Design). Sukurti įrankį, grafiškai leisiantį kurti scenarijus.

Tinklalapiui pritaikyti duomenimis paremtą architektūrą (Data Driven Design).

Sukurti įrankį, grafiškai leisiantį kurti scenarijus.

Grafinio redagavimo posistem ė Paskirtis: Grafiškai kurti ir redaguoti veiklos scenarijus Pagrindinės funkcijos: Objektų bei ryšių tarp jų atvaizdavimas

Paskirtis:

Grafiškai kurti ir redaguoti veiklos scenarijus

Pagrindinės funkcijos:

Objektų bei ryšių tarp jų atvaizdavimas

Grafinio redagavimo posistem ė Bendradarbiavimas su kitomis posistemėmis Pradiniai duomenys atkeliaus iš UML apdorojimo posistemės XML formatu Rezultatai bus siunčiami į kodo generavimo posistemę

Bendradarbiavimas su kitomis posistemėmis

Pradiniai duomenys atkeliaus iš UML apdorojimo posistemės XML formatu

Rezultatai bus siunčiami į kodo generavimo posistemę

Grafinio redagavimo posistem ė

Kodo generavimo posistem ė Paskirtis: Iš skripto generuoti sistemos kodą. Pagrindinės funkcijos: Iš skripto realizuoti funkcijų pakvietimus, ciklus, sąlygos sakinius. Įskiepiais paremta architektūra

Paskirtis:

Iš skripto generuoti sistemos kodą.

Pagrindinės funkcijos:

Iš skripto realizuoti funkcijų pakvietimus, ciklus, sąlygos sakinius.

Įskiepiais paremta architektūra

Kodo generavimo posistem ė Bendradarbiavimas su kitomis posistemėmis Duomenys gaunami iš grafinės redagavimo posistemės skripto pavidalu. Sugeneruotas kodas išsiunčiamas sistemos varikliui.

Bendradarbiavimas su kitomis posistemėmis

Duomenys gaunami iš grafinės redagavimo posistemės skripto pavidalu.

Sugeneruotas kodas išsiunčiamas sistemos varikliui.

Paskirtis: Architektūroje specifikuotų objektų realizacija Pagrindinės funkcijos: Teikti programines sąsajas (API) architektūroje specifikuotų objektų valdymui Apdoroti duomenų srautus pateiktus objektams.

Paskirtis:

Architektūroje specifikuotų objektų realizacija

Pagrindinės funkcijos:

Teikti programines sąsajas (API) architektūroje specifikuotų objektų valdymui

Apdoroti duomenų srautus pateiktus objektams.

Bendradarbiavimas su kitomis posistemėmis Programinių sąsajų (API) teikimas kodo generavimo posistemei

Bendradarbiavimas su kitomis posistemėmis

Programinių sąsajų (API) teikimas kodo generavimo posistemei

Pavyzdys: Pavyzdinė sistema realizuota su „Google maps“ įskiepiu. Trumpas scenarijaus aprašymas: Vartotojui reikia sudaryti krovinio vežimo scenarijaus iš Kauno į Vilnių demonstraciją. Įmonės būstinė yra Garliavoje. Vairuotojas važiuoja į Kauną, kur tikrinama ar yra pervežimo užsakymų. Jeigu užsakymų yra, krovinys vežamas į Vilnių ir grįžtama atgal. Ši procedūra kartojama tol, kol kroviniai baigiasi. Tada vairuotojas grįžta į būstinę.

Pavyzdinė sistema realizuota su „Google maps“ įskiepiu. Trumpas scenarijaus aprašymas:

Vartotojui reikia sudaryti krovinio vežimo scenarijaus iš Kauno į Vilnių demonstraciją. Įmonės būstinė yra Garliavoje. Vairuotojas važiuoja į Kauną, kur tikrinama ar yra pervežimo užsakymų. Jeigu užsakymų yra, krovinys vežamas į Vilnių ir grįžtama atgal. Ši procedūra kartojama tol, kol kroviniai baigiasi. Tada vairuotojas grįžta į būstinę.

Sistemos UML specifikacijos pavyzdys: Pervežimų sistemos UML klasių diagrama

Pervežimų sistemos UML klasių diagrama

Grafinio redaktoriaus sumodeliuotas vaizdas: Krovinio vežimo grafinis modelis

Krovinio vežimo grafinis modelis

Grafinio redaktoriaus XML išvestis: <Busena id=“start“> <next id=“B1“ /> </Busena> <Busena id=“B1“> <function name=“nustatytiPradziosKoordinate“> <param value=“Garliava“ /> </function> <next id=“B2“ /> </Busena> <Busena id=“B2“> <function name=“vaziuotiI“> <param value=“Kaunas“ /> </function> <next id=“B3“ /> </Busena> <Busena id=“B3“> <function name=“if“> <param name=“yraKroviniu“ /> <true id=“B4“ /> <falše id=“B2“ /> </function> </Busena> <Busena id=“B4“> <function name=“vaziuotiI“> <param value=“Vilnius“ /> </function> <next id=“B2“ /> </Busena> <Busena id=“B5“> <function name=“vaziuotiI“> <param value=“Garliava“ /> </function> <next id=“end“ /> </Busena>

<Busena id=“start“>

<next id=“B1“ />

</Busena>

<Busena id=“B1“>

<function name=“nustatytiPradziosKoordinate“>

<param value=“Garliava“ />

</function>

<next id=“B2“ />

</Busena>

<Busena id=“B2“>

<function name=“vaziuotiI“>

<param value=“Kaunas“ />

</function>

<next id=“B3“ />

</Busena>

<Busena id=“B3“>

<function name=“if“>

<param name=“yraKroviniu“ />

<true id=“B4“ />

<falše id=“B2“ />

</function>

</Busena>

<Busena id=“B4“>

<function name=“vaziuotiI“>

<param value=“Vilnius“ />

</function>

<next id=“B2“ />

</Busena>

<Busena id=“B5“>

<function name=“vaziuotiI“>

<param value=“Garliava“ />

</function>

<next id=“end“ />

</Busena>

Sugeneruotas programinis kodas: function B1(){nustatytiPrad ziosKoordinate(“Garliava”); B2();} function B2(){vaziuotiI (“Kaunas”); B3();} function B3(){ if(yraKroviniu()) B4(); else B5(); } function B4(){vaziuotiI (“Vilnius”); B2();} function B5(){vaziuotiI (“Garliava”);} B1();

function B1(){nustatytiPrad ziosKoordinate(“Garliava”); B2();}

function B2(){vaziuotiI (“Kaunas”); B3();}

function B3(){

if(yraKroviniu()) B4();

else B5();

}

function B4(){vaziuotiI (“Vilnius”); B2();}

function B5(){vaziuotiI (“Garliava”);}

B1();

A čiū už dėmesį

A čiū už dėmesį