Cardex specifikáció

cardex

# Az applikáció célja
Az applikáció célja a **Cardex brand fő internetes oldalának** kiszolgálása a cardex.hu címen. A weboldal célcsoportja az egyéni felhasználók, mivel a céges ügyfeleket különálló weboldal szolgálja ki. Elsődlegesen meghatározott cél a **fizetős termékek vásárlói csatornáiba** terelni a látogatókat. Ezek a termékek a **POD**, az **elektronikus** és **hagyományos képeslapok**. Másodlagos cél, hogy releváns, érdekes tartalmak szolgáltatásával **visszatérő vásárlói közönséget** alakítsunk ki.


#Oldalstruktúra
A fa nézetben felvázolt elemek közül csak a **vastagon kiemeltek** jelentenek különálló oldalakat. A többi oldalelemet, menüpontot vagy felhasználói irányt fejez ki.
├── **cardex.hu**
│   ├── **Kosár**
│   ├── **Szállítási adatok, fizetési mód**
│   ├── **Fizetés**
│   ├── **Bejelentkezés**, modal ablak
│   ├── **Regisztráció**, modal ablak
│   ├── Képeslapok
│   │   ├── **Képeslapok lista nézet**
│   │   │   ├── **POD áttekintő nézet**
│   │   │   ├── **POD szerkesztő áttekintő**
│   │   │   ├── **POD oldal szerkesztő**
│   │   │   ├── **E-card szerkesztő nézet**,
│   │   │   └── **E-card e-mail előnézet**
│   │   └──**Egy képeslap nézet**
│   ├── Ajándéktárgy
│   │   ├── **Összes ajándéktárgy kategória nézet**
│   │   └── **Egy ajándéktárgy kategória nézet**
│   ├── Díszcsomagolás
│   │   └── ***TODO***
│   ├── Ötletek
│   │   ├── **Magazin**
│   │   ├── **Videók**
│   │   └── **Újdonságok**
│   ├── Felhasználói profil oldal
│   │	  ├── **Saját személyes adatok módosítása**
│   │	  ├── **Facebook fiók csatolása**
│   │	  ├── **Jelszó változtatás**
│   │	  ├── **Rendelések listája**
│   │   │   └── Egy rendelés törlése
│   │	  ├── **Rendelési címek módosítása**
│   │	  ├── Fiók törlése
│   │	  ├── **Ismerősök listája**
│   │	  │	├── Egy ismerős hozzáadása / szerkesztése
│   │	  │	│	├── Névnap, születésnap beállítása
│   │	  │	│	└── Értesítő beállítása névnapra vagy születésnapra
│   │	  │	└── **Facebook ismerősök importálása**
│   │	  └──**Letölthető háttérképek**
│   ├── **Segítség** - Szerkeszthető tartalom
│   ├── **Felhasználási feltételek (ÁSZF)** - Szerkeszthető tartalom
│   ├── **Adatvédelmi nyilatkozat** - Szerkeszthető tartalom
│   ├── **Gyakran Ismételt Kérdések** - Szerkeszthető tartalom
│   ├── **Céginformáció / Impresszum** - Szerkeszthető tartalom
│   │   ├── **Viszonteladóknak** - Szerkeszthető tartalom
│   │   ├── **Licenszek, márkák** - Szerkeszthető tartalom
│   │   └── **Pályázatok** - Szerkeszthető tartalom
│   └── **Gyakran Ismételt Kérdések** - Szerkeszthető tartalom
├── **Adminisztrációs felület**
│   ├── **Felhasználók kezelése**
│   │   ├── **Felhasználók listája**
│   │   └── **Felhasználó hozzáadása / szerkesztése**
│   ├── **Hírlevél**
│   │   ├── **Hírlevelek listája**
│   │   └── **Hírlevél hozzáadása / szerkesztése / küldése**
│   ├── **Címkék**
│   │   ├── **Címke lista nézet / hozzáadás / szerkesztés**
│   │   └── **Címke csatolása modulokhoz**
│   ├── **Cikkek**
│   │   ├── **Cikkek listája**
│   │   └── **Cikk hozzáadása / szerkesztése**
│   ├── **Megrendelések**
│   │   └──  **Megrendelések listája**
│   ├── **Mikrooldal szerkesztő**
│   │   └──  ***TODO***
│   └── **Tartalom kezelő**
│   │   ├── **Tartalmak listája**
│   │   └── **Tartalom hozzáadása / szerkesztése**

# Adminisztrációs felület
## A felület célja
A felület célja, hogy az applikáció által a felhasználói felületeken **megjelenített statikus** illetve a **felhasználói interakciókból származó** adatokat (regisztráció, rendelések) az arra jogosultak teljes körűen kezelni tudják. Az adminisztrációs felület mobil nézettel nem rendelkezik.
## Jogosultságok
Az adminisztrációs felületre **e-mail** és **jelszó** megadásával lehet bejelentkezni. A rendszer telepítéskor regisztrál egy **adminisztrátor felhasználót**, aki teljeskörű jogosultságokkal rendelkezik. A később felvett felhasználók **modulszintű hozzáférésekkel** rendelkezhetnek. A jelszavakat a rendszer biztonsági szempontok miatt csak **elkódolt formában** tárolja, így a jelszavak visszanyerésére nincs lehetőség.
## Közös modulok
### Felhasználók kezelése
Az adminisztrációs felhasználóknak modul szintű jogosultságok beállítására nyílik lehetőség. Például felhasználó hozható létre kizárólag a megrendelések kezelésére.
- Felhasználók listája
	- Felhasználó törlése
- Felhasználó hozzáadása / módosítása
	- Felhasználó jelszavának beállítása
	- Felhasználó modul hozzáféréseinek beállítása
		- Az adminisztrátor checkbox listából választhatja ki a felhasználó modul hozzáféréseit.
	
### Hírlevél
A modul a MailChimp rendszerrel van integrálva és az alábbi adatbázis műveletek esetén végez szinkronizációt:

- Regisztráció -> Hozzáadás levelezőlistához
- Felhasználó unaktiválása -> Törlés listáról

### Címkék
A különböző modulok által használt címkék (kategóriák) szerkesztése.

- Címke lista nézet / hozzáadás / szerkesztés
	- Címke elrejtése publikus oldalakon
- Címkék csatolása modulokhoz
	- A felületen beállítható, hogy az egyes előre meghatározott modulok (képeslapok, ötletek) adminisztrációs felületén milyen címkékből (kategóriák) választhat a felhasználó.
	- Ezen a felületen nyílik lehetőség arra is, hogy a modulhoz csatolt címkék drag-n-drop rendezésével a kategória-alkategória rendszert kialakítsuk.
	
### Cikkek
Cikkek feltöltése és kezelése több modul számára.

- Cikkek listája
	- Szűrés kategóriára, mint Magazin, Újdonságok
	- Id, cím, url tag, hozzáadás dátuma
- Egy cikk hozzáadása / szerkeszétes
	- Meghatározható a cikk típusa (szöveges cikk, videó).
	- Kép beágyazás
		- A beágyazáshoz a képeket először a cikkhez fel kell tölteni.
		- A cikkhez automatikusan létrejön egy galéria. A megjelölt képek a felhasználói oldalakon galéria nézetben léptethetőek.
		- A feltöltött képeket drag-n-drop módszerrel lehet a cikk szövegtörzsébe beágyazni.
		- A beágyazott képeket három módon lehet a szöveghez képest rendezni:
			- Balra zárt, szöveg körbefutás
			- Jobbra zárt, szöveg körbefutás
			- Teljes szélességű kép (banner) 
			
	- Videó beágyazás
		- A videó cikk típusnál külön mezőben lehet megadni a cikk fő videójának URL címét.
		- Egyéb cikk típusok esetében a cikk szövegtörzsébe beszúrt videó URL-t a rendszer automatikusan felismeri és kicseréli egy méretezhető képre. A képet a tartalomszerkesztő a hagyományos kép méretezési metódusokkal rendezi (balra zár, jobbra zár, teljes szélességű), amely a felhasználói felületen kicserélődik az eredeti YouTube beágyazott videó lejátszóra. 
	- A felületen WYSWYM módon lehet a tartalmakat szerkeszteni. Fontos irányelv, hogy a tartalomszerkesztés közben teljesen szabad kezet ne adjunk a szerkesztőnek, aki kizárólag a **tartalomelem funkcióját** határozhatja meg. Például megadható, hogy egy tartalomelem cím, bekezdés, kiemelés funkciójú legyen, de például a betűméret nem állítható. Ezzel a módszerrel elkerülhető az **arculati elemek inkonzisztens alkalmazása**.

### Megrendelések
A megrendelések modul segítségével a **képeslap megrendelések** kezelhetőek. A felületen nyomon követhetőek az E-card megrendelések is.

- Megrendelések listája
	- Id, típus (pod, ecard, hagyományos), feladás dátuma, összeg
	- E-card esetében: kiküldés dátuma
	- POD, képeslap esetében: feldolgozás dátuma
	- Adminisztrátori feladatok
		- Megrendelés törlése
		- Megrendelés feldolgozottnak jelölése
		- POD nyomdai anyag letöltése
	
### Tartalomszerkesztő
A tartalomkezelő modul segítségével a **statikus oldalak tartalma** szerkeszthető. A szerkeszthető oldalak előre rögzítésre kerülnek.

- Szerkeszthető oldalak listája
- Egy oldal szerkesztése
	- Minden szerkeszthető tartalomhoz feltölthető egy **fejléc banner**. Ez a kép a felhasználói felületen a szerkeszthető tartalomelemek felett, azoktól függetlenül megjelenik. 
	- Kép beágyazás
		- A beágyazáshoz a képeket először a cikkhez fel kell tölteni.
		- A cikkhez automatikusan létrejön egy galéria. A megjelölt képek a felhasználói oldalakon galéria nézetben léptethetőek.
		- A feltöltött képeket drag-n-drop módszerrel lehet a cikk szövegtörzsébe beágyazni.
		- A beágyazott képeket három módon lehet a szöveghez képest rendezni:
			- Balra zárt, szöveg körbefutás
			- Jobbra zárt, szöveg körbefutás
			- Teljes szélességű kép (banner) 
	- Videó beágyazás
		- A tartalom szövegtörzsébe beszúrt videó URL-t a rendszer automatikusan felismeri és kicseréli egy méretezhető képre. A képet a tartalomszerkesztő a hagyományos kép méretezési metódusokkal rendezi (balra zár, jobbra zár, teljes szélességű), amely a felhasználói felületen kicserélődik az eredeti YouTube beágyazott videó lejátszóra. 
	- A felületen WYSWYM módon lehet a tartalmakat szerkeszteni. Fontos irányelv, hogy a tartalomszerkesztés közben teljesen szabad kezet ne adjunk a szerkesztőnek, aki kizárólag a **tartalomelem funkcióját** határozhatja meg. Például megadható, hogy egy tartalomelem cím, bekezdés, kiemelés funkciójú legyen, de például a betűméret nem állítható. Ezzel a módszerrel elkerülhető az **arculati elemek inkonzisztens alkalmazása**.
	
---
# Képeslapok modul
## A modul célja
A modul célja, hogy a látogatók különböző kategóriákba sorolt **képeslapokat** testre szabjanak és azokat **megvásárolják**. A megrendelt képeslapokat ezután postán kapják meg. A vásárlási folyamatnak **intuitívnak** és **gyorsnak** kell lennie, hogy minél kisebb mértékű legyen a folyamat elhagyása. A folyamat bármikor **abbahagyható** és bármelyik lépésébe újra **visszacsatlakozhat** a felhasználó.
## UI nézetek

### Ajánlói nézet
A képeslap modul több nézetébe beszúrható rész, amely az épp aktuálisan böngészett kategória, vagy termék(ek) kapcsán ajánlott plusz termékeket jelenít meg a felhasználó számára:

- Ha kategóriát böngészik a felhasználó, akkor a kategória legnépszerűbb termékei jelennek meg.
- Ha termék vagy termékek vannak a kontextusban (például kosár nézet), akkor a termék első kategóriáját kiválasztja a rendszer és az alapján ajánl újabb termékeket.

A rendszer a későbbiekben külső **ajánlói rendszer szolgáltatás** beépítését is lehetővé teszi.

### Modul főoldal
- 3 hasáb.
- A POD funkció **működését szemléltető ábra**.
- Aktuális **hirdető banner**.
	- Szezonális POD akciók.
- 3 **legnépszerűbb képeslap.**
	- Az adminisztrációs felületen kiválaszthatóak az aktuálisan ebben a sávban megjelenő képeslapok. Ha kevesebb mint 3 képeslap van megjelölve, a rendszer a legnépszerűbbekkel tölti fel a helyet.
- 3 **legnépszerűbb** képeslap **kategória**.
- Bal oldalon megjelenik az **összes POD kategória**. A névre való kattintáskor az **alkategória listanézet** jelenik meg.
#### Mobil nézet
A mobil nézetben az alábbi tartalmak egymás alá rendeződve jelennek meg:

- A POD funkció **működését szemléltető ábra**.
- Az aktuális **hirdető banner** mobil változata.
- POD **kategóriák** egymás alatt; alkategóriái behúzással rendezve.

### Főkategória lista	, alkategória lista	
A látogató a **kiválasztható képeslap kategóriákat** látja lista nézetben. A kategóriák alatt szöveges leírás jeleníthető meg. A rendszer **alapértelmezés** szerint a kategória **legnépszerűbb** képeslapjait jeleníti meg a lista elején.

- A képeslapok alatt megjelenik az **áruk**.
- **Testre szabható-e** az adott képeslap vagy nem.
- A képeslapok képe mellet megjelenő kis **szív ikonnal** tudja a felhasználó az adott lapot a **kedvencei** közé rakni.
- A lista oldalán megjelenik a **többi kategória** neve is. A checkboxok bejelölésével a megjelenített **lista kibővül** az újonnan bejelölt kategóriákba tartozó képeslapokkal is.
- A képeslapok **egy oldalon** jelennek meg, oldal lapozására nincs lehetőség.
	- Alapértelmezetten a képeslapok képe helyett **helykitöltő képek** jelennek meg. Ez segíti a **gyors megjelenítést**, és megadja az oldal teljes magasságát. 
	- A képeslap eredeti képeinek a betöltése az ún. **lazy load** technológiát alkalmazza, tehát a képek akkor kerülnek betöltésre, amikor a felhasználó az oldal alsóbb részeit megjeleníti.
 
A lista nézethez kapcsolódóan különböző **sorrend beállítások** érhetőek el:

- Sorrendben megjelenítés **ár alapján**. Növekvő és csökkenő sorrend.
- **Legújabb** és **legrégibb** képeslapok sorrend.
- **Népszerűség alapján** való rendezés.
- Alapértelmezett: **legutoljára feltöltött**. 
- A képeslapok sorrendje az adminisztrációs felületen manuálisan állítható.

A lista nézethez kapcsolódóan különböző **szűrési beállítások** érhetőek el:

- Csak **személyre szabható** képeslapok. (POD)
- Csak **elektronikusan küldhető** képeslapok.
- Csak **hagyományos** képeslapok.

#### Mobil nézet
A nézet mobil változatában az alábbi elemek jelennek meg:

- A mobil menürendszerből elérhető **kategória választó lista**.
- Az oldalon az épp **kiválasztott kategóriákba** tartózó képeslapok jelennek meg egymás alatt. A képeslaphoz **kép** és **ár** információk elérhetőek.
### Egy képeslap nézet
- Az oldal célja, hogy teljes körű információt adjon a felhasználónak a termékről.
- A lista nézetben a képeslapra való kattintással nyílik meg az oldal, amin a **képeslap oldalai** jelennek meg **áttekintő** nézetben. Ebben a nézetben a képeslap még **nem szerkeszthető**.
- Továbblépéssel a felhasználó **kosarába bekerül a képeslap** aminek a szerkesztéséhez a felhasználó bármikor visszatérhet.
- A felhasználó az alábbi felületekre érkezik a továbblépéssel:
	- Ha a képeslap **POD**, akkor a **POD szerkesztő áttekintő** nézethez.
	- Ha a képeslap **E-card**, akkor az **E-card szerkesztő** nézethez.
	- Ha a képeslap **hagyományos Képeslap**, akkor **Kosár** nézetre.
#### Mobil nézet
A nézet mobil változatában az alábbi elemek jelennek meg:

- A **képeslap oldalai** egymás alatt.
- A nézetből a felhasználó visszatérhet a **kategória lista** nézethez.
### POD szerkesztő áttekintő
Ebben a nézetben a felhasználó megkezdte a **POD képeslap testreszabását**. Az áttekintő nézetben a képeslapok elnevezett oldalait látja egymás mellett (elülső, hátsó, belső oldal). 

- A rendszer a képeslap oldalhoz kapcsolódóan jelzi, hogy az **szerkeszthető, vagy sem**.
- A felhasználó az oldalra kattintva modal ablakban nyitja meg a **képeslap oldal szerkesztő** felületet.
- A felhasználó a szerkesztés befejeztével továbbléphet a **kosár nézethez**.
#### Mobil nézet
A nézet mobil változatában az alábbi elemek jelennek meg:

- A **képeslap oldalai** egymás alatt.

### POD oldal szerkesztő
Ebben a nézetben a felhasználó az **áttekintő nézetben kiválasztott** képeslap oldalt szerkesztheti. A szerkesztést követően a felhasználó a **POD szerkesztő áttekintő** nézethez léphet vissza.

- A **soronként szerkeszthető** típusú szövegre való kattintáskor a szöveg sor mellet **kis modal ablak** jelenik meg, amelyben a felhasználó beállíthatja a **sor stílusát** a kiválasztott betűtípus adta kereteken belül. A soronként szerkeszthető szöveges mező esetében a sor **dimenziói nem változnak** a szerkesztés során és a szerkesztett **szöveg túlfut** a mező határain. Túlfutás esetén a rendszer figyelmezteti a felhasználót.
- A **bekezdés szerkesztő** típus esetében a fő eltérés a **soronként szerkeszthető** típushoz képest, hogy a felhasználó által megadott szöveget a rendszer automatikusan **több sorba töri**, a szöveg **nem fut túl** a mező dimenzióin. Ha a szöveg mennyisége eléri a rendelkezésre álló maximum helyet, a rendszer **letiltja a további szövegbevitelt**.
- Mindkét szerkesztési típus esetében a rendszer megpróbálja a felhasználót automatikus méretezéssel segíteni.
	- A soronkénti szerkesztés esetében a szöveg középre zárt és a rendszer automatikusan teljes szélességűre méretezi a szövegeket.
	- A bekezdés szerkesztő esetében egy nagyobb betűmérettel indít a rendszer és ha a szöveg elér egy bizonyos mennyiséget, automatikusan csökkenti a méretet.

- Mindkét szerkesztési típus esetén az alábbi beállításokra ad lehetőséget a rendszer:
	- **Betű család**, legördülő listából választható
		- Google Fonts betűtípusok
		- TTF betűtípusok
	- **Betűszín**, listából választható, 50 szín
	- A szöveg **visszaállítása az eredeti állapotra**.
- Mindkét szerkesztési felületen a rendszer az alábbi **szerkesztési hibákra figyelmeztet**:
	- A szöveg az eredetileg beállított maradt, tehát **nem lett személyre szabva**.
	- A szöveg bármelyik dimenzióban **kilóg** a rendelkezésre álló helyről.
	- A háttér és a kiválasztott betűszín **kontrasztjában nem eléggé eltérő**.
#### Mobil nézet
A szerkesztő felület mobil változata **korlátozott szerkesztési lehetőségeket** tesz lehetővé a felhasználók számára. A szerkesztési áttekintő nézetben a képre kattintva a képeslap oldalának **szöveges tartalma** jelenik meg a mobil billentyűzet felett, amely **kizárólagosan szerkeszthető**. A mobil nézetben a betű családja, színe és mérete nem változtatható a platform korlátaiból adódóan. A szöveg szerkesztését követően a felhasználó visszatérhet a **szerkesztés áttekintő nézetéhez**, a felhasználó meg tudja tekinteni a szerkesztés eredményét.

### E-card szerkesztő
Ebben a nézetben a felhasználó az **egy képeslap nézetben** kiválasztott, elektronikus képeslapot szabja testre. Az oldal alapvető célja, hogy az **e-mail küldés adatait** a felhasználó beállítsa. Az e-mail a **Cardex levelezési címéről** kerül kiküldésre. Mivel a vásárlás során a felhasználó személyes adatai bekérésre kerülnek, így ebben a nézetben erre vonatkozó kérdéseket nem teszünk fel.

- Címzett e-mail címe
- E-mail tárgya
- E-mail szövege
- Küldés időpontjának ütemezése

TODO: animácio paraméterezés

Az alapvető koncepció, hogy a **képeslap érkezéséről szóló levél már személyes tartalmú legyen**, azt a felhasználó tudja összeállítani. Mivel a képeslapok flash formátumúak, így az **e-mailben azok megjelenítésére közvetlen lehetőség nincs**. A képeslapok megtekintésére szolgáló web felület hivatkozását a felhasználó a szerkesztés során tudja beilleszteni a személyes üzenetbe. A felhasználónak lehetőséget adunk, hogy az elkészített **személyes e-mailt előnézet formátumban** megtekintse.

Az **SWF formátumban eltárolt animációk** automatikus konvertálására egy különálló script készül. A program **HTML5 videó formátumot** készít a fájlokból.

A kiküldött levélben a videó beágyazásra kerül, és amely e-mail kliensek nem képesek megjeleníteni a leveleket, ott a webes verzió megtekintését javasolja a program.

### Kosár
A felhasználó lista nézetben áttekintheti és kezelheti a kosárba rakott Képeslap elemeket.

- Kattintásra kinagyíthatja a kész képet (modal)
- Törölhet a listából tételeket.
- **Visszatérhet** az előző oldalra.
- Megtekintheti a vásárlandó **tételek összértékét**.
- **Továbbléphet** a vásárlás folyamatában.
A felhasználó több módon érkezhet erre a felületre:
- Egy képeslap megszerkesztése után, ha nem kíván újabb tételeket vásárolni, választhatja a megrendelés leadását és ekkor a Kosár nézetre érkezik.
- Ha a vásárlás folytatását választotta, akkor az oldalon elhelyezett minialkalmazáson keresztül bármikor választhatja a megrendelés leadását és ekkor is a Kosár nézetre érkezik.
A kosár nézet egyszerűsített formájában az **oldal bal vagy jobb szélén** is megjelenhet a vásárlás folyamát, folyamatosan tájékoztatva a felhasználót az aktuális tételekről. 

#### Mobil nézet
A mobil nézetben a lista nézethez hasonlóan a képeslapok egymás alatt jelennek meg. A nézet tetején a kosár összértéke látható. A nézet a mobil menürendszerből közvetlenül elérhető.

### Szállítási adatok, fizetési mód
A felhasználó rögzítette a megrendelendő tételeket, majd ebben a nézetben pontosíthatja a megrendelés adatait. A felhasználó leadhatja a megrendelését **regisztráció nélkül** is.

- Bejelentkezhet.
- Regisztálhat.
  - A felhasználónév és jelszó megadása helyben történik a szállítási adatok felett megjelenő mezőkben.
  - A felhasználó létrehozása a továbblépéssel párhuzamban történik, nem töri meg a vásárlás folyamatát.
  - A regisztrációt követően visszaigazoló e-mail kerül kiküldésre, ami a vásárlás folyamatát nem befolyásolja.
- Ha be van jelentkezve.
  - Kiválaszthatja egy listából az eddig használt postázási adatokat.
  - Kiválaszthatja egy listából az eddig használt számlázási adatokat.
- Megadhatja a postázási adatokat.
- Megadhatja a számlázási adatokat (ha eltér a postázási adatoktól).
- Továbbléphet a fizetési oldalra.

Annak elősegítése érdekében, hogy a felhasználók fiókot hozzanak létre, a rendelés elküldése után a rendszer felajánlja egy felhasználói fiók létrehozását. Mivel ekkorra már tudjuk a felhasználó e-mail címét, így egy jelszó megadásával létrehozhatja a fiókot.

#### Mobil nézet
Ennek a nézetnek a mobil változata több részre tagolódik. Ha a felhasználó be van jelentkezve akkor rögtön a harmadik nézet jelenik meg.

1. A nézet megkérdezi a felhasználótól, hogy be kíván-e jelentkezni, regisztrációt indít vagy anonim módon folytatja a vásárlást.
2. Ha a bejelentkezést választja, akkor a bejelentkező felületre kerül, majd autentikáció után a 4-es felületre kerül.
3. Ha regisztrál, akkor a folyamatot követően a 4-es felületre kerül.
3. A felhasználó kiválaszthat egyet az elmentett postázási címek közül.
4. A rendszer 3 egymás alatti űrlapon az alábbi adatokat kéri be. (Bejelentkezéstől függően egyes adatok ki lehetnek töltve)
	- Postázási cím
	- Számlázási cím
### Fizetés
A felhasználó a tételek rögzítése és a szállítási adatok megadása után kifizetheti a megrendelt termékeket.

- Fizethet **bankkártya** segítségével. A bankkártyás fizetés indítását követően a felhasználót a rendszer a közreműködő **bank fizetési felületére** irányítja. A fizetést követően a felhasználó visszakerül a cardex oldalára ahol a sikerességtől függő üzenetet láthat.
- A megrendelés az adatbázisba kerül és az adminisztrációs felületen keresztül kezelhető.
- A felhasználó továbbá PayPal hozzáféréssel is fizethet. A fizetési folyamat elindítása után a felhasználó a **PayPal** fizetési oldalára kerül, ahol bejelentkezhet és a fizetést lebonyolíthatja.
A fizetést követően a felhasználó a rendelt tételek listáját tartalmazó és a **rendelést megerősítő e-mailt** kap. A **rendszer üzemeltetője** ugyancsak **e-mail értesítést** kap a megrendelés beérkezéséről.
Ha a felhasználó a rendelés során felhasználói fiókot hozott létre, akkor a **Felhasználó modulon** keresztül tudja követni a megrendelésének adatait. Az oldalt, ahol az **adott megrendelését** közvetlenül módosíthatja, az e-mail értesítőn keresztül is megkapja.
 
### Nyomdakész anyag generálása
A rendszer a felhasználó áltat megszerkesztett képeslapot elkészíti és eltölthetővé teszi **nyomdakész formában** az alábbi paraméterekkel:

- Raszterizált PDF
- 300dpi felbontás
- CMYK színskála
- Kilövések (további egyeztetést igényel)
- A nyomdakész anyagba ICC profilt ágyazunk be.

A nyomdakész anyag a POD modul adminisztrációs felületén **manuálisan letölthető**.
### Whitelabel POD	
A modul ezen nézete egy speciális **stílusfájlok nélküli lista nézet**. A stílusfájlok és a megjelenést befolyásoló kódrészletek az idegen rendszerbe való integráláskor, egyedileg kerülnek megszerkesztésre. A modul az alábbi konfigurálható elemekben tér el a hagyományos működéstől:

- Egyedi stílusfájlt használ.
- Meghatározott keretek között alkalmazkodik a befogadó rendszer szélességéhez. 
- A rendelések rekordjához bekerül a bolt azonosítója.
## Adminisztráció
Adminisztrációs modulok amelyek érintik a Képeslapok modul működését:

 - Képeslapok
 - Címkék
 - Megrendelések
 - Felhasználók
### POD képeslapok listája / törlés
A modulban táblázatos lista nézetben jelennek meg a feltöltött képeslapok.

- Sorbarendezés
	- A képeslapokat lehetőség van több kategóriában is különböző sorrendbe rakni dran&drop módszerrel. Például egy képeslap a Karácsonyi kategóriában lehet legelső helyre rakva, de a zenélő képeslapok között ugyanez a képeslap lehet az utolsó helyre sorolva.
- Szűkítés kategóriák szerint
- Törlés
	- A rendszer megerősítő kérdést tesz fel.
### POD képeslap szerkesztése / hozzáadása
- A képeslaphoz több **kép tölthető** fel, amelyek a képeslap **oldalai**. 
	- A képeket elég **egy méretben** feltölteni, a rendszer **automatikusan** generál belőle **nézőképeket**.
	- A feltöltött oldalak **sorrendje** drag&drop módszerrel **változtatható**.
	- A nyomdakész anyag generálása során a rendszer a megadott sorrendet veszi alapul.
- A képeslapok oldalai megjelölhetőek:
	- Előlap
	- Hátlap
	- Belső lap
- A képeslapok oldalain szerkeszthető szöveges elemek helyezhetőek el.
	- **"Soronként szerkeszthető"**
		- A szerkeszthető felület **minden egyes sora külön szerkeszthető** a felhasználó számára. Jellemzően a képeslapok **feliratos külső oldalai**, feliratok. Ehhez a típushoz **helykitöltő szöveg** megadása kötelező.
	- **"Bekezdés szerkesztő"**
		- Fix betűtípussal és mérettel szerkeszthető szöveges rész. Jellemzően a képeslap **üzenet része**. Ezen típushoz a szövegbeviteli mezőt **manuálisan lehet ráhelyezni** és méretezni a képeslap layoutra.

# Ajándéktárgyak
## A modul célja
A modul célja, hogy az ajándéktárgyak iránt érdeklődő vásárlókat a külső webshop felületre irányítsuk, ahol az ajándéktárgyakat meg tudják vásárolni. Mivel az egyes ajándéktárgy kategóriákhoz kapcsolódóan **kiegészítő marketing üzenetet** jelenítünk meg az aktualitásokkal, a felhasználókat csak a kategória nézet után irányítjuk a külső weboldalra.

## UI nézetek

### Összes ajándéktárgy kategória nézet
A látogató a **kiválasztható ajándéktárgy kategóriákat** látja lista nézetben. A kategóriák alatt szöveges leírás jeleníthető meg. A rendszer **alapértelmezés** szerint a kategória **legújabb** ajándéktárgy kategóriáit jeleníti meg a lista elején. 

A nézet tetején egy teljes szélességű marketing banner jelenik meg.

### Egy ajándéktárgy kategória nézet
Az ajándéktárgy kategória kiválasztása után a felhasználó erre a felületre jut. A felület felépítése:

- Aktualitások banner.
- Az oldal grafikájába szerkesztet **átirányító sáv**.
- Marketing szöveg, tetszőlegesen szerkeszthető.

## Adminisztráció
A ajándéktárgyak kategória oldalai **szerkeszthető tartalomtípusként** jelentkeznek az adminisztrációs felületen. Adminisztrációs modulok amelyek érintik a Ajándéktárgyak modul működését:

 - Tartalom kezelő
	 - A modul lista oldalán az **Ajándéktárgyak címkére szűrve** jelennek meg a szerkeszthető kategória tartalmak.
	 
# Ötletek
## A modul célja
A modul célja, hogy az oldalon olyan tartalmat szolgáltasson ami a **várásláson kívül** is a weboldalra csábítja a felhasználókat. Az **érdekes, releváns** tartalomért érkező felhasználók tudatába jobban beépülnek a fizetős szolgáltatások megléte és később **vásárló válhat belőlük**.
## UI nézetek
### Ötletek menüpont nézet
A felhasználó az Ötletek menüpontra kattintva kerül erre a nézetre, ahol áttekintheti a választható almenüpontokat.

### Magazin, Újdonságok
Cikkek gyűjteménye, blog szerű nézetben. Az oldal tetején a **kiemeltnek megjelölt cikkek** jelennek meg maximum három hasábban, majd utána a dátum szerint következő tartalmak. A cikkek lista nézeténél a cím, a lead és egy kép jeleníthető meg. Az oldalhoz marketing banner csatolható.

- A felhasználó kiválaszthat egy cikket elolvasásra.

### Videók
YouTube videók megjelenítése 3 hasábban. Az oldal tetején a **kiemeltnek megjelölt videók** jelennek meg, majd azt követően az összes többi. A videókhoz rövid leírás csatolható.

- A videó kezdő képére kattintva modal ablakban nyílik meg a lejátszó és a video automatikusan elindul. 
## Adminisztráció
Az ötletek modul tartalmai cikkekként szerkeszthetőek az adminisztrációs felületen. Adminisztrációs modulok amelyek érintik a Ajándéktárgyak modul működését:

 - Tartalom kezelő
	 - A modul lista oldalán az **Magazin, Újdonságok, Videók címkére szűrve** jelennek meg a szerkeszthető tartalmak.
# Felhasználói profil
## A modul célja
A **regisztrált felhasználók személyes fiókja**. A fő cél a **megrendelések áttekintése** mellet, hogy a közösségi média ismerősök importálása után **kényelmi funkciókat** biztosítsunk a felhasználóknak, amivel később vásárlásra ösztönözhetjük őket.
## UI nézetek
### Saját személyes adatok módosítása
Egy oldalon biztosítunk lehetőséget arra, hogy a felhasználó a személyes számlázási és szállítási adatait módosíthassa. Szállítási címből több is megadható, azok törölhetőek.
### Jelszó változtatás
A bejelentkezett felhasználók lehetőséget kapnak arra, hogy új belépési jelszót állítsanak be maguknak.
### Facebook fiók csatolása
Ha a felhasználó a fiókját nem Facebook bejelentkezéssel hozta létre (hanem rögtön e-mail és jelszó megadásával) akkor a fiókjához később csatolhatja a felhasználói fiókját. A folyamat során a létrehozott Facebook pszeudo-applikációnak ad jogosultságok az adatainak olvasására. Az alkalmazás a személyes adatokhoz és a barátok listájához kér hozzáférést.

A felhasználók, akik Facebook fiók csatolása nélkül hoztak létre felhasználói fiókot, egy külön MailChimp listára kerülnek, amin keresztül későbbi kommunikációval elérhetőek.

### Rendelések listája
A megrendelések áttekintő listája, ahol megjelenítjük a megrendelt termékeket, azok összértékét, és a kiszállítás várható időpontját. Ha egy megrendelés még nincsen feldolgozott állapotban, akkor törölhető. 
### Fiók törlése
A felhasználó kérésére a **fiókot inaktív állapotba helyezzük** és a felhasználó nevével onnantól a belépés nem lehetséges.
### Ismerősük listája / személyes névjegytár
A kényelmi funkció segítségével a felhasználó **személyes naptárat** hozhat létre, ahol az ismerőseinek a név- és születésnapján figyelmeztető üzenetet állíthat be. A figyelmeztetést a meghatározott időpontban **e-mailen kapja meg**. Ha a Facebook fiókját csatolta, a listába az össze ismerősét **beimportálhatja**. Mivel az applikáció csak a **nevekhez** fér hozzá, így a **névnapi figyelmeztetés automatikus,** míg a **születésnapokat manuálisan** kell felvinnie.

Az esemény felvitelénél a felhasználónak meg kell adnia az esemény típusát. Ezt egy legördülő listából választhatja ki, amely tételek a Képeslapok kategóriái.

Az esemény hozzáadásával a felhasználó az esemény kategóriájának megfelelő MailChimp listára iratkozik fel automatikusan.

A felhasználónak lehetősége van arra, hogy beállítsa, hogy az esemény előtt hány nappal szeretne értesítést kapni. 

# Technikai specifikáció
Az alkalmazás **jQuery**, **Bootstrap**, **Backbone.js** és **Backbone.Marionette** keretrendszerek segítségével **HTML**, **JavaScript** és **CSS** nyelveken kerül kivitelezésre. Önmagában nem futtatható, hanem a projekt egy **Gulp** script segítségével készíti el a futtatható verziót (**Handlebars** előfordítás, **LESS** előfordítás, **Browserify** futtatása).
## Telepítés
### Debian package managerrel (deb) rendelkező rendszereken
``` bash
$ sudo apt-get update && apt-get upgrade
$ sudo apt-get remove nodejs
$ sudo apt-get install npm
$ sudo npm install -g gulp bower n
$ sudo n stable
$ npm install && bower install
```
## Futtatás
A start script közvetlenül a **bin/www** scriptet hívja meg, amely a következő feladatokat végzi el:

- Production környezeti változók beállítása.
- Gulp production scriptek generálás.
- Nodemon daemon kezelővel a fő szerver script indítása: **app/server.js**
``` bash
$ npm start
```
## Kompatibilitás
A modul felhasználói felülete és az adminisztrációs felület a nemzetközi szabványoknak megfelelően az alábbi böngészőtípusokkal kompatibilis:

- Chrome, Firefox, Internet Explorer **utólsó és az azt megelőző** verzió.
- Minden böngésző, amely **nagyobb mint 5%** piaci részesedéssel bír.
## Könyvtárrendszer 
├── app
│   ├── lib
│   ├── routes
│   └── views
├── assets
├── bin
├── bower_components
│   ├── ws-*
├── bundle
│   └── assets
├── gulp-tasks
├── node_modules
├── public
│   ├── assets
│   ├── css
│   └── js
└── test
## 3rd party függőségek
- ^2.1.4 - jQuery
- ^3.3.4 - Bootstrap
- ^1.1.2 - Backbone.js
- ^2.4.1 - Backbone.Marionette
## Hibakezelés
- A modul által kiszolgált methódusok **promise**-okkal térnek vissza, melyek **fail()** methódusán keresztül lehetséges a hibák elkapása.
- A modul a **console.log**-ot használja részletes debug információk megjelenítésére. A modul debug azonosítója: **mod-pod**. A DEBUG környezeti változóban ezt az értéket megadva érhetjük el a debug információkat. Pl: **DEBUG=mod-pod.***
## API végpontok
Az applikáció a következő API végpontokat regisztrálja.
**GET /tags/pod** - POD kategóriák lekérése.
**GET /tags/pod** - POD kategóriák lekérése.
**GET /tagcategories/pod** - POD kategóriák lekérése.
**GET /tagcategories/:tagId/pod/** - POD alkategóriák lekérése.
**GET /tags/:tagId/pods** - POD-ok lekérése egy kategóriából.
**GET /pods/:podId** - Egy POD lekérése.
**GET /users/:userId/addresses** - A felhasználó mentett címeinek lekérése.
**POST /users/:userId/addresses** - Új mentett cím hozzáadása.
**GET /users/:userId/pods** - Felhasználó szerkesztett POD-jainak lekérése.
**POST /podedits** - Új szerkesztett POD hozzáadása.
**GET /podedits/:podeditId** - Egy pod lekérése.
**SET /podedits/:podeditId** - POD szerkesztés elmentése
**POST /orders** - Új megrendelés létrehozása.
**PUT /orders/:orderId** - Megrendelés módosítása.**