Saturday, April 17, 2010

Search Widget - Robotlegs, Signals, Flight, Minimal Comps, Yahoo Astra

Man, long time, no post.

This video comes from a chat I was having with Renaun Erickson, Garth Braithwaite, and Jac Wright about the value of watching someone work towards a specific goal. So, this video isn't really a tutorial, it's more of me just building a search widget and talking about it as I go. Anyway, here it is:
[pro-player type="mp4"]http://j0hn.org/videos//search-widget.mp4[/pro-player]

Download Source Code

Libraries used:

Robotlegs
Signals
signals-extensions-CommandSignal
Flight
MinimalComps
Yahoo Astra WebAPIs

33 comments:

  1. Great video! If you are going to make something like this one once more using Idea please install "key promoter" plugin so viewers can see what commands/shortcuts you use.

    ReplyDelete
  2. johnlindquist1:32 PM

    It looks like "key promoter" only notifies you when you're not using a keyboard shortcut that you should be using. Is there a setting to display which shortcut keys you're actually using?

    ReplyDelete
  3. Shaun4:06 PM

    When setting up your source in Flash Builder 4 as an ActionScript project I get the error as below.

    1172: Definition mx.binding:BindingManager could not be found. YahooSearchModel.as

    This is the [Bindable] tag. Are you running this as a Flex App? Or is there a way to get BindingManger to work in an ActionScript only project?

    ReplyDelete
  4. johnlindquist4:16 PM

    Try adding the following to your compiler arguments:

    -static-link-runtime-shared-libraries=true

    Basically, (I think) FlashBuilder is trying to use all of the Flex classes (including BindingManager) as RSLs rather than include the required classes during compilation. You'll see this kind of thing happen in pure as3 projects that have minor dependencies on the Flex framework (Reflex, flight, and others).

    ReplyDelete
  5. Shaun4:46 PM

    No go... But, if I turn off "Enable strict type checking" under ActionScript Compiler the errors are gone, and the app runs fine.

    ReplyDelete
  6. johnlindquist4:54 PM

    Weird... well, whatever works I guess :)

    ReplyDelete
  7. Glad I took a class w/ you. Great and I like that you are not pompous about OO.

    How did you do the colors?

    ReplyDelete
  8. johnlindquist5:45 AM

    Hey Vic,

    I actually used IntelliJ for this tutorial (a friend recommended that I try it out for a few weeks). The colors are way easier to set up in IntelliJ than they are in Eclipse (it's just a simple settings dialog).

    ReplyDelete
  9. Oops. I was pretty sure it does. Pardon my mistake. I've googled a bit and have found two windows utils to do the work:
    http://weblogs.asp.net/rosherove/archive/2007/0...
    http://www.romeosa.com/osdHotkey/help.html

    Also if you ever use os x there is http://stephendeken.net/software/keycastr/

    Hope this helps.

    ReplyDelete
  10. q2designnet9:52 AM

    Very nice. Thanks. And like Nik said, if we could have the shortCuts you use it would be heaven.

    ReplyDelete
  11. juanbonfante8:13 AM

    Nice work. I learned some very important things. I have no clue what Inject actually does, but I like it. And Flight definitely took me off guard. This is really cool stuff though, you make it look easy ;)

    Time to work through it myself now, this is extremely insightful though.

    ReplyDelete
  12. Loved the video; thought-provoking once again. Added it to the AS3 Signals wiki:

    http://wiki.github.com/robertpenner/as3-signals...

    ReplyDelete
  13. Hey John, I noticed in your video you were wanting to re-position your caret alot, by default IntlliJ allows placement of the caret after the end of line, if you go to Settings->Editor under the Virtual Space section you can un-check "Allow placement of caret after end of line" this should really speed up your flow.

    ReplyDelete
  14. johnlindquist4:56 PM

    Thanks for the tip! Going to check it out to see if I notice the difference next week.

    ReplyDelete
  15. johnlindquist4:57 PM

    Thanks Rob. I'm in the process of converting all my fellow devs to Signals on our next big project ;)

    ReplyDelete
  16. this was super duper helpful!

    ReplyDelete
  17. Question: i was trying to test the Bind class from Flight alone to see how it works. I did a class with some variable with [Bindable] on it. But doing some debugging i´m detecting that my source class dispatched an event with name var_name + "Changed", and not the event "propertyChange" (because the Bindable dosent have event name) so the binding is never executed...

    this is my vode:
    ///////////////////
    package
    {
    import flash.display.Sprite;
    import flash.utils.setInterval;
    import flight.binding.Bind;


    /**
    * ...
    * @author Pablo Bandin (pablo.bandin@avatarla.com|p48l0.84nd1n@gmail.com)
    */
    public class Main extends Sprite
    {
    [Bindable]
    public var contextView:String = "";

    private var _contextView2:String;

    public function Main():void
    {

    Bind.addBinding(this, "contextView2", this, "contextView");

    setInterval( change, 1000);
    }

    private function change():void
    {
    contextView= Math.random().toString() + "12"
    }

    public function get contextView2():String { return _contextView2; }
    public function set contextView2(value:String):void
    {
    _contextView2 = value;
    trace("setting: "+value);
    }



    }

    }
    ///////////////////

    ReplyDelete
  18. johnlindquist2:31 AM

    I copy/pasted your code into my project and it ran fine...

    Maybe add this to your compiler args so the flex binding classes are included?
    -static-link-runtime-shared-libraries=true

    ReplyDelete
  19. Found the error / bug ? mabe i have a bad setup or something, this line dosen´t work:

    propertyCache[metadata][value] = propertyCache[value].(child("metadata").(@name == metadata).length() > 0);

    but this one does:

    propertyCache[metadata][value] = propertyCache[value].(child("metadata").(@name == "Bindable").length() > 0);

    this is from source code: flight.utils.Type

    Someone knows why is this?

    ReplyDelete
  20. yeah i have that argument added by default by Flash develop.
    The error i had detected is that in my current configuration idk why this line of E4X dosent execute correctly: (@name == metadata) the metadata is a variable, but it dosen´t take the value as it should... but if i replace the variable by the string it works. That code is from the Flight source code so i dont think it´s wrong, there must be something wrong with my configuration?...

    ReplyDelete
  21. Hey John,

    Thanks for this demo, it got me testing different IDEs and libraries.
    What I'd really like to see is a comparison of different IDEs from you point of view.
    I've seen you use Flash Builer, FDT, IntelliJ IDEA...
    Which IDE do YOU prefer at the moment?

    Thanks again!

    ReplyDelete
  22. johnlindquist12:36 AM

    At the moment, I prefer IntelliJ IDEA (mostly because it has the best refactoring tools and I'm on a big refactoring project right now).

    ReplyDelete
  23. Well , the view of the passage is totally correct ,your details is really reasonable and you new balance 996 guy give us valuable informative post, I totally agree the standpoint of upstairs. I often surfing on this forum when I m free and I find there are so much good information we can learn in this forum!

    ReplyDelete
  24. Youdgin9:51 AM

    This was intense, nice handling with IntelliJ IDEA, really showed what a good IDE is capable of.

    ReplyDelete
  25. Smith6:24 AM

    How did you use Flight Bind in pure AS3 project?

    ReplyDelete
  26. Can't compile/run your code, how to set up the project?

    ReplyDelete
  27. Thanks for this post, I really like to watch someone over the shoulder instead of tutorial. Cheers and keep up the good work.

    ReplyDelete
  28. Cool, nice work. Thanks for sharing this.

    ReplyDelete
  29. "Video is not found or access denied" :(

    ReplyDelete
  30. hi john first of all Bravo for your voilà "à la volée"
    I'm trying for about 10 times to do this tuto. But it still not working for me,no errors in compil ,no errors at run time, but the MockModel doesn't populate myList(bit101 List).
    The first command startup does startup ( the view is on Stage ). but later on ... - on mySearchViewMediator when i just want a simple trace statement on myButtonClick handler it doesn' trace anything !!?

    I'm using flash builder 4
    and the libs you mentionned. my little finger told me that i'm propably not using the same.

    The link for downloading the sources is dead so i can't compare.
    Do you or does anyone meet the same issue.
    Olivier

    ReplyDelete
  31. hi john
    Finally it works for me.
    In your vids you don't extends Actor for neither MockModel nor YahooSearch so i do the same ... but it seems to the problem.
    I rewrite with both extending Actor and implements ISomeInterface and YES..
    Thank you
    For leading us ( poor old as1 migrants :) )
    Olivier

    ReplyDelete
  32. fazeaction1:16 PM

    Hi john....the video doesn't work :-/. Can you repair it??. Many thanks

    ReplyDelete
  33. Hello John,I am unable to watch the video can u please fix it . but you have done a good job.

    ReplyDelete