Skip to content

Instantly share code, notes, and snippets.

@lsmith
lsmith / a.js
Created May 22, 2011 13:57
Using YUI 3's groups config to support fetching non-YUI module js files ala requireJS pathing or explicit url
We couldn’t find that file to show.
@lsmith
lsmith / gist:1091534
Created July 19, 2011 07:07
A POC inline cell editor class extension/view for YUI 3 DataTable
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Test Page</title>
<style>
.yui3-skin-sam .yui3-datatable .yui3-datatable-data .yui3-datatable-editing {
position: relative;
padding: 0;
}
@lsmith
lsmith / gist:1097943
Created July 21, 2011 19:07
Make Y.DataTable instantiable, and an extension point for feature extension classes
// Right now, Y.DataTable is only a namespace. But I want to be able to say new Y.DataTable({...});
// We can do it. We have the technology.
// Step 1. Capture all the properties of the Y.DataTable namespace
// Y.merge creates a shallow copy of an object, and since Y.DataTable is just a namespace object,
// this works like a champ. You could now say new Stuff.Base({...}) to create a DataTable.Base
// instance.
var Stuff = Y.merge(Y.DataTable);
// Step 2. Replace the Y.DataTable namespace with a working DataTable.Base subclass
// For Y.Foo
// Class extensions that will be used in the base class
function ExtA() {}
...
Y.namespace('Foo').ExtA = ExtA;
// Base Class definition
function FooBase() {}
...

DataTable design overview

These are my early thoughts on how to structure DataTable in 3.5.0. Feedback is welcome in the comments.

Instantiable classes out of the box

new Y.DataTable({...});
new Y.DataTable.Base({...});
@lsmith
lsmith / event-multi-defaultFn.js
Created February 17, 2012 20:45
Proof of concept support for multiple event behaviors
YUI.add('event-multi-defaultFn', function (Y) {
// FIXME: publish() needs to be patched to support allowing this to be called before
// publish(). Today, the publish() call will clobber the AOP wrapper.
Y.EventTarget.prototype.addEventBehavior = function (type, fn, when) {
var event = this.getEvent(type),
method = when === 'before' ? 'before' : 'after',
handle;
@lsmith
lsmith / gist:2151800
Created March 21, 2012 19:35
Workaround for datatable.getColumn(node) (#2531924)
// Add support for table.getColumn( node )
Y.DataTable.prototype.getColumn = (function (original) {
return function (seed) {
var cell;
if (Y.instanceof(seed, Y.Node)) {
cell = this.getCell(seed);
seed = cell && (cell.get('className').match(
new RegExp(this.getClassName('col', '(\\w+)'))) || [])[1];
@lsmith
lsmith / gist:2244450
Created March 29, 2012 22:38
Keyboard navigable DataTable rows with selection
/*
This code should allow users to tab to the first row in the table, which will "select" it by
adding a class to it and storing a reference to the row node. Alternately, users can click
on a row to select it. Selection can be shifted to the next or previous row with the up and down arrow keys. The 'enter' key will fire a 'rowAction' custom event.
*/
table.getRow(0).setAttribute('tabindex', table.get('tabIndex') || 0);
table.delegate('keydown', function (e) {
var selected = this._selectedRow,
tbody = this._tbodyNode,
@lsmith
lsmith / gist:2295032
Created April 3, 2012 19:42
Mutation optimization for YUI 3 DataTable
// Include this after the table's render()
// CAVEAT: this is NOT compatible with nodeFormatters
table.body._afterDataChange = function (e) {
var type = (e.type.match(/:(add|remove|change)$/) || [])[1],
odd = ['yui3-datatable-odd', 'yui3-datatable-even'],
even = ['yui3-datatable-even', 'yui3-datatable-odd'],
row, index;
switch (type) {
case 'change':
@lsmith
lsmith / gist:2480921
Created April 24, 2012 15:51 — forked from stlsmiths/gist:2480907
POC DataTable.Selection class extension
// Class extension to DataTable ...
Y.DataTable.Selection = function () {}
Y.DataTable.Selection.ATTRS = {
// selectionMode: for supporting multiple selection could be its own extension
selectionType: {
value: null, // Feature should not change base behavior by default
validator: '_validateSelectionType'