* Offer good for new Adobe MAX 2008 registrations only. Offer good for Adobe MAX Europe full event pass registration only. The offer applies to an Adobe MAX full event pass only (EUR€840). Offer cannot be combined with any other offer, package or registration code. Offer expires 11:59 pm PDT November 14, 2008. Terms and conditions for Adobe MAX registrations will also apply. Void where prohibited.

First of all you need the Pixel Bender Toolkit. You can get it from here. Second you will need to compile your Flex Project against Flash Player 10. There’s some documentation here. The whole idea behind my samples is that it took a while for me to put all things together and apply the effects on my Flex elements, and I want to make it easier for you.

In the first project I just made a simple Pixel Bender filter, which replaces the red channel with the blue one, and added it to an image.

Click here to see the demo

On the second project I used a filter with some parameters. It doesn’t do much, just clips a circle from the original image.

Click here to see the demo

The next one is a slightly more complex filter that has two input images. I use it to apply an image over a video.

Click here to see the demo

Finally, because Pixel Bender is basically a number cruncher, I use it to mix two ByteArrays. By chance these two ByteArrays are extracted from two sounds so this is also an example on how you can use Pixel Bender to mix two sounds.

Click here to see the demo (it might take a while before it starts playing because I have to load the sounds first)

You may want to take a look at the source code or download it.

I personally believe that this is unacceptable way of doing business.

Because of that it might take some time to get all the posts back (we have some back-ups and long live Google Cache). If anyone lived that before and solved (without paying a ton of money to GoDaddy) … or can help us in some way we would be more that grateful!

You can see a more romanced post at Mihai’s Blog as he dealt with them on the phone.

Next Thursday, October16th at University Politehnica of Bucharest we (a bunch of people from the University, uberVU, Yahoo and Adobe) will present a new — and a little bit unusual — course. The course is about web programming and we want to teach the new old stuff in a little different manner … at least a little different than I was taught in school. If you are a student in Bucharest then you might want to give it a try and attend the opening course which will take place in Politehnica EC105 hall at 14:00h. We also made a little site (Poli20.org) where we will post stuff as the things roll on.

The course is an experiment because  … well I will give more info after the first 1-2 courses. I don’t want to spoil the fun for those who will be there

Hope to see you next Thursday … and keep seeing you!

Still to be done:

• if you have more than one transparent page one after another it will look very messy because at any given moment the book has only 8 pages. This can be done by configuring how many real pages are stored … but the logic of navigating through get’s very nasty.
• tearing pages doesn’t work (not implemented yet)
• lot of traces are still enabled
• BEWARE of bugs

Give it a try:

• Demo
• Source

Next open Visual Web Developer and open a Web Site in the same location as the Flex Builder project.  Open web.config and make sure you have <compilation debug=”true”> (this inserts debugging symbols for the .NET code).

Now we need to use the same ASP.NET Developer Server for both the Flex Builder and Visual Web Developer. Since by default both tools try to start one instance we need a little trick to do that:

Start the MXML project through Flex Builder; this will start ASP.NET Developer Server usually on port 3000. Then go to Visual Web Developer; on Project Property Page (Right Click on the Project in the Solution Explorer) click Start Options and select Use Custom Server and enter http://localhost:3000/testDotNet/

Start also the .NET project just to connect the Visual Web Developer to the ASP.NET Developer Server instance. Now you will be able to debug both Flex and .NET code:

For tooling I will be using Flex Builder and Visual Web Developer 2008 Express Edition (VWD).

First let’s create a simple ASP.NET Web Service project using VWD:

I slightly modified the HelloWorld method in Service.cs to receive a parameter:

[WebMethod]

public string HelloWorld(String name) {

    return “Hello “ + name + “! Nice talking to you!”;

}

Now let’s get into Flex Builder and try to get something from the .NET Server. First we will create a new Flex Project on top of the .NET one. To do that click on New->Flex Project and choose ASP.NET as the server technology:

Make sure the location is the same as the VWD .NET project. Now run the default MXML file to start the ASP.NET Developer Server.

Next we will generate the glue code for calling the Web Service using the Import Web Service Wizard. Choose Data -> Import Web Service (WSDL) from the Flex Builder menu. On the first page the main source folder is selected by default. You can leave it like this. On the second page you need to choose the WSDL URI. When you launched the MXML application the ASP.NET Developer Server should have started by default on port 3000 (see the tray icon). In this case the WSDL URL should be something like http://localhost:3000/testDotNet/Service.asmx?WSDL.

The third page should look like this:

Now you should have some typed AS classes that provide easy access the .NET Web Service methods. The cool thing about this is that Flex Builder knows now how to do autocompletion on Web Service calls. So making a little application that will showcase this is just too easy:

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

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

    <mx:Script>

        <![CDATA[

            import mx.controls.Alert;

            import generated.webservices.HelloWorldResultEvent;

            import generated.webservices.Service;

            public function sayHello():void {

                var service:Service = new Service();

                service.addhelloWorldEventListener(

                    function (event:HelloWorldResultEvent):void {

                        Alert.show(event.result);

                    });

                service.helloWorld(myName.text);

            }

        ]]>

    </mx:Script>

    <mx:TextInput x=”176″ y=”171″ id=”myName”/>

    <mx:Text x=”70″ y=”173″ text=”Enter Your Name”/>

    <mx:Button x=”344″ y=”171″ label=”Click to receive greeting” click=”sayHello()”/>

</mx:Application>

public function editEnd(event:DataGridEvent):void {

  Alert.show(“Do you want to save changes?”,“Save changes”,Alert.YES | Alert.NO,null,function(ev:CloseEvent):void {

      if (ev.detail == Alert.YES) {

        //LABEL2: This will be reached long after the LABEL1 has been reached. 

        //So at this point the grid has been executed the default behavior for the change event

      }

    });

    //LABEL1: Because of the asynchronous nature this will be reached right after the Alert.show call    

}

So my idea of solving this was to save the new value, prevent the default grid behavior of updating the dataProvider and update the data provider manually on the Alert.show closeHandler.

Here is some code that illustrates this:

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

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

        initialize=”initData()” layout=”absolute”>

  <mx:Script>

   <![CDATA[

       import mx.controls.TextInput;

       import mx.controls.Alert;

    import mx.collections.*;

    import mx.events.*;

      private var DGArray:Array = [

         {Artist:'Pavement', Album:'Slanted and Enchanted', Price:11.99},

         {Artist:'Pavement', Album:'Brighten the Corners', Price:11.99}];

      [Bindable]

      public var initDG:ArrayCollection;

      public function initData():void {

         initDG=new ArrayCollection(DGArray);

      }

      public function editEnd(event:DataGridEvent):void {

          //Save the data before calling Alert

        var myEditor:TextInput =

                    TextInput(event.currentTarget.itemEditorInstance);

        // Get the new value from the editor.

        var newVal:String = myEditor.text;

        var dataObject:Object = event.itemRenderer.data;

        var property:String = event.dataField;

        Alert.show("Do you want to save changes?","Save changes",Alert.YES | Alert.NO,null,function(ev:CloseEvent):void {

            //If we have clicked YES then update the data collection manually

            if (ev.detail == Alert.YES) {

                  dataObject[property] = newVal.toString();

                  initDG.itemUpdated(dataObject,property);

            }

          });

          //prevent data grid to update his dataProvider collection

          event.preventDefault();

      }

   ]]>

   </mx:Script>

   <mx:DataGrid id=”myGrid” width=”350″ height=”200″

      dataProvider=”{initDG}” editable=”true” itemEditEnd=”editEnd(event)” >

      <mx:columns>

         <mx:DataGridColumn dataField=”Album” />

         <mx:DataGridColumn dataField=”Price” />

      </mx:columns>

   </mx:DataGrid>

   <mx:DataGrid id=”readOnlyGrid” width=”350″ height=”200″

      dataProvider=”{initDG}” x=”0″ y=”208″>

      <mx:columns>

         <mx:DataGridColumn dataField=”Album” />

         <mx:DataGridColumn dataField=”Price” />

      </mx:columns>

   </mx:DataGrid>

</mx:WindowedApplication>

This might be a little bug, but I found a workaround. I manually edited .actionScriptProperties file and in the <application> section added the FDMSBridge.as:

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

<actionScriptProperties mainApplicationPath=”testBlaze.mxml” version=”3″>

<compiler additionalCompilerArguments=”-services “C:/work/wksp/samples/testBlaze/WebContent/WEB-INF/flex/services-config.xml” -locale en_US” copyDependentFiles=”true” enableModuleDebug=”true” generateAccessible=”false” htmlExpressInstall=”true” htmlGenerate=”true” htmlHistoryManagement=”true” htmlPlayerVersion=”9.0.28″ htmlPlayerVersionCheck=”true” outputFolderPath=”bin-debug” rootURL=”http://localhost:8080/testBlaze” sourceFolderPath=”flex_src” strict=”true” useApolloConfig=”false” verifyDigests=”true” warn=”true”>

<compilerSourcePath/>

<libraryPath defaultLinkType=”1″>

<libraryPathEntry kind=”4″ path=”"/>

<libraryPathEntry kind=”1″ linkType=”1″ path=”flex_libs”/>

</libraryPath>

<sourceAttachmentPath/>

</compiler>

<applications>

<application path=”FDMSBridge.as”/>

<application path=”testBlaze.mxml”/>

</applications>

<modules/>

<buildCSSFiles/>

</actionScriptProperties>

Now the FDMSBridge.as should be compiled as a normal Flex application: