Over the summer I worked on a web based client for the XMMS2 project as a part of the Google Summer of Code. I used TurboGears for this project, and so much of my development was aided by MochiKit. TurboX2 [ http://xmms2.xmms.org/~alex/turbox2/ ] contains about 1700 lines of Javascript, all aided by MochiKit functions. This project involved developing a system to update the display rapidly (at least every second) to reflect changes in playback information and volume, as well as ways to update the playlist when it has been changed. XMMS2 is a client/server application and so other clients can act on the various components, and thus it was necessary for TurboX2 to be able to handle these various signals, but bridged into javascript using JSON.
I developed a number of components that are fairly generic and easily used in other projects. The most important one for dealing with the various issues in the way in which data was gathered and relayed to the web browser was a suitable eventloop. I have developed some gtk applications before so I had a little experience with the glib mainloop, and thus it was a source of inspiration for turbox2_event. One can view turbox2_event here: http://git.xmms.se/?p=turbox2.git;a=blob;h=ca59776a367156a55ac1b12c0b8d4e84f36bd347;hb=a081d20814aa0b28735d1991e6115941bf844d0a;f=turbox2/static/js/turbox2_event.js A developer would register a source, which would either be a function that returned results, or a JSON source which would poll an address periodically for results, and then register Handlers for that source, which would receive the results of that source every time the source returned results. The event loop is quite resilient and was able to recover restarts of turbogears with ease during development thanks to the use of try {} catch {} blocks. The other components which I think might be of interested are a lazy loading list implementation. This lazy list was designed to take a div filled with entries, and allow for them to be resolved as the list was scrolled based on a resolve method supplied when initializing the lazy loader. I found that performance was not exactly as amazing as I had hoped, but I think the design is interesting enough that it should be given some more work. It can be found at: http://git.xmms.se/?p=turbox2.git;a=blob;h=af7d1d05de551ef3fc44fa9ba7233125b8457c63;hb=a081d20814aa0b28735d1991e6115941bf844d0a;f=turbox2/static/js/turbox2_lazylist.js The last component of interest is a widget component. It is a slider, but can also be used as an insensitive progress bar (It was actually adapted from a progress bar in another project of mine). It supports vertical and horizontal orientation, and allows for plugging in custom handlers for the changes easily. http://git.xmms.se/?p=turbox2.git;a=blob;h=0fcd2608cd39e8563b3e5a6fafa9a8b610fa10d2;hb=a081d20814aa0b28735d1991e6115941bf844d0a;f=turbox2/static/js/turbox2_slider.js Examples of usage of these three components can be found in various places in the code: - The event loop is most heavily used by the status system, and the method that sets up the status source and handlers can be found here: http://git.xmms.se/?p=turbox2.git;a=blob;h=a415f6dbc5a176cb428a77a43835e98592957334;hb=a081d20814aa0b28735d1991e6115941bf844d0a;f=turbox2/static/js/turbox2_status.js#_setupEvents - The lazy loader is used by the playlist, The initialization of the lazy loader can be found in the main initalization method here: http://git.xmms.se/?p=turbox2.git;a=blob;h=fa177f0f9c6b0f08095e97d4bb6327be6b0a77f9;hb=a081d20814aa0b28735d1991e6115941bf844d0a;f=turbox2/static/js/turbox2_common.js#init_page and the helper methods used by the lazy list can be found here: http://git.xmms.se/?p=turbox2.git;a=blob;h=fcff13f2aee659f1107a73b45ee5d8c0bba2507e;hb=a081d20814aa0b28735d1991e6115941bf844d0a;f=turbox2/static/js/turbox2_playlist.js#l_97 - The slider is used for the seekbar and the volume control. The volume control happens to be a nicely enclosed example of usage so it will be given: http://git.xmms.se/?p=turbox2.git;a=blob;h=9ea53cdf1493bebb1052da358bd0e7ada337170c;hb=a081d20814aa0b28735d1991e6115941bf844d0a;f=turbox2/static/js/turbox2_volume.js I hope one or all of these components will be helpful or of interest to anyone working on a project needing these types of components. --~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "MochiKit" group. To post to this group, send email to [email protected] To unsubscribe from this group, send email to [EMAIL PROTECTED] For more options, visit this group at http://groups.google.com/group/mochikit -~----------~----~----~----~------~----~------~--~---
