23 czerwca 2010 r nastąpiło wydanie nowej wersji Eclipse 3.6 Helios . Owo wydanie jest największym z dotychczasowych wydań: 39 różnych zespołów projektowych, 33 miliony linii kodu, 490 commiterów. Eclipse udostępnia 12 różnych projektów, dla różnych typów programistów. W tym oczywiście dla programistów PHP – czyli Eclipse for PHP Developers . Czemu o tym piszę? Przede wszystkim dlatego, że Eclipse PDT jest moim ulubionym IDE, jest tym, na którym pracuję zawodowo, do którego jestem bardzo przyzwyczajony (dotychczas Eclipse Galileo).

Nowości w Eclipse Helios

Helios wprowadza wiele nowości, część z nich, z punktu widzenia web developera nie ma większego znaczenia. Jednak warto mieć na uwadze zaangażowanie twórców, różnorodność tworzonych rozwiązań, ilość zaangażowanych developerów.

1. Lepsze wsparcie dla Linuxa

Ostatnie badania wskazały na rosnący udział systemu spod znaku pingwina w ogólnej liczbie developerów korzystających z tego IDE. Twórcy Eclipse wyszli im naprzeciw wprowadzając szereg usprawnień dedykowanych pod systemy z tej kategorii. Stworzony został Linux Tools Project , który ma na celu ułatwienie pracy przy programowaniu w C/C++. Zintegrowano m.in. GNU Autotools, Valgrind, OProfile, RPM, SystemTap, GCov, GProf, LTTng, etc.

2. Eclipse Marketplace Client

Eclipse Marketplace

Jest to klient zapewniający developerom dostęp do czegoś w rodzaju “app-store” z tą różnicą, że dotyczy wtyczek. Daje możliwość łatwego przeglądania i instalowania nowych plug-in’ów. Będzie dostępnych ponad 100 wtyczek w jednym katalogu, co ma znacznie ułatwić i usprawnić ich wybieranie i dodawanie do programu.

3. Wsparcie dla Git’a

Pojawiło się długo oczekiwane wsparcie dla Git’a (popularnego rozproszonego systemu kontroli wersji). Wprowadzone zostało w projektach EGit oraz JGit. Nowe wydanie EGit 0.8 zawiera nowy widok repozytoriów Git’a, wsparcie dla “fast forward merging” oraz tagowania. JGit 0.8 – które jest wykorzystywane w EGicie dla połączeń z repozytoriami Git pokazało duży skok wydajności aż do 50% podczas pracy z dużymi repozytoriami.

4. Nowości w Web Tools Platform

WTP wprowadza wsparcie dla tworzenia, uruchamiania i debugowania aplikacji napisanych pod najnowsze specyfikacje Java EE (Java EE 6) włączając Servlet 3.0, JPA 2.0, JSF 2.0, and EJB 3.1.

5. Poprawione wsparcie dla JSDT

Framework w JSDT

Ulepszone wsparcie dla JSDT dla programistów JavaScript. W tym framework debugera JavaScript, który umożliwia integrację debugerów JavaScript, takich jak Rhino i Firebug oraz korzystanie z nich bezpośrednio w IDE. Został utworzony nowy pakiet Eclipse IDE for JavaScript Web Developers , który ma na celu ułatwienie programistom JavaScript odszukania, zainstalowania i korzystania z IDE na bazie Eclipse.

Czytaj dalej tutaj (rozwija treść wpisu)
Czytaj dalej na blogu autora...

Zwiń
Czytaj na blogu autora...

Programiści pracujący nad jQuery UI wypuszczają co pewien czas kolejne milestone’y tej biblioteki. Dzisiaj światło dzienne ujrzał milestone 2, zawierający długo wyczekiwaną funkcjonalność – menu. Widżet ten zamienia standardową listę kotwic (znaczników a) w menu, obsługiwane zarówno myszką, jak i klawiaturą.

Równie ciekawym widżetem jest zaprezentowany w pierwszym milestone tooltip, którego zadaniem jest zastąpienie domyślnego, nieatrakcyjnego wizualnie tooltipa. Widżet ten jest w pełni konfigurowalny i dzięki czemu można dowolnie określić położenie tooltipa jak również jego wygląd.

Opis menu oraz tooltipa znaleźć można w dokumentacji jQuery UI pod adresami http://docs.jquery.com/UI/Menu oraz http://docs.jquery.com/UI/Tooltip.

Jakiś czas temu w serwisie develway.pl pojawił się link do bloga Six Revisions, na którym przedstawiono opis nowego API Google. Tym razem firma ta wzięła się za typografię w sieci i wypuściła Font API.

Google Font API jest sposobem na uzyskanie na stronie “ładnych” czcionek bez konieczności uciekania do tanich sztuczek w postaci obrazków lub plików swf. Firma Google dostarcza galerię czcionek, z których możemy skorzystać oraz kod, który musimy dodać do naszej strony.

Jak to działa?

Zasada działania Google Font API jest bardzo prosta. Wystarczy, że do naszej strony dodamy kod

<link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Font+Name">

Gdzie Font+Name jest nazwą czcionki z galerii. Od razu zaznaczę ważną rzecz. Wszystkie spacje muszą zostać zamienione na znak plusa (+). Jeśli chcemy wykorzystać więcej czcionek na naszej stronie, wystarczy, że oddzielimy je pionową kreską – |

Następnie stosujemy standardowy kod CSS, który wykorzystuje nową czcionkę. Należy pamiętać o dodaniu czcionki “zapasowej”, która zostanie użyta w przypadku problemów z wykorzystaniem niestandardowej czcionki.

<style>
  p {
	font-family: 'Font Name', serif;
	font-size: 48px;
  }
</style>

A tak to działa (i wygląda) w praktyce (tekst można zaznaczyć i skopiować):

Hello World!

Jeśli z jakiegoś powodu napis nie wygląda “ładnie”, oto zrzut ekranu

Czytaj dalej tutaj (rozwija treść wpisu)
Czytaj dalej na blogu autora...

Zwiń
Czytaj na blogu autora...

Pewnego razu gdy medytowałem nad sensem świata, pewna ciekawa rzecz zaprzątnęła moim umysłem. Pytanie co było pierwsze – funkcja czy klasa ? Pytanie, co jest bardziej pierwotnym pojęciem w programowaniu?

Nie ma to może żadnych poważniejszych implikacji dla nas koderów, jednak można dojść do całkiem ciekawych wniosków. Odpowiedzią na pytanie zadane w tytule jest: pierwszy był… void .

A tak już całkiem na serio. W matematyce, w algebrze zbiorów najszerszym pojęciem jest klasa, jest ona bytem szerszym od zbioru. Klasa agreguje różne zbiory.

W programowaniu, klasa ma podobne znaczenie, jest czymś co określa pewien rodzaj obiektów. I tu właśnie zaczynają się schody, bo jak wiemy w klasie są metody, czyli funkcje. Więc jak to jest ? Czy może istnieć klasa która składa się z funkcji ? A może, istnieje sobie np. klasa funkcji kwadratowych, czyli wszystkich funkcji w postaci Ax2+bx+c czy klasa funkcji ekspotencjalnych. Co ciekawe np. w języku php da się stworzyć takie klasy:

class SquareFunction {
 
    protected $_a = 1;
 
    protected $_b = 1;
 
    protected $_c = 1;
 
    public function __construct($a,$b,$c){
 
        $this->_a = $a;
 
        $this->_b = $b;
 
        $this->_c = $c;
 
    }
 
    public function __invoke($x){
 
        return $this->_a*pow($x,2) + $this->_b*$x + $this->_c;
 
    }
 
}
 
$func = new SquareFunction(5,6,4);
 
echo $func(10);

Oczywiście jest tu trochę php-owej magii związanej z funkcją __invoke(dostępna od 5.3), dzięki której można wywoływać klasę jako funkcję. Nie mniej jednak logicznie rzecz biorąc jest to podejście słuszne.

Wracając jednak do pytania podstawowego co było pierwsze. Doszedłem do wniosku przemyśliwując sprawę gruntownie, że oba pojęcia są pojęciami pierwotnymi. Nie da się zdefiniować klasy bez funkcji i funkcji bez klasy. Tak jak nie da się podzielić elektronu na pół, ponieważ jest cząstką punktową, a jak wiemy matematyczny punkt jest niepodzielny.

Przypomina mi cała sprawa rzecz wziętą z fizyki, mianowicie dualizm korpuskularno falowy, funkcja jest jednocześnie funkcją i klasą.Z istniejących języków programowania najlepiej oddaje ten dualizm Javascript, gdzie funkcja jednocześnie jest klasą i powiem szczerze, że po tych przemyśleniach okazuje się, że jednak JS ma jakiś głębszy sens

Co to jest Deep Zoom?

Podczas poznawania Silverlighta natknąłem się na ciekawą technologię – Deep Zoom. Pozwala ona na przeglądanie obrazów o wysokiej rozdzielczości w bardzo prosty i intuicyjny sposób. Deep Zoom pozwala na płynną zmianę wielkości przybliżenia (zoom) oraz na ładowanie poszczególnych elementów obrazu.

Gdzie stosować Deep Zoom?

Wszędzie tam, gdzie wymagane są operacje na dużych obrazach. Microsoft podaje trzy główne zastosowania:

• przeglądanie obrazów o bardzo dużej rozdzielczości. Do obrazów takich można zaliczyć np mapę, która w zależności od wartości przybliżenia, pozwala oglądać kolejne szczegóły danego miejsca
• fotografia 3D – dzięki zastosowaniu kolekcji, można stworzyć na podstawie samych zdjęć, model 3D miejsca, które zostało sfotografowane
• reklama, którą można przybliżać i oddalać w celu poznania innych szczegółów reklamowanego produktu

Jak korzystać z Deep Zoom?

Jeśli myślicie, że trzeba w tym celu skorzystać z Silverlighta, to macie rację. Ale nie do końca. Microsoft przygotował bibliotekę Javascript o nazwie Seadragon Ajax, która oferuje praktycznie te same możliwości co Silverlight (oczywiście w kontekście Deep Zoom). Zanim będzie można skorzystać z możliwości jakie oferuje Deep Zoom, należy wpierw przygotować zdjęcie. W tym celu należy pobrać darmową aplikację Deep Zoom Composer, a następnie przy jej pomocy przygotować zdjęcie. W skrócie, polega to na stworzeniu szeregu folderów, w których przechowywane są zdjęcia o odpowiednich rozmiarach dla każdego z poziomów przybliżenia. Więcej szczegółów technicznych można znaleźć na stronach MSDN.

Kilka słów o Seadragon Ajax

Seadragon Ajax jest biblioteką Javascript umożliwiającą operowanie obrazem w formacie Deep Zoom. Oferuje ona te same możliwości co Silverlight, z jednym wyjątkiem. Nie obsługuje kolekcji.

Korzystanie z biblioteki jest niezmiernie proste i sprowadza się do napisania kilku wierszy kodu. Na sam początek należy dołączyć do strony bibliotekę.

<script type="text/javascript" src="http://seadragon.com/ajax/0.8/seadragon-min.js"></script>

Następnie wystarczy na obiekcie Viewer wywołać metodę openDzi i gotowe.

Czytaj dalej tutaj (rozwija treść wpisu)
Czytaj dalej na blogu autora...

Zwiń
Czytaj na blogu autora...

Nie można kwestionować faktu, że jQuery.animate() jest jednym z najbardziej potężnych narzędzi jQuery. Służy on do animowania atrybutów CSS (czyli zmiany ich wartości w czasie od obecnego stanu A do definiowanego stanu B). Najprostszą implementacją jQuery Animate jest podanie zbioru atrybutów CSS, które mają ulec zmianie oraz czasu, w jakim ta zmiana ma nastąpić. Nie będę się zagłębiał w najprostsze przykłady użycia, są one dostępne w oficjalnej dokumentacji jQuery.

Należy pamiętać, że dzięki jQuery jesteśmy w stanie nie tylko płynnie zmieniać kolory, wielkość czcionki, obramowanie, ale także pozycje elementów, nadając stronie dynamicznego kształtu. Domyślnym sposobem animowania (easing) jest płynne przechodzenie. Istnieje natomiast sposób na zmianę adaptera animowania. Robert Penner – autor pluginu jQuery Easing dostarczył nam niewiarygodnie efektowne i proste w implementacji narzędzie. Na oficjalnej stronie pluginu można znaleźć wiele przykładów animacji, które dostarcza nam dodatek. Efekty widoczne są zwłaszcza przy animowaniu pozycji i wymiarów obiektu, ale następują także w przypadku zmiany koloru – czyli są aplikowane do zmiany stanu każdego z atrybutów CSS.

Dziś postaram się pokazać efekty, jakie można uzyskać za pomocą jQuery Animate rozszerzonego o jQuery Interface oraz Easing.

• Przykład różnego rodzaju easingu.

Pierwszym krokiem jest wygenerowanie własnej biblioteki jQuery Interface. Dzięki generatorowi, jesteśmy w stanie ściągnąć tylko te części Interface, które są nam de facto potrzebne, zmniejszając jednocześnie ilość kodu. Klikamy ‘deselect all components’, a w sekcji Effects wybieramy efekty, których będziemy używać. Mnie w tej chwili interesuje Bounce i Slide. W paczce otrzymamy wersję deweloperską (z wcięciami) oraz minified, gotową do publikacji na serwerze.

Do wykorzystania efektu slideowania a’la iPhone (elastyczne odbicie od krawędzi ściany ekranu) sprowadza się drobny kawałek kodu, w którym istotnym jest parametr easing:

$('#example').animate({ left: 500 }, { duration: 1000, easing: 'easeOutElastic' })

Na pewno komuś się przyda.

Potrzebowałem dzisiaj zastosować plugin jQuery, który jednym słowem można określić karuzela. Funkcjonalność jaką miał realizować to pokazywanie po kolei podobnych elementów, np galerii zdjęć. Niestety wszystkie pluginy jakie udało mi się znaleźć nie spełniały moich oczekiwań. Dlatego też napisałem swój własny. Na chwilę obecną jest on bardzo prosty, jednak w zupełności wystarcza. Sądzę, że co