Play FrameworkとWeb Socketの話

でWebSocketを使ってSVGのビジュアルチャットを作ってGDD open call html5に応募してみたけど落ちました

presented by

PFrameworklay

12011年10月8日土曜日

tag : #play_ja

原 一浩 @kara_d $ play netbeansify

22011年10月8日土曜日

tag : #play_ja

トレンド 、統計、デザイン、システム持続可能で自動化されたデザインシステムの追求をテーマに活動をはじめました

何してる人？

Greative is Great Creative

32011年10月8日土曜日

tag : #play_ja

➡GDD(Google Deveropers Day) Open Call HTML5に応募しようと思い立った

42011年10月8日土曜日

tag : #play_ja

➡GDDで用意された元素材

52011年10月8日土曜日

tag : #play_ja

➡実は世界地図

62011年10月8日土曜日

tag : #play_ja

➡HTML5の技術を使った何かを作る‣ HTML5といえばPlay Framework 1.2でWebSocketが対応したっけ

そうだ、Playでいこう

72011年10月8日土曜日

tag : #play_ja

➡作ったもの

82011年10月8日土曜日

tag : #play_ja

➡構成‣ Play Framework 1.2.2

‣ SVG

‣ WebSocket

‣ jQuery 1.5

‣ さくらVPS

92011年10月8日土曜日

tag : #play_ja

開発について

102011年10月8日土曜日

tag : #play_ja

➡あと半日くらいしか締切がない‣ 開発時間が限りなくゼロに近いとき、未来の開発に向けた抽象化に挑戦するのではなく、速やかにアプリケーションの機能開発や試験に向けて集中するべきです。

112011年10月8日土曜日

tag : #play_ja

➡松戸から三田‣ 北総線-浅草線、約1時間、技術リサーチと設計

➡田町ラウンジオフィス‣ 1時から6時まで、約5時間

‣ Play:3、JS:1、HTML/SVG/DESIGN:1

➡三田から松戸‣ 浅草線-北総線、約1時間、デバッグとデプロイ

122011年10月8日土曜日

tag : #play_ja

➡Scaffolding‣ samples-and-tests/chat を参考に

- リフレッシュベース

- ロングポーリング

- ウェブソケット

WebSocketController

132011年10月8日土曜日

tag : #play_ja

➡WebSocketの開始

// Create a socketvar socket = new WebSocket('@@{WebSocket.ChatRoomSocket.join(user)}');

142011年10月8日土曜日

tag : #play_ja

➡サーバーへの送信

$('path').mouseover(function(e) { socket.send($(this).attr('id'));});$('path').mouseout(function(e) { socket.send($(this).attr('id'));});

152011年10月8日土曜日

tag : #play_ja

➡SVGへレンダリング

if($('#' + parts[4]).attr('fill') == '#568C00') { $('#' + parts[4]).animate( {opacity: 0.3}, 50) .attr('fill','#cc3300').animate( {opacity: 1}, 50);}

162011年10月8日土曜日

tag : #play_ja

その後の問題

172011年10月8日土曜日

tag : #play_ja

➡Chrome 14になって、WebSocketのサポートが変わった‣ hybi 10へ

‣ Play Framework 1.2.3でのWebSocket死亡

182011年10月8日土曜日

tag : #play_ja

➡WebSocketの現状

wikipedia

192011年10月8日土曜日

tag : #play_ja

➡we’ve updated Chromium to support the latest version (draft-ietf-hybi-thewebsocketprotocol-10)‣ Chromium Blog: New WebSocket Protocol:Secure and Extensible

- http://blog.chromium.org/2011/08/new-

websocket-protocol-secure-and.html

- Chromium previously supported (draft-ietf-hybi-

thewebsocketprotocol-00)

202011年10月8日土曜日

tag : #play_ja

➡Chromeを普通は過去のバージョンに戻せない‣ どこかでDLしてきて、自動更新されないでインストールする

- 例)

- http://mac.oldapps.com/google_chrome.php?

old_chrome=11

212011年10月8日土曜日

tag : #play_ja

PlayにおけるWebSocketの今

222011年10月8日土曜日

tag : #play_ja

➡Play FrameworkのWebSocket実装は現在、急ピッチで進められている‣ 1.2.4でhybi 10が実装完了予定

‣ Gitのリポジトリでは既にいくつか適用

‣ ただし、APIが変わってよくわからない

232011年10月8日土曜日

tag : #play_ja 242011年10月8日土曜日

tag : #play_ja

➡hybi-10

252011年10月8日土曜日

tag : #play_ja

幅広い対応に向けて

262011年10月8日土曜日

tag : #play_ja

➡web-socket-js‣ https://github.com/gimite/web-socket-js

272011年10月8日土曜日

tag : #play_ja

まだまだわからない部分が多い...

282011年10月8日土曜日

tag : #play_ja

Play WebsocketHackathonしませんか？

@通称田町ラウンジ(パズル芝浦)

292011年10月8日土曜日