dijit » ColorPalette » postCreate
dijit.ColorPalette.postCreate
dojo.require("dijit.ColorPalette");
defined in dijit/ColorPalette.js
Usage
function () (view source)
dojo.mixin(this.divNode.style, this._paletteDims[this.palette]); this.imageNode.setAttribute("src", this._imagePaths[this.palette]); var choices = this._palettes[this.palette]; this.domNode.style.position = "relative"; this._cellNodes = []; this.colorNames = dojo.i18n.getLocalization("dojo", "colors", this.lang); var url = dojo.moduleUrl("dojo", "resources/blank.gif"), colorObject = new dojo.Color(), coords = this._paletteCoords; for(var row=0; row < choices.length; row++){ for(var col=0; col < choices[row].length; col++) { var imgNode = dojo.doc.createElement("img"); imgNode.src = url; dojo.addClass(imgNode, "dijitPaletteImg"); var color = choices[row][col], colorValue = colorObject.setColor(dojo.Color.named[color]); imgNode.alt = this.colorNames[color]; imgNode.color = colorValue.toHex(); var imgStyle = imgNode.style; imgStyle.color = imgStyle.backgroundColor = imgNode.color; var cellNode = dojo.doc.createElement("span"); cellNode.appendChild(imgNode); dojo.forEach(["Dijitclick", "MouseEnter", "Focus", "Blur"], function(handler) { this.connect(cellNode, "on" + handler.toLowerCase(), "_onCell" + handler); }, this); this.divNode.appendChild(cellNode); var cellStyle = cellNode.style; cellStyle.top = coords.topOffset + (row * coords.cHeight) + "px"; cellStyle.left = coords.leftOffset + (col * coords.cWidth) + "px"; dojo.attr(cellNode, "tabindex", "-1"); cellNode.title = this.colorNames[color]; dojo.addClass(cellNode, "dijitPaletteCell"); dijit.setWaiRole(cellNode, "gridcell"); cellNode.index = this._cellNodes.length; this._cellNodes.push(cellNode); } } this._xDim = choices[0].length; this._yDim = choices.length; this.connect(this.divNode, "onfocus", "_onDivNodeFocus"); // Now set all events // The palette itself is navigated to with the tab key on the keyboard // Keyboard navigation within the Palette is with the arrow keys // Spacebar selects the color. // For the up key the index is changed by negative the x dimension. var keyIncrementMap = { UP_ARROW: -this._xDim, // The down key the index is increase by the x dimension. DOWN_ARROW: this._xDim, // Right and left move the index by 1. RIGHT_ARROW: 1, LEFT_ARROW: -1 }; for(var key in keyIncrementMap){ this._connects.push(dijit.typematic.addKeyListener(this.domNode, {keyCode:dojo.keys[key], ctrlKey:false, altKey:false, shiftKey:false}, this, function(){ var increment = keyIncrementMap[key]; return function(count){ this._navigateByKey(increment, count); }; }(), this.timeoutChangeRate, this.defaultTimeout)); }