dijit/ColorPalette.js

• Provides:

  • dijit.ColorPalette

• dijit.ColorPalette

  • type

    Function

  • chains:
    • dijit._Widget: (prototype)
    • dijit._Widget: (call)
    • dijit._Templated: (call)
    • dijit._PaletteMixin: (call)
  • mixins:
    • dijit._Templated.prototype: (prototype)
    • dijit._PaletteMixin.prototype: (prototype)
  • summary

    A keyboard accessible color-picking widget

  • description

    Grid showing various colors, so the user can pick a certain color.
    Can be used standalone, or as a popup.

  • example

    
    	<div dojoType="dijit.ColorPalette"></div>

  • example

    
    	var picker = new dijit.ColorPalette({ },srcNode);
    	picker.startup();

• dijit.ColorPalette.palette

  • tags: const
  • type

    String

  • summary

    Size of grid, either "7x10" or "3x4".

• dijit.ColorPalette._palettes

  • type

    Object

  • summary

• dijit.ColorPalette.templateString

  • type

    String

  • summary

    The template of this widget.

• dijit.ColorPalette.baseClass

  • summary

• dijit.ColorPalette.buildRendering

  • type

    Function

  • source: [view]
    define("dijit/ColorPalette", ["dojo", "dijit", "text!dijit/templates/ColorPalette.html", "dijit/_Widget", "dijit/_Templated", "dojo/colors", "dojo/i18n", "dojo/string", "dijit/_PaletteMixin", "i18n!dojo/nls/colors"], function(dojo, dijit) {
    
    
    dojo.declare("dijit.ColorPalette",
     [dijit._Widget, dijit._Templated, dijit._PaletteMixin],
     {
     // summary:
     //  A keyboard accessible color-picking widget
     // description:
     //  Grid showing various colors, so the user can pick a certain color.
     //  Can be used standalone, or as a popup.
     //
     // example:
     // | 

    
     //
     // example:
     // | var picker = new dijit.ColorPalette({ },srcNode);
     // | picker.startup();
    
    
    
    
     // palette: [const] String
     //  Size of grid, either "7x10" or "3x4".
     palette: "7x10",
    
    
     // _palettes: [protected] Map
     //   This represents the value of the colors.
     //  The first level is a hashmap of the different palettes available.
     //  The next two dimensions represent the columns and rows of colors.
     _palettes: {
      "7x10": [["white", "seashell", "cornsilk", "lemonchiffon","lightyellow", "palegreen", "paleturquoise", "lightcyan", "lavender", "plum"],
        ["lightgray", "pink", "bisque", "moccasin", "khaki", "lightgreen", "lightseagreen", "lightskyblue", "cornflowerblue", "violet"],
        ["silver", "lightcoral", "sandybrown", "orange", "palegoldenrod", "chartreuse", "mediumturquoise",  "skyblue", "mediumslateblue","orchid"],
        ["gray", "red", "orangered", "darkorange", "yellow", "limegreen",  "darkseagreen", "royalblue", "slateblue", "mediumorchid"],
        ["dimgray", "crimson",  "chocolate", "coral", "gold", "forestgreen", "seagreen", "blue", "blueviolet", "darkorchid"],
        ["darkslategray","firebrick","saddlebrown", "sienna", "olive", "green", "darkcyan", "mediumblue","darkslateblue", "darkmagenta" ],
        ["black", "darkred", "maroon", "brown", "darkolivegreen", "darkgreen", "midnightblue", "navy", "indigo",  "purple"]],
    
    
      "3x4": [["white", "lime", "green", "blue"],
       ["silver", "yellow", "fuchsia", "navy"],
       ["gray", "red", "purple", "black"]]
     },
    
    
     // templateString: String
     //  The template of this widget.
     templateString: dojo.cache("dijit", "templates/ColorPalette.html"),
    
    
     baseClass: "dijitColorPalette",
    
    
     buildRendering: function(){
      // Instantiate the template, which makes a skeleton into which we'll insert a bunch of
      // nodes
      this.inherited(arguments);
    
    
      // Creates nodes in each cell of the template.
      // Pass in "customized" dijit._Color constructor for specified palette and high-contrast vs. normal mode
      this._preparePalette(
       this._palettes[this.palette],
       dojo.i18n.getLocalization("dojo", "colors", this.lang),
       dojo.declare(dijit._Color, {
        hc: dojo.hasClass(dojo.body(), "dijit_a11y"),
        palette: this.palette
       })
      );
  • summary

• dijit.ColorPalette._palettes.7x10

  • summary

• dijit.ColorPalette._palettes.3x4

  • summary

• dijit._Color

  • type

    Function

  • chains:
    • dojo.Color: (prototype)
    • dojo.Color: (call)
  • parameters:
    • alias: (typeof String)
    • row: (typeof Number)
    • col: (typeof Number)
  • source: [view]
      this._alias = alias;
      this._row = row;
      this._col = col;
      this.setColor(dojo.Color.named[alias]);
  • summary

• dijit._Color.template

  • summary

• dijit._Color.hcTemplate

  • summary

• dijit._Color._imagePaths

  • type

    Object

  • summary

• dijit._Color.getValue

  • type

    Function

  • source: [view]
      return this.toHex();
  • summary

    Note that although dijit._Color is initialized with a value like "white" getValue() always
    returns a hex value

• dijit._Color.fillCell

  • type

    Function

  • parameters:
    • cell: (typeof DOMNode)
    • blankGif: (typeof String)
  • source: [view]
      var html = dojo.string.substitute(this.hc ? this.hcTemplate : this.template, {
       // substitution variables for normal mode
       color: this.toHex(),
       blankGif: blankGif,
       alt: this._alias,
    
       
       // variables used for high contrast mode
       image: this._imagePaths[this.palette].toString(),
       left: this._col * -20 - 5,
       top: this._row * -20 - 5,
       size: this.palette == "7x10" ? "height: 145px; width: 206px" : "height: 64px; width: 86px"
      });
    
    
      dojo.place(html, cell);
  • summary

• dijit._Color._imagePaths.7x10

  • summary

• dijit._Color._imagePaths.3x4

  • summary

• dijit._Color.palette

  • summary

• dijit._Color._alias

  • summary

• dijit._Color._row

  • summary

• dijit._Color._col

  • summary

• dijit

  • type

    Object

  • summary