// DisplayDB.js
//
// Questo file contiene le funzioni che si occupano di visualizzare
// la  tabella che ottieniamo  come risultato di una interrogazione
// sulla base  di dati.  Va richiamata  all'interno del  file  HTML
// passandogli l'array che contiene, codificata, la tabella.
//
// L'unica  funziona  che  eventualmente  va  modificata e' proprio
// quella che ha cablato in se il layout della tabella (DisplayDB),
// che  in questo esempio e' semplicemente  un elenco preformattato
// del contenuto del database. 
//
///////////////////////////////////////////////////////////////////

// Per la formattazione dei vari campi si usano queste funzioni qui
// definite
function resize(Stringa, MaxLunghezza, Blanks) {
  var resizedString = "";

  if (Stringa.length>MaxLunghezza)
    resizedString = Stringa.substring(0, MaxLunghezza-Blanks)+makeSpaces(Blanks);
  else
    resizedString = Stringa + makeSpaces(MaxLunghezza-Stringa.length);

  return resizedString;
}

function makeSpaces(numeroSpazi) {
  var spaceString = "";

  for(var i=0; i<numeroSpazi; i++)
    spaceString += " ";

  return spaceString;
}

function DisplayDB(dbMatrix,TipoSelezione) {

  // Dichiarazione della lunghezza dei campi (per la formattazione)
  // E' stato previsto che se il valore del campo supera quello qui
  // di seguito definito, viene troncato per rientrare nei limiti.
  
  // Ricordiamo che i campi sono legati agli indici della tabella nel
  // modo seguente:
  //
  // CODICE: 0 - AUTORE: 1 - SOGGETTO: 2 - TIPO = 3 - LUOGO = 4 - COLLOCAZIONE = 5 - DESCRIZIONE = 6 - ESTENSIONE = 7
  //

  CODICE = 0;
  AUTORE = 1;
  SOGGETTO = 2;
  TIPO = 3;
  LUOGO = 4;
  COLLOCAZIONE = 5;
  DESCRIZIONE = 6;
  ESTENSIONE = 7;


  MaxLen = new Array();
  MaxLen[CODICE] = 5;
  MaxLen[AUTORE] = 25;
  MaxLen[SOGGETTO] = 25;
  MaxLen[TIPO] = 12;
  MaxLen[LUOGO] = 25;
  MaxLen[COLLOCAZIONE] = 25;
  MaxLen[DESCRIZIONE] = 35;
  MaxLen[ESTENSIONE] = 4;

  // Spazi vuoti tra una colonna e l'altra
  blankSpace = 2;

  //Stampa dei titoli
  document.writeln("<h3>Iconografia agostiniana: "+TipoSelezione+"</h3>");

  // Inizializzazione dei vari campi da stampare
  for (i=0; i<dbMatrix.length; i++) {
    cod = dbMatrix[i][CODICE];
    aut = dbMatrix[i][AUTORE];
    sog = dbMatrix[i][SOGGETTO];
    tip = dbMatrix[i][TIPO];
    luo = dbMatrix[i][LUOGO];
    col = dbMatrix[i][COLLOCAZIONE];
    des = dbMatrix[i][DESCRIZIONE];
    est = dbMatrix[i][ESTENSIONE];

    // Se il valore supera la lunghezza consentita, viene troncato
//    cod = resize(cod, MaxLen[CODICE], blankSpace);
//    aut = resize(aut, MaxLen[AUTORE], blankSpace);
//    sog = resize(sog, MaxLen[SOGGETTO], blankSpace);
//    tip = resize(tip, MaxLen[TIPO], blankSpace);
//    luo = resize(luo, MaxLen[LUOGO], blankSpace);
//    col = resize(COl, MaxLen[COLLOCAZIONE], blankSpace);
//    des = resize(des, MaxLen[DESCRIZIONE], blankSpace);
//    est = resize(for, MaxLen[ESTENSIONEO], blankSpace);

    document.writeln("<table border='0' width='100%'>");
    document.writeln("<tr><td width='100%' colspan='2'><hr></td></tr>");
    document.writeln("<tr><td width='20%'><center>");
    document.writeln("<A HREF='immagini/augustinus_"+cod+"."+est+"'>"+"<img border='0' src='immagini/augustinus_"+cod+"_m."+est+"' alt='Fare clic per ingrandire.'>"+"</A></center></td>");
    document.writeln("<td width='80%'>");
    document.write("<P><B>N.: </B>"+cod+"<BR>");
    document.write("<B>AUTORE: </B>"+aut+"<BR>");
    document.write("<B>SOGGETTO: </B>"+sog+"<BR>");
    document.write("<B>TIPO: </B>"+tip+"<BR>");
    document.write("<B>LUOGO: </B>"+luo+"<BR>");
    document.write("<B>COLLOCAZIONE: </B>"+col+"<BR>");
    document.write("<B>DESCRIZIONE: </B>"+des+"</P></td></tr>");
    document.write("</table>");

  }  // Fine del for
  document.writeln("<tr><td width='100%' colspan='2'><hr></td></tr>");

}

// Una variante consiste nell'inserire dei tag HTML per dare un
// aspetto piu' efficace alla lista visualizzata. Ad esempio si
// puo' pensare di usare una tabella (tag <TABLE>) oppure di inserire
// dei link, in modo tale che cliccando sulla descrizione, viene
// richiamato un file che mostra una foto del prodotto, corredata
// della descrizione e di altre caratteristiche, estraibili 
// ancora una volta dalla base di dati. Supponiamo per chiarire le
// idee che in una directory images siano contenute le foto degli
// articoli disponibili, nominati in base al codice: TAV01561R.jpg
// sara' quindi l'immagine dell'articolo con quel codice. Allora
// la tabella puo' prevedere un link a tali foto:
//
// document.write(cod);
// document.write("<A HREF=images/'"+cod+".jpg'>"+des+"</A>");
// document.write(val);
// document.writeln(mag);
//
// Ovviamente questa non e' che una delle infinite possibilita'
// messe a disposizione dalla possibilita' di poter gestire a
// piacimento i dati contenuti nel database. Esistono, per esempio,
// implementazioni JavaScript di piccoli carrelli elettronici,
// venuti alla ribalta con l'esplosione del commercio elettronico,
// che non hanno nulla da invidiare ai "fratelli maggiori" realizzati
// tramite applicazioni server-side. La loro combinazione con
// l'esempio descritto in questa sede puo' essere sfruttata per
// realizzare un piccolo sito web di commercio elettronico interattivo
// pur non avendo a disposizione da parte del provider ospitante
// alcun meccanismo server-side (asp, cgi-bin, servlet...).