Програмне забезпечення мереж передачі даних

МІНІСТЕРСТВО ОСВІТИ І НАУКИ, МОЛОДІ ТА СПОРТУ УКРАЇНИ ЧЕРКАСЬКИЙ ДЕРЖАВНИЙ ТЕХНОЛОГІЧНИЙ УНІВЕРСИТЕТ Кафедра Інформаційних технологій проектування Курсова робота

«Програмне забезпечення мереж передачі даних»

Черкаси 2011р.

1 Скрипт — що це таке Як правило, скриптом називається программа або програмний файл-сценарій. Іншими словами, то скриптом буде називатися практично будь-яка виконувана процедура. Якщо говорити про Інтернет-технології, то поняття «скрипт» вже в декілька разів звужується і його можна охарактеризувати, як виконувану процедуру, написаної на будь-якій мові, яка запускається на виконання з боку сервера за запитом надісланої з конкретно визначеної веб-сторінки.

Сфера застосування скриптів величезна. Наприклад:

— за їх допомогою користувач отримує можливість звертатися до баз даних;

— спостерігати статистику відвідувань (лічильники відвідуваності);

— здійснювати записи в гостьових книгах;

— залишати коментарі до вподобаним статтями;

— на скриптах засновані всі cms (програмне забезпечення для керування змістом) і форуми;

— скрипти допомагають динамічному відображенню веб-сайту;

— скрипти дозволяють організувати змінювати частини сайту без перевантаження всієї сторінки і т.д.

Розташування виконуваного скрипта в мережі може бути різним. Наприклад, скрипт може розташовуватися на тому ж сервері, де розташована викликаюча його сторінка. Як варіант — скрипт розміщується на іншому, тобто віддаленому, www-сервері. Оскільки за допомогою запуску скрипта «десь там» відбувається виконання будь-які дії, то треба завжди пам’ятати, що така процедура може бути незавжди корисною (тобто це небезпечно для власника сервера). Зокрема, з цієї причини, не на всіх серверах дозволяється виконання скриптів — зазвичай провайдери спеціально обумовлюють умови надання такої можливості.

Оскільки скрипти на сьогоднішній день присутні майже на всіх веб-сайтах, то часто виникає зацікавленість в тому, як саме виглядає скрипт, та як вони працюють взагалі. Для цікавості достатньо відкрити висхідний код будь-якої веб-сторінки і на тому масці, де повинна розміщуватися та або інша форма, знайти посилання «cgi-bin». З цього випливає, що CGI-скрипт — це програма, яка виконується на веб-сервері за запитом клієнта. Клієнтом, в даному випадку, виступає не хто інший, як відвідувач веб-сайту. Впринципі, можна стверджувати, що будучи програмою, CGI-скрипт нічим не відрізняється від, скажімо, MS Word або того ж Explorera. Дуже важливо відразу усвідомити, що CGI — це не мова програмування, на якому пишеться сам скрипт, а всього лише спеціалізований інтерфейс, за допомогою якого провокується запуск скрипта і проводиться подальша робота.

скрипт інтернет сайт event

2 Обробник подій. Об'єкт Event — клавіатура

JavaScript підтримує відстеження деяких змін і дій користувача на сторінці. Кожна така зміна або дія породжує подію, яку програміст може перехопити і виконати якісь необхідні дії. Прикладами подій — клік миші на елементі сторінки, отримання фокусу введення елементом форми, закінчення завантаження або вивантаження сторінки.

Список подій, доступних в кожному окремому браузері зазвичай можна дізнатися на сайті компанії-розробника або в довідковій документації. Список основних обробників визначений стандартом W3C, але кожен розробник браузера може сам додавати обробники за своїм бажанням. Наприклад, подія onAbort підтримується IE, але не є стандартним і не підтримується браузерами Netscape.

У перших версіях браузерів веб-програмісти могли оперувати лише з невеликими наборами подій для кожного типу відображуваних елементів, але в останніх версіях можна призначити події практично будь-якого елементу сторінки.

Найбільш відомими та корисними є події клавіатури:

— onKeyDown ();

— onKeyPress ();

— onKeyUp ().

Синтаксис відповідно такий:

boolean onKeyDown (Event об'єкт, int клавіша);

boolean onKeyPress (Event об'єкт, int клавіша);

boolean onKeyUp (Event об'єкт, int клавіша);

Тут параметр об'єкт описує подію, а клавіша містить код натисненої клавіші.

3. Практична частина

3.1 Постановка задачі

Створити web-сайт «Armin Van Buuren — A State Of Trance». Сайт повинен містити наступні пункти: Main, Event, Animation, Data, User Object, Games, Keybord Event, Forma.

Для кожного пункту меню виконати наступні дії:

Main — створити сценарій для оновлення web-сайту;

Event — написати сценарій з використанням об'єкта event;

Animation — створити анімацію засобами JavaScript;

Data — засобами JavaScript створити об'єкт що відображае дату;

User Object — створити об'єкт користувача;

Games — створити логічний сценарій (тест, гра тощо) реалізований з використанням PHP чи скриптів;

Keybord Event — написати сценарій з використанням об'єктy Keybord Event;

3.2 Інструкція користувача Для запуску сайту слід обрати файлу index.html. В результаті цього відкриється головне вікно Рисунок 1

Рис 1 — «Головна сторінка»

Для переміщення по сайту використовуються Flash-кнопки, рисунок 2:

Рис. 2 — «Flash-кнопки»

Кнопка «Main» — обновити сторінку, незалежно від того, яким браузером відкрите вікно.

Кнопка «Animation» відкриває вікно, в якому показані фотографії виступу Armin Van Buuren.

Кнопка «Event» відкриває вікно з фотографією резидента. В цьому вікні робота з Event полягає в наступному: при натиску мишкою в будь-якому місці фотографії - виводиться повідомлення з координатами точки, в якій був здійснений клік.

В даній курсовій роботі виконана робота з Event, де відбувається зчитування інформації введеної з клавіатури.

Кнопка «Game» пропонує гру на швидкість проходження шляху. Необхідно чоловічком пройти траєкторію, якомога швидше, і таким чином встановлювати для себе рекордний час.

Кнопка «User object» відкриває вікно, в якому відображається тур трансового резидента по Україні.

3.3 Лістинг програми

3.3.1 Головна сторінка

.style1 {

font-family: "Times New Roman" , Times, serif;

font-weight: bold;

}

—>

AC_FL_RunContent ('codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0','width','100','height','22','title','Main','src','button1','quality','high','pluginspage','http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash','bgcolor','','movie','button1'); AC_FL_RunContent( 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0','width','100','height','22','src','button2','quality','high','pluginspage','http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash','bgcolor','','movie','button2' ); //end AC code AC_FL_RunContent ('codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0','width','100','height','22','src','button4','quality','high','pluginspage','http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash','movie','button4'); //end AC code AC_FL_RunContent( 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0','width','100','height','22','src','button6','quality','high','pluginspage','http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash','movie','button6' ); //end AC code AC_FL_RunContent ('codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0','width','100','height','22','src','button9','quality','high','pluginspage','http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash','bgcolor','','movie','button9'); //end AC code AC_FL_RunContent( 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0','width','100','height','22','src','button10','quality','high','pluginspage','http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash','movie','button10' ); //end AC code AC_FL_RunContent ('codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0','width','100','height','22','src','button12','quality','high','pluginspage','http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash','movie','button12'); //end AC code AC_FL_RunContent( 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0','width','100','height','22','src','button13','quality','high','pluginspage','http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash','movie','button13' ); //end AC code
	Самые свежие новинки Check Armin's channel on Spotify   Spotify в слово ! Будущее музыки лежит в новых media. Если вы хотите слушать на полной правовой базе,и не отставать от новых треков играющих в лучшем ридошоу Армина A state of Trance, cлушать его альбомы,компиляции,ремиксы и избранные треки Armada, для этого вам всего лишь нужно подписаться на канал Armin'a на радио Spotify ! Хотите скачать понравившиеся вам треки с лушать их снова и снова, то вы можете скачать их прямо от туда! Подписаться на будущее танцевальной музыки можно прямо сейчас! Проверить можно прямо сейчас на: arminradio.com Убедитесь что вы проверили канал Armin'a так же на: armadamusicradio.com. Win a VIP trip to Armin's show in Istanbul!   После поездок в Москву, Санкт-Петербург, Мельбурн, Киев и Утрехт, KLM теперь приглашает всех поклонников Армина на его шоу в Стамбуле! 2-ого июля Армин будет играть в парке Kucufciftlik в Стамбуле. Хотите выиграть путёвку ? в которую входит, Турецкое лечение,остановка в отеле Renaissance Polat на 3 ночи,билет на концерт, массажи , сауны и т.д, тогда примите участие в конкурсе. Всем поклонникам Армина кому 18+ можно войти в тотализатор ,который заканчивается 18 июня. Поторопитесь,заходите на специальный сайт KLM website и вступайте.

3.3.2 Анімація

" http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >

pictures = new Array()

for(i=0;i<4;i++)

{

pictures[i] = new Image()

if(i==0) pictures[i]. src = "pic/1.jpg"

if(i==1) pictures[i]. src = "pic/2.jpg"

if(i==2) pictures[i]. src = "pic/3.jpg"

if(i==3) pictures[i]. src = "pic/4.jpg"

}

n=1;

flag=1;

function scroll_image()

{

if(flag==1)

{

n++;if(n>3) n=0;

document.images[0]. src = pictures[n]. src

}

setTimeout(" scroll_image()" ,2000);

}

vlink="#A52A2A" onLoad=scroll_image()>

AC_FL_RunContent ('codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0','width','100','height','22','src','button5','quality','high','pluginspage','http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash','movie','button5'); //end AC code

3.3.3 Об'єкт event (виведення координат точки)

CONTENT="text/html; charset=windows-1251″ >

body {

background-color: #CCFFCC;

}

—>

AC_FL_RunContent ('codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0','width','100','height','22','align','left','src','button3','quality','high','pluginspage','http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash','bgcolor','#3333FF','movie','button3'); //end AC code

3.3.4. Об'єкт event (читання з клавіатури)

" http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >

document.onkeydown = checkKeycode

function checkKeycode(e) {

var keycode;

if (window.event) keycode = window.event.keyCode;

else if (e) keycode = e.which;

alert(" keycode: " + keycode);}

3.3.5. Гра

MAPPICS = new Array (

" Air. gif", «Ground_mid.gif», «Ground_top.gif», «Ground_narrow.gif» ,

" Ground_down.gif", «Ground_up.gif», «River.gif», «Start.gif», «Goal.gif» ,

" WorpZone. gif", «Spring_extend.gif», «Spring_shrink.gif»

);

var MAP = new Array (

" 2 111 111″ ,

" 72 111 111″ ,

" 4 111 111″ ,

" 411 111″ ,

" 41 111″ ,

" 2 004 111″ ,

" 2 000 411″ ,

" 2 000 021″ ,

" 2″ ,

" 2 000 000 002″ ,

" 2 000 002 002″ ,

" 2 000 002 002″ ,

" 2 020 000 006″ ,

" 20 000 006″ ,

" 20 000 002″ ,

" 2″ ,

" 2″ ,

" 2″ ,

" 21 111 111″ ,

" 2″ ,

" 2″ ,

" 21 111 132″ ,

" 21 111 132″ ,

" 21 111 132″ ,

" 2″ ,

" 2″ ,

" 502″ ,

" 5 102″ ,

" 51 102″ ,

" 511 102″ ,

" 5 111 102″ ,

" 51 111 102″ ,

" 21 111 102″ ,

" 2″ ,

" 1 111 111 102″ ,

" 2″ ,

" 2″ ,

" 2″ ,

" 202 020 021″ ,

" 202 020 021″ ,

" 202 020 021″ ,

" 292 020 002″ ,

" 211 020 002″ ,

" 211 020 002″ ,

" 20 002″ ,

" 1 111 320 006″ ,

" 20f06″ ,

" 00g06″ ,

" 6″ ,

" 500 002″ ,

" 5 100 002″ ,

" 2 000 202″ ,

" 51 000 202″ ,

" 20 000 202″ ,

" 20 000 002″ ,

" 20 002″ ,

" 20 002″ ,

" 6″ ,

" 82 111 111″ ,

" 2 111 111″

);

MapPoint = 0;

SpNum = 0;

SpX = new Array (2);

SpY = new Array (2);

FloatRNum = 0;

FltRX = new Array (2);

FltRY = new Array (2);

document.write («

+ MapPoint + «px; Z-index:0″ >»);

for (i = 0; i < 10; i++){

document.write (««);

for (j = 0; j < 60; j++){

if ((p = MAP[j]. charAt (i)) == 's'){

p = 0;

SpX[SpNum] = j * 32;

SpY[SpNum] = i * 32;

SpNum++;

}

if (p == 'f' || p == 'g'){

p = 0;

FltRX[FloatRNum] = j * 32;

FltRY[FloatRNum] = i * 32;

FloatRNum++;

}

document.write («

}

document.write («

«);

}

document.write («

«);

for (i = 0; i < SpNum; i++){

if (!i) str = «SPRING1» ;

else str = «SPRING2» ;

document.write («

document.write («style="position: absolute; top: »

+ SpY[i] + «px; Left: » + SpX[i] + «px; Z-index:1» «);

document.write («src=»" + MAPPICS[10] + «» width=32 height=32>");

}

for (i = 0; i < FloatRNum; i++){

if (!i) str = «FLOAT1» ;

else str = «FLOAT2» ;

document.write («

document.write («style="position: absolute; top: »

+ FltRY[i] + «px; Left: » + FltRX[i] + «px; Z-index:1» «);

document.write («src=»" + MAPPICS[2] + «» width=32 height=32>");

}

BOYPICS = new Array (

" BoyRightStop. gif", «BoyRightRun1.gif», «BoyRightRun2.gif» ,

" BoyNarrowRight1. gif", «BoyNarrowRight2.gif» ,

" BoyLeftRun1. gif", «BoyLeftRun2.gif» ,

" BoyNarrowLeft1. gif", «BoyNarrowLeft2.gif»

);

RPICS = new Array («RStop.gif», «RRun1.gif», «RRun2.gif», «RNarrow1.gif», «RNarrow2.gif»);

BoyPoint = new Array (0, 64);

RPoint = new Array (8, 64);

document.write («

document.write («style="position: absolute; top: »

+ BoyPoint[1] + «px; Left: » + BoyPoint[0] + «px; Z-index:3» «);

document.write («src=»" + BOYPICS[0] + «» width=32 height=32>");

document.write («

document.write («style="position: absolute; top: »

+ RPoint[1] + «px; Left: » + RPoint[0] + «px; Z-index:2» «);

document.write («src=»" + RPICS[0] + «» width=32 height=32>");

document.write («

");

for (i = 1; i < 9; i++) document. write («

for (i = 1; i < 5; i++) document. write («

document.write («

document.write («

«);

document.write («

");

document.write («

«);

document.write («

«);

document.write («

");

document.write («

«);

document.write («

«);

// —>

3.4 Результати роботи програми Рис. 3 — «Головна сторінка»

Рис. 4 — «Дата»

Рис. 5 — «Об'єкт користувача»

Рис. 6 — «Гра»

Рис. 7 — «Результат гри»

Рис. 8 — «XML»

Рис. 9 — «Подія Event — клавіатура»

Висновки В даній курсовій роботі використовуються об'єкт Event (при натисненні лівою кнопкою миші в будь-якій частині малюнку виводяться координати даної точки. Виконується зчитування інформації з клавіатури.

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

З правилами користування сайтом можна ознайомитись в даній курсовій роботі в розділі «Інструкція користувача».

Використані джерела

1. Джексон Кренфорд Тиге. DHTML и CSS для Internet, 3-е издание.Пер. с англ.: М.: «NT Press», 2005.-518c.

2. Дронов, В.А. JavaScript в Web — дизайне

3. Монкур, Майкл. Освой самостоятельно JavaScript за 24 часа, 2-е издание.: Пер. с англ.: М.: Издательский дом «Вильяме», 2001. — 320с.

Показати весь текст Вартість унікальної роботи