bespin multibackend mockup

Finally I forced myself to spend some time with photo editing software in order to make this mockup. As I mentioned in my recent post I had pet project which was something like bespin is. When has been bespin lunched, I had to kill my pet ;( I have to admit that I really like the ideas bespin is relying on and have to mention that my pet was so far behind :) Anyway there’s one thing which I had in my mind for my project but I can’t see any efforts to get something similar in bespin. I’ve tried to describe idea in bespin mailing list but did not had much success there, guess brief description was not enough to show potential of it.

I personally thing the whole idea of having bespin instances on different web resources on different backends is wrong initially. As a developer I would like to have a single editor with all my setting and plugins in the cloud and I would like to be able to use it at work, for my personal projects, for local files, etc … I want to be able to use it  from any computer I have to work with, no matter if I’m online or not. Thinking of synchronizations of settings, plugins etc.. between servers (hosting bespin) makes me think of the regular editors we’ve got used to. I expect bespin to be different :) To ambitious, I know!! Lets take a look, how do I imagine that:

Dashboard

Above is the picture showing how bespin dashboard can look like. In the first column you might notice groups (Bespin, github, Private, local, work) containing projects. Each of those groups is a representation of a connections with a hosts (hosting bespin backend). Still not clear ? Well lets go through each of those groups and I will try to explain it better with extra details and examples.

  1. Connection – Bespin

    bespin

    That’s a connection with the server https://bespin.mozilla.com/.  Projects listed under this group are the projects which are hosted on https://bespin.mozilla.com/ server. Connection label (Bespin) is displayed in orange color, that means that connection is in online mode.

  2. Connection – github

    editsettings-mock

    That’s a connection with the server https://github.com/bespin/. Projects listed under this group (mozshell@lds.ge, seethrough_js, helma-ng) are hosted on the github server. Here, as in previous example connection label is displayed in orange color, that means that connection is in online mode. Unlike in previous image we can see some fields (label, host, username, password) here. That’s because user have opened settings for this connection. Guess you’re really confused now, let me explain what I mean. Idea is that user is able to create connections with a different backends. Let’s assume that github also hosts bespin. Adding connection to github bespin account should be possible even if user is on the https://bespin.mozilla.com/. Idea is that bespin will know host for each project, so when user will try to open a file from project under connection github, XMLHttpRequest  will be sent not to the https://bespin.mozilla.com/ where page was loaded from, but to the https://github.com/bespin/ (Lets forget about all xhr restrictions for now :). In setting user can change the label for connection, or even host url and login info.

  3. Connection – private
    flakymode-mock

    That’s a connection with the server https://privatehost.local/. Lets suppose it’s a connection with host which is not accessible now. But using gears / html 5 offline storage projects and files under this connection are still available, just like in gmail :). The Violette connection label means that host is in a flaky mode. User can edit files save changes, besically do whatever he is able while being online and all the changes will be synced with a corresponding server when connection will go to online mode.

    tosync-mock

    Violette file titles mean that this files have local changes which will be synced in online mode.

  4. Connection – local
    minimized-mock

    That’s a connection with the server http://localhost:8080/. There is no projects listed under this group, because connection group is folded. As you might noticed in all the rest images there was “-” sign in the right corner of the connection, meaning that you can fold this group. In this case there is “+” sign meaning that connection group is folded and it can be unfolded. Here, as in first 2 examples connection label is displayed in orange color, meaning that connection is in online mode.

  5. Connection – work
    offline-mock

    That’s a connection with server https://intranet/. Connection label is displayed in gray and no projects are listed under. This means that host is unreachable and this connection is in offline mode. In 3rd example host was also unreachable, but connection was in flaky mode. Reason is that in that example host had support for local data caching and synchronizations. In this case host doesn’t supports / restricts local data caching, there for no data is available when host is unreachable.

Hope that now whole picture and the idea is much clearer. Of course there’s a lot’s of valid questions regarding how to implement this, but it’s a totally different topic. There’s already Cross-site HTTP requests in firefox 3.5 and hope more browsers will follow this example. We could use gears or html 5 offline storage for working offline etc. But the idea of this post was to suggest ideas and then start discussion around them.


About this entry