Permalink
Browse files

moved text chatting into js

  • Loading branch information...
1 parent f2bf20c commit 26ae555ea99377d5fba426ed9c6df92a781a8406 @psawaya psawaya committed Mar 25, 2010
Showing with 198 additions and 102 deletions.
  1. +17 −12 cam_mash_app.py
  2. +74 −61 flash/StratusTest.hx
  3. +4 −1 flash/Whiteboard.hx
  4. +4 −1 srv.sh
  5. +43 −0 static/chat.js
  6. +20 −10 templates/call.html
  7. +9 −0 templates/chat.html
  8. +27 −17 templates/listen.html
View
29 cam_mash_app.py
@@ -5,9 +5,15 @@
urls = (
'/', 'index',
+ '/listen', 'listen',
+ '/call', 'call',
)
-render = web.template.render('templates', base='base')
+def render_template(name, *args, **kw):
+ #TODO: find better way to embed templates by name
+ return getattr(web.template.render("templates", globals={"render_template": render_template}),name)()
+
+render = web.template.render("templates", base='base', globals={"render_template": render_template})
class index:
def GET(self):
@@ -21,17 +27,16 @@ def POST(self):
# person.name = i.name
# person.put()
return web.seeother('/list')
-#
-# class listen:
-# def GET(self):
-# # return "Error."
-# return render.listen()
-# def POST(self):
-# return render.listen()
-#
-# class call:
-# def GET(self):
-# return render.call()
+
+class listen:
+ def GET(self):
+ return render.listen()
+ # def POST(self):
+ # return render.listen()
+
+class call:
+ def GET(self):
+ return render.call()
#
# class list:
# def GET(self):
View
135 flash/StratusTest.hx
@@ -36,8 +36,8 @@ class StratusTest {
var peerVideo:Video;
var localVideo:Video;
- var chatlog:TextField;
- var chatinput:TextField;
+/* var chatlog:TextField;
+ var chatinput:TextField;*/
var nc:NetConnection;
@@ -62,6 +62,8 @@ class StratusTest {
ExternalInterface.addCallback("startAsListener",startAsListener);
ExternalInterface.addCallback("startAsConnector",startAsConnector);
+
+ ExternalInterface.addCallback("chatSend", sendChatMessageFromJS);
var vid_width:Int = cast(320*1.0,Int);
var vid_height:Int = cast(240*1.0,Int);
@@ -79,7 +81,7 @@ class StratusTest {
initWhiteboard();
- createChatFields();
+/* createChatFields();*/
initMicrophone();
@@ -91,13 +93,13 @@ class StratusTest {
}
function initWhiteboard() {
- whiteboard = new Whiteboard(420,250);
+ whiteboard = new Whiteboard(400,500);
whiteboard.addEventListener(DrawEvent.DRAW, onWhiteboardDraw);
current.addChild(whiteboard);
- whiteboard.x = 320+5;
+ whiteboard.x = 320+15;
whiteboard.y = 10;
}
@@ -167,57 +169,57 @@ class StratusTest {
trace ("mic = " + mic.name);
}
- function createChatFields() {
- // XXX: Grab actual video dimensions somehow.. and come
- // up with a better way of laying things out. Flex?
- var chat_container = new MovieClip();
-
- var vid_width = 320;
- var vid_height = 240;
-
- // TODO: TextFormat objects
- // Scrollback for Chat Log
-
- // Chat Log Field
- chatlog = new TextField();
- chatlog.width = vid_width-5;
- chatlog.height = vid_height - 30;
-
- chatlog.x = vid_width + 2;
- chatlog.y = vid_height;
- chatlog.border = true;
- chatlog.borderColor = 0;
- chatlog.background = true;
- chatlog.backgroundColor = 0xEEEEEE;
- chatlog.wordWrap = true;
- chatlog.mouseWheelEnabled = true;
- chatlog.type = flash.text.TextFieldType.DYNAMIC;
- chatlog.multiline = true;
-
- // Chat Input Field
- chatinput = new TextField();
- chatinput.x = vid_width + 2;
- chatinput.y = 480 - 30;
- chatinput.width = vid_width-5;
- chatinput.height = 30;
- chatinput.border = true;
- chatinput.borderColor = 0;
- chatinput.background = true;
- chatinput.backgroundColor = 0xFFFFFF;
- chatinput.type = flash.text.TextFieldType.INPUT;
-
- // Add Fields to stage
- chat_container.addChild(chatlog);
- chat_container.addChild(chatinput);
-
- current.addChild(chat_container);
-
- chat_container.x = vid_width/3 - 100;
- chat_container.y = vid_width/3 - 50;
-
- // Add keyboard listener that makes enter key submit text
- current.addEventListener(KeyboardEvent.KEY_DOWN, onKeyDown );
- }
+ /* function createChatFields() {
+ // XXX: Grab actual video dimensions somehow.. and come
+ // up with a better way of laying things out. Flex?
+ var chat_container = new MovieClip();
+
+ var vid_width = 320;
+ var vid_height = 240;
+
+ // TODO: TextFormat objects
+ // Scrollback for Chat Log
+
+ // Chat Log Field
+ chatlog = new TextField();
+ chatlog.width = vid_width-5;
+ chatlog.height = vid_height - 30;
+
+ chatlog.x = vid_width + 2;
+ chatlog.y = vid_height;
+ chatlog.border = true;
+ chatlog.borderColor = 0;
+ chatlog.background = true;
+ chatlog.backgroundColor = 0xEEEEEE;
+ chatlog.wordWrap = true;
+ chatlog.mouseWheelEnabled = true;
+ chatlog.type = flash.text.TextFieldType.DYNAMIC;
+ chatlog.multiline = true;
+
+ // Chat Input Field
+ chatinput = new TextField();
+ chatinput.x = vid_width + 2;
+ chatinput.y = 480 - 30;
+ chatinput.width = vid_width-5;
+ chatinput.height = 30;
+ chatinput.border = true;
+ chatinput.borderColor = 0;
+ chatinput.background = true;
+ chatinput.backgroundColor = 0xFFFFFF;
+ chatinput.type = flash.text.TextFieldType.INPUT;
+
+ // Add Fields to stage
+ chat_container.addChild(chatlog);
+ chat_container.addChild(chatinput);
+
+ current.addChild(chat_container);
+
+ chat_container.x = vid_width/3 - 100;
+ chat_container.y = vid_width/3 - 50;
+
+ // Add keyboard listener that makes enter key submit text
+ current.addEventListener(KeyboardEvent.KEY_DOWN, onKeyDown );
+ }*/
function ncListen(event:NetStatusEvent) {
@@ -290,7 +292,7 @@ class StratusTest {
incoming_ns.receiveAudio(true);
incoming_ns.receiveVideo(true);
- chatlog.text = "";
+/* chatlog.text = "";*/
publishOutStream();
@@ -361,7 +363,7 @@ class StratusTest {
control_ns = null;
}
- function sendChatMessage() {
+/* function sendChatMessage() {
if (chatinput.text != "") {
if (outgoing_ns != null) {
outgoing_ns.send("gotChatMessage", chatinput.text);
@@ -370,11 +372,22 @@ class StratusTest {
chatinput.text = "";
chatlog.scrollV = chatlog.maxScrollV;
}
+ }*/
+
+ function sendChatMessageFromJS(text) {
+ if (text != "") {
+ if (outgoing_ns != null) {
+ trace("sending chat message " + text);
+ outgoing_ns.send("gotChatMessage", text);
+ }
+ }
}
function gotChatMessage(str:String) {
- chatlog.text += "\r Stranger: " + str;
- chatlog.scrollV = chatlog.maxScrollV;
+/* chatlog.text += "\r Stranger: " + str;*/
+/* chatlog.scrollV = chatlog.maxScrollV;*/
+
+ ExternalInterface.call("getChatLine", str);
}
function gotWhiteboardUpdate(obj:Dynamic) {
@@ -402,7 +415,7 @@ class StratusTest {
function onKeyDown(event:KeyboardEvent) {
switch(event.keyCode){
case 13: // Return
- sendChatMessage();
+ return;//sendChatMessage();
}
}
}
View
5 flash/Whiteboard.hx
@@ -39,8 +39,11 @@ class Whiteboard extends MovieClip {
addChild(drawCanvas);
+
+ //TODO: stop triggering these events when the user mouse events on a button
addEventListener(MouseEvent.MOUSE_DOWN, onMouseDown);
addEventListener(MouseEvent.MOUSE_UP, onMouseUp);
+/* addEventListener(MouseEvent.MOUSE_OUT, onMouseUp);*/
createButtons();
}
@@ -61,7 +64,7 @@ class Whiteboard extends MovieClip {
}
function createButtons() {
- var colors = [0x000000, 0xffffff, 0xff0000, 0x00ff00, 0x0000ff,0x783030,0x483078,0x301818,0xD8D860,0xF0C060];
+ var colors = [0x000000, 0xffffff, 0xff0000, 0x00ff00, 0x0000ff,0xECD078,0xD95B43,0xC02942,0x542437,0x53777A];
for (i in 0...colors.length) {
var newButton = new Sprite();
View
5 srv.sh
@@ -1,2 +1,5 @@
#! /bin/bash
-exec sudo /usr/sbin/thttpd -C thttpd.conf -D
+#exec sudo /usr/sbin/thttpd -C thttpd.conf -D
+
+cp flash/stratus_test.swf static/stratus_test.swf #Only needed when using the cheesy web.py server
+python cam_mash_app.py #Start said cheesy server.
View
43 static/chat.js
@@ -0,0 +1,43 @@
+function setUpChat() {
+ $('#chatSubmit').click(sendChat);
+
+ $('#chatLine').keypress(function (e) {
+ if (e.keyCode == 13)
+ sendChat();
+ });
+}
+
+function getChatLine(text) {
+ appendChatLine("Other guy", text);
+}
+
+function appendChatLine(user, text) {
+ var newP = $('<p></p>');
+ newP.append($('<span></span').text(user).css("font-weight","bold").css('padding-right','10px'));
+ newP.append($('<span></span').text(text));
+
+ newP.addClass("chatLineP");
+
+ $('#chatLog').append(newP);
+
+ //Scrolls to the bottom of chatLog div
+ //Thanks, http://kisdigital.wordpress.com/2010/03/10/using-jquery-to-scroll-to-the-bottom-of-a-div-revised/#comments
+ $("#chatLog").animate({ scrollTop: $("#chatLog").attr("scrollHeight") - $('#chatLog').height() }, 500);
+}
+
+function sendChat() {
+ var chatLine = $('#chatLine').val();
+
+ if (chatLine == "") return;
+
+ $("#content").get()[0].chatSend(chatLine);
+
+ appendChatLine("Me", chatLine);
+
+ $('#chatLine').val('');
+ $('#chatLine').focus();
+}
+
+function clearChat() {
+ $('.chatLineP').remove();
+}
View
30 templates/call.html
@@ -1,25 +1,35 @@
$var title: call!
-<!-- <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script> -->
<script src="/static/jquery-1.3.2.min.js" type="text/javascript"></script>
<script src="/static/swfobject.js" type="text/javascript"></script>
+<script src="/static/chat.js" type="text/javascript"></script>
<script>
jQuery(document).ready(function()
{
- swfobject.embedSWF("/flash/stratus_test.swf", "content", "630", "340", "10");
-
- jQuery('#callButton').click(function() {
- jQuery(this).hide();
- jQuery("#content").get()[0].startAsConnector();
- });
-
+ swfobject.embedSWF("/static/stratus_test.swf", "content", "750", "550", "10");
+
+ jQuery('#callButton').click(function() {
+ jQuery(this).hide();
+ jQuery("#content").get()[0].startAsConnector();
+ });
+
+
+ setUpChat();
});
</script>
<input type="submit" value="call" id="callButton">
+<div id="url"></div>
+
+<div style="margin:auto;">
+<div style="float:left" id="content"> </div>
+
+<div style="float:right;width:35%;">
+ $:render_template('chat')
+</div>
- <div id="content">
+<div style="clear:both"></div>
- </div>
+</div>
View
9 templates/chat.html
@@ -0,0 +1,9 @@
+<div style="border-width:2px;border-style:dashed;padding:5px;">
+ <div id="chatLog" style="height:400px;overflow:auto">
+
+ </div>
+ <div>
+ <input type="text" id="chatLine"> <input type="submit" id="chatSubmit" value="Send">
+ </div>
+
+</div>
View
44 templates/listen.html
@@ -1,32 +1,42 @@
-$var title: listen!
+$var title: listen!
+
<script src="/static/jquery-1.3.2.min.js" type="text/javascript"></script>
<script src="/static/swfobject.js" type="text/javascript"></script>
+<script src="/static/chat.js" type="text/javascript"></script>
<script>
-jQuery(document).ready(function()
-{
- swfobject.embedSWF("/flash/stratus_test.swf", "content", "630", "340", "10");
-
- jQuery('#listenButton').click(function() {
- jQuery(this).hide();
- jQuery("#content").get()[0].startAsListener();
- });
-
+ jQuery(document).ready(function()
+ {
+ swfobject.embedSWF("/static/stratus_test.swf", "content", "750", "550", "10");
-});
+ jQuery('#listenButton').click(function() {
+ jQuery(this).hide();
+ jQuery("#content").get()[0].startAsListener();
+ });
+
+ setUpChat();
+
+ });
-function setNearID(nearID) {
- jQuery('#url').html("Give your friend this url: http://cam-mash.appspot.com/call?" + nearID);
-}
+ function setNearID(nearID) {
+ jQuery('#url').html("Give your friend this url: http://" + location.host + "/call?" + nearID);
+ }
</script>
<input type="submit" value="listen" id="listenButton">
<div id="url"></div>
- <div id="content">
-
- </div>
+<div style="margin:0 auto;padding:50px">
+<div style="float:left;margin:0" id="content"> </div>
+
+<div style="float:right;width:35%;margin:0;padding-right:5%;">
+ $:render_template('chat')
+</div>
+
+
+
+</div>

0 comments on commit 26ae555

Please sign in to comment.