1. #1
    Sencha User
    Join Date
    Sep 2007
    Posts
    19
    Vote Rating
    0
    guy_davis is on a distinguished road

      0  

    Talking Popular Baby Names app

    Popular Baby Names app


    Hi all,

    Since my wife and I are expecting our first child in April, I was worried about choosing a baby name. So, I created a Google Maps mashup with popular baby names statistics from around the world to help in my search.

    http://www.babynamemap.com

    I went looking for a pop-up dialog and came across ExtJS. After using the basic dialog, I quickly hooked up the data grid for showing name stats. The tabs and AJAX update manager provided a great way of showing info on a particular name. The Aero theme also fit in great with my site.

    It was a breeze hooking all this up. I used Ruby on Rails on the back-end with Prototype underneath ExtJS. The whole thing took about a month part-time (evenings and weekends). I'm a Java Swing developer by day so my web skills are pretty rusty and yet ExtJS was easy even for me to use!

    Thanks a bunch to the ExtJS team for putting together a great library and toolkit with excellent documentation. I'm looking forward to using more of ExtJS in the near future. Keep up the great work!

    Guy Davis
    Calgary, Canada

  2. #2
    Ext User
    Join Date
    Apr 2007
    Posts
    50
    Vote Rating
    0
    bitdifferent is on a distinguished road

      0  

    Default


    That's really impressive, well done! Looking forward to seeing some UK data in there.

    Is the tabbed popup from a map pin part of Google Maps's API? I haven't seen one quite like that before.

    Matt S

  3. #3
    Sencha User steffenk's Avatar
    Join Date
    Jul 2007
    Location
    Haan, Germany
    Posts
    2,664
    Vote Rating
    7
    steffenk has a spectacular aura about steffenk has a spectacular aura about steffenk has a spectacular aura about

      0  

    Default


    very good! a big hand!

    where did you got all the data from?

    ah - one more: can you give me a hint how you realized the rating? i have to do this as well.
    vg Steffen
    --------------------------------------
    Release Manager of TYPO3 4.5

  4. #4
    Sencha User
    Join Date
    Sep 2007
    Posts
    19
    Vote Rating
    0
    guy_davis is on a distinguished road

      0  

    Default


    @bitdifferent: Thanks! Google Maps provides a tabbed info window (GInfoWindowTab). Most developers don't need it, but it worked great for showing popular names for both girls and boys. This week I plan on adding a bunch more popular name statistics, including from the UK.

    @steffenk: Thanks! The public domain data comes from various government Vital Statistics offices. All I'm doing is aggregating it for easy display on a map. The 5-star rating feature is a mix of the Rails acts_as_rated plugin, Prototype Ajax.Request calls, and a CSS/Image rater from Komondo. I hope to blog in more detail about how things fit together in the next month or so.

  5. #5
    Sencha - Community Support Team JeffHowden's Avatar
    Join Date
    Mar 2007
    Location
    Forest Grove, OR
    Posts
    1,038
    Vote Rating
    1
    JeffHowden is on a distinguished road

      0  

    Default


    Overall an awesome public-facing Ext app.

    Just a few suggestions to hopefully make it even better.
    • It'd be nice to have a horizontal slider like Google's vertical zoom in/out slider. The custom vertical one would be for selecting the year of data to represent in the dialogs.
    • Attach your dialog creation functionality to the rowclick event of the grid. Right now you have to click the actual name, which isn't intuitive since the entire row highlights when you mouse over implying that clicking anywhere in the row does something.
    • Check out how to alter the baseParams for a grid to send in searching and filtering paramaters. This will make it so clicking the letters above the grid (wouldn't they look awesome as buttons in a toolbar above?) will load new data without a reload of the page.
    Jeff Howden
    Ext JS - Support Team Volunteer
    jeff@extjs.com

    Any and all code samples that are authored by me and posted on the Ext forums or website are hereby released into the public domain and I release anyone or entity of liability by using said code samples unless explicitly stated otherwise.

    Opinions are mine and not necessarily endorsed by Ext, LLC. Please do not contact me directly for assistance unless requested by me.

  6. #6
    Sencha User
    Join Date
    Sep 2007
    Posts
    19
    Vote Rating
    0
    guy_davis is on a distinguished road

      0  

    Default


    Great suggestions Jeff. I'll give them a try soon. I especially like the "time-based" slider idea. That would be very slick.

  7. #7
    Sencha User steffenk's Avatar
    Join Date
    Jul 2007
    Location
    Haan, Germany
    Posts
    2,664
    Vote Rating
    7
    steffenk has a spectacular aura about steffenk has a spectacular aura about steffenk has a spectacular aura about

      0  

    Default


    oh i love this forum and the way of presenting and discussion

    btw the rating stuff.It would be a nice idea to base it on ext. With the Komondo basic it should be possible, i will give it a try. It's great that you will offer some techniques on your blog, maybe also here ?
    vg Steffen
    --------------------------------------
    Release Manager of TYPO3 4.5

  8. #8
    Ext JS Premium Member dogomatic's Avatar
    Join Date
    Aug 2007
    Location
    Canada
    Posts
    111
    Vote Rating
    1
    dogomatic is on a distinguished road

      0  

    Default


    Yea, totally awesome . Hopefully projects like yours will inspire me to get out and do some fun Ext stuff outside of work that I can share.

    My one comment about the name grid is that I found the action and view icons/buttons a bit awkward. I had to hover each one to figure out what it is.

    I have the same problem of how to present a bunch of actions that can be applied to a row selection, either 'only one' or 'one or more' rows. The way I've got it right now, they are a drop down in the toolbar with the menu items having both icons and text. I'm not completely satisfied with this.

    Another option I've been thinking about is to having a button in the row that shows a pop menu. This would keep the user in the row context, since they don't have to jump up to the toolbar to do stuff.

    Thoughts?

  9. #9
    Sencha User
    Join Date
    Sep 2007
    Posts
    19
    Vote Rating
    0
    guy_davis is on a distinguished road

      0  

    Talking Baby Name Map upgraded to ExtJS 2!

    Baby Name Map upgraded to ExtJS 2!


    Hi everyone,

    I've updated the Baby Name Map to ExtJS 2 and added a new navigation tree of countries and regions for quickly moving around the map. I'm definitely liking the new, more consistent API for ExtJS 2.

    The data grid is a great way to navigate around large datasets. Unfortunately, Google's crawler doesn't think too highly of Javascript-driven data tables. I'm still trying to figure out a decent SEO strategy without making the site look like it's the mid-90s again.

    I wanted to send a big thank you to the ExtJS development team as well as all the helpful people on these forums.

    Guy

  10. #10
    Ext User
    Join Date
    Dec 2007
    Location
    Maida Vale
    Posts
    96
    Vote Rating
    0
    dearsina is on a distinguished road

      0  

    Default


    Just a quick note, IE6 is a favourite in corporate environments (mine included), and I understand ExtJS 2.0 will work with IE6, so it might be worth trying to include them too. Particularly considering that most, if not all corporate users are unable to change their browser of choice.