Techtalk: Jogando RPG no Hangouts

Transcript

1. Jogando RPG no Hangouts Frederico Beneti @beneti
2. Cidades diferentes Horários Atividades prioritárias Gastos DRs ???
3. requisitos mínimos
6. COMO? O QUE? UTILIZARÃO? mão na massa SERÁ QUE EXISTE API? JÁ EXISTE ALGO?
7. Primeiros passos - API Console (https://code.google.com/apis/console/) - Estudar a API (https://developers.google.com/+/hangouts/api/) - Hospedar XML - Testar
8. O que da API, foi utilizado? gapi.hangout.onParticipantsAdded.add(callback) var userAddedCallback = function(userAdded){ var players = userAdded.addedParticipants; for (var index in players) { var participant = players[index]; if (!participant.person) { addPlayerNoApp(...); } addPlayer(...); } };
9. O que da API, foi utilizado? gapi.hangout.onParticipantsRemoved.add(callback) var userRemovedCallback = function(userRemoved){ var players = userRemoved.removedParticipants; for (var index in players) { var participant = players[index]; removePlayer(participant.person.id); } };
10. 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()} );
11. gapi.hangout.data.onStateChanged.add(callback) var dataStateChangedCallback = 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?
12. 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;
13. Shared State - atribuir valor - submitDelta gapi.hangout.data.submitDelta( {key1: value, key2: anotherValue} ); - setValue gapi.hangout.data.setValue(key1, value);
14. 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'));
15. Shared State - limites e capacidades - 10 deltas por segundo - Delta com até 1MB - Aproximadamente 150ms~300ms para receber o delta
16. O que mais dá pra fazer?
17. 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
18. 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
19. 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
20. O que mais dá pra fazer... - interagir com o Hangouts On Air - classes, funções e eventos disponíveis em: gapi.hangout.onair
21. Limitações - Altura da app - AJAX - Flash
22. Dando olé
23. 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
24. Resultado final - Rolando dados
25. Resultado final - Pegando cartas
26. Obrigado! @beneti