I'm thinking about how I want to handle the lightweight templates that
we use in our components. I'm not speaking here about any heavy-weight
data-driven templating such as what is being done with sData in Sakai.
I think that there is place for that. But this is for the little
pieces of DOM that we need to instantiate as we do stuff.
Such as in the the Uploader where we build out a table row for each
file in the file queue:
<tr id="SWFUpload_0_0">
<td scope="row" class="fileName">Photo 1.jpg</td>
<td class="fileSize">44 KB</td>
<td class="fileStatus">Ready to Upload</td>
<td class="fileRemove"><button class="removeFileBtn" type="button"/
></td>
</tr>
Which we're currently building dynamically as a string in the
createFileQueuedHandler function:
var queue_row = $('<tr id="' + file.id + '">' +
'<td class="fileName" scope="row">' +
file.name +
'</td>' +
'<td class="fileSize">' +
fluid.utils.filesizeStr(file.size) +
'</td>' +
'<td class="fileStatus">Ready to Upload</td>' +
'<td class="fileRemove"><button type="button" class="removeFileBtn" /
></td></tr>');
Obviously this needs to be pulled out of the main code into something
easy to customize and replace.
But should it be carried around in the DOM or should it be somewhere
in the JS code. Both are equally easy to code and maintain.
JS code advantage: Everything is in one place. No extra HTML on the
page, and what will be on the page will only be instantiated if needed.
HTML/DOM advantage: Most of the time we need to have HTML on the page
anyway. Designers can easily see and manipulate the template. The
clone() function. [OK, if you don't know jQuery, that might be lost on
you]
Forgive me for thinking all this out on list.
I think I'm sold on putting the in the HTML. Should we wrap all our
client-side templates in some agreed upon class name?
<div class="fluid-client-side-templates">
<div id="fluid-uploader-row-tmplt">
<table>
<tr class="upload-row">...</tr>
</table>
</div>
</div>
- Eli
. . . . . . . . . . . . . . . . . .
.
Eli Cochran
user interaction developer
ETS, UC Berkeley
_______________________________________________
fluid-work mailing list
[email protected]
http://fluidproject.org/mailman/listinfo/fluid-work
