Раздел "сделай сам" порой не менее интересен, чем страницы с рассказами о достижениях компьютерных технологий, и это понятно, так как небольшая, но все же практика, стоит порой большой, но далекой и слишком абстрактной теории. Надеюсь, что полезным будет и мой рассказ о том, как самому создать небольшую программку-генератор веб-сайтов. Программа специально написана аскетично, чтобы различные дополнения, облегчающие работу пользователя, не затеняли основные програм-мные конструкции. Программный код я старался сделать компактным (а можно было сделать его и еще более компактным), но в то же время понятным людям, которые имеют хотя бы общие представления о программировании.
Постановка задачи: требуется составить программу, создающую веб-сайт с заданным числом страниц. На каждой странице размещен один рисунок или фотография (графический файл с расширением jpg). Под рисунком расположены элементы навигации для перехода с одной страницы на другую.
Итак, необходимо составить программу, генерирующую набор взаимосвязанных между собой страниц (веб-сайт), облегчающих просмотр графических фалов. Поскольку мы не разрабатываем полнофункциональный коммерческий продукт, а пишем учебную программу, задачу упростим, определив, что все графические файлы поименованы по порядку, от первого до последнего (1.jpg, 2.jpg, 3.jpg...), причем все находятся в одной папке.
О языках программирования
Я остановил свой выбор на объектно-ориентированном языке Паскаль, а именно -
на среде визуальной разработки delphi. Иногда delphi называют языком программирования,
но многие программисты считают такое название некорректным, так как Паскаль
он и есть Паскаль, плюс среда разработки, позволяющая создавать удобный интерфейс
для пользователей, работающих под ОС windows. Приведу и возражение оппонентов:
Паскаль отличается от "классической" версии (например, вместо типа
text используется textfile, а "классический" assign заменен на assignfile,
хотя assign тоже есть, но используется в другом качестве, и т. д.). Особого
смысла в дискуссиях на эту тему я не вижу. Гораздо важнее отметить, что написанная
программа будет работать во всех версиях delhpi, начиная с 5.0. Скорее всего,
проблем не будет и в более ранних версиях, но из-за их отсутствия проверить
работо-способность программы на практике мне не удалось.
Почему не был выбран язык С или С++? На мой взгляд, он чуть более сложен для
изучения, а писать программу на языке бейсик вроде как не солидно, хотя объектно-ориентрованный
язык visial basic - мощный, удобный и современный программный инструмент, но
имеет мало общего с историческими предками (вспомним, например, turbo basic
ver. 1.0).
Составляем алгоритм
Программу нельзя составить, не продумав алгоритм ее работы. От не слишком прилежных
студентов мне порой приходится слышать высказывания типа: "Я пишу программу
прямо из головы, без алгоритма, рисовать ромбики и прямоугольники мне не надо!".
Напомню, что алгоритм - это последовательность действий, а графическое изображение
этой последовательности называется блок-схемой. Очевидно, что нельзя создать
программу, если мы не знаем, что и как она будет делать. А вот изложить алгоритм
решения задачи с помощью словесного описания, особенно для простых задач, можно
и нужно, что я сейчас и сделаю.
Итак, наша программа должна запросить у пользователя число картинок, которое будет равно числу стандартных страниц сайта. Каждая такая страница будет представлять собой файл с одним и тем же html-кодом. Программа должна: проставить в заголовке веб-страницы ее номер; задать имя для картинки, размещаемой по центру страницы; сформировать элементы управления для перехода к предыдущей и последующей странице, а также гиперссылку для перехода на главную страницу сайта. Как правило, главная страница веб-сайта называется index.htm, хотя возможны варианты, например, index.html, root.htm и т. д. Очевидно, что узнав число страниц n, мы должны будем в цикле создать n файлов с именами 1.htm, 2.htm и т. д. Текст в этих файлах будет идентичным, за исключением номера страницы в заголовке, имени картинки и ссылок для переходов. Например, на странице 5 (файл 5.htm) отображается содержимое графического файла 5.jpg и даны линки перехода на страницы 4.htm и 6.htm, на странице 6 (файл 6.htm) картинка 6.jpg и ссылка на страницы 5.htm и 7.htm. Кроме n однотипных файлов нам понадобится создать еще один главный (оглавление с гиперссылками на все стандартные страницы).
Несколько слов об html-конструкциях
Не ставлю перед собой задачу рассказать обо всех элементах html, это удел толстых
справочников, но без краткой информации о самых необходимых тегах не обойтись.
Стандартная страница (например, 5.htm), генерируемая нашей программой, будет
иметь вид:
<html> <head> <title> Страница n 5</title> </head> <body>
<center> <br> <img src="5.jpg"> <br>
<a href="4.htm">Назад</a>
<a href="index.htm"> Оглавление</a>
<a href="6.htm">Вперед</a>
</center></body></html>
Подчеркиванием отмечены те элементы, где будут вноситься изменения при генерации
других страниц.
Парные теги <html> и </html> отмечают начало и конец страницы, <head>
и </head> - область головы, а <body> и </body> - тело страницы.
Показываемый в браузере заголовок страницы записывают между тегами <title>
и </title>. Когда требуется размещение текста по центру страницы, текст
записывают между тегами <center> и </center>. Непарный тег <br>
- начало новой строки. Для вставки в тело страницы картинки используют конструкцию
вида <img scr="имя графического файла">, а для формирования
ссылки -
<a href="имя файла, к которому будем переходить">текст-комментарий для пользователя</a>.
Замечу, что, стремясь к компактности будущей программы, опустил несколько важных тегов. Более корректно было бы формировать страницу, например, так:
<!doctype html public "-//w3c//dtd html 4.0 transitional//en">
<html>
<head> <meta http-equiv= "content-type" content="text/html; charset=windows-1251">
<title>Личный сайт Игоря </title>
</head>
<body text= "#000000" bgcolor= "#cccccc" link= "#660000"
vlink="#660000" alink= "#660000">
....Текст с тегами форматирования....
</body>
</html>
Первая строка содержит информацию о том, какая версия html-кода используется,
затем указано, что используется русскоязычная кодировка и какая именно из трех
возможных (windows-1251). Не помешает и информация о том, каким цветом выделять
просмотренные и не просмотренные ссылки, какие шрифты использовать и так далее.
Однако с точки зрения программиста в добавлении этих конструкций нет ничего
интересного - просто вывод еще одной сроки или нескольких не изменяемых строк
в файл.
Пишем программу
Разработку программы начнем с элементов графического интерфейса. Запускаем среду
визуальной разработки delphi и выбираем пункт меню Создать новое приложение.
Используя палитру компонентов, помещаем на поверхность пустой формы необходимые
элементы - label1, label2, edit1, edit2, button1.
Компоненты label1, label2 используем для создания пояснительных надписей (в инспекторе объектов заполняем поле caption). На этапе разработки кода нажатие на кнопку (компонент button1) приводит к открытию окна редактора для ввода программного кода, причем оболочка сама генерирует заголовок процедуры, а также операторы начала и конца процедуры:
procedure tform1.button1click (sender: tobject);
begin
end;
Компоненты edit1, edit2 позволяют вводить данные в виде строки текста. Вводимая
строка заносится в поле компонента Техт. В поле компонента edit2 будем заносить
информацию о названии сайта, например, "Фотографии с праздника встречи
школьных друзей". В поле Техт компонента edit1 вносим информацию о числе
страниц сайта. Обратите внимание, если мы пишем, например, 10, то это не число
десять, а строка, первый символ которой 1, а второй 0. Для преобразования строки
в целое число необходимо воспользоваться специальной функцией strtoint(), а
для превращения целого числа в строковую переменную - функцией inttostr(). В
языке Паскаль каждая переменная должна быть описана, то есть указан ее тип.
В данной программе будем использовать переменные трех типов: word, string, textfile.
Слово word показывает, что описываемая переменная будет использована для хранения целых беззнаковых чисел (диапазон от 0 до 65535 - надеюсь, что число страниц создаваемого сайта будет гораздо меньше). Тип string описывает строковую переменную. Число после string в квадратных скобках определяет длину строки, а если число и скобки опущены, то для хранения данных пользователя выделяется максимальный размер 255 байт. Тип textfile используется для описания переменной, объявляемой как файловая. Работу с файлом проиллюстрирую следующим кратким примером:
var
f:textfile;
begin
assignfile(f,'x.dat'); //Открываем файл x.dat
rewritet(f); //В этот файл будем записывать текст - поток f открыли для записи.
writeln(f,' hello!'); //Пишем слово в файл; обратите внимание, что используем f, а не имя файла!
//Если необходимо, можем использовать несколько операторов writeln(f,...
сlosefile(f); //Закрываем файл
end;
Надеюсь, что синтаксис остальных программных конструкций достаточно очевиден.
Например, в операторе цикла for указываем начальное значение параметра i:=1,
затем после to n - конечное. Тело цикла идет сразу после слова do. Каждый оператор
заканчивается точкой с запятой. Если тело цикла должно включать в себя группу
операторов, то используем слово begin для маркировки начала блока и end для
маркировки конца блока.
Полный текст процедуры следующий:
procedure tform1.button1click (sender: tobject);
var
f:textfile; s:string[10]; n,i:word;
begin
n:=strtoint(edit1.text);
for i:=1 to n do begin s:=inttostr(i)+'.htm';
assignfile(f,s); rewrite(f);
writeln(f,'<html> <head> <title> Страница n "+inttostr(i)+"</title> </head><body>');
writeln(f,'<center><br><img src="'+inttostr(i)+'.jpg"><br>');
if i=1 then writeln(f,'<a href="'+inttostr(n)+'.htm">Назад </a>')
else writeln(f,'<a href="'+inttostr (i-1)+'.htm">Назад </a>');
writeln(f,'<a href= "index.htm"> Оглавление</a>');
if i=n then writeln(f,'<a href= "1.htm">Вперед</a>')
else writeln(f,'<a href= "'+inttostr(i+1)+'.htm">Вперед</a>');
writeln(f,'</center></body> </html>');
closefile(f);
end;
{=== Создаем файл оглавления index.htm ===}
assignfile(f,'index.htm');
rewrite(f);
writeln(f,'<html> <head> <title> Оглавление </title></head><body> <center>');
writeln(f,'<br>'+edit2.text+'<br>');
for i:=1 to n do
begin
writeln(f,'<br><a href= "'+inttostr(i)+'.htm">Страница n'+inttostr(i)+'</a>');
end;
writeln(f,'</center></body> </html>');
closefile(f);
end;
Вы, надеюсь, обратили внимание на два условных оператора if. Один необходим
для того, чтобы, двигаясь вперед, мы переходили от последней n-ой страницы не
к несуществующей (n+1)-й, а к странице с номером 1. Второй - чтобы, возвращаясь
назад, переходить от 1-й страницы к последней, а не к отсутствующей с номером
0.
Подводя итоги
В короткой статье невозможно подробно рассказать о назначении всех программных
конструкций. По своему многолетнему опыту преподавания компьютерных дисциплин
знаю, как порой не просто бывает человеку, не занимавшемуся ранее программированием,
воспроизвести даже готовый текст программы. Достаточно пропустить всего одну
точку или поставить вместо нее запятую, и программа перестает компилироваться.
Бывает и так, что программа запускается, но из-за ошибки набора результат оказывается
далек от ожидаемого. Так, строка
writeln(f,'<center><br><img src="'+inttostr(i)+'jpg"><br>');
синтаксически совершенно корректна, но в результате ее выполнения вместо имени файла 1.jpg будем получать 1jpg. Потеряна всего одна точка, но этого достаточно, чтобы вместо картинки увидеть на страничке маленький квадратик с перечеркнутым крестиком, информирующий о том, что картинку загрузить не удалось.
Если решите воспроизвести текст программы, рекомендую сначала скачать архив (gen.zip), содержащий все файлы проекта, убедиться, что все действительно работает, и только после этого приступать к написанию собственной программы. На сайте http://generator0.narod.ru/index.html представлен рассмотренный пример и вторая версия программы (можно задать размеры всех картинок по ширине и высоте, определить номер первой и последней страницы).
Созданная нами программа занимается только генерацией веб-страниц, но, добавив компонент nmftp, можно заставить ее не только создавать страницы, но и сразу загружать их на сайт. Задача размещения текста с элементами форматирования на генерируемых веб-страницах более сложна, но не является непреодолимым препятствием для программиста средней квалификации.
Сегодня в сети Интернет можно найти множество программ разного уровня сложности для автоматической или полуавтоматической генерации сайтов. Программы-генераторы, конечно, не могут заменить профессиональных веб-кодеров и веб-дизайнеров, но бывают полезны, когда требуется максимально быстро создать веб-сайт по шаблону.