materiat1l y ecg it documentation

Materiały LinEtcWydanie 1

Robert Bednarz

lut 28, 2018

Spis tresci

1 Narzedzia 31.1 Geany . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 31.2 Kompilator C/C++ . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 31.3 Sublime Text 3 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 61.4 Biblioteka Qt . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 61.5 Baza SQLite . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 91.6 Interpreter Pythona . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 141.7 Serwer WWW . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 151.8 Git . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 181.9 ReStructuredText i Sphinx . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 42

2 Biblioteka Qt 492.1 Adresy (Qt5) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 492.2 Zadania (Qt5) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 62

3 Technologie WWW 653.1 HTML&CSS – cwiczenie 1 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 653.2 GetSimple CMS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 683.3 Bootstrap . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 753.4 Słownik . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 78

4 Porteus 814.1 Klucz USB . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 824.2 Pierwsze uruchomienie . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 844.3 Moduły . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 874.4 Wskazówki . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 894.5 Problemy . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 93

5 Python 955.1 Algorytmy . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 95

6 Linki 1056.1 Programy . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1056.2 System linux . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 105

7 Galerie 1077.1 GetSimple CMS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 107

8 Indeks 109

i

Materiały LinEtc, Wydanie 1

Materiały zawarte w tym repozytorium zawieraja cwiczenia, poradniki oraz dokumentacje zwiazana z zagadnieniamitechnologii informacyjnej i informatyki.

Spis tresci:

Spis tresci 1


2 Spis tresci

ROZDZIAŁ 1

Narzedzia

Ponizej przedstawiamy zestaw przykładowych narzedzi informatycznych.

Spis tresci

• Narzedzia

Informacja: Przykłady polecen wydawanych w terminalu bedziemy podawali dla systemu Debian i pochodnych(np. (X)Ubuntu, Mint) oraz menedzera pakietów apt-get, poprzedzamy je symbolami ~$; a takze dla system ArchLinux i pochodnych (np. Manjaro) korzystajacych z menedzera pacman, poprzedzamy je symbolami ~#.

Instalacja pakietów wymaga uprawnien roota. W wielu systemach uzywa sie polecenia sudo, które pozwala zwy-kłemu uzytkownikowi uruchamiac programy z podwyzszonymi uprawnieniami. Jezeli Twój system nie ma skonfigu-rowanego domyslnie polecenia sudo (np. Debian lub Arch Linux), musisz zalogowac sie na konto roota, np. wpisujacw terminalu su root.

Spis tresci:

Geany

Instrukcja instalacji Geany

Kompilator C/C++

W systemie Linux potrzebne narzedzia sa zazwyczaj obecne, ale w razie potrzeby wystarczy doinstalowac pakiet gccodpowiednim menedzerem pakietów, np.:

~$ sudo apt-get install gcc

W MS Windows instalujemy minimalistyczne srodowisko deweloperskie dostarczajace wolne narzedzia GNU Com-piler Collection, czyli MinGw. W tym celu pobieramy instalator mingw-get-setup.exe i uruchamiamy.

W oknie wyboru pakietów zaznaczamy widoczne ponizej paczki, w tym przede wszystkim mingw32-gcc-g++, anastepnie wybieramy polecenie Installation/Apply.

3

http://python101.readthedocs.io/pl/latest/env/ide.html#geany

http://www.mingw.org/

http://sourceforge.net/projects/mingw/files/Installer


4 Rozdział 1. Narzedzia


1.2. Kompilator C/C++ 5


Po pobraniu i rozpakowaniu wskazanych narzedzi oraz zakonczeniu instalatora (Close) trzeba dodac do sciezki sys-temowej połozenie kompilatora i linkera; dzieki temu bedzie mozna korzystac z tych i innych narzedzi bezposrednioz Geany lub okienka konsoli tekstowej. W oknie “Uruchamianie” (WIN+R) wpisujemy polecenie wywołujace okno“Zmienne srodowiskowe” – mozna je równiez uruchomic z okna własciwosci komputera:

Klikamy przycisk Nowa i tworzymy nowa zmienna uzytkownika zgodnie z podanym zrzutem:

Wskazówka: Powyzej przedstawilismy instalacje narzedzi MinGw z konta zwykłego uzytkownika. Mozna w raziepotrzeby czynnosci te wykonac równiez z konta administratora, co pozwoli udostepnic narzedzia wszystkim uzytkow-nikom. Podobnie sciezke do kompilatora itd. mozna dopisac do zmiennej systemowej PATH, dzieki czemu wszyscyuzytkownicy beda mogli wywoływac narzedzia bez podawania pełnej ich lokalizacji.

Sublime Text 3

Sublime Text 3 to profesjonalny edytor dla programistów, który własciwie skonfigurowany bardzo dobrze nadaje siedo pisania programów w wielu jezykach, m.in. w Pythonie. Zobacz: instalacja i konfiguracja ST3.

Biblioteka Qt

Qt to zestaw bibliotek przeznaczonych dla jezyka C++, QML i Java, który znakomicie ułatwia tworzenie graficznegointerfejsu uzytkownika. Zawiera równiez klasy udostepniajace obsługe m.in. multimediów , sieci czy baz danych.

System i srodowisko IDE

Bilioteka Qt jest przenosna z załozenia, wiec programowac z jej wykorzystaniem mozna w wielu systemach i srodo-wiskach. Proponujemy system Linux, np. dystrybucje Debian (v. Jessie) lub Xubuntu 14.04. Instalacja wymaganychnarzedzi sprowadza sie do wydania prostych polecen w terminalu:


http://python101.readthedocs.io/pl/latest/env/ide.html#sublime-text-3


1.4. Biblioteka Qt 7


~$ sudo apt-get update~$ sudo apt-get install qtcreator qt5-qmake qt5-default qt4-qtconfig

Pierwsze polecenie zaktualizuje repoytoria, czyli wersje dostepnego oprogramowania; drugie zainstaluje dedykowanesrodowisko IDE, które pozwala projektowac interfejs graficzny, bardzo ułatwia edycje kodu, pozwala budowac, uru-chamiac i debugowac rózne wersje tworzonych aplikacji.

Qt5 w systemie Windows

Instalacja jest bardzo prosta. Pobieramy Qt Online Installer for Windows i uruchamiamy. Nastepnie przeprowadzamystandardowa instalacje z domyslnymi ustawieniami, podajac w razie potrzeby hasło administratora.

Wyglad i działanie aplikacji Qt Creator w systemie Linux i Windows sa takie same.

Baza SQLite

W wielu projektach nie ma potrzeby wykorzystywania duzych i skomplikowanych systemów zarzadzania bazami da-nych takich jak MySQL, MariaDB czy PostgreSQL. Lepiej skorzystac z prostszej bazy SQLite, która ma jednak duzemozliwosci. Do zarzadzania bazami danych SQLite’a, które przechowywane sa w pojednyczych plikach, wykorzy-stuje sie interepreter działajacy w terminalu.

1.5. Baza SQLite 9

https://www.qt.io/download-open-source/

https://www.sqlite.org/


1.5. Baza SQLite 11


W systemach Linux instalowany jest on poleceniami typu:

~$ sudo apt-get install sqlite3

~# pacman -S sqlite

– i uruchamiany komenda sqlite3. Podstawowe polecenia:

~$ sqlite3 baza.db // otwarcie pliku z baza~$ sqlite3 baza.db < schemat.sql // utworzenie bazy na podstawie pliku .sqlsqlite> .tables // lista tabelsqlite> .help // lista polecen interpreterasqlite> .schema tabela // pokazuje klauzule CREATE dla podanej tabelisqlite> .quit // wyjscie z interpretera

Najlepszym narzedziem z interfejsem graficznym jest z kolei polski program SQLiteStudio. Po pobraniu archiwum zrozszerzeniem tar.xz rozpakowujemy go i tworzymy dowiazanie:

~$ sudo tar -xf sqlitestudio-3.0.7.tar.xz -C /opt~$ cd /usr/bin~$ sudo ln -sf /opt/SQLiteStudio/sqlitestudio .

W systemach opartych na Arch Linuksie mozemy instalowac z repozytorium AUR:

~# yaourt -S sqlitestudio

Program uruchamiamy poleceniem sqlitestudio.

W systemie Windows ze strony SQLite3 Download Page z sekcji Precompiled Binaries for Windows pobieramyarchiwum sqlite-tools-win32-(...).zip. Nastepnie nalezy je rozpakowac najlepiej do katalogu bedacego w sciezce sys-temowej. Interpreter uruchamiamy albo poleceniem sqlite3 albo podwójnym kliknieciem.

Graficzne narzedzia do baz SQLite3 pod Windowsem to wspomniane wyzej polskie SQLiteStudio w wersji dla Win-dows. Pobrane archiwum .zip rozpakowujemy i uruchamiamy program SQLiteStudio.exe. Drugi program to np.angielskojezyczny SQLite Browser dołaczony do opisanego wyzej srodowiska UwAmp. Mozna go pobrac ze stronyDB Browser for SQLite.

L(W)amp

Zobacz: Serwer deweloperski WWW »»»

Materiały

1. Edytor Geany

2. MinGw

3. Biblioteka Qt

4. Qt Creator

5. Interpreter SQLite3

Słownik

Qt zestaw bibliotek programistycznych ułatwiajacych tworzenie aplikacji z interfejsem graficznym w jezykach C++,QML i Java.


http://sqlitestudio.pl/

https://www.sqlite.org/download.html

http://sqlitestudio.pl/?act=download

http://sqlitestudio.pl/?act=download

http://sqlitebrowser.org/

http://www.geany.org/

http://www.mingw.org/

https://qt-project.org/

http://pl.wikipedia.org/wiki/Qt_Creator

https://www.sqlite.org/cli.html


1.5. Baza SQLite 13


srodowisko IDE zintegrowane srodowisko programistyczne (ang. Integrated Development Environment, IDE), skła-dajace sie z jednej lub wielu aplikacji, umozliwiajace tworzenie, testowanie, budowanie i uruchamianie kodu.

Qt Creator wieloplatformowe srodowisko IDE dla aplikacji pisanych w jezykach C++, JavaScript i QML. Zawieram.in. debugger i edytor GUI (graficznego interfejsu uzytkownika).

MinGw ang. Minimalist GNU for Windows; minimalistyczne srodowisko dostarczajace narzedzia GNU (linker,kompilator itd.) pozwalajace na kompilacje natywnych plików wykonywalnych dla Windows z kodu pisanegow C/C++.

GNU Compiler Collection zestaw kompilatorów do róznych jezyków programowania rozwijany w ramach projektuGNU i udostepniany na licencji GPL oraz LGPL. Zob. hasło w Wikipedii.

GPL ang. GNU General Public License – licencja wolnego i otwartego oprogramowania stworzona w 1989 rokuprzez Richarda Stallmana i Ebena Moglena na potrzeby Projektu GNU. Ostatnia wersja, trzecia, opublikowanazostała 29 czerwca 2007 r. Zob. hasło w Wikipedii.

Debian jedna z najstarszych i wiadacych dystrybucji Linuksa, umozliwia elastyczna konfiguracje systemu i dostoso-wanie go do własnych potrzeb. Jak wiekszosc dystrybucji, umozliwia wybór wielu srodowisk graficznych, np.XFCE lub Gnome.

Xubuntu 14.04 odmiana jednej z najpopularniejszych dystrybucji Linuksa, Ubuntu, dostarczana z klasycznym, lek-kim i konfigurowlanym srodowiskiem graficznym XFCE.

srodowisko graficzne w systemach linuksowych zestaw oprogramowania tworzacy GUI, czyli graficzny interfejsuzytkownika, czesto zawiera domyslny wybór aplikacji przeznaczonych do wykonywania typowych zadan. Naj-popularnijesze srodowiska to XFCE, Gnome, KDE, LXDE, Cinnamon, Mate.

serwer WWW (ang. web server) – oprogramowanie obsługujace protokół http, podstawowy protokół sieci WWW,słuzacy przesyłaniu dokumentów hipertekstowych.

interpreter program, który analizuje kod zródłowy, a nastepnie go wykonuje. Interpretery sa podstawowym skład-nikiem jezyków wykorzystywanych do pisania skryptów wykonywanych po stronie klienta WWW (JavaScript)lub serwera (np. Python, PHP).

system bazodanowy system zarzadzania baza danych (ang. Database Management System, DBMS) – oprogramo-wanie słuzace do zarzadzania bazami danych, np. SQLite, MariaDB, MySQL, PostgreSQL.

framework (ang. framework – struktura) – oprogramowanie bedace zestawem narzedzi ułatwiajacych i przyspiesza-jacych tworzenie aplikacji.

Utworzony 2018-02-28 o 20:47 w Sphinx 1.4.5

Interpreter Pythona

W systemach Linux Python jest szeroko stosowany i dostepny jest w ramach standardowej instalacji wiekszoscidystrybucji i to zarówno w wersji 2.x, jak i 3.x. Dla formalnosci polecenia instalacyjne to:

~$ sudo apt-get install python2 python3~# pacman -S python python2

Informacja: Warto zauwazyc, ze w dystrybucjach opartych na Debianie polecenie python jest dowiazaniem dowersji 2.x, a paczki nazywaja sie odpowiednio python2-... lub python3-.... W Arch Linuksie i pochodnychnazwa python domyslnie wskazuje wersje 3.x (!), podobnie nazwy pakietów dodatkowych. Wersja i paczki z liniii2.x maja w nazwie python2.

Polecic natomiast mozna doinstalowanie dodatkowych narzedzi, w tym rozszerzonej konsoli:


http://pl.wikipedia.org/wiki/Debugger

http://pl.wikipedia.org/wiki/GNU_Compiler_Collection

http://pl.wikipedia.org/wiki/GNU_General_Public_License

http://www.xfce.org/

http://pl.wikipedia.org/wiki/GNOME

http://pl.wikipedia.org/wiki/KDE

http://pl.wikipedia.org/wiki/LXDE

http://en.wikipedia.org/wiki/Cinnamon_%28software%29

http://pl.wikipedia.org/wiki/MATE

http://pl.wikipedia.org/wiki/JavaScript

http://pl.wikipedia.org/wiki/PHP


~$ sudo apt-get install ipython2 ipython3~# pacman -S python-pip ipython python2-pip ipython2

W MS Windows postepuj zgodnie z instrukcja na Python101.

Materiały

1. Jezyk Python


Serwer WWW

Jezeli chcemy tworzyc i testowac aplikacje sieciowe wykorzystujace bazy danych za pomoca jezyków skryptowych,np. PHP czy Python, potrzebujemy srodowiska testowego, na które składa sie serwer WWW, interpreter jezykaskryptowego i system bazodanowy. Zestawy takiego oprogramowania okresla sie skrótami WAMP lub LAMP wzaleznosci od wykorzystywanego systemu operacyjnego: W – Windows, L – Linux. Pozostałe litery rozwija sienajczesciej jako:

• A – Apache;

• M – MySQL, w linuksach raczej MariaDB;

• P – PHP, Perl lub Python.

Wymienionego oprogramowanie to najpopularniejsze, ale nie jedyne rozwiazania. Dostepnych jest wiele innych,równie dobrych serwerów czy baz danych. Warto tez wiedziec, ze instalacja i konfiguracja kompletu wymienionychprogramów nie jest zazwyczaj konieczna. Np. jezeli tworzymy aplikacje sieciowe w Pythonie wystarcza dedykowanabiblioteka (np. Flask) lub framework (np. Django), które zapewniaja serwer HTTP i obsługe wbudowanej bazySQLite.

Linux

W systemie Debian i pochodnych (Ubuntu, Linux Mint itd.) lub na Arch Linuksie mozna zainstalowac serwer Apache2i interpreter PHP za pomoca dedykowanych menedzerów pakietów, czyli odpowiednio:

~$ sudo apt-get install apache2 php7.0 php7.0-gd php7.0-sqlite3 php7.0-curl→˓libapache2-mod-php7.0~# pacman -S apache php php-gd php-sqlite php-curl libapache-mod-php7

Ostrzezenie: Nazwy pakietów dla dystrybujcji opartych na Debianie (Ubuntu itd.) róznia sie od podanych.Własciwe nazwy mozna sprawdzic wydajac w terminalu polecenie: apt-get search php | grep php.

Podstawowa konfiguracja sprowadza sie do uaktywnienia odpowiednich modułów:

~$ sudo a2enmod userdir rewrite~$ sudo service apache2 restart

~# a2enmod userdir rewrite~# systemctl restart httpd

1.7. Serwer WWW 15

http://python101.readthedocs.io/pl/latest/env/windows.html

https://www.python.org/

http://pl.wikipedia.org/wiki/WAMP

http://pl.wikipedia.org/wiki/LAMP

http://pl.wikipedia.org/wiki/Apache_%28serwer%29

http://pl.wikipedia.org/wiki/MySQL

http://pl.wikipedia.org/wiki/MariaDB


http://pl.wikipedia.org/wiki/Perl

http://pl.wikipedia.org/wiki/Python


– i odblokowania mozliwosci wykonywania skryptów w katalogach domowych uzytkowników poprzez zako-mentowanie nastepujacych linii z pliku /etc/apache2/mods-available/php7.0.conf (Debian) lub/etc/httpd/mods-available/php7.conf (Arch):

# To re-enable PHP in user directories comment the following lines# (from <IfModule ...> to </IfModule>.) Do NOT set it to On as it# prevents .htaccess files from disabling it.#<IfModule mod_userdir.c># <Directory /home/*/public_html># php_admin_flag engine Off# </Directory>#</IfModule>

Tworzone strony umieszczamy w podkatalogu public_html katalogu domowego. Wywołujemy je wpi-sujac w przegladarce adres: 127.0.0.1/~uzytkownik – powinny zostac zwrócone pliki index.phplub index.html, o ile istnieja. Jezeli mamy kilka projektów, umieszczamy je w podkatalogach, np.public_html/projekt1 i wywołujemy: 127.0.0.1/~uzytkownik/projekt1.

UwAmp w Windows

W systemie Microsoftu najłatwiej skorzystac z gotowego zestawu WAMP. Proponujemy UwAmp. Po wejsciu nastrone klikamy Download, a nastepnie link o nazwie Download Exe/Install.


http://www.uwamp.com/en/


Ostrzezenie: Do poprawnego działania Apache’a wymagana jest biblioteka Microsoftu Visual C++ 2012 Re-distributable (VC++ 11.0) w wersji 32-bitowej (x86), z kolei do PHP 7 musimy zainstalowac Visual C++ 2015Redistributable.

Pobieramy wymienione wyzej biblioteki i instalujemy je na poczatku.

Nastepnie uruchamiamy instalacje UwAmpa. Jako miejsce instalacji wybieramy główny katalog wybranego dysku,C:, D: itp.:

Po zainstalowaniu i uruchomieniu aplikacji UwAmp zapora systemowa moze poprosic o odblokowanie portów serwerawww i bazy danych. Godzimy sie, wybierajac opcje dla sieci prywatnych i domowych.

Serwerami i narzedziami zarzadzamy za pomoca wygodnego okna:

Informacja: Korzystajac z powyzszego okna wybierz wersje PHP 7.

Serwery www (Apache2) i bazy danych (MySQL) startowane sa automatycznie. Jezeli nie korzystamy z serweraMySQL, mozemy go zatrzymac klikajac niebieska strzałke obok przycisku “Stop” i wybierajac go listy. Do obsługibaz SQLite dołaczono bardzo wygodny interfejs graficzny SQLite Browser.

Strony czy projekty umieszczamy w katalogu www folderu, w którym zainstalowalismy UwAmpa, np. wC:\\UwAmp\www. W przegladarce wpisujemy adres localhost lub localhost/podkatalog, jezeli stronyumiescilismy w jakims podkatalogu.


1.7. Serwer WWW 17

https://www.microsoft.com/en-us/download/details.aspx?id=30679





Git

Git Source Code Mirror – to rozproszony system wersjonowania kodów zródłowych napisany przez Linusa Torvaldsa,twórce jadra Linux. Skrót SCM bywa równiez rozwijany jako software configuration management, co oznacza “za-rzadzanie konfiguracja oprogramowania”. Gita mozna uzywac do rozwijania zarówno małych, jak i duzych projektów(np. Arch Linux, GIMP, jQuery).

Repozytorium zdalne

Przede wszystkim wchodzimy na strone https://github.com/ i zakładamy konto podajac: nazwe uzytkownika, email ihasło. Nastepnie tworzymy nowe repozytorium. Mozemy postepowac wg ponizszych instrukcji:

• Krok 1 – załozenie konta; podajemy nazwe uzytkownika, adres email i hasło, jako typ konta wybieramy free.

• Krok 2 – weryfikacja adresu e-mail

• Krok 3 – zakładamy repozytorium dla projektu, wybieramy typ Public (publiczne) i zaznaczamy “Initialize thisrepository with a README”

W ten sposób załozylismy repozytorium zdalne.

Klient Gita

Tresciami projektu mozna zarzadzac bezposrednio w serwisie GitHub za pomoca przegladarki. Czesciej jednak pra-cujemy w repozytorium lokalnym, obsługiwanym za pomoca jakiegos programu. Do nauki Gita najlepszy jest pod-stawowy klient tekstowy działajacy w terminalu.

W systemie Linux instalacja sprowadza sie do uzycia odpowiedniego menedzera pakietów:


http://pl.wikipedia.org/wiki/Git_%28oprogramowanie%29

http://pl.wikipedia.org/wiki/Linus_Torvalds

http://pl.wikipedia.org/wiki/Linux_%28j%C4%85dro%29

https://github.com/

https://help.github.com/articles/signing-up-for-a-new-github-account/

https://help.github.com/articles/verifying-your-email-address/

https://help.github.com/articles/create-a-repo/


1.8. Git 19


1.8. Git 21


1.8. Git 23


w Debianie (Ubuntu, Mint):~$ sudo apt-get install gitw Archu (Manjaro, Antergos):~# pacman -S git

Podczas pracy w Linuksie:

• polecenia moga byc wydawane w dowolnym terminalu;

• ~$ – oznacza katalog domowy uzytkownika, czyli sciezke /home/nazwa_uzytkownika;

• ~/mojprojekt$ – to podkatalog projektu utworzony w katalogu domowym.

W systemie Windows tego samego klienta tekstowego pobieramy ze strony http://git-scm.com/download/win i insta-lujemy z konta zwykłego uzytkownika zaznaczajac wskazane na ponizszym zrzucie opcje:

Podczas pracy w Windows:

• uzywamy konsoli Git Bash (dostepna po zainstalowaniu klienta);

• katalog projektu proponujemy utworzyc na partycji innej niz systemowa (zob. zrzut w nast. sekcji);

• jezeli Git Bash nie działa, uzywamy standardowej konsoli cmd, ale wtedy musimy pamietac o kilku rózni-cach.

1.8. Git 25

http://git-scm.com/download/win


Informacja:

• Ponizszy scenariusz napisano w oparciu o system Linux, który dla Gita jest srodowiskiem naturalnym. Nie majednak problemów z jego realizacja w Windows.

• Na potrzeby scenariusza katalogi i pliki tworzone beda za pomoca polecen konsoli, w codziennej pracy uzyjemyoczywiscie menedzera plików i edytora tekstu.

• Po zrozumieniu podstaw Gita repozytoria mozna obsługiwac za pomoca dedykowanych programów, np. Smart-Git, lub z poziomu narzedzi programistycznych, np. Sublime Text 3 czy PyCharm.

Konfiguracja

W terminalu wydajemy polecenia:

~$ git config --global user.name "nazwa_uzytkownika"~$ git config --global user.email email_uzytkownika~$ git config --global push.default simple~$ git config --list

W powyzszych poleceniach ustawiamy nazwe uzytkownika i e-mail, które beda wykorzystywane do podpisywaniawprowadzanych w projekcie zmian. Ustawienie push.default simple okresla sposób synchronizowania repo-zytorium lokalnego ze zdalnym.

Wskazówka: W Windows mozna ustawic opcje: git config --global core.autocrlf true, jesli niewyswietliła sie w podgladzie konfiguracji. Dzieki temu Git bedzie automatycznie konwertował znaki konca linii, oczym informuja komunikaty typu LF will be replaced by CRLF.

Klonowanie repozytorium

Repozytorium lokalne mozna tworzyc od podstaw (zob. dalej), ale prosciej jest sklonowac repozytorium zdalne utwo-rzone wczesniej w serwisie GitHub.

W terminalu wydajemy polecenie:

~$ git clone https://github.com/nazwa_uzytkownika/nazwa_repozytorium.git [nazwa_→˓katalogu]

Najwazniejszy jest argument Git URL, czyli schematyczny adres repozytorium, który kopiujemy ze strony głównejrepozytorium po kliknieciu w przycisk “Clone or download”:

W rezultacie w biezacym katalogu utworzony zostanie katalog o nazwie repozytorium lub o nazwie podanej w opcjo-nalnym argumencie [nazwa_katalogu].

W ten sposób utworzylismy repozytorium lokalne.

Stany plików

Podczas pracy nad projektem stan pliku zalezy od miejsca, w którym sie on znajduje. Git wyróznia trzy przestrzenie:

• katalog roboczy (ang. working directory);

• poczekalnia (ang. staging area);


http://www.syntevo.com/smartgit/

http://www.syntevo.com/smartgit/


Rys. 1.1: Poczatek pracy z Gitem i klonowanie repozytorium w Git-Bash pod Windows

1.8. Git 27


• repozytorium (katalog .git).

Mozliwe stany plików to:

• niesledzony (ang. untracked) – nowe pliki w katalogu roboczym;

• sledzony (ang. tracked):

– niezmieniony (ang. unmodified) w katalogu roboczym;

– zmieniony (ang. modified) w katalogu roboczym;

– pliki w poczekalni (ang. staged) czekajace na zatwierdzenie w migawce (ang. snapshot).

Typowy przebieg pracy z Gitem polega na:

• dodawaniu i zmienianiu plików w katalogu roboczym;



• przenoszeniu ich do poczekalni – git add;

• sprawdzaniu stanu repozytorium – git status;

• zatwierdzaniu zmian z poczekalni w migawce tworzonej w repozytorium – git commit.

Przecwiczymy to wydajac polecenia:

~/mojprojekt$ echo "Moje pierwsze repozytorium" > repo.txt~/mojprojekt$ git status~/mojprojekt$ git add repo.txt~/mojprojekt$ git status~/mojprojekt$ git commit -m "Opis projektu"

Informacja: Kazda migawka powinna byc opatrzona informacja o dokonanych zmianach. Umozliwia to opcja -m.Jezeli ja pominiemy, Git otworzy domyslny edytor, w którym nalezy zmiany opisac.

1.8. Git 29


Zmiany zdalne

Wprowadzmy kilka przykładowych zmian w projekcie za pomoca interfejsu serwisu GitHub:

• Zmieniamy plik README.md. Klikamy jego nazwe, a nastepnie ikone edycji w prawym górnym rogu obokprzycisku “History”. Dopisujemy cos, przewijamy w dół, wpisujemy opis zmiany i zatwierdzamy klikajac“Commit changes”.

• Nastepnie tworzymy nowy plik pierwszy.txt klikajac przycisk “Create new file” w głównym widoku re-pozytorium. Wpisujemy cos i zatwierdzamy zmiany.

Pobranie i scalenie

Poniewaz dokonalismy zmian w repozytorium zdalnym, repozytorium lokalne jest nieaktualne. Sytuacja taka mozebyc czesta, zwłaszcza gdy projekt rozwijany jest zespołowo. Dlatego codzienna prace warto rozpoczynac od sciagnie-cia (ang. fetch) zmian zdalnych i scalenia ich (ang. merge) z wersja lokalna:

~$ cd mojprojekt~/mojprojekt$ git pull [origin] [master]

Opcjonalne argumenty okreslaja nazwy repozytorium zdalnego i lokalnej gałezi. Ewentualny komunikat “Alreadyup-to-date.” oznacza brak zmian na serwerze.

Zmiany lokalne

Praca w repozytorium lokalnym jest najwygodniejsza. Przecwiczmy typowe sytuacje. Zmienimy tresc plikuREADME.md i utworzymy plik drugi.txt.

~/mojprojekt$ echo "Pierwsza zmiana lokalna" >> README.md~/mojprojekt$ echo "Drugi plik" > drugi.txt~/mojprojekt$ git status~/mojprojekt$ git diff~/mojprojekt$ git add --all



~/mojprojekt$ git diff~/mojprojekt$ git diff --staged

• git diff – pokazuje róznice miedzy katalogiem roboczym a poczekalnia, ale bez plików niesledzonych;

• git add --all – dodaje do poczekalni wszystkie zmiany z katalogu roboczego;

• git diff --staged – pokaze zmiany miedzy poczekalnia a ostatnia migawka projektu.

Zauwazmy, ze po dodaniu zmian do poczekalni polecenie git diff nie pokazuje zadnych róznic.

Zróbmy teraz kolejna zmiane w pliku README.md i sprawdzmy status:

~/mojprojekt$ echo "Druga zmiana lokalna" >> README.md~/mojprojekt$ git status~/mojprojekt$ git diff~/mojprojekt$ git diff --staged

Jak widac, plik README.md ma dwie wersje! Jedna (poprzednia) znajduje sie w poczekalni, a aktualna w kataloguroboczym i ma status zmienionej. Chcac właczyc ja do najblizszej migawki, nalezałoby ja ponownie dodac poleceniemgit add. Zrobimy inaczej, zatwierdzimy zmiany:

~/mojprojekt$ git commit -m "Zmiana pliku README i inne"~/mojprojekt$ git status -vv~/mojprojekt$ git diff HEAD

Która wersja pliku README.md trafiła do migawki? Oczywiscie ta z poczekalni, o czym upewniaja nas ostatniepolecenia:

1.8. Git 31


• git status -vv – pokazuje stan repozytorium oraz wszystkie zmiany w sledzonych plikach;

• git diff HEAD – pokazuje wszystkie róznice miedzy ostatnia migawka a sledzonymi plikami.

Zatwierdzanie z pominieciem poczekalni mozna zrobic tak:

~/mojprojekt$ git commit -am "Druga zmiana README.md"~/mojprojekt$ git status

• git commit -am "komentarz" – zatwierdza zmiany wszystkich sledzonych plików (opcja -a).

Informacja: Komunikaty statusu typu: Your branch is ahead of ‘origin/master’ by 2 commits. – oznaczaja, ze mamyzatwierdzone lokalne zmiany nieprzesłane do repozytorium zdalnego.

Cofanie zmian

Wycofanie z poczekalni: utworzymy teraz katalog doc, a w nim pliki index.rst i slownik.txt z przykładowatrescia.

~/mojprojekt$ mkdir doc~/mojprojekt$ echo "Dokumenty" > doc/index.rst~/mojprojekt$ echo "Słownik" > doc/slownik.txt~/mojprojekt$ git add .~/mojprojekt$ git status~/mojprojekt$ git reset HEAD doc/slownik.txt~/mojprojekt$ git status

• git add . – dodaje wszystkie nowe i zmienione pliki do poczekalni;

• git reset HEAD nazwa_pliku – usuwa plik z poczekalni, w tym wypadku plik wraca do stanu “niesle-dzony”.



Zmiana i wycofanie zatwierdzenia – załózmy, ze po zatwierdzeniu zmian dokonalismy kolejnych poprawek i uzna-lismy, ze powinny zostac uwzglednione w ostatniej migawce:

~/mojprojekt$ git commit -m "Poczatek dokumentacji"~/mojprojekt$ echo "Spis tresci" >> doc/index.rst~/mojprojekt$ git add .~/mojprojekt$ git commit --amend -m "Poczatek dokumentacji poprawiony"~/mojprojekt$ git reset --soft HEAD~1

• git commit --amend – poprawia (ang. amend) poprzednie zatwierdzenie, tj. dodaje zmiany z poczekalnii ewentualnie zmienia komentarz;

• git reset --soft HEAD~1 – wycofuje ostatnia migawke.

Informacja: HEAD podobnie jak master jest nazwa wskaznika, ale odnosi sie do aktualnej migawki. Zazwyczajwskazniki master i HEAD oznaczaja to samo miejsce, ale jezeli przełaczymy sie do innej gałezi, albo cofniemy dowczesniejszej migawki wskaznik HEAD zostanie przesuniety.

Wycofanie zmian z katalogu roboczego: wykonamy teraz kolejne polecenia, aby zobaczyc, jak cofac zmiany niedo-dane do poczekalni:

~/mojprojekt$ echo "Katalog projektu" > doc/katalog.rst~/mojprojekt$ echo "Słownik" > doc/slownik.rst~/mojprojekt$ git add .~/mojprojekt$ echo "Dokumentacja projektu" >> doc/katalog.rst~/mojprojekt$ git diff~/mojprojekt$ git checkout -- doc/katalog.rst~/mojprojekt$ cat doc/katalog.rst

1.8. Git 33


Ostrzezenie: Polecenie git checkout -- nazwa_pliku usuwa wprowadzone zmiany bezpowrotnie.

Historia zmian

Zatwierdzimy dotychczasowe zmiany, przejrzymy liste i sprawdzimy, jak wygladała pierwsza wersja plikuREADME.md:

~/mojprojekt$ git commit -m "Dodanie katalogu doc"~/mojprojekt$ git log~/mojprojekt$ git checkout 869d7~/mojprojekt$ cat README.md~/mojprojekt$ git checkout master~/mojprojekt$ cat README.md

• git log – pokazuje historie zmian, kazda zmiana oznaczona jest unikalnym skrótem typucommit 869d7...; wypróbuj: git log --pretty=oneline --decorate oraz git log--pretty=format:"%h -%s";

• git checkout 869d7 – przełacza nas do migawki oznaczonej podanym poczatkiem skrótu;

• git checkout master – powracamy do ostatniej migawki w głównej gałezi.

Synchronizacja

Pozostaje przesłanie zatwierdzonych zmian do repozytorium zdalnego:

1.8. Git 35


~/mojprojekt$ git status~/mojprojekt$ git push

• git push – przesyła zmiany lokalne do repozytorium zdalnego; wymaga podania nazwy uzytkownika i hasłado konta na GitHubie.

Operacje na plikach

Wskazówka: Nie nalezy usuwac sledzonych plików/katalogów lub zmieniac ich nazw za pomoca narzedzi syste-mowych, np. menedzera plików, poniewaz Git nie bedzie nic o tym wiedział i zasypie nas wieloma komunikatamipodczas sesji.

Usuwanie plików i zmiany nazw realizujemy za pomoca nastepujacych polecen:

~/mojprojekt$ git rm --cached pierwszy.txt~/mojprojekt$ git mv doc/katalog.rst doc/projekt.rst~/mojprojekt$ git status~/mojprojekt$ git rm -f "*.txt"~/mojprojekt$ git status~/mojprojekt$ git commit -am "Porzadki w projekcie"

• git rm --cached – usuwa pliki sledzone z poczekalni, ale nie z dysku;

• jezeli maja byc usuniete równiez z dysku, uzywamy tylko git rm;

• git mv – pozwala przeniesc lub zmienic nazwe pliku;

• git rm -f – usuwa sledzone pliki z poczekalni i z dysku, wymaga przełacznika -f, jezeli usuwany plik maniezatwierdzone zmiany.

Konflikty wersji

W czasie pracy nad projektem zdarzyc sie moze, ze jakis plik został zmieniony zarówno w repozytorium zdalnym, np.przez współpracownika, jak i lokalnie przez nas. Jezeli nie sciagnelismy ostatniej zdalnej wersji pliku, próba wysłanianaszych zmian na serwer wywoła komunikat o konflikcie. Przecwiczmy taka mozliwosc.

• W repozytorium zdalnym zmieniamy plik pierwszy.txt,

• lokalnie dodajemy usuniety wczesniej plik pierwszy.txt i wprowadzamy zmiany,

• zatwierdzamy zmiany i próbujemy wgrac je na serwer:



~/mojprojekt$ git status~/mojprojekt$ git add .~/mojprojekt$ echo "Zmiana lokalna w pierwszym" >> pierwszy.txt~/mojprojekt$ git commit -am "Zmiana w pierwszym"~/mojprojekt$ git push

Powyzszy komunikat zawiera sugestie, co zrobic. Zastosujemy sie do niej i pobierzemy zmiany z serwera:

~/mojprojekt$ git pull

Konflikt dotyczy pliku pierwszy.txt. Zawartosc pobrana z serwera nie zgadza sie z lokalna. Zgodnie z podpo-wiedzia: fix conflicts and then commit the result – rozwiazemy konflikty i zatwierdzimy rezultat.W dowolnym edytorze otwieramy zatem plik:

Git uzywa znaczników, aby wskazac róznice:

• <<<<<<< HEAD – poczatek róznic;

1.8. Git 37


• ======= – separator zmian lokalnych i zdalnych;

• >>>>>>> skrót – znacznik konca bloku róznic.

Usuwamy znaczniki, zapisujemy ostateczna wersje pliku, nastepnie zatwierdzamy i wysyłamy zmiany na serwer:

~/mojprojekt$ cat pierwszy.txt~/mojprojekt$ git commit -am "Rozwiazanie konfliktu w pierwszy.txt"~/mojprojekt$ git push

Gałezie

Gałaz (ang. branch) słuza testowaniu nowego kodu. Mozna utworzyc wiele gałezi, rozwijac kod w kazdej z nichniezaleznie, a nastepnie scalac wybrane zmiany.

Informacja: Formalnie gałaz jest wskaznikiem, czyli nazwa odsyłajaca do któregos z zestawu zmian zachowanych wrepozytorium. Domyslna gałaz nazywa sie master i tworzona jest przez polecenie git init. Podczas zatwierdzaniazmian wskaznik master przesuwany jest tak, aby wskazywał na ostatnia migawke.

Utworzymy teraz nowa gałaz, przełaczymy sie do niej, wprowadzimy kilka zmian i zatwierdzimy je:

~/mojprojekt$ git branch testy~/mojprojekt$ git checkout testy~/mojprojekt$ git branch -vv~/mojprojekt$ git status~/mojprojekt$ echo "Zmiany testowe" > test.txt~/mojprojekt$ echo "Eksperyment" >> pierwszy.txt~/mojprojekt$ git add .~/mojprojekt$ git commit -m "Test nowych funkcji"~/mojprojekt$ ls



• git branch nazwa_gałezi – tworzy gałaz o podanej nazwie;

• git checkout nazwa_gałezi – przełacza na podana gałaz;

• git checkout -b testy – tworzy gałaz i przełacza do niej (zastepuje dwa poprzednie polecenia);

• git branch -vv – wyswietla informacje o gałeziach.

Informacja: Git uzywa specjalnego wskaznika HEAD wskazujacego aktualna gałaz. Uzyj git log--pretty=oneline --decorate, aby zobaczyc, na która gałaz wskazuje.

Wrócimy teraz do gałezi master i scalimy z nia zmiany z gałezi testy:

~/mojprojekt$ git checkout master~/mojprojekt$ ls~/mojprojekt$ git merge testy~/mojprojekt$ git branch -d testy

• git merge nazwa_gałezi – scala zmiany z podanej gałezi z aktualna;

• git branch -d nazawa_gałezi – usuwa gałaz (jesli jest juz niepotrzebna).

Informacja: Zmiana aktywnej gałezi przywraca katalog roboczy do stanu z ostatniej migawki w danej gałezi. Wnaszym przykładzie zwróc uwage, ze po przełaczeniu sie do gałezi master z gałezi testy “zniknał” plik text.txt.

1.8. Git 39


Pomijanie plików

Nie wszystkie typy plików powinny byc synchronizowane miedzy repozytorium lokalnym i zdalnym. Np. pliki po-srednie tworzone przez kompilatory i interpretery, pliki tymczasowe, wirtualne srodowiska itp. zapychałyby namniepotrzebnie repozytorium zdalne. Git pozwala zdefiniowac liste ignorowanych plików za pomoca wyrazen wielo-znacznych zapisanych w ukrytym pliku (rozpoczyna sie kropka!) .gitignore, który umieszczamy w głównymkatalogu projektu.

• Przykładowa zawartosc pliku .gitignore.

• Wzorce dla róznych jezyków programowania.

Informacje dodatkowe

Mozliwe jest utworzenie repozytorium lokalnego nie przez klonowanie, ale od podstaw. Na poczatku tworzymykatalog projektu i wchodzimy do niego:

~$ mkdir mojprojekt; cd mojprojekt~/mojprojekt$ git init

• git init – polecenie tworzy ukryty katalog .git, czyli repozytorium.

Połozenie i nazwa katalogu, w którym tworzymy repozytorium sa dowolne.

Repozytorium lokalne nalezy połaczyc i zsynchronizowac ze zdalnym, które musi byc utworzone w serwisie GitHub.W terminalu wydajemy polecenia:

~/mojprojekt$ git remote add origin https://github.com/nazwa_konta/mojprojekt.git~/mojprojekt$ git push -u origin master

• git remote add – dodaje zdalne repozytorium okreslone przez Git URL do lokalnego;

• git push – synchronizuje zawartosc lokalnego repozytorium ze zdalnym. o domyslnej nazwie origin.

Informacja: Nazwa master jest domyslna gałezia Gita tworzona podczas inicjacji repozytorium. Technicznie jestto wskaznik odnoszacy sie do ostatniej zatwierdzonej migawki. Po synchronizacji repozytoriów lokalna gałaz masterzaczyna sledzic zdalna o takiej samej nazwie.

Nazwa origin to domyslne okreslenie repozytorium zdalnego.

Cheat Sheet

• git config --global – konfiguruje ustawienia user.name, user.email, push.default;


https://github.com/github/gitignore


• git init – inicjuje repozytorium Gita;

• git status – pokazuje stan repozytorium;

• git status -vv – pokazuje stan repozytorium oraz zmiany;

• git status -sb – pokazuje stan repozytorium oraz zmiany w skrócie;

• git add nazwa_pliku/katalogu – rozpoczyna sledzenie pliku/katalogu, dodaje zmiany do poczekalni;

• git -all lub -A – dodanie wszystkich zmian do poczekalni;

• git add '*.txt' – dodanie do poczekalni wszystkich plików tekstowych;

• git add . – dodanie plików nowych i zmienionych, ale nie usunietych;

• git -u – dodanie zmienionych i usunietych, ale nie nowych;

• git commit -m "opis zmiany" – tworzy migawke ze zmian znajdujacych sie w poczekalni;

• git -am "opis zmiany" – tworzy migawke z wszystkich zmian pomijajac poczekalnie;

• git commit --amend -m "opis zmiany" – uzupełnia i aktualizuje ostatnia migawke;

• git remote add origin GitURL – dodaje repozytorium zdalne do lokalnego;

• git clone GitURL [katalog] – klonuje repozytorium zdalne do katalogu lokalnego;

• git push [-u] [origin] [master] – wysyła zmiany lokalne do repozytorium zdalnego;

• git diff – pokazuje zmiany w katalogu roboczym;

• git diff --staged – pokazuje zmiany pomiedzy katalogiem roboczym a poczekalnia;

• git diff HEAD – pokazuje zmiany w porównaniu do ostatniej migawki;

• git reset HEAD plik – wycofuje zmiane pliku z poczekalni;

• git reset --soft HEAD~1 – wycofuje ostatnia migawke;

• git checkout -- plik – cofa zmiane pliku w katalogu roboczym;

• git checkout skrót/tag/gałaz – pozwala przejsc do stanu wskazanego przez skrót migawki, tag lubnazwe gałezi, np. master;

• git checkout -b gałaz – tworzy podana gałaz i przełacza do niej;

• git log – wyswietla historie zmian, opcja: --pretty=oneline --decorate, -p – historia zawartoscizmian, --stat – lista zmienianych plików;

• git rm --cached plik – usuwa plik z poczekalni, ale nie z katalogu roboczego;

• git rm -f plik – usuwa plik z poczekalni i katalogu roboczego;

• git mv stara nowa – zmienia stara nazwe na nowa;

• git branch gałaz – tworzy gałaz, opcje: -vv – informacje o gałeziach, -d gałaz – usuwa gałaz;

• git merge gałaz – scala zmiany z podanej gałezi do aktualnej;

• git remote -v – lista zdalnych repozytoriów połaczonych z lokalnym;

• git remote add nazwa GitURL – dodanie zdalnego repozytorium jako nazwa do lokalnego.

1.8. Git 41


Materiały

Wskazówka:

• Jezeli podczas tworzenia repozytorium na GitHubie zaznaczymy opcje Initialize this repository with a RE-ADME, utworzony zostanie plik, w którym umieszcza sie opis projektu.

• Do wygodnej pracy w systemie Windows mozna skonfigurowac Git w powłoce PowerShell

Informacja: Uwagi dla uzytkowników powłoki cmd.exe w Windows:

• separatorem w sciezkach jest znak backslash \, w wyrazeniach wieloznacznych uzywamy podwójnych cudzy-słowów, np. "*.txt";

• polecenia konsoli sa inne:

– md mojprojekt – utworzy katalog projektu (odpowiednik mkdir);

– rd /s /q mojprojekt – usunie katalog projektu (odpowiednik rm -rf);

– type doc\katalog.rst – pokaze zawartosc pliku (odpowiednik cat).

Odwiedz

1. Strona projektu Git.

2. Pro Git v. 1 – wersja polska.

3. Python 101 – Git (materiał w j. polskim)

4. Git Cheat Sheet

5. Pro Git v. 2 – wersja angielska.


ReStructuredText i Sphinx

Git dobrze nadaje sie do prowadzenia projektów nie tylko typowo programistycznych, ale równiez dokumentacyjnychi szkoleniowych, a wiec zawierajacych nie tylko kod, ale przede wszystkim instrukcje, poradniki, scenariusze, itp.

W katalogu naszego projektu zakładamy katalog podrzedny o nazwie np. docs, w którym tworzyc bedziemy naszadokumentacje.

~/nazwa_projektu$ mkdir docs

Dokumenty zapisywane beda w formacie reStructuredText, czyli za pomoca tekstowego jezyka znaczników, w plikachz rozszerzeniem .rst. Zawartosc tych plików moze byc pózniej przetworzona do postaci formatów docelowych,takich jak HTML, PDF czy LaTeX. Zadanie to realizowane bedzie przez narzedzie Sphinx napisane w Pythonie isłuzace m.in. do tworzenia dokumentacji tego jezyka.


https://git-scm.com/book/be/v2/Git-in-Other-Environments-Git-in-Powershell

http://git-scm.com/

https://git-scm.com/book/pl/v1

http://python101.readthedocs.io/pl/latest/git/index.html

https://services.github.com/on-demand/downloads/github-git-cheat-sheet.pdf

https://git-scm.com/book/en/v2

http://pl.wikipedia.org/wiki/ReStructuredText

http://sphinx-doc.org/


Instalacja Sphinksa

Przede wszystkim potrzebujemy interpretera Pythona i narzedzia instalacji modułów dodatkowych pip – zobacz wsekcji Interpreter Pythona. Nastepnie wydajemy polecenia:

~$ sudo apt-get install mercurial~$ sudo pip install sphinx_rtd_theme hg+https://bitbucket.org/birkenfeld/sphinx#sphinx

W Archu:~# pacman -S mercurial~# pip install sphinx_rtd_theme hg+https://bitbucket.org/birkenfeld/sphinx#sphinx

Informacja: Instalacja klienta systemu kontroli wersji Mercurial wynika z tego, ze korzysta z niego projekt Sphinx.Instalacja tematu sphinx_rtd_theme jest opcjonalna, domyslny temat wyglada tak, jak w dokumentacji Pythona.

Teraz mozemy przejsc do konfiguracji Sphinksa, która sprowadza sie do wygenerowania pliku z ustawieniami o nazwieconf.py. W głównym katalogu tworzonej dokumentacji, czyli docs, wydajemy polecenie:

~$ sphinx-quickstart

Na wiekszosc pytan kreatora odpowiadamy nacisnieciem Enter, przyjmujac ustawienia domyslne. Zwrócic uwagenalezy na:

• Project name: – wpisujemy nazwe naszego projektu;

• Author name(s): – wpisujemy autora;

• Project version: – podajemy wersje, np. 1;

• Project release: – podajemy wydanie, np. 0;

• Project langiage [en]: – okreslamy jezyk jako pl;

• Please indicate... Sphinx extensions: – odpowiadajac y dołaczamy rozszerzenia, moznawłaczyc: autodoc, doctest, pngmath i viewcode – przydaja sie w dokumentacji Pythona. Zobacz:lista rozszerzen Sphinksa;

• Create Makefile? – odpowiadamy y, dzieki czemu budowanie dokumentacji sprowadzi sie do wydaniapolecenia make html.

Po skonfigurowaniu Sphinksa w katalogu docs powinny znalezc sie pliki: conf.py,Makefile,make.bat iindex.rst, a takze katalogi _build,_static,_templates.

Jezeli chcemy uzywac tematu sphinx_rtd_theme na koncu pliku conf.py dopisujemy:

try:import sphinx_rtd_themehtml_theme = "sphinx_rtd_theme"html_theme_path = [sphinx_rtd_theme.get_html_theme_path()]

except:pass

Tworzenie dokumentacji

Na poczatku warto dostosowac plik główny, czyli index.rst. Jest on nasza “strona główna”, zawiera m. in.dyrektywe tworzaca spis tresci:

1.9. ReStructuredText i Sphinx 43

http://pl.wikipedia.org/wiki/Mercurial

https://docs.python.org/2.7/whatsnew/2.7.html

http://sphinx-doc.org/latest/extensions.html


Welcome to Projekt ILO's documentation!=======================================

Contents:

.. toctree:::maxdepth: 2

Serwis eCG <http://ecg.vot.pl/>cwiczenia/indexprogramowanie/index

Indices and tables==================

* :ref:`genindex`

* :ref:`modindex`

* :ref:`search`

Jak widac domyslne komunikaty sa w jezyku angielskim, nalezy wiec je spolszczyc zmieniajac tresc według uznania.Dyrektywa .. toctree:: generuje spis tresci na podstawie wskazanych plików. W powyzszym listingu do-dano dwa przykładowe wpisy wskazujace pliki index.rst umieszczone we wskazanych podkatalogach. Sphinxodczytuje nagłówki z tych plików i umieszcza w spisie. Domyslnie sczytywane sa dwa poziomy zagniezdzenia(:maxdepth: 2). Gdybysmy chcieli miec numeracje, dodalibysmy opcje: :numbered:. Pokazano równiez,jak dodawac stałe linki w spisie (Serwis eCG ...).

Z sekcji indeksów (Indices ...) mozna usunac wszystkie spisy lub zostawic wybrane, np. genindex udostep-nia indeks zdefiniowanych terminów i pojec.

Dokumenty w katalogu docs warto kategoryzowac i umieszczac w osobnych katalogach. Nazwy plików moga bycdowolne, chociaz dobrze jest przyjac jakas przejrzysta konwencje. Poszczególne pliki nalezy traktowac jako kolejnestrony w wersji HTML.

Podstawy reST

Zeby zrozumiec proste w gruncie rzeczy zasady formatowania reST najlepiej podgladac kod gotowych stron! Wystar-czy w nagłówku kliknac link View page source, skopiowac, wkleic i wypełnic własna trescia. Zacznij od strony, któraczytasz...

Jezeli chcesz rozumiec, czytaj dalej. Podstawowe zasady sa nastepujace:

• Wciecia sa wazne!

• Akapity itp. oddzielamy pustym wierszem.

• *pochylenie*, **pogrubienie**

• ‘‘przykład kodu‘‘

Nagłówki

Kolejne poziomy nagłówków tworzymy poprzez podkreslanie ich sekwencjami znaków:

Czesc 1##############



Rozdział 2**************

Sekcja 3==============

Podsekcja 4--------------

Podpodsekcja 5^^^^^^^^^^^^^^

Akapit 6""""""""""""""

Wybór znaków nie jest narzucony, ale najlepiej trzymac sie jednej konwencji, np. powyzszej.

Dyrektywy

Ogólna postac dyrektyw to:

.. <nazwa>:: <argumenty>:<opcja>: <wartosc>

tresc

Uzyteczne dyrektywy:

• .. image:: sciezka/plik.jpg – pozwala wstawic obrazek

• .. figure:: sciezka/plik.jpg – pozwala wstawic obrazek z etykieta

• .. note:: – warte zauwazenia

• .. tip:: – wskazówka

• .. warning:: – ostrzezenie

• .. highlight:: cpp – formatuj kod jako cpp (lub python, bash, html itd.)

• .. literalinclude:: sciezka/test.cpp – wstaw kod z podanego pliku

• .. code block:: cpp – tresc ponizej to kod w cpp (lub python, bash, html itd.)

• .. raw:: html – interpretuj tresc ponizej jako HTML

• .. include:: sciezka/plik.rst – wstaw tresc z innego pliku

Listy

Aby uzyskac liste wypunktowana lub numerowana stosujemy:

* punkt

* punkt drugi zawieradwie linie

1. punkt 12. punkt 2



#. automatyczne numerowanie#. automatyczne numerowanie

Linki

• `Nagłówek`_ – link do nagłówka w biezacym dokumencie

• .. _Strona Pythona: http:\\www.python.org – definicja linku, `Strona Pythona`_ –wstawienie linku

• `Strona Pythona <http:\\www.python.org>`_ – tak tez mozna

• .. _nazwa-linku: – definicja linku w dokumentacji, :ref:`zobacz tutaj <nazwa-linku>`– wstawienie linku

Wskazówka: Powtórzmy, najlepsza metoda poznania składni reST jest przegladanie zródeł gotowych plików.

Budowanie dokumentacji

W katalogu głównym dokumentacji, czyli docs wydajemy polecenie:

~/projekt/docs$ make html

W terminalu zobaczymy komunikaty, niektóre z nich beda informacja o błedach w formatowaniu, które musimyusunac. Gotowa wersja zostanie umieszczona w katalogu _build/html. Mozemy go wgrac do sieci, mozemyspakowac i udostepnic – po otwarciu pliku index.html w przegladarce zobaczymy efekt naszej pracy.

Od czasu do czasu, zwłaszcza po wielu zmianach połozenia plików i katalogów, budowanie dokumentacji wartopoprzedzic usunieciem poprzedniej wersji HTML:

~/projekt/docs$ make clean

Dokumentacja online

Projekty hostowane w serwisie GitHub łatwo podpiac do serwisu Read the Docs, który umozliwia automatycznegenerowanie wersji HTML, PDF, a nawet Epub (chociaz przy wykorzystaniu stabilnej, a nie testowej wersji Sphinksa)i udostepnianie jej online.

W tym celu trzeba załozyc konto na stronie Read the Docs – Sign Up. Po zalogowaniu importujemy projekt z GitHuba(ang. Import a Project – Import from GitHub) i po potwierdzeniu domyslnych opcji mozemy cieszyc wersja onlinedostepna pod adresem typu: http://nazwa_projektu.readthedocs.org. Wersje PDF sciagniemy po zalogowaniu, wejsciuna strone projektu, wybraniu zakładki Downloads i linku latest PDF.

Materiały

1. First Steps with Sphinx

2. Wprowadzenie do składni Sphinx reST

3. Docutils

4. Składnia reST & Sphinx


https://github.com/

https://readthedocs.org/

https://readthedocs.org/accounts/signup/

http://nazwa_projektu.readthedocs.org

http://sphinx-doc.org/tutorial.html

http://sphinx-doc.org/rest.html

http://docutils.sourceforge.net/

http://thomas-cokelaer.info/tutorials/sphinx/rest_syntax.html

ROZDZIAŁ 2

Biblioteka Qt

Ponizej przedstawiamy realizacje przykładowej aplikacji w Qt 5.

Adresy (Qt5)

Niniejszy scenariusz pokazuje, jak zaczac programowanie z wykorzystaniem biblioteki Qt w wersji 5 przy uzyciudedykowanego srodowiska IDE Qt Creator. Celem jest stworzenie prostej 1-okienkowej ksiazki adresowej, w którejmozna dodawac dane adresowe powiazane z okreslona nazwa, np. imieniem i nazwiskiem.

• Nowy projekt

• Tworzenie interfejsu

• Deklaracje i implementacje

• Sygnały i sloty

• Dodawanie adresów

• Tryb nawigacji

• Edycja i usuwanie

• Materiały

Nowy projekt

Po uruchomieniu aplikacji Qt Creator wybieramy przycisk “New Project”, który uruchamia kreatora aplikacji.

W pierwszym oknie “Applications” i “Qt Widget Applications”, co oznacza, ze chcemy utworzyc program z inter-fejsem graficznym oparty na klasie QWidget. W nastepnym oknie podajemy nazwe projektu, np, “adresy”, orazwskazujemy sciezke do katalogu, w którym beda zapisywane pliki wchodzace w skład projektu. W nastepnym okniewybieramy tzw. “kit”, czyli zestaw definiujacy docelowe srodowisko, kompilator itp. ustawienia. Dostepne zestawymusza byc wczesniej okreslone w ustawieniach Qt Creatora

Kolejne okno pozwala definiowac nazwe klasy głównej i klase podstawowa, podajemy “adresy” i wybieramy “QWid-get”. W nastepnym ostatnim oknie niczego nie zmieniamy, konczymy kliknieciem przycisku “Finish”.

Efektem działania kreatora bedzie utworzenie nastepujacych plików:

49


1) adresy.h - plik nagłówkowy, tutaj bedziemy deklarowac wszystkie uzywane w programie obiekty(elementy interfejsu), a takze publiczne sloty, czyli funkcje powiazanie z okreslonymi sygnałami (zdarze-niami).

2) adresy.cpp - plik zródłowy, tu znajdzie sie kod tworzacy obiekty interfejsu, łaczacy sygnały zeslotami, a wreszcie implementacja slotów.

3) main.cpp - plik zródłowy, w którym tworzona i uruchamiana jest instancja naszej aplikacji.

4) adresy.ui - jak wskazuje rozszerzenie (“ui” - ang. user interface), plik zawierac bedzie opis gra-ficznego interfejsu aplikacji zapisany za pomoca znaczników XML.

Tworzenie interfejsu

Zaczniemy od utworzenia głównego okna naszej aplikacji. W tym celu dwa razy klikamy plik adresy.ui i przechodzimydo tworzenia formularza.

Na poczatku klikamy obiekt “Grid Layout” z kategorii “Layouts” i rysujemy prostokat na formularzu tak, aby niewypełniał go w całosci. Dodana kontrolka umozliwia porzadkowanie innych elementów tworzacych interfejs w pro-stokatnej siatce. Dalej dodamy dwie etykiety, czyli obiekty “Label” z kategorii “Display Widgets”. Staramy sie jeumiescic jedna nad druga w dodanej przed chwila siatce.

Wskazówka: Po wybraniu obiektu i najechaniu na Grid Layout nalezy obserwowac niebieskie podswietlenia, którepojawiaja sie w pionie i poziomie, wskazuja one, gdzie umieszczony zostanie dodawany obiekt.

Po dwukrotnym kliknieciu na dodane etykiety mozemy zmienic tresc przez nie wyswietlana. Modyfikujemy w tensposób własciwosc text danego obiektu. Etykieta górna powinna zawierac tekst “Nazwa”, dolna - “Adresy”.

Informacja: Lista wszystkich obiektów wyswietlana jest po prawej stronie na górze w oknie Hierarchia obiektów.W kolumnie Obiekt widzimy tam nazwy dodanych obiektów, a w kolumnie Klasa nazwy klas, które reprezentuja.Po wskazaniu mysza dowolnego obiektu mozemy edytowac wszystkie jego własciwosci ponizej. Np. nazwe obiektuzmienimy w polu objectName.

Nazwe etykiety górnej ustalamy na “nazwaLbl”, dolnej - na “adresyLbl”.

Wskazówka: Konwencji nazywania obiektów jest wiele, wazne zeby konsekwentnie trzymac sie wybranej. Tutajproponujemy uwzglednianie w nazwie typu obiektu przy uzyciu skrótu pisanego z duzej litery, np. “nazwaLbl”.

Po prawej stronie etykiety “Nazwa” dodajemy kontrolke Line Edit z grupy Input Widgets o nazwie “nazwaLine”.Ponizej, czyli w drugiej kolumnie, tworzymy obiekt Text Edit z tej samej grupy, co poprzedni o nazwie “adresText”.Powinnismy uzyskac ponizszy układ:

Czas na dodanie przycisków pozwalajacych inicjowac działanie aplikacji. Dodajemy wiec 5 przycisków PushButton zkategorii Buttons po prawej stronie i poza(!) obiektem GridLayouts jeden pod drugim. Na samym dole umieszczamykontrolke Vertical Spacer z kategorii Spacers. Nastepnie zaznaczamy wszystkie dodane obiekty, obrysowujac jemyszka, i klikamy ikone Rzmiesc w pionie (CTRL+L) na pasku narzedziowym. Teraz stworzona grupe przeciagamyna siatke jako 3. kolumne.

Musimy zmienic nazwy i tekst dodanych przycisków. Od góry ustawiamy kolejne własciwosci (nazwa/tekst): “do-dajBtn/Dodaj”, “zapiszBtn/Zapisz”, “anulujBtn/Anuluj”, “edytujBtn/Edytuj”, “usunBtn/Usun”. W efekcie powinni-smy uzyskac nastepujaca formatke:

Musimy dodac jeszcze 3 przyciski pozwalajace na nawigacje miedzy adresami i wyjscie z programu. Ponizej obiektusiatki umieszczamy wiec 2 przyciski (PushButton), zaznaczamy je i klikamy ikone Rozmiesc poziomo w splitterze,

50 Rozdział 2. Biblioteka Qt


2.1. Adresy (Qt5) 51


nastepnie przeciagamy grupe na dół 2. kolumny siatki. Na koniec dodajemy jeszcze jeden przycisk na dole 3. ko-lumny. Dodanym obiektom zmieniamy własciwosci (nazwa/tekst): “poprzBtn/Porzedni”, “nastBtn/Nastepny”, “ko-niecBtn/Koniec”.

Na koniec zaznaczamy formularz główny, na którym znajduja sie wszystkie elementy interfejsu i klikamy przyciskRozmiesc w siatce (CTRL+G). Dzieki temu kontrolki beda skalowane wraz ze zmiana rozmiaru okna.

W sumie uzyskujemy ponizszy projekt:

Mozemy uruchomic nasza aplikacje, wybierajac Budowanie/Uruchom (CTRL+R) lub klikajac trzecia od dołu ikonezielonego trójkata w lewej kolumnie Qt Creatora. Powinnismy zobaczyc podobne do ponizszego okno:

Deklaracje i implementacje

Po dodaniu elementów interfejsu musimy zadeklarowac zmienne, za pomoca których bedziemy mogli nimi manipu-lowac. Przechodzimy do pliku adresy.h i wprowadzamy ponizsze zmiany:

1 #ifndef ADRESY_H2 #define ADRESY_H3

4 #include <QWidget>5 #include <QLineEdit>6 #include <QTextEdit>7 #include <QPushButton>8 #include <QTextCodec>9

10 namespace Ui {11 class adresy;12 }



13

14 class adresy : public QWidget15 {16 Q_OBJECT17

18 public:19 explicit adresy(QWidget *parent = 0);20 ~adresy();21

22 private:23 Ui::adresy *ui;24 QPushButton *dodajBtn;25 QPushButton *zapiszBtn;26 QPushButton *anulujBtn;27 QPushButton *poprzBtn;28 QPushButton *nastBtn;29 QPushButton *edytujBtn;30 QPushButton *usunBtn;31 QPushButton *koniecBtn;32 QLineEdit *nazwaLine;33 QTextEdit *adresText;34 };35

36 #endif // ADRESY_H

Na poczatku musimy zaimportowac klasy, z których skorzystalismy przy budowie interfejsu. Najwazniejsza jestklasa podstawowa wszystkich elementów interfejsu, czyli QWidget. Kolejne trzy odpowiadaja wykorzystanym przeznas kontrolkom edycyjnym i przyciskom. Dodatkowa klasa QTextCodec pozwoli poprawnie wyswietlac polskie



znaki. W wewnatrz naszej klasy głównej, której deklaracja rozpoczyna sie w linii 14., deklarujemy prywatne (private)własciwosci, których nazwy odpowiadaja nazwom wczesniej dodanych elementów interfejsu graficznego. Formalniekazda zmienna jest wskaznikiem do obiektu odpowiedniego typu.

W pliku adresy.cpp korzystamy ze zadekarowanych zmiennych, aby ustawic poczatkowe własciwosci obiektówskładajacych sie na interfejs uzytkownika.

1 #include "adresy.h"2 #include "ui_adresy.h"3

4 adresy::adresy(QWidget *parent) :5 QWidget(parent),6 ui(new Ui::adresy)7 {8 ui->setupUi(this);9

10 QTextCodec::setCodecForLocale(QTextCodec::codecForName("UTF-8"));11

12 nazwaLine = new QLineEdit;13 nazwaLine = ui->nazwaLine;14 nazwaLine->setReadOnly(true);15

16 adresText = new QTextEdit;17 adresText = ui->adresText;18 adresText->setReadOnly(true);19

20 dodajBtn = new QPushButton;21 dodajBtn = ui->dodajBtn;22

23 zapiszBtn = new QPushButton;24 zapiszBtn = ui->zapiszBtn;25 zapiszBtn->hide();26

27 anulujBtn = new QPushButton;28 anulujBtn = ui->anulujBtn;29 anulujBtn->hide();30

31 nastBtn = new QPushButton;32 nastBtn = ui->nastBtn;33 nastBtn->setEnabled(false);34

35 poprzBtn = new QPushButton;36 poprzBtn = ui->poprzBtn;37 poprzBtn->setEnabled(false);38

39 edytujBtn = new QPushButton;40 edytujBtn = ui->edytujBtn;41 edytujBtn->setEnabled(false);42

43 usunBtn = new QPushButton;44 usunBtn = ui->usunBtn;45 usunBtn->setEnabled(false);46

47 koniecBtn = new QPushButton;48 koniecBtn = ui->koniecBtn;49 koniecBtn->setEnabled(true);50

51 setWindowTitle(trUtf8("Prosta ksiazka adresowa"));52 }



53

54 adresy::~adresy()55 {56 delete ui;57 }

W obrebie konstruktora głównej klasy naszej aplikacji o nazwie adresy, którego definicja rozpoczyna sie w linii4., tworzymy instancje klas uzytych w interfejsie graficznym. Do zmiennych zadeklarownych w pliku adresy.hprzypisujemy obiekty utworzone za pomoca operatora new, a nastepnie definiujemy ich poczatkowe własciwosci.

Konstruktorowi odpowiada zawzwyczaj destruktur, a wiec działanie, które usuwa stworzony obiekt, w tym wypadkuinterfejs uzytkownika: adresy::~adresy().

Aby okreslic stan elementów interfejsu wykorzystujemy odpowiednie własciwosci i metody reprezentujacychje obiektów. Np. własciwosc setReadOnly(true) blokuje edycje danego elementu, a własciwoscsetEnabled(false) uniemozliwia klikniecie danego przycisku. Metoda hide() ukrywa obiekt.

Instrukcja QTextCodec::setCodecForLocale(QTextCodec::codecForName("UTF-8")) okreslakodowanie komunikatów w standardzie “UTF-8” uzywanych w aplikacji, które wprowadzane sa dalej za pomocafunkcji trUtf8(). Tak dzieje sie np. podczas okreslania tytułu okna w wywołaniu setWindowTitle().

Wskazówka: W srodowisku MS Windows kodowanie powinno zostac ustawione na Windows-1250.

Dzieki powyzszym uzupełnieniom po uruchomieniu aplikacji pola nazwy i adresu beda nieaktywne, bedziemy moglinatomiast uzyc przycisków Dodaj, aby utworzyc nowy wpis, lub Koniec, aby zakonczyc aplikacje.



Sygnały i sloty

Działanie aplikacji z interfejsem graficznym polega w uproszczeniu na reagowaniu na działania uzytkownika, takiejak np. klikniecie, nacisniecie klawisza, przeciagniecie itp. Wszystkie zdarzenia generowane z poziomu interfejsuuzytkownika w terminologii biblioteki Qt emituja tzw. sygnały. Programista decyduje o tym, które z nich i jak saobsługiwane, definiujac tzw. sloty, czyli funkcje powiazane z okreslonymi zdarzeniami. Mechanizm sygnałów islotów umozliwia komunikacje miedzy obiektami aplikacji.

Kazda z funkcji obsługujacych zdarzenia musi zostac najpierw zadeklarowana w pliku adresy.h w sekcji publicslots:, ich implementacje musimy dopisac pózniej do pliku adresy.cpp.

18 public:19 explicit adresy(QWidget *parent = 0);20 ~adresy();21

22 enum Tryb { nawigujT, dodajT, edytujT };23

24 public slots:25 void dodajKontakt();26 void koniec();27

28 private:29 Ui::adresy *ui;30 QPushButton *dodajBtn;31 QPushButton *zapiszBtn;32 QPushButton *anulujBtn;33 QPushButton *poprzBtn;34 QPushButton *nastBtn;35 QPushButton *edytujBtn;36 QPushButton *usunBtn;37 QPushButton *koniecBtn;38 QLineEdit *nazwaLine;39 QTextEdit *adresText;40

41 Tryb aktTryb;42 void aktGui(Tryb tryb);43 QString staraNazwa;44 QString staryAdres;45 QMap<QString,QString> kontakty;46

47 };48

49 #endif // ADRESY_H

Oprócz deklaracji slotów w liniach 24-26 dopisujemy deklaracje kilku potrzebnych zmiennych. Definiujemy wiectyp wyliczeniowy Tryb, z którego korzystamy deklarujac zmienna aktTryb oraz prywatna funkcje pomocniczaaktGui. Posłuza one do okreslania 1 z 3 stanów działania aplikacji, takich jak: przegladanie wpisów, dodawanie iich edycja.

Dalej dopisujemy deklaracje zmiennych pomocniczych staraNazwa i staryAdres. Korzystamy tu z typuQString oznaczajacego dane tekstowe. Na koncu deklarujemy specjalna zmienna kontakty, która posłuzy doprzechowywania nazw i skojarzonych z nimi adresów w postaci słownika typu QMap. Poszczególne elementy takiejlisty maja postac skojarzonych ze soba par (klucz,wartosc).

53 connect(dodajBtn, SIGNAL(clicked()), this, SLOT(dodajKontakt()));54 connect(koniecBtn,SIGNAL(clicked()),this, SLOT(koniec()));55 }56



57 adresy::~adresy()58 {59 delete ui;60 }61

62 void adresy::dodajKontakt() {63 staraNazwa = nazwaLine->text();64 staryAdres = adresText->toPlainText();65

66 nazwaLine->clear();67 adresText->clear();68

69 aktGui(dodajT);70 }71

72 void adresy::aktGui(Tryb tryb) {73 aktTryb=tryb;74 switch (aktTryb) {75 case dodajT:76 case edytujT:77 nazwaLine->setReadOnly(false);78 nazwaLine->setFocus(Qt::OtherFocusReason);79 adresText->setReadOnly(false);80

81 dodajBtn->setEnabled(false);82 edytujBtn->setEnabled(false);83 usunBtn->setEnabled(false);84

85 zapiszBtn->show();86 anulujBtn->show();87

88 nastBtn->setEnabled(false);89 poprzBtn->setEnabled(false);90 break;91 case nawigujT:92 if (kontakty.isEmpty()) {93 nazwaLine->clear();94 adresText->clear();95 }96 nazwaLine->setReadOnly(true);97 adresText->setReadOnly(true);98 dodajBtn->setEnabled(true);99

100 int ile=kontakty.size();101 edytujBtn->setEnabled(ile >= 1);102 usunBtn->setEnabled(ile >=1 );103 nastBtn->setEnabled(ile > 1);104 poprzBtn->setEnabled(ile > 1);105

106 zapiszBtn->hide();107 anulujBtn->hide();108 break;109 }110 }111

112 void adresy::koniec() {113 adresy::close();114 }



Powiazania miedzy sygnałami i slotami ustalamy w pliku adresy.cpp za pomoca polecen typu:connect(dodajBtn,SIGNAL(clicked()),this,SLOT(dodajKontakt()));. Funkcja conect()jako pierwszy argument wymaga zmiennej wskazujacej obiekt, który emituje sygnał okreslony w 2. argumencie(np. SIGNAL(clicked()), czyli klikniecie), 3. argument okresla obiekt, który zostaje powiadomiony o zdarzeniu,w ostatnim argumencie podajemy funkcje, która ma zostac wykonana (SLOT(dodajKontakt())).

Jak widac powyzej, na koncu konstruktora naszej klasy adresy wiazemy klikniecia przycisków dodajBtn ikoniecBtn z funkcjami dodajKontakt() i koniec().

Funkcja dodajKontakt() przygotowuje aplikacje do przełaczenia w stan dodawania nowych danych. W tym celunajpierw zapamietujemy dotychczasowa nazwe i adres, a nastepnie wywołujemy funkcje pomocnicza z argumentemtypu Tryb oznaczajacym wymagany stan aplikacji: aktGui(dodajT).

Działanie funkcji aktGui(), obsługujacej stany aplikacji, polega na uaktywnianiu lub wyłaczaniu okreslonych ele-mentów interfejsu w zaleznosci od przeprowadzanej przez uzytkownika czynnosci. Np. w trybie dodawania i edy-cji odblokowujemy mozliwosc wprowadzania tekstu w polach nazwy (nazwaLine->setReadOnly(false);)i adresu (adresText->setReadOnly(false);), pokazujemy przyciski pozwlajace na zapis lub anulo-wanie wywołujac metode show(). Wyłaczamy równiez nawigacje, blokujac odpowiednie przyciski (metodasetEnabled(false)). Po wejsciu w tryb nawigacji czyscimy (clear()) zawartosc pól nazwy i adresu, oile lista kontaktów jest pusta (if (kontakty.isEmpty())). Nastepnie uaktywniamy przyciski edycji, usu-wania i przegladania, jezeli mamy jakies kontakty. Ilosc kontaktów zapisujemy wczesniej w osobnej zmiennej (intile=kontakty.size();). Na koniec przyciski zapisu i anulowania zostaja zablokowane.

Slot koniec() wywoływany jest po kliknieciu przycisku Koniec i powoduje zamkniecie aplikacji przy uzyciu me-tody close(). Wywołuje ona m.in. destruktor klasy, co powoduje – w naszym przypadku – usuniecie instancjiobiektu interfejsu graficznego (delete ui;).

Dodawanie adresów

Pora zaimplementowac obsługe trybu dodawania danych adresowych. Najpierw do pliku nagłówkowego dopisujemydeklaracje odpowiednich slotów:

25 public slots:26 void dodajKontakt();27 void koniec();28 void zapiszKontakt();29 void anuluj();

Musimy tez na poczatku pliku dodac import klasy QMessageBox pozwalajacej wyswietlac informacje uzytkowni-kowi.

Nastepnie przechodzimy do pliku adresy.cpp, w którym trzeba powiazac sloty zapiszKontakt() ianuluj() ze zdarzeniem klikniecia przycisków zapiszBtn i anulujBtn. Zadanie to proponujemy wykonacsamodzielnie :-).

Na koncu pliku musimy dopisac definicje powiazanych funkcji:

118 void adresy::zapiszKontakt() {119 QString nazwa = nazwaLine->text();120 QString adres = adresText->toPlainText();121

122 if (nazwa == "" || adres == "") {123 QMessageBox::information(this, trUtf8("Puste pole"),trUtf8("Prosze wpisac

→˓nazwe i adres."));124 return;125 }126

127 if (aktTryb == dodajT) {



128 if (!kontakty.contains(nazwa)) {129 kontakty.insert(nazwa, adres);130 QMessageBox::information(this, trUtf8("Dodano wpis"),131 trUtf8("Kontakt \"%1\" dodano do ksiazki

→˓adresowej.").arg(nazwa));132 } else {133 QMessageBox::information(this, trUtf8("Nie dodano wpisu"),134 trUtf8("Przykro, ale kontakt \"%1\" jest juz w

→˓ksiazce adresowej.").arg(nazwa));135 }136 }137

138 aktGui(nawigujT);139 }140

141 void adresy::anuluj() {142 nazwaLine->setText(staraNazwa);143 adresText->setText(staryAdres);144 aktGui(nawigujT);145 }

Funkcja zapiszKontakt() pobiera tekst wpisany w pola edycyjne za pomoca metod text() oraztoPlainText() i zapisuje je w zmiennych tekstowych. Nastepnie sprawdza, czy uzytkownik wprowadził obydwieinformacje. Jezeli nie, wyswietla odpowiedni komunikat przy uzyciu metody QMessageBox::information().Pierwszy tekst, który przekazujemy do tej funkcji to tytuł okna dialogowego, drugi – własciwy komuni-kat. Nastepnie, jezeli aplikacja jest w trybie dodawania, sprawdza, czy podana nazwa nie została zapi-sana wczesniej na liscie kontakty. Jesli nie (if (!kontakty.contains(nazwa))), dodaje nowe dane(kontakty.insert(nazwa,adres);) i wyswietla potwierdzenie. W przeciwnym razie informuje uzytkow-nika o duplikacie. Na koncu aktywuje tryb nawigacji (aktGui(nawigujT);).

Jezeli uzytkownik rozmysli sie i kliknie odpowiedni przycisk, wywoływana jest funkcja anuluj(). Jak widac,przywraca ona w polach edycyjnych poprzednio wprowadzane dane i równiez aktywuje tryb nawigacji.

Tryb nawigacji

Obsługa nawigacji wymaga napisania funkcji obsługujacych nacisniecie przycisków Nastepny i Poprzedni, które stajasie aktywne, jezeli mamy wiecej niz 1 dodany adres. Jak zwykle, zaczynamy od zadeklarowania publicznych slotównast() i poprz() w pliku nagłówkowym. Dopisanie tych 2 linijek pozostawiamy do samodzielnego wykona-nia. Podobnie powiazanie zadeklarowanych slotów z sygnałami (kliknieciami) obiektów nastBtn i poprzBtn wkonstruktorze klasy adresy.

Nastepnie dopisujemy implementacje zadeklarowanych funkcji na koncu pliku adresy.cpp:

Na koncu pliku musimy dopisac definicje powiazanych funkcji:

149 void adresy::nast() {150 QString nazwa = nazwaLine->text();151 QMap<QString, QString>::iterator i = kontakty.find(nazwa);152 if (i != kontakty.end()) i++;153 if (i == kontakty.end()) i = kontakty.begin();154 nazwaLine->setText(i.key());155 adresText->setText(i.value());156 }157

158 void adresy::poprz() {159 QString nazwa = nazwaLine->text();160 QMap<QString, QString>::iterator i = kontakty.find(nazwa);



161 if (i == kontakty.begin()) i = kontakty.end();162 i--;163 nazwaLine->setText(i.key());164 adresText->setText(i.value());165 }

Wyswietlajac kolejna pare powiazanych danych, tzn. nazwe i przypisany jej adres(y), musimy sprawdzic w fuk-cji nast(), czy mamy kolejny wpis, czy tez aktualny jest ostatni. Wtedy nalezałoby wyswietlic wpis pierw-szy. W tym celu pobieramy nazwe aktualnie wyswietlonego wpisu i tworzymy obiekt tzw. iteratora inicjo-wanego przez metode find() i przypisanego do zmiennej i: QMap<QString,QString>::iterator i =kontakty.find(nazwa);. Iterator umozliwia łatwe poruszanie sie po liscie słowników zapisanych w zmiennejkontakty. Metoda i.key() zwraca nam klucz, a i.value() przypisana mu wartosc.

Jezeli biezacy wpis nie jest ostatnim inkrementujemy wartosc iteratora (if (i != kontakty.end()) i++;).W przeciwnym wypadku ustawiamy go na pierwszy wpis (i = kontakty.begin();); Na koniec pozostajewczytanie nazwy (i.key()) i przypisanych jej danych (i.value()) do odpowiednich pól interfejsu.

Funkcja poprz() zaczyna sie tak samo jak poprzednia, czyli od utworzenia iteratora wskazujacego na biezacy wpis.Jezeli jestesmy na poczatku listy, ustawiamy iterator na element koncowy. Nastepnie przechodzimy do elementukoncowego (i--) i wyswietlamy odpowiednie dane.

Informacja: Metoda .end() klasy QMap zwraca iterator wskazujacy na wirtualny (!) element po ostatnim elemen-cie listy. Dlatego, aby uzyskac dostep do niego, musimy iterator dekrementowac (i--).

Edycja i usuwanie

Do oprogramowania zostay jeszcze dwa przyciski: btnEdytuj, którego klikniecie powinno wywołac funkcjeedytujKontakt(), oraz btnUsun, który wywołuje funkcje usunKontakt(). Samodzielnie dopisujemy de-klaracje funkcji do pliku nagłówkowego, a ich powiazania z sygnałami umieszczamy w pliku zródłowym.

Nastepnie implementujemy funkcje:

185 void adresy::edytujKontakt() {186 staraNazwa = nazwaLine->text();187 staryAdres = adresText->toPlainText();188 aktGui(edytujT);189 }190

191 void adresy::usunKontakt() {192 QString nazwa = nazwaLine->text();193 QString adres = adresText->toPlainText();194

195 if (kontakty.contains(nazwa)) {196 int button = QMessageBox::question(this,trUtf8("Potwierdz usuniecie"),197 trUtf8("Czy na pewno usunac kontakt \"%1\"?

→˓").arg(nazwa),198 QMessageBox::Yes|QMessageBox::No);199 if (button == QMessageBox::Yes) {200 poprz();201 kontakty.remove(nazwa);202 QMessageBox::information(this,trUtf8("Usunieto"),203 trUtf8("Usunieto kontakt \"%1\".").arg(nazwa));204 }205 }



206 aktGui(nawigujT);207 }

Przejscie do trybu edycji, czyli działanie funkcji edytujKontak(), polega na zapisaniu aktualnie wyswietlanychdanych (przydatne, jezeli uzytkownik anuluje zmiany) i uaktywnieniu trybu (aktGui(edytujT);), tzn. odbloko-waniu pól tekstowych i odpowiednich przycisków.

Usuwanie kontaktów równiez jest proste. Na poczatku pobieramy nazwe i zwiazany z nim adres(y). Metoda.contains(nazwa) pozwala sprawdzic, czy lista kontaktów zawiera słownik o podanym kluczu. Natepnie pro-simy uzytkownika o potwierdzenie operacji. Po jego uzyskaniu najpierw wyswietlamy w aplikacji dane poprzedniegowpisu dzieki wywołaniu zdefiniowanej wczesniej funkcji poprz(), pózniej dopiero usuwamy wpis za pomoca me-tody .remove(nazwa) i wyswietlamy potwierdzenie. Na koniec aktywujemy tryb nawigacji.

Pocwicz sam

Spróbuj rozszerzyc napisana aplikacje o mozliwosc przechowywania danych w pliku lub w bazie nadysku.

Materiały

1. Projekt Qt

2. Biblioteka Qt 5

3. Qt Creator

4. Dokumentacja Qt 5

5. Qt Developer Wiki (pl)

Pojecia


plik nagłówkowy w jezyku C/C++ plik z rozszerzeniem .h zawierajacy deklaracje uzywanych struktur danych, np.klas, zmiennych i funkcji. Implementacja klas i funkcji umieszczana jest w plikach zródłowych. Wiecej o plikuzródłowym:

plik zródłowy w jezyku C/C++ plik z rozszerzeniem .c/.cpp zawierajacy implementacje zadeklarowanych typówzłozonych (np. klas) i uzywanych funkcji, w tym funkcji głównej (main()).

Klasa program komputerowy.

Obiekt zestaw komponentów i bibliotek wykorzystywany do budowy aplikacji, przykładem jest biblioteka PythonaFlask.

public operator widocznosci, pola (własciwosci) i metody (funkcje) klasy deklarowne po nim sa dostepne z kazdegmiejsca programu.

private operator widocznosci, pola (własciwosci) i metody (funkcje) klasy deklarowne po nim sa dostepne tylko wjej obrebie.

Qt Creator wieloplatformowe srodowisko IDE (zintegrowane srodowisko programistyczne) dla aplikacji pisanychw jezykach C++, JavaScript i QML. Zawiera m.in. debugger i edytor GUI (graficznego interfejsu uzytkownika).

sygnały zdarzenia generowane za pomoca graficznego interfejsu uzytkownika, takie jak klikniecie elementu, edycja,przeciagniecie itp.



http://doc.qt.io/qt-5/


http://doc.qt.io/qt-5/reference-overview.html

http://qt-project.org/wiki/Wiki_Home_Polish

http://pl.wikipedia.org/wiki/Plik_nag%C5%82%C3%B3wkowy




sloty funkcje przypisane sygnałom, definiuja działania podejmowane w przypadku zastnienia danego zdarzenia.


Zadania (Qt5)

Po zrealizowaniu scenariusza “Adresy” powinienes byc w stanie tworzyc przy uzyciu biblioteki Qt proste prohgramyz interfejsem graficznym. Ponizej zamieszczamy kilka propozycji do samodzielnego opracowania.

• Kalkulator

• Konwerter liczb

• Konwerter jednostek

• Równanie kwadratowe

• Szyfr

• Twój pomysł

• Materiały

Kalkulator

Stwórz kalkulator pozwalajacy na wykonywania co najmniej podstawowych działan. Rozwijajac go, mozesz pomysleco zaimplementowaniu historii obliczen.

Konwerter liczb

Napisz program pozwalajacy na konwersje liczb wprowadzanych w systemach liczbowych o podstawie 2, 6, 8, 10 i16.

Konwerter jednostek

Napisz program pozwalajacy na konwersje jednostek uzywanych w informatyce, np. bity na kilobajty, megabity nakilobajty itp.

Równanie kwadratowe

Napisz program, który po wprowadzeniu wymaganych danych wyswietla i rozwiazuje równanie kwadratowe.

Szyfr

Napisz program, który szyfruje i deszyfruje wprowadzony tekst wybrana metoda, np. szyfrem Cezara lub Vigenère’a.

Twój pomysł

Wymysl i zaimplementuj program własnego pomysłu.



Materiały

1. Projekt Qt

2. Biblioteka Qt 5

3. Qt Creator

4. Dokumentacja Qt 5

5. Qt Developer Wiki (pl)

Pojecia


plik nagłówkowy w jezyku C/C++ plik z rozszerzeniem .h zawierajacy deklaracje uzywanych struktur danych, np.klas, zmiennych i funkcji. Implementacja klas i funkcji umieszczana jest w plikach zródłowych. Wiecej o plikuzródłowym:

plik zródłowy w jezyku C/C++ plik z rozszerzeniem .c/.cpp zawierajacy implementacje zadeklarowanych typówzłozonych (np. klas) i uzywanych funkcji, w tym funkcji głównej (main()).

Klasa program komputerowy.

Obiekt zestaw komponentów i bibliotek wykorzystywany do budowy aplikacji, przykładem jest biblioteka PythonaFlask.

public operator widocznosci, pola (własciwosci) i metody (funkcje) klasy deklarowne po nim sa dostepne z kazdegmiejsca programu.

private operator widocznosci, pola (własciwosci) i metody (funkcje) klasy deklarowne po nim sa dostepne tylko wjej obrebie.

Qt Creator wieloplatformowe srodowisko IDE (zintegrowane srodowisko programistyczne) dla aplikacji pisanychw jezykach C++, JavaScript i QML. Zawiera m.in. debugger i edytor GUI (graficznego interfejsu uzytkownika).

sygnały zdarzenia generowane za pomoca graficznego interfejsu uzytkownika, takie jak klikniecie elementu, edycja,przeciagniecie itp.

sloty funkcje przypisane sygnałom, definiuja działania podejmowane w przypadku zastnienia danego zdarzenia.



2.2. Zadania (Qt5) 63


http://doc.qt.io/qt-5/


http://doc.qt.io/qt-5/reference-overview.html

http://qt-project.org/wiki/Wiki_Home_Polish




ROZDZIAŁ 3

Technologie WWW

WWW (ang. World Wide Web – ogólnoswiatowa siec) w celu dostarczania uzytkownikom hipertekstowych dokumen-tów wykorzytuje wiele technologii, do których naleza m. in.: protokół HTTP(S), jezyki opisu stron HTML, XML,jezyki generujace strony PHP, Python, arkusze stylów CSS, jezyk skryptowy JavaScript czy technika AJAX.

Spis tresci:

HTML&CSS – cwiczenie 1

Informacja: W pliku index.html nalezy przygotowac strone HTML, która wyglada podobnie do ponizszej.

Kliknij,aby zobaczyc wiekszy obrazek

65


Uwaga: W katalogu html_css_cw1 znajdziesz 3 pliki:

• index.html – szkielet strony HTML, tu wprowadzaj wszystkie zmiany;

• style.css – podstawowy arkusz stylów CSS, tu dodawaj definicje stylów;

• norwid.jpg – obrazek potrzebny tylko w czesci rozszerzonej.

Uwaga: Tresc i obrazki, które masz umiescic w dokumencie index.html, skopiuj ze strony Romantyzm Wiki-pedii.

Czesc podstawowa

W pliku index.html dokonaj wymienionych zmian:

1. Wstaw taki sam tytuł strony i nagłówka pierwszego stopnia.

2. Wstaw dwa odnosniki w menu.

3. Wstaw dwa akapity, a w kazdym wstaw obrazki.

4. Wstaw akapit z tekstem “Zródło” i odnosnikiem do Wikipedii.

5. Wstaw pozioma linie.

6. Wstaw nagłówek stopnia drugiego.

7. Wstaw liste wypunktowana.

8. Na koncu listy umiesc odnosnik do konkretnej strony w Internecie.

9. W stopce wstaw znacznik nagłówka trzeciego poziomu.

10. Wstaw liste wypunktowana zawierajaca dwa odnosniki do stron w Internecie.

11. Dołacz do dokumentu arkusz stylów CSS o nazwie style.css.

12. W pliku style.css umiesc:

(a) definicje ustawiajaca marginesy zewnetrzne strony (poza marginesem górnym) na 20px

(b) definicje powiekszajaca czcionke nagłówka stopnia pierwszego do 26px

(c) definicje zmieniajace kolor tła (wybierz) i wewnetrzne marginesy elementu <section> na 20px

(d) definicje zmieniajace kolor tła (wybierz), kolor czcionki (wybierz) i wewnetrzne marginesy elementufooter na 20px

(e) klase .obrazek definiujaca szerokosc (250px), obramowanie (2px solid grey) i marginesy zewnetrzneobrazków (10px)

(f) klasy .nalewo, .naprawo pozwalajace wyrównywac elementy do lewej i prawej strony

(g) klase .zródlo podkreslajaca tekst, pochylajaca czcionke i wyrównujaca tekst akapitu “Zródło” do pra-wej strony

13. Przypisz odpowiednim elementom zdefiniowane klasy CSS.

Po wykonaniu cwiczenia lub upłynieciu przeznaczonego na nie czasu utwórz archiwum w formacie zip zawierajacekatalog html_css_cw1, zmien jego nazwe wg schematu: kl1ag1_nazwisko_imie_html1.zip i wgraj nawskazany serwer.

66 Rozdział 3. Technologie WWW

https://pl.wikipedia.org/wiki/Romantyzm


Czesc rozszerzona

W pliku norwid.html nalezy przygotowac strone HTML, która wyglada podobnie do ponizszej.

Kliknij,aby zobaczyc wiekszy obrazek

Uwaga: Uwaga: Tresci zawarte w pliku norwid.html pobierz z odpowiedniej strony Wikipedii.

1. Zapisz plik index.html pod nazwa norwid.html.

2. Upewnij sie, ze działaja odnosniki w menu.

W pliki norwid.html dokonaj nastepujacych zmian:

1. Zmien tytuł dokumentu i zawartosc nagłówka strony.

2. Z elementu <section> usun wszystko poza nagłówkiem.

3. Wstaw 2-komórkowa tabele, szerokosc lewej komórki ustaw 10%.

4. W lewej komórce umiesc obrazek, w prawej akapity z tekstem oraz akapit “Zródło”.

5. Zmien tresc i url odnosnika na dole strony.

6. Za pomoca stylów CSS ustaw prawy zewnetrzny margines tabeli na 100px.

7. Utwórz klase CSS .tdright, która definiuje 5% wewnetrzne marginesy oraz prawe obramowanie (2px solidgrey).

8. Zastosuj utworzona klase.

Po wykonaniu cwiczenia lub upłynieciu przeznaczonego na nie czasu utwórz archiwum w formacie zip zawierajace ka-talog html_css_cw1, zmien jego nazwe wg schematu: kl1ag1_nazwisko_imie_html1_roz.zip i wgrajna wskazany serwer.

3.1. HTML&CSS – cwiczenie 1 67


Materiały

1. Elementy HTML

2. HTML Element Reference

3. Własciwosci CSS

4. CSS Reference


GetSimple CMS

GetSimple jest przykładem systemu zarzadzania trescia (ang. Content Management System, CMS). Zadaniem CMS-ów jest wspomaganie tworzenia serisów intenetowych WWW i zarzadzania nimi przy wykorzystaniu przyjaznych dlauzytkownika interfejsów. Inne przykłady popularnych CMS-ów to: Drupal, Joomla! czy WordPress.

Pobranie archwium

Informacja: GetSimple wymaga działajacego serwera WWW, przy czym serwery bazodanowe typu MySQL itp. niesa koniecznie, poniewaz GS przechowuje pliki w formacie XML. Zob. materiał Serwer deweloperski WWW.

Pobieramy archiwum GS i umieszczamy w podkatalogu public_html katalogu domowego (Linux) lub w podka-talogu www folderu instalacyjnego UwAmp (Windows). Rozpakowujemy je, a nazwe utworzonego katalogu zmieniamyna gs.

Ostrzezenie: W Linuksie folderowi gs musimy nadac uprawnienia do zapisu i odczytu nie tylko dla własciciela,ale i dla grupy oraz innych. Robimy to z poziomu menedzera plików po kliknieciu prawym klawiszem myszynazwy katalogu i wybraniu “Własciwosci/Uprawnienia” (zob. zrzut ponizej). Uwaga: na pytanie typu “Zastosowacrekursywnie” odpowiadamy twierdzaco. Mozna tez w katalogu public_html wydac w terminalu polecenie:chmod -R 777 gs.

Instalacja

Uruchamiamy przegladarke i rozpoczynamy instalacje wpisujac w polu adresu:http://localhost/~nazwa_uzytkownika/gs/admin (Linux) lub http://localhost/gs/admin(Windows). Jezeli skorzystałes z udostepnionego przez nas archiwum GetSimple, na stronie instalacyjnej wybieramyod razu jezyk polski. Pózniej klikamy “Continue with Setup” (“Kontynuuj instalacje”).

Informacja: W srodowisku Linux ewentualne błedy chmod ignorujemy.

Na nastepnej stronie wpisujemy nazwe strony, login i email administratora.

Po nacisnieciu “Install Now!” (“Instaluj”) moze zostac wyswietlona strona z błedem ze wzgledu na brak mozliwosciwysłania wiadomosci e-mail z danymi logowania. To normalne. Wyswietlone hasło mozemy ewentualnie skopiowac,po czym kilkamy link “login here”.


http://webkod.pl/dodatki/html/mapa-html-elementy-atrybuty-wartosci

http://www.w3schools.com/tags/default.asp

http://webkod.pl/kurs-css/wlasciwosci/tekst/text-align

http://www.w3schools.com/cssref/default.asp

http://http://get-simple.info

http://pl.wikipedia.org/wiki/Drupal

http://pl.wikipedia.org/wiki/Joomla!

http://pl.wikipedia.org/wiki/WordPress


Spolszczenie

Jezeli jest taka potrzeba, pobieramy plik spolszczenia i rozpakowujemy go w podkatalogugs/admin/lang.

Konfiguracja

W panelu administracyjnym (http://localhost/~nazwa_uzytkownika/gs/admin) wybieramy w pra-wym górnym rogu Settings (Ustawienia). Ustawiamy: strefe czasowa (“Local Timezone”), jezyk interfejsu admina(“Language”) oraz nowe hasło (“New Password”) – i klikamy “Save settings” (“Zapisz”).

Wtyczki

Za pomoca wtyczek (ang. plugins) rozszerzamy funkcjonalnosc GetSimple’a. Pobieramy przygotowany przez naszestaw wtyczek i rozpakowujemy w podfolderze gs/plugins.

Zawartosc przykładowego folderu plugins powinna wygladac nastepujaco:

Wskazówka: W Linuksie po umieszczeniu archiwów zip w podkatalogu gs/plugins wygodnie je rozpakujeszwydajac w terminalu polecenie typu: unzip nazwa_archiwum.zip.

Uzycie polecenia “Rozpakuj tutaj” w menedzerze plików moze umiescic pliki w dodatkowym i niepotrzebnym pod-folderze, z którego trzeba je bedzie przeniesc do folderu nadrzednego (plugins).

Przykładowe wtyczki:

3.2. GetSimple CMS 69


• I18N – wsparcie dla stron w róznych jezykach oraz bardzo uzyteczne hierarchiczne menu;

• I18N Gallery – tworzenie galerii zdjec;

• DynPages – wykonywanie kodu php umieszczonego w komponentach;

• I18N Search – wyszukiwanie tekstu na stronach serwisu, tworzenie list zasobów oznaczonych tagami;

• I18N Special Pages – tworzenie stron specjalnych typu newsy, artykuły, karty produktów itp.

Wtyczkami zarzadzamy w sekcji “Wtyczki” panelu administracyjnego. Po instalacji nalezy wtyczke(i) właczyc.

Strona główna

Domyslnie dodana zostanie demonstracyjna strona główna widoczna w panelu “Strony”, która wyswietlimy w przegla-darce, jezeli klikniemy nazwe serwisu w lewym górnym rogu panelu administracyjnego. Strona główna dostepna jestpod adresem: http://localhost/~nazwa_uzytkownika/gs/ (Linux) lub http://localhost/gs/(Windows).

Materiały

1. Download GetSimple CMS – najnowsze wersje GS;


http://get-simple.info/extend/plugin/i18n/69/

http://get-simple.info/extend/plugin/i18n-gallery/160/

http://get-simple.info/extend/plugin/dynpages/81/

http://get-simple.info/extend/plugin/i18n-search/82/

http://get-simple.info/extend/plugin/i18n-special-pages/319/

http://get-simple.info/download


2. Extend – najnowsze wersje tłumaczenia i wtyczek; w polu “Serach Repository” wpisujemy hasło “polish” iwybieramy link do ostatniej wersji:

3. Wiki – dokumentacja.


Bootstrap

Bootstrap to otwartozródłowy zestaw narzedzi do tworzenia responsywnych (zob.: responsywny) stron WWW przyuzyciu jezyków HTML, CSS i JS. Framework ten dostarcza gotowych klas CSS i szablonów zwiazanych z typografia,formularzami, przyciskami, tabelami, oknami dialogowymi i innymi elementami.

Instalacja

Instalacja w tym wypadku oznacza podłaczenie arkuszy CSS i skryptów JS Bootstrapa do kodu tworzonej strony. Naj-prosciej skorzystac z zasobów przechowywanych w CDN-ach (ang. content delivery network, rozproszony sieciowysystem dostarczania tresci).

Typowy szablon HTML 5 uzywajacy Bootstrapa wyglada nastepujaco:

1 <!DOCTYPE html>2 <html>3 <head>4 <meta charset="utf-8">5 <meta name="viewport" content="width=device-width, initial-scale=1">6 <meta http-equiv="x-ua-compatible" content="ie=edge">7 <title>Szablon HTML 5 Bootstrap v.4</title>8

9 <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/→˓bootstrap.min.css">

3.3. Bootstrap 75

http://get-simple.info/extend/

http://get-simple.info/wiki/

https://getbootstrap.com

10

11 </head>12 <body>13

14 <div class="container">15 <h1>Szablon HTML 5 Bootstrap v.4</h1>16 </div>17

18 19 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></

→˓script>20

21 22 <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.

→˓js"></script>23

24 25 <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></

→˓script>26 </body>27 </html>

W zaznaczonych liniach dołaczane sa komponenty CSS i JS Bootstrapa.

Informacja: Jezeli korzystamy tylko z CSS-a i nie potrzebujemy komponentów JavaScript, skryptów JS nie musimydołaczac.

Układ strony

Do tworzenia układu strony uzywamy systemu siatkowego (ang. grid system). Wykorzystuje on dwie klasy kontene-rów:

• container – responsywny kontener o stałej szerokosci z marginesami po lewej i prawej,

• container-fluid – kontener wykorzystujacy cała dostepna szerokosc

– oraz klasy definiujace podział na rzedy:

• row – definiuje rzad (wiersz) zawierajacy kolumny,

• col- – definuje kolumne

– i kolumny (maksymalna ilosc kolumn w wierszu to 12). Kolumny mozna grupowac w zaleznosci od rozdzielczosciza pomoca odpowiednich klas:

• .col- – szerokosc ekranu < 576px (extra small, xs),

• .col-sm- – szerokosc => 576px (small devices, sm),

• .col-md- – szerokosc => 768px (medium devices, md),

• .col-lg- – szerokosc => 992px (large devices, lg),

• .col-xl- – szerokosc => 1200px (xlarge devices, xl).

Przykładowy layout z dwoma równymi wezszymi kolumnami bocznymi oraz kolumna srodkowa o szerokosci równej50%, tj. 6 kolumnom z 12 dostepnych, od rozdzielczosci >= 576px:


1 <div class="container">2 <div class="row">3 <div class="col-3">4 kolumna lewa5 </div>6 <div class="col-sm-6">7 kolumna srodkowa8 </div>9 <div class="col-3">

10 kolumna prawa11 </div>12 </div>13 </div>

Wskazówka: Przetetuj powyzszy kod. Zwróc uwage, ze w rozdzielczosci ponizej 576px kolumny wyswietlane sajedna pod druga, a w innych rozdzielczosciach szerokosc kolumn dostosowywana jest automatycznie.

Narzedzia Pokaz/ukryj

Schemat nazewnictwa klas zmieniajacych własciwosc display:

• .d-{value} – dla xs

• .d-{breakpoint}-{value} – dla sm, md, lg i xl.

Mozliwe wartosci (ang. value): none,inline,inline-block,block,table,table-cell,table-row,flex,inline-flex.

Przykłady:

• .d-block .d-sm-none – pokaz tylko na xs

• .d-none .d-lg-block .d-xl-none – pokaz tylko na lg

• .d-none .d-sm-block – ukryj tylko na xs

• .d-md-none .d-lg-block – ukryj tylko na md

Marginesy i wypełnienia

Schemat nazewnictwa klas zmieniajacych własciwosci margin i padding:

• {property}{sides}-{size} – dla xs

• {property}{sides}-{breakpoint}-{size} - dla sm, md, lg, xl

• property: m – marginesy lub p – wypełnienie

• sides: t – góra, b – dół, l – lewo, r – prawo, x – lewo i prawo, y – góra i dół

• sizes – 0 – brak, 1 – 1/4 odstepu, 2 – 1/2 odstepu, 3 – pełny odstep, 4 – półtora odstepu, 5 – potrójnosc odstepu,auto – odstep automatyczny.

Przykłady:

3.3. Bootstrap 77


Materiały

1. Dokumentacja Bootstrapa v.4;

2. Podstawy flexbox (Mozilla Developer Network);

3. Przykłady flexbox (w3schools.com);

4. Przykłady układów (Bootstrap grid examples);


Słownik

WWW (ang. World Wide Web) – ogólnoswiatowa siec, jedna z najwazniejszych usług sieciowych; hipertekstowy,internetowy sposób udostepniania informacji.

HTTP(S) (ang. Hypertext Transfer Protocol) – protokół przesyłania dokumentów hipertekstowych, protokół sieciWWW za pomoca którego przesyłane sa zadania udostepnienia lub modyfikacji zasobów, okresla reguły ko-munikacji miedzy klientem (np. przegladarka) a serwerem, który zwraca odpowiedzi. Zalecane jest uzywaniewersji szyfrowanej tego protokołu oznaczanego https.

HTML HTML (ang. HyperText Markup Language) – hipertekstowy jezyk znaczników, wykorzystywany do tworze-nia stron internetowych. Aktualnie zalecana wersja to HTML5.

XML XML (ang. Extensible Markup Language) – rozszerzalny jezyk znaczników, przeznaczony do strukturalnegoi semantycznego opisu danych.

PHP obiektowy, skryptowy jezyk programowania, słuzacy m. in. do generowania po stronie serwera dynamicznychstron internetowych.

Python obiektowy jezyk programowania wysokiego poziomu słuzacy m. in. do tworzenia aplikacji internetowych,oferuje przyjazna składnie, czytelnosc i klarownosc kodu.

CSS (ang. Cascading Style Sheets, CSS) – kaskadowe arkusze stylów, jezyk opisu wygladu stron internetowych,stanowi dopełnienie HTML-a.

JavaScript skryptowy jezyk programowania słuzacy m. in. do tworzenia aktywnych własciwosci stron interneto-wych, działa po stronie klienta (tj. w przegladarce).

AJAX AJAX (ang. Asynchronous JavaScript and XML) – asynchroniczny JavaScript i XML, sposób tworzeniastron internetowych, które oferujac dynamiczna zmiane zawartosci, nie wymagaja przeładowywania, poniewazkomunikuja sie z serwerm asynchronicznie.

CMS (ang. Content Management System, CMS) – system zarzadzania trescia, wykorzystujace rózne technologieinternetowe, słuzacy do tworzenia serwisów internetowych i zarzadzania nimi.

serwer WWW (ang. web server) – oprogramowanie obsługujace protokół http, podstawowy protokół sieci WWW,słuzacy przesyłaniu dokumentów hipertekstowych.

interpreter program, który analizuje kod zródłowy, a nastepnie go wykonuje. Interpretery sa podstawowym skład-nikiem jezyków wykorzystywanych do pisania skryptów wykonywanych po stronie klienta WWW (JavaScript)lub serwera (np. Python, PHP).

system bazodanowy system zarzadzania baza danych (ang. Database Management System, DBMS) – oprogramo-wanie słuzace do zarzadzania bazami danych, np. SQLite, MariaDB, MySQL, PostgreSQL.

framework (ang. framework – struktura) – oprogramowanie bedace zestawem narzedzi ułatwiajacych i przyspiesza-jacych tworzenie aplikacji.


https://getbootstrap.com/docs/4.0/getting-started/introduction/

https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox

https://www.w3schools.com/cSS/css3_flexbox.asp

https://getbootstrap.com/docs/4.0/examples/grid/

http://pl.wikipedia.org/wiki/World_Wide_Web

http://pl.wikipedia.org/wiki/Hypertext_Transfer_Protocol

http://pl.wikipedia.org/wiki/HTML

http://pl.wikipedia.org/wiki/XML


http://pl.wikipedia.org/wiki/Python

http://pl.wikipedia.org/wiki/Kaskadowe_arkusze_styl%C3%B3w

http://pl.wikipedia.org/wiki/JavaScript

http://pl.wikipedia.org/wiki/AJAX


responsywny (ang. responsive) – przymitonik zwiazany z technika projektowania stron internetowych okreslanejskrótem RWD (ang. responsive web design), oznacza dostosowywanie wygladu i układu strony do rozmiaruokna przegladarki w urzadzeniach o róznej rozdzielczosci.



3.4. Słownik 79

ROZDZIAŁ 4

Porteus

Porteus jest odmiana Linuksa typu live zoptymalizowana do uruchamiania z nosników wymiennych, np. kluczy USB.Oparty jest na najstarszej dystrybucji Linuksa – Slackware. System błyskawicznie startuje i pozwala na zachowaniewprowadzanych zmian, tj. konfiguracji, oprogramowania czy dokumentów uzytkownika w pliku zapisu.

Przygotowalismy 64-bitowe spolszczone wersje ze srodowiskiem graficznym XFCE lub Cinnamon, które bardzo do-brze nadaja sie m. in. do nauki programowania i realizacji materiałów Python101.

Rys. 4.1: Porteus 3.2.2 XFCE 64-bit

Spis tresci

• Porteus

– Klucz USB

– Pierwsze uruchomienie

81

http://porteus.org/

https://pl.wikipedia.org/wiki/Slackware

https://pl.wikipedia.org/wiki/Xfce

https://pl.wikipedia.org/wiki/Cinnamon

http://python101.rtfd.org


Rys. 4.2: Porteus 3.2.2 Cinnamon 64-bit

– Moduły

* Dodatkowe moduły

* Zarzadzanie modułami

– Wskazówki

– Problemy

Klucz USB

Przygotowanie pendrajwa z systemem jest bardzo proste:

1. Pobieramy obraz iso systemu: porteus322XFCE.iso [srodowisko XFCE, 17.06.2017] lub por-teus322Cinnamon.iso [srodowisko Cinnamon, 13.02.2017].

2. Przygotowujemy pustego pendrajwa o pojemnosci min. 2GB. Im szybszy, tym lepszy!

W systemie Windows:

3. Do nagrania Porteusa na pendrajwa polecamy program Rufus. Pobierz, uruchom, wskaz plik iso i nagraj.

W systemie Linux:

3. Montujemy pobrany obraz z uprawnieniami administratora (roota) w katalogu /mnt/loop:

~$ sudo mkdir /mnt/loop~S sudo mount -o loop /path/to/Porteus-XFCE-v3.2.2-x86_64.iso /mnt/loop

82 Rozdział 4. Porteus

https://drive.google.com/open?id=0B1zG9cfNyT7Wa0psMC1iVzAzSUk

https://drive.google.com/open?id=0B1zG9cfNyT7WZHlLNl9WYzBjdGs

https://drive.google.com/open?id=0B1zG9cfNyT7WZHlLNl9WYzBjdGs

https://rufus.akeo.ie/?locale=pl_PL


4.1. Klucz USB 83


4. Wkładamy klucz USB, który powinien zostac wykryty jako partycja /dev/sdb1 lub /dev/sdc1 i zamon-towany w katalogu /media/nazwa_uzytkownika/etykieta_klucza. Sprawdzimy to poleceniemmount|grep "sdb" lub otwierajac menedzer plików.

5. Kopiujemy zawartosc zamontowanego obrazu na pendrajwa za pomoca polecenia (lub menedzera plików):

~$ cp -r /mnt/loop/* /media/nazwa_uzytkownika/etykieta_klucza

6. Wchodzimy do katalogu boot na pendrajwie(!) i wydajemy polecenie z uprawnieniami roota:

/media/nazwa_uzytkownika/etykieta_klucza$ sudo bash Porteus-installer-for-Linux.com

– upewniamy sie, ze wyswietlona została partycja klucza USB (np. /dev/sdb1), wpisujemy ok i potwierdzamy.

Pierwsze uruchomienie

Po włozeniu pendrajwa do gniazda USB i właczeniu komputera nalezy nacisnac klawisz wywołujacy Boot menu.Zazwyczaj jest to którys z klawiszy funkcyjnych, np.: F12. Czasem trzeba wywołac BIOS i dopiero wtedy wybracwpis typu USB Device oznaczajacy naszego pendrajwa.

Podczas pierwszego uruchomienia zobaczymy komunikat “couldn’t find /porteus.dat” informujacy, ze system niemoze znalezc pliku zapisu. Tak ma byc, naciskamy Enter.

Po uruchomieniu tworzymy plik zapisu, w którym przechowywane beda wszystkie zmiany.



1. Wybieramy Start/System/Porteus Setings Centre, podajemy hasło roota (tj. “toor”), klikamy ikone dyskietki (1),nastepnie ikone Porteus Save Changes (2), a w nastepnym oknie wybieramy przycisk Create.

2. W polu “Savefile name” wpisujemy nazwe pliku: porteus.dat.

W polu Location klikamy ikone folderu i wskazujemy naped USB, zazwyczaj “sdb1” lub “sdc1”. (Po wybraniunazwy napedu powinnismy widziec na nim katalog porteus).

Rozmiar zostawiamy domyslny lub podajemy wiekszy, np. 768 lub 1024 MB. Klikamy “OK” i czekamy nautworzenie pliku.

3. Na koniec ponownie uruchomiamy system!

Uwaga: Domyslna nazwa pliku zapisu, porteus.dat, wpisana jest w plikuboot/syslinux/porteus.cfg. Jezeli zapis nie działa albo utworzylismy plik o innej nazwie i chcielibysmygo uzyc, nalezy otworzyc wspomniany plik, np. klikajac przycisk Edit porteus.cfg (3) w oknie “Porteus Settings

4.2. Pierwsze uruchomienie 85


Centre” i wpisac własciwa sciezke do pliku zapisu: changes=/nazwa_pliku_zapisu.dat. Uwaga: /oznacza główny katalog pendrajwa!

Moduły

Porteus ma budowe modularna, składa sie ze skompresowanych paczek w formacie xzm, zawierajacych system plikówSquashFS. Na kluczu USB (płycie CD) znajduje sie katalog porteus zawierajacy wszystkie moduły w podkatalo-gach:

• base – moduły systemu bazowego,

• modules – tu umieszczamy moduły ładowane automatycznie podczas startu,

• optional – oprogramowanie dodatkowe, ładowane na zadanie.

Uwaga: Moduły sa aktualizowane, aby usunac ewentualne błedy lub dodac funkcjonalnosci:

• Lista zmian »»»

• Pobierz moduły »»»

Obraz iso, katalog potrteus/modules, zawiera :

1. 01-devel – podstawowe narzedzia deweloperskie (kompilatory);

2. 02-pl-locales – spolszczenie ze słownikami;

3. 02-tcltk – biblioteki Tcl/Tk wymagane przez Pythona;

4. 04-python2 – Python 2.7.13 (XFCE) lub 2.7.11 (Cinnamon) + PyQt5;

5. 05-python3 – Python 3.6.1 (XFCE) lub 3.5.2 (Cinnamon) + PyQt5;

6. 06-qt5 – biblioteka Qt 5.7 (XFCE) lub 5.6 (Cinnamon);

4.3. Moduły 87

https://pl.wikipedia.org/wiki/SquashFS

https://drive.google.com/open?id=0B1zG9cfNyT7WUms4TnNkX3ZOa2s

https://drive.google.com/open?id=0B1zG9cfNyT7WSTlWWWdTdzRBQnc


7. 09-fonts-msubuinf – dodatkowe czcionki;

8. 10-palemoon – przegladarka Palemoon 27.3.1;

9. 15-flashplayer-plugin – wtyczka Flash Player 25.0.0.148;

10. 50-git – system kontroli wersji Git 2.9;

11. 55-keepassx – menedzer haseł KeePassX 2.0.3;

12. 90-tools – narzedzia lxrandr (zarzadzanie ekranami), xmag, tree;

13. 91-geany – Geany 1.29, programistyczne IDE;

14. 95-sublime_text_3 – zaawansowany edytor programistyczny Sublime-Text 3 (3126);

15. 99-home-guest – prekonfiguracja srodowiska XFCE lub Cinnamon.

W katalogu porteus/optional znajdziesz:

• biblioteki-py2.xzm – biblioteki potrzebne do realizacji scenariuszy Python101: Django, Django regi-stration, Flask, Peewee, Sqlalchemy, flask-sqlalchemy, /home/guest/robot, /home/guest/mcpi-sim.

Informacja: Pakiety Pythona 2 i 3 zawieraja: IPython (+QtConsole), Matplotlib, PyGame, Turtle, PyQt. Przyrostki-x i -c odrózniaja wersje dla XFCE i Cinnamona.

Dodatkowe moduły

Moduły opcjonalne po pobraniu mozna wgrac do katalogu potrteus/optional:

• libreoffice-5.2.3.3 – spolszczony pakiet biurowy LibreOffice;

• sqlitestudio3.1.1 – menedzer baz danych SQLite;

• etherpad-lite-1.5.7 – notatnik uruchamiany w przegladarce umozliwiajacy współpracenad dokumentami, polecenia: sudo /etc/rc.d/rc.etherpad-lite start, sudo/etc/rc.d/rc.etherpad-lite stop;

• vsftpd-3.0.3 – serwer FTP, polecenia: sudo rc.ftp start, sudo rc.ftp stop;

• php-5.6.23-hiawatha-10.5 – serwer WWW Hiawatha + PHP, polecenia: sudo lamp.sh start,sudo lamp.sh stop;

• gimp-2.8.18 – zaawansowany edytor graficzny;

• ghostscript-9.19 – narzedzia do przetwarzania jezyka PostScript i fomatu PDF;

• sylpheed-3.5.1 – klient pocztowy z filtrem spamu;

• xnview-0.8.4 – wielofunkcyjny menedzer plików graficznych;

• faenza-icon-1.3 – zestaw ikon Faenza;

• firefox-52.0b1 – przegladarka WWW Firefox;

• qt-creator-4.2.0 – lekkie srodowisko programistyczne dla biblioteki Qt5.

• kivy-1.9.1 – miedzyplatformowy framework do projektowania aplikacji wykorzystujacych naturalny inter-fejs uzytkownika, w tym aplikacji mobilnych;

• pycharm-2016.3-prof – profesjonalne zaawansowane srodowisko IDE dla Pythona w wersji ProfessionalTrial;

• django-1.10.5 – wirtualne srodowisko .pve z frameworkiem Django i biblioteka django-registration;


https://pl.wikipedia.org/wiki/Git_(oprogramowanie)

http://python101.rtfd.org

https://drive.google.com/open?id=0B1zG9cfNyT7WbzRYa2NiM0tZNUU


• mcpi – biblioteki do konstruowania swiata w Minecraft Pi Edition;

• robobt-game – wirtualne srodowisko env z bibliotekami do Robot Game;

• biblioteki-py2 – zob. wyzej.

Zarzadzanie modułami

Moduły z katalogu optional moga byc (de)aktywowane na zadanie. Słuzy do tego Menedzer modułów. W menupodrecznym modułów (po kliknieciu ich prawym klawiszem) znajdziesz równiez polecenia “Activate” i “Deactivate”.

Wskazówki

1. Domyslne konta i hasła: root (administratora) => toor, guest => guest. Konto guest skonfigurowano do wyko-nywania polecen z prawami roota za pomoca komendy sudo. Jezeli po podaniu hasła roota jakas operacja niechce sie wykonac, podaj hasło guest.

2. Jezeli chcesz, aby jakis moduł był wczytywany podczas startu systemu, umiesc go w kataloguporteus/modules. Z kolei moduł usuniety z tego katalogu nie bedzie domyslnie dostepny.

3. Ilosc dostepnego miejsca w pliku zapisu sprawdzimy za pomoca polecen:

4.4. Wskazówki 89

http://python101.readthedocs.io/pl/latest/mcpi/index.html

http://python101.readthedocs.io/pl/latest/rg/index.html


~$ du -sh /mnt/live/memory/changes (poda ilosc zajetego miejsca)~$ df -h /mnt/live/memory/changes (poda ilosc wolnego miejsca)

4. Informacje o komputerze: Start/System/Porteus system info, np. o miejscu instalacji: Porteus/Boot_info.

5. Mozesz korzystac z wielu plików zapisu umieszczonych na pendrajwie. Nazwe aktualnego wpisujesz w plikuboot/syslinux/porteus.cfg:

6. Plik zapisu mozesz powiekszyc:

• start systemu w trybie “Always Fresh mode”;

• nastepnie Start/System/Porteus save file manager i “I want to resize a save file”:

Uwaga: Tworzony jest nowy plik zapisu w podanej lokalizacji zawierajacy dotychczasowe zmiany. Nowymplikiem trzeba nadpisac dotychczasowy!

7. Plik zapisu mozna przenosic miedzy róznymi pendrajwami. Mozna go archiwizowac i przegladac w dowolnymsystemie opartym na Linuksie. W tym celu montujemy plik z uprawnieniami roota np. do katalogu /mnt:



4.4. Wskazówki 91


~$ sudo mount -o loop sciezka_do_pliku/porteussave.dat /mnt

8. Jezeli masz problem z ustawieniem jasnosci ekranu laptopa, spróbuj polecenia z opcjonalnym argumentem:

~$ setbright.sh 190

9. Skróty klawiszowe (Super oznacza klawisz Windows):

• Super+T lub CTRL+AL+T – terminal, np. Terminator;

• Super+F – menedzer plików;

• Super+E – edytor Geany;

• Super+S – edytor Sublime Text;

• Super+Y – IDE PyCharm Professional (moduł opcjonalny);

• Super+W – przegladarka, np. Palemoon;

• Super+R – Lxrandr (zarzadzanie ekranami);

• Super+K – Keepassx (menedzer haseł).

Problemy

1. Jezeli Rufus w MS Windows nie zadziała, rozpakowujemy zawartosc obrazu na pendrajwa, np. za po-moca menedzera archiwów 7zip. Wchodzimy do katalogu boot na pendrajwie(!) i uruchamiamy plikPorteus-installer-for-Windows, upewniamy sie, ze wyswietlona została litera wskazujaca na pen-drajwa i potwierdzamy.

2. Nie kazdy komputer da sie uruchomic z pendrajwa. Mozliwe przyczyny:

4.5. Problemy 93

http://www.7-zip.org/


• BIOS komputera nie obsługuje bootowania z urzadzen USB – to dotyczy starych maszyn (>10 lat?);

• BIOS nie obsługuje konkretnego pendrajwa – to zdarza sie z pendrajwami noname;

• BIOS wymaga zapisania pendrajwa na liscie dysków – trzeba wejsc do BIOSU i ustawic pendrajwa jako pierw-sze urzadzenie startowe na liscie dysków twardych;

• BIOS UEFI – na poczatku spróbujmy trybu generic, pózniej dopiero UEFI.

3. Jezeli polecenie “Otwórz Terminal tutaj” otwiera ciagle ten sam katalog, kliknij prawym klawiszem okno Ter-minatora, wybierz “Preferencje” i odznacz opcje “SerwerDbus”.



ROZDZIAŁ 5

Python

Polecamy dokumentacje Python101, która towarzyszy projektowi “Koduj z Klasa” realizowanemu pod patronatemCentrum Edukacji Obywatelskiej. Tam m. in:

• Podstawy Pythona,

• Gra robotów,

• Minecraft Pi.

Oprócz tego:

Algorytmy

Ponizej kody klasycznych algorytmów w Pythonie. [Komentarz do dopisania]

Trójkat

1 #!/usr/bin/env python2 # -*- coding: utf-8 -*-3 #4 # Badanie mozliwosci zbudowania trójkata i obliczanie jego pola5 # za pomoca wzoru Herona6 # <eCG>7

8 import math # dołaczamy biblioteke matematyczna9

10 op = "t" # deklarujemy i inicjujemy zmienna pomocnicza11 while op != "n": # dopóki wartosc zmiennej op jest inna niz znak "n"12 a, b, c = input("Podaj 3 boki trójkata (oddzielone przecinkami): ")13 # alternatywna forma pobrania danych14 # a, b, c = [int(x) for x in raw_input(15 # "Podaj 3 boki trójkata (oddzielone spacjami): ").split()]16

17 if a + b > c and a + c > b and b + c > a: # warunek złozony18 print "Z podanych boków mozna zbudowac trójkat."19 # czy boki spełniaja warunki trójkata prostokatnego?20 if (a**2 + b**2 == c**2 or21 a**2 + c**2 == b**2 or22 b**2 + c**2 == a**2):23 print "Do tego prostokatny!"

95

http://python101.readthedocs.org

http://www.ceo.org.pl/pl/koduj

http://www.ceo.org.pl/pl

http://python101.readthedocs.io/pl/latest/podstawy/index.html

http://python101.readthedocs.io/pl/latest/rg/index.html

http://python101.readthedocs.io/pl/latest/mcpi/index.html


24

25 # na wyjsciu mozemy wyprowadzac wyrazenia26 print "Obwód wynosi:", (a + b + c)27 p = 0.5 * (a + b + c) # obliczmy współczynnik wzoru Herona28 # liczymy pole ze wzoru Herona29 P = math.sqrt(p * (p - a) * (p - b) * (p - c))30 print "Pole wynosi:", P31 op = "n" # ustawiamy zmienna na "n", aby wyjsc z petli while32 else:33 print "Z podanych odcinków nie mozna utworzyc trójkata prostokatnego."34 op = raw_input("Spróbujesz jeszcze raz (t/n): ")35

36 print "Do zobaczenia..."

Silnia

Wersja iteracyjna i rekurencyjna.

1 #!/usr/bin/env python2 # -*- coding: utf-8 -*-3 #4 # Obliczanie silni metoda iteracyjna i rekurencyjna5 # <eCG>6

7

8 def sil_rek(n):9 if n == 0:

10 return 111 return sil_rek(n - 1) * n12

13

14 def sil_iter(n):15 wynik = 116 for i in range(1, n + 1):17 wynik = wynik * i18 return wynik19

20

21 def main(args):22 n = int(raw_input("Podaj liczbe: "))23 print "sil_iter(%s) = %s" % (n, sil_iter(n))24 print "sil_rek(%s) = %s" % (n, sil_rek(n))25 return 026

27

28 if __name__ == '__main__':29 import sys30 sys.exit(main(sys.argv))

Algorytm Euklidesa

1 #!/usr/bin/env python2 # -*- coding: utf-8 -*-3 #

96 Rozdział 5. Python


4 # Algorytm Euklidesa - znajdowanie najwekszego wspólnego dzielnika5 # <eCG>6

7

8 def nwd_klasyczny(a, b):9 while a != b:

10 if a > b:11 a -= b12 else:13 b -= a14

15 return a16

17

18 def nwd_optymalny(a, b):19 while a > 0:20 a = a % b21 b = b - a22

23 return b24

25

26 def main(args):27 a = int(raw_input("Podaj liczbe a: "))28 b = int(raw_input("Podaj liczbe b: "))29

30 print "Nwd(%, %) klasyczny =", nwd_klasyczny(a, b)31 print "Nwd(%, %) optymalny =", nwd_optymalny(a, b)32

33 return 034

35


Ciag Fibonacciego

Wersja iteracyjna i rekurencyjna.

1 #!/usr/bin/env python32 # -*- coding: utf-8 -*-3 #4 # Ciag Fibonacciego5 # <eCG>6

7

8 def fib_iter0(n):9 """Funkcja zwraca n-ty wyraz ciagu Fibonacciego

10 F(0) = 011 F(1) = 112 F(n) = F(n-2) + F(n-1) dla n > 113 """14 if n == 0:15 return 016 elif n == 1:

5.1. Algorytmy 97


17 return 118 a, b = (0, 1)19 for i in range(1, n - 1):20 a, b = b, a + b21 return b22

23

24 def fib_iter1(n): # definicja funkcji25 """26 Funkcja drukuje kolejne wyrazy ciagu Fibonacciego27 az do wyrazu n-tego, który zwraca.28 Wersja iteracyjna z petla while.29 """30 # dwa pierwsze wyrazy ciagu zapisane w tupli31 a, b = (0, 1) # przypisanie wielokrotne, rozpakowanie tupli32 print(a, end=' ')33 while n > 1:34 print(b, end=' ')35 a, b = b, a + b # przypisanie wielokrotne36 n -= 137

38

39 def fib_iter2(n):40 """41 Funkcja drukuje kolejne wyrazy ciagu Fibonacciego42 az do wyrazu n-tego, który zwraca.43 Wersja iteracyjna z petla for.44 """45 a, b = 0, 146 print("wyraz", 1, a)47 print("wyraz", 2, b)48 for i in range(1, n - 1):49 # wynik = a + b50 a, b = b, a + b51 print("wyraz", i + 2, b)52

53 print() # wiersz odstepu54 return b55

56

57 def fib_rek(n):58 """59 Funkcja zwraca n-ty wyraz ciagu Fibonacciego.60 Wersja rekurencyjna.61 """62 if n < 1:63 return 064 if n < 2:65 return 166 return fib_rek(n - 1) + fib_rek(n - 2)67

68

69 def main(args):70 n = int(input("Podaj nr wyrazu: "))71 print("Wyraz {:d}: {:d}".format(n, fib_iter0(n)))72 print("=" * 40)73 fib_iter1(n)74 print()



75 print("=" * 40)76 fib_iter2(n)77 print("=" * 40)78 print(fib_rek(n - 1))79 return 080

81


Sortowanie

Przez wybór

1 #!/usr/bin/env python2 # -*- coding: utf-8 -*-3 #4 # Sortowanie przez wybór5 # <eCG>6

7

8 from random import randint9

10

11 def sort_wybor(lista):12 n = len(lista)13 for i in range(n):14 k = i15 for j in range(i + 1, n):16 if lista[j] < lista[k]:17 k = j18 # pythonowy składnia dla zamiany wartosci19 lista[i], lista[k] = lista[k], lista[i]20

21 return lista22

23

24 def main(args):25 lista = []26 for i in range(10):27 lista.append(randint(0, 100))28 print lista29 print sort_wybor(lista)30

31


5.1. Algorytmy 99


Konwersja liczby

1 #!/usr/bin/env python2 # -*- coding: utf-8 -*-3 #4 # Konwersja liczby dziesietnej na system o podanej podstawie5 # <eCG>6

7 cyfry = {10: 'A', 11: 'B', 12: 'C', 13: 'D', 14: 'E', 15: 'F'}8 cyfry2 = {v: k for k, v in cyfry.items()}9

10

11 def do10(liczba, podst):12 """13 Funkcja konwertuje liczbe o podanej podstawie na system dziesietny14 Liczba konertowana jest na napis15 """16 p = len(str(liczba)) - 117 liczba10 = 018 for l in str(liczba):19 if l.isdigit():20 liczba10 += int(l) * podst**p21 else:22 liczba10 += cyfry2[l] * podst**p23 p -= 124 print liczba1025

26

27 def konwertuj(liczba, podst):28 """29 Funkcja konwertuje podana liczbe dziesietna na system o podanej podstawie30 wykorzystujac dzielenie z reszta, zwraca liste reszt.31 """32

33 global cyfry34

35 # słownik ze znakami cyfr wiekszych od 936 reszty = [] # pusta lista37 while liczba > 0:38 reszty.append(liczba % podst)39 liczba = liczba / podst40

41 reszty.reverse() # odwrócenie elemnetów listy42 if podst > 10: # zamiana cyfr wiekszych od 943 reszty = [cyfry[x] if x > 9 else x for x in reszty]44 return reszty45

46

47 def main(args):48 liczba = raw_input("Podaj liczbe: ")49 podst = int(raw_input("Podaj podstawe (2-16): "))50 # cel = raw_input("Podaj podstawe systemu docelowego: ")51 do10(liczba, podst)52 # liczbaP = "".join(str(x) for x in konwertuj(int(liczba), podst))53 # print "Liczba(10):", liczba1054 # print "Liczba(%s): %s" % (podst, liczbaP)55

56 return 0



57

58


Szyfr Cezara

Wersja ze stałym kluczem.

1 #!/usr/bin/env python2 # -*- coding: utf-8 -*-3 #4 # Implementacja klasycznego szyfru Cezara5 # <eCG>6

7 """8 ZADANIE9 Pobierz od uzytkownika ciag znaków, zaszyfruj go przy wykorzystaniu

10 szyfru Cezara o kluczu podanym przez uzytkownika,11 wyswietl zaszyfrowany ciag. Nastepnie zdeszyfruj go12 i ponownie wyswietl wynik operacji.13 """14

15

16 def szyfruj(tekst, klucz):17 szyfrogram = ""18 for znak in tekst:19 znak = znak.lower()20 if znak == ' ':21 pass22 elif ord(znak) + klucz > 122:23 znak = chr(ord(znak) + klucz - 26)24 else:25 znak = chr(ord(znak) + klucz)26 szyfrogram += znak27 return szyfrogram28

29

30 def deszyfruj(szyfrogram, klucz):31 tekst = ""32 for znak in szyfrogram:33 if znak == ' ':34 pass35 elif ord(znak) - klucz < 97:36 znak = chr(ord(znak) - klucz + 26)37 else:38 znak = chr(ord(znak) - klucz)39 tekst += znak40 return tekst41

42

43 def main(args):44 tekst = raw_input("Podaj tekst do zaszyfrowania:\n")45 try:46 klucz = int(raw_input("Podaj klucz:\n"))

5.1. Algorytmy 101


47 klucz = klucz % 2648 szyfrogram = szyfruj(tekst, klucz)49 deszyfr = deszyfruj(szyfrogram, klucz)50 assert deszyfr == tekst.lower()51 print "Szyfrogram:\n", szyfrogram52 print "Deszyfracja:\n", deszyfr53 except ValueError:54 print "Błedny klucz!"55 return 056

57

58 if __name__ == '__main__':59 import sys60 sys.exit(main(sys.argv))61

62

63 """64 JAK TO DZIAŁA65 try ... except to konstrukcja która przechwytuje błedy: w bloku try66 uzytkownik moze wprowadzic niewłasciwy klucz, np. litere, wtedy wykona sie67 kod w bloku except.68 def nazwa_funkcji(argumenty): - tak definiujemy funkcje69 return zmienna - instrukcja zwraca wartosc przypisana zmiennej70 nazwa_funkcji(argumenty) - tak wywołujemy funkcje.71 Napisy moga byc indeksowane (od 0), co daje dostep do pojedynczych znaków.72 Funkcja len(str) zwraca długosc napisu, wykorzystana jako argument funkcji73 range() pozwala iterowac po znakach napisu.74 Operator += oznacza dodanie argumentu z prawej strony do wartosci z lewej.75 """

Pierwiastek kwadratowy

Uzycie metody Herona.

1 #!/usr/bin/env python2 # -*- coding: utf-8 -*-3 #4 # Obliczanie wartosci pierwiastka kwadratowego z podanej liczby5 # przy uzyciu metody Herona: a(n) = (a(n-1) + x / a(n-1)) / 26 # <eCG>7

8

9 def pierwiastek(x, d):10 a = x # inicjalizacja szkuanej wartosci11 while abs(a - (x / a)) > d:12 a = (a + (x / a)) / 213 return a14

15

16 def main(args):17 # liczba dla której szukamy pierwiastka18 x = float(raw_input("Podaj liczbe: "))19 # dokładnosc obliczen20 d = float(raw_input("Podaj dokładnosc: "))21 # drukujemy wynik z dokładnoscia do 6 miejsc22 print "Pierwiastek kwadratowy: {:.6f}".format(pierwiastek(x, d))



23 return 024

25


Pole obszaru

Całka nieoznaczona Riemanna. [Sprawdzic poprawnosc obliczen.]

1 #!/usr/bin/env python2 # -*- coding: utf-8 -*-3 #4 # Obliczanie pola obszaru ograniczoneg wykresem funkcji:5 # y = x^2, prostymi x = a, x = b i osia OX6 # (oznaczona całka Riemanna)7 # <eCG>8

9

10 def funkcja(x):11 return x * x12

13

14 def pole(a, b, n):15 p = 0 # wyliczane pole16 d = (b - a) / n # długosc przedziałów w zakresie <a;b>17 for i in range(n):18 x = a + (d * i) + (d / 2) # punkty posrednie przedziałów19 p += abs(funkcja(x)) # suma pól prostokatów20 return p21

22

23 def main(args):24 a = int(raw_input("Podaj lewy kraniec: "))25 b = int(raw_input("Podaj prawy kraniec: "))26 n = int(raw_input("Podaj liczbe przedziałów: "))27 print "Pole: {:.3f}".format(pole(a, b, n))28 return 029

30




5.1. Algorytmy 103

ROZDZIAŁ 6

Linki

Programy

• I-Nex – informacje o systemie

• CPU-X – informacje o systemie

System linux

• Poradnik-systemd-cz.-1



• LxPup : a Puppy with LXDE as its desktop environment


105

http://i-nex.linux.pl

https://github.com/X0rg/CPU-X

http://www.dobreprogramy.pl/mariushko/Poradnik-systemd-cz.-1,67627.html



http://www.murga-linux.com/puppy/viewtopic.php?t=89270&start=690&sid=435b2a9732449069870a278a2601f5a1


106 Rozdział 6. Linki

ROZDZIAŁ 7

Galerie

GetSimple CMS

Instalacja


107


108 Rozdział 7. Galerie

ROZDZIAŁ 8

Indeks

• genindex


109


110 Rozdział 8. Indeks

Indeks

Symbolssrodowisko IDE, 14srodowisko graficzne, 14

AAJAX, 78

CCMS, 78CSS, 78

DDebian, 14

Fframework, 14, 78

GGNU Compiler Collection, 14GPL, 14

HHTML, 78HTTP(S), 78

Iinterpreter, 14, 78

JJavaScript, 78

KKlasa, 61, 63

MMinGw, 14

OObiekt, 61, 63

PPHP, 78plik zródłowy, 61, 63plik nagłówkowy, 61, 63private, 61, 63public, 61, 63Python, 78

QQt, 12, 61, 63Qt Creator, 14, 61, 63

Rresponsywny, 79

Sserwer WWW, 14, 78sloty, 62, 63sygnały, 61, 63system bazodanowy, 14, 78

WWWW, 78

XXML, 78Xubuntu 14.04, 14

111

materiat1l y ecg it documentation

Documents