Second Physical Communication Laboratory

The simple Vide Chat on Flex3

admin — Mon, 29 Mar 2010 03:52:12 +0000

I described the program of a very simple video chat out with Flex3 and Red5.

Donwload Flex3 source on FlashDevelop 3.0 here

Download Red5 source and Webapp. here

mxml : main.mxml

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
creationComplete="init()"
layout="absolute">

<mx:Script>
<![CDATA[
public var myCameraView:mystreaming = new mystreaming();
private var con:ChatConnection;
private var streamingURL:String = "rtmp://192.168.116.128/buruburu";
private var channetKey:String = "demo";
public function init():void {
con = new ChatConnection();
Textframe.addChild(con.logtext);
}
private function connect_chat():void {
if (connectOpen.label == "公開開始") {
cameraview.attachCamera(myCameraView.myLocalvideo.myCamera);
myCameraView.channetKey = channetKey;
myCameraView.connect_chat();
con.close();
connectOpen.label = "公開中止";
}else {
myCameraView.disconnect_chat();
con.close();
connectOpen.label = "公開開始";
}
}
private function shuffle_chat():void {
var myGuseView:gueststreaming = new gueststreaming();
myGuseView.channetKey = channetKey;
myGuseView.playVideo();
streamview.addChild(myGuseView.video);
con.connect(streamingURL);
}
private function sendMsg():void {
con.call("writeText", null, message.text);
message.text = "";
}
]]>
</mx:Script>
<mx:Panel id="VideoPanel" title="Bijo Chat" backgroundColor="0xb1bfc5" >
<mx:HBox  id="Menuframe">
<mx:Button id="connectOpen" x="0" y="0" label="公開開始"  fontSize="10" click="connect_chat()" visible="true" textRollOverColor="0xdeb700" />
<mx:Button id="connectClose" x="100" y="0" label="シャッフル" fontSize="10" click="shuffle_chat()"  visible="true" textRollOverColor="0xdeb700"/>
</mx:HBox>
<mx:HBox  id="Hframe">
<mx:VBox  id="Videoframe">
<mx:VideoDisplay x="0" y="0" width="320" height="180" id="streamview"  visible="true" backgroundImage="@Embed('iphone-camera-icon.jpg')"/>
<mx:VideoDisplay x="0" y="10" width="320" height="180" id="cameraview"  visible="true" backgroundImage="@Embed('iphone-camera-icon.jpg')"/>
</mx:VBox>
<mx:VBox  id="Textframe">
<mx:TextInput id="message" width="100%" enter="sendMsg()" />
</mx:VBox>
</mx:HBox>
</mx:Panel>
</mx:Application>

AS:mystreaming.as

package
{
import flash.media.Video;
import flash.net.NetConnection;
import flash.media.Camera;
import flash.media.Microphone;
import flash.net.NetStream;
import flash.events.*;
import mx.accessibility.AccImpl;
import flash.display.Sprite;
import flash.events.*;
import flash.net.URLLoader;
import flash.net.URLLoaderDataFormat;
import flash.net.URLRequest;
import flash.net.URLVariables;
import flash.events.NetStatusEvent;
import flash.events.EventDispatcher;
import mx.controls.Alert;
import mx.events.SliderEvent;
import mx.controls.sliderClasses.Slider;
import mx.rpc.events.ResultEvent;
import mx.managers.PopUpManager;
import mx.core.IFlexDisplayObject;
import mx.collections.ArrayCollection;
/**
* ...
* @author yuucha
*/
public class mystreaming
{
public var counter:Number = 0;
private var pub_nc:NetConnection;
private var pub_ns:NetStream;

private var streamingURL:String = "rtmp://192.168.116.128/buruburu";
private var play_nc:NetConnection;
private var play_ns:NetStream;
private var stat:Number;
private  var clientID:Number;
private var StreamingCamera:Camera;
private var StreamingMic:Microphone;
public var myLocalvideo:myvideo;
public var video:Video = new Video(320, 180);
public var channetKey:String = "";

public function mystreaming():void
{
myLocalvideo = new myvideo();
}

public function onBWDone(... rest):Boolean {
return true;
}
public function newStream():void {
trace("newStream");
}
public function onBWCheck(... rest):Number {
return 0;
}
public function connect_chat():void {
pub_nc = new NetConnection();
var clientObj:Object = new Object();
clientObj.onBWDone = onBWDone;
clientObj.onBWCheck = onBWCheck;
pub_nc.client = clientObj;
pub_nc.connect(streamingURL);
pub_nc.addEventListener(NetStatusEvent.NET_STATUS,pub_netStatus);
pub_nc.addEventListener(SecurityErrorEvent.SECURITY_ERROR,onSecurityError);
}
public function disconnect_chat():void {
pub_nc.close();
Alert.show("映像の公開を中止しました。");
}
private function pub_netStatus(event:NetStatusEvent):void {
if (event.info.code == "NetConnection.Connect.Success") {
pub_ns = new NetStream(pub_nc);
pub_ns.attachAudio(myLocalvideo.myMic);
pub_ns.attachCamera(myLocalvideo.myCamera);
pub_ns.publish(channetKey, "live");
Alert.show("ストリーミングサーバへの接続に成功しました。");
}
else if (event.info.code == "NetConnection.Connect.Closed") {
pub_ns.close();
Alert.show("ストリーミングサーバへの接続に失敗しました。");
}
else {
trace("error");
}
}
private function onSecurityError(event:SecurityErrorEvent):void {
trace("netSecurityError:" + event);
}

}

}

AS:gueststreaming.as

package
{
import flash.media.Video;
import flash.net.NetConnection;
import flash.media.Camera;
import flash.media.Microphone;
import flash.net.NetStream;
import flash.events.*;
import mx.accessibility.AccImpl;
import flash.display.Sprite;
import flash.events.*;
import flash.net.URLLoader;
import flash.net.URLLoaderDataFormat;
import flash.net.URLRequest;
import flash.net.URLVariables;
import flash.events.NetStatusEvent;
import flash.events.EventDispatcher;
import mx.controls.Alert;
import mx.events.SliderEvent;
import mx.controls.sliderClasses.Slider;
import mx.rpc.events.ResultEvent;
import mx.managers.PopUpManager;
import mx.core.IFlexDisplayObject;
import mx.collections.ArrayCollection;
/**
* ...
* @author yuucha
*/
public class gueststreaming
{
private var streamingURL:String = "rtmp://192.168.116.128/buruburu";
private var play_nc:NetConnection;
private var play_ns:NetStream;
public var video:Video = new Video(320, 180);
public var channetKey:String = "";

public function gueststreaming()
{
}

public function playVideo():void{
play_nc = new NetConnection();
var clientObjplay:Object = new Object();
play_nc.client = clientObjplay;
clientObjplay.setId = function setId( id:Number ):void { };
play_nc.addEventListener(NetStatusEvent.NET_STATUS, play_netStatus);
play_nc.addEventListener(SecurityErrorEvent.SECURITY_ERROR, onSecurityError);
play_nc.connect(streamingURL);
}

public function disconnect_chat():void {
play_nc.close();
}

private function onSecurityError(event:SecurityErrorEvent):void {
trace("netSecurityError:" + event);
}
private function play_netStatus(event:NetStatusEvent):void {
trace("netStatus: " + event.info.code);
if (event.info.code == "NetConnection.Connect.Success") {
Alert.show("ストリーミングサーバへの接続に成功しました。");
play_ns = new NetStream(play_nc);
video.attachNetStream(play_ns);
play_ns.play(channetKey);
} else{
trace("error");
Alert.show("ストリーミングサーバへの接続が中断しました。");
}
}
}

}

AS:myvideo.as

package
{
import flash.media.Video;
import flash.media.Camera;
import flash.media.Microphone;

/**
* ...
* @author yuucha
*/
public class myvideo
{
public var myCamera:Camera;
public var myMic:Microphone;

public function myvideo():void{
camera_init();
}

public function camera_init():void {
myCamera = Camera.getCamera();
myCamera.setMode(320,180, 30, true );
myCamera.setQuality(163840,0);
myMic = Microphone.getMicrophone();
myMic.rate = 44;
}
}

}

AS:ChatConnection.as

package
{
import flash.net.NetConnection;
import mx.controls.TextArea;

public class ChatConnection extends NetConnection
{
public var logtext:TextArea = new TextArea();

public function ChatConnection()
{
super();
logtext.width = 640;
logtext.height = 320;

}

public function writeText(message:String):void
{
logtext.text = message + "n" + logtext.text;
}

public function setlogtext(t:String):void
{
logtext.text = t;
}

public function getTextArea():TextArea
{
return logtext;
}
}
}

red5: buruburu.java

If you don’t want to use Text chat, you don’t need this code on your Red5 Webapp.

import java.util.Iterator;
import java.util.Set;

import org.red5.server.adapter.ApplicationAdapter;
import org.red5.server.api.IClient;
import org.red5.server.api.IConnection;
import org.red5.server.api.IScope;
import org.red5.server.api.Red5;
import org.red5.server.api.service.IServiceCapableConnection;

public class Application extends ApplicationAdapter
{
// クライアント側から呼ばれるメソッド
public String drawLine(IConnection conn, int startX, int startY, int endX, int endY)
{
IScope scope = Red5.getConnectionLocal().getScope();
Set<IClient> clients = scope.getClients();
Iterator<IClient> it = clients.iterator();
Object[] params = new Object[]{startX, startY, endX, endY};
while(it.hasNext())
{
IClient client = it.next();
Set<IConnection> connset = client.getConnections();
Iterator<IConnection> it_con = connset.iterator();

while(it_con.hasNext())
{
IConnection connection = it_con.next();
if(connection instanceof IServiceCapableConnection)
{
IServiceCapableConnection sc = (IServiceCapableConnection)connection;
// クライアント側のメソッドを呼ぶ
sc.invoke("drawLine", params);
}
}
}
return "OK";

}

This version is the less text chat.

import org.red5.server.adapter.ApplicationAdapter;
import org.red5.server.api.IClient;
import org.red5.server.api.IConnection;
import org.red5.server.api.IScope;
import org.red5.server.api.Red5;
import org.red5.server.api.service.IServiceCapableConnection;

public class Application extends ApplicationAdapter
{
}

CakeSWXPHP

admin — Tue, 05 Jan 2010 02:05:28 +0000

If you want to use RemoteObject on CakePHP, you can use “CakeSWXPHP”.

This Knowledge is refered to 株式会社ヒューマンオーク’s web site (http://www.human-ook.jp/company.html)

CakeSWXPHP allows SWX to call CakePHP controllers. CakePHP is a rapid development framework for PHP.

Download from CakeSWX blog.
http://blog.aboutme.be/cakeswxphp/
Install
1. exstract cakeswxphp.zip
2. move to directories to app and webroot.

Codeing

controller

class HelloWorldsController extends AppController {
	var $name ='HelloWorlds';
	var $uses = '';
	function hello(){
		return 'HelloWorlds';
	}
}

Flex code

RemoteObject
endpoint: able to access amf.php on the cakePHP’s URL in the webroot.
source: Controller’s name
result: connection success
fault: connection fault

Tips

Use models
return $this -> Model -> findall();
flex can get the objectarray.

debuging tools
localhost/cake/explorer/

The Gainer Flex3 analog out programming

admin — Tue, 10 Feb 2009 06:03:43 +0000

I described the program of a very simple analog out with Flex3.　I made a screen of Flash in mxml and described ActiveScript in another .as file.I make one slider controller of Flash and change output data of analog if I let a controller slide. It is powered by two AA batteries in gainer this time and operates a DC motor.

mxml : demo.mxml

AS:Motor.as

import gainer.Gainer;

public var gnr:Gainer;
public function init():void
{
gnr = new Gainer("localhost", 2000, Gainer.MODE1, true);
}
public function aOut():void
{
gnr.analogOutput(0,ao0.value);
}

Setting Gainer

admin — Tue, 10 Feb 2009 05:49:43 +0000

It is to solder a pin first to have to do. Gainer can install two lines of pins.　I put Gainer on the top to install it precisely after having inserted a pin in a flexible board.　When I solder it, please be careful heat comes not too much, and not to break a part.

The clone Gainer

admin — Tue, 27 Jan 2009 06:31:09 +0000

The parts list

A USB microcomputer board finished product (PIC18F2550) \1,000 (tax-included).
A RS232C cable & power supply set \800 (tax-included) for three AKI - PIC programmer Ver. kits.
A USB cable (A - mini B) 1.5m \150 (tax-included) (entering one case of 240).
A set of AKI - PIC programmer Ver.4 (a completion board) \5,700 (tax-included).

Update software
http://akizukidenshi.com/catalog/contents2/ver4support.aspx

MPLAB downloadhttp://www.microchip.com/stellent/idcplg?IdcService=SS_GET_PAGE&nodeId=1406&dDocName=en019469

MPLAB C Compiler for PIC18 Down load
http://www.microchip.com/stellent/idcplg?IdcService=SS_GET_PAGE&nodeId=1406&dDocName=en010014

#include ＜p18cxxx.h＞
#include ＜delays.h＞

#pragma config FOSC = HSPLL_HS
#pragma config WDT = OFF
#pragma config PLLDIV = 5
#pragma config CPUDIV = OSC1_PLL2
#pragma config USBDIV = 2
#pragma config PWRT = ON
#pragma config BOR = OFF
#pragma config BORV = 2
#pragma config LVP = OFF
#pragma config VREGEN = ON
#pragma config MCLRE = OFF
#pragma config PBADEN = OFF

void main(void)
{
TRISB = 0;
LATB = 0x00;
while(1){
Delay10KTCYx(100);
LATB ^= 0xff;
}
}

The infometion source
http://blog.goo.ne.jp/sim00/e/fee5a8d229457154de4d7c10095ebd89

The sound live streaming

admin — Wed, 21 Jan 2009 09:33:09 +0000

This showcase is made the controller for the streaming live sound. You can change the parameters by the some slider bars.

showcase_2.swf








    
         100){
            max = 0;
            MaxLevelLabel.text="Max:"+ String(temp);
            counter = 0;
          }
        }

        private function sliderChange(event:SliderEvent):void {
          var currentSlider:Slider=Slider(event.currentTarget);
          if(currentSlider.id == "SSlider"){
              myMic.gain= currentSlider.value;
          }
          else{
          }
        }
        private function LocalSpeakerChange():void {
          if(LocalSpeaker.selected){
            myMic.setLoopBack(true);
          }else{
            myMic.setLoopBack(false);
          }
        }
        private function EchoChange():void {
          if(Echo.selected){
            myMic.setUseEchoSuppression(true);
            togle=0;
          }else{
            myMic.setUseEchoSuppression(false);
            togle=0;
          }
        }
        public function handleClick():void {
          SSlider.value=1;
          LocalSpeaker.selected = true;
          Echo.selected = true;
          myMic.setLoopBack(true);
          myMic.setUseEchoSuppression(true);
          myMic.rate=8;
          togle=0;
        }
        public function RateChange(event:ItemClickEvent):void {
          if(event.currentTarget.selectedValue == "5"){
              myMic.rate= 5;
          }
          else if(event.currentTarget.selectedValue == "8"){
              myMic.rate= 8;
          }
          else if(event.currentTarget.selectedValue == "11"){
              myMic.rate= 11;
          }
          else if(event.currentTarget.selectedValue == "22"){
              myMic.rate= 22;
          }
          else if(event.currentTarget.selectedValue == "44"){
              myMic.rate= 44;
          }else{
          }
          RateLabel.text="Rate:"+ String(myMic.rate);
        }
        ]]>

The live streaming video with parameters controller.

admin — Wed, 21 Jan 2009 06:02:44 +0000

In this showcase, I made the controller for the streaming live Flash. You can change the parameters by the some slider bars.
If you want to know mean the parameters, Please read this page.

showcase_1.swf

If you want to show from the client, You should open here.(There is a streaming live Flash video viewer on this web page.)


width="550" height="300">

The flash camera object property controller

admin — Tue, 20 Jan 2009 06:00:57 +0000

I tried it that is set the parameters in the flash camera object.

The method

get()
Get the camera object.

theCamera = Camera.get();
camera1 = Camera.get(0);
camera2 = Camera.get(1);

setKeyFameInterval()
Set the Interval Key frame. The default value is “15″. We can set from 1 to 48. If set value is large, the key fame intarval is long, and the data is smaller.
```
theCamera.setKeyFrameInterval(10);
```
setMethod()
This method is setting all of parameter for the camera object. there are the capturing format that are “width”, “heght” and “fps”. We can give priority to either size or fps.
```
theCamera.setMethode(320,240,12);
theCamera.setMethod(320,240.false);
```
If you want to get the parameters , you should access the public value.
```
theCamera.width;
```
setQuality
give quality to the video. The quality parameters are bandwidth and the picture quality.
The default value for bandwidth is “16384″. And the picture quality is from 0 to 100. Of course　It affects it each other.
```
theCamera.setQuality(8192, 0) //Bandwidth priority;
theCamera.setQuality(0, 80)　//Picture priority;
theCamera.setQuality(8192, 50); //Adjust  at a frame rate
```

setLoopback
Confirm a delivery picture in a local view.

theCamera = Camera.get();
theCamera.setQuality(0, 50);
theCamera.setLoopback(true);
theVideo.attachVideko(theCamera);

setMotionLevel()
I don’t know that must be use. If you want to get the activation message from camera, you should use this.

theCamera.setMotionLevel(10,1000);
theCamera.onActivity = function(bActive){
if(bActive){
trace("The camera is Active!");
}else{
trace("The camera is not  active")
}
};

The Ecommerce ASP service

admin — Mon, 19 Jan 2009 07:55:59 +0000

I want to use ASP for the settlement of the shop.
The settlement service which is famous in Japan is “http://estore.co.jp/”. In the site, a function of the credit card settlement and the convenience store settlement is substantial. The payment of moon is 50 dollars. I can use settlement service and a shopping cart and inventory control service.
http://estore.co.jp/index.html

The simple Tab panel on the Flex3

admin — Mon, 19 Jan 2009 05:59:02 +0000

The Tab panel example for Flex3 application menubar.

The code was written by Adobe Flex documentation. The original code is here.
http://livedocs.adobe.com/flex/3_jp/devguide_flex3.pdf

Flex compile.

[root@hostname ~]# mxmlc myTab.mxml

Open the myTab.swf by web browser.