[PHP, Javascript] Compito di web programming

[corel_86]

Salve amici e colleghi ho un problema, devo fare la materia Web Programming nella mia università però il corso non c'è più e sono molto in difficoltà.
Posterò un compito che è stato fatto nell'ultima sessione, ma non con l'intento che lo fate voi e io scopiazzo di brutto, ma per capire come devo svolgerlo.

Non ho idea di come cominciare e mi serve una grossa mano.
Innanzitutto questo è il compito

Si vuole costruire un parser composto da un client (in javascript) ed un server (in PHP).

Il server PHP deve elaborare dei dati in formato CSV memorizzati nel file
"prenotazioni.csv", aventi questa struttura:

id, data-inizio, data-fine, camera,tipo-camera, id-cliente, prezzo


id, camera, prezzo sono campi numerici di massimo 6 cifre. tipo-camera può essere:
singola, doppia, tripla.

id-cliente è un campo alfanumerico di massimo 16 caratteri.

data-inizio, data-fine sono nel formato GG-MM-AAAA.

Il client javascript deve richiedere questi dati attraverso una chiamata AJAX, fornendo il nome del file da elaborare.

Il contenuto dei campi, dopo essere stato validato, deve essere incluso in un JSON di ritorno, secondo il seguente formato:

{"results": [{"id": "...","durata":"...","camera":"...","tipo-camera":"...","id-cliente":"...","prezzo":"..."},"..."]}

durata equivale alla differenza tra data-fine e data-inizio.
I dati così ottenuti vanno ordinati in base al prezzo e inclusi all'interno di 3 tabelle, in base al tipo-camera.

A parte il fatto che devo studiare i vari linguaggi, i miei dubbi sono questi:
1) Quale programma devo utilizzare per implementare tale codice?
2) Come iniziare?
3) Da un compito svolto ho visto che ci sono molti file tra cui: un file .DS_Store, un file .php, un file .js, un file .css

Ringrazio chi pazientemente mi potrà aiutare.

[apatriarca]

È ovvio che non sai dove partire se non hai ancora iniziato a studiare i due linguaggi e la programmazione web più in generale. Non è qualcosa che si può spiegare in una discussione su di un forum, fatti qualche ricerca online o cerca qualche libro sull'argomento (o le dispense del corso se disponibili). Di risorse su PHP e Javascript ne trovi a centinaia.

[corel_86]

Beh le dispense ci sono ma non dicono quale programma utilizzare. Comunque gli appunti sui linguaggi li ho non è questo il problema, ma è il fatto su come iniziare.

[apatriarca]

Immagino tu abbia problemi nella configurazione del server, tutti i file che devi creare sono file di testo.. Puoi scaricare EasyPHP per semplificarti un po' la vita (ma immagino che il corso non si occupasse più di tanto della parte di installazione del server*).

* In caso contrario avresti qualcosa di scritto nelle dispense.

[corel_86]

Sulle slide mi dice che devo installare apache e per vedere se php funziona collocare il file info.php, dove all'interno è presente il seguente codice , nella document root di apache.
Devo capire dove lo devo collocare.

[Coriolis]

Puoi partire dai siti ufficiali che forniscono in modo chiaro tutte le informazioni necessarie su download, installazione, configurazione, test e utilizzo. Hanno anche moltissimi forum e tutorial.

http://www.apache.org -> server http (linguaggi HTML e Javascritp per costruzione pagine.html e script.js)
http://www.php.net -> linguaggio PHP per costruzione pagine.php

Come editor dei file di testo io uso Notepad++.

[corel_86]

Evviva ho installato apache con php e funziona.
Creo il file info.php, dove all'interno è presente il seguente codice e funziona alla grande
Adesso che si fa? Qual è il prossimo passo?

[apatriarca]

Immagino imparare a scrivere una pagina in html. Oppure le basi di uno dei due linguaggi (credo sia abbastanza indifferente quale dei due linguaggi impari prima).

[Coriolis]

Dopo aver studiato i linguaggi HTML, Javascript e PHP in oggetto, una strada è la seguente:
- 1/2 pagina/e .html per invocare la richiesta dei dati e la presentazione degli stessi

- [un file .css contiene la definizione degli stili usati per caratterizzare gli elementi della pagina HTML, quindi nel tuo caso non è obbligatorio]

- un file .js invocato dalla pagina html (ad es. con un bottone) che, usando Ajax e JSON ( http://www.json.it ) , invia la richiesta al server ed elabora i dati di risposta da presentare nella pagina html (ma non so esattamente come funziona JSON, quindi la logica di richiamo potrebbe differire da quella suggerita)

- un file .php invocato dal file js attraverso Ajax che contiene il codice per la lettura del file .csv dei dati

(il file .DS_Store non credo che c'entri proprio nulla)

Tutto il codice può essere scritto a mano con un editor di testo generico (NOTEPAD++ conosce anche le sintassi dei linguaggi che vuoi usare tu) altrimenti cerca in rete degli editor GUI specifici come suggerisce apatriarca.

Oltre c'è solo il codice da scrivere.

[corel_86]

Ok inizierò con il php che la lettura da file mi sembra abbastanza fattibile. Ovviamente per far funzionare il tutto il file deve avere estensione .php perchè se lo faccio con estensione .html non legge niente giusto?

[corel_86]

Ciao ragazzi ho sviluppato il codice del server controllate se è giusto

<html>
	<body>
		<?php
			$file = fopen("prenotazioni.csv","r") OR die("Impossibile aprire il file\n");
			while ($data = fgetcsv($file,67,"\t")){
				foreach($data as $dato) {			 
					echo $dato;
					}
				echo "<br>";
			}
		fclose($file);
		?>
	</body>
</html>

Ringrazio in anticipo

[Studente Anonimo]

Di per sé potrebbe anche essere giusto come codice. Ma nel tuo caso il server non deve restituire i dati (elaborati) in formato JSON? Perché hai messo 67 come lunghezza massima di riga in input? Che calcolo hai fatto? Perché hai indicato il carattere di tabulazione come delimitatore? Dal testo del compito sembra sia la virgola oppure leggo male io la traccia?

[corel_86]

"anonymous_be1147":Di per sé potrebbe anche essere giusto come codice. Ma nel tuo caso il server non deve restituire i dati (elaborati) in formato JSON? Perché hai messo 67 come lunghezza massima di riga in input? Che calcolo hai fatto? Perché hai indicato il carattere di tabulazione come delimitatore? Dal testo del compito sembra sia la virgola oppure leggo male io la traccia?

In effetti potevo mettere direttamente file.size() anziché 67. Comunque ho messo quel valore perché mi sono calcolato il massimo valore di ogni riga. Il delimitatore ho messo tabulazione perché se metto la virgola dalla lettura del file me lo cancella.
Tu hai detto che devo elaborare i file in formato json ma come si fa?

[Studente Anonimo]

Riguardo al 67 era solo una mia curiosità, perché mi sembrava un numero più grande del dovuto. Comunque file.size() è forse eccessivo, perché dalla documentazione della funzione fgetcsv, mi sembra che quel parametro debba essere un numero più grande della lunghezza della righa più lunga presente nel file. Ma in fondo in questo caso forse è melius abundare quam deficere od omettere del tutto se usi una versione aggiornata di PHP.

Sul delimitatore, chiaramente dipende da che carattere hai usato nel tuo file prenotazioni.csv, pensavo fosse la virgola.

Infine sul formato dei dati da restituire. Devi in pratica "convertire" ogni riga letta dal file in un oggetto JSON e poi inserire tali oggetti in un nuovo oggetto JSON con ID uguale a "results".

Detto così sembra complicato, ma in realtà è abbastanza semplice se usi delle funzioni già predisposte come json_encode di PHP. Se poi fai una ricerca in Rete con delle parole chiave come "php csv to json" puoi trovare anche delle soluzioni preconfezionate, che puoi copiare/adattare al tuo caso.

[corel_86]

<?php
	$file = fopen("prenotazioni.csv","r") OR die("Impossibile aprire il file\n");
	while ($data = fgetcsv($file,100,"\t")){
		foreach($data as $dato) {          
			$punti=explode(",", $dato);
			$durata=datediff($punti[2],$punti[1]);
			$json[]=array(	"id"=>$punti[0],
							"durata"=>$durata,
							"camera"=>$punti[3],
							"tipo-camera"=>$punti[4],
							"id-cliente"=>$punti[5],
							"prezzo"=>$punti[6]
							);
			$encoded=json_encode($json);
			echo $encoded;
			}
	}
	fclose($file);	
?>

datediff(x,y) calcola la differenza tra date.
Ora dovrebbe essere giusto adesso non mi rimane che fare la richiesta ajax con javascript. Ho visto che è molto difficile, speriamo bene

[Studente Anonimo]

"corel_86":datediff(x,y) calcola la differenza tra date.

Forse però dovresti prima fare qualche test sul funzionamento del programma lato server. Tralasciando il fatto che forse bisognerebbe controllare la validità dei dati letti dal file, mi sembra che la funzione PHP per calcolare la differenza tra due date sia date_diff non datediff, a meno che tu non abbia scritto una tua funzione a parte con quel nome. Se non è questo il caso, i parametri che gli passi non sono corretti.

Ora dovrebbe essere giusto adesso non mi rimane che fare la richiesta ajax con javascript. Ho visto che è molto difficile, speriamo bene

GIà, a meno di non usare una delle tante librerie Javascript, che fanno quello ed altro con poche righe di codice.

[corel_86]

"anonymous_be1147":[quote="corel_86"]datediff(x,y) calcola la differenza tra date.

Forse però dovresti prima fare qualche test sul funzionamento del programma lato server. Tralasciando il fatto che forse bisognerebbe controllare la validità dei dati letti dal file, mi sembra che la funzione PHP per calcolare la differenza tra due date sia date_diff non datediff, a meno che tu non abbia scritto una tua funzione tua a parte con quel nome. Se non è questo il caso, i parametri che gli passi non sono corretti.

Ora dovrebbe essere giusto adesso non mi rimane che fare la richiesta ajax con javascript. Ho visto che è molto difficile, speriamo bene

GIà, a meno di non usare una delle tante librerie Javascript, che fanno quello ed altro con poche righe di codice. [/quote]

Allora caro stan ti ringrazio per la risposta

questo è il codice del client per esteso

<!DOCTYPE html>
<html>
	<head>		
		<script>		
			var http=getHTTPObject();			
			var url="server.php";
						
		//Creazione tabella e ordinamento
			function ordinamento(){
				if(http.readyState==4){					
					if(http.status==200){
							//corverte json in 
							var response=eval(JSON.parse(http.responseText));
							var swapped;
							//Algoritmo ordinamento
							for(i = 0; i < response.result.length-1; i++)
								for(j = i+1; j < response.result.length; j++)
								if(parseInt(response.result[i].prezzo) >  parseInt(response.result[j].prezzo)) {
										var t = response.result[i];
										response.result[i] = response.result[j];
										response.result[j] = t;
									}
							
							var x;
							for(x in response.result){
								document.write(response.result[x].prezzo + ",");
							}
			
							//Creazione tre tabelle
							for (k=0;k<3;k++){
								document.write('<center><table width="500" border="2">');
								document.write('<td align="center">' + "id" + '</td>'); 
								document.write('<td align="center">' + "durata" + '</td>'); 
								document.write('<td align="center">' + "camera" + '</td>'); 
								document.write('<td align="center">' + "tipo-camera" + '</td>'); 
								document.write('<td align="center">' + "id-cliente" + '</td>'); 
								document.write('<td align="center">' + "prezzo" + '</td>'); 
								//scanzione riga
								for (j=1;j<=response.result.length;j++){
										if(response.result[j-1].tipo_camera=="singola" && k==0){
							document.write('<tr>');		
							document.write('<td align="center">' + response.result[j-1].id+'</td>'); 
							document.write('<td align="center">' + response.result[j-1].durata+'</td>'); 
							document.write('<td align="center">' + response.result[j-1].camera+'</td>'); 
							document.write('<td align="center">' + response.result[j-1].tipo_camera+'</td>'); 
							document.write('<td align="center">' + response.result[j-1].id_cliente+'</td>'); 
							document.write('<td align="center">' + response.result[j-1].prezzo+'</td>'); 									
							document.write('</tr>');
										}
										if(response.result[j-1].tipo_camera=="doppia" && k==1){
							document.write('<tr>');		
							document.write('<td align="center">' + response.result[j-1].id+'</td>'); 
							document.write('<td align="center">' + response.result[j-1].durata+'</td>'); 
							document.write('<td align="center">' + response.result[j-1].camera+'</td>'); 
							document.write('<td align="center">' + response.result[j-1].tipo_camera+'</td>'); 
							document.write('<td align="center">' + response.result[j-1].id_cliente+'</td>'); 
							document.write('<td align="center">' + response.result[j-1].prezzo+'</td>'); 									
							document.write('</tr>');
										}
										if(response.result[j-1].tipo_camera=="tripla" && k==2){
							document.write('<tr>');		
							document.write('<td align="center">' + response.result[j-1].id+'</td>'); 
							document.write('<td align="center">' + response.result[j-1].durata+'</td>'); 
							document.write('<td align="center">' + response.result[j-1].camera+'</td>'); 
							document.write('<td align="center">' + response.result[j-1].tipo_camera+'</td>'); 
							document.write('<td align="center">' + response.result[j-1].id_cliente+'</td>'); 
							document.write('<td align="center">' + response.result[j-1].prezzo+'</td>'); 									
							document.write('</tr>');									
										}
										
								}
								document.write('</table><BR><BR>');				 
							}						
							document.getElementById('box').innerHTML=response;
						}
					}		
			}	
			
			//Chiamata AJAX
			function callAjax(){
				http.open("GET", url,  true); 				
				http.onreadystatechange = ordinamento;
				http.send(null);	
			}

			//Richiesta
			function getHTTPObject(){
				var xmlhttp;
				if(!xmlhttp && typeof XMLHttpRequest != 'undefined'){
					try{
						xmlhttp=new ActiveXObject('Msxml2.XMLHTTP')
						}
					catch(err){
						try{
							// codice per IE6, IE5
							xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
						}
						catch(err2){
							try{
								// codice per IE7+, Firefox, Chrome, Opera, Safari
								xmlhttp=new XMLHttpRequest();
							}
							catch(err3){
								xmlhttp=false
							}
						}			
					}
				}
				return xmlhttp;
			}			
		</script>		
	</head>	
	<body onLoad="javascript:callAjax()">
		<div id="box"> </div>
	</body>	
</html>

mentre questo è la parte del php

<?php
	$file = fopen("prenotazioni.csv","r") OR die("Impossibile aprire il file\n");
	while ($data = fgetcsv($file,100,"\t")){
		foreach($data as $dato) {          
			$punti=explode(",", $dato);
			$durata=datediff($punti[2],$punti[1]);
			$array1[]=array(	"id"=>$punti[0],
							"durata"=>$durata,
							"camera"=>$punti[3],
							"tipo_camera"=>$punti[4],
							"id_cliente"=>$punti[5],
							"prezzo"=>$punti[6]
							);		
			}			
	}
	fclose($file);	
	$json['result']=$array1;
	$encoded=json_encode($json);
	echo $encoded;
	
			
	//Differenza tra date
	function datediff($d1,$d2){
		$arrD1 = explode("-",$d1);
		$arrD2 = explode("-",$d2);
		date_default_timezone_set('Europe/Rome');
		$time1 = mktime(0,0,0,$arrD1[1],$arrD1[0],$arrD1[2]);
		$time2 = mktime(0,0,0,$arrD2[1],$arrD2[0],$arrD2[2]);
    
		$secDif = $time1-$time2;
    
		if ($secDif<0) 
			$secDif=$secDif*-1;
					
		$minDif =  $secDif / 60;
		$hourDif = $minDif / 60;
		$dayDif = $hourDif / 24;
    
	return round($dayDif);
	}
?>

Per favore ragazzi controllatelo che questo è stato fatto in un compito precedente e se ci sono migliorie da fare vi prego di aiutarmi.

Ringrazio in anticipo

[corel_86]

nessuno lo ha guardato?

[Studente Anonimo]

Se vuoi lo si può guardare insieme. Facendo un primo test sul tuo codice con questo file "prenotazioni.csv"

1	2013-02-01	2013-02-21	122	singola	22	20
2	2013-08-03	2013-08-04	123	singola	23	20
3	2014-10-21	2014-11-21	122	doppia	22	40

ottengo in output nel browser



Quindi, corel_86, abbiamo un problema (cit.).

Mi spieghi il motivo di questa istruzione nello script lato server?

$punti=explode(",", $dato);

[corel_86]

allora il file cvs deve essere così:

01,26-06-2013,04-07-2013,3452,singola,CNDT,60
02,27-06-2013,10-07-2013,6527,tripla,BGNG,120
03,26-06-2013,05-07-2013,7626,doppia,CFGT,100
04,25-06-2013,11-07-2013,5242,singola,BGNG,75
05,04-06-2013,21-07-2013,3442,singola,SNDT,60
06,27-06-2013,10-07-2013,6337,tripla,BGNG,67
07,01-07-2013,28-07-2013,7616,doppia,CCGT,102
08,27-06-2013,19-07-2013,5262,singola,CGNG,75

senza spazi e senza niente solo la virgola che separa(nel testo che ho postato ad inizio pagina lo dice).

Mi spieghi il motivo di questa istruzione nello script lato server?

$punti=explode(",", $dato);

questa istruzione prende la stringa ad esempio la prima 03,26-06-2013,05-07-2013,7626,doppia,CFGT,100 e crea un array di nome $punti composto:
$punti[0]=03
$punti[1]=26-06-2013
$punti[2]=05-07-2013
$punti[3]=7626
$punti[4]=doppia
$punti[5]=CFGT
$punti[6]=100

inoltre questa istruzione

 var x;
                     for(x in response.result){
                        document.write(response.result[x].prezzo + ",");
                     }

mi serviva per controllare se l'ordinamento è stato effettuato quindi si può cancellare

[Studente Anonimo]

"corel_86":allora il file cvs deve essere così:

01,26-06-2013,04-07-2013,3452,singola,CNDT,60

senza spazi e senza niente solo la virgola che separa(nel testo che ho postato ad inizio pagina lo dice[nota]Il neretto è mio[/nota]).

Davvero? Ero convinto che tu usassi la tabulazione come delimitatore.

"anonymous_be1147":Mi spieghi il motivo di questa istruzione nello script lato server?

$punti=explode(",", $dato);

questa istruzione [...]

Grazie, ma cosa fa la funzione explode() lo so. La mia domanda aveva un altro intento, ma ormai...

Ad ogni modo, con la virgola come delimitatore nel file CSV, lo script lato server funziona.
Personalmente ritengo che il blocco iniziale andava scritto/semplificato così:

$file = fopen("prenotazioni.csv","r") OR die("Impossibile aprire il file\n");
   while (($data = fgetcsv($file,100,',')) !== FALSE){
         $durata=datediff($data[2],$data[1]);
         $array1[]=array(   "id"=>$data[0],
                     "durata"=>$durata,
                     "camera"=>$data[3],
                     "tipo_camera"=>$data[4],
                     "id_cliente"=>$data[5],
                     "prezzo"=>$data[6]
                     );
   }

notare il delimitatore usato, laddove tu usi

'\t'

.

Riguardo allo script lato client, be', è abbastanza orribile come codice, però è più che decente per uno che non aveva mai usato JavaScript prima e, soprattutto, nonostante un classico errore da principiante funziona la parte richiesta.

Caro corel_86, ti faccio i miei complimenti!

Ciao, ciao.