Chciałem zrobić wpis zaraz po powrocie, ale byłem zbyt wyczerpany Chwila moment i już dwa tygodnie minęły od tegorocznego spotkania PHPCon Poland.

Podobnie jak w latach ubiegłych, spotkanie odbyło się w Hotelu „Przedwiośnie” w Mąchocicach Kapitulnych koło Kielc (btw jeszcze raz wielkie dzięki Łukasz za podwózkę!). Tym razem jednak termin wrześniowy (28 – 30 września) zamiast październikowego z drugiej edycji. Moim zdaniem dobry wybór – bez problemu dało się wytrzymać na sobotnim grillu kilka godzin w jednej bluzie (w przeciwieństwie do ubiegłego roku).

Ponownie ilość chętnych przewyższyła możliwości pojemnościowe, rejestracja została zakończona przed czasem – już w połowie sierpnia

Agenda

W tym roku, wzorem lat ubiegłych, także pojawili się zagraniczni prelegenci: Wim Godden, Thijs Feryn oraz Jeffrey A. „jam” McGuire. Nie zabrakło też bardzo dobrych prezenterów z Polski, pełna agenda dostępna jest na stronie.

Szczególną rzeczą, o której warto wspomnieć było głosowanie na prelekcje. Każdy z zalogowanych użytkowników mógł oddać głoś na wybrane przez siebie propozycje, a przez to mieć wpływ na to, co pojawiło się na finalnej wersji wystąpień. Moim zdaniem umożliwienie odbiorcom aktywnego uczestnictwa w wyborze tematów to świetny pomysł. Doskonale pokazuje ideę tego spotkania – zlotu sympatyków i entuzjastów PHP, zorientowanego na odbiorców.

Organizacja

Jestem pełen podziwu dla organizatorów. Na prawdę należą im się słowa uznania. Niska cena, a taka duża konferencja, tyle prezentacji, do tego w pełne wyżywienie w cenie biletu, zakwaterowanie i jeszcze starczyło na gadżety! Co więcej – nawet na piwko od organizatorów na grillu

Wi-fi działało, na prawdę. Na innych konferencjach albo prawie nie działa, albo od razu wiadomo, że nie będzie (bo uczestnicy będą siedzieć z nosami w laptopach zamiast słuchać prezentacji). Nie to, że pojechałem tam na darmowy interent czasem dobrze mieć sygnał żeby coś ćwierknąć (chociaż Twitter nie był tam zbyt popularny).

Całość wystąpień nagrywana, kamera na statywie – z bardzo ciekawym obciążnikiem stabilizującym. Prezenterzy z mikrofonami zakładanymi za ucho – duży plus za uwolnienie im rąk, live coding staje się od razu łatwiejszy. Były nawet próby podawania mikrofonu zadającym pytania na koniec wystąpień – niestety nie zawsze udane. Tutaj mała uwaga do prezenterów – powtarzajcie zadane pytanie. Dzięki temu reszta sali usłyszy o co ktoś pytał, a później całość znajdzie się na nagraniu.

Rejestracja użytkowników przebiegała sprawnie – przynajmniej nas (może dlatego, że byliśmy jednymi z pierwszych…).

Na początku brakowało mi wywieszonej agendy gdzieś na drzwiach, korytarzu, jednak dość szybko ktoś zauważył ten brak i został on wypełniony.

Event dodany w Joind.in – zachęcam do ocen, komentarzy. Zapewne prelegenci chcą usłyszeć dobre słowo o swoich wystąpieniach, a także uwagi, co powinni poprawić.

Wrażenia

kodujemy. troche frontendu troche backendu… git commit by @supernrm

Te spotkania są niesamowite! Do historii przejdą dyskusje do 6 nad ranem, trzecie piętro, zestawione fotele i pewne wyroby % produkcji znanej tylko wtajemniczonym.

Niewątpliwie przyczyną doskonałej integracji uczestników jest lokalizacja, a szczególnie to, że całość odbywała się w jednym miejscu. Na większości konferencji, na których byłem, zwykle było tak, że same prezentacje odbywają się w jednej lokalizacji, uczestnicy nocują rozlokowani są w hotelach po całym mieście, a impreza odbywa się jeszcze gdzieś indziej. Powoduje to problem z zebraniem wszystkich, integracją, czy nawet samym uczestnictwem niektórych osób w nieformalnych podsumowaniach dnia. Tutaj czegoś takiego nie było – całość odbywała się w jednym hotelu: wystąpienia, posiłki i rozmowy przy piwku. Wszyscy wspólnie, razem – jedna wielka rodzina Soprano.

Ciekawe co będzie w przyszłym roku… Ze względu na tak ogromne zainteresowanie konferencja ma zostać przeniesiona w inne miejsce – mam nadzieje, że nadal będzie to jeden wielki hotel.

Moim zdaniem to jest ogromna moc tych spotkań – dyskusje z ludźmi z branży. Jeden z ważniejszych argumentów za tym, aby taką konferencję odwiedzić osobiście. Możliwość poznania sposobów w jaki inni radzą sobie z pewnymi problemami. Przedyskutowania rozwiązań, porozmawiania z ludźmi mądrzejszymi, bardziej doświadczonymi. Wymiana doświadczeń, poznawanie innych rozwiązań, innego sposobu patrzenia na tematy.

Oczywiście same prelekcje też są ważne Bardzo często dodają zapału do pracy, pokazują nowe rzeczy, o których się nie wiedziało, albo wypracowane przez innych rozwiązania. Jednak prezentacje można zawsze obejrzeć później, są dostępne – nawet wraz z nagraniami i podcastami.

Rozmów kuluarowych nie da się ściągnąć z netu, trzeba być osobiście.

http://raspberrypi.org

W poprzednim wpisie dotyczącym Raspberry Pi pokazałem co należy zrobić aby uruchomić na nim system oraz mini-server www w postaci prostego skryptu nodejs.

RPi nie jest tylko miniaturową wersją zwykłego komputera, na którym można testować aplikacje czy strony www. Do tego można przecież użyć VM (przy tym przydzielić więcej zasobów). Malina ma coś więcej – wbudowany port rozszerzeń GPIO, za pomocą którego możemy wchodzić w interakcje z zewnętrznymi urządzeniami elektronicznymi. Począwszy od prostego świecenia diodami LED, przez odczytywanie wartości z urządzeń aż po bardziej zaawansowane możliwości sterowania.

W tym wpisie pokażę jedną z możliwości – odczyt temperatury z czujnika 1-wire Dallas 18B20.

Aktualizacja systemu

Niestety, w dostępnym w lipcu obrazie Debiana nie było modułu 1-wire, jądro było w wersji 3.1.9.

vokiel@rpi ~$ uname -a
Linux raspberrypi 3.1.9+ #168 PREEMPT Sat Jul 14 18:56:31 BST 2012 armv6l GNU/Linux

Prace przy RPi ciągle trwają, zatem nowe aktualizacje, dodatki pojawiają się bardzo często. W związku z tym potrzebna jest aktualizacja systemu. Dostępnych jest wiele instrukcji, m.in.: http://elinux.org/RPi_Kernel_Compilation, http://www.bootc.net/projects/raspberry-pi-kernel/. Najłatwiejszą wersją (jeśli nie chcecie sami kompilować jądra) jest Hexxeh’s easy updater tool, którego użycie sprowadza się do trzech komend:

wget http://goo.gl/1BOfJ -O /usr/bin/rpi-update && chmod +x /usr/bin/rpi-update

sudo apt-get install ca-certificates

rpi-update 240 #podział pamięci na 240MB CPU / 16MB GPU

Podany sposób nie aktualizuje nam jądra do najnowszej dostępnej wersji, ale jest ona wystarczająca do uruchomienia 1-wire:

vokiel@rpi ~ $ uname -a
Linux rpi 3.2.18+ #20 Mon May 28 17:27:57 EDT 2012 armv6l GNU/Linux

Moduł 1-wire

Wątek na forum RPi dotyczący 1-wire jest dość obszerny: http://www.raspberrypi.org/phpBB3/viewtopic.php?t=6649, ważne jest dla nas jedno – włączenie modułu jądra.

Sprawdźmy najpierw, czy mamy widoczne urządzenie w1 (1-wire):

vokiel@rpi ~ $ ls /sys/bus/
amba  hid  mmc  platform  scsi  sdio  spi  usb 

Jak widać nie, zatem musimy dodać moduł, a następnie zrestartować Malinę

root@rpi:~# modprobe w1-gpio

Po restarcie jest ok:

vokiel@rpi ~ $ ls /sys/bus/
amba  hid  mmc  platform  scsi  sdio  spi  usb  w1

Nasz termometr pojawi się w katalogu /sys/bus/w1/devices/ pod swoim id, np.: 28-00000249bf39. Ale aby to się stało, musimy zabrać się za małe lutowanie.

Elektronika

Dallas 18B20

Dallas 18B20

Na zdjęciu obok widać jak wygląda Dallas 18B20. Jest bardzo mały i poręczny, pasuje do miniaturyzacji samego RPi.

Obok zdjęcia widać schemat oznaczenia nóżek: 0V (GND), DQ, V+ – masa, sygnał, zasilanie. Potrzebujemy jeszcze rezystora o oporności 4,7kΩ, który wstawiamy pomiędzy nóżki 2-3.

Przykładowy schemat: (Dla pewności podłączenia sprawdzajcie datasheet producenta.)

http://nathan.chantrell.net/

Do ukończenia zestawu potrzebne będą jeszcze kabelki. Dobrym źródłem może być stary pc, z którego możemy wymonotować taśmy łączące przedni panel z płytą główną. Zaletą takich kabli są gotowe końcówki, które możemy od razu podpinać do pinów GPIO. Przydadzą się jeszcze rurki termokurczliwe, żeby całość nie wyglądała tak tragicznie jak u mnie – izolowanie za pomocą taśmy.

Jako, że nie jest to blog elektronika, nie będę tu przedstawiał procesu lutowania, w zasadzie nie jest on skomplikowany, ani nawet interesujący. Gotowy zestaw po podłączeniu wygląda następująco:

Podwójna wtyczka (niebieski + szary kabelek) jest podwójna tylko dlatego, że zbrakło mi pojedynczych ;), siwy kabelek jest w tym przypadku niepotrzebny.

Odczyt temperatury

Domyślnie w1-wire dla RPi działa na GPIO4 (pin 7) – niebieski kabelek na zdjęciu powyżej. Proponuję zapoznać się z układem pinów i ich oznaczeniami, wygodny schemat dostępny jest na stronie http://www.raspberrypi-spy.co.uk/2012/06/simple-guide-to-the-rpi-gpio-header-and-pins/. Widoczny na zdjęciu biały kabelek podpięty jest do P1 – zasilanie 3,3V, czarny z tyłu to GND.

Jeśli wszystko zostało podpięte poprawnie, powinniśmy zobaczyć urządzenie w systemie:

vokiel@rpi ~ $ ls -l /sys/bus/w1/devices/
razem 0
lrwxrwxrwx 1 root root 0 wrz 16 08:16 28-00000249bf39 -> ../../../devices/w1_bus_master1/28-00000249bf39
lrwxrwxrwx 1 root root 0 wrz 16 13:04 w1_bus_master1 -> ../../../devices/w1_bus_master1

W katalogu urządzenia zobaczymy kilka plików i katalogów:

vokiel@rpi ~ $ cd /sys/bus/w1/devices/28-00000249bf39
vokiel@rpi /sys/bus/w1/devices/28-00000249bf39 $ ls -la
razem 0
drwxr-xr-x 3 root root    0 wrz 16 08:16 .
drwxr-xr-x 4 root root    0 wrz 16 08:16 ..
lrwxrwxrwx 1 root root    0 wrz 16 13:52 driver -> ../../../bus/w1/drivers/w1_slave_driver
-r--r--r-- 1 root root 4096 wrz 16 13:52 id
-r--r--r-- 1 root root 4096 wrz 16 13:52 name
drwxr-xr-x 2 root root    0 wrz 16 13:52 power
lrwxrwxrwx 1 root root    0 wrz 16 13:52 subsystem -> ../../../bus/w1
-rw-r--r-- 1 root root 4096 wrz 16 13:52 uevent
-r--r--r-- 1 root root 4096 wrz 16 08:16 w1_slave

Najważniejszy dla nas to w1_slave, z którego odczytamy aktualną temperaturę. Możemy to zrobić wykorzystując po prostu program cat:

vokiel@rpi /sys/bus/w1/devices/28-00000249bf39 $ cat w1_slave 
c3 01 4b 46 7f ff 0d 10 2f : crc=2f YES
c3 01 4b 46 7f ff 0d 10 2f t=28187

Jak się nie trudno domyśleć, t=28187 to aktualna temperatura z czujnika (28.187 °C). Oczywiście ta postać nie bardzo nadaje się do dalszego użycia. Sposobów na pobranie temperatury w bardziej czytelnym formacie jest tyle ilu programistów, mój wygląda następująco:

vokiel@rpi /sys/bus/w1/devices/28-00000249bf39 $ \
> cat ./w1_slave | grep t= | cut -f2 -d= | awk '{print $1/1000}'
28.125

Node

Skoro potrafimy już odczytywac temperaturę z czujnika, czas najwyższy połączyć to z nodejs.

Na początek przyda nam się moduł child_process, przy pomocy którego wywołamy sytemową komendę i odbierzemy wynik jej działania.

#!/usr/bin/node

var exec = require('child_process').exec;

var tempId = '28-00000249bf39',
    dispTempInterval,
    dispTempIntervalClock = 10; //sec

var dispTemp = function(){
    exec( "cat /sys/bus/w1/devices/" + tempId + "/w1_slave | grep t= | cut -f2 -d= | awk '{print $1/1000}'", function( error, stdout, stderr ){
        if ( error != null ){
          console.log( "Error: " + error);
        }
 
        var temp = parseFloat(stdout).toFixed(2);
        console.log ( "Current temperature: " + temp + "°C" );
    });
}

console.log( 'Started node-temp');
console.log( '-----------------');

/* Start interval */
dispTempInterval = setInterval( function(){
  dispTemp();
}, dispTempIntervalClock*1000 );

Uruchamiamy skrypt i co 10 sekund otrzymujemy aktulane odczyty temperatury, które możemy zapisać w bazie danych i zrobić z nich ładny wykres.

Started node-temp
-----------------
Current temperature: 22.50°C
Current temperature: 22.50°C
Current temperature: 24.19°C

Po drobnych modyfikacjach ( github – rpi-node-temp ) efekt wygląda troszeczkę lepiej. Dodałem jeden próg, który oddziela „bezpieczną” temperaturę od krytycznej i odpowiednio sygnalizuje to kolorem. Przyłożenie termometru do czipa pokazuje efekt kolorów:

rpi-node-temp

Raspberry Pi

Stworzono dwie wersje: A i B. Różnica między nimi to tylko: ilość portów USB (A – 1xUSB, B – 2xUSB), oraz brak RJ45 w przypadku modelu A. W chwili obecnej można zamówić tylko model B. Z racji swojej oryginalnej nazwy urządzenie funkcjonuje często pod potoczną nazwą „Malina”

Specyfikacja

Urządzenie oparte jest na układzie Broadcom BCM2835 SoC, w skład którego wchodzi procesor, procesor graficzny oraz pamięć RAM:

• ARM1176JZF-S 700 MHz
• VideoCore IV GPU (1080p, h.264/MPEG-4)
• 256MB RAM

Poza tym mamy do dyspozycji szereg portów i złącz:

• 2 x USB 2.0
• HDMI, RJ45
• czytnik SD / MMC / SDIO
• Composite RCA
• wyjście audio – 3,5mm jack

Złącza:

• GPIO
• UART
• szyna I²C
• szyna SPI

Do zasilania tego urządzenia należy zaopatrzyć się w zasilacz 5V (końcówka MicroUSB), minimum 700mA. Pobór prądu jak można się łatwo domyśleć jest bardzo niski – około 2W.

Koszt i zamówienie

Fundacja Raspberry Pi rekomenduje dwa sklepy, które prowadzą sprzedaż międzynarodową, są to: Premier Farnell/Element 14 oraz RS Components.

W moim przypadku, koszt zamówienia wraz z przesyłką wyniósł około 160zł brutto za sztukę (przy zamówieniu czterech sztuk).

Niektórych to zmartwi, ale w przesyłce będzie tylko samo Raspberry Pi, nie ma karty SD, a nawet zasilacza. Każde rozszerzenie należy kupić we własnym zakresie, a może być tego sporo: karta pamięci, zasilacz, myszka, klawiatura, kabel HDMI, kabel sieciowy, hub USB z zewnętrznym zasilaniem, karta WiFi na USB, dysk USB lub pendrive itd.

Szybki start

Malina jest dość popularnym rozwiązaniem w swoim segmencie, nie jest oczywiście jedynym. W związku z dużą popularnością w sieci znajdziemy multum informacji, porad, przykładów zastosowań, programów. Punktem startowym jest pobranie systemu operacyjnego, są specjalnie przygotowane przez samą fundację dostępne na stronie http://www.raspberrypi.org/downloads. Jako, że moim głównym systemem jest Fedora, postanowiłem pobawić się Debianem, w związku z tym pobrałem obraz Raspbian “wheezy”. Prędkość pobierania torrenta oraz ilość udostępniających osób tylko potwierdza dużą popularność.

Przygotowanie karty

Po pobraniu obrazu należy go przenieść na kartę pamięci. W pierwszej kolejności, przed podłączeniem karty sprawdzamy listę urządzeń, np za pomocą df -h.

vokiel@def ~$ df -h
System plików          rozm. użyte dost. %uż. zamont. na
rootfs                  108G   15G   93G  14% /
devtmpfs                3,9G     0  3,9G   0% /dev
tmpfs                   3,9G  1,4M  3,9G   1% /dev/shm
tmpfs                   3,9G  820K  3,9G   1% /run
/dev/sda2               108G   15G   93G  14% /
tmpfs                   3,9G     0  3,9G   0% /sys/fs/cgroup
tmpfs                   3,9G     0  3,9G   0% /media
/dev/sda3               206G   69G  128G  35% /home
/dev/mapper/truecrypt1  374G  251G  104G  71% /media/truecrypt1

Następnie podłączamy kartę i ponownie wywołujemy polecenie df, nowy wpis na liście wskazuje na naszą kartę pamięci, w moim przypadku było to /dev/sdc1, które pojawiło się na końcu poprzedniej listy.

Karta pamięci może posiadać kilka partycji, wtedy każda z nich pokaże się osobno. Gdy już znamy lokalizację karty odmontowujemy ją korzystając z polecnia umount.

vokiel@def ~$ umount /dev/sdc1

W tym momencie przystępujemy do faktycznego przeniesienia obrazu systemu na kartę SD, użyjemy programu dd – służącym do niskopoziomowego kopiowania i konwersji surowych danych. Należy zwrócić szczególną uwagę na właściwe podanie parametrów, w przypadku pomyłki możemy nadpisać, a przez to stracić ważne dane. Składnia w moim przypadku wyglądała następująco:

vokiel@def ~$ sudo dd bs=1M if=/home/vokiel/Downloads/rpi/2012-07-15-wheezy-raspbian.img of=/dev/sdc1

Parametr bs to rozmiar bloku w pojedynczej operacji odczytu, parametr if to źródło (input file), natomiast of to cel (output file). Wykonanie tego polecenia zajmie chwilę – 1,8GB danych do przeniesienia na kartę, dużo zależy od jej prędkości zapisu.

Niestety program dd domyślnie nie wyświetla żadnego postępu, przez co oczekiwanie bez widocznych postępów jest irytujące. Aby podejrzeć jak sobie radzi skorzystamy z drugiej konsoli, w której wyszukamy proces dd, a następnie za pomocą polecenia kill spowodujemy, że dd zacznie odpowiadać:

vokiel@def ~$ pgrep -l '^dd$' #sprawdzamy id procesu
vokiel@def ~$ sudo watch -n 5 kill -USR1 20326

W konsoli, w której uruchomiliśmy program dd powinniśmy zacząć otrzymywać informacje o postępach.

Po zakończeniu kopiowania dobrze jest zrobić synchronizację dysku z pamięcią, dzięki temu będziemy mieli pewność, że dane zostały fizycznie zapisane na karcie. Do tego celu służy program sync:

vokiel@def ~$ sync

Dostępne są też instrukcje dla systemu Windows jak i Mac OS X: RPi Easy SD Card Setup

Pierwsze uruchomienie

Przygotowaną kartę pamięci wkładamy do czytnika RPi, myszka, klawiatura, monitor, na koniec podłączamy zasilanie (u mnie świetnie się sprawdza ładowarka od Nokii – 5V, 1200mA). Malina nie ma włącznika, zatem włączenie/wyłączenie odbywa się odpowiednio poprzez podłączenie/odłączenie zasilania. Po podłączeniu na ekranie pojawia się coś zbliżonego do tego:

Następnie pojawia się możliwość zalogowania do systemu. Domyślny login i hasło dostępne są na stronie pobierania, dla Debiana „Wheezy” to pi z hasłem: raspberry. Konto root nie ma hasła, zatem po zalogowaniu do systemu należy zmienić te dla pi (lub dodać nowe konto) oraz ustawić hasło superużytkownika.

Przy pierwszym uruchomieniu pojawia się możliwość dokonania wstępnej konfiguracji systemu:

Standardowo mamy zainstalowane i skonfigurowane środowisko graficzne, uruchamiamy je poleceniem startx

W taki oto sposób mamy działający komputer ze środowiskiem graficznym. Niestety szybkość działania i responsywność nie jest na najwyższym poziomie. Jednak jak na taką cenę oraz koszty użytkowania (bardzo niski pobór prądu) i przy takiej miniaturyzacji otrzymujemy na prawdę wiele. Z pewnością nie zastąpi nam desktopa/notebooka, ale jako dodatkowe narzędzie może zdziałać wiele.

Początkowa konfiguracja

Jako, że jest to blog webdeveloperski, to RPi w pierwszej konfiguracji zostało przetestowane pod kątem serwera www. Aby ułatwić sobie pracę skonfigurujmy system.

pi@raspberrypi ~$ uname -a
Linux raspberrypi 3.1.9+ #168 PREEMPT Sat Jul 14 18:56:31 BST 2012 armv6l GNU/Linux

W pierwszej kolejności ustawiamy hasło konta root, a następnie dodajemy swojego użytkownika i usuwamy domyślnego pi (lub przynajmniej zmieniamy mu hasło).

pi@raspberrypi ~$ sudo passwd root

pi@raspberrypi ~$ sudo adduser vokiel
Dodawanie użytkownika "vokiel"...
Dodawanie nowej grupy "vokiel" (1002)...
Dodawanie nowego użytkownika "vokiel" (1001) w grupie "vokiel"...
Tworzenie katalogu domowego "/home/vokiel"...
Kopiowanie plików z "/etc/skel" ...
Proszę podać nowe hasło UNIX: 
Proszę ponownie podać hasło UNIX: 
passwd: hasło zostało zmienione
Zmieniam informację o użytkowniku test
Wpisz nową wartość lub wciśnij ENTER by przyjąć wartość domyślną
        Imię i nazwisko []: Vokiel
        Numer pokoju []: 
        Telefon do pracy []: 
        Telefon domowy []: 
        Inne []: 
Czy informacja jest poprawna? [T/n] T

Możemy też użyć komendy useradd

Dodajemy użytkownika do sudoersów:

pi@raspberrypi ~$ su
Hasło:
root@raspberrypi: /home/pi# echo "vokiel ALL=(ALL:ALL) ALL" >> etc/sudoers

Przelogowujemy się na nowe konto, następnie usuwamy użytkownika pi

vokiel@raspberrypi ~$ sudo userdel pi

Następnie konfigurujemy adres IP. Najwygodniejszy jest stały, który możemy ustawić np poprzez router – rezerwacja IP lub ustawiając w systemie RPi. Wybrałem drugą opcję, dzięki czemu połączenie sieciowe startuje szybciej – nie musi czekać na przydzielenie adresu z DHCP. Przy okazji zmieniłem też nazwę hosta na rpi. Po ustawieniu statycznego adresu mój pli konfiguracyjny wygląda następująco:

vokiel@rpi ~ $ cat /etc/network/interfaces
auto lo
iface lo inet loopback

#iface eth0 inet dhcp #zakomentowana domyślna konfiguracja
iface eth0 inet static
        address 192.168.1.254
        netmask 255.255.255.0
        network 192.168.1.0
        broadcast 192.168.1.255
        gateway 192.168.1.100

Dzięki temu, możemy wyłączyć RPi, odpiąć monitor, klawiaturę, myszkę i podpiąć gdzieś koło routera, a resztę prac wykonywać zdalnie przy pomocy ssh (demon domyślnie uruchomiony).

Aby logowanie na zdalną maszynę z naszego komputera przebiegało sprawniej dodajemy IP Maliny do listy /etc/hosts. Dzięki temu będziemy mogli logować się za pomocą komendy ssh vokiel@rpi

root@def /# echo "192.168.1.254 rpi" >> /etc/hosts

Aby nie było trzeba wpisywać hasła przy każdym logowaniu, możemy posłużyć się kluczami. Kopiujemy swój za pomocą ssh-copy-id:

vokiel@def ~ $ ssh-copy-id vokiel@rpi

Pierwsze logowanie przy użyciu kluczy – nie trzeba podawać hasła:

vokiel@def ~$ ssh vokiel@rpi
The authenticity of host 'rpi (192.168.1.254)' can't be established.
RSA key fingerprint is aa:1a:25:1e:d7:fd:d9:03:73:65:5c:74:ef:9f:1d:62.
Are you sure you want to continue connecting (yes/no)? yes
Warning: Permanently added 'rpi,192.168.1.254' (RSA) to the list of known hosts.
Linux rpi 3.1.9+ #168 PREEMPT Sat Jul 14 18:56:31 BST 2012 armv6l

The programs included with the Debian GNU/Linux system are free software;
the exact distribution terms for each program are described in the
individual files in /usr/share/doc/*/copyright.

Debian GNU/Linux comes with ABSOLUTELY NO WARRANTY, to the extent
permitted by applicable law.

Type 'startx' to launch a graphical session

Last login: Sat Aug 11 19:20:20 2012 from def
vokiel@rpi ~ $ 

Jeśli lokalnie jesteśmy zalogowani na koncie o tej samej nazwie co konto zdalne, to wystarczy przy logowaniu podać nazwę hosta:

vokiel@def ~$ ssh rpi

Przydział pamięci

Jako, że nie planuję korzystać z graficznego interfejsu, zmniejszyłem przydział pamięci dla grafiki:

vokiel@rpi ~ $ sudo cp /boot/arm224_start.elf /boot/start.elf 

Po restarcie widzimy, że dostępnej pamięci jest trochę więcej (a i użytej nie tak dużo):

Serwer www

Debian na pokładzie, zatem instalację serwera www możemy przeprowadzić korzystając ze standardowego apt-get install. Oczywiście, możemy też pokusić się o kompilację, co w przypadku ograniczonych możliwości RPi ma duży sens. Niestety kompilacja nodejs w moim przypadku trwała ponad 2 godziny, aby na koniec rzucić błędem. Ponieważ chciałem jak najszybciej uruchomić pierwszy skrypt, skorzystałem z pakietów.

Sprawdzamy źródła w /etc/apt/sources.list, następnie aktualizujemy bazy.

vokiel@rpi ~ $ cat /etc/apt/sources.list
deb http://mirrordirector.raspbian.org/raspbian/ wheezy main contrib non-free rpi
vokiel@rpi ~ $ sudo apt-get update
vokiel@rpi ~ $ sudo apt-get install nodejs npm
vokiel@rpi ~ $ sudo npm install nodeinfo

Tworzymy prosty skrypt pokazujący info o serwerze:

#!/usr/bin/node 

var http = require('http');
var os = require('os');
var url = require('url');
var serverIp = '192.168.1.254';
var serverPort = '8080';

function addStyle(res){
  var style = "";
  style += '<style type="text/css">';
  style += "\n body { font-size: 10px; font-family: Verdana, Arial, Tahoma; background: #fff;}";
  style += "\n table {collapse: collapse;} ";
  style += "\n table thead tr th { font-weight: bold;} ";
  style += "\n table tr td { border-bottom: 1px solid silver; vertical-align: top; padding: 5px 20px;}";
  style += "\n</style>";

  res.write(style);
}
function getRemoteAddr(req){
  return req.headers['x-forwarded-for'] || req.connection.remoteAddress;
}
function log(msg){
  var now = new Date();  
  var log = now.toUTCString();
  log += "\t" + msg;
  console.log(log);
}

http.createServer(function (req, res) {
  log(getRemoteAddr(req) + "\t" + req.headers['user-agent']);

  res.writeHead(200, {'Content-Type': 'text/html; charset=utf-8'});

  res.write('<html><title>Raspberrypi nodejs server</title><meta charset=utf-8">');
  addStyle(res);
  res.write('<body>');

  res.write('<h2>Client</h2>');
  res.write('<table><thead><tr><th>var</th><th>value</th></tr></thead><tbody>');
  res.write('<tr><td>User-agent: </td><td>' + req.headers['user-agent'] + '</td></tr>');
  res.write('<tr><td>IP: </td><td>' +  getRemoteAddr(req) + '</td></tr>');
  res.write('</tbody></table>');

  res.write('<h2>Server</h2><table><thead><tr><th>var</th><th>value</th></tr></thead><tbody>');

  Object.keys(os).map(function(method) { 
        if ( method != 'getNetworkInterfaces' ){
                 res.write('<tr><td>' + method + "</td><td><pre>"+JSON.stringify(os[method]())+'< /pre></td></tr>'); 
        }
  })
  res.write('</tbody></table>');
  res.write('</body></html>');
  res.end();

}).listen(serverPort, serverIp);

log('Server running: ' + serverIp +':'+serverPort);

Uruchamiamy i sprawdzamy wynik w przeglądarce

vokiel@rpi ~ $ node server.js
Sat, 11 Aug 2012 18:30:10 GMT   Server running: 192.168.1.254:8080
Sat, 11 Aug 2012 18:30:14 GMT   192.168.1.103   Opera/9.80 (X11; Linux x86_64; U; pl) Presto/2.10.289 Version/12.00

Voila! Działający serwer www, pobierający mniej niż 2W prądu. Wystarczy przekierować port na r0outerze i mamy własnego, taniego vps’a jeśli mamy stały IP, to już całkiem bajka.

Przy ciągłej pracy, pod dużym obciążeniem RPi zaczyna się wyczuwalnie grzać, ale wystarczy mały radiator, aby temperatura spadła do akceptowalnego poziomu.

Podsumowanie

RPi to bardzo ciekawe rozwiązanie, z dnia na dzień powstają nowe pomysły na jego wykorzystanie. Skupia przy osbie dużą społeczność, która jest bardzo aktywna. Do dyspozycji mamy blogi, fora, a nawet dedykowany miesięcznik „The MagPi issue”. Na głównej stronie raspberrypi.org pojawia się szereg infromacji o projekcie, nowości, przykłady zastosowań etc. Na dzień dzisiejszy RPi jest wykorzystywany na wiele sposobów, ciągle pojawiają się nowe. Jedne idą bardziej w kierunku automatyki, inne oprogramowania, multimediów. Popularność projektu powoduje, że powstają dedykowane RPi porty różnych aplikacji, dzięki temu można wycisnąć z Maliny jeszcze więcej.

PHPCon Poland 2012

Tegoroczna konferencja objęta została sponsoringiem firmy MegiTeam, swój wkład potwierdzili też Microsoft oraz Mentax. Impreza pod medialnym patronatem serwisów php.pl, OSWorld, OSNews, 7thguard.net oraz webhosting.pl. A od teraz, też blog.Vokiel.com.

Co nam przyniesie tegoroczna edycja? Przede wszystkim bardzo istotną zmianę – uczestnicy mają po raz pierwszy realny wpływ na agendę. To właśnie głosy uczestników zadecydują o tym kogo i z czym będzie można usłyszeć podczas konferencji.

Na agendę (poszczególne prelekcje) można głosować na stronie www.phpcon.pl/agenda. W chwili tworzenia tego wpisu dostępnyc jest 29 propozycji – jest o co walczyć, bo w programie spotkania ma szansę pojawić się ich tylko kilkanaście. Prelekcje zostaną dobrane na podstawie liczby oddanych głosów w rankingu, rozpiętość jest już dość znaczna – od 7 do 39 głosów.

Warto wspomnieć o gościach specjalnych, w tym roku są to:

• Wim Godden, który ma w swoim dorobku pracę dla takich projektów jak choćby PHPAdsNew, a w tej chwili zajmuje się skalowalnością i HA.
• Thijs Feryn – organizator konferencji PHPBenelux oraz ewangelista odpowiedzialny za kontakty społecznościowe z belgijskiego Combella – firmy hostującej m.in. joind.in.
• Jam McGuire – drupalista duszą i ciałem, pracujący dla niemieckiej firmy Aquia i reprezentujący Drupala, gdy tylko nadarzy się okazja.

Czas i miejsce

PHPCon 2012 odbędzie się w dniach 28 – 30 września 2012 r w miejscowości Mąchocice Kapitulne (rejon Gór Świętokrzyskich). Miejscem wystąpień będzie położony niedaleko Kielc Hotel Przedwiośnie ***.

Do tych co wybierają się na PHP Con 2012 – do zobaczenia we wrześniu!

WordCamp Poznań 2011

Stowarzyszenie ABSOLWENCI NA WALIZKACH w swoim kanale na Youtube.com umieściło nowe nagrania z zeszłorocznego WordCamp’a. To już druga seria nagrań z tej konferencji, w tej pojawiło się także moje wystąpienie. W pierwszej serii pojawiły się prezentacje czterech prelegentów: Arek Stęplowski, Michał Maćkowiak, Maciej Kuchnik, Magdalena Bród. Druga okazała się trochę bardziej rozbudowana: Szymon Skulimowski, Marcin Wolak, Marcin Pietrzak, Bartosz Bilicki, Paweł Pela oraz Robert Mikołajuk.

Zapraszam do zapoznania się z moją relacją z tego wydarzenia, a także do obejrzenia nagrań z wielu ciekawych wystąpień.

Moje wystąpienie

Tematem mojej prezentacji było tworzenie wtyczek, główne punkty to m.in:

• Wstęp o WordPress i o sile wtyczek
• Podstawy wtyczek
• Organizacja pracy, zasady tworzenia, podstawowe błędy
• Praktyczny przykład tworzenia wtyczki od podstaw
• Integracja z panelem administracyjnym

Moje wystąpienia (playlista)

Hardware

Ze sprzętem zawsze mam problem, bo podchodzę do wyboru bardzo pragmatycznie. Porównuję konfiguracje, parametry, nadaje im wagi, wybieram konkretny model w wyniku długotrwałych porównań. Tak też było ostatnim razem, ważna była wielkość matrycy, i7 ze wsparciem dla AES i wirtualizacji, szybki dysk, niska cena ;). Excel w ruch i voila, wybrałem ASUS’a:
ASUS X43S: 14″, i7-2670QM, 2,26GHz, 8GB RAM, 750 GB SATA 7200 obr., Radeon HD 6730M 2048 MB DDR3 (pamieć własna).
Dlaczego nie Apple? Nie chcę zaczynać flame, ale jakoś nie czuję, żeby MacOSX był wart 3 000zł.

W zestawie myszka bezprzewodowa Logitech M525 oraz monitor Philips Brilliance 225PL – z możliwością ustawienia w „trzech wymiarach”, bez dodatkowej klawiatury – brak miejsca na biurku, ale już nie tak długo ulegnie to zmianie.

Do tego stary laptop ma Win7 x64 do testów pod Windowsem.

Telefon – Nokia e52. Smartfony jakoś mnie nie przekonują, z założenia telefon ma służyć do dzwonienia i pisania sms. Ten ma jeszcze bardzo dobrą nawigację, Opera mobile do szybkiego sprawdzenia czegoś na necie (Wi-Fi), putty w razie konieczności nagłej interwencji na serwerze, czytnik kodów QR, własna appka typu ToDoList (html+javascript). Możliwości duże, telefon mały, bateria trzyma do dwóch tygodni.

Software

• system operacyjny – Linux Fedora 16, poprzednio Windows 7 oraz Linux Mint, wcześniej jeszcze czysty Debian. Debian nadal stoi na VM, jeden Mint na najstarszym Laptopie.
• application stack – PHP 5.3, Apache2, MySQL – HeidiSQL (wine) – tak jak zauważył Radek Heidi jest po prostu świetne, czasem jeszcze MySQL Workbench
• framework – Kohana
• IDE – Eclipse, jakoś NetBeans nie przypadł mi do gustu, przyzwyczajenie wygrywa, PHPStorm w testach trial’a wypadło bardzo dobrze, prawdopodobnie niedługo kupię
• edytor tekstowy – genialny, niezastąpiony Notepad++, w konsoli nano
• IM – Pidgin, z kilkoma wtyczkami jest na prawdę przyjazny, poza XMPP obsługuje też Twitter’a, IRC’a, no i Gadu-Gadu, do tego Skype – ten linuxowy jest taki świetnie minimalistyczny, o niebo przyjaźniejszy niż na Win
• launcher – po prostu ALT+F2
• przeglądarka – główna Opera – subiektywnie od dawien-dawna jest najwygodniejsza do codziennej pracy, poza tym wiadomo: Firefox, Chrome, Krusader, IE8 na VM z WinXP, IE9 na drugim laptopie z Win7
• terminal – standardowy z ustawionymi kolorami, bash
• menadżer pakietów – yum oraz apper
• VM – VirtualBox, chociaż powoli rozglądam się za alternatywą, bo VBox potrafi być irytujący
• FTP – FileZilla, Krusader, w niektórych przypadkach SSHFS
• mail – Thunderbird, dla niektórych kont webowy GMail, wcześniej TheBat
• muzyka – Amarok, ale brakuje mi prostego Winampa czy ALSong
• video – VLC, MPlayer, najbardziej przywiązany byłem do SubEdit’a oraz Media Player Classic
• pakiet biurowy – LibreOffice, na Win Office 2007 – co by nie mówić, jest to świetny program
• prezentacje – generalnie nie robię ;), ostatnio na Wordcamp’a w HTML+CSS – engine z Google, poza tym Impress lub PowerPoint

Z rzeczy , o których Radek nie pisał:

• monitoring serwera – munin, phpmemcached. Dodatkowo jeśli mogę to tu podpiąc – conky rysujący najważniejsze rzeczy na bieżąco
• zarządzanie projektami – repozytorium git i svn, spięte razem z Redmine
• manager plików – krusader lub mc, na Win – TotalCommander. Nie wyobrażam sobie pracy pomiędzy okienkami
• grafika – Photoshop, FastStone Image Viewer, Gwenview
• rss – czytnik Google, wcześniej w Operze
• snippets – JCC (jCodeCollector), opisowe – Gnote
• ważne dane – TrueCrypt

Podsumowanie

Jeśli chcecie poznać jakieś szczegóły, sposoby pracy czy interesuje Was coś więcej – piszcie śmiało w komentarzach.
Przekazuję piłeczkę dalej, kto następny chętny do opisania swojego środowiska pracy?

src: http://http.cdnlayer.com

Ochrona własnego adresu poczty elektronicznej stała się „oczywistą oczywistością”. Niezliczone spam-boty przeczesują Internet w poszukiwaniu adresów email, które później zalewane są falą niechcianej poczty. Niestety często jesteśmy zmuszeni udostępnić swój adres. Wpisany zwykłym tekstem, a tym bardziej dodany do linku z mailto stanie się bardzo szybko łupem spamerów. O ile na formę upublicznienia adresu w obcych serwisach zwykle nie mamy wpływu, o tyle mamy w przypadku własnych. Jako, że potrzeba jest matką wynalazku, postanowiłem stworzyć własne rozwiązanie. Połączenie CSS i JavaScript przyniosło oczekiwany skutek.

Założenia protectEmails

Tworząc założenia starałem się patrzeć na problem możliwie z wielu stron. Najważniejszymi punktami są:

1. Czytelność dla użytkownika końcowego
2. Ochrona przed podstawowymi mechanizmami spam-botów
3. Łatwość modyfikacji wyglądu
4. Prostota w stosowaniu

Czytelność dla użytkownika końcowego

Przede wszystkim chciałem uniknąć rozwiązań typu info [at] example.com, które poza tym, że już dawno nie chronią przed botami, to dodatkowo są męczące dla użytkowników. Wszystkie odmiany tego rozwiązania charakteryzują się tą samą trudnością w pozyskaniu maila przez odwiedzającego stronę – podmiana fragmentów, łatwość pomyłki. Tworząc swoje rozwiązanie, chciałem, aby adres email był widoczny w zwykłej formie, po prostu jako info@example.com.

Dodatkowo, uważam, że ważne jest też zachowanie standardowej funkcjonalności linku, który otwiera domyślny program pocztowy klienta.

Ochrona przed podstawowymi mechanizmami spam-botów

Rozwiązanie musi być w jakiś sposób unikatowe, tak aby standardowe funkcje spamerów nie były w stanie takiego adresu wyłuskać. Oczywiście, nie da się zabezpieczyć w 100%, zawsze znajdzie się ktoś, kto napisze dedykowane rozwiązanie. Jednak dużą część automatów można wyeliminować.

Poszukując gotowych rozwiązań spotkałem się z dużą ilością pseudo-zabezpieczeń. Nie dość, że utrudniają one życie użytkownikom, to dodatkowo wystawiają adresy na pastwę botów, np.:

<a href="mailto:info@example.com">info [ at ] example.com</a>

<a href="mailto:info@example.com">info [ at ] example [dot] com</a>

Lub po prostu utrudniają życie, np.:

<span class="email">info [ at ] example [dot] com</spam>

W przypadku powyższego istnieją rozwiązania oparte na JavaScript, które na podstawie klasy modyfikują znacznik span, przerabiając go na klikalny adres email. Jest to dość dobre rozwiązanie z jednym mankamentem – adres jest czytelny dla botów.

Łatwość modyfikacji wyglądu

Oczywiście chroniony adres musi być w pełni modyfikowalny przy pomocy CSS, zatem odpadają dziwne rozwiązania oparte na obrazkach zamiast znaku @. Chciałem też uniknąć dużego zagnieżdżania znaczników, jak w proponowanym przez niektórych rozwiązaniu:

<a href="mailto:info@example.com">
    <span class="n">info</span><span class="at">@</span><span class="d">example.com</span>
</a>

Czy modyfikacji powyższego, poprzez zamianę kolejności znaczników i taką modyfikację CSS, aby elementy zostały ustawione w odpowiedniej kolejności:

<a href="mailto:info@example.com">
    <span class="at">@</span><span class="n">info</span><span class="d">example.com</span>
</a>

Prostota w stosowaniu

Wraz z wzrostem bezpieczeństwa zwykle rośnie też poziom skomplikowania, co niestety, przekłada się na utrudnienia w stosowaniu. Niestety te rozwiązanie nie zadziała w powiązaniu ze standardowymi edytorami WYSIWYG. Oczywiście nic nie stoi na przeszkodzie, aby dopisać odpowiednie modyfikacje.

W obecnej wersji wstawienie zabezpieczonego adresu email sprowadza się w zasadzie do dwóch zadań: wpisanie znacznika z adresem oraz podpięcia pluginu (oczywiście pamiętając do dołączeniu biblioteki jQuery):

<span data-user="admin" data-domain="example.com" class="protect-emails" />

$(document).ready(function(){
    $('span').filter('.protect-emails').protectEmails();
});

Chcąc uniezależnić się od JavaScript lub zachować jedynie podstawową funkcjonalność, należy też załączyć odpowiedni fragment CSS (domyślnie plugin dodaje go sam):

.protect-emails:after {  content: attr(data-user) '@' attr(data-domain); }

Zasada działania

Pierwsza część rozwiązania skupia się na zaprezentowaniu adresu użytkownikowi, nawet jeśli JavaScript jest wyłączony. Dzieje się to za pomocą prostego zabiegu wykorzystującego CSS, a dokładnie właściwości content wspartej wykorzystaniem attr

Dzięki ustawieniu odpowiedniego ostylowania, element html, który domyślnie nic nie wyświetla, pokazuje użytkownikowi poprawnie wyglądający email:

<span data-user="admin" data-domain="example.com" class="protect-emails" />

.protect-emails:after { 
    content: attr(data-user) '@' attr(data-domain);
}

Przykład 1:

Kolejnym elementem jest dodanie „klikalności”. Jest to już rozwiązanie oparte na JavaScript. Nie ma tu czego opisywać, po prostu dla wybranej akcji hover czy click skrypt podmienia znacznik span.

Przykład 2:

Korzyści

• Niewątpliwie największą korzyścią jest ukrycie adresu email przed botami, przynajmniej do czasu, stworzenia dedykowanego rozwiązania ;). Nawet jeśli takie powstanie, wtyczkę można łatwo przerobić pod własne unikalne rozwiążanie.
• Zachowuje się pierwotną funkcjonalność.
• Adres jest czytelny dla użytkowników nawet w przypadku wyłączonego JavaScript. Można go skopiować, wkleić w programie pocztowym, nie trzeba przepisywać [at] na @
• Dwuetapowe zabezpieczenie może być wykorzystane tylko w części, zapewniając podstawowy poziom ochrony.

Poznań, 14 stycznia 2012 r – konferencja meet.js summit, choć minął już tydzień od tego wydarzenia, ja wciąż jestem pod wrażeniem. Konferencja była niejako podsumowaniem lokalnych spotkań meet.js. Są to niekomercyjne meetup’y front-endowców, na których prezentowane są prelekcje na tematy webowe (front-endowe), jts HTML, JS, CSS.

Organizacja

Konferencję zorganizowali Damian Wielgosik wraz z GTUG Poznań oraz Startup-It.pl. Obsługa uczestników przebiegała szybko i sprawnie, technicy pod ręką, wszyscy chętni do pomocy. Chylę czoła za jakość organizacji tego darmowego(!) eventu.

Miejsce: Centrum Wykładowe Politechnki Poznańskiej – duży, przestronny, nowoczesny budynek, sale wykładowe, sporo wolnego miejsca na korytarzach. Dzięki temu prezentacje na były łatwiejsze w odbiorze, a duża przestrzeń na korytarzach spokojnie pomieściła te ponad 250 osób. Nawet podczas przerw kawowych czy lunchu.

Gadżety: dużym zaskoczeniem była duża ilość gadżetów i nagród. Sponsorzy spisali się świetnie. Były naklejki meet.js i Front-Trends, smycze od Mozilli oraz Allegro Group, zniżki 10€ na konferencję Front-Trends 2012. Poza tym do zgarnięcia były kubki i koszulki Google, naklejki HTML5, koszulki Mozilli, Nodejitsu i HTML5, pendrive’y i smycze Nokii. Każdy dostał koszulkę, przy tym wartym wspomnienia jest, że można było zaprojektować własną lub zaproponować tekst do chmurki z komiksu. Wykazując się taką inwencją brało się udział w konkursie, w którym główną nagrodą był iPod!

To nie koniec, były ciastka, a do nich kawa i/lub herbata (woda dla unikających używek ). Był też lunch (3 dania do wyboru), tak jak reszta – darmowy. Po całodniowej konferencji nastąpiło zasłużone afterparty (dzięki Cognifide), na którym każdy z uczestników otrzymał kupony do wykorzystania w barze.

Przebieg i prezentacje

Całość rozpoczęła się od 10 rano (rejestracja od 9) a zakończyła następnego dnia w godzinach porannych w Alcatraz Club. Prezentacje były przeplatane z przerwami kawowymi oraz lunch’em. Był zatem czas na zmianę sali oraz przygotowanie dawki kofeiny.

Z racji dużej liczby prezentacji (18) całość została podzielona na 2 ścieżki. Osobiście nie przepadam za takimi rozwiązaniami bo czasem jest bardzo trudno się zdecydować, którą prelekcję wybrać. Z tego względu nie uczestniczyłem we wszystkich w których bym chciał. Na szczęście całość wystąpień była nagrywana, zatem jest szansa, że zobaczę te, które niestety ominąłem.

Prelekcje były różne, na różnym poziomie przygotowania merytorycznego i technicznego oraz językowego (wszystkie po angielsku). Niektórzy wypadli świetnie, inni nieco gorzej.

Po tygodniu, mocno w pamięci zostały prezentacje, m.in:

• Marek Stępień: The Web is Open. Let’s keep it that way – ciekawie o inicjatywie Open Web
• Andrzej Mazur: CSS4 and the future of CSS – o nowinkach w przyszłych specyfikacjach CSS
• Kamil Trebunia: Game design patterns – live coding (oparty na revertach commitów), plus świetne komentarze Now we have more time to enjoy the children dying., Dying is something you can subscribe to
• Lukas Nowacki: Team building and development practices – o ulepszaniu programowania w stylu Tarantino jak przystało na prawdziwych reservoir devs
• Aleksander Dąbrowski: Write once – use twice (Back & Front) – o nie duplikowaniu, o nieduplikowaniu kodu
• Zef Hemel: Avoiding JavaScript Pitfalls Through Tree Hugging – o przytulaniu się do drzewa
• Bartosz Szopka: CSS 3D Transforms – za pomocą CSS 3D transforms – impress.js jest na prawdę impressive
• Patrick H. Lauke: HTML5 multimedia – browser-native video, audio and canvas – o audio i viedeo z niesamowitymi demami z wykorzystaniem kamery internetowej, elementu video i JavaScript

Podsumowanie

Bardzo szybko zebrane prezentacje są do obejrzenia na profilu G+ GTUG’a, z niecierpliwością czekam na nagrania.

Świetna impreza, miła atmosfera, sporo znajomych osób. Oczywiście była reprezentacja forum.kohanaphp.pl – pzdr @mck, @nrm). Był też @chemikpl, którego poznałem osobiście na ostatnim WordCamp’ie i inni. Kolejny raz pojawiły się okazje do osobistego poznania tych, których kojarzyło się z neta, pozdr @wokiebpl, @singlespl oraz @end3r.

Inne relacje: end3r, ferrante, pavelloz, michalbe, jPortal.pl, ChemikPIL

Przygotowanie na najwyższym poziomie, pomimo iż cała impreza była darmowa. Jeszcze raz, wielkie brawa.

WordCamp Poznań 2011

W dniach 9-10 grudnia w Poznaniu odbyła się kolejna konferencja z serii WordCamp. Jak sama nazwa wskazuje jest to konferencja poświęcona WordPressowi. WordCampy są organizowane na całym świecie przez użytkowników WordPressa i dla użytkowników WordPressa. Poznańska edycja była organizowana przy aprobacie WordCamp Central co niosło ze sobą kilka korzyści, ale też ogrom więcej pracy, z czym dzielnie poradził sobie Paweł. Grono zainteresowanych było bardzo duże. Tematy prelekcji zróżnicowane, każdy mógł znaleźć coś dla siebie.

Tym razem, uczestniczyłem w konferencji jako prelegent. W długiej, nudnej, mocno technicznej prezentacji opowiedziałem o tworzeniu wtyczek: Tworzenie wtyczek – oszczędzaj swój czas (o tym w dalszej części).

Organizacja

Organizacyjnie event przygotowany był świetnie. Biorąc pod uwagę cenę wejściówki (40zł) poziom przerósł moje oczekiwania. Był pakiet dla każdego uczestnika, poza tym kawa, herbata, ciastka, woda i soki. Oczywiście nie zabrakło niespodzianek – pizza każdego dnia, RedBulle i middle-party w klubie Charyzma – gdzie Paweł przekazał uczestnikom multum kuponów na alko w barze.

Technicznie też było dobrze, jeden projektor trochę niedomagał, ale były dwa, więc to nie był żaden problem, nagłośnienie w porządku, baterie w mikrofonach wymieniane na bieżąco. Jako, że całość odbywała się na uczelnianej sali wykładowej warunki do prezentacji były bardzo dobre.

Nie obyło się bez losowania nagród w postaci książek, zniżek (99%), licencji na wtyczki.

Przebieg

Impreza rozpoczęła się właściwie w czwartek od preparty, dzięki której mogliśmy się dobrze zintegrować. The Brothers Pub było idealnym wyborem, niepowtarzalny klimat, niesamowita Orzechówka (Jurek Ty to potrafisz namówić ), a te ciastka…

Następnego dnia wystartowaliśmy z prezentacjami. Ich przebieg możecie prześledzić w Agendzie. Prelekcje były różne, na różnym poziomie, skierowane do różnych odbiorców, na pewno każdy znalazł taką, która go zainteresowała.

Przerwy po każdym wykładzie dawały szansę omówienia tematu na świeżo, dopytania się o szczegóły, wymiany poglądów.

Po zakończeniu pierwszego dnia przyszedł czas na relaks i zabawę w świetnym gronie w klubie Charyzma. Nauczeni doświadczeniem, nie mogliśmy zakończyć wieczoru bez Orzechówki.

Następnego dnia, pomimo tego, że zaplanowaną godzina rozpoczęcia była 10, z racji bardzo udanego wieczoru nie była możliwa do zrealizowania. Na szczęście większość dała radę dotrzeć na 10:30, zatem udało się rozpocząć bez większych opóźnień.

Prezentacje

Wśród wielu interesujących prezentacji kilka szczególnie zwróciło moją uwagę. Ciekawa prezentacja Arka Informacja Rulez!, która natchnęła mnie kilkoma pomysłami na wtyczki (jeśli jeszcze nie istnieją). Bardzo podobała mi się prezentacja Michała o błędach HTML5, wyróżniała się profesjonalnym przygotowaniem i przeprowadzeniem, przy okazji dała mi motywację, aby wreszcie przepisać swojego bloga na html5. Ogromny zestaw wtyczek przedstawiła Magda w swojej prezentacji o optymalizacji i pozycjonowaniu (czekam na slajdy). Na koniec dnia praktyczne informacje przedstawione w dwóch prezentacjach: o szablonach-dzieciach oraz o frameworkach w WordPress dały wiedzę o tym jak pracować wydajniej i szybciej.

Drugiego dnia najbardziej do gustu przypadła mi prezentacja Pawła o zarabianiu na WordPressie. Dużo praktycznej, popartej doświadczeniem wiedzy o pracy freelancera i młodego przedsiębiorcy. Świetnie przeprowadzona, bardzo motywująca. Bartek przypomniał o tym, że strona oparta na WordPress to nie tylko unikalny front-end, ale także mocno kastomizowany panel administracyjny. Dobrym dopełnieniem mojej prezentacji było wystąpienie Konrada o lukach bezpieczeństwa.

Moje wystąpnie

Tematem mojej prezentacji było tworzenie wtyczek. W planie prezentacji był krótki wstęp o samym WordPress, o tym, że to właśnie system wtyczek jest jedną z głównych przyczyn jego funkcjonalności. Następnie pokazałem czym są wtyczki oraz na czym się opierają. Przed stworzeniem pierwszej wtyczki zaprezentowałem kilka ważnych rzeczy z zakresu organizacji pracy nad wtyczkami, zasad tworzenia, kilka zdań o podstawowych błędach. Dalej, pokazałem jak tworzyć wtyczki od podstaw, przechodząc przez najprostszą aktywność, aż do bardziej zaawansowanych integracji wtyczki z WordPressem. Pokazałem jak zaszczepić wtyczkę w kilku miejscach admin-panelu (kokpit, adminbar, menu, contextual help). Pokazałem jak obsłużyć bazę danych oraz system ustawień. Na koniec, po połączeniu wszystkich elementów, powstała dedykowana konferencji wtyczka.

Mam nadzieję, że prezentacja była ciekawa, interesująca. Czekam na komentarze, opinie, propozycje usprawnień.

Oczywiście udostępniam całą prezentację wraz z poszczególnymi etapami tworzenia wtyczki. Samą prezentację najlepiej przeglądać korzystając z przeglądarki wspierającej CSS3, w innych działanie może nie być do końca takie, jak powinno.

Test przecięć

Do wykonania testu przecięć potrzebna będzie tablica ze współrzędnymi badanego punktu, oraz tablica współrzędnych (podanych w kolejności) wierzchołków wielokąta. Tablice te przekażemy w konstruktorze.
Ważną rzeczą jest sprawdzenie czy ostatni i pierwszy element tablicy wierzchołków jest taki sam, czyli czy figura się zamyka. Jeśli nie to w konstruktorze uzupełniamy tablicę kopię pierwszego elementu.

Kolejnym etapem jest sprawdzenie czy punkt należy do do jednego z boków wielokąta.
Jeśli powyższe sprawdzenie się nie powiedzie rozpoczynamy właściwą część, tj. sprawdzenie przecięć. W tym celu tworzymy półprostą, tutaj równoległą do osi OX, rozpoczynającą się w sprawdzanym przez nas punkcie, a kończącą się w dowolnym punkcie poza ostatnim punktem wielokąta (najbardziej wysuniętym w kierunku grotu osi OX).

Po utworzeniu półprostej przechodzimy do właściwego badania przecięć. W pierwszej kolejności pod młotek idzie sprawdzenie zawierania się półprostej w jednym z boków wielokąta (rys. 3, rys. 4 w poprzednim wpisie). Aby to sprawdzić musimy przetestować czy kolejne 2 punkty wielokąta należą do tej półprostej. Jeśli tak się zdarzy to sprawdzamy, z którym przypadkiem mamy do czynienia (czy punkty leżą po tej samej, czy po przeciwnych stronach półprostej). Jeśli po przeciwnej – zwiększamy licznik przecięć.

Jeśli półprosta nie zawiera się w boku wielokąta trzeba sprawdzić czy przypadkiem nie przecina jego wierzchołka. Aby to osiągnąć sprawdzamy czy wierzchołek zawiera się w półprostej a zarazem czy poprzedni i następny już nie. Jeśli sprawdzanie się powiedzie to pozostaje rozpoznać, z którą wersją mamy do czynienia (rys. 5, rys. 6 w poprzednim wpisie). W zależności od wyniku, albo zwiększamy licznik przecięć, albo nie. Jeśli natomiast warunek zawierania się wierzchołka nie zostanie spełniony sprawdzamy czy bok wielokąta przecina półprostą, a zarazem poprzedni wierzchołek jej nie przecina, jak również następny.

inPolygon.class.php

/**
 * @author Robert *Vokiel* Mikołajuk vokiel@vokiel.com http://blog.vokiel.com
 * @copyright (c) 2011 Robert Mikołajuk
 */
class inPolygon {
  /**
   * @var  array  $point  Współrzędne prawdzanego punktu
   */
  protected $point;
  /**
   * @var  array  $raypoint  Punkt końcowy półprostej od $this->point równoległej do osi OX 
   */
  protected $raypoint;
  /**
   * @var  array  $polygon  Tablica współrzędnych punktów
   */
  protected $polygon;
  /**
   * @var  int  $crosses  Liczba przecięć odcinków
   */
  protected $crosses = 0;

  /**
   * 
   * @param array $point
   * @param array $polygon
   */
  public function __construct($point,$polygon){
    $this->point = $point;
    $this->raypoint = array('x' => ($point['x']+1), 'y' => $point['y']); 
    $this->polygon = $polygon;

    // jeśli ostatni element nie jest tożsamy z pierwszym, dodajemy go na końcu tablicy
    if ( $this->polygon[0] != $this->polygon[count($this->polygon)-1]){
      array_push($this->polygon,$this->polygon[0]); 
    }
  }
  
  /**
   * Sprawdzenie czy punkt zawiera się w obszarze
   * @return bool
   */
  public function check(){
    // sprawdzenie czy punkt nie należy do jednego z boków wielokąta
    for ($i=0; $i<count($this->polygon); $i++){
      if ( $this->pointCrossEdge($this->polygon[$i],$this->polygon[$i+1],$this->point) ){
        return true;
      }
    }
    if ( $this->setRaypoint() ){
      $this->edgeCross();
    }
    if ($this->crosses % 2 == 1){
      return true;
    }
    return false;
  }
  
  /**
   * Wyznaczenie punktów półprostej równoległej do osi OX
   * Współrzędna X punktu P1 musi być większa od największej wpsółrzędnej X wśród wszystkich wierzchołków wielokąta
   */
  protected function setRaypoint(){
    for ($i=0; $i<count($this->polygon); $i++){
      if ( $this->polygon[$i]['x'] > $this->raypoint['x'] ){
        $this->raypoint['x'] = $this->polygon[$i]['x'];
      }
    }
    $this->raypoint['x'] = $this->raypoint['x']+1;
    return true;
  }
  
  /**
   * Wyliczenie ilości przecięć półprostej przez odcinki boków wielokąta 
   * Półprosta zostaje przeprowadzona od badanego punktu w prawo, 
   * aż za najbardziej wysunięty w prawo punkt wielokąta  
   */
  protected function edgeCross() {
    // wstawienie na koniec tablicy punktów wielokąta drugiego wierzchołka - dla ułatwienia obliczeń
    array_push($this->polygon,$this->polygon[1]);
    for ($i=1; $i<(count($this->polygon)-1); $i++){
      // Prosta P-P1 zawiera się w boku wielokąta W($i,$i+1) 
      if ($this->pointCrossEdge($this->point, $this->raypoint, $this->polygon[ $i ]) &&
        !$this->pointCrossEdge($this->point, $this->raypoint, $this->polygon[ ($i+1) ]) 
      ){
        // Punkt wcześniejszy wielokątea i dalszy leżą po przeciwnej stronie prostej P-P1 - ilość przecięć: 1
        if ($this->sng( $this->det( $this->point, $this->polygon[ $i ], $this->polygon[ ($i-1) ] ) ) != 
          $this->sng( $this->det( $this->point, $this->polygon[ $i ], $this->polygon[ ($i+1) ])) 
        ){
          $this->crosses++;
        }
      } else { // Prosta P-P1 nie zawiera się w boku wielokąta
        // Prosta P-P1 zawiera wierzchołek W($i)
        if ($this->pointCrossEdge( $this->point, $this->raypoint, $this->polygon[ $i ] ) &&
          $this->pointCrossEdge( $this->point, $this->raypoint, $this->polygon[ ($i-1) ] ) &&
          !$this->pointCrossEdge( $this->point, $this->raypoint, $this->polygon[ ($i+1) ] )
        ){
          // Sprawdzenie położenia wierzhołków sąsiadujących z wierzchołkiem W($i)
          if ($this->sng( $this->det( $this->point, array('x'=>($this->point['x']+1),'y'=>$this->point['y']), $this->polygon[ ($i-1) ] ) ) !==
            $this->sng( $this->det( $this->point, array('x'=>($this->point['x']+1),'y'=>$this->point['y']), $this->polygon[ ($i+1) ] ) )
          ){
            $this->crosses++;
          }
        } else {
          // Sprawdzenie czy prosta P-P1 przecina bok wilokąta W($i,$i+1)
          if ( $this->edgeCrossEdge( $this->polygon[ $i ], $this->polygon[ ($i+1) ], $this->point, $this->raypoint) &&
            (!$this->pointCrossEdge( $this->point, $this->raypoint, $this->polygon[ ($i-1) ] ) ||  
              (
                !$this->pointCrossEdge( $this->point, $this->raypoint, $this->polygon[ ($i-2) ] ) &&
                !$this->pointCrossEdge( $this->point, $this->raypoint, $this->polygon[ ($i-3) ] )
              ) && (
                $this->sng( $this->det( $this->point, array('x'=>($this->point['x']+1),'y'=>$this->point['y']), $this->polygon[ ($i-1) ] ) ) !==
                $this->sng( $this->det( $this->point, array('x'=>($this->point['x']+1),'y'=>$this->point['y']), $this->polygon[ ($i-2) ] ) )
              )
            ) && !$this->pointCrossEdge( $this->point, $this->raypoint, $this->polygon[ ($i+1) ] )
          ){
            $this->crosses++;
          }
        }
      }
    }
  }
  
  /**
   * 
   * Sprawdzenie czy $check_point należy do odcinka ($start_point|$stop_point) 
   * @param array $start_point  Punkt startowy odcinka
   * @param array $stop_point   Punkt końcowy odcinka
   * @param array $check_point  Sprawdzany punkt
   */
  protected function pointCrossEdge($start_point,$stop_point,$check_point){
    return $this->det($start_point, $stop_point, $check_point) == 0 &&
      min( $start_point['x'], $stop_point['x'] ) <= $check_point['x'] &&
      $check_point['x'] <= max( $start_point['x'], $stop_point['x'] ) &&
      min ( $start_point['y'], $stop_point['y'] ) <= $check_point['y'] &&
      $check_point['y'] <= max( $start_point['y'], $stop_point['y'] );
  }
  
  /**
   * Sprawdzenie czy odcinki $start_point_1-$stop_point_1 i $start_point_2-$stop_point_2 przecinają się
   * @param array $start_point_1  Punkt startowy pierwszego odcinka 
   * @param array $stop_point_1  Punkt końcowy pierwszego odcinka 
   * @param array $start_point_2  Punkt startowy drugiego odcinka 
   * @param array $stop_point_2  Punkt końcowy drugiego odcinka 
   */
  protected function edgeCrossEdge($start_point_1,$stop_point_1,$start_point_2,$stop_point_2){
    return ($this->sng( $this->det($start_point_1,$stop_point_1,$start_point_2) ) != $this->sng( $this->det($start_point_1,$stop_point_1,$stop_point_2) ) && 
        $this->sng( $this->det($start_point_2,$stop_point_2,$start_point_1) ) != $this->sng( $this->det($start_point_2,$stop_point_2,$stop_point_1) ) ||
        $this->pointCrossEdge($start_point_1,$stop_point_1,$start_point_2) ||
        $this->pointCrossEdge($start_point_1,$stop_point_1,$stop_point_2) ||
        $this->pointCrossEdge($start_point_2,$stop_point_2,$start_point_1) ||
        $this->pointCrossEdge($start_point_2,$stop_point_2,$stop_point_1)
    );
  }
  
  /**
   * Wyznacznik macierzy kwadratowej stopnia 3
   * @param array $start_point
   * @param array $stop_point
   * @param array $check_point
   */
  protected function det($start_point,$stop_point,$check_point){
    return $start_point['x'] * ( $stop_point['y'] - $check_point['y'] ) + $stop_point['x'] * ( $check_point['y'] - $start_point['y'] ) + $check_point['x'] * ( $start_point['y'] - $stop_point['y']);
    /* druga metoda
    return ($start_point['x'] * $stop_point['y'] + $stop_point['x'] * $check_point['y'] + $check_point['x'] * $start_point['y'] - $check_point['x'] * $stop_point['y'] - $start_point['x'] * $check_point['y'] - $stop_point['x'] * $start_point['y']);
    */ 
  }
  
  /**
   * Określenie znaku liczby
   * @param int $x  Liczba
   * @return int $x
   */
  protected function sng($x){
    if ( $x == 0 ){
      return 0;
    } else if ( $x > 0){
      return 1;
    } else {
      return -1;
    }
  }
  
}// end of inPolygon class

Na koniec przydałoby się napisać jakieś demo. Wkrótce się pojawi.