Read my latest article: Announcing RailsDeveloper (posted Wed, 01 Sep 2010 17:01:00 GMT)

Tip: Link to Unimplemented

Posted by Robby Russell Thu, 27 Mar 2008 11:10:00 GMT

52 comments Latest by dsadf@yahoo.com Fri, 27 Aug 2010 02:18:01 GMT

Throughout our design and development process, we’re working around areas of the site that are not yet implemented but we also want to be able to allow our clients to demo their application. In an effort to manage their expectations, we need to be careful about what we link to. If a page/widget isn’t ready to be demo’d yet, we should avoid providing pathways to get interact with or navigate there. However, when we’re implementing HTML/CSS for pages, it’s sometimes makes sense to not hide certain things on the screen.

For example, let’s suppose that you’re working on the primary navigation of an application. You know what the other sections are going to be, but you’ve only implemented a few of them so far. Your HTML/CSS person is working on the design for the navigation and wants to have them be proper links… even to pages that don’t yet exist.

One option, which is quite common, is to provide a link with href="#". This works to some extent, but when people click on things, they naturally expect something to happen in response.

This approach doesn’t mesh well with our team as we don’t really want to field any questions like, “the navigation links are all broken. Nothing happens!”

So, a pattern that we’ve been using for a while is to trigger a javascript alert for every link within an implemented area that is linking to something that isn’t yet implemented.

Let’s take a really basic javascript function like:


# public/javascripts/application.js
function unimplemented() {
  alert("NOTICE\n\nThis feature is not implemented yet. Please check back again soon!");
}

This allows us to do the following:


  <a href="javascript:unimplemented();">link text</a>

When someone clicks the link, they’ll see a typical javascript alert message. This informs our clients/beta testers that we’re paying attention to what works and what doesn’t.

unimplemented
Uploaded with plasq’s Skitch!

Let’s take it a step further and push this into a view helper.


# app/helpers/application_helper.rb
def link_to_unimplemented( link_text, *args )
  link_to_function( link_text, 'unimplemented()', *args)
end

Now, we’re able to use link_to_unimplemented and pass any arguments that you’d pass to the default link_to view helper.


<%= link_to_unimplemented( 'link text', { :class => 'link_class_name' } ) -%>

Now our web designers can go about their work and use this helper as necessary.

An nice benefit for doing this is that we have a pattern that we follow so that we can rely upon to make sure that we don’t forget anything. This is the equivalent of adding @TODO@s throughout our code base.

If we search through app/views for ‘link_to_unimplemented’ we should be able to prevent missing any broken links. In the next screenshot, I’m using grep with colorized matches.

unimplemented 2
Uploaded with plasq’s Skitch!

As you can see, we have something left to implement in that area of the application. :-)

This has been one of those lightweight patterns that we’ve been able to adopt and it’s definitely helped manage the expectations of our clients throughout our development process.

I’d love to hear your thoughts on this. How does your team handle things like this?

Related Posts

Subscribe to my RSS feed Enjoying the content? Be sure to subscribe to my RSS feed.
Comments

Leave a response

  1. Avatar
    grosser Thu, 27 Mar 2008 13:10:51 GMT

    imo a better approach would be to use link_to_unimplemented(NORMAL_LINK_TO_SYNTAX_HERE) so everything can be wired up beforehand.

    When it is finally ready, just replace link_to_unimplemented with link_to and your done.

    PS: some unobstrusive sugar for you New Feature

    $(‘a.unimplemented’).click(function(){alert(‘oh noes!!!’)}) (jquery)
  2. Avatar
    Tim Morgan Thu, 27 Mar 2008 13:18:48 GMT

    Not that I’ve tried this, but your post sparked an idea in my head… one could use named routes to go ahead and link to the appropriate place, but in the routes.rb file, point all the unimplemented things to the same page, e.g.

      map.with_options :controller => 'feature' do |m|
        m.feature 'feature/view', :action => 'unimplemented'
      end
    

    In the application controller, add a method called unimplemented with a friendly view (so it’s available in all controllers).

    Now, you have one file (routes.rb) that lists all the unimplemented features, and you can change the action appropriately as features are implemented.

    You can link to features with the named routes without having to worry about going back and fixing all the links.

      <%= link_to 'Do Something', feature_path %>
    

    Of course, this doesn’t work so smoothly with fancy-pants REST routes and the like (which I don’t use).

    Thoughts?

  3. Avatar
    Robby Russell Thu, 27 Mar 2008 13:19:04 GMT Recommend me on Working with Rails

    @grosser: yeah, that’s an interesting idea.

    The helper would probably need to append a class to it that wouldn’t affect any CSS class definitions made.

  4. Avatar
    Greg Thu, 27 Mar 2008 13:28:52 GMT

    Intersting idea. I like this approach much better than the old familiar anchor tags. Thanks for sharing Robby.

  5. Avatar
    Robby Russell Thu, 27 Mar 2008 13:51:52 GMT Recommend me on Working with Rails

    @grosser: I thought more about your idea and don’t think we could safely rely on that. If we haven’t implemented an area (yet)... your approach would require us to have routes pre-determined (and working)... or we’d need to hardcode paths, which doesn’t do us any favors.

    I like the unobtrusive approach, but given that we’re linking to thinks that don’t exist or aren’t working, I’d prefer there to be less heavy lifting. Also, it allows our web designers to do their work before the developers go through and making things work. They don’t need to be bogged down by defining routes (especially if they don’t exist yet).

    Still an interesting idea for when you do have that stuff figured out. :-)

  6. Avatar
    Raul Murciano Thu, 27 Mar 2008 13:51:59 GMT

    I’ve been using my similar to_do_link helper on every project I’ve worked, so I suppose that’s a kind of natural pattern. As you said it’s tremendously useful, mainly in iterative development where users can explore applications under development.

  7. Avatar
    Nicolás Sanguinetti Thu, 27 Mar 2008 14:04:27 GMT

    What I do is usually put this in my routes:

    map.not_implemented :controller => "not/implemented"

    And then grep for not_implemented_path. Also, you could comment that line and see which view specs fail, too.

  8. Avatar
    Jaime Iniesta Thu, 27 Mar 2008 15:01:42 GMT

    Nice tip. I always do this by hand but a helper is… helpful :) And I guess it can be used with image links as well, using image_tag instead of the text.

  9. Avatar
    jerome Thu, 27 Mar 2008 17:15:58 GMT

    I really don’t get the not_implemented_path thing… What Bad^H ^H ^HRobby is focusing on deals with user experience during the development. This is the goal, and his javascript thing is a pretty good idea.

    Unobstrusive js is also unnecessary, unless Robby wants to keep features not implemented for months.

    Last but not least, if you really want to redirect to some stupid and unnecessary controller (IMHO), add a HTTP 204 status then with :status => 204. (Naaaaa just don’t do it!)

  10. Avatar
    Iain Thu, 27 Mar 2008 19:23:45 GMT

    The other thing to do before final deploy would be to rename the helper method (or make it throw an exception?) and make sure all tests pass; if any calls to it remain, you’re not done!

  11. Avatar
    Jason Seifer Fri, 28 Mar 2008 02:05:26 GMT

    Seems like this would be nice with a modal window/facebox implementation.

  12. Avatar
    Matt Krom Tue, 01 Apr 2008 20:26:15 GMT

    Brilliant; thank you. After reading your post, I did the following, so that link_to works the same as usual, and the unimpl_url looks like any other URL helper. Less to change when you have the real path ready.

    == in the view ==
        <%= link_to 'compare', unimpl_url %>
    
    == application_helper.rb ==
      def unimpl_url
        "javascript: alert('This feature is not implemented yet...'); return false;" 
      end 
    
    

    Thanks again, Matt

  13. Avatar
    Matt Krom Tue, 01 Apr 2008 20:26:26 GMT

    Brilliant; thank you. After reading your post, I did the following, so that link_to works the same as usual, and the unimpl_url looks like any other URL helper. Less to change when you have the real path ready.

    == in the view ==
        <%= link_to 'compare', unimpl_url %>
    
    == application_helper.rb ==
      def unimpl_url
        "javascript: alert('This feature is not implemented yet...'); return false;" 
      end 
    
    

    Thanks again, Matt

  14. Avatar
    ghd Wed, 10 Mar 2010 09:08:41 GMT
  15. Avatar
    iPhone clone Thu, 13 May 2010 03:53:20 GMT

    Welcome to check on our website!Any needs or any orther questions, welcome to contact us at any time ! Shopping online offers lots of benefits that you won’t find shopping in a store or by mail. The Internet is always open — seven days a week, 24 hours a day — and bargainscan be numerous online.With a click of a mouse, you can buy an airline ticket, book a hotel, send flowers to a friend .

  16. Avatar
    laptop battery manufacturer Thu, 13 May 2010 06:29:26 GMT

    let’s suppose that you’re working on the primary navigation of an application. You know what the other sections are going to be, but you’ve only implemented a few of them so far.

  17. Avatar
    mac makeup Wed, 26 May 2010 17:59:15 GMT

    you have one file (routes.rb) that lists all the unimplemented features, and you can change the action appropriately as features are implemented

  18. Avatar
    ugg classic mini Sat, 29 May 2010 03:41:54 GMT

    ugg classic mini

  19. Avatar
    supra tk society black white Sat, 29 May 2010 03:42:18 GMT

    supra tk society black white

  20. Avatar
    vibram five fingers Tue, 01 Jun 2010 06:11:38 GMT

    Vibram Five Fingers fragile and flexible shape, they follow your feet, are installed in every toes and work as the second skin to provide protection, enhance sensory awareness.This five fingers shoes is the core of the patent Vibram exclusive platform, thin and lightweight, it with your feet, and movement of terrain let you in your feet, and shall protect the surface. Soft and elastic half part of shape, polyamide follow that your feet platform. Vibram shoes are adopting a shield Five Fingers fresh antibacterial structure, keep the washing machine.This is the best of today’s most fashionable and useful shoes, welcome to actively purchase.

  21. Avatar
    ugg boot Tue, 01 Jun 2010 07:06:26 GMT
    jordan 6 rings purple jordan 6 rings purple ugg classic cardy short ugg classic cardy short mbt chapa gtx ebony mbt chapa gtx ebony
  22. Avatar
    mbt chapa gtx Tue, 01 Jun 2010 07:06:50 GMT

    ugg classic short black boots ugg classic short black boots ugg lo pro autton ugg lo pro autton mbt chapa caviar mbt chapa caviar

  23. Avatar
    ugg boot Tue, 01 Jun 2010 07:09:19 GMT

    ugg Classic Short Paisley grey ugg Classic Short Paisley grey mat chapa gtx mat chapa gtx mbt chapa heather mbt chapa heather

  24. Avatar
    mbt chapa gtx Tue, 01 Jun 2010 07:09:42 GMT
    air jordan 13 white air jordan 13 white mbt chapa covert mbt chapa covert air jordan 13 alue air jordan 13 alue
  25. Avatar
    air jordan fusion 3 Wed, 02 Jun 2010 06:31:08 GMT

    YTRY TR Y

  26. Avatar
    2009 Collection Wed, 02 Jun 2010 06:31:27 GMT

    TERT ER TER T

  27. Avatar
    2009 Collection Wed, 02 Jun 2010 06:31:27 GMT

    TERT ER TER T

  28. Avatar
    2010 germany 16 lahm Wed, 02 Jun 2010 06:31:42 GMT

    TRY TRY T

  29. Avatar
    Nike Zoom Soldier IV Fri, 04 Jun 2010 01:06:07 GMT

    try try rt yrt

  30. Avatar
    supra skytop black gold Fri, 04 Jun 2010 01:06:17 GMT

    ertre ert

  31. Avatar
    bastian schweinsteiger world cup jersey Fri, 11 Jun 2010 03:43:53 GMT

    rty er

  32. Avatar
    jordans shoes Fri, 11 Jun 2010 03:44:03 GMT

    tr

  33. Avatar
    designer handbags reviews Fri, 11 Jun 2010 11:56:42 GMT

    I’ve been using my similar to_do_link helper on every project I’ve worked, so I suppose that’s a kind of natural pattern. As you said it’s tremendously useful, mainly in iterative development where users can explore applications under development.

  34. Avatar
    jordan six rings Thu, 17 Jun 2010 06:30:52 GMT

    ytry rt

  35. Avatar
    supra muska skytop navy white Thu, 17 Jun 2010 06:31:25 GMT
  36. Avatar
    rrrrrrrrrrrrrrrrrr Mon, 28 Jun 2010 03:15:31 GMT
  37. Avatar
    air jordan 11 Wed, 30 Jun 2010 09:17:32 GMT

    Demonstrate a unique new conceptjordan shoesAwA368

  38. Avatar
    Discount Louis Vuitton Mon, 19 Jul 2010 15:53:46 GMT

    Louis Vuitton Mini Pochette Accessoires N58009 Louis Vuitton Mini Pochette Accessoires Louis Vuitton EVA CLUTCH N55213 Louis Vuitton EVA CLUTCH Louis Vuitton Mini Pochett N58011 Louis Vuitton Mini Pochett Louis Vuitton Brooklyn PM N51210 Louis Vuitton Brooklyn Louis Vuitton Brooklyn MM N51211 Louis Vuitton Brooklyn Louis Vuitton Brooklyn GM N51212 Louis Vuitton Brooklyn Louis Vuitton Bastille N45258 Louis Vuitton Bastille Louis Vuitton Spencer Bag N58021 Louis Vuitton Spencer Bag Louis Vuitton Naviglio N45255 Louis Vuitton Naviglio Louis Vuitton Beaubourg Damier N52006 Louis Vuitton Beaubourg Damier Louis Vuitton Broadway N42270 Louis Vuitton Broadway Louis Vuitton Pochette Bosphore N51111 Louis Vuitton Pochette Bosphore Louis Vuitton Laptop Sleeve 13 N58022 Louis Vuitton Laptop Sleeve 13 Louis Vuitton Laptop Sleeve 15 N58023 Louis Vuitton Laptop Sleeve 15 Louis Vuitton Olav PM N41442 Louis Vuitton Olav Louis Vuitton Geronimos N51994 Louis Vuitton Geronimos Louis Vuitton Macao Clutch N61739 Louis Vuitton Macao Clutch Louis Vuitton Pochette Saint Louis N51993 Louis Vuitton Pochette Saint Louis

  39. Avatar
    designerhandbags Fri, 23 Jul 2010 09:31:57 GMT

    it is very nice,useful for me,thank you for your sharing.

  40. Avatar
    kids Sun, 25 Jul 2010 16:16:39 GMT

    really really really nice post.

  41. Avatar
    investigator Sun, 25 Jul 2010 16:17:25 GMT

    yess..very nice post.

  42. Avatar
    ugg boots clearance Mon, 26 Jul 2010 09:47:14 GMT

    Ugg sheepskin boots bring you warm, a lot of people often sit in the office most afraid of winter comes, because winter day to sit in the office, sat motionless naturally special cold feet. Words can literally ravaged boots, very soft, for joint pants. Ugg boots clearance to introduce to this, we welcome the presence of our online shop.

  43. Avatar
    free music download mp3 Mon, 26 Jul 2010 12:27:41 GMT

    that tip is usefull thanks

  44. Avatar
    vibram five fingers Mon, 02 Aug 2010 06:49:06 GMT
  45. Avatar
    school bag manufacturer Fri, 06 Aug 2010 03:18:37 GMT

    ication. In an effort to manage their expectations, we need to be careful a

  46. Avatar
    http://www.bestretroshoes.com Wed, 11 Aug 2010 08:06:33 GMT
    Retro air jordan 12,Retro air jordan 12
    jordans 19,jordans 19
    Air Jordan 10 Retro Shoes,Air Jordan 10 Retro Shoes
    Retro Air Jordan 7,Retro Air Jordan 7
    Retro Air Jordan 8,Retro Air Jordan 8
    Retro Air Jordan 9,Retro Air Jordan 9
    Retro Air Jordan 10,Retro Air Jordan 10
    Air Jordan Retro 11,Air Jordan Retro 11
    Air Jordan Retro 12,Air Jordan Retro 12
    Air Jordan 11 Retro Shoes,Air Jordan 11 Retro Shoes
  47. Avatar
    Gucci Thu, 12 Aug 2010 01:38:25 GMT

    Louis Vuitton thousandslouis vuitton designer sales such as LV handbagsGoLouisVuittonlv bags thousands offer the

  48. Avatar
    Nike Shox Thu, 12 Aug 2010 07:27:10 GMT

    really really really nice post.

  49. Avatar
    handbagsworld Tue, 24 Aug 2010 08:58:02 GMT

    One replica franck muller watch site does have the watch listed as “Coming Soon”. limited replica watches edition 75. the design of the watch replica watches into the fashion details, is a mechanical automatic Jaeger-LeCoultre Calibre 956. a touch screen tickles the curiosity and promotes an interactive fake juicy couture handbags relationship aaa replica handbags between the brand and its customers. super energy-saving mode. chronograph and tachometerCase 316L steel and carbon fibreRotating bezelScratch-resistant sapphire crystal Engraved back with interchangeable medals Water-resistant to 100 mLimited edition of 9002Dial Black carbon 30-minute. it can display the month and time indications swatch watches of the equation. If you love sea diving or a money scheme must-watch Cikuan professional superior fake bedat performance. Launched in 1953 to celebrate Tissot’s 100th anniversary. Omega and radar the wholesaler. THE ARCTIC NAVIGATION SYSTEM – Villemont’s Tribute to Roald Amundsen. Labor Shidi Daytona create Antiquorum auction records. The grain of the leather is left untouched on sell vacheron constantin watches the underside of the replica watches band and is only a lange sohne replica watches marked jaeger lecoultre watches by the omega replica watches U-Boat logo that is burnt into it, To ensure the reading is clear. gucci watches smooth flow smoothly, a small blue balloon on the stainless steel table transferred from the 19, Earl White K diamond earrings (right): leaf replica versace handbags shape, Technical SpecificationsMovementBreitling Caliber 78. Shui replica handbags Table Group.

  50. Avatar
    tiantianx79@gmail.comtiantianx79@gmail.com Wed, 25 Aug 2010 03:15:46 GMT

    Are you always vexed about herve leger wearing what kind of dress at a banquet? Herve Leger bandage dress online store eliminates Christian Louboutin your worries. Ladies who is beautiful and noble may choose Herve Leger bandage dress. The herve leger bandage dress dress highlights your perfect feminine body curve. If you wear this dress, it will send out your inherent Hermes Handbag glamour. It is specially designed for you and meets your noble Moncler taste. Wherever you go, you will be the focus. If you haven’t a suitable dress to attend a banquet and want to buy herve leger dresses one now, Herve Leger bandage dress online store is your best choice.

  51. Avatar
    dsadf@yahoo.com Fri, 27 Aug 2010 02:18:01 GMT

Share your thoughts... (really...I want to hear them)

Comments