Individuální projekt z předmětu webových stránek Anketa Jan Livora

Ročníková práce anketa

UŽIVATELSKÁ TECHNICKÁ DOKUMENTACE ANKETA :

Individuální projekt z předmětu webových stránek 2012 - Anketa Jan Livora [2ITa] [sk1]

1


Obsah DŮLEŽITÉ UPOZORNĚNÍ!!!....................................................................................................................... 3 PROHLÁŠENÍ O AUTORSTVÍ: .................................................................................................................... 3 ANOTACE: ................................................................................................................................................ 4 KLÍČOVÁ SLOVA: ...................................................................................................................................... 4 Zadání: ..................................................................................................................................................... 4 „POUŽITÉ NÁSTROJE“: ............................................................................................................................. 5 anketa popis : .......................................................................................................................................... 5 TECHNICKÁ ČÁST: .................................................................................................................................. 10 Upozornění pro editaci:......................................................................................................................... 11 SOUBORY: .............................................................................................................................................. 11 1)

SOUBORY: ...................................................................................................................................... 12

2)

POUŽITÉ PROMĚNÉ: ...................................................................................................................... 12

3)

UKÁZKY KODU: .............................................................................................................................. 13

DATABÁZE:............................................................................................................................................. 16 4)SHRNUTÍ PRÁCE:................................................................................................................................. 18 NÁMĚTY K VYLEPŠENÍ:........................................................................................................................... 19

2


DŮLEŽITÉ UPOZORNĚNÍ!!! Tato Anketa je naprogramována pomocí PHP (Hypertext Preprocessor) a ke jejímu spuštění budete tedy potřebovat webový server,který podporuje PHP (easyphp,wampserver)ten se dá běžně stáhnout z internetu.Nároky jsou velmi nízké stačí mít alespoň 8 MB volného místa na pevném disku Počítač, na kterém budete kalkulačku spouštět a nějaký webový prohlížeč ( Google Chrome, Mozilla Firefox ) a musíte být pochopitelně připojeni k síti po celou dobu vaší práce s anketou.Tato anketa může pracovat na jakémkoli zařízení bez ohledu na jeho operační systém jedinou podmínkou je,aby toto zařízení bylo schopno pracovat s webový prohlížeč s podporou PHP a být připojeno .Webový server můžete stáhnout např na těchto stránkách: http://www.stahuj.centrum.cz/internet_a_site/servery/databazove/wampserver/

Vážená Uživateli této ankety,Děkujeme vám,že jste si vybral právě tuto anketu. Před prvním použitím si prosím přečtěte následující „manuál“ návod k použití!

PROHLÁŠENÍ O AUTORSTVÍ: Já autor tohoto pololetního projektu:JAN LIVORA prohlašuji,že na této anketě jsem pracoval já sám,veškeré soubory nacházející se na CD jsem sám programoval a pracoval na nich během prvního pololetí .

3


ANOTACE: Tento dokument obsahuje dokumentace jak pro uživatele(uživatelskou) tak technickou.Dále obsahuje úvod kde je uživatel seznámen za jakých podmínek může pracovat s anketou.Dále potom seznam klíčových slov,obsah,seznámení s anketou v uživatelské dokumentace se greeny obrazovek pro uživatele,technickou část vývoje vzniku ankety,závěr kde je obsaženo shrnutí a případný návrh na vylepšení.

This document contains the documentation for both users (the user) so technickou.Dále contains an introduction where the user is aware of the conditions under which it can work with anketou.Dále then a list of keywords, content, information about the poll in the user documentation greens screens for users, technical part development of inquiry, which concluded the summary of the proposal and possible improvements.

KLÍČOVÁ SLOVA: Php,anekta,databáze,screen,server,webový prohlížeč,“proměná“,nick.

Zadání: Úkolem této části ankety,která ještě není zcela hotova,nebot je zatím pouze pololetí a chybí tak ještě například zápis atd,byl vytvořit tzv „redakční systém“,který by měl pracovat tak,že jakmile se přihlásí uživatel na hlavní stránku,měl by vidět anketu svojí pobočky,dále své spolupracovníky v pobočce to z hlediska uživatele(klienta),z pohledu admina(správce) však jde o to aby měl přístup ke všemu ,tedy pro admina(správce) by neměla platit žádná pravidla a měl by mít možnost zobrazit všechny uživatele,všechny ankety,informace o pobočce,či dané firmě,jakmile bude projekt plně dokončen což bude 2pololetí měl by být plně funkční a mít možnost nejen čtení ale také zápisu a dalších věcí s tím spjaté.

4


„POUŽITÉ NÁSTROJE“: Na tuto webovou „aplikaci“ a práci byly použity: Notepad++ - program typu poznámkový blok pro psaní skriptů Wampserver - Php server pro podporu Microsoft Word – pro psaní textu a dokumentace o samotné práce „výstřižky“ – program pro vystřižení screenů obrazovek,nebo kodu Mysql databáze prostřednictvím níž funguje anketa. Z pohledu „technologii“: Html – „značkovací“ jazyk,který tvoří „kostru“ stránky. Css – „kaskádové styly“,které pomáhají v anketě k úpravě stylů písem pozadí tlačítka... Php – skriptovací jazyk,kteří tvoří dynamické stránky a jejich funkčnost. Sql – databáze komunikující s php JavaScript – objektový jazyk. Sublimetext2 - program typu poznámkový blok pro psaní skriptů

anketa popis : Tato anketa je navržena jak pro práci uživatele(„Zákazníka“) tak pro práci administrátora,anketa funguje tak že se nejdříve otevře vstupní soubor s loginem kde vyplníme níže uvedené údaje:

5


Po té co zadáme výše uvedené údaje stiskneme tlačítko „ok“.Po stisknutí se nám bud zobrazí chybná hláška že byly zadány špatné údaje nebo se nám zobrazí stránka s textem a obrázkem: (to v případě logování ),v případě registace vyplníme výše uvedené údaje podle toho co chceme registrovat a odešleme,následně můžeme dále pracovat.

Po kliknutí na obrázek,který funguje jako odkaz se dostaneme na hlavní stránku ankety:

6

firmy Ročníková práceLogo anketa obrázek

menu Informace o klientovi

Logo uzivatele

Po přejetí kurzorem myši na menu se změní pozadí abychom viděli,že sme najeli na danou část menu.Po stisknutí prvního „bodu“ v menu „anketa“ se dostaneme na stránku s anketou pro uzivatele:

Ve výše uvedeném příkladě vydíme zobrazující se název ankety,otázku + odpověd,která může mít různých možností a různých typů. Jdeme na 2položku v menu „kolegové firmy“.Po stisknutí se dostaneme na stránku kde uživatel vidí všechny kolegy z dané firmy jaké je on sám: 7

ID uzivatele v databázi

Login,jméno ,firma


Název pobocky

Dále mámejako 3 bod „kolegové pobočky“.Po stisknutí tohoto tlačítka se dostaneme na stránku kde se zobrazí pro změnu uživatelé,kteří jsou spjati pouze s pobočkou,tedy v té ve které se nachází i samotný uživatel:

Uživatel může nejen anketu zobrazit,ale také vytvořit: 8


Tvorba anekty je vedena do třích kroků: Za prvé zadáme základní informace o anketě,otázku a typ jaký otázka má

Po odeslání se dostaneme do kroku dvě kde zadáme odpověd k dané otázce,zadáne v předešlém kroku

Během stisknutí tlačítka nám „vyskočí“ dialogové okno kde dostaneme dotaz:zdali chceme vytvořit novou otázku,pokud dáme ano,dostaneme se znovu na krok 1,s tím že už zadáváme jen otázku a tim,nikoliv informace o anketě.Pokud dáme ne dostaneme otázku zdali chceme přidat odpověd,zde platí to samé,jako v předešlém,a pokud vybereme možnost ne,dostaneme se na poslední krok 3,kde zvolíme styl anekty,po stisknutí tlačítka se nám vytvoří anketa

9


,kterou si můžeme po té zkontrolovat v nabídce,hlasovat pro ní,či vidět statistiky:

Jako poslední máme v menu bod „odhlášení“.Nejedná se o nic jiného než že se přesměrujeme na stránku,která nemá nic zvláštního co se týče uživatelského rozhraní,tato stránka tedy slouží k tomu aby se uživatel úspěšně mohl odhlásit:

TECHNICKÁ ČÁST: 1) Soubory. a) Soubory se samotnou anketou. b) obrázky. 2) Použité proměné. a) Názvy + popis co mají většinou dělat

10


3) Ukázky kodu a) Vybrané části kodu. b) Databáze 4) Závěr. a)Shrnutí práce. b)Náměty na možné vylepšení.

Upozornění pro editaci: Veškeré data,které se nacházejí v databázi,jsou includována do php souborů,přes funkci include(název souboru),pokud budete chtít databázi uzpůsobit vašemu použití,přepište login,heslo a název DB v souboru db.php

SOUBORY: Tato anketa obsahuje okolo 30 funkčních php souborů např:(anketa_komplet1, anketa_komplet2, anketa1, firma_info, formular-heslo, odhlášeni, pobocka_info,reset.php,result2.php,create1-3.php pobocka_info2, uvod2,uvod3, uzivatele, uzivatele2, uzivatele_komplet,registrace 1-3,firmy ankety1-6.php) Z jednotlivých jmen souborů lze u většiny snadno zjistit co asi mají za význam: anketa_komplet1,2 – v režimu admin zobrazí všechny ankety,aketa1 – anketa zobrazující se uživateli,firma_info – informace o firmě,formular-heslo – vstupní formulář,odhlášení – odhlašující soubor,pobočka info1,2 – v režimu admin informace o dané pobočce,uvod2 – stránka zobrazující se po vyplnění formuláře kladně.uvod3 – hlavni stranka ,uzivatele,2 – kolegové z firmy či pobočky. 11


1) SOUBORY: Zde se nacházejí obrázky např: uvod2 – obrázek pro stisknutí a přesměrování na hlavní stránku,loga uživatelů:(images 1 -15.jpg)

2) POUŽITÉ PROMĚNÉ: „$result+cislo“ je to proměná jak z jejího anglického názvu vyplývá vrací nějaký výsledek,použita při sql dotazech. „$radek + cislo“ je to proměná která se vztahuje k předchozí proměné „$result“ a vrací z daného výsledku tzv asociativní pole (pole,které nemá index typu (0,1,2,3) ale má řetězec). „$radek+[‘’řetězec’’] „ “uložená informace z database ze sloupečku v názvu”. „$_SESSION[‘’řetězec’’]” jedná se o tzv „globální” Proměnou,která nám přenáší hodnoty v ní uložené na jinou stránku „$login” zjištění hodnoty z formuláře. „$heslo” zjištění hesla z formuláře. „$nazev firmy” – zjištěná nátvu firmy. „$nazev pobocky”-název poboczy. „$id”-id z dané tabulky „$pocet”-počet řádků odpovídajících výsledků DB. „$zapis” – zapíše do DB. „$odpoved” – odpoved. „$ipny” – IP adresy „$exist” – existence daného podmyk (existence) v DB.

12


3) UKÁZKY KODU:

Connect k databázi výběr tabulky

Kontrola zdali jsme přihlášeni

Výběr z tabulky pobočka,načtení řádků a tabulka

výpis

13


Přihlášení kontrola

Výběr z tabulky dle podmínky,načte ní řádků a tabulka Zjištění zda li se jedná o uživatele či admina

výpis

Pokud se o admina nejedná+ výpis

14


Kontrola jestli jenom editujeme +zápis

Kontrola zda-li pouze upravujeme vzhled

Proces nastavení hodnot a zápisu při tvorbě ankety Registrace firmy za podmínky existence tlačítka

Registrace pobockyza podmínky existence tlačítka Zadání města za podmínky existence tlačítka

15


Výběr otázky a odpovědi k dané otázce,součet odpovědí a funkce na procentuální vyjádření hlasování pro jednotlivé odpovědi,vykre slení grafu+ zápis informací do DB

DATABÁZE:

16


17


4)SHRNUTÍ PRÁCE: Práce se jeví jako zajmavá a musí uznat,ač to zprvu tomu tak nebylo mě začala bavit,bohužel nebylo na to tolik času kolik bych potřeboval.Práce funguje tak jak má (hlavní funkce).Určitě si nemyslím,že je to nějaké extra podařené spíš ten slabší průměr (střed).Hlavní pointa je přihlášení rozpoznání,registrace (firem,uživatele,pobočky,města)+ anketa dle pobočky,tvorba ankety,editace ankety,anonymní hlasování,výsledné statistiky a to se podařilo.

18


NÁMĚTY K VYLEPŠENÍ: Vždy je co vylepšovat,v případě mé práce zatím spíše úpravu stylu,vzhledu a jednoduchosti,nejlépe použití také jiných prostředků typu ajax,jquery atd,které by určitě anketu „oživili“.Dále jednoduchost programování (kodu),(lepší optimalizace ).

19

Individuální projekt z předmětu webových stránek Anketa Jan Livora

Recommend Documents