Rival Blog

Fotobanka Pixmac odedneška dodává komerční výsledky do Seznamáckého vyhledávání obrázků na Obrázky.cz ;)

• http://obrazky.cz?q=byznys
• http://obrazky.cz?q=praha
• http://obrazky.cz?q=pláž

Sérii o rychlosti webu plynule nahradím sérií o javascriptovém frameworku jQuery. Nebudu rozebírat důvody, proč je dobré používat framework a už vůbec vám nebudu radit, který je nejlepší. Na to si člověk musí přijít sám ;) Sám jsem nahradil Prototype právě knihovnou jQuery.

Standardní funkce a efekty frameworků se v zásadě od sebe neliší, všude máte nějaké to vyjíždění, zasouvání, zkrácený přístup k elementům přes $(‘#id_elementu’), pohodlnou práci s DOMem a selektory, práce s Javascriptem je pak spíše zábava než práce. Ostatně, příkladů lze na internetu najít čím dál tím víc. Budu tedy střídat základy práce s frameworkem jQuery a užitečnými tipy a návody. Jinak jQuery má super dokumentaci, dobré příklady a rozsáhlé fórum. Tyto odkazy doporučuji v první řadě.

Horké klávesy (hot keys)

Znáte je z desktopových programů, ale čím dál více se začínají dostávat i do web aplikací, ve kterých je pak radost pracovat a bavit se. Klávesové zkratky jsou bezvadným doplňkem „user experience“ a to je v dnešní době obzvlášť důležité. Používáte v Google Docs zkratky? Všechny důležité fungují stejně jako v desktopových kancelářských aplikacích. A co Facebook? Stránkujete obrázky pomocí šipek na klávesnici nebo se snažíte pokaždé trefit myší na „Další“?

A právé teď přichází na scénu jQuery plugin hotkeys, který zvládne všechny zkratky ve všech moderních prohlížečích. Miniverze pluginu má jen 4.4 Kb, takže není třeba se bát stokilových molochů. „Bindování“ zkratek je pak až neskutečně triviální.

Zapínám odchytávání zkratky Ctrl+C (kopírování):

$(document).bind('keydown', 'ctrl+c', fn);

A tady zase vypínám:

$(document).unbind('keydown', 'ctrl+c', fn);

Čekali jste něco víc? Bohužel, je to až takhle jednoduché. Další informace a živé ukázky přímo na stránkách projektu. A ještě jedna ukázka praktického využití tohoto pluginu. U nás ve fotobance Pixmac je stránkování ve výsledcích vyhledávání jednou z nejdůležitějších funkcí. Najít ten pravý obrázek do prezentace nebo na billboard prostě někdy není jednoduché. Maximální komfort tak zaručí náš „Auto result“ a stránkování pomocí šipek na klávesnici. Auto result spočítá maximální možný počet fotek na stránce (z viewportu), takže na malém monitoru dostanete třeba 8 fotek, kdežto na velkém třeba 30. Konec nepohodlného skrolování ;) Pak přichází na řadu přednačítání další stránky v době, kdy prohlížíte fotky na stránce současné. Je to tak směšně prosté a elegantní, že to nikdo z konkurentů nemá. V době kdy prstem mačkáte klávesu „vpravo“ (viz. plugin hotkeys) už jsou náhledy dávno načteny a další stránku dostanete rychleji než bys řek „jQuery“. Předchozí stránka je pak stále schovaná v DOMu a tak stisknutím klávesy „vlevo“ dostanete předchozí výsledek hledání stejně rychle.

Však si to vyzkoušejte na nějakém příjemném tématu – žena v plavkách – a samozřejmě uvítám i kritiku, neb sto očí vidí víc, než jen těch deset našich. Díky ;)

Ve fotobance Pixmac jsme ve spolupráci s Ximilar představili skvělý nástroj pro vyhledávání podobných obrázků – více informací na officiálním blogu, kde najdete i praktické ukázky.

http://blog.pixmac.cz/2010/04/19/pixmac-predstavuje-podobnostni-vyhledavani/

Dnes jsme spustili další užitečný nástroj, který řeší problém, se kterým se na nás zákazníci často obrací a to, že nemohou najít fotografii, od které si stáhli náhled. Většinou se to řeší tak, že se hledají klíčová slova fotografie se zdlouhavě hledá v 10 milionech našich snímků. Tomu je konec ;) Na stránce http://www.pixmac.cz/similar umožňujeme našim uživatelům nahrát vlastní obrázek (JPG, max. 300 Kb) a za pár vteřin tak můžete získat buď naprosto stejný obrázek nebo hodně podobné varianty.

1. Vložíme obrázek

2a. Vyhledáme bez klíčových slov

2b. Nebo vyhledáme s klíčovým slovem „dog„

A je to ;)