dojox/drawing/Drawing.js

• Provides:

  • dojox.drawing.Drawing

• dojox.drawing.Drawing

  • type

    Function

  • parameters:
    • props: (typeof Object)
    • node: (typeof HTMLNode)
  • summary

    Drawing is a project that sits on top of DojoX GFX and uses SVG and
    VML vector graphics to draw and display.

  • description

    Drawing is similar to DojoX Sketch, but is designed to be more versatile
    extendable and customizable.
    Drawing currently only initiates from HTML although it's technically not
    a Dijit to keep the file size light. But if Dijit is available, Drawing
    will register itself with it and can be accessed dijit.byId('myDrawing')
    
    NOTES:
    Although not Drawing and Toolbar, all other objects are created with a custom
    declare. See dojox.drawing.util.oo
    
    The files are laid out as such:
    - Drawing
    The master class. More than one instance of a Drawing can be placed
    on a page at one time (although this has not yet been tested). Plugins
    can be added in markup.
    - Toolbar
    Like Drawing, Toolbar is a psudeo Dijit that does not need Dijit. It is
    optional. It can be oriented horizontal or vertical by placing one of
    those params in the class (at least one is required).  Plugins
    can be added in markup. A drawingId is required to point toolbar to
    the drawing.
    - defaults
    Contains the default styles and dimensions for Stencils. An individual
    Stencil can be changed by calling stencil.att({color obj}); To change
    all styles, a custom defaults file should be used.
    -Stencils
    Drawing uses a concept of 'Stencils' to avoid confusion between a
    Dojox Shape and a Drawing Shape. The classes in the 'stencils' package
    are display only, they are not used for actually drawing (see 'tools').
    This package contains _Base from which stencils inherit most of their
    methods.(Path and Image are display only and not found in Tools)
    - Tools
    The Tools package contains Stencils that are attached to mouse events
    and can be used for drawing. Items in this package can also be selected
    and modified.
    - Tools / Custom
    Holds tools that do not directly extend Stencil base classes and often
    have very custom code.
    - Library (not implemented)
    The Library package, which is not yet implemented, will be the place to
    hold stencils that have very specific data points that result in a picture.
    Flag-like-banners, fancy borders, or other complex shapes would go here.
    - Annotations
    Annotations 'decorate' and attach to other Stencils, such as a 'Label'
    that can show text on a stencil, or an 'Angle' that shows while dragging
    or modifying a Vector, or an Arrow head that is attached to the beginning
    or end of a line.
    - Manager
    Contains classes that control functionality of a Drawing.
    - Plugins
    Contains optional classes that are 'plugged into' a Drawing. There are two
    types: 'drawing' plugins that modify the canvas, and 'tools' which would
    show in the toolbar.
    - Util
    A collection of common tasks.

  • example

    	<div dojoType="dojox.drawing.Drawing" id="drawing" defaults="myCustom.defaults"
    		plugins="[{'name':'dojox.drawing.plugins.drawing.Grid', 'options':{gap:100}}]">
       </div>

  • example

    	<div dojoType="dojox.drawing.Toolbar" drawingId="drawing" class="drawingToolbar vertical">
    		<div tool="dojox.drawing.tools.Line" selected="false">Line</div>
    		<div tool="dojox.drawing.tools.Rect" selected="false">Rect</div>
    		<div tool="dojox.drawing.tools.Ellipse" selected="false">Ellipse</div>
    		<div tool="dojox.drawing.tools.TextBlock" selected="false">Statement</div>
    		<div tool="dojox.drawing.tools.custom.Equation" selected="false">Equation</div>
    		<div plugin="dojox.drawing.plugins.tools.Pan" options="{}">Pan</div>
    		<div plugin="dojox.drawing.plugins.tools.Zoom" options="{zoomInc:.1,minZoom:.5,maxZoom:2}">Zoom</div>
    	</div>

• dojox.drawing.Drawing.ready

  • type

    Boolean

  • summary

    Whether or not the canvas has been created and Stencils can be added

• dojox.drawing.Drawing.mode

  • tags: optional
  • type

    String

  • summary

    Changes the functionality of the drawing

• dojox.drawing.Drawing.width

  • type

    Number

  • summary

    Width of the canvas

• dojox.drawing.Drawing.height

  • type

    Number

  • summary

    Height of the canvas
    
    
    
    defaults : Object
    Optional replacements for native defaults.
    plugins: Object
    Key values of plugins that apply to canvas.

• dojox.drawing.Drawing.constructor

  • constructor - constructor
  • type

    Function

  • parameters:
    • props: (typeof Object)
    • node: (typeof HTMLNode)
  • summary

    Drawing is not a Dijit. This is the master method.
    NOTE:
    props is always null since this is not a real widget
    Will change when Drawing can be created programmatically.

• dojox.drawing.Drawing._createCanvas

  • type

    Function

• dojox.drawing.Drawing.canvas

  • type

    Object

• dojox.drawing.Drawing.resize

  • parameters:
    • box: (typeof Object)
  • summary

    Resizes the canvas.
    If within a ContentPane this will get called automatically.
    Can also be called directly.

  • type

    Function

• dojox.drawing.Drawing.startup

  • type

    Function

• dojox.drawing.Drawing.getShapeProps

  • parameters:
    • data: (typeof Object)
    • mode
  • summary

    The common objects that are mixed into
    a new Stencil. Mostly internal, but could be used.

  • type

    Function

• dojox.drawing.Drawing.addPlugin

  • parameters:
    • plugin: (typeof Object)
  • summary

    Add a toolbar plugin object to plugins array
    to be parsed

  • type

    Function

• dojox.drawing.Drawing.initPlugins

  • summary

    Called from Toolbar after a plugin has been loaded
    The call to this coming from toobar is a bit funky as the timing
    of IE for canvas load is different than other browsers

  • type

    Function

• dojox.drawing.Drawing.plugins

  • type

    Array

• dojox.drawing.Drawing.onSurfaceReady

  • summary

    Event that to which can be connected.
    Fired when the canvas is ready and can be drawn to.

  • type

    Function

• dojox.drawing.Drawing.undo

  • type

    Object

• dojox.drawing.Drawing.anchors

  • type

    Object

• dojox.drawing.Drawing.uiStencils

  • type

    Object

• dojox.drawing.Drawing.stencils

  • type

    Object

• dojox.drawing.Drawing.addUI

  • parameters:
    • type: (typeof String)

      Object The parameters used to draw the object. See stencil._Base and each
      tool for specific parameters of teh data or points objects.

    • options: (typeof Object)
  • summary

    Use this method to programmatically add Stencils that display on
    the canvas.
    FIXME: Currently only supports Stencils that have been registered,
    which is items in the toolbar, and the additional Stencils at the
    end of onSurfaceReady. This covers all Stencils, but you can't
    use 'display only' Stencils for Line, Rect, and Ellipse.
    arguments:

  • type

    Function

• dojox.drawing.Drawing.addStencil

  • parameters:
    • type: (typeof String)

      Object The parameters used to draw the object. See stencil._Base and each
      tool for specific parameters of teh data or points objects.

    • options: (typeof Object)
  • summary

    Use this method to programmatically add Stencils that display on
    the canvas.
    FIXME: Currently only supports Stencils that have been registered,
    which is items in the toolbar, and the additional Stencils at the
    end of onSurfaceReady. This covers all Stencils, but you can't
    use 'display only' Stencils for Line, Rect, and Ellipse.
    arguments:

  • type

    Function

• dojox.drawing.Drawing.removeStencil

  • parameters:
    • stencil: (typeof Object)
  • summary

    Use this method to programmatically remove Stencils from the canvas.
    arguments:
    Stencil: Object
    The Stencil to be removed

  • type

    Function

• dojox.drawing.Drawing.removeAll

  • summary

    Deletes all Stencils on the canvas.

  • type

    Function

• dojox.drawing.Drawing.selectAll

  • summary

    Selects all stencils

  • type

    Function

• dojox.drawing.Drawing.toSelected

  • parameters:
    • func: (typeof String)
  • summary

    Call a function within all selected Stencils
    like attr()

  • example

    	myDrawing.toSelected('attr', {x:10})

  • type

    Function

• dojox.drawing.Drawing.exporter

  • returns

    Array

  • summary

    Collects all Stencil data and returns an
    Array of objects.

  • type

    Function

• dojox.drawing.Drawing.importer

  • parameters:
    • objects: (typeof Array)
  • summary

    Handles an Array of stencil data and imports the objects
    to the drawing.

  • type

    Function

• dojox.drawing.Drawing.changeDefaults

  • parameters:
    • newStyle: (typeof Object)

      An object that represents one of the objects in
      drawing.style that will be mixed in. Not all
      properties are necessary. Only one object may
      be changed at a time. The object boolean parameter
      is not required and if not set objects will automatically
      be changed.
      Changing non-objects like angleSnap requires value
      to be true.

    • value: (typeof boolean)
  • summary

    Change the defaults so that all Stencils from this
    point on will use the newly changed style.
    arguments:

  • example

    	myDrawing.changeDefaults({
    		norm:{
    			fill:"#0000ff",
    			width:5,
    			color:"#ffff00"
    		}
    	});
    
    console.log("----->>> changeDefault: ",newStyle, " value?: ",value);

  • type

    Function

• dojox.drawing.Drawing.onRenderStencil

  • parameters:
    • stencil: (typeof Object)
  • summary

    Event that fires when a stencil is drawn. Does not fire from
    'addStencil'.
    
    console.info("--------------------------------------dojox.drawing.onRenderStencil:", stencil.id);

  • type

    Function

• dojox.drawing.Drawing.defaults.clickable

  • type

    bool

• dojox.drawing.Drawing.onDeleteStencil

  • parameters:
    • stencil: (typeof Object)
  • summary

    Event fired from a stencil that has destroyed itself
    will also be called when it is removed by "removeStencil"
    or stencils.onDelete.

  • type

    Function

• dojox.drawing.Drawing.registerTool

  • parameters:
    • type: (typeof String)
  • summary

    Registers a tool that can be accessed. Internal.

  • type

    Function

• dojox.drawing.Drawing.getConstructor

  • parameters:
    • abbr: (typeof String)
  • summary

    Returns a Stencil constructor base on
    abbreviation

  • type

    Function

• dojox.drawing.Drawing.setTool

  • parameters:
    • type: (typeof String)
  • summary

    Sets up a new class to be used to draw. Called from Toolbar,
    and this class... after a tool is used a new one of the same
    type is initialized. Could be called externally.

  • type

    Function

• dojox.drawing.Drawing.currentType

  • type

    Array

• dojox.drawing.Drawing.currentStencil

  • type

    Object

• dojox.drawing.Drawing.unSetTool

  • summary

    Destroys current tool

  • type

    Function

• dojox.drawing.Drawing.defaults

• dojox.drawing.Drawing.id

• dojox.drawing.Drawing.util

• dojox.drawing.Drawing.keys

• dojox.drawing.Drawing.mouse

  • type

    Object

• dojox.drawing.Drawing.tools

  • type

    Object

• dojox.drawing.Drawing.stencilTypes

  • type

    Object

• dojox.drawing.Drawing.stencilTypeMap

  • type

    Object

• dojox.drawing.Drawing.srcRefNode

• dojox.drawing.Drawing.domNode

• dojox.drawing.Drawing.widgetId

• dojox.drawing

  • type

    Object

• dojox

  • type

    Object