Пособие по написанию WAP сайтов

ГЛАВА 7

Подробнее о приложении StockQuote.wml
Подробнее о сценарии языка Perl StockQuoteWML.pl
Подробнее о приложении StockQuote.hdml
Подробнее о сценарии языка Perl StockQuoteHDML.pl

С каждым днем все больше и больше инвесторов пользуются преимуществамиторговли в режиме «онлайн». В близком будущем многие из них будут использовать свои сотовые телефоны и другие карманные устройства для того, чтобыпроизводить звонки из автомобилей, поездов, ресторанов и бесчисленного множества других мест. Приложение StockQuotes (КотировкиАкций) сочетает в себефайлы формата WML и сценарий языка Perl, позволяя пользователям получатьинформацию об акциях, например, самый высокий и самый низкий курсы, суммарный объем торговли за этот день. Когда пользователь запускает приложение,на экране сотового телефона отображается приглашение на ввод символа акции,как показано на Рис. 7.1. После ввода символа, например, МОК для компанииNokia, приложение StockQuote отобразит текущую котировку акций, как показанона Рис. 7.2. Если пользователь введет звездочку (*) на запрос ввода символа, приложение отобразит список известных ему символов, как показано на Рис. 7.3. Используя клавиши «вверх» и «вниз» на телефоне, пользователь может выбрать желаемые акции.

Если вы еще не установили пакет инструментальных средствдля разработки программного обеспечения (SDK) для WAP, например, с сайта www.openwave.com, можно протестироватьприложение StockQuote, используя сотовый телефон, поддерживающий протокол WAP. Для этого с помощью телефона необходимо набрать адрес waplib.com/StockQuote/StockQuote.hdml,если браузер телефона поддерживает язык HDML. Если браузерподдерживает язык WML, то надо ввести адресwaplib.com/StockQuote/StockQuote.wml.

Подробнее о приложении StockQuote.hdml

Подробнее о приложении StockQuote.hdml

Как и приложение формата WML, файл StockQuote.hdml предлагает пользователюввести символ акции. Далее приложение загружает сценарий языка Perl, которыйопределяет, какой символ был введен, и затем отображает информацию о выбранной акции. Файл StockQuote.hdml имеет следующий исходный код:

<HDML Version=3.0 Markable=True TTL=0>
<Entry Name=Stock Format=*X Key=Symbol Default="">
<Action Type=Accept Task=GO Method=Post PostData=$(Symbol) Dest="../waplibcgi/StockQuoteHDML.pl">
<Center>Stock Quotes Symbol: (* for all)
</Entry>
</HDML>

Первый элемент внутри деки сообщает браузеру (или другим программистам),какая версия языка HDML используется приложением. Далее, выражение Markable=True сообщает браузеру, что он может установить закладку в исходной деке,a TTL=0 свидетельствует о невозможности кэширования.

Как и дека формата WML, дека формата HDML использует переменную с именемSymbol для отслеживания имени введенного пользователем символа. Для вводаимени символа, приложение использует элемент <Entry>:
<Entry Name=Stock Format=*X Key=Symbol Default="">

Формат *х позволяет пользователю ввести любое число символов, чисел и буквверхнего регистра.

После ввода пользователем имени символа или звездочки (*), приложение использует элемент <Accept> для загрузки сценария языка Perl StockQuoteHDML.pl,передавая ему значение переменной Symbol.

Подробнее о приложении StockQuote.wml

Подробнее о приложении StockQuote.wml

Когда пользователь запускает приложение StockQuote, дека StockQuote.wml запрашивает у пользователя ввода символа акции. Далее, основываясь на выборепользователя, подключается сценарий языка Perl, находящийся в файлеStockQuoteWML.pl. После этого сценарий определяет символ, введенный пользователем, и отображает деку формата WML, соответствующую выбранной акции.Дека StockQuote.wml имеет следующий исходный код:
<?xml version="1.0"?> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" "http://www.wapforum.org/DTD/wml_1.1.xml">
<wml>
<head>
<meta http-equiv="Cache-Control" content="max-age=0" forua="true"/>
</head>
<card id="Quote" title="Stock Quotes">
<onevent type="onenterforward">
<refresh> <setvar name="Symbol" value="" /> </refresh>
</onevent>
<onevent type="onenterbackward">
<refresh> <setvar name="Symbol" value="" /> </refresh>
</onevent>
<do type="accept"> <go href="../waplibcgi/StockQuoteWML.pl?$(Symbol)" /> </do>

Stock Quotes 


Symbol: (* for all) 
<input name="Symbol" maxlength="5" title="Symbol" type="text" format="*X" />

</card>
</wml>

Так же как и во всех деках формата WML, первые два ее элемента сообщают браузеру, какую из версий спецификации WAP поддерживает данное приложение. Внашем случае WML-страница поддерживает версию 1.0 языка XML и версию 1.1описания типа документа (DTD), разработанного ассоциацией WAP Forum.
<?xml version="1.0"?> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" "http://www.wapforum.org/DTD/wml_1.1.xml">

Далее, за информацией о версиях, каждый WML-файл начинается с тега <wml>. Вконце каждого файла вводят </wml>, что означает окончание исходного кодаприложения. За <wml> следуют теги <head> и </head>, внутри которых находитсяинформация о самом исходном коде, включая метаданные и информацию обуправлении доступом. Многие программисты называют метаданные «данными оданных». Другими словами, в этом случае метаданные, которые считывает и обрабатывает браузер, сообщают ему, как трактовать данные.
<head>
<meta http-equiv="Cache-Control" content="max-age=0" forua="true"/>
</head>

Элемент <meta> позволяет точно определить метаинформацию для исходногофайла. В нашем случае строка http-eguiv="Cache-Control" сообщает браузеруWAP, что эта часть метаинформации используется системой кэширования памяти. Аналогично, строка content=max-age=0 сообщает браузеру, что максимальноевремя, в течение которого будет кэшироваться этот файл, равно нулю секунд;значит, браузер не будет кэшировать данные, а загружать данные с сервера каждый раз, когда они будут запрошены. Для этой книги значение нуля было выбрано для содействия процессу обучения читателя. При выборе нуля каждый раз,когда будут происходить изменения, они будут передаваться на телефон. В реальном приложении статическое меню, подобное этому, можно использовать поумолчанию в течение 30 дней. Последняя строка forua="true" определяет, чтозначение Cache-Control предназначено для телефона и не может быть измененокаким-либо промежуточным агентом. <ой \

Далее, за первыми элементами в деке определяется единственная карта, котораяв нашем случае называется Quote. Как вкратце отмечалось выше, основная задачадеки StockQuote.wml - это приглашение пользователю на ввод символа акции, азатем вызов сценария языка Perl для отображения информации о выбранной акции.

Для отслеживания имени символа приложение использует переменную Symbol.Обратите внимание на два элемента в исходном коде недалеко от начала деки. Выувидите два элемента <OnEvent>, которые очищают значение переменной Symbol(символ акции), перед тем как пользователь введет новый символ акции.

Элементы обработки событий <OnEvent> удаляют любое существующее значениепеременной Symbol. Обработка этих событий выполняется перед тем, как пользователем будет введена какая-либо информация. Пакет для разработки про

граммного обеспечения (SDK) запоминает значения переменных при каждомпоследующем запуске программы. В первом элементе <OnEvent> с использованием выражения type="OnEnterForward" удаляется значение переменной, когдапрограмма запускается. Второе выражение type="oneenterbackward" свидетельствует об удалении значения переменной, если пользователь нажал кнопку Back(Назад). Элемент <refresh> обновляет переменные и вид экрана, если какая-либо из переменных отображается в данный момент.

Для передачи введенной пользователем информации в переменную, приложениеиспользует элемент <input>:
<input name="Symbol" maxlength="5" title="Symbol" type="text" format="*X" />

Элемент <input> определяет имя переменной, заголовок, который браузер будетотображать на дисплее телефона для этой переменной, максимальное число символов в переменной (в нашем случае 5), тип данных переменной (text) и форматпеременной. Формат *х позволяет переменной иметь длину не более maxlenthсимволов, цифр или букв верхнего регистра. \

Далее, если вы обратите внимание на экран приложения, показанный на Рис. 7.1,приложение выводит заголовок StockQuotes и приглашение для ввода символа.Здесь можно ввести звездочку (*) в ответ на приглашение (* for all - * для всех). Вэтом случае приложение отобразит меню символов всех акций из своей базыданных. Для отображения этих текстовых сообщений приложение используеттег абзаца <р> с соответствующим выравниванием и тег для перехода наследующую строку. После того как желаемый символ акции будет введен пользователем, приложение подключает сценарий языка Perl StockQuoteWML.pl, описанный ниже.

Подробнее о сценарии языка Perl StockQuoteHDML.pl

Подробнее о сценарии языка Perl StockQuoteHDML.pl

Итак, когда пользователь вводит имя символа акции в файле StockQuote.hdml,приложение передаст данные сценарию StockQuoteHDML.pl, который, используяпоследовательность конструкций if-else, определяет выбранную пользователемакцию. Очевидно, что содержимое сценария StockQuoteHDML.pl в целом аналоично содержимому файла StockQuoteWML.pl за исключением того, что первыйиспользует в своей работе деки формата HDML.

Аналогично, когда пользователь на запрос имени символа вводит МОК, сценарийязыка Perl загружает файл NOK.hdml, исходный код которого приведен ниже:
<HDML Version=3.0 TTL=0>
<Display>
<ACTION Type=Accept Task=Prev Vars=Symbol=>
<Center>Stock Quotes 
<Line>NOK<TAB>Nokia Corp <Line>Last:<TAB>141 3/4 <Line>Change:<TAB>+1 3/4 <Line>Volume:<TAB>4.074 mil <Line>Open:<TAB>138 <Line>High:<TAB>143 <Line>Low:<TAB>138 <Line>52 High:<TAB>151.62 <Line>52 Low:<TAB>47.81
</Display>
</HDML>

Для отображения информации о выбранной акции дека формата HDML простоиспользует элемент <Line>. Для изменения информации о котировке акций необходимо внести изменения в содержимое соответствующих дек. В идеале вашеприложение должно обращаться к базе данных на сервере для считывания необходимой информации о котировках акций в режиме реального времени.

Если пользователем введено неправильное имя символа, сценарий языка Perl загружает деку BadSYM.hdml, которая имеет следующий исходный код:
<HDML Version=3.0 TTL=0>
<Display>
<ACTION Type=Accept Task=GO Dest=../StockQuote/StockQuote.hdml Vars=Symbol=>
<Center>Stock Quotes 
 Unknown stock symbol. Try again. For this demo the only valid symbols are: AIRO NOK PCS PHCM
</Display>
</HDML>

В этой деке элемент <Display> используется для отображения сообщения обошибке и вывода возможных значений имен символов. Вдобавок к этому, исходный код использует <Action> для удаления неправильно введенного имени символа и возврата к деке StockQuote.hdml, если пользователь нажмет кнопку подтверждения выбора (ОК).

В заключение, если пользователь введет звездочку (*) для просмотра списка всехвозможных имен символов, сценарий языка Perl загрузит деку ShowAll.hdml, исходный код которой приведен ниже:
<HDML Version=3.0 TTL=0>
<Choice>
Known Symbols 
<CE Task=GO Dest=../StockQuote/AIRO.hdml Label=AIRO>AIRO <CE Task=GO Dest=../StockQuote/NOK.hdml Label=NOK>NOK <CE Task=GO Dest=../StockQuote/PCS.hdml Label=PCS>PCS <CE Task=GO Dest=../StockQuote/PHCM.hdml Label=PHCM>PHCM
</Choice>
</HDML>

Используя элемент <Choice>, дека сперва отобразит список возможных для выбора символов, которые представлены в ней с помощью элементов <СЕ>. Далее<Choice> определяет, какой из символов введен пользователем, Если, к примеру,пользователь выберет символ NOK, автоматически загрузится дека NOK.hdml.

Подробнее о сценарии языка Perl StockQuoteWML.pl

Подробнее о сценарии языка Perl StockQuoteWML.pl

Как было сказано выше, каждый раз, когда пользователь вводит символ акции,приложение вызывает сценарий языка Perl, который и отображает информациюо выбранной акции. На самом деле для отображения информации о конкретнойакции сценарий загружает другой файл, относящийся непосредственно к выбранной акции. Например, для отображения информации об акциях Nokia (символ NOK), сценарий загружает файл NOK.wml. Сценарий StockQouteWML.pl имеетследующий исходный код:
#!/usr/bin/perl
print "Content-type: text/vnd.wap.wml\n\n";
$Buffer = $ENV{'QUERY_STRING'};
if ($Buffer eq "AIRO") { $FileName = "../StockQuote/AIRO.wml"; } elsif ($Buffer eq "PHCM") { $FileName = "../StockQuote/PHCM.wml"; } elsif ($Buffer eq "PCS") { $FileName = "../StockQuote/PCS.wml"; } elsif ($Buffer eq "NOK") { $FileName = "../StockQuote/NOK.wml"; } elsif ($Buffer eq "*") { $FileName = "../StockQuote/ShowAll.wml"; } else { $FileName = "../StockQuote/BadSYM.wml"; }
open (StockInfo, $FileName);
while (<StockInfo>) { print; }
close (StockInfo);

В нашем случае сценарий распознает только несколько символов. В реальномприложении вы не сможете разместить информацию о каждой из акций в отдельной карте формата WML. Вы будете должны размещать информацию в базеданных. После этого сценарий должен извлечь нужную информацию из базыданных и создать карту с интересующими вас сведениями в режиме реальноговремени.

Первая строка сценария представляет собой комментарий, сообщающий интерпретатору командной строки, где находится интерпретатор языка Perl. Во второйстроке сценарий помещает информацию для браузера (который перехватываетвывод сценария), какой тип данных будет отображаться. В третьей строке сценарий выделяет параметр, который ему передает исходная дека. В нашем случаеэто имя символа:
$Buffer = $ENV{'QUERY_STRING'};

Далее, сценарий использует последовательность конструкций if-else для определения имени символа. Например, если пользователь выбрал символ NOK, сценарий будет использовать деку из файла NOK.wml, которая будет выглядеть следующим образом:
<?xml version="1.0"?> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" "http://www.wapforum.org/DTD/wml_1.1.xml">
<wml>
<head>
<meta http-equiv="Cache-Control" content="max-age=0" forua="true"/>
</head>
<card id="Quote">
<do type="accept" label="Back"> <prev /> </do>

Stock Quotes 


<table align="left" columns="2">
<tr> <td>NOK</td> <td>Nokia Corp</td> </tr>
<tr> <td>Last:</td> <td>141 3/4</td> </tr>
<tr> <td>Change:</td> <td>+1 3/4</td> </tr>
<tr> <td>Volume:</td> <td>4.074 mil</td> </tr>
<tr> <td>Open:</td> <td>138</td> </tr>
<tr> <td>High:</td> <td>143</td> </tr>
<tr> <td>Low:</td> <td>138</td> </tr>
<tr> <td>52 High:</td> <td>151.62</td> </tr>
<tr> <td>52 Low:</td> <td>47.81</td> </tr>
</table>

</card>
</wml>

Как видите, в деке жестко указана информация об акциях. Это значит, что дляизменения информации о них, вам (или другому программисту) необходимо внести изменения непосредственно в файл. В идеале приложение должно получатьэти значения из базы данных, содержащей реальную информацию об акциях наданный промежуток времени и затем использовать эту информацию для создания новых дек в процессе работы.

Для облегчения восприятия выходной информации она организуется в таблицу.Как было сказано выше, если пользователь вводит звездочку в ответ на запрос овводе символа акции, приложение отобразит список всех доступных символов,как показано на Рис. 7.3. Чтобы обработать введенную звездочку, сценарий языкаPerl вызывает деку из файла ShowAll.wml, исходный код которой приведен ниже:
<?xml version="1.0"?> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" "http://www.wapforum.org/DTD/wml_1.1.xml">
<wml>
<head>
<meta http-equiv="Cache-Control" content="max-age=0" forua="true"/>
</head>
<card>
<do type="accept"> <go href="../StockQuote/StockQuote.wml"/> </do>

Known Symbols 
<a href="../StockQuote/AIRO.wml" title="AIRO">AIRO</a> <a href="../StockQuote/NOK.wml" title="NOK">NOK</a> <a href="../StockQuote/PCS.wml" title="PCS">PCS</a> <a href="../StockQuote/PHCM.wml" title="PHCM">PHCM</a>

</card>
</wml>

В деке используется тег <а> для отображения имен символов и определения, какую деку загружать после того как пользователь ввел выбранный символ.

Так как пользователь имеет возможность самостоятельного ввода имени символаакции, возможны ошибки при наборе имени или набор имени, несуществующегов базе данных приложения. Когда сценарий не может определить введеное имя(внутри последовательности конструкций if-else), он загружает деку из файлаBadSYM.wml, которая имеет следующий исходный код:
<?xml version="1.0"?> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" "http://www.wapforum.org/DTD/wml_1.1.xml">
<wml>
<head>
<meta http-equiv="Cache-Control" content="max-age=0" forua="true"/>
</head>
<card>
<do type="accept"> <go href="../StockQuote/StockQuote.wml"/> </do>

Stock Quotes 


Unknown stock symbol. Try again. For this demo the only valid sybmols are: AIRO NOK PCS PHCM

</card>
</wml>

Как вы видите, файл BadSYM.wml отображает сообщение для пользователя о том,что введенный символ неверен. Далее отображается список доступных имен символов.

Приглашение к вводусимвола акции

Рис.. 7.1. Приглашение к вводусимвола акции

Отображение текущейкотировки акций

Рис.. 7.2. Отображение текущейкотировки акций

Отображение списка доступных символов акций

Рис.. 7.3. Отображение списка доступных символов акций