Home

WML Case Study

Sat, 03/30/2002 - 05:00 — onaje

WML Case Study

Providing a WAP/WML website for the mobile phone crowd?

I have an interest in WML and try to maintain a WML/WAP version of the Onaje.com website. The site at
http://www.onaje.com/wap/ is maintained by two scripts interacting with the database.

Data is pulled from several tables in the database:

A table that hold the articles.
A table defining categories for the articles.
A lookup table that cross references articles and categories by id.

Index.wml:

The homepage displays the site logo, the date and a link to another page.

<?php
// send wml headers
header("Content-type: text/vnd.wap.wml");
echo "<?xml version=\"1.0\" ?>";
?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN"
"http://www.wapforum.org/DTD/wml_1.1.xml">
<wml>
<card id="index" title="main">
<p>
<img src="logosm.wbmp" alt=" "/>
</p>
<p>
<?php
// format and output date
$the_date = date("M d Y");
print $the_date;
print "<br/>Welcome to a PHP WAP-enabled site!";
?>
</p>

<p>
<a href="showarticles.php">View</a> abstracts of tutorials on this site.
</p>
</card>
</wml>

************************ Ouput WML ******************************************

<?xml version="1.0" ?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN"
"http://www.wapforum.org/DTD/wml_1.1.xml">
<wml>
<card id="index" title="main">
<p>
<img src="logosm.wbmp" alt=" "/>
</p>
<p>
Feb 03 2002<br/>Welcome to a PHP WAP-enabled site!
</p>
<p><a href="showarticles.php">View</a> abstracts of tutorials on this site.</p>
</card>
</wml>

********************************************************************************

Note: There are many programs available online that create WBMP image files from JPEGs or GIFs.

The showarticles.php script is the backbone of the site. It produces three cards: card one
displays a list of article categories and the number of articles in that category, card two
displays links to articles in a specific category (chosen from card one), and card three
displays the article abstract (chosen from card two).

Card 1: number of articles in each category

I want a list of the categories with a count of the number of articles for each category, the id of the category and the name of the category.

PHP Code

<?php
if($show ==''){
?>
<card id="card1" title="Article Categories">
<p><b>Categories: </b></p>

<?
$catlist = mysql_query("SQL to select all categories and find out the number of articles in that category");
while ($categories = mysql_fetch_array($catlist)) {
$cat = $categories["name"]; //name of the category
$num = $categories["cat_num"]; //number of articles in category
$cid = $categories["CID"]; //category id

print '<p>- <a href="'.$PHP_SELF.'?show='.$cid.'&cat='.$cat.'">'.$cat .'</a> ('.$num.')</p>';

}
?>
</card>
<?
}

************************ Output WML ******************************************

<?xml version="1.0" ?>
<!DOCTYPE wml PUBLIC "-//PHONE.COM//DTD WML 1.1//EN"
"http://www.phone.com/dtd/wml11.dtd" >
<wml>

<card id="card1" title="Article Categories">
<p><b>Categories: </b></p>

<p>- <a href="/wap/showarticles.php?show=3&cat=Files">Files</a> (7)</p>
<p>- <a href="/wap/showarticles.php?show=6&cat=Flash">Flash</a> (2)</p>
<p>- <a href="/wap/showarticles.php?show=4&cat=HTML">HTML</a> (7)</p>
<p>- <a href="/wap/showarticles.php?show=7&cat=JavaScript">JavaScript</a> (3)</p>
<p>- <a href="/wap/showarticles.php?show=2&cat=Mail">Mail</a> (1)</p>
<p>- <a href="/wap/showarticles.php?show=1&cat=MySQL">MySQL</a> (1)</p>
<p>- <a href="/wap/showarticles.php?show=5&cat=WAP/WML">WAP/WML</a> (3)</p>
<p>- <a href="/wap/showarticles.php?show=8&cat=XML">XML</a> (1)</p>
</card>
</wml>

********************************************************************************

Card 2: create links to the articles for the category.

Using the id of the category which was passed from Card 1, I get the id of the article, its title and the date it was published.

if($show !='' && $cat !=''){
?>
<card id="card2" title="Show Articles">

// Echo the name of the category passed in the $cat variable from Card 1

<p mode="wrap"><b>Showing articles for <? echo("$cat");?></b></p>

<?
$articlelist1 = mysql_query("SQL to select all ids, titles and dates for articles in category");

while ($Articletitles = mysql_fetch_array($articlelist1)) {
$id = $Articletitles["ID"];
$title = $Articletitles["Title"];
$date = $Articletitles["ArticleDate"];

// Display the Article with author information
echo("<p mode=\"wrap\"><a href=\"showarticles.php?show=$show&id=$id\">$title</a> ");
echo("(Published - $date)</p>" );
}
?>
</card>
<?
}

************************ Ouptput WML ******************************************

<?xml version="1.0" ?>
<!DOCTYPE wml PUBLIC "-//PHONE.COM//DTD WML 1.1//EN"
"http://www.phone.com/dtd/wml11.dtd" >
<wml>

<card id="card2" title="Show Articles">
<p mode="wrap"><b>Showing articles for Flash</b></p>

<p mode="wrap"><a href="showarticles.php?show=6&id=11">Flash - PHP Guestbook: part 1</a> (Published - 2001-04-13)</p>
<p mode="wrap"><a href="showarticles.php?show=6&id=12">Flash - PHP Guestbook: part 2</a> (Published - 2001-04-21)</p>

</card>

********************************************************************************

Card 3: show title, first few sentences and the date the article was published.

Using the id of the article passed from Card 2, I get the article title, first 200 or so words, and the date it was published.

// Show article brief for specific article in category

if($show !='' && $id !=''){
?>
<card id="card3" title="Article Brief">

<?
$articlelist2 = mysql_query("SQL to select id, text, title and date for the article
matching the article number");

while ($Article = mysql_fetch_array($articlelist2)) {

// Do some formating on the article text etc. before display

// Display the Article with author information
echo("<p mode=\"wrap\"><i>$title</i></p>");
echo("<p mode=\"wrap\">$str...<br/> (Published - $date)</p>" );
}
?>
</card>
<?
}
?>

************************ Ouptput WML ******************************************

<?xml version="1.0" ?>
<!DOCTYPE wml PUBLIC "-//PHONE.COM//DTD WML 1.1//EN"
"http://www.phone.com/dtd/wml11.dtd" >
<wml>

<card id="card3" title="Article Brief">

<p mode="wrap"><i>Flash - PHP Guestbook: part 1</i></p><p mode="wrap">Sending variables from Flash to PHP.

I decided to try my hand at creating a Flash SWF (Flash 5) that would interact with PHP.

I created a very simple contact form...<br/> (Published - 2001-04-13)</p></card>

</wml>

********************************************************************************

The WML version of the website can be viewed at http://onaje.com/wap/ with a WAP browser.

      Subscribe in a reader