Kilka słów o JavaScript

Paweł Mleczko

2017-12-13

Plan wykładu

Jak działa internet (update)

Omówimy dokładniej (choć dalej ogólnie i schematycznie) zasadę działania internetu.

Front-end vs Back-end

  • Front-end – to co działa po stronie użytkownika (przeglądarki), np. html, CSS, JavaScript

  • Back-end – to co działa na serwerze, np. PHP, Node.js

Dlaczego nie wszystko można zrealizować back-endem?

Link do pliku

JavaScript

Najważniejsze narzędzie front-endowe

Internet

Protokół HTTP

HTTP – (ang. Hypertext Transfer Protocol*) - protokół (metoda, zasada) przesyłania dokumentów siecią internet od serwera do odbiorcy.

  • zasada działania – klient (przeglądarka internetowa) wysyła żadanie (request) do klienta i otrzymuje odpowiedź (response)

  • informacja jest otrzymywana (ang. pull) na żądanie klienta

Etapy działania

Na przykład:

  • wpisanie adresu do przeglądarki

  • przeglądarka tworzy zapytanie (request), które wysyłane jest do serwera

  • serwer interpretuje zapytanie

  • serwer udziela odpowiedzi

  • przeglądarka interpretuje odpowiedź

Protokół HTTPS

  • Szyfrowana wersja protokołu HTTP.

  • Do obsługi potrzebny certyfikat (darmowy lub płatny)

URL

  • URL (ang. uniform resource locator) – ujednolicony sposób formatowani adresów

protokół://nazwa_hosta:port/ścieżka_dostępu do_zasobów (port jest opcjonalny)

na przykład: http://amu.edu.pl/dzialalnosc/o-uam

  • http – typ protokołu

  • amu.edu.pl – nazwa hosta (domeny, adres ip serwera: 150.254.65.253)

  • dokument o-uam w katalogu dzialalnosc

Jak wygląda typowe zapytanie?

Metoda GET

GET /resources HTTP/1.1


Host: host_name

Odpowiedź serwera



nagłówek




(pusta linia)




treść

Przykład

http://amu.edu.pl/dzialalnosc/o-uam

GET /dzialalnosc/o-uam HTTP/1.1


Host: amu.edu.pl


Connection: keep-alive


Upgrade-Insecure-Requests: 1


User-Agent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/62.0.3202.94 Safari/537.36


Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8


Referer: http://amu.edu.pl/dzialalnosc/o-nas


Accept-Encoding: gzip, deflate


Accept-Language: pl-PL,pl;q=0.9,en-US;q=0.8,en;q=0.7


Cookie: SQ_SYSTEM_SESSION=fblbfcktk2658q9etl4eg5b654net9r47etei9u52vv363unb7k1er0bab4r5idg2hspr7pb6sce1o7aa2j1k7pfc9ifas3unf8a3e0; _ga=GA1.3.1930156859.1436796473; _gid=GA1.3.69981698.1513080800; _gat=1

Odpowiedź serwera (nagłówek)

HTTP/1.0 200 OK


Server: nginx/1.8.0


Date: Tue, 12 Dec 2017 08:52:02 GMT


Content-Type: text/html; charset=utf-8


X-Content-Type-Options: nosniff


Pragma: cache


Cache-Control: max-age=600, s-maxage=86400, public


Expires: Tue, 12 Dec 2017 09:02:02 GMT


Last-Modified: Tue, 12 Dec 2017 06:46:43 GMT


Age: 12544


X-Cache: HIT from rekrutest.amu.edu.pl


X-Cache-Lookup: HIT from rekrutest.amu.edu.pl:80


Via: 1.0 rekrutest.amu.edu.pl (squid/3.1.23)


Connection: close

Odpowiedź serwera (treść)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">


<html xmlns="http://www.w3.org/1999/xhtml">


<head>


<meta name="author" content="pw" />


<meta http-equiv="Content-type" content="text/html;charset=UTF-8" />


<meta name="norton-safeweb-site-verification" content="r444b8m3hyma4t6qh8zxcx-2pu83cbqyghvi61-39nn37wgjewz69dhxrp3vrcdwqx8pvj2niej7hn5vbbywgzq2sij9qqj6u3t-7q1c5a39b0i8bpl1y5y7f77iv1k9" />


<link href="/__data/assets/text_file/0012/42600/uam_main.css?v=0.0.38" rel="stylesheet" type="text/css" />


<style type="text/css" media="all">


body { background: #d7d7d7;}


#kontener_tlo { background: url('/__data/assets/image/0017/7820/all_background_01.jpg?v=0.1.8') no-repeat top center; }


#kontener_tlo_2 { background: url('/__data/assets/image/0003/9561/all_background_02.jpg?v=0.1.2') repeat-y top center; }


#stopka{background: #d7d7d7 url('/__data/assets/image/0018/7821/all_background_03.jpg?v=0.1.11') no-repeat center top;}


</style>






                                    <link rel="stylesheet" type="text/css" href="https://amu.edu.pl/__data/assets/file/0005/259781/uam_portal_uam.css?v=0.1.31" media="all" />








                                    <link rel="stylesheet" type="text/css" href="https://amu.edu.pl/__data/assets/file/0006/173733/jquery.fancybox-1.3.1.css?v=0.1.6" media="screen" />




<link rel="icon" type="image/png" href="/__data/assets/image/0003/16293/uam_favicon.png?v=0.1.6"/>




<title>Portal UAM - O UAM</title>






                        <meta name="google-site-verification" content="ZYHDnRwpJHw92UhRmbpXH8XwXIUxMJo7N6r8JABSPJA" />




<!--


  Running Squiz Matrix


  Developed by Squiz - http://www.squiz.net


  Squiz, Squiz Matrix, MySource, MySource Matrix and Squiz.net are registered Trademarks of Squiz Pty Ltd


  Page generated: 12 December 2017 09:52:01


-->








</head>


<body>


<!-- js first loaded -->


<script type="text/javascript" src="/__data/assets/file/0007/173635/jquery-min.js?v=0.0.3"></script>


<script type="text/javascript" src="/__data/assets/file/0009/173637/jquerylightbox-05pack.js?v=0.0.3"></script>


<script type="text/javascript" src="/__data/assets/file/0010/173638/jquerynoConflict.js?v=0.0.3"></script>






                        <script type="text/javascript">


$j(document).ready(function(){


 $j("#i321870").addClass("menu_podkreslenie");


 $j("#i30741").addClass("menu_podkreslenie");


 $j("#i181686").addClass("menu_podkreslenie");


 $j("#i276549").addClass("menu_podkreslenie");


 $j("#i283986").addClass("menu_podkreslenie");


 $j("#i20637").addClass("menu_podkreslenie");


});


</script>








                        <script>


  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){


  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),


  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)


  })(window,document,'script','//www.google-analytics.com/analytics.js','ga');




  ga('create', 'UA-49359701-1', 'amu.edu.pl');


  ga('send', 'pageview');




</script>








                        <!-- FB -->


<div id="fb-root"></div>


<script>(function(d, s, id) {


  var js, fjs = d.getElementsByTagName(s)[0];


  if (d.getElementById(id)) return;


  js = d.createElement(s); js.id = id;


  js.src = "//connect.facebook.net/pl_PL/all.js#xfbml=1&appId=539072972854242";


  fjs.parentNode.insertBefore(js, fjs);


}(document, 'script', 'facebook-jssdk'));</script>




<div id="kontener_tlo_2">


<div id="kontener_tlo">


<div id="kontener_glowny">


<!--[if lt IE 7]>


<div id="ie6Warning">


<p>Uwaga! W Twoim systemie zainstalowana jest nieaktualna wersja przeglądarki Internet Explorer. Nasza strona do prawidłowego działania wymaga obecności w systemie Internet Explorera w wersji 7 lub <a href="http://www.microsoft.com/windows/downloads/ie/getitnow.mspx">nowszej</a>. Możliwe jest również skorzystanie z przeglądarek <a href="http://www.getfirefox.com/">Firefox</a>, <a href="http://www.opera.com/">Opera</a>, <a href="http://www.apple.com/safari/">Safari</a> czy <a href="http://www.google.com/chrome">Google Chrome</a>.</p>


</div>


<![endif]-->


<div id="wrapper_pasek_gorny">


<div id="pasek_gorny">


<div id="pasek_gorny_lewy">


<a href="http://international.amu.edu.pl/">English</a>


 <a href="http://www.chinese.amu.edu.pl/">汉语</a>


</div><!-- end div#pasek_gorny_lewy -->




<div id="pasek_gorny_prawy">






                        <a href="//amu.edu.pl/kontakt">Kontakt</a>


</div><!-- end div#pasek_gorny_prawy -->




<div id="pasek_gorny_srodek">






                        <a href="//bip.amu.edu.pl">BIP</a>


 | <a href="//amu.edu.pl/mapa-serwisu">Mapa strony</a>


 | <a href="http://eduroam.amu.edu.pl/">Wi-Fi</a>


</div><!-- end div#pasek_gorny_srodek -->


</div><!-- end div#pasek_gorny -->


</div><!-- end div#wrapper_pasek_gorny -->




<div id="wrapper_grafika_wizerunkowa">


<a href="http://amu.edu.pl"><div id="grafika_wizerunkowa">


</div></a><!-- end div#grafika_wizerunkowa -->


</div><!-- end div#wrapper_grafika_wizerunkowa -->




<div id="wrapper_menu_portali">


<div id="menu_portali">






                        <a href="https://amu.edu.pl"><img alt="Strona Główna UAM" src="https://amu.edu.pl/__data/assets/image/0007/318679/uam_menu_portali_bttn_2017.jpg"></a><a href="//kandydaci.amu.edu.pl"><img alt="Portal Kandydata" src="https://amu.edu.pl/__data/assets/image/0009/13230/kandydat_menu_portali_bttn.jpg"></a><a href="https://studenci.amu.edu.pl"><img alt="Portal Studenta" src="https://amu.edu.pl/__data/assets/image/0011/13232/student_menu_portali_bttn.jpg"></a><a href="https://doktoranci.amu.edu.pl"><img alt="Portal Doktoranta" src="https://amu.edu.pl/__data/assets/image/0013/125500/doktorant_menu_portali_bttn.jpg"></a><a href="https://pracownicy.amu.edu.pl"><img alt="Portal Pracownika" src="https://amu.edu.pl/__data/assets/image/0010/13231/pracownik_menu_portali_bttn.jpg"></a><a href="https://absolwenci.amu.edu.pl"><img alt="Portal Absolwenta" src="https://amu.edu.pl/__data/assets/image/0003/15996/absolwent_menu_portali_bttn.jpg"></a>


<img src="/__data/assets/image/0020/10946/spacer25h.gif?v=0.1.5" />


</div><!-- end div#menu_portali -->


</div><!-- end div#wrapper_menu_portali -->


<div class="float_clear"></div>




<div id="wrapper_zawartosc">


<div id="wrapper_menu_lewy">


<div id="menu_lewy_portal">




<!-- BEGIN LEVEL 1 -->














    <div id="i13391" name="Menu Uniwersytet" class="kolor_portalu_tlo odstepy_level1">Uniwersytet</div>


<!-- BEGIN LEVEL 2 -->




    <ul title="Menu Uniwersytet">


          <li id="i28408" class="menu_level2 current">


     <a name="http://amu.edu.pl/dzialalnosc/o-uam" class="odstepy_level2" href="http://amu.edu.pl/dzialalnosc/o-uam">


     O UAM</a>


     </li>


          <li id="i28821" class="menu_level2 ">


     <a name="http://amu.edu.pl/dzialalnosc/badania-naukowe" class="odstepy_level2" href="http://amu.edu.pl/dzialalnosc/badania-naukowe">


     Badania naukowe</a>


     </li>


          <li id="i31811" class="menu_level2 ">


     <a name="http://amu.edu.pl/dzialalnosc/ksztalcenie" class="odstepy_level2" href="http://amu.edu.pl/dzialalnosc/ksztalcenie">


     Kształcenie</a>


     </li>


          <li id="i31815" class="menu_level2 ">


     <a name="http://amu.edu.pl/dzialalnosc/relacje-z-otoczeniem" class="odstepy_level2" href="http://amu.edu.pl/dzialalnosc/relacje-z-otoczeniem">


     Relacje z otoczeniem</a>


     </li>


          <li id="i321870" class="menu_level2 ">


     <a name="http://amu.edu.pl/dzialalnosc/hr-excellence-in-research" class="odstepy_level2" href="http://amu.edu.pl/dzialalnosc/hr-excellence-in-research">


     HR Excellence in Research</a>


     </li>


          <li id="i44253" class="menu_level2 ">


     <a name="http://amu.edu.pl/dzialalnosc/struktura" class="odstepy_level2" href="http://amu.edu.pl/dzialalnosc/struktura">


     Struktura organizacyjna UAM</a>


     </li>


          <li id="i1559" class="menu_level2 ">


     <a name="http://amu.edu.pl/dzialalnosc/wydzialy" class="odstepy_level2" href="http://amu.edu.pl/dzialalnosc/wydzialy">


     Wydziały</a>


     </li>


          <li id="i30741" class="menu_level2 ">


     <a name="http://amu.edu.pl/dzialalnosc/biblioteki" class="odstepy_level2" href="http://amu.edu.pl/dzialalnosc/biblioteki">


     Biblioteki</a>


     </li>


          <li id="i8203" class="menu_level2 ">


     <a name="http://amu.edu.pl/dzialalnosc/ksiazka-adresowa" class="odstepy_level2" href="http://amu.edu.pl/dzialalnosc/ksiazka-adresowa">


     Książka adresowa</a>


     </li>


          <li id="i30814" class="menu_level2 ">


     <a name="http://amu.edu.pl/dzialalnosc/mediow" class="odstepy_level2" href="http://amu.edu.pl/dzialalnosc/mediow">


     Informacje dla mediów</a>


     </li>


          <li id="i126136" class="menu_level2 ">


     <a name="http://amu.edu.pl/dzialalnosc/system-identyfikacji-wizualnej" class="odstepy_level2" href="http://amu.edu.pl/dzialalnosc/system-identyfikacji-wizualnej">


     System Identyfikacji Wizualnej</a>


     </li>


          <li id="i181686" class="menu_level2 ">


     <a name="http://amu.edu.pl/dzialalnosc/promocja-i-marketing" class="odstepy_level2" href="http://amu.edu.pl/dzialalnosc/promocja-i-marketing">


     Promocja i marketing</a>


     </li>


          <li id="i247243" class="menu_level2 ">


     <a name="http://amu.edu.pl/dzialalnosc/newsletter-krasp" class="odstepy_level2" href="http://amu.edu.pl/dzialalnosc/newsletter-krasp">


     KRASP</a>


     </li>


          <li id="i126139" class="menu_level2 ">


     <a name="http://amu.edu.pl/dzialalnosc/fundacja-uam" class="odstepy_level2" href="http://amu.edu.pl/dzialalnosc/fundacja-uam">


     Fundacja UAM</a>


     </li>


          <li id="i224170" class="menu_level2 ">


     <a name="http://amu.edu.pl/dzialalnosc/partnerzy-uam" class="odstepy_level2" href="http://amu.edu.pl/dzialalnosc/partnerzy-uam">


     Partnerzy UAM</a>


     </li>


          <li id="i276549" class="menu_level2 ">


     <a name="http://amu.edu.pl/dzialalnosc/patronaty" class="odstepy_level2" href="http://amu.edu.pl/dzialalnosc/patronaty">


     Patronaty honorowe</a>


     </li>


          <li id="i194875" class="menu_level2 ">


     <a name="http://amu.edu.pl/dzialalnosc/filmoteka-uam" class="odstepy_level2" href="http://amu.edu.pl/dzialalnosc/filmoteka-uam">


     Studio Filmowe UAM</a>


     </li>


          <li id="i74142" class="menu_level2 ">


     <a name="http://amu.edu.pl/dzialalnosc/wydawnictwo-naukowe-uam" class="odstepy_level2" href="http://amu.edu.pl/dzialalnosc/wydawnictwo-naukowe-uam">


     Wydawnictwo Naukowe UAM</a>


     </li>


          <li id="i283986" class="menu_level2 ">


     <a name="http://amu.edu.pl/dzialalnosc/pressto-czasopisma-uam" class="odstepy_level2" href="http://amu.edu.pl/dzialalnosc/pressto-czasopisma-uam">


     PRESSto czasopisma UAM</a>


     </li>


          <li id="i267928" class="menu_level2 ">


     <a name="http://amu.edu.pl/dzialalnosc/palace" class="odstepy_level2" href="http://amu.edu.pl/dzialalnosc/palace">


     Pałace</a>


     </li>


          <li id="i321356" class="menu_level2 ">


     <a name="http://amu.edu.pl/dzialalnosc/nieruchomosci-oferty" class="odstepy_level2" href="http://amu.edu.pl/dzialalnosc/nieruchomosci-oferty">


     Nieruchomości – oferty</a>


     </li>


          <li id="i35041" class="menu_level2 ">


     <a name="http://amu.edu.pl/dzialalnosc/przetargi" class="odstepy_level2" href="http://amu.edu.pl/dzialalnosc/przetargi">


     Przetargi</a>


     </li>


          <li id="i20637" class="menu_level2 ">


     <a name="http://amu.edu.pl/dzialalnosc/zamowienia-publiczne" class="odstepy_level2" href="http://amu.edu.pl/dzialalnosc/zamowienia-publiczne">


     Zamówienia publiczne</a>


     </li>


          <li id="i106526" class="menu_level2 ">


     <a name="http://amu.edu.pl/dzialalnosc/oferty-pracy" class="odstepy_level2" href="http://amu.edu.pl/dzialalnosc/oferty-pracy">


     Oferty pracy</a>


     </li>


         </ul>






<!-- END LEVEL 2 -->


  <!-- END LEVEL 1 -->






</div><!-- end div#menu_lewy_portal -->


</div><!-- end div#wrapper_menu_lewy -->




<div id="wrapper_tresc">


<div id="breadcrumbs_kolor"></div>


<div id="breadcrumbs">


 <a href="http://amu.edu.pl">


  Portal UAM </a>


 <img src="/__data/assets/image/0005/12578/strzalka_czarna.gif?v=0.0.9" alt="" />


 <a href="http://amu.edu.pl/dzialalnosc">


  Uniwersytet </a>


 <img src="/__data/assets/image/0005/12578/strzalka_czarna.gif?v=0.0.9" alt="" />


 <a href="http://amu.edu.pl/dzialalnosc/o-uam">


  O UAM </a>


</div><!-- end div#breadcrumbs -->




<div id="tresc">


<div id="tresc_wlasciwa">


<h1 style="border-bottom: none;">O UAM


</h1>






<div>


<p style="text-align: justify;"></p><h3 style="text-align: justify;"><font size="2"><strong>Uniwersytet im. Adama Mickiewicza w Poznaniu j</strong><span style="text-align: justify;">eden z najlepszych polskich uniwersytetów, godny kontynuator tradycji Akademii Lubrańskiego i poznańskiego kolegium jezuickiego – pereł systemu edukacyjnego dawnej Rzeczypospolitej.</span></font></h3><font size="2"><div style="text-align: justify;"><p>Dziś nasz Uniwersytet, od lat we wszystkich rankingach sytuujący się w ścisłej czołówce najlepszych polskich uczelni wyższych, reprezentujących europejski poziom <a href="http://amu.edu.pl/dzialalnosc/ksztalcenie">kształcenia</a> i prowadzonych <a href="http://amu.edu.pl/dzialalnosc/badania-naukowe">badań naukowych</a>, przeżywa okres wszechstronnego rozwoju naukowego, dydaktycznego i inwestycyjnego.</p></div></font><p></p>




<p style="text-align: justify;"><font size="2">Dalszy dynamiczny rozwój naszej <strong>Almae Matris</strong> będzie stymulowała przyjęta przez Senat uczelni <a href="http://https://amu.edu.pl/dzialalnosc/o-uam/dokumenty-strategiczne-uczelni"></a><a href="https://amu.edu.pl/dzialalnosc/o-uam/dokumenty-strategiczne-uczelni">Strategia rozwoju UAM na lata 2009-2019</a> – gwarancja nowych osiągnięć i godnego, na miarę naszych aspiracji, miejsca wśród uniwersytetów Europy i świata.</font></p><p style="text-align: justify;"><font size="2"> Aktualnie na 285 kierunkach i specjalnościach studiuje blisko 40 tys. studentów studiów I i II stopnia oraz jednolitych studiów magisterskich. Na studiach doktoranckich kształci się ponad 1300 doktorantów. Coraz więcej osób podejmuje studia podyplomowe i kursy dokształcające. Dyplom naszej uczelni staje się coraz bardziej poszukiwanym atutem na rynku pracy.</font></p>


















 </div>


<div class="float_clear"></div>


<hr />


<div class="linki_ponizej_tekstu">


<div class="w33 w33_1"><div class="odstep"><a href="http://amu.edu.pl/dzialalnosc/o-uam/historia-uniwersytetu">Historia Uniwersytetu</a>




</div></div><div class="w33 w33_2"><div class="odstep"><a href="http://amu.edu.pl/dzialalnosc/o-uam/biuro-rektora">Biuro Rektora</a>




</div></div><div class="w33 w33_3"><div class="odstep"><a href="http://amu.edu.pl/dzialalnosc/o-uam/dokumenty-programowe">Dokumenty programowe</a>




</div></div><div class="w33 w33_4"><div class="odstep"><a href="http://amu.edu.pl/dzialalnosc/o-uam/wladze">Władze</a>




</div></div><div class="w33 w33_5"><div class="odstep"><a href="http://amu.edu.pl/dzialalnosc/o-uam/wyronienia">Doktoraty honorowe i inne wyróżnienia</a>




</div></div><div class="w33 w33_6"><div class="odstep"><a href="http://amu.edu.pl/dzialalnosc/o-uam/dokumenty-strategiczne-uczelni">Dokumenty strategiczne</a>




</div></div><div class="w33 w33_7"><div class="odstep"><a href="http://amu.edu.pl/dzialalnosc/o-uam/rankingi-i-nagrody">Rankingi i nagrody</a>




</div></div><div class="w33 w33_8"><div class="odstep"><a href="http://amu.edu.pl/dzialalnosc/o-uam/plany-roczne-i-sprawozdania-rektora">Plany roczne i sprawozdania Rektora</a>




</div></div><div class="w33 w33_9"><div class="odstep"><a href="http://amu.edu.pl/dzialalnosc/o-uam/wybory-2016-2020">Wyniki wyborów 2016-2020</a>




</div></div>


</div>


<div class="float_clear"></div><br />


<p align="right" style="padding-right: 15px;"><a style="color: black;" href="o-uam/pamieci-tych-ktorzy-odeszli...">Pamięci tych, którzy odeszli...</a></p>


</div><!-- end div#tresc_wlasciwa -->


<div class="drukuj_strone">


<a href="?SQ_DESIGN_NAME=print">Drukuj stronę</a>


<span style="margin-left: 20px;"><a href="./_login">Zaloguj się</a></span>


<span style="margin-left: 20px;"><a href="./_nocache?SQ_PAINT_LAYOUT_NAME=blad">Uwagi do strony</a></span>


</div>


</div><!-- end div#tresc -->


</div><!-- end div#wrapper_tresc -->




<div id="wrapper_menu_prawy">


<div id="menu_prawy">






<div id="menu_lewy_portal"><div class="kolor_portalu_tlo odstepy_level1" name="Kalendarz wydarzeń">Kalendarz wydarzeń</div></div>










                <script type="text/javascript">


        //<![CDATA[




                function onDayClick(day, mon, year)


                {


                                                frameRedirect("http://amu.edu.pl/kalendarium/wszystkie?SQ_CALENDAR_VIEW=day&SQ_CALENDAR_DATE=" + DateConvert2MySQL(day, mon, year));


                                            }






                function onWeekClick(day, mon, year)


                {


                                                frameRedirect("http://amu.edu.pl/kalendarium/wszystkie?SQ_CALENDAR_VIEW=week&SQ_CALENDAR_DATE=" + DateConvert2MySQL(day, mon, year));


                                            }






                function onMonthClick(day, mon, year)


                {


                                                frameRedirect("http://amu.edu.pl/kalendarium/wszystkie?SQ_CALENDAR_VIEW=month&SQ_CALENDAR_DATE=" + DateConvert2MySQL(day, mon, year));


                                            }






                function onYearClick(day, mon, year)


                {


                                    }




                        //]]>


        </script>




                    <!-- Start init of JS Calendar -->


            <script src="http://amu.edu.pl/__fudge/js_calendar/js_calendar.js" type="text/javascript"></script>


            <script type="text/javascript">


                addStyle('@import url("http://amu.edu.pl/__fudge/js_calendar/js_calendar.css");');


            </script>


            <!-- End init of JS Calendar -->


            <span id="js_calendar_navigator"></span>        <script type="text/javascript">


        //<![CDATA[


            js_calendar_cal = new Calendar("js_calendar_cal", "js_calendar_navigator", "100%","100%","2017","12","12");


            js_calendar_cal.prefix = "js_calendar";


            js_calendar_cal.imageURL = "http://amu.edu.pl/__fudge/js_calendar/calendar.gif";


js_calendar_cal.fadeit = true;


js_calendar_cal.scrollit = false;


js_calendar_cal.onDayClick = onDayClick;


js_calendar_cal.onWeekClick = onWeekClick;


js_calendar_cal.onYearClick = onYearClick;


js_calendar_cal.height = "100%";


js_calendar_cal.width = "100%";


js_calendar_cal.day_name_length = "2";


js_calendar_cal.week_start = "1";


js_calendar_cal.onMonthClick = onMonthClick;


js_calendar_cal.popup = false;


js_calendar_cal.currentDate = "2017-12-12";


            js_calendar_cal.draw();


        //]]>


        </script>






<div style="height:150px;"><img src="http://amu.edu.pl/__data/assets/image/0005/308993/ikony-social-media-tvuam.jpg" alt="" usemap="#Mapsocial" />


<map name="Mapsocial" id="Mapsocial">


    <area alt="" title="" href="https://www.facebook.com/amupoznan/" shape="rect" coords="5,50,52,98" />


    <area alt="" title="" href="https://www.linkedin.com/edu/uniwersytet-im.-adama-mickiewicza-w-poznaniu-15996" shape="rect" coords="55,51,99,97" />


    <area alt="" title="" href="https://www.youtube.com/user/UAMpoznan" shape="rect" coords="104,52,147,98" />


    <area alt="" title="" href="http://tv.amu.edu.pl/" shape="rect" coords="154,52,197,97" />


</map></div>






<div style="height: 150px;" class="film_item"><a href="http://amu.edu.pl/glowna/s/debaty-akademickie/vi-debata-akademicka"><img src="http://amu.edu.pl/__data/assets/image/0009/343998/Baner_Debaty-Akademickie.png" alt="VI Debata


Akademicka"></a></div>






<div style="height: 150px;" class="film_item">


<a style="padding: 0; margin: 0;" href="http://uam.platontv.pl/adv?page=1&title=film&lang=-1&order=1&main=False&id=7168"><img width="200px" height="150px" src="http://amu.edu.pl/__data/assets/image/0005/309461/film-o-uam.jpg" alt="Film promocyjny UAM"></a></div><div style="height: 150px;" class="film_item"><a href="http://amu.edu.pl/__data/assets/pdf_file/0011/334388/UAM-folder-rekrutacyjny-2018-2019_NET.pdf"><img src="http://amu.edu.pl/__data/assets/image/0010/334387/boks-rekrutacja2018.jpg" alt="Rekrutacja 2018/2019"></a></div>




<div style="height: 150px;" class="film_item"><a href="http://uo.amu.edu.pl"><img src="http://amu.edu.pl/__data/assets/image/0004/313879/UO_granat.jpg" alt="Uniwersytet otwarty"></a></div><div style="height: 150px;" class="film_item"> <a href="http://kolorowyuniwersytet.amu.edu.pl"><img src="http://amu.edu.pl/__data/assets/image/0003/309459/Kolorowy_Uniwersytet.jpg" alt="Kolorowy Uniwersytet"></a> </div><div style="height:150px;" class="film_item"> <a href="http://spacer.amu.edu.pl"><img src="http://amu.edu.pl/__data/assets/image/0004/309460/spacer-po-uam.jpg" height="150" alt="Wirtualny spacer po UAM"></a></div><a style="padding: 0; margin: 0;" href="http://tv.amu.edu.pl/">


<div class="film_item" style="height:150px;"><img width="200px" height="150px" src="http://amu.edu.pl/__data/assets/image/0009/309465/uam-tv.jpg" alt="UAM TV, Naukowa Telewizja Internetowa"></div></a><a style="padding: 0; margin: 0;" href="http://amu.edu.pl/aktualnosci/na-glowna/342781-nowy-numer-zycia-uniwersyteckiego">


<div class="film_item" style="height:150px;"><img width="200px" height="150px" src="http://amu.edu.pl/__data/assets/image/0008/342809/Zycie-Uniwersyteckie_listopad.jpg" alt="Życie Uniwersyteckie"></div></a>




</div><!-- end div#menu_prawy -->


</div><!-- end div#wrapper_menu_prawy -->


</div><!-- end div#wrapper_zawartosc -->


<div class="float_clear"></div>


</div><!-- end div#kontener_glowny -->


</div><!-- end div#kontener_tlo -->


</div><!-- end div#kontener_tlo_2 -->




<div id="wrapper_stopka">


<div id="stopka">






                        <p>© Uniwersytet im. Adama Mickiewicza w Poznaniu, ul. Wieniawskiego 1, 61-712 Poznań | tel. centrala +48 (61) 829 40 00, NIP: 777-00-06-350, REGON: 000001293</p>


<p style="font-size: 9px;">Ten serwis używa plików "cookie" zgodnie z <a href="https://usi.amu.edu.pl/o-usi/polityka-cookies">Polityką Cookies</a>. Brak zmiany ustawień przeglądarki oznacza jej akceptację.</p>


</div><!-- end div#stopka -->


</div><!-- end div#wrapper_stopka -->




<!-- js second loaded -->


<script type="text/javascript" src="/__data/assets/file/0007/173644/calendar.js?v=0.0.2"></script>


<script type="text/javascript" src="/__data/assets/file/0008/173645/lightbox_configuration.js?v=0.0.2"></script>


<script type="text/javascript" src="/__data/assets/file/0009/173646/fancybox.js?v=0.0.2"></script>


<script type="text/javascript" src="/__data/assets/file/0010/173647/fancybox_init_.js?v=0.0.2"></script>


<script type="text/javascript" src="/__data/assets/file/0011/173648/adam_zamien_all_na_wszystkie.js?v=0.0.2"></script>








</body>


</html>

Inne metody

  • POST

  • HEAD

  • PUT

  • DELETE

  • TRACE

  • etc

Jak przesyłane są dane?

TCP/IP

O tym nie będziemy mówć ;-)

Rodzaje odpowiedzi serwera

Status (trzycyfrowy kod)

  • 1xx – zapytanie otrzymane, serwer je przetwarza

  • 2xx – zapytanie zwieńczone sukcesem

  • 3xx – przekierowanie

  • 4xx – bład po stronie klienta (np. zapytanie niezrozumiałe)

  • 5xx – błąd serwera

Sukces?

  • 100 – zapytanie przetwarzane

  • 200 – zapytanie zrealizowane

Błąd klienta

  • 400 – (Bad Request), serwer nie mógł zrozumieć zapytania

  • 401 – (Authentication Required), zasoby chronione, mogą być wysłane uprawnionym użytkowników, zapytanie powinno zawierać login i hasło

  • 403 – (Forbidden), odmowa dostępu do zasobów

  • 404 – (Not Found), zasób nie został znaleziony

  • 408 – (Request Timeout), przekroczony czas oczekiwania

Błąd serwera

  • 500 – (Internal Server Error)

  • 502 – (Bad Gateway)

  • 503 – (Service Unavailable)

Prawa (do) plików

Grupy użytkowników

  • user – użytkownik, właściciel pliku

  • group – grupa, właściciel pliku

  • other – pozostali użytkownicy

Prawa plików

  • read – odczyt (litera r, wartość dwójkowa 100, ósemkowo 4)

  • write – zapis (litera w, wartość dwójkowa 010, ósemkowa 2)

  • execute – wykonywanie (litera x, wartość dwójkowa 001, ósemkowa 1)

Jak kodowane są prawa?

-rwxr-xr--   1 http http 2017 dec 12 13:09 file


tuuugggooo

u – user, g – group, o – other, t – typ (- zwykły, d katalog)

Prawa do katalogu

  • jeżeli użytkownik ma prawo x do katalogu, to może do niego wejść

  • jeżeli użytkownik ma prawo r do katalogu, to może wyświetlić jego zawartość

  • jeżeli użytkownik ma prawo w do katalogu, to może w nim tworzyć i kasować pliki/katalogi

Jak zmieniać prawa?

Polceniem chmod (w konsoli)

chmod prawa_dostępu nazwa_pliku

Na przykład

chmod 600 readme.txt

nadanie użytkownikowi user prawa 4+2, czyli read+write

JavaScript

Czym jest JavaScript?

JavaScript jest językiem skryptowym wykorzystywanym do tworzenia stron internetowych i interakcji z użytkownikiem.

JavaScript to nie jest Java!

Jak uruchomić JavaScript

W pliku html

<html>


<head>


</head>


<body>


<script type="text/javascript">


    ...instrukcje


</script>


</body>


</html>

w zewnętrznym pliku

<script src="plik.js"></script>

Kiedy uruchomić kod?

<html>


    <head>


        <script src="plik1.js"></script>


        <script src="plik2.js"></script>


    </head>


    <body>


    ..treść strony...


        <script src="plik.js"></script>


        <script>


            ...instrukcje


        </script>


    </body>


</html>

Prosty program w JavaScript

Skrypt wyświetlający czas na stronie

W części head

<script type="text/javascript">




</script>

w części body

<div id="clock"></div>

Pobranie czasu z zegara systemowego

<script type="text/javascript">


    var now = new Date();


    var day = now.getDate();


    var month = now.getMonth()+1;


    var year = now.getFullYear();


    var hour = now.getHours();


    var minute = now.getMinutes();


    var second = now.getSeconds();


</script>

Wypisywanie na ekranie

<body>


<div id="clock"></div>




<script type="text/javascript">


    document.getElementById("clock").innerHTML = day+


    "-"+month+"-"year"+"|"+hour+":"+minute+":"+second;


</script>


</body>

Zmiana czasu co sekundę

<script type="text/javascript">


    function time_count()


    {   


    var now = new Date();


    var day = now.getDate();


    var month = now.getMonth()+1;


    var year = now.getFullYear();


    var hour = now.getHours();


    var minute = now.getMinutes();


    var second = now.getSeconds();  




    document.getElementById("clock").innerHTML = day


    +"-"+month+"-"year"+"|"+hour+":"+minute+":"+second;




    setTimeout("time_count()",1000)


}


</script>

Uruchamianie funkcji

<body onload="time_count();">




<div id="clock"></div>




</body>

Tunning

    var hour = now.getHours();


    if(hour<10) hour = "0" + hour;


        var minute = now.getMinutes();


    if(minute<10) minute = "0" + minute;


    var second = now.getSeconds();


    if(second<10) second = "0" + second;