The Bamboo Blog

Our thoughts on agile development and web technology

  1. Max Williams

    Adding awesome mini views to your web apps


    In a couple of our internal apps, we use a UI design paradigm that we affectionately call an “awesome bar”. I really like these, and I think they make many types of applications much more useful and intuitive. While they have generally been hard to create in web apps, the introduction of canvas and inline SVG has made them a synch to put together. I see a lot of great examples of canvas and SVG that are absolutely mind-bending to look at, but very few examples which enhance the traditional applications and websites we use on a day-to-day basis.

    I won’t claim to have invented these, but I was reminded of how cool they are recently when I read this post: I will give a brief explanation of what these are with some examples, why I think they rock, and some sample code.

    Continue reading

  2. Pablo Brasero

    HTML5-powered Ajax file uploads


    This information is out of date. See the followup article on FormData.
    Added the Firefox! section


    File uploads have traditionally had very bad usability on the web. The standard solution was uploading files as part of a form, leaving the user to just wait until the process was done. We could offer barely any feedback of what was going on.

    Several options appeared to make the process more bearable for the user. Some alternatives were client-based, such as using some Flash-powered element like SWFUpload. Other alternatives laid more on the side of the server, like leveraging Nginx's mod_uploadprogress with a pinch of Ajax. However, there was still the question of why there was no solution that avoided proprietary technology, required minimal hassle OR was free of far-fetched hacks.

    Continue reading

  3. Makoto Inoue

    Living on the edge of the WebSocket protocol


    • Introduction
    • Getting Info
    • So What’s Changed?
    • What about version incompatibility?
    • Summary


    Hello. It’s been a while since I last blogged about WebSocket. It’s been exciting that many new frameworks and services are out including our own Pusher.

    Having said that, we have to be aware that the protocol is still actively being changed.

    Just a few weeks ago, there was an important announcement at Chromium blog.

    Continue reading

  4. Gwyn Morfey

    Client Patterns: Going Beyond the Stealthholder


    Patterns aren’t just for software design. We can find generally reusable solutions to common problems in handling clients.

    Taking simple actions early can avoid serious problems with the client relationship later on. After seeing this work a couple of times, I ran a workshop at XP2010 where we developed detection heuristics and early interventions for several classes of difficult* clients.

    The Stealthholder

    Also featured in our ‘Sword and Other Tales’ presentation, the Stealthholder is a stealthy stakeholder who appears from nowhere at the end of a project and turns a success into a failure. This might just because an entire area of critical requirements was missed, but can also happen when the continuous process of redesign throughout the project doesn’t reach them, so they get a sudden shock at the final demo. War stories for this one were surprisingly common; my personal experience is with a high-ranking person who appears only at the beginning and end of a project, but others had encountered variants where the stealthholder is always visible but their apparent position in the hierarchy misstates their real power, or where the person is visible for the very first time at the end of the project.

    Continue reading

  5. Oliver Nightingale

    Integrating Pusher Into a Complex App in One Day


    Not to blow our own trumpet, but there is currently a lot of buzz around our realtime web service called Pusher. However, since we originally made this app for our own use, I thought I’d show how it fits into a real app. I recently set out to integrate Pusher with TrueStory, our backlog management app. Not being part of the Pusher team, I was pleasantly surprised at not only how simple it was, but also how quickly I could add advanced real time behaviour to an existing app.

    Continue reading

  6. Bartosz Blimke

    Automatic Reconnection of MySQL Connections in Active Record


    MySQL per default kills inactive connections after 8 hours. This timeout can be changed in my.cnf by setting wait_timeout value.
    If you use Active Record and your program tries to use persistent connection after 8 hours of inactivity, you are likely to see the following error:

    Mysql::Error: MySQL server has gone away ...

    This is not a problem if Active Record is used within Rails controller actions. Rails verifies and reconnects inactive connections before invoking an action.
    If you use Active Record outside Rails or at least outside controller actions you have to verify connections on your own before executing a database statement. This can be done with the following code:

    Continue reading

  7. Bartosz Blimke

    Copying Code from Textmate to Keynote with Style


    A popular way of inserting code samples into Keynote presentations
    is to take a screenshot in Textmate and then insert the image inside a slide. The advantage over normal copy&paste is that the code looks exactly the same as in TextMate, including font style and highlighting.

    This technique has also disadvantages. Code can’t be modified in Keynote so to do any last minute fixes, you have to edit a code in Textmate and repeat the whole screenshot procedure again.
    Another problem is resizing. Since it’s not a vector image, text loses quality when it’s resized.

    There is a better way! I’ve been using Copy with Style command, which I took from this blog post. It copies text selection as RTF so when the code is pasted into Keynote, it looks exactly the same as it looked in TextMate, including font style, size and colors. Code can be then modified in Keynote, while the style is preserved.

    Continue reading

  8. Max Williams

    The JS model layer


    Adding a Model layer to your Javascript

    To build the best possible JS RIA, we need to build a data or model layer. This needs to be handled in a way which goes beyond simply embedding the data in the HTML, and also beyond relying on simple collections of hashes and arrays.

    A web server needs to send data to the client, as part of an initial “platform” which the client can build up the UI and behaviour from. A client therefore holds onto and manages this snapshot of “state” which it has received from the server.

    The lifecycle of these data objects need to be managed on the client end, persisting the state (when necessary) as part of the process. A “state manager” needs to work with collections of objects, which can be manipulated locally and bound to the UI.

    Continue reading