Здравейте, здравейте!
Изключително сме радостни да ви представим първия самостоятелен проект, маркиран с логото на FridayCode. Както вече сте разбрали от заглавието, става дума за HTML5 видеоплейър, носещ името FryPlayer. Идеята за него се роди преди около 3 месеца, когато усърдно ровичкахме онлайн медиите за новости в HTML5 и CSS3. Първоначално беше само идея, постепенно се роди статията за HTML5 video или как да създадем видеоплейър, а накрая лека полека започнахме да човъркаме и самия плейър. Честно казано бяхме провокирани и от факта, че все още на хоризонта няма перфектен плейър и спокойно можем да се наместим в Топ 20. Разгледахме голям процент от плейърите, които може да намерите из мрежата и ги анализирахме известно време. Положихме основите на нашия плейър, като се стремяхме да не повтаряме техните грешки. Така започна работата по FryPlayer.
Ако сте чели въпросната статия за това как да си направим видеоплейър, то вероятно ще сте наясно с фактите - всеки браузър има свой собствен дизайн на контролите. Първата цел е те да бъдат уеднаквени, но това не означава просто да смените една картинка, а да пренапишете цялата функционалност. Решихме отново да се възползваме от възможностите на jQuery. В момента на започване на работа по FryPlayer, на сцената имаше само един плейър, който разчиташе на jQuery и по-специално jQuery UI. В момента са няколко и спокойно можем да кажем, че ги превъзхождаме по доста параграфи.
Първоначално ни беше трудно да схванем логиката на определени функционалности и дори в момента изпитваме затруднения с някои, най-вече заради проблемите под различните браузъри (този път войната е FF vs Webkit). Все пак след доста безсънни нощи, версия 0.1 на FryPlayer е факт и наистина сме горди от постигнатото, защото през цялото това време продължихме да пишем уроци и работихме по сайта на самия плейър. Но преди да поговорим за FryPlayer, искаме да кажем няколко думи за сайта му. Целяхме да бъде изключително семпъл, но и малко по-открит, по-отворен. Също така искахме информацията да бъде структурирана смислово и да следва нормалните реакции на всеки потребител. Анимираната навигацията е подобрена версия на този урок. Като цяло ние сме доволни, надяваме се и вие да останете такива.
Сега е време да си поговорим и за самия плейър. Вероятно вече сте разгледали фийчърите му и може би се питате на 100% ли са изпълнени, каква е разликата им с конкурентните плейъри и т.н. Отговорите пристиггат! Като за начало плейърът е изключително лек и това може да проверите, като отворите този линк, пуснат от нашия потребител ReXTaN във форума и направите сравнение с някои от предложенията там. Не сме номер 1, но със сигурност FryPlayer е доста по-бърз дори от някой от най-популярните конкуренти. Лесен за употреба? Разбира се! В описанието на сайта се вижда че са ви необходими само три неща, за да подкарате плейъра при вас - да го свалите и да копирате малко файлове плюс няколко реда код. Останалото са настройки. Следващият голям плюс са скиновете, които поддържа плейъра. Отворете CSS-а и разгледайте как са направени двата скина, които вървят с версия 0.1. Нужно е просто да кръстите и да описвате новия скин с клас, чието име после да заместите при извикването на плейъра. Лесно, а? Друга полезна фунцкия е видеото на цял екран. То не е съвсем на цял екран, както при desktop плейърите, но това е проблем на HTML5. Гъзарията е че, когато сте във full screen mode и рисайзвате прозорецът на браузъра, заедно с него се рисайзва и самият плейър. FryPlayer поддържа и визуализация на буфериране. Тя е в доста ранна фаза, тъй като по принцип не е развита напълно и абсолютно всички плейъри имат проблем с нея. Все пак, очаквайте подобрения в следващата версия. На последно място искам да спомена и интуитивните клавиши - разполагате с ESC за изход от цял екран, SPACE BAR за Play/Pause (засега само във Full Screen Mode), както и двоен клик на мишока за цял екран и изход от него. Планираме още няколко хоткийя, които да ви накарат да си помислите, че това е десктоп приложение. Като цяло това са нещата, с които можем да се похвалим засега и честно казано в момента те правят FryPlayer напълно пълноценен и готов за ползване. Вероятно се питате защо плейърът е с криптиран javascript, след като е напълно свободен за ползване? Причината е, че ние обичаме да докарваме нещата до край (питайте мацките) и обичаме да го правим професионално. Ето защо решихме, че на този етап е по-добре кодът да остане заключен, за да може да го усъвършенстваме и евентуално в някоя от бъдещите версии да пуснем FryPlayer като open-source. Не е ясно това кога ще се случи, тъй като сме си направили списък с фийчъри до версия 0.5 и отделно ще има да чистим бъгове.
FryPlayer се поддържа от актуалните версии (препоръчително) на Firefox, Opera, Chrome и Safari, както и от всички знайни и незнайни HTML5 съвместими браузъри (скоро ще видим IE9 какво ще каже). Поддържаните кодеци са H.264, Theora и VP8 (WebM), като отново за повече информация ще ви препоръчаме да прочетете изчерпателния урок за създаване на HTML5 плейър.
Надяваме се с тази кратка презентация да сме успели да грабнем вниманието ви. Далеч сме от мисълта, че това е най-прекрасният плейър на света, но ще се опитаме да го направим такъв. На този етап вероятно ще има доста бъгове, тъй като си нямаме бета тестери, но точно поради тази причина ще сме ви благодарни, ако оставяте коментари или тук или в сайта на плейъра. Ще се опитаме да ги отстраним колкото се може по-бързо и съответно да извадим версия 0.2 в най-скоро време. В бъдещите версии ще наблегнем и на мобилната поддръжка, въпреки че там е по-голяма манджа и от настолните еквиваленти.
Но предполагам вече започва да ви доскучава и за това ви представям самия FryPlayer в целия си блясък! Междувременно се насладете и на прекрасния трейлър на Sucker Punch! Нищо не се разбира, но е радост за окото. Решили сме да правим рокади на трейлърите с цел свежо съдържание на сайта, така че ще обновяваме с нови, ако се появят достатъчно готини.
[ Официален сайт ] [ Свали FryPlayer ]
Loading ...