Archiwa kategorii: Narzędzia

Fillerati.com – alternatywa dla „Lorem Ipsum”

fillerati

„Lorem Ipsum” to najpopularniejszy tekst, którego używają graficy przy projektowaniu szaty graficznej strony. W miejsce tekstu wpisują oni stary łaciński tekst o granicach dobra i zła. Ale nie każdy w swym projekcie chce umieszczać mądrości Cycerona. Powstają rożnego rodzaju przeróbki „Lorem Ipsum”.

Na stronie fillerati.com dostępne jest narzędzie generujące tekst na podstawie książek znanych amerykańskich pisarzy. Warto zwrócić uwagę na ładnie zaprojektowany interfejs oraz funkcje generowania tekstu zaprogramowane z wykorzystaniem frameworka jQuery. Dzięki temu szybko i wygodnie wygenerujemy odpowiedniej długości i formatu tekst.

fillerati

Link: http://www.fillerati.com/

Glimmer – narzędzie do tworzenia animacji jQuery

glimmer

Glimmer to prosta aplikacja do tworzenia animacji w jQuery. Nie jest edytorem, ale wizardem jQuery. Dzięki temu krok po kroku stworzymy animację. Do wyboru mamy możliwość wygenerowania szybkiej animacji „zmienianych zdjęć,” rozbudowanego menu , „dymka pomocy” (tooltip). Jednak najciekawszym wizardem jest (Custom). Daje on możliwość generowania najróżniejszych animacji na przygotowanym wcześniej pliku HTML.

Na początku wczytujemy poprawnie sformatowany plik HTML, a następnie wskazujemy źródło zdarzenia, typ zdarzenia oraz cele. Źródłem zdarzenia może być dowolny obiekt HTML znajdujący się w dokumencie. Element można wybrać po tagu (np div), klasie (.klasa_nazwa) lub po id (#id_nazwa). Jako zdarzenie można wybrać wszystkie przewidziane przez jQuery zdarzenia, np click, mouseover, blur, scroll, itp. Następnie określamy cel, wybieramy rodzaj animacji oraz jej parametry. Np dla animacji powiększania elementu należy wybrać wartość początkową oraz końcową. Edytor Glimmer daje możliwość  stworzenia skomplikowanych animacji, bez napisania ani jednego wiersza w JavaScript.

glimmer

Link: http://code.msdn.microsoft.com/glimmer
Licencja: Darmowa

Test HTML5

http://www.html5test.com/

Coraz głośniej się mówi o standardzie HTML5, czyli o nowych możliwościach w tworzeniu stron WWW. Pomalutku przeglądarki zaczynają dostosowywać się do nowych wymagań. Na standard HTML5 składa się szereg funkcji ,dlatego rożne przeglądarki w rożnym stopniu dokonały zmian w kierunku nowych rozwiązań. Dzięki specjalnemu testowi dostępnemu przez internet, jesteśmy w stanie dowiedzieć się, w jakim stopniu nasza przeglądarka obsługuje HTML5. W teście można uzyskać maksymalnie 300 punktów, a test sprawdza naszą przeglądarkę pod kątem obsługi rożnych modułów i funkcji.  Do każdego pojedynczego testu składającego się na całość są odsyłacze na strony z opisem standardu poszczególnej funkcji. O dziwo najlepiej w moich testach wypadła przeglądarka Chromę 217 puntów, za nią kolejna niespodzianka Safari 207 punktów. Trzecie miejsce Opera 159 punktów, a czwarte miejsce mój ukochany Firefox ze 139. Internet Explorer miał 27 punktów, ale to chyba nikogo nie dziwi :)

http://www.html5test.com/

Link: http://www.html5test.com/

Twitter Search – Niusy z Twittera za pomocą jQuery

jQuery Twitter Search Plugin

Twitter to jednej z najpopularniejszych mikro blogów. Gdybyśmy chcieli umieścić w swoich projektach skrypt przeszukujący i wyświetlający niusy z mikro blogu Twitter, mamy taką możliwość. Skrypt Twitter Search pozwala na wpisanie w kodzie fraz , które przeszukują Twitter i dynamicznie wczytują wynik wyszukiwania. Do działania skrypt wymaga czterech bibliotek, jQuery, twitter.search.js, chili-1.7.pack.js, corner.js. Piszę o tym ponieważ do sięgnięcia jest tylko plik twitter.search.js. Skrypt pozwala na ustawienie w kodzie wielu parametrów związanych z animacją niusów.

 

jQuery Twitter Search Plugin

Wymagania: jQuery
Demo: http://jquery.malsup.com/twitter/
Licencja: GPL

Automatycznie generowany obraz w PHP

Dynamic Dummy Image Generator

Na stronie dummyimage.com Można znaleźć skrypt do automatycznego generowania obrazu. Skrypt napisany jest w PHP z użyciem biblioteki gd2. Mamy możliwość ustawienia dowolnej wielkości zdjęcia, a także zmianę koloru tła, jak również tekstu wpisanego w obrazek. Skrypt automatycznie wygeneruje nam zdjęcie z żądanymi parametrami. Biblioteka posiada  również wiele predefiniowanych rozmiarów dla popularnych zastosowań. Obrazy można również tworzyć używając parametru GET odwołujących się do skryptu.

Dynamic Dummy Image Generator

Wymagania: PHP
Demo: http://dummyimage.com/
Licencja: MIT
Download: http://dummyimage.com/source.zip

PaintbrushJS – biblioteka do operacjach na zdjęciach

paintbrushjs

PaintbrushJS jest biblioteką filtrów do zastosowania na zdjęciach. Do wyboru mamy dużą paletę możliwości jeżeli chodzi o filtry. Można je stosować na znaczniki <img> wpisując w atrybucie class odpowiednia nazwę filtra oraz dodatkowe parametry. Niestety biblioteka nie działa w IE8. Może się to zmieni we wrześniu, kiedy planowana będzie nowa premiera IE9.

paintbrushjs

Wymagania: Nie działa w Internet Explorer 8
Link: http://mezzoblue.github.com/PaintbrushJS/demo/
Licencja: MIT

CLEditor – Prosty i darmowy edytor WYSIWYG

cleditor

CLEditor jest darmowym, lekkim, w pełni funkcjonalnym edytorem WYSIWYG. Skrypt można łatwo dodać do dowolnego projektu witryny WWW. Edytor posiada standardowe funkcji formatowania tekstu, czcionki, rozmiary, style, kolory tekstu i kolor ypodświetlenia. CLEditor pozwala dołączać zdjęcia (linki) a po zainstalowaniu pluginu, tabele. CLEditor obsługuje wszystkie główne przeglądarki.

cleditor

Wymagania: jQuery
Link: http://premiumsoftware.net/cleditor/
Licencja: GPL, MIT

wdCalendar – Terminarz w jQuery, php i MySql

JQuery Event Calendar Plugin

WdCalendar to w pełni funkcjonalny terminarz do organizowania pracy. Można go w prosty sposób zainstalować w swoich aplikacjach webowych. Użycie jQuery sprawia, że obsługa terminarza jest prosta i przyjemna. Aplikacja została zaprogramowana w PHP, a informacje o wydarzeniach zapisywane są w bazie MySQL. Instalacja jest banalnie prosta. Kopiujemy skrypt na serwer WWW obsługujący PHP. W katalogu ze skryptem znajduje się plik SQL, który musimy wykonać na bazie danych w celu utworzenia tabel. Na koniec trzeba zmienić nazwy plików edit.db.php na edit.php, a pliku datafeed.db.php na datafeed.php, nadpisując istniejące pliki.

Wymagania: jQuery, PHP, MySQL
Demo: http://www.web-delicious.com/jquery-plugins-demo/wdCalendar/sample.php
Download: http://www.web-delicious.com/jquery-plugins-demo/wdCalendar.zip
Licencja: LGPL