Site MarketDB

tonguescurlySoftware and s/w Development

Nov 17, 2012 (4 years and 7 months ago)

393 views

Marine Canessa


et

Guillaume Pilot


Site MarketDB


I
-

Installation


Le projet zip contient le projet sous netbeans.

La base de données «

marketDB

» est à mettre dans le dossier derby de netbeans.

Pour la base de données,

dans

netbeans, dans l’onglet
Service

:

Il faut créer une nouvelle connexion avec l’url suivante

:jdbc

:derby://localhost

:1527/marketDB

Et user name= admin et mot de passe = admin


Au cas où la base de données ne fonctionne pas correctement, nous avons créé une méthode qui
insère 9 pr
oduits dans la base.

Cette méthode se trouve dans indexBean et est appelée au debut de
la ServletIndex (elle est actuellement en commentaire).


II
-

Code de connexion


Admin



L
ogin

: buffa



Mot de passe

: buffa

Client



L
ogin

: za



M
ot de passe

: z
a




III
-

Explication technique


Il existe un héritage entre le «

Product

» et ses classes filles «

Clothing

», «

Equipment

» et
«

Gadget

».


Un SessionL
istener a été géré pour contrôler la non utilisation de la session et la remise des produits
contenus

dans le panier dans la base de données au bout d’une certaine durée.



IV
-

Généralités


Les images des produits doivent
être

contenues dans le dossier du war web/img/prod pour être
utilisé par les produits lors de la création
.

Le time out de la session
est gérée dans Session.java
.

Il est très court pour tester le SessionListener
du paragraphe précédent.

Attention
, il arrive que twitter soit
surchargé

et bloque les APIs donc s
i ça ne fonctionne pas, retentez

plus tard.


V
-

API
s

utilisée
s

et
Technologies
Web 2.0
:


JQuery

Nous avons utilisé
le framework
JQuery qui nous
a
permis de

faire un design agr
éable sans
extravagances
. Il permet de rendre le site dynamique.

Twitter

U
n client peut twitter sur un produit

et le commenter

Un administrateur choisit de twit
ter une nouveauté ou une nouvelle promotion

On
a utilisé

un
plugin

de JQuery pour
li
re

le flux RSS de twitter
affiché
dans l’onglet Actualités
.

Youtube

On affiche les pubs concernant les articles de sports, présentes sur
Y
ou
T
ube.

Une
vidéo
, la première de
la list
e est affichée dans une fenêtre prévue

à cet effet sur la page
d’accueil.

Et dans
l’onglet

«

Mes Pubs

» il est possible de voir toutes les
vidéos

de
Y
ou
Tube

à ce sujet, avec une
navigation entre les
différentes

vidéos possibles.




VI
-

Administrate
ur (Back Office)


Sur la page d’administration du site, il y a 4 onglets disponibles et un pour «

logout

» et un autre
«

home

» pour le retour sur le site principal.

L’onglet «

new admin

»

:


Il peut alors créer un nouvel administrateur du site en
remplissant le formulaire.

L’onglet «

new product

»

:


Il peut ici créer un nouveau produit à ajouter au site, pour
cela

il remplit le formulaire.

Il créé un produit (1 image est obligatoire, et 3 au maximum). Il peut, lors de la création,
choisir que la n
ouveauté soit envoyée dans twitter grâce à un nouveau twitt.


L’onglet “see products”:


Dans cet onglet, l’administrateur peut consulter tous les produits de son site
, qui
apparaissent dans un

tableau
.

Ce tableau montre les principales informations associé
es aux produits, et propose de
modifier la quantité en
stock directement dans un champ

dynamique, de supprimer le produit ou de
le modifier.

Lorsqu’un produit fait partie d’une commande, on ne peut pas le supprimer de la base sinon
le client ne pourrait pl
us voir le détail de la commande concernée.

Pour la modification du produit, un formulaire apparaît avec les valeurs existantes,
l’administrateur peut les modifier à son aise. Pour la modification des images associées aux produits
il peut les supprimer et
en ajouter de nouvelles.

Il peut
,

lors de la modification, choisir que la
modification de la promotion (s’
il y en a une) soit
envoyée

dans twitter grâce à un nouveau twitt.


L’onglet “see orders”:


Il peut afficher toutes les commandes passées par les cli
ents.

Et
afficher

leurs détails.



VII
-

Page d’accueil


La page d’accueil est constitué
e

d’
un menu en haut
contenant
«

Products

»
,
«

promotions

»
,
«

actuality

»
,
«

my pubs

»
,
«

contact us

»
,
«

admin

», d’un menu à gauche
contenant
«

Clothing

»
,
«

E
quipment

»
,
«

G
adget

»
,
«

les plus vendus

»
,
«

les plus vus

».

Une zone centrale
présente

les produits, un panier, une zone cliente et une
fenêtre publicitaire sont
s
ituées sur la droite et le meilleur produit du site affiché dans une
fenêtre

dédiée sur la gauche.

Il y a un champ de recherche qui est géré avec une
auto complétion

des mots selon les noms des
produits et les marques disponibles dans notre site, cela a été fait avec Jquery.

Il fonctionne à partir
de 2 caractères (sinon trop lourd

avec beaucoup de produits dans la base).

Par défaut sur la page d’accueil, sont affichés les derniers produits ajoutés

: les nouveautés.

Voici l’utilité des différents onglets des 2 menus

:

-

Products

: affiche tous les produits

-

Promotions

: affiche tous le
s produits en promotion du site

-

Actuality

: affiche le flux RSS de twitter concernant marketDB, c'est
-
à
-
dire toutes les
promotions, les nouveautés et commentaires des gens.

-

Mes pubs

: affiche les pubs concernant les articles de sport decathlon dans la page
.

-

Contact us

: affiche un formulaire à remplir et à nous envoyer

-

Admin

: permet d’accéder à la zone administrateur du site

-

Clothing

: affiche tous les
vêtements


-

Equipment

: affiche tous les

produits de la
catégorie

équipement

-

Gadget

:

aff
iche tous les pro
duits de la
catégorie

gadget

-

Les plus vendus

: un top des produits les plus vendus
, grâce à notre table Stat qui
comptabilise le nombre de fois où un produit a été acheté

-

Les plus vus

: un top des produits les plus consultés.

(de la même manière que
précéd
emment
, lorsque le client clique sur les détails d’un produit)

Sur chaque produit, l’internaute peut ouvrir le détail du produit,

qui contient les informations du
produit, les images, et les commentaires des gens.

Il
peut l’ajouter au panier,
il peut notif
ier le produit en mettant un commentaire et en classant le
produit avec une note sur 5. Il peut aussi twitter un message sur twitter concernant ce produit.

Le
twitte est fait par le compte de notre site et contient le nom du client.




VIII
-

Client (Front

office)


Pour chaque produit affiché, l’utilisateur peut

:

-

Créer un commentaire sur un produit, en notant le produit avec un nombre d’étoiles

-

Créer un commentaire sur twitter associé à un produit

-

Achter un produit en l’ajoutant à son panier

-

Consulter sa page de détails, sur laquelle il consultera les
différentes

informations, visualisera
les images associées, il pourra voir l
es commentaires et notifications

des utilisateurs, et bien
sûr acheter le produit.


Gestion du p
anier

:


Le panier est
rempli lorsque l’utilisateur achète un/des produit(s).

Lorsqu’un produit est ajouté dans le panier, il est supprimé de la base de données, c'est
-
à
-
dire que sa
quantité est mise à jour
, pour que les quantités en stock ne soient pas faussées lorsqu’il y a pl
usieurs
utilisateurs
.

L’utilisateur peut visualiser son panier à tout moment, sous forme d’un tableau, et modifier les
quantités pour chaque produit ou en supprimer.

(base de données mise à jour ici aussi)

Ensuite le pan
ier est soit validé soit effacé
.

Pou
r être validé il faut que le client soit logué sur le site.

Si la commande est validé
e
, une commande est créée dans la base de données, sinon les produits
sont ‘remis’ dans la base de
données,

c'est
-
à
-
dire que les quantités sont remises à jour, de même que

si la session expire.


IX
-

Compte
Client


Une fois que le client es
t authentifié

sur le site, il a accès à un nouveau menu sur la droite lui
permettant

:

-

De modifier ses informations personnelles

-

De consulter ses commandes passées, avec leurs détails a
ssociés

-

Et se
déconnecter

Lorsque le client est logué, il peut valider sa commande.