29555

Разработка средств генерации графических текстов для информационных систем

Дипломная

Информатика, кибернетика и программирование

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

Русский

2015-01-19

1.07 MB

3 чел.

PAGE   \* MERGEFORMAT 2

Министерство образования и науки Российской Федерации

Федеральное государственное автономное образовательное учреждение высшего

профессионального образования
«Уральский федеральный университет

имени первого Президента России Б.Н. Ельцина»


Математико-механический факультет

Кафедра информатики и процессов управления

Разработка средств генерации графических текстов для информационных систем.

"Допущен к защите"      Бакалаврская работа студента 4 курса                                                                                                                          
___________________     Кожевина Александра Вячеславовича

"___"____________2011 г.                                     

Научный руководитель
Авербух Владимир Лазаревич
кандидат технических наук

Екатеринбург
2011

СОДЕРЖАНИЕ

ВВЕДЕНИЕ   .   .   .   .   .   .   .   .   .   .   .   .   .   .   .   .   .   .   .   . 3

1. О проблемах интерфейса  .  .   .   .   .   .   .   .   .   .   .   .   .   . 4

2. Метафоры интерфейса   .   .   .   .   .   .   .   .   .   .   .   .   .   . 6

3. Метафора визуализации   .   .   .   .   .   .   .   .   .   .   .   .   .   . 9

4. Манга + аниме   .   .   .   .   .   .   .   .   .   .   .   .   .   .   .   .   .   . 13

5. Постановка задачи   .   .   .   .   .   .   .   .   .   .   .   .   .   .   .   . 20

6. Структура программы генерации графических текстов   . 21

7. Структура веб-страницы   .   .   .   .   .   .   .   .   .   .   .   .   .   . 29

ЗАКЛЮЧЕНИЕ   .   .   .   .   .   .   .   .   .   .   .   .   .   .   .   .   .   .   . 31

ЛИТЕРАТУРА    .   .   .   .   .   .   .   .   .   .   .   .   .   .   .   .   .   .   . 32

ПРИЛОЖЕНИЕ 1   .   .   .   .   .   .   .   .   .   .   .   .   .   .   .   .   .   . 33

ПРИЛОЖЕНИЕ 2   .   .   .   .   .   .   .   .   .   .   .   .   .   .   .   .   .   . 40

ВВЕДЕНИЕ

В нынешнее время компьютеры стали неотъемлемой частью жизни человека. Началась повсеместная компьютеризация любых видов деятельности человека. Уже практически невозможно найти место, в котором компьютер не являлся бы важным ресурсом. Мало того сами компьютерные технологии не стоят на месте - на смену старых технологий приходят более мощные. И вот в наше время уже нельзя представить хорошую презентацию без участия проектора в конференц-зале. Или представление той же презентации одновременно в нескольких городах посредством видео-трансляций. А также большое множество примеров, в которых человек не может обойтись без компьютера.

Заметим, что в наше время в основном компьютеризация выполняется по одному принципу – перенос старого в компьютерный вариант или перенос информации «один в один». То, что можно было увидеть или пощупать руками, теперь стало точно таким же на вид, но в электронном виде. Например, электронные книги, видеопроектор отображающий текст или картинки. Каждая информационная система или программа имеет свой определенный интерфейс, через который человек может взаимодействовать с компьютером, может формулировать и решать свои задачи. Но одними интерфейсами пользоваться удобно и просто, а другими сложно и долго. Наша работа посвящается исследованию выбора оптимальной метафоры для интерфейса инструктивной информационной системы.

1. О ПРОБЛЕМАХ ИНТЕРФЕЙСА.

Теперь поговорим о современных проблемах интерфейса. Сначала дадим само определение интерфейса как такового. Интерфейс (от англ. interface — поверхность раздела, перегородка) — это совокупность средств, методов и правил взаимодействия между элементами системы.

В наше время существует достаточно много типов представления информации. И далеко не все отличаются хорошей информативностью, их бывает достаточно сложно интерпретировать. Основной ошибкой разработчика является то, что он создает интерфейс какой-либо программы, ориентируясь в основном на свои предпочтения, делает его так, как было бы удобнее для него самого. Но это большая ошибка, так как различные категории пользователей имеют самые различные предпочтения по представлениям информации и различный опыт, включая опыт использования компьютеров. И то, что кажется очевидным программисту, может стать большой загадкой для конечного пользователя. С другой стороны можно создать интерфейс, который бы требовал большой нагрузки на внимание пользователя, затрудняя понимание и замедляя работу, делая ее неэффективной. Простой пример - в окне программы будет много текста, полей для заполнения, мелкий шрифт. Также следует учитывать, что «хороший» интерфейс в идеале должен быть удобным как для неопытных пользователей, так и для продвинутых. Одним из методов улучшения интерфейсов является правильная компоновка информации, выводимой на экран. К примеру, ту информацию, которая для опытного пользователя будет очевидной, можно скрыть. Тем самым на экране останется только общая информация, которая не будет фокусировать внимание пользователя на определенной области, а наоборот, будет отображать картину в целом. Для неопытной категории пользователей следует реализовать возможность в любой момент отобразить скрытую информацию, которая бы отображала аспекты работы, ее смысл, какие-нибудь определения, разнообразные изображения, подсказывающие дальнейшие действия.

2. МЕТАФОРЫ ИНТЕРФЕЙСА

Для начала вспомним ситуацию, существовавшую в практике человеко-компьютерного интерфейса до появления визуальных метафор. В это время программисты (а именно они составляли основной контингент пользователей по всему миру) еще хорошо помнили работу за громоздкими пультами больших ЭВМ. В интерактивных системах господствовал командный интерфейс. Например, команды редактирования текста включали в себя указание операции, номер исходной строки (иногда и номер символа в строке) и (если необходимо) новый текст замены или вставки. Такой интерфейс, хотя и требовал от пользователя удерживать в голове постоянно изменяемое состояние текста, и, несмотря на случавшиеся казусы с сохранением этих изменений, был вполне приемлем для профессионалов. Однако внедрение массовых персональных ЭВМ просто не могло состояться без появления визуальных средств взаимодействия, новых устройств и принципиально новых концепций организации интерфейса с пользователем, например, таких, как концепция “непосредственного действия” (direct manipulation).

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

Б. Шнейдерман определил следующие характеристики интерфейса, созданного на основе концепции “непосредственного действия”:

1) Постоянное отображение объекта, представляющего интерес;

2) Физические действия (работа с мышью, джойстиком, сенсорным экраном - тач скрином, etc.) или использование функциональной клавиатуры вместо команд со сложным синтаксисом;

3) Быстрые, разбиваемые на шаги, допускающие возврат операции, чьё воздействие на объект, представляющий интерес, немедленно становится видимым;

Суть этого подхода к созданию интерфейса состоит в создании у пользователя впечатления о том, что он непосредственного воздействует на представленные на экране объекты, а не ведёт с ЭВМ диалог об этих объектах. Вместо использования командного языка для описания операций над объектами, пользователь манипулирует видимыми представлениями этих объектов на экране дисплея.

Очевидно, что визуальный интерфейс, построенный на этих принципах, немыслим без систематического использования элементов диалога, без некоторого языка, основанного на той или иной системе знаков. Человеко-компьютерное взаимодействие в этой связи может быть чётко описано как знаковый процесс.

Метафора интерфейса рассматривается как базовая идея сближения и аналогии между модельными объектами прикладной области и интерактивными объектами. Роль метафоры интерфейса заключается в том, что она способствует лучшему пониманию семантики взаимодействия, а также обеспечивает визуальное представление диалоговых объектов и определяет набор манипуляций пользователя с ними. Метафора интерфейса в этой связи представляется основой знаковой системы, которая в свою очередь лежит в основе диалогового языка. С помощью этого языка пользователь формулирует свою задачу и добивается от компьютера её решения.

Метафоры интерфейса можно подразделить на:

- метафоры, связанные с деятельностью пользователя в той или иной компьютерной среде,

- метафоры режима взаимодействия человека и компьютера,

- метафоры прикладной области.

Метафора интерфейса не только помогает описать абстракции, структурирует понимание новой прикладной области, но и задает объекты диалогового [визуального] языка. Анализ и изучение метафоры интерфейса требует привлечения понятийного аппарата семиотики.

3. МЕТАФОРА ВИЗУАЛИЗАЦИИ

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

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

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

Таким образом, более продуктивным является рассмотрение конкретной визуализации как знаковой системы. Здесь в наличии есть набор сущностей визуализируемой модели и набор соответствующих им визуальных образов. Анализ отношений между модельными сущностями позволяет выстроить достаточно чёткие отношения между отдельными визуальными образами, в частности, при разработке конкретного примера визуализации. Вместе с тем, при проектировании полноценной специализированной системы визуализации мало описания знакового соответствия. Нас в этом случае интересует прагматика системы, а также правила представления визуальных образов. Необходимо сделать следующий шаг и выделить язык визуализации в полном семиотическом смысле этого термина.

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

Разработка теории языка визуализации в свою очередь приводит к необходимости рассмотрения метафоры визуализации, как основной идеи сближения понятий прикладной области с той или иной образностью. Именно метафоры визуализации лежат в основе видов отображения, проектирование которых, в свою очередь, составляет базу проектирования когнитивной составляющей конкретной специализированной системы визуализации.

Пользователь системы имеет дело с конкретными графическими выводами, которые получаются, когда виды отображения “наполняются” реальными данными. Графические выводы являются воплощением абстрактного понятия вида отображения. Смена значимых и значащих картинок (графических выводов) при возможном взаимодействии с изображением является внешней стороной визуализации. Задача проектировщика - разработать набор видов отображения, обладающий такими свойствами, как системность и иерархичность. Идея сближения понятий, лежащая в их основе (метафора), может не быть явно описана в процессе проектирования, но, так или иначе, присутствует в сознании проектировщика. Аналогично, проектировщик может не фиксироваться на том, что данный набор сменяющихся видов отображения вместе с манипуляциями визуальными объектами, реализованный в той или иной визуальной среде, является полноценным языком визуализации. Следует понимать, что зачастую такие абстракции, как метафора и язык визуализации (и даже вид отображения), могут оставаться вне сферы внимания и разработчиков, и пользователей конкретной системы, но, тем не менее, они реально влияют на их деятельность и определяют её суть.

Имеет место ряд связанных между собой базовых понятий, который включает в себя метафору визуализации, язык визуализации, вид отображения, конкретный графический вывод.

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

Итак, метафора визуализации является системой сближений и аналогий, которая ставится в соответствие понятиям и объектам моделируемой прикладной области. Вторая функция метафоры визуализации - порождение некоторого изобразительного ряда (набора видов отображения) и набора методов взаимодействия с визуальными объектами.

Нами предлагается подход к пониманию метафоры, как главной идеи при отображении прикладной области на визуальный мир. Метафора, в противоположность стабильному знаку, может быть описана динамически, как акт или процесс обозначения одного понятия посредством знака, традиционно связанного с другим понятием.

Целью метафоры визуализации является создание наглядных зрительных образов, манипуляции с которыми как-то соответствуют операциям над модельными объектами. Составляющими метафоры визуализации являются ее образность и предписываемые ею действия, как по изменению визуальных образов, так и по манипуляциям пользователей с визуальными объектами. Метафора задаёт контекст, помогающий правильной интерпретации элементов данного языка визуализации, выявлению значения визуального текста.

Таким образом, метафора визуализации обеспечивает понимание отображаемых сущностей прикладной области, а также участвует в создании новых сущностей на базе внутренней логики самой метафоры.

4. МАНГА + АНИМЕ

Мы предполагаем, что информационную систему нужно проектировать на базе заранее придуманной визуальной метафоры, а не «один в один». К примеру, в наше время уже набрали свою популярность такие визуальные метафоры интерфейса, как информационная стена, книга, кинематограф, говорящая голова, комикс. Возьмем метафору информационной стены. Она обладает достаточно хорошей информативностью: ее можно осмотреть, сфокусировать внимание на какой-либо отдельной области, повернуть, что-нибудь написать. Но у стены можно выделить некоторые недостатки. Примером этого может служить то, что при большом скоплении информации сложно представить себе общий смысл, который хочет донести до пользователя стена в целом, так как стене может присутствовать как текст, так и всевозможные картинки, комментарии и тому подобное. В результате на экране отображается множество обрывистой информации. Поэтому нужно рационально подходить к компоновке текста, чтобы такая метафора помогала пользователю увидеть общую информацию, а программисту - передать ее. Книга – также обладает достаточной информативностью. Человечество до появления компьютеров всегда пользовалось книгой, и она стала самым распространенным способом передачи информации. Поэтому метафора книги является для человека естественной, что облегчает интерпретацию полученной информации. Но реализовать такой интерфейс сложно. Так же возможно отторжение пользователя использовать его. Говорящая голова тоже имеет определенный интерес в анализе существующих интерфейсов. Перед пользователем предстает образ живого человека, который передает информацию голосом, что считается самым естественным способом передачи информации. Появляется ощущение беседы. Но образ говорящей головы автоматически вызывает у пользователя впечатления, а они могут быть как положительными, так и отрицательными. Таким образом, информация носит субъективный характер. С лица говорящей головы параллельно с передаваемой информацией идет дополнительная информация, возможно вредная. Этим может служить и дикция, и мимика, и интонация. Сделав такой сравнительный анализ метафор, мы выдвигаем такую, которая бы брала идеи из предыдущих, но и привносила свои дополняющие возможности.

Мы рассмотрим метафору визуализации интерфейса «манга + аниме». Чем такая идея хороша? Какие преимущества она имеет перед другими метафорами? Эти вопросы мы разберем более тщательно. Для начала дадим определение манга и аниме, в то время как никакого полного определения данных понятий на сегодняшний момент нет.

Манга – это японские комиксы, иногда называемые комику. Аниме – это японская анимация, выполненная по определенным правилам. Манга, в той форме, в которой она существует в настоящее время, начинает развиваться после окончания второй мировой войны. В Японии мангу читают люди всех возрастов, она уважаема и как форма изобразительного искусства, и как литературное явление, поэтому существует множество произведений самых разных жанров и на самые разнообразные темы: приключения, романтика, спорт, история, юмор, научная фантастика, ужасы, эротика, бизнес и другие. Она стала популярной и в остальном мире, особенно в США, где продажи по данным на 2006 год находились в районе 175—200 млн. долларов. Положение аниме несколько более скромно, но также завидно. Актеры, которые озвучивают персонажей, пользуются уважением наравне с киноактерами, а лучшие анимационные фильмы обгоняют по кассовым сборам не только национальное кино, но и голливудские хиты. Основная часть аниме - ТВ-сериалы и сериалы, созданные для продажи на видео. Из сказанного выше можно сделать вывод, что манга и аниме очень распространены в мире и имеют большую популярность. Выделим в качестве основной идеи способ передачи информации в виде последовательности рисунков (манга) и последовательности видеофайлов (аниме). Следует отметить, что в манге нас интересует именно идея передачи информации как визуального текста. И если на экране мы видим набор картинок, то каждая из них будет иметь определенный смысл. Причем некоторые из них мы можем дополнить динамикой, то есть они будут анимированы. Заметим, что наша информационная система характеризуется как инструктивная. Т.е. система будет повествовать пользователю какую-то определенную  сферу деятельности, рассказывать и показывать действия, объясняя как правильно их делать.

У каждого человека были случаи в жизни, когда ему нужно было сделать то, что он ни разу не делал. В таких случаях он берет книгу, где написано что нужно делать и следует инструкции. Здесь мы будем иметь дело с некоторыми проблемами, одна из них - передача инструктивной информации через текст в контексте книги (метафоры книги). В условиях данного представления информации можно выделить несколько минусов. Во-первых, достаточно сложно осуществлять поиск нужной информации на страницах книги. Для этого нужно постоянно перелистывать страницы, искать глазами нужный текст, а без оглавления это представляется на порядок сложнее. Во-вторых, отсутствует наглядность. Перед читателем может быть представлено максимум две страницы, что отображает лишь малую часть всех информации, написанной в книге. Тем самым это все затрудняет сложить у человека в голове всю картину происходящего. В-третьих, отсутствует интерактивность. Все данные в книге представлены как статические. Никакие взаимодействия между объектами просто невозможны. Поэтому одна из основных целей нашего проекта является переход от статики к динамике.

Что может быть лучше любой информационной системы? Это инструктор. Секрет этого заключается в том, что инструктор напрямую взаимодействует с клиентом, может ему показать, как делается любое действие, объяснить, зачем это нужно и почему. Поэтому мы стремимся сделать такую систему, которая бы учила пользователя «не рассказом, а показом». Задача наглядности является одной из основных идей проекта.

Проведя такой характеристический анализ, можно сделать вывод, что мы объединяем возможности для полного изучения именно визуального текста. Манга представляет статический визуальный текст, аниме – привносит в него динамику.

Проведя такой характеристический анализ, можно заметить, что комикс обладает нужными нам качествами: наглядность, учение «не рассказом, а показом», интерактивность. В одну отдельную картинку можно заложить основную мысль какого-либо конкретного действия, изобразив лишь его основную идею. Последовательность картинок позволяет показать пользователю последовательность действий, которые ему нужно совершить, чтобы прийти к какому-то определенному результату. Таким образом, в последовательности картинок будут отображены основные идеи действий, и, как следствие, будет показана наглядность происходящего. Переход от одного действия к другому обуславливает интерактивность. А присоединение к картинкам видеофайлов улучшает понимание информации пользователем. Таким образом, прослеживается определенная связь между манга и аниме. Следует заметить, что мы не фиксируемся на идее основного смысла манга и аниме. А лишь берем некоторые идеи, полезные для реализации нашей инструктивной информационной системы.

Хотя такая метафора была придумана сравнительно давно, никто еще ее не реализовывал. Как было сказано выше, разработка интерфейса предполагает наличие метафоры. Бывают пространственные метафоры, стена, книга и т.д. И примеры их реализации наблюдаются с 80-х годов. Сама по себе идея манга и аниме в качестве метафоры не обладает большой информативностью, другими словами нужно придумать инструмент для ее реализации.

Заметим, что аниме создается по определенным правилам, по ним в итоге получается фильм, следовательно, нам нужно делать структурированную анимацию. Мы отталкиваемся от этого понятия, тем самым объединяя манга и аниме, и придерживаемся жестким правилам, по которым строим интерфейс.

Теперь мы попробуем объяснить, для чего может пригодиться такая метафора. Давайте в качестве области применения рассмотрим руководство по обслуживанию персонального компьютера. Эта тема становится все более актуальной, т.к. компьютеры становятся неотъемлемой частью нашей с вами жизни, и носит повседневный характер. Но далеко не все категории пользователей смогут поменять какую-либо деталь в системном блоке, т.к. некоторые из них не знают, что делать или не понимают, за что какие детали отвечают. Но сделав раз, два, пользователь приобретает определенные навыки, умение добраться до определенной детали, знакомится с устройством компьютера, ему требуется лишь какие-то подсказки или хитрые действия, которые постоянно забываются. В итоге, пользователь может запомнить все действия. В принципе мы могли бы взять руководство по эксплуатации любого оборудования, но по нашему мнению данная сфера нам ближе.

Теперь расскажем, как мы строим наш «фильм». Для того чтобы создать «правильный фильм», мы учитываем предпочтения любой категории пользователей, делаем его таким, чтобы всем им было удобно пользоваться, делаем нагрузку на внимание как можно меньше, чтобы пользователь концентрировался на работе, а не на интерпретации получаемой информации. В нашем «фильме» соединены такие понятия, как картинка, видео и текст. Также реализована двухуровневая система знаний, ориентированная на разные уровни навыков пользователя. Представляется проект в виде набора веб-страниц, который будет генерироваться, используя «сценарий». Страницу можно поделить на две основные части: текст и комикс. Вверху страницы будет располагаться название действия, ниже – основной текст, повествующий о том, какие нужно совершать действия для достижения нужного результата. Текст будет занимать центральное положение на странице. В нижней части будет располагаться комикс. Другими словами, все то, что было написано текстом, теперь будет изображено. Любому опытному пользователю будет этого достаточно, ему достаточно просто взглянуть на картинки или прочитать текст. Неопытные пользователи уже при прочтении текста могут столкнуться с некоторыми трудностями. Например, ему встретилось незнакомое определение детали или он не понял из написанных слов, какие конкретно действия нужно делать. Поэтому для такого случая в проекте будет реализован второй уровень знаний. Определения, которые могут быть незнакомыми пользователю, нужно объяснить. Самым удобным способом будет показ внешнего вида незнакомой детали и текстовое описание ее предназначения. Для реализации сказанного поставим рядом с незнакомым словом свернутый текст в виде «+», при нажатии на него будет развернута область, где и будет присутствовать описательная информация. Таким образом, пользователь будет знать, как выглядит и зачем нужна любая деталь. На случай, если пользователь не понял какие конкретно действия нужно произвести, то к каждой картинке из комиксов можно будет присоединить видеофайл, где будет показано все в действии с сопровождением комментариев инструктора. Инструктор будет объяснять, что он делает и чем он пользуется при этом. В результате пользователь сможет повторить все действия за инструктором и безопасно провести нужную работу.

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

Получается, что в чем-то метафора «манга + аниме» похожа на метафору стены, что информация выложена частями, в каком-то порядке, и можно взаимодействовать с объектами. В чем-то она похожа на метафору книги, так как отображается визуальный текст, причем он обладает важным преимуществом – информация представляется как связный набор. Но, в то же время мы можем «оживить» его, используя анимацию.

5. ПОСТАНОВКА ЗАДАЧИ

Для реализации всего проекта мы использовали следующий подход. Работа будет осуществляться в два этапа. Первый – это генерация видеосценариев для инструктивных информационных систем, второй –разработка методов их реализации. Первую часть разработал мой коллега, Калашник Борис. Вторую часть реализовал я. Моя задача заключается в следующем. Нужно создать шаблон веб-страницы, которая будет генерироваться из файла-сценария, который, в свою очередь, будет являться результатом работы Калашника Бориса. Данная страница создается согласно идей в метафоре «манга + аниме», описанной выше. Синтаксис веб-страницы исполнен в коде языка разметки HTML, а ее генерация будет реализована на языке объектно-ориентированного программирования JAVA. На основе такого шаблона нужно создать связный набор html-страниц, отображающий в совокупности какой-либо вид деятельности.

6. СТРУКТУРА ПРОГРАММЫ ГЕНЕРАЦИИ ГРАФИЧЕСКИХ ТЕКСТОВ

Для того чтобы реализовать задуманное, нужно хорошо продумать структуру проекта. Такой подход сделает работу более эффективной и продуманной. Можно выделить две части проекта, которые требуют отдельного внимания. Первая – это одна из страниц, тоесть представитель множества веб-страниц, созданных по определенному шаблону. Второй – это программа, которая будет использовать этот шаблон для автоматической генерации самих веб-страниц вместе с оглавлением из файла-сценария, полученного от моего напарника Калашникова Бориса.

Сначала рассмотрим подходы к созданию программы для генерации сайта. Рассмотрим картину в целом. У нас есть набор файлов, набор видео, набор текстов действий и файл-сценарий, связывающий все эти файлы между собой по определенной схеме. Здесь можно выделить некоторые отдельные совокупности данных. Заметим, что для какого-то отдельного действия существуют определенные файлы и только они. Ни для какого другого действия эти файлы не подойдут. Поэтому, по смыслу их можно объединить в одну группу, которая будет соответствовать одному действию. Например, действие «1» будет соответствовать группе, состоящей из файлов 1-0.jpg, 1-1.jpg, 1-0.mkf, 1-1.mkf, 1.txt. В названии самих файлов будет заложено отношение к определенному действию. Сразу возникает вопрос о том, что по названию файлов невозможно сказать о том, какой смысл несет действие «1» или действие «4». Такой способ представления сделан специально для оптимизации работы программы. Иначе, если указывать название действий в самих файлах, то оно может быть очень длинным, что представляет определенные трудности при программировании, так как работа с числами намного проще и быстрее, чем со строками. Поэтому для описания названия действий удобно создать отдельный файл, ставящий во взаимно однозначное соответствие «название-номер», в котором будут описаны все действия по порядку, а вначале будет задано количество действий. Следует отметить, что каждое действие имеет свой уникальный номер, по этому номеру в дальнейшем будет построена вся работа программы. В демонстрационной версии проета данный файл будет лежать по адресу «корневая папка проекта\Files\names.txt». Результат программы генерации сценария, который является результатом бакалаврской Калашникова Бориса, подразумевает, что файлы сайта находятся по адресу, который начинается с корневой папки проекта. В нашем случае это будут такие: «корневая папка проекта\Files\Photos\» для изображений, файлы видео будут лежать по адресу «корневая папка проекта\Files\Videos\», а текстовые файлы по адресу «корневая папка проекта\Files\Actions\». Из соображений по поводу метафоры «манга + аниме», для каждой картинки должен быть прикреплен определенный видео-файл. Это можно реализовать с помощью введения маски по названию файлов. Название будет состоять из двух частей: номер действия, к которому файл относится  и номер файла по порядку, так как к одному действию может относиться несколько изображений и видео. Разделителем между числами будет служить символ  «-». Например «1-0.jpg» и «1-0.mkf». Действия, предшествующие к рассматриваемому, определяются в процессе обработки сценария и явно никак не описываются.

Не оставим без внимания и то, что Java – объектно-ориентированный язык программирования. По сделанным наблюдениям можно сделать вывод, что удобнее всего создать класс веб-страницы. В объекте такого класса будет лежать абсолютно вся информация о себе. В это входят следующие поля: номер действия, название действия, предшествующие действия, текст действия, список путей к картинкам, список путей к видео. Информация о входных данных описана чуть выше и требует лишь обработки файлов для присвоения ее в поля объектов.

Теперь рассмотрим структуру проекта среды программирования «Eclipse SDK» языка программирования JAVA. Для правильной работы интернет-браузеров программа использует кодировку UTF-8. Проект разделен на четыре класса: Bakalavrskaya.java, CreateSite.java, CreateText.java, Page.java.

Для начала опишем класс Page.java. Он описывает тип страницы и содержит поля:

String name     - название страницы;

int number_of_action   - номер действия;

String text     - форматированный текст действия;

LinkedList<String> images  - список путей к картинкам;

LinkedList<String> video  - список путей к видео;

LinkedList<Integer> dependence - список зависимостей.

А также такие функции, как Page (int, String,String, LinkedList<String>, LinkedList<String>, LinkedList<Integer>) – конструктор для объекта класса Page, Page () – пустой конструктор, void out () – функция вывода информации об объекте в системную консоль (данная программа использовалась для отладки работы проекта). Такой структурированный способ представления страницы будет объединять полную информацию о ней в отдельном объекте, что очень удобно в работе с совокупностью страниц.

Главным классом является класс Bakalavrskaya.java. В нем описан метод main и он содержит вызовы процедур InitScenario(String) и Creating(void). Первая процедура служит для инициализации файла сценария, путь к которому передается как аргумент. Ее результатом будет инициализация глобальной переменной LinkedList <Page> Site, которая состоит из объектов класса Page. Каждый объект соответствует отдельной веб-странице сайта. Результатом второй процедуры будет достигнута цель данного проекта - сайт, в частности создание набора html-файлов, вместе с общим html-оглавлением. Также в этом классе реализована функция FindAt (LinkedList<Page>, int) поиска страницы в переменной типа связанного списка LinkedList<Page> по номеру действия. Это нам неоднократно потребуется для упорядоченного обращения к страницам в переменной Site.

Теперь перейдем к описанию класса CreateText. Этот класс состоит из четырех функций: String replaceString(String, String, String), String GiveText(String), String GiveJpegVideoCode (Page), InitScenario (String).

Функция String replaceString(String, String, String) служит для поиска и замены всех подстрок по заданному образцу в искомой строке на заданную строку.

Функция String GiveText(String) возвращает форматированный текст описания действия. Исходный файл с описанием действия создается по определенной схеме, которую как раз и распознает данная функция. В начале файла в одной строке должен быть написан текст описания действия. После некоторых слов, которые по мнению автора могут быть незнакомыми пользователю, ставится какая-нибудь уникальная метка, например «(*01)», после следующего потенциально незнакомого слова ставится метка «(*02)» и так далее. Ниже, через строку идет описание меток по следующему шаблону: сначала в одну строку пишется сама метка, ниже пишется определение слова без переводов строки, относящегося к описываемой метке, и в новой строке путь к картинке определения. Далее идет перенос строки. Другие метки определяются по такому же шаблону. Таким образом функция GiveText в цикле (один проход цикла равнозначен замене одной метки в тексте) распознает все метки, пока они не кончатся, и вставляет вместо них текст html-кода:

<a href="#" onclick="$('#bi').slideToggle();return false;"><sup></sup></a>

<div id="bi" style="display:none; border: 1px solid #666\r\n\t\t\t<img src = "way">  def  </div>,

где i – это номер текущей метки, def – определение метки, way – путь к файлу изображения. Таким образом, в тексте при отображении в интернет-браузере напротив потенциально незнакомого слова будет поставлен «+», при нажатии на которого текс раздвинется и появится картинка и текст определения.

Функция GiveJpegVideoCode возвращает часть кода веб-страницы, отвечающую за отображение картинок и видеофайлов. Используя шаблон этого участка кода, требует ввести лишь пути для изображений и видео. Для каждой пары «изображение-видео» он создается отдельно. Реализовано это на базе цикла while, пока в полученном как аргумент объекте страницы по порядку не переберутся все пары «изображение-видео». В результате мы получим код страницы, состоящий из блоков, представленных на экране в интернет-браузере последовательно, выровненных по центру.

Последняя часть этого класса – процедура InitScenario. Результатом ее работы будет инициализация глобальной переменной LinkedList<Page> Site. Ее работа начинается с обработки файла названий действий. Сначала считывается количество действий и запоминается в переменную int quant. Далее происходит инициализация глобальной переменной String [] ar_names – массива имен всех действий. В дальнейшем мы будем копировать требуемое название действия в объект веб-страницы. Дальше мы создаем переменную буфера чтения из файла сценария, путь к которому передается как аргумент функции InitScenario; объявляем объект класса Page, который мы будем периодически формировать по ходу работы цикла обработки сценария. Далее начинается сам цикл обработки сценария. Его результатом будет формирование переменной Site. Заранее известно то, как построен сценарий, то есть его шаблон. Текст можно поделить на несколько частей. Эти части отделены друг от друга пропуском строки. Каждая часть представляет собой последовательность действий. Каждое действие начинается с последовательности символов «action: ». Далее в этой же строке идет номер действия. Действие, в свою очередь, тоже делится на 4 смысловые части. Сначала идет номер действия, потом путь к файлу описания, потом перечисляются пути к картинкам и в конце перечисляются пути к видео-файлам. Следующей строкой снова идет последовательность «action:», или пропуск строки, или, в случае конца файла, двойной пропуск строки. Таким образом, образуется главный цикл обработки сценария, в нем последовательно идут: получение номера действия, создание нового объекта класса Page, обработка пути текста, цикл получения путей к изображениям, цикл получения путей к видео. Цикл получения путей к изображениям считывает строку, пока она не будет равна «  VideoFiles:» и добавляет к полю page.images очередной путь. Цикл получения видео-файлов считывает строку, пока не встретит пустую или равную «Action:». На каждой итерации добавляется очередная строчка к полю page.video. Заметим, что непрерывная часть текста представляет последовательность действий. Причем с таким смыслом, что последнее действие является главным, а все предыдущие – предшествующими. Поэтому, когда в цикле получения путей к видео-файлам считывается пустая строка, это говорит о том, что последовательность предшествующих действий к последнему сформирована и можно скопировать этот список в поле page.dependence. Теперь опишем то, как формируется список зависимостей. В файле сценария будет написано ровно столько частей, разделенных пустой строкой, сколько действий. Никакие два действия, находящихся в конце какой-либо части, не будут равны одному и тому же числу. Поэтому, заведем временную переменную LinkedList<Integer> dep_temp и введем следующую логику. В начале каждой части будем очищать его. Как только прочитали номер очередного действия, сохраняем его во временную переменную i_parse. Далее, в цикле обработки путей видео-файлов, если последняя строка равна «Action:», то добавляем i_parse в список dep_temp, иначе (пустая строка) копируем dep_temp в страницу под номером i_parse, то есть текущую. Для этого пользуемся методом FindAt. Заметим, что в файле сценария действия могут повторяться очень часто. В логике, описанной выше, происходит создание новой страницы всякий раз, когда встречается последовательность символов «Action:». Поэтому создан массив boolean IsFined, который будет содержать в себе информацию о создании страницы, соответствующей номеру элемента этого массива, следовательно, все операции, которые связаны с присвоением в объект Page и его созданием, будут проводиться тогда и только тогда, когда соответствующий элемент IsFined будет равен false. Тем самым мы оптимизируем работу программы и оградим ее от множественного создания одинаковых страниц и их наложением друг на друга в переменной Site.После работы цикла обработки путей видео-фалов, если соответствующий элемент IsFined будет равен false, добавляем текущую страницу в переменную Site и меняем тот же элемент IsFined на true.

Теперь рассмотрим последний класс данного проекта CreateSite.java. Он состоит из пустого конструктора и двух проедур: GiveMain (LinkedList<Page>) и Creating (void). Сначала рассмотрим процедуру GiveMain (LinkedList<Page>). На вход идет переменная списка объектов типа Page. Результатом работы будет служить созданный файл «main.html». Он будет создаваться по шаблону, который был заранее продуман. Нужно лишь добавить в этот шаблон нужные строки. Сначала добавляем название проекта, которое лежит в файле по адресу «корневая папка проекта/Files/name_contents.txt». Работа данной процедуры подразумевает, что уже была сформирована переменная Site. Поэтому в цикле по длине массива ar_names будем по очереди добавлять ссылки на страницы действий, страницы имею вид «indexi.html», где i – это порядковый номер действия. Название для каждой ссылке можно взять в поле name действия с таким же номером, обратившись к функции FindAt.

Рассмотрим процедуру Creating. На вход ничего не передается, работа заключается лишь в генерации множества html-файлов, связанных с соответствующими действиями. Процедура реализована на основе одного цикла, результатом каждой итерации которого будет формирование одного html-файла, и вызова процедуры создания файла меню GiveMain. Этот цикл можно разделить на шесть логических частей, которые последовательно выполняются друг за другом. Сначала получается очередная переменная из списка Site, создается для нее файл с названием «indexi.html», где i – это итератор цикла, одновременно являющийся и номером страницы, и записывается часть шаблона веб-страницы. Следующая часть отвечает за заголовок страницы. Здесь записывается в файл поле name текущей страницы с выравниванием текста по центру. Далее идет часть записи предшествующих действий. Здесь в цикле по полю dependence текущей страницы каждая с новой строки создается ссылка на страницы действий, определяющиеся по номеру. Создаются строки следующего типа:

<a href="indexi_itr.html">Bakalavrskaya.FindAt(Site, i_itr).name</a><br>,

Где i_itrэто текущий номер предшествующего действия в списке dependence, а Bakalavrskaya.FindAt(Site, i_itr).name – получение названия действия заданного по текущему номеру i_itr. В следующем блоке текста записывается форматированный текст действия с подключенными метками, который был получен через функцию GiveText, с передачей в нее поля text текущей страницы. За ним следует вставка кода, отвечающего за отображение картинок и подключенных к ним видео. Для этого вызывается функция GiveJpegVideoCode и передается в нее текущая страница. Далее пишется ссылка на возврат в главное меню. Что делает эксплуатацию системы удобнее в использовании, так как это упрощает навигацию по сайту. На этом тело цикла завершается.

Большим преимуществом данного проекта является то, что все данные, которые используются в проекте формируются динамически, участие программиста сводится «на нет». Достаточно получить файл сценария и запустить проект, чтобы прошла генерация сайта.

7. СТРУКТУРА ВЕБ-СТРАНИЦЫ

Теперь рассмотрим подходы и методы для создания шаблона веб-страницы. Следует отметить, что практической частью данной квалификационной работы будет служить лишь макет системы, отображающий саму суть ее работы. Я не буду вдаваться в тонкости графического представления информации, изучению возможностей скриптов, всплывающих окон и так далее, так как это не входит в область изучения данной работы. Для создания макета системы будут использоваться простые методы в программировании, а именно отображение картинок, подключения к ним видео, текста и гиперссылок, с помощью которых будет осуществляться переход между страницами.

Для осуществления проекта используется следующий принцип. Нужно создать одну страницу и реализовать в ней все идеи, которые были исследованы в теоретической части. В то время как все действия являются однотипными по отображению, структура страницы сохраняется, а меняется лишь ее внутреннее содержимое отдельных частей. Следовательно, представляется возможным использовать ее как шаблон для генерации всех действий, которые будут присутствовать в файле сценария. Требуется лишь менять некоторые области кода в соответствии с выбранным действием. Получив код одной страницы, было проведено исследование кода, направленное на разделение на части, точно между местами, где код будет отличаться у разных страниц. Таким образом, выделяются такие части, как заголовок, отображение текста действия, отображение изображений, присоединение видео-файлов к соответствующим изображениям. Для генерации каждого блока кода выше были описаны процедуры и функции. Таким образом, если для каждого действия получить совокупность блоков кода и соединить все в одном файле, то получится работоспособная страница. Для удобства восприятия информации будем использовать выравнивание всего по центру страницы. Так пользователи будут меньше «бегать глазами» по экранам с разным отношением сторон, в то время как именно такой способ выравнивания считается более естественным. В разработке кода веб-страницы были использованы возможности библиотеки JavaScript «jquery» и «highslide». Библиотека «jquery» фокусируется на взаимодействии JavaScript и HTML, а библиотека «highslide» использовалась для вывода сопряженного видео после нажатия на любое изображение.

ЗАКЛЮЧЕНИЕ

В ходе работы была исследована визуальная метафора «манга + аниме» и получена ее реализация. Реализация исполнена в виде связного набора html-страниц, каждая из которых исполнена на основе идей исследуемой метафоры. Программу проверили на конкретном примере – инструкция по разборке компьютерного системного блока на его составляющие. Сфера использования данной программы может быть любой, так как любой вид деятельности подразумевает свой набор действий, которые поддаются описанию. В дальнейшей работе следует усовершенствовать внешний вид страниц.

ЛИТЕРАТУРА

Авербух В.Л., Байдалин А.Ю., Казанцев А.Ю., Рябинина Л.Б. Метафоры и комплексные виды отображения для систем информационной визуализации // Пробл. Теорет. И прикл. Математики: Тр.36 Регион.мол.конф. Екатеринбург, ИММ УрО РАН, 2005. С.314-315

Авербух В.Л. К теории компьютерной визуализации // Вычислительные технологии Т. 10, N4, 2005, стр 21-51

Watch What I Do. Programming by Demonstration. (Ed.- Allen Cypher) MIT Press. Cambridge, (Mass.), 1993.

Averbukh V.L., Bakhterev M.O., Baydalin A.Yu., Gorbachevskiy D.Yu., Ismagilov D.R., Kazantswv A.Yu., Nebogatikova P.V., Popova A.V., Vasev P.A. Searching and Analysis of Interface and Visualization Metaphors // Human-Computer Interaction, New Developments. / Edited by Kikuo Asai. Chapter 3, Vienna, In-the. ISBN 978-953-7619-14-5, pp. 49-84.

Averbukh V.L. Magic Fairy Tales as Source for Interface Metaphors // Journal of HCI Vistas Vol. IV, UX Design / Article 9.

Эккель Б.. Философия Java. Библиотека программиста. 4-е изд. – СПб.: Пи-тер, 2009. – 640 с.

Приложение 1

КОД ПРОГРАММЫ

П1.1 class Bakalavrskaya

import java.io.FileNotFoundException;

import java.io.FileWriter;

import java.io.IOException;

import java.util.Iterator;

import java.util.LinkedList;

public class Bakalavrskaya{

 static boolean [] IsFined = new boolean [50];

 static LinkedList <Page> Site = new LinkedList <Page>();

 static String [] ar_names;

 

 

 public static Page FindAt (LinkedList<Page> sourse, int number){

 Iterator<Page> itrpage = sourse.iterator();

 Page temp = null;

 while (itrpage.hasNext()) {

  temp=itrpage.next();

  if (temp.number_of_action == number) return temp;   

 }

 return null;

}

 

 public static void main(String [] args) throws FileNotFoundException, IOException

{

 CreateText.InitScenario("out.txt");

 Iterator<Page> itrpage = Site.iterator();

 int i=0;

 while (itrpage.hasNext() && i<100) {

  itrpage.next().out();

  i++;

 }

 CreateSite CSite = new CreateSite();

 CSite.Creating();

}

}

П1.2 class CreateText

import java.io.BufferedReader;

import java.io.FileInputStream;

import java.io.IOException;

import java.io.InputStreamReader;

import java.util.Iterator;

import java.util.LinkedList;

//Поиск и замена подстроки в строке

 public static String replaceString(String aSearch, String aFind, String aReplace) {

    String result = aSearch;

    if (result != null && result.length() > 0) {

        int a = 0;

        int b = 0;

        while (true) {

            a = result.indexOf(aFind, b);

            if (a != -1) {

                result = result.substring(0, a) + aReplace + result.substring(a + aFind.length());

                b = a + aReplace.length();

            } else

                break;

        }

    }

    return result;

}

 

 //Получение текста вместе с расшифровкой

 public static String GiveText(String InFile) throws IOException{

String result = new String("\t<div style=\"text-align: center;\">\r\n\t\t");

 BufferedReader in = new BufferedReader(

       new InputStreamReader(

        new FileInputStream(InFile),"utf-8"));

 result+=in.readLine();

 String temp = in.readLine();

 temp = in.readLine();

 System.out.println(temp);

 int i=1;

 while(temp!=null){

  String def = in.readLine();

  String way = in.readLine();

result=replaceString(result,temp, "<a href=\"#\" onclick=\"$('#b"+i+"').slideToggle(); "+"return false;\"><sup>+</sup></a>\r\n\t\t<div id=\"b"+i+"\""+"style=\"display: none; border: 1px solid #666;\">"+"\r\n\t\t\t<img src=\""+way+"\"> "+def+"\r\n\t\t</div>\r\n\r\n");

  i++;

  temp = in.readLine();

  temp = in.readLine();

 }  

 return result;

}

 

 //Получение кода картинок и видео файлов

 public static String GiveJpegVideoCode (Page page){

 String container = new String("");

 String container2 = new String("");

String part1 = new String("\t\t<a href=\"#\" onclick=\"return showgood(null, 'highslide-maincontent-");

 String part2 = new String("');\"><img src=\"");

 String part3 = new String("\"></a>\r\n");

 

String part4 = new String("\t<div class='highslide-maincontent' id=\"highslide-maincontent-");

String part5 = new String("\">\r\n\t\t<object width=\"430\" height=\"340\" name=\"player\" classid=\"clsid:D27CDB6E-AE6D-11cf-96B8-444553540000\" id=\"player4\">\r\n\t\t<param value=\"mp.swf\" name=\"movie\">\r\n");

String part6 = new String("\t\t<param value=\"true\" name=\"allowfullscreen\">\r\n\t\t<param value=\"never\" name=\"allowscriptaccess\">\r\n\t\t<param value=\"file=");

 String part7 = new String("&image=");

String part8 = new String("\" name=\"flashvars\">\r\n\t\t<embed width=\"430\" height=\"340\" flashvars=\"file=");

String part9 = new String("\" allowfullscreen=\"true\" allowscriptaccess=\"never\" src=\"mp.swf\" name=\"player4s2\" id=\"player4s2\" type=\"application/x-shockwave-flash\">\r\n");

String part10 = new String("\t\t</object>\r\n\t</div>\r\n\r\n\r\n");

 

 int i=0;

 Iterator<String> itrimg = page.images.iterator();

 Iterator<String> itrvid = page.video.iterator();

 while (itrimg.hasNext() && itrvid.hasNext()) {

  i++;

  String temp_img = itrimg.next();

  String temp_vid = itrvid.next();

  container += part1 + i + part2 + temp_img + part3;

container2 += part4 + i + part5 + part6 + temp_vid + part7 + temp_img + part8 + temp_vid + part7 + temp_img + part9 + part10;

 }

String result = new String ("\t<br><br><br>\r\n\t<div>\r\n" + container + "\t</div>\r\n" + container2);

   

 return result;

}

 

 //Инициализация сценария

 public static void InitScenario (String InFile) throws IOException{

 BufferedReader in_names = new BufferedReader(

       new InputStreamReader(

        new FileInputStream("Files//names.txt"),"utf-8"));

 int value = Integer.parseInt("10");

 String tttt = in_names.readLine();

 int quant = 10;

 ar_names = new String [quant];

 for (int i=0; i<quant; i++){

  ar_names[i] = in_names.readLine();

 }

 BufferedReader in = new BufferedReader(

       new InputStreamReader(

        new FileInputStream(InFile),"utf-8"));

 String current = new String();

 current = in.readLine();

 LinkedList<Integer> dep_temp = new LinkedList<Integer>();

 boolean was_empty = false;

 Page page = new Page();

 while (current!=null && !current.equals("")){

  try {

   String ttt = replaceString(current, "Action: ", "");

   int i_parse;

   i_parse = Integer.parseInt(ttt);

   current = in.readLine();

   current = in.readLine();

   if(IsFined[i_parse]==false){

    page = new Page();

    page.number_of_action = i_parse;

    page.name = ar_names[i_parse-1];

    current=replaceString(current,"    ","");

    page.text=current;

    }

   current = in.readLine();

   current = in.readLine();

   while(!current.equals("  VideoFiles:")){

    if(IsFined[i_parse]==false){

     current=replaceString(current, "    ","");

     page.images.add(current);

    }

    current = in.readLine();

   }

   current = in.readLine();

while(current != null && !(current.indexOf("Action:")!=-1)){

if(IsFined[i_parse]==false && !current.equals("")){

     current=replaceString(current, "    ","");

     page.video.add(current);

     }

    current = in.readLine();

    if (current.equals("") && current!=null){

     was_empty = true;

     Page cur = FindAt(Site, i_parse);

Iterator<Integer> itrdep = dep_temp.iterator();

     while (itrdep.hasNext()) {

if (cur == null) page.dependence.add(itrdep.next());

else cur.dependence.add(itrdep.next());

}

     dep_temp = new LinkedList<Integer>();

     current = in.readLine();

   }

  }

   if(IsFined[i_parse]==false)Site.add(page);

   if (was_empty == false)

    dep_temp.add(i_parse);

   if (was_empty == true) was_empty = false;

   if (IsFined[i_parse]==false) IsFined[i_parse]=true;

   

  }

  catch (NumberFormatException ex) {

System.out.println("The String does not contain a parsable integer");

  }

 }  

}

}

П1.3 class Page

import java.util.Iterator;

import java.util.LinkedList;

public class Page {

String name;

 int number_of_action;

String text;

LinkedList<String> images;

LinkedList<String> video;

LinkedList<Integer> dependence;

Page (int num, String nm,String txt, LinkedList<String> img, LinkedList<String> vid, LinkedList<Integer> dep){

 name = nm;

 number_of_action = num;

 text = new String (txt);

 images = new LinkedList<String>();

 Iterator<String> itrstr = img.iterator();

 while (itrstr.hasNext()) {

  images.add(itrstr.next());   

 }

 video = new LinkedList<String>();

 Iterator<String> itrvid = vid.iterator();

 while (itrvid.hasNext()) {

  video.add(itrvid.next());   

 }

 dependence = new LinkedList<Integer>();

 Iterator<Integer> itrint = dep.iterator();

 while (itrint.hasNext()) {

  dependence.add(itrint.next());   

 }

}

Page (){

 number_of_action = -1;

 name = new String ("");

 text = new String ("");

 images = new LinkedList<String>();

 video = new LinkedList<String>();

 dependence = new LinkedList<Integer>();

}

 void out (){

 System.out.println("Номер страницы: "+number_of_action);

 System.out.println("Название страницы: "+name);

 System.out.println("Путь к тексту: "+text);

 Iterator<String> itrstr = images.iterator();

 int u=0;

 while (itrstr.hasNext() && u<100) {

  u++;

  System.out.println("Путь к картинке: "+itrstr.next());

 }

 Iterator<String> itrvid = video.iterator();

 while (itrvid.hasNext() && u<100) {

  u++;

  System.out.println("Путь к видео: "+itrvid.next());

 }

 Iterator<Integer> itrint = dependence.iterator();

System.out.print("Перед действием "+number_of_action+" нужно сделать: ");

 while (itrint.hasNext() && u<100) {

  u++;

  System.out.print(itrint.next()+" ");

 }

 System.out.println();

}

}

П1.4 class CreateSite

import java.io.BufferedReader;

import java.io.FileInputStream;

import java.io.FileWriter;

import java.io.IOException;

import java.io.InputStreamReader;

import java.util.Iterator;

import java.util.LinkedList;

public class CreateSite extends Bakalavrskaya{

 

 public CreateSite() {}

 

 public void GiveMain (LinkedList<Page> Pages) throws IOException{

 System.out.println("Создаем главное меню");

 FileWriter main = new FileWriter("main.html");

main.write("<!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.01 Transitional//EN\" \"http://www.w3.org/TR/html4/loose.dtd\">");

main.write("<html>\r\n<head>\r\n\t<meta http-equiv=\"content-type\" content=\"text/html; charset=utf-8\">\r\n\t<script type=\"text/javascript\" src=\"js/jquery.js\"></script>\r\n\t<script type=\"text/javascript\" src=\"js/highslide.js\"></script>\r\n\t<style type=\"text/css\">@import url(\"css/highslide.css\");</style>\r\n</head>\r\n<body>\r\n");

 BufferedReader in = new BufferedReader(

  new InputStreamReader(

    new FileInputStream("Files//name_contents.txt"),"utf-8"));

 String text = in.readLine();

 in.close();

 main.write("\t<h1>"+text+"</h1>\r\n");

 for (int i=0; i<ar_names.length; i++){

  Page current_page = FindAt(Site, i+1);

main.write("\t<a href=\"index"+current_page.number_of_action+".html\">"+current_page.name+"</a><br>\r\n");

 }

 main.write("</body>\r\n</html>\r\n");

 main.close();

}

 

 public void Creating () throws IOException{

 

 for (int i=0; i<ar_names.length; i++){

  System.out.println(i);

  Page current_page = FindAt(Site, i+1);

  FileWriter current_file = new FileWriter("index"+current_page.number_of_action+".html");

current_file.write("<!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.01 Transitional//EN\" \"http://www.w3.org/TR/html4/loose.dtd\">\r\n");

  current_file.write("<html>\r\n");

  current_file.write("<head>\r\n");

current_file.write("\t<meta http-equiv=\"content-type\" content=\"text/html; charset=utf-8\">\r\n");

current_file.write("\t<script type=\"text/javascript\" src=\"js/jquery.js\"></script>\r\n");

current_file.write("\t<script type=\"text/javascript\" src=\"js/highslide.js\"></script>\r\n");

current_file.write("\t<style type=\"text/css\">@import url(\"css/highslide.css\");</style>\r\n");

current_file.write("\t<script type=\"text/javascript\">\r\n");

  current_file.write("\tfunction showgood(elm, contId)\r\n");

  current_file.write("\t{\r\n");

current_file.write("\treturn hs.htmlExpand(elm, { outlineType: 'rounded-white', wrapperClassName: 'draggable-header', align: 'center', width: 445, height: 410, dimmingOpacity: 0.8,  maincontentId: contId} )\r\n");

  current_file.write("\t}\r\n");

  current_file.write("</script>\r\n");

  current_file.write("</head>\r\n");

  current_file.write("<body>\r\n");

  

  //Заголовок страницы

  current_file.write("\t<center><h1>"+current_page.name+"</h1></center>\r\n");

  current_file.write("\r\n");

  

  //Предшествующие действия

Iterator<Integer> it = current_page.dependence.descendingIterator();

  boolean flag_empty = it.hasNext();

if (flag_empty)current_file.write("<div style=\"text-align: center;\">\r\nВам нужно сначала сделать следующие действия:<br>\r\n");

  while (it.hasNext()) {

   int i_itr = it.next();

current_file.write("\t<a href=\"index"+i_itr+".html\">"+Bakalavrskaya.FindAt(Site, i_itr).name+"</a><br>\r\n");

  }

  if (flag_empty) current_file.write("</div>\r\n");   

  

  //Текст последовательности действий

  String Text_tmp = CreateText.GiveText(current_page.text);

  current_file.write(Text_tmp);

  

  //Вставка кода картинок с видео-вложениями

String JpegVideo = CreateText.GiveJpegVideoCode(current_page);

  current_file.write(JpegVideo);

  

  //Вставка строчки с возвратом в главное меню

current_file.write("<div style=\"text-align: center;\">\r\n\t<br><a href=\"main.html\">Возврат в главное меню</a><br>\r\n</div>");

  

  current_file.write("</body>\r\n</html>\r\n");

  current_file.close();

 }

 

 //Создание главного меню

 GiveMain(Site);

 

}

}

Приложение 2

ПРИМЕР

Входными данными для программы является файл сценария, внешний вид которого представлен на рис. П.2.1, и набор папок (описания действий, видео, изображения).

Рис. П.2.1. Конец файла сценария. Описание действия №6.

Выходными данными программы является набор html-файлов: главное меню (рис. П.2.2) и набор действий. Название вида деятельности – «Разборка компьютера»

Рис. П.2.2 Вид главного меню системы

Каждая страница имеет вид, представленный на рис. П.2.3. В ней присутствует название действия «Установка CD-ROM», список предшествующих действий: «Снятие крышки корпуса», текст описания последовательности действий. Также после некоторых слов («отвертка», «шлейф питания», «IDE-шину», «4 болта») стоит знак «+», при нажатии на которых появляются разъяснения этих определений. Это продемонстрировано на рис. П.2.4. с описанием всех определений и на рис. П.2.5. с частичным описанием.

Рис П.2.3 Внешний вид страницы действия

Рис. П.2.4. Полное описание определений.

Рис. П.2.5. Частичное описание определений.

Информация была считана из таких видов файлов, как файл описания действия с метками (рис. П.2.6), файл названия вида деятельности (рис П.2.7), файл перечисления действий (рис. П.2.8).

Рис. П.2.6. Файл описания действия под номером 2 с метками.

Рис. П.2.7. Файл названия вида деятельности.

Рис. П.2.8. Файл перечисления действий.

Следующий объект страницы – комикс. Как видно на рис. П.2.3, там изображена последовательность действий, которую должен повторить «картинка в картинку» пользователь для достижения результата. Если нажать на изображение, то подгрузится видео-файл (рис. П.2.9)

Рис. П.2.9. Запуск видео-вложения по нажатию на изображение.

На данном примере был продемонстрирован основной результат работы программы генерации графических текстов.


 

А также другие работы, которые могут Вас заинтересовать

54361. Робота з базою даних в програмі Microsoft Access. Створення форм 955.5 KB
  Мета уроку: навчитись проектуванню баз даних; оформлювати форми додавання в форму елементів керування; введення в форму даних; створення підпорядкованої таблиці в формі; використання проектних технологій у побудові форм; придбання практичних навичок створення форм; формувати навички свідомого планування своєї навчальної діяльності; розвивати: логічне та образного мислення; самостійність у засвоєнні навчального матеріалу; виховувати: впевненість у своїх силах колективізм; естетичність у оформленні форми;...
54362. Мифы Древней Греции. Верования древних греков 40 KB
  Цель: расширить кругозор учащихся; познакомить их с Грецией; рассказать о возникновении древнегреческих мифов, отражении в них представлений греков об окружающем их мире; стимулировать познавательный процесс, развивать коммуникативные способности учащихся; раскрыть потенциальные возможности детей; развивать творческие способности и интерес к литературе; воспитывать у учащихся инициативность в построении совместной учебной деятельности; формировать умение работать в группе.
54363. Мифы Древней Греции. Верования древних греков. Интегрированный урок 4.81 MB
  Мы предлагаем конспект интегрированного урока с использованием информационных и мультимедийных технологий на уроках литературы в 6 классе по теме Мифы Древней Греции. Овладеть знаниями о мифах Древней Греции не посетив страну пусть даже виртуально весьма трудно. Как же можно построить уроки по изучению мифов Древней Греции с использованием информационных и компьютерных технологий По программе на изучение этого...
54364. Свято – урок «Ой хто, хто Миколая любить» 42.5 KB
  Всі річки тепер в обнові біле скло над бережком Ходить зима по діброві застеляє все сніжком. Сніг сідав на усмішки і сміявся з усіма Бо прийшла до нас зима Пісня Зимонька Сорока. Йшла зимонька поміж полями Усміхнулася до зір...
54365. День Святого Миколая - душа весело співає 158 KB
  Хлопчик Краснії подарунки дітям приносить В кожен дім діти знають: з радістю приходить. Звучить чарівна мелодія зявляються дівчаткаянголи які виконують дивовижний танок сповіщаючи прихід Миколая стук у двері до господи входить Святий Миколай Вчитель Діти а хто до нас прийшов Діти Святий Миколай Св. Добрий день вам любі діти Діти Добрий день Св. Бачу ви усі привітні...
54366. Сценарій ранку «Ми чекаємо Святого Миколая» 60 KB
  Ми всі з нетерпінням чекаємо дня Святого Миколая. З лопатами і з піснею Працюємо разом 2куплет: Ми цю пісню будемо співати І всі дружно станем працювати Щоб Миколай прийшов до всіх Приніс дарунків повен міх 1 чортик Ну що ж мене вам не здолати я вам нашлю нову біду Чари мариТепер вас треба всіх розчарувати а для цього треба все про святого Миколая розповісти а ви про нього нічого і не знаєте.
54367. Народні свята. День Святого Миколая 81 KB
  Співом його привітаєм Разом пісню заспіваєм Співають пісню Ой хто хто Миколая любить Ой хто хто Миколая любить Ой хто хто Миколаю служить Тому святий Миколай На всякий час помагай Миколаю Ой хто хто спішить в твої двори Того ти на землі й на морі. Все хорониш від напасти Не даєш му в гріхи впасти Миколаю Ой хто хто к ньому прибігає На поміч його призиває Той все з горя вийде ціло Охоронить душу й тіло Миколаю Миколай молися за нами Благаєм тебе зі сльозами Ми тя будем вихваляти Ім'я твоє величати Миколаю 2...
54368. Свято Миколая 62.5 KB
  Коли святий Миколай З небес на землю йде То кожен дім і школа Мов вулик бджіл гуде. Це Святий Миколай. Як затанцюють за вікном сніжинки І білим килимом укриють край То знай що до Івася і Галинки Святий прибуде з неба Миколай. Я не хочу щоб Святий Миколай приходив до вас хвалив за якісь гарні вчинки дарував вам гостинці.
54369. Свято Василя та Меланки 209.5 KB
  Цього дня батько ховається від своїх дітей за символом багатства та щедрості — за пирогами. Діти повинні вдавати, що в цю мить батька не бачать — так велить традиція. Вони мусять запитувати в матері, де ж тато подівся. А «здивована» мати бажає, аби й наступного року діти за пирогами батька не помітили.