Jogando RPG no Hangouts

devfest brasil

Transcript

1. Jogando RPG no Hangouts Frederico Beneti @beneti
2. Frederico Beneti ou só Beneti • Rails • Android • Atualmente na Tagview em Campinas • Sim, eu gosto de APIs
3. *disclaimer Ruby não escala! java? aquele monte de XML?? php é coisa de moleque .net? tudo da microsoft é lixo! rails? aquilo de fazer blog em 5 min?!? quero ver fazer isso rápido em java bullshit
4. Cidades diferentes Horários Atividades prioritárias Gastos DRs ???
5. **disclaimer
6. problema e requisitos
9. COMO? O QUE? UTILIZARÃO? mão na massa SERÁ QUE EXISTE API? JÁ EXISTE ALGO?
10. Primeiros passos - API Console (https://code.google.com/apis/console/) - Estudar a API (https://developers.google.com/+/hangouts/api/) - Hospedar XML - Testar
11. Shared State - o que? - Um objeto shared-state por hangout; - Objeto comum Javascript com strings chave/valor; - Ao atribuir uma chave/valor, será enviada para todas as instâncias;
12. Shared State - atribuir valor - submitDelta gapi.hangout.data.submitDelta( {key1: value, key2: anotherValue} ); - setValue gapi.hangout.data.setValue(key1, value);
13. Shared State - lendo os valores gapi.hangout.data.onStateChanged.add(callback) Maneiras de ler o valor da chave: var state = gapi.hangout.data.getState(); console.log(state.key1); console.log(state['key1']); console.log(gapi.hangout.date.getValue('key1'));
14. Shared State - limites e capacidades - 10 deltas por segundo - Delta com até 1MB - Aproximadamente 150ms~300ms para receber o delta
15. O que da API, foi utilizado? gapi.hangout.onParticipantsAdded.add(callback) var callback = function(userAdded){ var players = userAdded.addedParticipants; for (var index in players) { var participant = players[index]; if (!participant.person) { addPlayerNoApp(...); } addPlayer(...); } };
16. O que da API, foi utilizado? gapi.hangout.onParticipantsRemoved.add(callback) var callback = function(userRemoved){ var players = userRemoved.removedParticipants; for (var index in players) { var participant = players[index]; removePlayer(participant.person.id); } };
17. O que da API, foi utilizado? gapi.hangout.data.submitDelta(Object.<string, string>, Array. <string>) gapi.hangout.data.submitDelta( {op: "card", player_cards: player_cards.join(','), participant_name: participant.displayName, participant_image: participant.image.url, time: (new Date).getTime().toString()} );
18. gapi.hangout.data.onStateChanged.add(callback) var callback = function(eventObj){ var state = gapi.hangout.data.getState(); if (state.op == 'dice') writeDices(...); else if(state.op == 'card') writeCards(...); gadgets.window.adjustHeight(); }; O que da API, foi utilizado?
19. O que mais dá pra fazer?
20. O que mais dá pra fazer... - controlar camera - controlar microfone - controlar caixa de som - controlar volume - classes, funções e eventos disponíveis em: gapi.hangout.av
21. O que mais dá pra fazer... - adicionar efeitos de som - adicionar camadas nos vídeos - "tracking" da face e aplicar efeitos - classes, funções e eventos disponíveis em: gapi.hangout.av.effects
22. O que mais dá pra fazer... - adicionar feed de vídeo - adicionar chat - adicionar avisos - classes, funções e eventos disponíveis em: gapi.hangout.layout
23. O que mais dá pra fazer... - interagir com o Hangouts On Air - classes, funções e eventos disponíveis em: gapi.hangout.onair
24. Limitações - Altura da app - AJAX - Flash
25. Dando olé
26. Dando olé https://hangoutiframer.appspot.com/forward/v0.4?u=https://[yourfile] - já gera o xml com o iframe - possível realizar chamadas AJAX - altura "fixa", mas funciona scroll do iframe - ficar de olho em http://hangoutbots.blogspot.com.br/ para novas versões
27. Resultado final - Rolando dados
28. Resultado final - Pegando cartas
29. Obrigado! @beneti