Kuvagalleria ja ladattavien tiedostojen lista Drupaliin

Posted on July 7, 2009

0


Kuvagallerian tekemiseen Drupalissa on useita vaihtoehtoja, joista mikään ei toistaiseksi ole saavuttanut standardin asemaa. Kuvagalleria voidaan tehdä jonkin moduulin avulla (esimerkiksi Gallery, jCarousel tai Views), mutta perus-Drupalilla kuvien lähettäminen ja esittäminen on puutteellista. Tiedostojen, esimerkiksi PDF-esitteiden tai muiden dokumenttien lähettäminen onnistuu sisäänrakennetun File upload -moduulin avulla. Samalla moduulilla voi tietenkin lähettää palvelimelle mitä tahansa tiedostoja, mutta tiedostot listataan verkkosivuilla vain tiedoston nimen perusteella, eli kuvat eivät näy kuvina. Seuraavassa tehdään yksinkertainen PHP Snippet, jossa File uploads -moduulia käytetään kuvien ja muiden tiedostojen lähettämiseen ja esittämiseen. Tämän jälkeen mille tahansa sivulle lähetetyt kuvat näkyvät kyseisellä sivulla pikkukuvina, joista saa klikkaamalla suuremman version esille ja muut tiedostot listana, josta käyttäjä voi ladata ne omalle koneelle.

Tarvittavat ohjelmistot ja tehtävät:

  1. Drupal 6.x
  2. Moduulit Upload previews ja Thickbox
  3. Käyttöoikeuksien tarkastelu
  4. page.tpl.php -tiedoston muokkaaminen
  5. Koeajo!

Asenna Drupal 6 ja moduulit Upload previews ja Thickbox. Upload preview lisää esikatselukuvan nodejen muokkaussivulle, mikä on ihan kiva sinänsä, mutta varsinainen hyöty on siinä, että moduuli mahdollistaa tiedostokohtaisen selitteen antamisen. Tiedostoille voidaan siis antaa nimeksi jotain muuta kuin tiedostonnimi, esimerkiksi minun_tarkea_tiedosto_2.pdf saadaan näkymään verkkosivuilla nimellä Minun tärkeä tiedosto, osa 2. Thickbox on osittain silmänruokaa ja sen voi jättää poiskin. Thickboxista on kuitenkin myös se hyöty, että samaan ryhmään tallennetut kuvat ovat selattavissa keskenään helposti ja efekti perustuu Drupalissa oletuksena muutenkin ladattavaan jQuery-javascriptkirjastoon. Yhtä hyvin voi käyttää Lightboxia tai mitä greyboxia haluaakin.

Kun moduulit on asennettu, mene käyttöoikeussivulle (admin/user/permissions) ja anna sivuston ylläpitäjälle oikeudet tiedostojen lähettämiseen (Upload module -> upload files). Ota kaikilta rooleilta pois view uploaded files. Tämä ominaisuus luo sivun loppuun taulukon, jossa nodeen liitetyistä tiedostoista näkyy tiedoston nimi ja koko. Emme halua nähdä tätä taulukkoa vaan haluamme kauniin listan tiedostoista, joissa tiedoston nimen sijaan näemme tiedoston selitteen. Nodeen lähetetyt tiedostot näkyvät jokatapauksessa noden muokkaussivulla, mikä riittää sivun ylläpitoon aivan loistavasti.

PHP Snippet kuvien ja tiedostojen tulostamiseen

Seuraavaksi muokataan kaikkien sivujen muodostamiseen käytettävää sivupohjaa page.tpl.php, joka löytyy teemakansiosta, esimerkiksi sites/default/themes/omateema/page.tpl.php tai themes/garland/page.tpl.php. Jos kuvagallerian ja tiedostolistauksen haluaa vain tietylle sivutyypille, muokkaa tai luo tiedosto node-omasivutyyppi.tpl.php. Omia sivutyyppejä voi luoda CCKlla.

//print uploaded files as a gallery (images) or as a list with links (other files)

//initialize
$myimages = array(); #place for image files found
$mydownloads = array(); #place for other files found
$mypath = “”; #prefix to files directory
$myimageslist = array(“jpg”, “JPG”, “gif”, “png”); #which file suffixes count as image files

//read database
$myquery = “SELECT upload.description, files.filename FROM upload, files WHERE upload.nid='”.$node->nid.”‘ AND upload.fid = files.fid ORDER BY upload.weight ASC, upload.fid ASC”;
$myresult = db_query($myquery);

//take images and files apart
$i = 0;
if(!empty($myresult)) { while($myline = mysql_fetch_array($myresult, MYSQL_ASSOC)) {
if(in_array(substr($myline[‘filename’], -3, 3), $myimageslist)) {
$myimages[$i][‘desc’] = $myline[‘description’];
$myimages[$i][‘name’] = $myline[‘filename’];
} else {
$mydownloads[$i][‘desc’] = $myline[‘description’];
$mydownloads[$i][‘name’] = $myline[‘filename’];
}
$i++;
}}

//print images
if(!empty($myimages)) { foreach($myimages as $myim) {
?>
<a href=”/<?php echo $mypath; ?>sites/default/files/<?php echo $myim[‘name’]; ?>” rel=”group_us_together” title=”<?php echo htmlentities($myim[‘desc’]); ?>”><img height=”80″ src=”/<?php echo $mypath; ?>sites/default/files/<?php echo $myim[‘name’]; ?>” /></a>
<?php
}}

//print other files as links
if(!empty($mydownloads)) { echo “<ul class=\”downloads\”>”; foreach($mydownloads as $mydo) {
?>
<li><a href=”/<?php echo $mypath; ?>sites/default/files/<?php echo $mydo[‘name’]; ?>”><?php echo $mydo[‘desc’]; ?></a></li>
<?php
} echo “</ul>”; }

Tiedostot erotetaan kuviksi tai muiksi tiedostoiksi tiedostopäätteen perusteella. Tunnistuksen voisi tehdä myös MIME-tyypillä, mutta käytännössä tiedostopääte tuntuu toimivan vielä toistaiseksi varmemmin, koska joskus loppukäyttäjillä on käytössään vanhoja ja epästandardeja kameroita tai ohjelmistoja, jotka eivät tallenna metadataa oikein.

Kuvat esitetään noden lopussa 80×80 kokoisina pikkukuvina, joita klikkaamalla kuva aukeaa suurempana. Ison kuvan mittoja voi rajoittaa Site configuration -> uploads -asetuksista. Jos Thickbox on käytössä, kuva aukeaa sivun päälle ja kuvan alla on linkki seuraavaan ja edelliseen kuvaan.

Muut kuin kuvatiedostot näytetään listana (ul/li-elementit). Listassa tiedoston selite näkyy linkkinä itse tiedostoon.

Advertisements
Posted in: Drupal