Je možné strávit i ceý den psaním Facebook aplikace. Nedávno jsem napsal aplikaci na Sudoku. Už jsem měl Sudoku javascript widget připravený k rozběhnutí – strávil jsem mnoho času stahováním stránek dokumentace a stahováním pomůcek, které jsem nakonec ani (jak se ukázalo) nepotřeboval.
Pokud je mi známo, Facebook vám umožňuje vytvářet aplikace, které se zobrazí uživateli ve 2 různých oblastech.
1 – Profil. Tedy „hlavní uživatelovu stránku ‚, co se Facebooku stýče. Zde je místo, kde je zobrazen váš hlavní souhrn informací a vaše připomínky na zdi. Bylo by skvělé mít zde zobrazeno vaše udělátko, ale velkým omezení je, že aplikace, které používají javascript zde nejsou povoleny (musíte použít FMBL, verze facebook HTML). Škoda pro mě. Co můžeme udělat, je to, že zobraíme drobnou reklamu, abychom přivedli uživatele na Canvas page.
2 – „Canvas stránka“. To je stránka, kterou bude vaše aplikace používat (můžete mít více stránek, pokud budete chtít). Na těchto stránkách si můžete vybrat zobrazení obsahu z jiných stránek přes iFrame, tak to je tedy přesně to, co budeme dělat.
Táák, to bylo tedy shrnutí pro začátek, teď začneme s psaním aplikace.
1. Vytvořte si ukázkovou stránku. (2 minuty)
Toto je stránka, kterou uživatel uvidí na své canvas stránce. Pokud již máte stránku, kterou chcete použít, skvělé. Pokud ne, pak stačí zkopírovat tento kód hádací hry.
<script type=text/javascript>var iRandom;function Restart(){iRandom = Math.floor(Math.random()*10)+1;alert('OK, I am thinking of a number between 1 and 10');}function Guess(){var yourGuess = document.getElementById('myGuess').value;if (yourGuess>iRandom)alert('Too High.');if (yourGuess<iRandom)alert('Too Low.');if (yourGuess==iRandom){alert('Well done! You guessed it.');Restart();}}</script><div>Enter your guess between 1 and 10: <input type=text id='myGuess' name='myGuess'><input type='button' onClick='Guess()' value='Guess'><br><br><input type='button' onClick='Restart()' value='Start Again'><script type=text/javascript>Restart();</script>
Nebude to sice kzídkání žádného prestižního ocenění, ale svoji práci kód udělá. Uložte soubor někde na svých webových stránkách jako „guess.htm“. Můj je uložen v http://gathadams.com/guess.htm
Ok, nyní se přihlašte na Facebook.
2. Nainstalujte vývojářskou (Developer) aplikaci. (1 minuta)
http://developers.facebook.com/docs/guides/appcenter/
To vám umožní vytvářet aplikace.
3. Vytvořte aplikaci (30 sekund)
Klikněte na odkaz „vytvořit alikaci“
4. Vyplňte detaily aplikace (6 minut)
Je tam spousta políček, které můžete vyplnit, já jsem vyplnil pouze ty, které budu potřebovat pro rozjezd svého dema.
Název aplikace: Jakékoliv jméno, které chcete. Použil jsem Guessing game „hádání“.
Terms of Service checkbox: Check it. (zkontroluj to)
Click ‘Optional Fields’. (volitelná pole)
Callback Url: To by měl být kořenový adresář, že vaše „guess.htm“ stránka je na adrese. Musíte také přidat „/“ na konci. Použil jsem „http://gathadams.com/“.
Canvas Page URL: Toto je nejvíce matoucí část, a zbytečně mi zabrala spoustu času. To, co chtějí abyste zadali, je v podstatě název adresáře pro aplikaci. Název musí být 7 znaků nebo více a musí být odlišný od ostatních Facenbook aplikací. Použil jsem „guessab“ (takže vy už nemůžete). Přidáte-li ‚http://apps.facebook.com/ „na přední straně máte Canvas URL stránku.
Poznámka: Pokud používáte velká písmena v URL Canvas stránkách, tak budou převedena na malá písmena automaticky. Důležitou poznámkou také je, že pokd budete používat velká písmena ve všech odkazech, tak později nebudou fungovat.
Zaškrtněte „Použít iFrame,“: To znamená, že vaše Canvas stránky budou používat iFrame.
Typ aplikace: Nechte to na „stránkách“.
Can your application be added on Facebook?: Zaškrtněte ano.
Application Description: IPoužil jsem ‘Cool guessing game’. Pokud se vám to takto nelíbí, tak použijte vlastní popis.
Default FMBL: To se vyplní až později, takže to teď nechte být.
Default Profile Box Column: Zaškrtněte Narrow
Side Nav URL: Jedná se o místo kam se vloží odkaz v bočním navigačním panelu z Canvas stránky.
Celá canvas stránky má tento formát:
http://apps.facebook.com/< value entered in Canvas Page URL>/
Takže pro mě vypadá URL Canvas stránky takto:
http://apps.facebook.com/guessab/guess.htm
Facebook mapa ‘http://apps.facebook.com/guessV1/’ do vaší zětné URL, takže načtené v iFramu je to takto:
guess.htm
nebo
http://gathadams.com/guess.htm
Poznámka: Všimněte si, že v guess.htm není vložena žádná značka ‘/’ ,takže to je důvod proč to musíte vložit do Callback URL.
Každopádně, teď se můžete vrátit do
Výchozí FMBL: Toto je text, který bude pokračovat v profilu uživatele. Umožňuje pouze poskytnutí jiného odkazu na naše hry na canvas stránce. Já vstupuji:
Lets play a <a href=’http://apps.facebook.com/guessab/guess.htm’>Guessing Game</a>
5. Přidejte aplikaci (30 sekund)
V rámci „My Applications„, klikněte na tlačítko „View about page“ pro nové aplikace. Poté klikněte na „Add application„, a potvrďte.
6. Hotovo! (Jdeme hrát)
Klikněte na odkaz v levém navigačním panelu nebo v hlavním profilovém panelu a ťukněte se sami ven.
Zdrojem byl vývojář http://gathadams.com
