Разработка информационно-справочного ресурса культурно-развлекательного центра "Мистик"
Дипломная работа - Компьютеры, программирование
Другие дипломы по предмету Компьютеры, программирование
?их компонентов моделей, таких как варианты использования, актеры, подсистемы, операции и методы.
Диаграмма состояний является графом специального вида, который представляет некоторый автомат. Вершинами графа являются возможные состояния автомата, изображаемые соответствующими графическими символами, а дуги обозначают его переходы из состояния в состояние. Диаграммы состояний могут быть вложены друг в друга для более детального представления отдельных элементов модели.
Автомат в языке UML представляет собой некоторый формализм для моделирования поведения элементов модели и системы в целом. В метамодели UML автомат является пакетом, в котором определено множество понятий, необходимых для представления поведения моделируемой сущности в виде дискретного пространства с конечным числом состояний и переходов.
Рисунок 4.3 - Диаграмма состояний, выполненная в Rational Rose
Автомат описывает поведение отдельного объекта в форме последовательности состояний, которые охватывают все этапы его жизненного цикла, начиная от создания объекта и заканчивая его уничтожением. Каждая диаграмма состояний представляет некоторый автомат.На рисунке 4.4 представлена диаграмма состояний, наглядно показывающая в каких состояниях может находиться сайт если заходит администратор.
Рисунок 4.4 - Диаграмма состояний, выполненная в Rational Rose, для варианта использования администратором
5. РЕАЛИЗАЦИЯ ИНФОРМАЦИОННОГО РЕСУРСА
.1 Разработка информационного ресурса
Разработка Интернет-ресурса начинается с создания главной страницы.
Администратор Интернет-ресурса имеет непосредственный доступ к коду ресурса.
При нажатии на логотип КРК Мистик происходит анимация входа на сайт, с последующим переходом на выбранную страницу.
Анимация входа на ресурс управляется следующим скриптом:
$(document).ready(function(){
$curtainopen = false;
$(".logo2").click(function(){
$(this).blur();($curtainopen == false){
$(this).stop().animate({},{queue:false, duration:350, easing:easeOutBounce});
$(".leftcurtain").stop().animate({width:60px}, 2000 );
$(".rightcurtain").stop().animate({width:60px},2000 );
$curtainopen = true;(function() { document.location.href="main.php"; }, 2000);
}false;});
Рисунок 5.1 - Анимация входа
Рисунок 5.2 - Блок-схема работы скрипта входа на сайт
На главной странице ресурса существует быстрый доступ к основным страницам ресурса. Переход происходит так же при помощи скрипта входа анимации. Так же присутствует анимация на самих кнопках входа на ресурс, которая управляется при помощи кода CSS.
CSS не активной ссылки:
.restoran{position: absolute;: 80%;: -95px;image:url(images/index/restoran2.png);: 200px;: 138px;index: 4;}активной ссылки:
.restoran:hover{position: absolute;: 80%;left: -45px;image:url(images/index/restoran.png);width: 200px;height: 138px;}
При выполнении данного CSS кода происходит смена изображения и изменение его позиции с дальнейшим переходом по ссылке.
Рисунок 5.3 - Кнопки быстрого доступа
Рисунок 5.4 - Принципиальная схема работы CSS кода на кнопки
На каждой странице ресурса устанавливается свой индивидуальный фон, подходящий под основной фон помещения, который он описывает. Установка фона на главной странице происходит посредством следующего тега:
">="background:#0c0d0f url(images/bg/1.png) repeat;">
Для последующих страниц меняется только путь к фоновому изображению.
Рисунок 5.5 - Блок-схема установки фонового изображения
Навигационное меня выполнено в виде набора тегов .
Структура HTML кода для меню используется стандартная для таких случаев:
После чего необходимо написание CSS стилей для меню.
Выполняется сброс для элемента ul:
#menu, #menu ul {margin: 0;padding: 0;list-style: none;}
Элемент #menu является основным для меню. Градиенты, тени и скругленны