Gear Player
Elegancki, nowoczesny i innowacyjny
O playerze
Gear Player to zupełnie nowy sposób słuchania ulubionych utworów. Zbudowany w HTML5, z animacjami SVG, equalizerem Canvas i intuicyjnym interfejsem. Jest przyjazny dla urządzeń mobilnych i pozwala błyskawicznie przewijać album.
Po otwarciu angażuje użytkownika kolorowym, płynnym interfejsem. Po zwinięciu nadal wyświetla postęp odtwarzania w małym zadokowanym odtwarzaczu. Obsługuje też SoundCloud API.
Demo
Kolorix na YouTube
Ta sekcja laduje najnowsze piosenki z kanalu Kolorix i pozwala wybrac utwor do odsluchu w osadzonym odtwarzaczu YouTube. Sam Gear nie odtwarza natywnie YouTube audio, dlatego integracja demo dziala przez bezpieczny embed.
Funkcje
Intuicyjny interfejs i responsywny design zapewniają wciągające doświadczenie podczas odtwarzania muzyki. Player dosłownie ożywa i pozwala na interakcję na wiele sposobów.
Obsługiwane formaty
Gear Player jest zbudowany na bazie popularnego SoundManager2, który obsługuje pliki MP3 bez problemów z kompatybilnością przeglądarek. Obsługuje też SoundCloud API.
Gdy dostępna jest wtyczka Flash, możliwe jest też użycie plików MP4, M4A i AAC.
Inicjalizacja
Zbudowany jako wtyczka jQuery – uruchom raz i działa na całej stronie.
$(".gearWrap").gearPlayer();Albumy obsługujesz przez pliki JSON, ładowane dynamicznie do dowolnego elementu DOM z atrybutem data-gearPlaylist.
Skróty klawiszowe
Gear Player obsługuje skróty klawiszowe. Następny utwór: →, poprzedni: ←. Głośność góra/dół: ↑ / ↓.
Możesz też użyć kółka myszy nad konsolą do regulacji głośności.
Działa z AJAX
Budujesz stronę z wywołaniami Ajax? Żaden problem! Gear Player obsługuje metodę odświeżania skanującą nowe albumy.
Istnieje też publiczna metoda destroy do zwolnienia zasobów.
Przyjazny dla mobilnych
Na małych ekranach playlista wysuwa się po dotknięciu przycisku. Możesz przewijać ją jednym palcem – jak natywna aplikacja!
The circular gear is animated with the TweenMax Draggable component.
Personalizacja
Gear Player możesz dostosować na wiele sposobów. Ponad 40 parametrów konfiguracyjnych. Zmień wygląd, nadpisując istniejący arkusz CSS.
Integracja z własnym projektem to bułka z masłem.
Animacje SVG
Player używa Raphael.js jako biblioteki renderującej, z płynnymi animacjami napędzanymi przez Greensock.
SVG renderuje się dobrze na każdym urządzeniu – żadnych postrzępionych krawędzi!
Equalizer Canvas
Gdy dostępny jest Flash Player, zobaczysz piękny, animowany, okrągły equalizer wyświetlający fale muzyki w czasie rzeczywistym.
You can also enable peak values to animated the selected sector and get a complete immersive experience.
Innowacyjny
Gear Player pcha HTML5 na granice możliwości, używając SVG, Canvas i Flash, by zapewnić zupełnie nowy sposób słuchania muzyki.
Mimo to oferuje intuicyjny interfejs i angażuje swoją prostotą.