Hey all, I'm working on a simplistic "widget framework" to better standardize how widgets work (if only for those that I'm writing) - I'd like to share it to hopefully generate some ideas with it before I get too involved
The goals behind it (thus far) are to: * wrap widgets in such a way that you can treat them more or less as a single DOM Node via jQuery * as part of the above point, widgets should be able to semantically redefine various jQuery methods - for example, if you have a dropdown menu widget, and call show() on it, it will hide any currently displayed dropdown widgets in the same call * have a simple interface to do all this with, and easily package widgets I have a working example of this (tested only in Safari at the moment), in very early stages: http://safis-project.net/Designer/tests/canvas.html Code of note: http://safis-project.net/Designer/javascripts/canvas.js (canvas widget) http://safis-project.net/Designer/javascripts/table.js (table widget) http://safis-project.net/Contrib/jQuery/jquery.widget.js (the actual code that drives this) How it works: you register a widget type with the widget framework; currently, each widget can define the following: type: this is the unique "name" of the widget (required) detector: given a DOM node, this determines whether the node is an instance of that widget type. By default it looks for a class name that is the same as the widget type name. This allows for a seamless use of find() and jQuery(). For example, if I define a "dropdown" type widget, where each widget is defined as <div class="dropdown"... any jQuery that returns that top level div of the widget would treat it as a widget (e.g. $("div.dropdown") would return a jQuery.Widget rather than a normal jQuery object) methods: each method defined here can be called on any instance of the widget. For example: $("div.dropdown").addEntry("A New Entry") find: this function will search the entire document for all instances of the widget, primarily used by: initialize: this is called every time an instance of the widget is created (or at page load for "in-html" widgets) - for registering events, etc. One major change that this brings about is the concept of "conditional" methods for jQuery objects. Using the dropdown example - if I run the query $("div") and it returns both widgets and non- widgets - any jquery function you run should still work as semantics would dictate. For example, $("div").text("new text") would rename every div as expected - but, any widget that defines its own version of text() would use the custom version instead Also, one strange result of this (for performance reasons) is that if you select a set of all non-widget nodes, a normal jQuery object will be returned, and any widget-related functions will /not/ be avaliable to the object. For example, the dropdown widget defines addEntry() - calling $("h1").addEntry() would result in a runtime (Type) error, as the function would not be defined on a non-widget result. Still in the works: I would like to extend the jQuery find syntax to allow for treating widgets as nodes. perhaps something like $("~dropdown") I also need to work an easy method for calling "super" versions of any function (inside the overridden method)
