Hypermedia project
Intro
Per il corso di Hypermedia applications (web and multimedia) abbiamo realizzato un sito web che, seguendo le seguenti specifiche specifiche, contituisce un sottoinsieme del sito tim.it
I linguaggi utilizzati sono:
- HTML
- JS
- SQL
- PHP (per gestire il contenuto dinamico)
- Ajax (per gestire le chiamate asincrone a pagine PHP)
Il sito web è accessibile da tutti i principali browser all'indirizzo http://timhypermedia.altervista.org/.
Version mobile
In caso di dispositivi mobile il sito web è accessibile:- dal link precendete (con grafica dedicata per schermi di ogni dimensione)
- in formato applicazione , disponibile per dispositivi Android al sequente link TIM.apk.
L'applicazione è stata generata utilizzando la versione online di Phonegap.
Struttura codice
Il progetto è strutturato nel sequente ordine:
-
le pagine HTML si trovano nella directory principale WEBSITE
-
i file CSS in WEBSITE/css
-
i file JS in WEBSITE/js
-
tutte le imagini in WEBSITE/images
-
i file PHP in WEBSITE/db
-
i file del database in formato .sql nella cartella DB. In particolare il file DB.sql contiene l'intero db e il file DB-Schema.pdf contiene lo schema della struttura del database.
-
i file di Phonegap con l'applicazione sono nella cartella Phonegap
-
file di documentazione e mockup
Per costruire il nostro sito abbiamo preso spunto da un template online, il quale ci ha fornito una base per l'aspetto grafico. Abbiamo utilizzato parte dei css e delle funzioni javascript basati su Boostrap e Jquery.
Le librerie e funzione esterne sono posizionate rispettivamente nella cartella "libraries":
- WEBSITE/css/libraries per delineare l'aspetto grafico generale del sito
- WEBSITE/js/libraries per ottenere degli effetti grafici complessi, come per esempio il menu a tendina e lo slider dei prodotti.
Funzionalità opzionali implementate:
- Form per la richiesta generale di informazioni: è presente un bottone "contattaci" nelle 4 pagine degli assistance services che mostra questo form.
- Il filtro per i prodotti (gestito usando i cookies o in alcuni casi specifici usando il paramentro "filter" passato col il metodo GET). Esso permette di filtrare dinamicamente basandosi sul tag degli oggetti nella lista.
- Particolare attenzione è stata data anche a possibili attacchi SQL, abbiamo quindi filtrato ogni parametro.
Problemi di incompatibilità con Phonegap
Dai test effettuati nell'applicazione non tutti i dispositivi mobile supportano la lettura dei cookies, non permettendo quindi il funzionamento corretto del filtro.
Inoltre Phonegap non rende disponibie la funzione "document.referrer" abbiamo quindi optato per, a differenza della modalità browser, un link "Vai a" che garantisse il giusto funzionamento ma non contestualizzato.