TechLife devBlog

# Techblog

Mikro struktury HTML

Kodowanie, Techblog 2 lipca 2011 19:16

Z doświadczenia wiem, że najlepsze rozwiązania, to takie, do których doszedłem sam ewolucyjnie. Wtedy najlepiej rozumiem do czego one są i dlaczego tak a nie inaczej działają. Jest to o wiele lepsza metoda niż przyjmowanie nawyków innych osób, których sami do końca nie rozumiemy. Dlatego najczęściej nie stosuję różnych narzędzi tylko dlatego, że inni je polecają ale czekam spokojnie aż sam dojdę do punktu, w którym uznam, że dokładnie takiego narzędzia potrzebuję. Swoją drogą w ten sposób uwalniam się od stosowania przeróżnych udziwnień, które w rzeczywistości nie są przydatne / efektywne / nie do końca wiadomo w czym pomocne.

Po kilku dobrych latach kodowania stron coraz wyraźniej zaczynam dostrzegać co jest potrzebne do szybkiego i sprawnego budowania interfejsów www -- mikro struktury. HTML ma to do siebie, że jest dość "niskopoziomowy", dzięki czemu można za jego pomocą poskładać do kupy różne cuda. Kiedy jednak chcemy szybko zbudować interfejs składający się z często powtarzających się elementów (list, przełączników, kontrolek, pasków postępu, przycisków, komunikatów, okien dialogowych itp) odkrywamy nagle, że tak na prawdę brak nam widgetów czy kontrolek znanych z różnych środowisk graficznych. Za każdym razem budujemy je na nowo z "niskopoziomowych" klocków HTML-a zamiast po prostu wziąć i wykorzystać gotowe struktury. Coś jak np. interfejsy dla telefonów:

Android GUI

Jednym słowem chodzi mi o coś w rodzaju połączenia mikroformatów z Zen Garden. Jeżeli stworzymy odpowiednio elastyczną strukturę uzyskamy możliwość stylowania jej CSS-em na wiele różnych sposobów. Weźmy na przykład prostą listę:

  • Element 1
  • Element 2
  • Element 3
  • Element 4

Jeżeli zamienimy ją w uniwersalną strukturę:

  • Element 1
  • Element 2
  • Element 3
  • Element 4

Otrzymujemy obiekt, który może uzyskać praktycznie nieskończenie wiele kształtów. Na dodatek biorąc tą samą strukturę i zmieniając nazwę klasy z vertical-list na horizontal-list możemy uzyskać listę poziomą. Oczywiście każda struktura może mieć kilka wariantów wyglądu np vertical-list-v2.

Używając takich struktur w swoim kodzie, dostosowanie ich do nowego projektu mogło by się ograniczyć wyłącznie do podłączenia innego arkusza stylującego struktury. Podobnie jak jest to rozwiązane w przypadku galerii jQuery UI.

Nie bardzo chce mi się wierzyć, że nikt przede mną jeszcze na to nie wpadł, więc jeżeli znacie jakieś podobne projekty to bardzo proszę o linki bo samemu nie udało mi się nic sensownego znaleźć.

Cywilizacja Open Source

Kodowanie, Techblog 22 maja 2011 18:01

Kiedy słyszymy Open Source nasze skojarzenia biegną w kierunku systemu Linux, przeglądarki Firefox czy też śp. pakietu OpenOffice (obecnie LibreOffice) oraz niezliczonej ilość podobnych programów, z których mniej lub bardziej świadomie korzystamy na co dzień. Open Source kojarzy się nam najczęściej z informatyką i stylem wytwarzania oprogramowania. Jednak Open Source to coś więcej niż informatyka, to styl myślenia, który powoli ale nieodwracalnie wymyka się z pola informatyki i zaczyna kiełkować w przeróżnych dziedzinach.

To co chcę przekazać w tej notce może wydać się dość niepozorne jeżeli nie znamy tła jakim jest obecny status i kształt systemu, który wytwarza nam dziś wszelkie dobra. Najlepiej zapoznać się wcześniej z filmami typu: Zeitgeist: Moving Forward czy The Light Bulb Conspiracy. Pierwszy z nich pokazuje przyczyny, które zmuszają naszą cywilizację do produkcji bubli oraz marnowania zasobów, natomiast drugi pozwala nam zobaczyć ten proces w praktyce.

Czasami, żeby zrobić krok do przodu, trzeba najpierw zrobić dwa do tyłu, porzucić rozwiązania, które zaprowadziły nas w ślepy zaułek i zaprojektować od podstaw nowe, dzięki którym trafimy na autostradę rozwoju.

Arduino

Jeżeli studiowaliście elektronikę lub informatykę na pewno na laborkach uczyliście się programować jakieś proste układy w postaci (specjalnie przygotowanych do nauki) płytek drukowanych z przeróżnymi układami elektronicznymi. Problem z tymi układami (miałem z nimi styczność w technikum i na studiach) polegał na tym, że były one:

  • dość drogie
  • do ich obsługi wymagane było specjalne dostarczane przez producenta oprogramowanie (oczywiście też drogie) i dostępne wyłącznie na Windowsa
  • dostęp do układów miałem tylko na laborkach bo ani nie miałem ochoty kupować na rok tak drogiego sprzętu, ani nie miałbym go jak uruchomić bo nie mam Windowsa

Jak widać takie praktyki w żaden sposób nie zachęcają do przybliżenia młodemu człowiekowi elektroniki. Z podobnym problemami ścierano się również w innych krajach i tym sposobem narodził się projekt Arduino.

Arduino The Documentary (2010) English HD from gnd on Vimeo.

Linki:
- Wikipedia o Arduino
- www.arduino.cc - strona domowa

Oczywiście Arduino to dopiero początek, mały klocek LEGO na bazie którego mogą powstawać nowe otwarte rozwiązania.

Open Source Ecology

Wstępem do tego projektu najlepsza będzie prelekcja Marcina Jakubowskiego wygłoszona w ramach konferencji TED.

BTW. Marcin został wyróżniony odznaką TED Fellow 2011. Jeszcze intro ze strony projektu:

Marcin odwiedził już w tym roku Polskę, do której przyjechał na zaproszenie organizatorów konferencji Cohabitat Gathering 2011. Poniżej bardzo swobodna rozmowa zarejestrowana po konferencji.

Marcin Jakubowski CHG 2011 - II from dobraidea on Vimeo.

Global Village Construction Set (GVCS) ułatwia rozpoczęcie prac w sektorze rolniczym, budowlanym oraz produkcji i może być postrzegany jako naturalnej wielkości "Zestaw Lego" narzędzi modułowych, które pozwalają stworzyć całą gospodarkę, zarówno na wiejskich terenach Missouri, w którym projekt został założony, w górach Oregon, lub w sercu Afryki. Projektując bez granic, zarówno myślowych jak i praktycznych, jesteśmy pewni że GVCS może przełamać bariery wykonalności i kosztów budowy od podstaw prawdziwej trwałej i zrównoważonej wspólnoty, oraz gospodarki funkcjonującej w oparciu o lokalne zasoby.

Tak jak pisałem na początku, niektórym projekt może się to wydać dość niepozorny. W końcu stworzono tylko niezbyt estetycznie wyglądający traktor czy zgniatarkę do ziemi. Bardziej zainteresowało by to pewnie rolnika niż przeciętną osobę techniczną. Jednak cały sens projektu ukryty jest w jego filozofii, czyli filozofii Open Source. Weźcie pod uwagę np. fakt, że dopiero ostatnio producenci telefonów komórkowych zdecydowali się produkować zgodne ze sobą ładowarki (sic!). Przez Wykop przetaczają się teraz notki o tym, jak to producenci drukarek oszukują nas za pomocą tuszy. Tych problemów (pokazanych też w The Light Bulb Conspiracy ) jest całe mnóstwo. Nie wyrwiemy się z nich dopóki nie przestawimy swoich schematów myślenia na tory Open Source.

Tak więc parafrazując jest to mały traktor dla człowieka ale wielki dla ludzkości. Poza tym traktor to dopiero początek. Kilka dni temu pojawiły się pierwsze testy stołu do cięcia. Przypomnę, że jednym z jego głównych założeń jest samoreplikacja podobnie jak w przypadku słynnej drukarki 3D RepRap. Na liście projektów do stworzenia czekają jeszcze takie rzeczy jak: drukarka 3D, skaner 3D, 50kW turbina wiatrowa, automobil czy ciężarówka.

Nie sposób o tym wszystkim opowiedzieć, dlatego zachęcam do zapoznania się z różnymi zaułkami strony projektu.

Linki:
- opensourceecology.org - strona projektu

PS. Od jakiegoś czasu ilość moich notek technicznych jest zastępowana przez notki nietechniczne dodawane na moim drugim blogu poświęconym zagadnieniom alternatywnym. Jeżeli kogoś interesuje taka tematyka to zapraszam. Co do notek technicznych to chyba będę musiał zamieszczać je w bardziej skróconej formie, bo na zebranie materiałów i skompilowanie z nich jakiegoś tekstu mam coraz mniej czasu, czego skutek najczęściej jest taki, że pomysł na notkę umiera na etapie pomysłu.

Django: usuwanie cache'u generowanego przez szablon

Kodowanie, Django, Techblog 25 marca 2011 23:58

Sytuacja jest następująca: 1989 rok, Kijów. Piękna ukraińska jesień. Czterech urodzonych morderców, uzbrojonych po zęby, a ja sam, jeden, z moim wiernym kałachem... mamy jakiś kawałek szablonu, którego wygenerowanie kosztuje nas sporo zasobów np. wiele zapytań do bazy. Cache'ujemy więc w szablonie wygenerowany HTML aby ulżyć serwerowi. Np. tak:

{% load cache %}

{% cache 604800 statystyki %}
   jakiś super zasobożerny w generowaniu kod HTML
{% endcache %}

Wszystko działa ładnie. Cache wygasa co tydzień (604800 sekund) i wszystko gra. Problem pojawia się jednak, kiedy wygenerowany kod zależy bezpośrednio od jakiegoś obiektu lub obiektów. Kiedy dany obiekt jest modyfikowany chcielibyśmy usunąć cache generowany przez szablon. Rozwiązanie wydaje się być dość logiczne:

from django.core.cache import cache

cache.delete('statystyki')

Niestety powyższy kod robi nic. Template tag tworzy cache generując klucz:

args = md5_constructor(u':'.join([urlquote(resolve_variable(var, context)) for var in self.vary_on]))
cache_key = 'template.cache.%s.%s' % (self.fragment_name, args.hexdigest())

Jak widzimy schemat jest następujący:
template.cache.KLUCZ-Z-SZABLONU.ZAKODOWANE_ARGUMENTY

Jeżeli nie używaliście argumentów w szablonie przy stworzeniu klucza cache'u (czyli nie zrobiliście np. czegoś takiego: {% cache 604800 statystyki request.user %}) to Wasza lista argumentów będzie pusta. Suma MD5 z pustego stringa zawsze wynosi tyle samo, więc dla cache'u tworzonego bez argumentów klucz jest stały i wygląda tak:

cache.delete('template.cache.statystyki.d41d8cd98f00b204e9800998ecf8427e')

Xfce4.8 - przewodnik

Linux, Software, Techblog 18 stycznia 2011 20:30

Poniższy tekst jest tłumaczeniem oficjalnego przewodnika po nowej wersji Xfce 4.8:

Przewodnik

Ten przewodnik przedstawi Ci wszystkie ważniejsze wizualne nowości w Xfce 4.8. Jest to tylko wizualna część tego co zostało dokonane, pełną listę zmian możecie zobaczyć w dzienniku zmian. Przewodnik po Xfce 4.6 jest również nadal dostępny.

Thunar - menadżer plików

Zdalne przeglądanie współdzielonych plików

Thunar posiada teraz wsparcie dla GVFS, dzięki czemu możliwe jest przeglądanie zdalnych współdzielonych zasobów używając Thunara oraz serwerów: FTP, Windows Shares, WebDav i SSH.

zrzut ekranu

Nowe okno dialogowe postępu operacji plikowych

Kiedy kilka operacji plikowych (kopiowanie lub przenoszenie) jest wykonywanych równolegle, Thunar teraz pokaże pojedyncze okno dialogowe, które będzie zawierało wszystkie zagregowane informacje.

zrzut ekranu

Przycisk usunięcia dla urządzeń przenośnych

Jest teraz możliwe usunięcie zamontowanych urządzeń poprzez kliknięcie na przycisk usunięcia (eject) w pobliżu nazwy urządzenia przenośnego w panelu bocznym.

zrzut ekranu

Panel Xfce

Panel Xfce w wersji 4.8 został całkowicie przepisany. Poniżej najbardziej zauważalne zmiany.

Ulepszone pozycjonowanie oraz zarządzanie rozmiarami

Xfce panel posiada teraz znacznie lepsze wsparcie dla pozycjonowanie poszczególnych paneli na ekranie. Mogą one być przeciągane i przyklejane do krawędzi ekranu. Pozycja jest zapamiętywana przy przeciąganiu panelu a sam panel może posiadać szerokość określaną w procentach długości ekranu.

Przezroczyste tła

Panel umożliwia teraz ustawienie przezroczystości jego tła jednocześnie pozostawiając jego elementy nieprzezroczystymi. Twoje panele pozostaną więc czytelne a jednocześnie ładnie wyglądające.

zrzut ekranu

Nowe edytor elementów

Nowa funkcjonalność panelu - edytor elementów - pozwala na szybką modyfikację, przesuwanie, dodawanie i usuwanie elementów. Jest to funkcja szczególnie użyteczne dla pojedynczych elementów, których nie trzeba już przeklikiwać kolejno prawym klawiszem, aby wyedytować ich zawartość. Wszystkie elementy oraz ich układ mamy dostępne w jednym miejscu.

zrzut ekranu

Tworzenie aktywatorów metodą przeciągnij i upuść

Możesz teraz przeciągnąć i upuścić elementy z menu aplikacji, wyszukiwacza aplikacji lub Thunara wprost na panel, aby utworzyć aktywator. Ta funkcjonalność powinna zadowolić sporą rzeszę użytkowników, którzy domagali się jej od lat. Aktywatory mają również zintegrowany wyszukiwacz aplikacji, który przydaje się przy dodawaniu kolejnych elementów.

Wtyczka przycisków okien

Wtyczki "Ikony okien" oraz "Lista okien" zostały teraz połączone w jedną wtyczkę o nazwie "Przyciski okien". Zawiera one inne metody sortowania ulepszone działanie w pionowych panelach oraz umożliwia stworzenie podobnej ramki jak Xfwm4 podczas przełączania Alt+tab, kiedy najedzie się na przycisk.

Nowy rozmyty zegar

Nowe wydanie Xfce bez nowego trybu zegara nie było by prawdziwym wydaniem. Pozwólcie nam przedstawić nowy "rozmyty tryb" zegara!

zrzut ekranu

Nowa wtyczka - menu katalogów

Wtyczka menu katalogów dostarcza nowe menu odwzorowujące układ każdego katalogu. Pozwala to na otwarcie konsoli lub menadżera plików w danym podkatalogu w bardzo szybki i efektywny sposób.

zrzut ekranu

Edycja manu aplikacji

Możesz teraz edytować menu za pomocą każdego zgodnego z Freedesktop edytora. Do naszych testów użyliśmy Alacarte.

Dialogi ustawień Xfce

Ulepszona konfiguracja multihead setup

Xfce wspiera teraz multihead setup dla każdego zgodnego z randr 1.2 sterownika. Niestety oznacza to, że nie zadziała na własnościowych sterownikach Nvidii.

Możesz aktywować lub dezaktywować dołączane ekrany, ustawiać ich rozdzielczość, częstość odświeżania, kąt obrotu oraz odbicie, klonować oraz rozciągać ekrany.

Czasowe potwierdzenie

Wszelkie zmiany potwierdzane za pomocą okna dialogowego ustawień muszą zostać zaakceptowane w przeciągu 10 sekund. W przeciwnym wypadku zostaną cofnięte. Zapobiegnie to uszkodzeniu np. sterowników wideo podczas nieobecności przy komputerze.

zrzut ekranu

Szybkie okno ustawień

Szybkie okno ustawień pozwala skonfigurować podwójny ekran w kilka sekund. Podłącz drugi ekran, naciśnij klawisz display lub Windows+p i wybierz żądany układ. Gotowe!

Edycja ustawień za pomocą edytora ustawień Xfce

Edytor ustawień Xfce teraz w pełni zasłużył na swoją nazwę. Nie jest on już zwykła przeglądarką ustawień (Xfconfig). Możesz teraz modyfikować, dodawać i przywracać ustawienia poprzez interfejs. Potrafi on także monitorować i na bieżąco aktualizować widok.

zrzut ekranu

Usprawniona sekcja układu klawiatury

Widok sekcja układu klawiatury otrzymał sporo miłości. Nie pokazuje już zaszyfrowanych kodów język/wariant ale używa tłumaczonych nazw języków. Edycja układu klawiatury stała się również łatwiejsza poprzez wypełnianie pól przez aktualne wartości.

zrzut ekranu

Flash player i pseudo-strumień MP4

Kodowanie, Linux, Software, Techblog 10 stycznia 2011 19:07

Co jakiś czas przychodzi mi osadzać na stronach pliki FLV z jakimś Flashowym playerem. Oczywiście nie ma z tym żadnego problemu, jednak obecnie nadciąga moda na pliki MP4 kodowane przez h264. Flash od wersji 9 umożliwia odtwarzanie tego typu plików jednak jest ale. Żeby Flash zaśpiewał jak mu MP4 zagra, potrzebuje wyciągnąć z niego metadane (w tym cały indeks zawartości pliku) czyli tzw. obszar Moov Atom. Problem w tym, że większość enkoderów beztrosko umieszcza metadane na końcu pliku MP4.

Rezultatem tej złotej myśli technologicznej jest to, że plik MP4 musi zostać w całości pobrany, zanim jakiś Flash player go zdoła otworzyć. Z małymi plikami to nie problem, jednak kazanie użytkownikowi czekać na pobranie 200 MB pliku, zamiast oglądać go w trakcie ściągania jak w przypadku plików FLV, to powrót do epoki, w której to strony zdobione były tagami <marquee>.

Wyjścia innego nie ma jak złapać za uszy metadane i przeciągnąć je na początek pliku. Na szczęście FFMPEG dostastarcza do tego celu gotowy skrypt o nazwie qt-faststart. Jego użycie raczej nie przysporzy nikogo o ból głowy.

qt-faststart in.mp4 out.mp4

Dla !linuksiarzy pozostaje skorzystanie z aplikacji dla Adobe AIR, lub przygarnięcie klasy dla PHP5.

« Nowsze | Strona 2 z 9 | Starsze »