Back

“Trends” Web site for Risø
Summary of realisation
Alexandre Alapetite personal page 11/2003 - 01/2004

The described Web site was active on http://trends.risoe.dk/ from 2003 to 2006 and closed in January 2010.
An archive is available.

Technical choices

Client side

This Web site has been done respecting current W3C rules:

• Documents in XHTML1.1
• Graphic style with CSS2, that allows optimized display for normal screens, printers, handhelds, etc.
• Preliminary check of forms with ECMAScript (standard JavaScript).
• A RDF file with RSS1.0 vocabulary to allow users and administrators to be informed of the modifications.

Thanks to CSS, the site display is adapted to the different medias. For example, when printing a page, the menu is not displayed anymore, and the font is adapted to the paper.
Example:

trends-normal.css

body {font-family:"Arial","Helvetica",sans-serif}
/*Print*/
@page {size:portrait}
@page {margin:1.1cm}
@media print {
 body {font-family:"Times New Roman","Times",serif}
 #menu,#logo {display:none}
}
/*Handheld*/
@media handheld {
 #logo {float:none}
}

Classic screen preview

Printer preview

Handheld preview

Example of form checking:

add-country.js

function verifcountry()
{
 var err='';
 if (!(/^[A-Za-z _-]{4,128}$/.test(document.getElementsByName('ctrname')[0].value)))
 {
  err='Please enter a valid country name';
  document.getElementsByName('ctrname')[0].focus();
 }
 if (err.length>0)
 {
  alert(err);
  return false;
 }
 else if (!confirm('The country will now be stored. Are you sure?')) return false;
 else return true;
}

Server side

• Dynamic pages with PHP4.

  • A Open Source library for the transition from PHP4 domxml to PHP5 dom has been written for this project, before becoming quite popular, in particular in the Open Source community.
• Output in an XML tree, that insures the validity of the result and allows the modification of any part of the document at any moment.
• Access database with ODBC connexion.

Example:

detail-country.php

if ($dom=domxml_open_file('model.html')) //Loading model
{
 $corpus=$dom->get_element_by_id('corpus');
 if ($odbc=odbc_connect('trends','trends-admin','temppass'))
 {
  $sql='SELECT ct.name AS ct_name FROM countries ct WHERE ct.id='.$country;
  if (($query=odbc_exec($odbc,$sql))&&odbc_fetch_row($query)) //SQL request
  {
   $h2=$dom->create_element('h2');
   $h2->append_child($dom->create_text_node('Country : '.odbc_result($query,'ct_name')));
   odbc_free_result($query);
   $corpus->append_child($h2);
   $corpus->append_child($dom->create_text_node("\n"));
   //...
  }
  odbc_close($odbc);
 }
 $dom->dump_mem(); //Send results to the client’s browser
}

Back