LAZIOMATICA – Guida allo Sviluppo Software

In previous example I have implemented a simple player with tubeloc library, but when i use it for multiple youtube player application it doesn’t work as aspected! infact this library has problems with multiple istances of the component, so only one istance can be used and the “destroy” method doen’t free the istance…so i try to find something else.
For this purpose i found aroun the web “AirYouTube”, another good component library and i post here another simple application with a main player and a button tha open simultanusly another istance of player in a pop up window.
The library and example can be founded at blog.derhess.de

and this is my basic snippet of code:

main application:

<?xml version=”1.0″ encoding=”utf-8″?>

<mx:WindowedApplication xmlns:mx=”http://www.adobe.com/2006/mxml” layout=”absolute“

xmlns:youtube=”de.derhess.video.youtube.*”

width=”599” height=”600“>

<mx:Script>

<![CDATA[

import mx.managers.PopUpManager;

import de.derhess.video.youtube.AirYouTube;

import de.derhess.video.youtube.YouTubeAS3;

import flash.utils.getDefinitionByName;

import de.derhess.video.youtube.YouTubeError;

import de.derhess.video.youtube.YouTubePlayingState;

import mx.controls.Alert;

import mx.collections.ArrayCollection;

import de.derhess.video.youtube.YouTubeVideoQuality;

import de.derhess.video.youtube.YouTubeEvent;

private function handlePlayerLoaded(event:YouTubeEvent):void

{

youTubePlayer.cueVideoById("paste_here_your_youtube_videoID_here",0,YouTubeVideoQuality.DEFAULT);

}

public function apriPop():void{

var myPop:pop = new pop();

PopUpManager.addPopUp(myPop,this,true);

}

]]>

</mx:Script>

<mx:Button x=”387” y=”393” label=”Carica Video in Popup” click=”apriPop();”/>

<youtube:FlexYouTube id=”youTubePlayer”

x=”330” y=”0”

width=”320” height=”240“

volume=”100“

youtubePlayerLoaded=”{handlePlayerLoaded(event);}”

/>

</mx:WindowedApplication>

pop.mxml component:

<?xml version=”1.0″ encoding=”utf-8″?>

<mx:Canvas xmlns:mx=”http://www.adobe.com/2006/mxml” width=”400” height=”300” xmlns:youtube=”de.derhess.video.youtube.*” >

<mx:Script>

<![CDATA[

import de.derhess.video.youtube.AirYouTube;

import de.derhess.video.youtube.YouTubeAS3;

import flash.utils.getDefinitionByName;

import de.derhess.video.youtube.YouTubeError;

import de.derhess.video.youtube.YouTubePlayingState;

import mx.controls.Alert;

import mx.collections.ArrayCollection;

import de.derhess.video.youtube.YouTubeVideoQuality;

import de.derhess.video.youtube.YouTubeEvent;

private function handlePlayerLoaded2(event:YouTubeEvent):void

{

youTubePlayer2.cueVideoById("paste_here_your_youtube_videoID_here",0,YouTubeVideoQuality.DEFAULT);

}

]]>

</mx:Script>

<youtube:FlexYouTube id=”youTubePlayer2”

x=”59” y=”234”

width=”320” height=”240“

volume=”100“

youtubePlayerLoaded=”{handlePlayerLoaded2(event);}”

/>

</mx:Canvas>

In questo articolo tratteremo l’integrazione all’interno delle nostre applicazioni AIR di video provenienti dal noto portale YOUTUBE. Per fare ciò sfrutteremo la libreria AS3 disponibile al progetto http://code.google.com/p/tubeloc/ e doniminata “tubeloc”. L’integrazione di per se è molto semplice, basterà copiare il folder “com/enefekt/tubeloc” all’interno del nostro folder “src” e referenziandolo con uno spazio nomi del tipo tubeloc
Per aggiungere il player a questo punto sarà semplicissimo, infatti basterà aggiungere al file mxml il seguente codice:
prestando attenzione che il file as2_tubeloc.swf sia presente nella root file mxml dell’applicazione principale.
La chiamata difatti al filmato viene effettuata dal tag videoID il quale una volta impostato elabora la chiamata per effettuare l’embedded del filmato.
la libreria in esame presenta numerevoli proprietà e metodi che possono essere esaminati dalla documentazione ufficiale, ma in questo caso si voleva semplicemente esaminarne il modo più semplice per poter presentare video YouTube all’interno delle vostre WindowedApplication AIR.
Questo è quanto. Di seguito un piccolo snippet di interfaccia di test che ho utilizzato per il mio esempio, in cui nell’attesa che il player youtube si presenti alla vostra applicazione sfrutta un semplice animazione flash che viene scaricata nel momento che viene invocata la funzione “onPlayerReady” del file movie.as presente nella libreria.

private function onPlayerReady(event_p:PlayerReadyEvent):void {
Application.application.ready(true);
playerReady = true;
setMovieSize(width, height);
if(videoId && chromeless) {
youtubeMovie.loadVideoById(videoId);
}


MXML:

<?xml version=”1.0″ encoding=”utf-8″?>

<mx:WindowedApplication xmlns:mx=”http://www.adobe.com/2006/mxml” xmlns:tubeloc=”com.enefekt.tubeloc.*” width=”400” height=”600” verticalScrollPolicy=”off” horizontalScrollPolicy=”off“>

<mx:Script>

<![CDATA[

import com.enefekt.tubeloc.event.PlayerReadyEvent;

public function ready(b:Boolean=true):void{

if (b)

animation.source="";

else animation.source="loading.swf";

}

]]>

</mx:Script>

<mx:VBox width=”100%” height=”100%” verticalScrollPolicy=”off” horizontalScrollPolicy=”off“>

<mx:Panel width=”350” height=”280” layout=”absolute“  title=”Player” backgroundColor=”#000000” verticalScrollPolicy=”off” horizontalScrollPolicy=”off“>

<tubeloc:Movie id=”tubelocMovie” width=”320” height=”240” videoId=”GJ1sZBTnbuE” chromeless=”false” x=”4” y=”0“/>

<mx:SWFLoader y=”113” source=”loading.swf” width=”330” height=”204” horizontalCenter=”30” id=”animation“/>

</mx:Panel>

<mx:Panel height=”250” width=”353” layout=”absolute” verticalScrollPolicy=”off” horizontalScrollPolicy=”off“>

<mx:Button label=”LoadVideo” click=”if(ytID.text!=”) {tubelocMovie.videoId=ytID.text; ready(false);}” x=”30” y=”34“/>

<mx:TextInput id=”ytID” x=”140” y=”34“/>

<mx:Image x=”213” y=”124” source=”images.jpg” width=”115” height=”86” scaleContent=”true“/>

</mx:Panel>

</mx:VBox>

</mx:WindowedApplication>

Potrà essere di utilità questo breve esempio che ci permetterà di parsare un comune file .csv (per ora posizionato all’interno del bundle applicazione) per poterlo successivamente manipolare e magari per popolare un arraycollection da utilizzare come DataProvider per un componente come un DataGrid.
Nello specifico, questo codice l’ho utilizzato per parsare un archivio storico in formato .csv di estrazioni al noto gioco WinForLife

import mx.collections.ArrayCollection;
import com.laziomatica.Estraz;

// Richiamato al creationComplete dell application
public function init():void{
progressAnalisi.setProgress(0,100);
var urlRequest:URLRequest = new URLRequest;
urlRequest.url = "storico.csv";
var url:URLLoader = new URLLoader;
url.dataFormat = URLLoaderDataFormat.TEXT;
url.addEventListener(Event.COMPLETE,loadedCSV);
url.load(urlRequest);
}
import com.laziomatica.estrazione;

var str:String = e.target.data as String;
var arr:Array = str.split("\n");
var estrazione:Array;
progressAnalisi.maximum = arr.length;
for(var i:int=0;i0) estrazioni.addItem(estrazioneOBJ);
progressAnalisi.setProgress(i,100);
progressAnalisi.setProgress( i,arr.length);
progressAnalisi.label = String(i*100/arr.length);
}
//Al termine la collection ottenuta può essere utilizzata in vari modi
dgEstrazioni.dataProvider = estrazioni;
}


Questo è tutto…nel prossimo esempio Flex vedremo come utilizzare questi dati all’interno dei Chart di Flexbuilder Pro.
Una volta ottenuto

mxml:

<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2007/09/30/using-a-flex-textarea-control-as-a-drop-in-item-editor/ -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
        layout="vertical"
        verticalAlign="middle"
        backgroundColor="white">

    <mx:XML id="itemsXML" source="data/items.xml" />

    <mx:DataGrid id="dataGrid"
            dataProvider="{itemsXML.item}"
            variableRowHeight="true"
            editable="true"
            width="100%"
            height="100%">
        <mx:columns>
            <mx:DataGridColumn id="idColumn"
                    dataField="@id"
                    editable="false"
                    headerText="ID" />
            <mx:DataGridColumn id="descColumnTextInput"
                    dataField="@desc"
                    editable="true"
                    wordWrap="true"
                    headerText="Desc (TextInput)" />
            <mx:DataGridColumn id="descColumnTextArea"
                    dataField="@desc"
                    editable="true"
                    wordWrap="true"
                    itemEditor="mx.controls.TextArea"
                    editorUsesEnterKey="true"
                    headerText="Desc (TextArea)" />
        </mx:columns>
    </mx:DataGrid>

</mx:Application>

items.xml

<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2007/09/30/using-a-flex-textarea-control-as-a-drop-in-item-editor/ -->
<items>
    <item id="1" desc="The quick brown fox jumped over the lazy dog." />
    <item id="2" desc="Lorem ipsum dolor sit amet, consectetuer adipiscing elit." />
    <item id="3" desc="Pellentesque nonummy aliquet metus." />
    <item id="4" desc="Nullam enim." />
    <item id="5" desc="Nullam sollicitudin sodales diam." />
    <item id="6" desc="Praesent quis tellus vel erat tristique placerat." />
    <item id="7" desc="Sed egestas, enim a convallis auctor, nisl tellus tincidunt nibh, vitae tempus mauris risus at arcu." />
    <item id="8" desc="Suspendisse laoreet sem eget ipsum porta consequat." />
    <item id="9" desc="Ut imperdiet felis quis orci." />
    <item id="10" desc="Phasellus tempus ante eu nisl." />
    <item id="11" desc="Donec velit sem, rutrum ac, bibendum sed, mattis ac, odio." />
    <item id="12" desc="Fusce mauris turpis, vehicula nec, mattis et, dapibus quis, arcu." />
    <item id="13" desc="Morbi tincidunt volutpat justo." />
    <item id="14" desc="Nam urna." />
    <item id="15" desc="Mauris est dui, aliquet at, venenatis tempus, eleifend a, pede." />
    <item id="16" desc="Vestibulum porttitor arcu sit amet nulla." />
    <item id="17" desc="Nulla vitae sapien." />
</items>

Original link

Adobe Flash Professional CS5 permetterà di sviluppare software per iPhone!

Articolo originale su macitynet.it

Novità dal sito www.actionscript.it sulla nuova versione del framework di casa ADOBE: AIR 2.0

Client.Error.DeliveryInDoubt
Channel disconnected before an acknowledgement was received

If you are annoying and trickiest error to debug when you are using Flash Remoting through AMFPHP.

But this error is actually pretty simple. It simply means there is a syntax error in your PHP code or the SQL statement within your PHP code.

To solve this problem make sure that:

• Your Adobe Flex function parameters and PHP function parameters are of the same number.
• The parameters of your Adobe Flex function are in the same order with its PHP function counterpart.
• All the Adobe Flex function parameters are of the same data type with their PHP function parameters counterpart.
• You assign a default value to the optional parameters in the PHP function.
• You pass a value to the parameters that are not optional.
• Finally, your SQL statements should be syntactically correct.

To hide the mouse in your AIR app, you can insert once this on your applicaion init script:

Mouse.hide();

Sometimes, even though the documentation says that it’s possible,this if this wasnt’t able to hide the mouse cursor so you can try this workaround:

stage.nativeWindow.activate();
stage.nativeWindow.orderToBack();
stage.nativeWindow.orderToFront();
Mouse.hide();

We notice that on OSX, mouse.hise() fail to work in fullscreen interactive until was clicked somewhere on the stage, so You can raise a click, just before the Mouse.hide(), with :

dispatchEvent( new MouseEvent( MouseEvent.CLICK ) );

The WindowsApplication mxml tag has an alwaysInFront property, so to make an application  always stay on top, just do this:

<?xml version=“1.0″ encoding=“utf-8″?>
<mx:WindowedApplication xmlns:mx=“http://www.adobe.com/2006/mxml” layout=“absolute” alwaysInFront=“true”>
</mx:WindowedApplication>

If you want an AIR  app to run in Kiosk mode application, that is  using alwaysInFront with a full screen, make it doing this:

<?xml version=“1.0″ encoding=“utf-8″?>
<mx:WindowedApplication xmlns:mx=“http://www.adobe.com/2006/mxml” layout=“absolute” alwaysInFront=“true”
applicationComplete=“onApplicationComplete()”>

<mx:Script><![CDATA[

public function onApplicationComplete():void{
this.stage.displayState = StageDisplayState.FULL_SCREEN;}

]]></mx:Script>
</mx:WindowedApplication>

Dopo 2 anni di assenza torna l’evento Adobe più atteso dagli sviluppatori web,  il 26 e 28 Maggio 2009 a Milano e Roma. Visita il sito http://www.fromatoweb.it per ulteriori informazioni.