Documentation
Total Page:16
File Type:pdf, Size:1020Kb
Visoka skola strukovnih studija za informacione i komunikacione tehnologije Predmet: Web programiranje Dokumentacija http://aleksajovanovic.com/sites/steelpanther/ Student: Aleksa Jovanovic Broj indeksa: 179/15 Smer: Internet tehnologije-Web programiranje Contents 1.Uvod ........................................................................................................................................................... 3 a) Korisceni programski jezici. .................................................................................................................... 4 b) Opis funkcionalnosti sajta ...................................................................................................................... 4 c) Template ................................................................................................................................................ 4 d) CSS ...................................................................................................................................................... 14 2. Organizacija ............................................................................................................................................. 15 2.1 Organizaciona sema ........................................................................................................................... 15 2.2 Sitemap.xml ....................................................................................................................................... 15 2.3 Slike stranica i opisi funkcionalnosti .................................................................................................... 18 2.3.1 index.html .................................................................................................................................... 18 2.3.2 tourdates.html ............................................................................................................................. 19 2.3.3 gallery.html .................................................................................................................................. 20 2.3.4 contact.html ................................................................................................................................ 21 2.3.5 aboutband.html ........................................................................................................................... 22 2.3.6 aboutautor.html .......................................................................................................................... 23 2.3.7 register.html ................................................................................................................................ 24 2.3.8 search.html .................................................................................................................................. 25 ............................................................................................................................................................. 25 3. Kodovi ...................................................................................................................................................... 26 3.1 Index ................................................................................................................................................... 26 3.1.1 html.............................................................................................................................................. 26 3.1.2 CSS. .............................................................................................................................................. 37 3.1.3 Responsive.css. ............................................................................................................................ 60 3.1.4 main.js. ........................................................................................................................................ 84 3.1.5 home.js ........................................................................................................................................ 96 3.2 Tourdates ......................................................................................................................................... 100 3.2.1 tourdates.html ........................................................................................................................... 100 3.2.2 tourdates.js ................................................................................................................................. 110 3.3 Gallery ............................................................................................................................................... 111 3.3.1 gallery.html ................................................................................................................................. 111 3.3.2 CSS ............................................................................................................................................ 124 3.3.3 simple-lightbox.js ....................................................................................................................... 134 3.4 Contact ............................................................................................................................................. 146 3.4.1 contact.html .............................................................................................................................. 146 3.4.2 contact.js .................................................................................................................................... 157 3.5 About band ....................................................................................................................................... 159 3.5.1Aboutband.html ......................................................................................................................... 159 3.6. About autor ...................................................................................................................................... 171 3.6.1 aboutautor.html .......................................................................................................................... 171 3.6.2 aboutautor.js ............................................................................................................................. 183 3.7 Register ............................................................................................................................................ 184 3.7.1 register.html............................................................................................................................... 184 3.7.2 register.js ................................................................................................................................... 194 3.8 Search .............................................................................................................................................. 196 3.8.1 search.html ................................................................................................................................ 196 3.8.2 search.js ..................................................................................................................................... 206 1.Uvod a) Korisceni programski jezici: HTML, CSS, JavaScript, jQuery, Ajax, XML, XSL i JSON. b) Opis funkcionalnosti sajta: Pretraga najnovijih desavanja kojoj se moze pristupiti sa bilo koje stranice korisceni su AJAX i JSON. Dropdown meni izradjen pomocu Jquery-a Prikaz podataka iz XML-a sa paginacijom Prikaz podataka iz JSON fajla. c) Template Navigacija Div u kome se nalazi video Div u kome se nalaze dva manja diva a u njima neki text Div u kome se nalazi manji slider Footer <!DOCTYPE html> <html> <head> <link rel="stylesheet" type="text/css" href="stil.css"/> <link rel="shortcut icon" type="image/x-icon" href="slike/steelpanther.ico" /> <link rel="stylesheet" type="text/css" href="responsive.css" media="screen"/> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Steel Panther</title> <meta name="keywords" content="SeelPanther,steelpanther,steel,panther,heavyMetalBand,heavyMetal,Heavy,Metal,Glam,Gla mMetalBand,GlamMetal"/> <meta name="copyright" content="Steel Panther 2016"/> <meta name="description" content="Welcome to Steel Panther site.This site was created by their fan in the purpose of learning Javascript,AJAX,Jquery,JSON"/> <meta name="author" content="Jovanovic Aleksa"> <meta charset="UTF-8"> <script src="scripts/main.js"></script> <script src="scripts/home.js"></script> </head> <body> <div id="container"> <div id="rate-us-container"> <span id="smiley-container"> <p>Rate our site!</p> <span class="smiley"></span> <hr> <span class="smiley"></span> <hr> <span class="smiley"></span> </span> <span id="vote-button">+</span> </div> <div id="login-box-container" class="SakrijSe"> <div id="login-box-content"> <span>Log in</span> <span class="closeBox">x</span> <form action="" id="formLoganje"name="formaLogin" method="post"> <input type="text" name="usernameLog" id="usernameLog"placeholder="Username"/> <input type="password" name="passwordLog" id="passwordLog" placeholder="Password"/> <input type="button" name="login-button" id="login-button" value="LOG IN"/> </form> <p><a href="register.html">Dont have an account?</a></p> </div> </div> <div id="menu-container"> <div id="logo"> <a href="index.html"><img