UI + Metadata plugin
UI + Metadata plugin
I've been thinking of how to simplify enabling/creation of simple UI widgets. What about using the class attribute, like the metadata plugin does? Example:
<div class="ui-draggable">Drag me</div>
<div class="ui-droppable:{accept:'ui-draggable'}">Drop on me</div>
<div class="ui-resizable:{minWidth:200,maxHeight:100}">
Resize me
<div class="ui-se-resize"></div>
</div>
The idea being that this would be equivalent to the following:
<div id="myDrag">Drag me</div>
<div id="myDrop">Drop on me</div>
<div id="myResize">
Resize me
<div class="ui-se-resize"></div>
</div>
<script type="text/javascript">
$(function() {
$("#myDrag").draggable();
$("#myDrop").droppable({
accept: 'ui-draggable'
});
$("#myResize").resizable({
minWidth: 200,
minHeight: 100,
handles: { se: '.ui-se-resize' }
});
});
</script>
This would steal the ui- namespace from users. Perhaps reasonable if they're users of jQuery UI, though certainly this could be configurable as well.
Example:
$.ui.prefix("jqui-");
I don't propose this as a replacement for all situations. Just like we keep most css in a style block instead of using inline styles everywhere, most UI code will still be in a script block, but for little guys with a couple (if any) options, I think this might be a nice convenience option to offer.
- Richard