deprecatedclass %ZEN.ComponentEx.scribbleArea
extends %ZEN.Component.control
Free pen input control.
This input control is intended for capturing free pen gestures such as signatures and "initial here" marks
parameter DEFAULTCONTROLCLASS = "text";
The default css class used for the main element within this control. This
is overridden by subclasses.
parameter INCLUDEFILES = "zenCSLM.js";
CSV list of additional include files (either .js or .css) that
should be included when this component is used on a page.
By default, the file extension (.js or .css) is used to determine whether an
item in the list is a script include or a style include. You can override
this behavior by adding the terms "script:" or "style:" to the beginning of
the file name or names. This prefix is not used as part of the include filename.
property controlClass
as %ZEN.Datatype.cssClass [ InitialExpression = "scribbleArea" ];
Optional CSS class used for the primary HTML element displayed for this control.
property culling
as %ZEN.Datatype.integer [ InitialExpression = 0 ];
The level of post processing culling to apply to the input curve. A setting of zero indicates
that all non-colinear data points should be retained. Higher values allow the system to cull
additional points based on how much information they actually contain (information in this case
being a function of change in slope of the curve at the given point) Raising the culling level
reduces the memory requirements for the control's value but does so at the risk of exaggerating
cusps and jitter.
property nib
as %ZEN.Datatype.integer [ InitialExpression = 2 ];
The thickness of the virtual pen point. The higher the nib number the bolder the input curve
will appear.
property smoothness
as %ZEN.Datatype.integer [ InitialExpression = 1 ];
The level of post processing smoothing to apply to the input curve. A setting of
zero indicate no smoothing. Smoothing is achieved by applying weighted averages to the
sampled data points in an effort to reduce jitter resulting from certain input devices.
When set to a small value (1 or 2) this can help curves entered with a bulky device (such
as an optical mouse) more closely approximate those of a more precise input device (such
as a tablet). This is, however, only an approximation and the original data is lost in
the conversion.
method %DrawHTML()
Static HTML display method: draw the BODY of this component
as HTML.
Subclasses implement this in order to render the static HTML
contents of a component.
classmethod Export(fileName As %ZEN.Datatype.string, vector As %ZEN.Datatype.string)
as %ZEN.Datatype.integer
[ ZenMethod ]
Export the vector description of the scribble to an external file
The data stream, vector, may be either a JSON string (as returned
from exportSignature() or in the internal format returned by
exportAsPath(). The provided filename should be a fully qualified
path-filename where the directory is either the temp directory for the
instance or one of the custom whitelisted directories given in
^%SYS("ZEN","fsDirectoryWhitelist")
classmethod ValidateDataStream(vector As %ZEN.Datatype.string)
as %Boolean
classmethod ValidateDestination(fileName As %ZEN.Datatype.string)
as %Boolean
method addLine(sx, sy, ex, ey)
[ Language = javascript ]
Add a line segment to the drawing area
method addStroke(c, x, y)
[ Language = javascript ]
Start or extend a given stroke for the current curve
method clear()
[ Language = javascript ]
method clearCanvas()
[ Language = javascript ]
method exportAsPath(s, smoothingLevel, compressionLevel, showSize)
[ Language = javascript ]
Return the structure of the given curve, s, as a turtle graphics-ish path string where
data points take the form of penCommand x y. The penCommand is either moveTo (m)
or lineTo (l). The x value is measured with respect to the left-most side of the
control's bounds and increases to the right. The y value is measured with respect
to the top edge of the control and increases down the screen. This format is also
used as the nominal value of the control.
method exportSignature(s, smoothingLevel, compressionLevel)
[ Language = javascript ]
Return the structure of the given curve, s, as a JSON object
method extractInkColor(div)
[ Language = javascript ]
method getProperty(property, key)
as %String
[ Language = javascript ]
Override to get current value of control.
method initialize()
[ Language = javascript ]
method onRefreshContents()
[ Language = javascript ]
This client callback is called just from refreshContents
just after the new HTML is delivered from the server.
method onloadHandler()
[ Language = javascript ]
This client event, if present, is fired when the page is loaded.
method parseValue()
[ Language = javascript ]
Parse a new nominal value into the graphical context
method renderSignature(s, smoothingLevel, compressionLevel)
[ Language = javascript ]
Render the given curve, s, in the drawing area
method renderSignatureCVS(s)
[ Language = javascript ]
Render the given curve using HTML 5 canvas tag methods
method renderSignatureVML(s)
[ Language = javascript ]
Render the given curve using IE's VML technology
method setProperty(property, value, value2)
[ Language = javascript ]
Set the value of a named property.
method showSource()
[ Language = javascript ]
method smoothSignature(s)
[ Language = javascript ]
method supportsCanvasAPI()
[ Language = javascript ]
method touchEnd(node, event)
[ Language = javascript ]
Commit the latest gesture to the signature curve
method touchMove(node, event)
[ Language = javascript ]
Track touch gestures and generate curve data for mobile devices
method touchStart(node, event)
[ Language = javascript ]
method track(who, event)
[ Language = javascript ]
Track pointer gestures and generate curve data
method trimSignature(s, cull)
[ Language = javascript ]
method updateControlValue()
[ Language = javascript ]
Extract current rendering information and abstract it into the nominal value
of this control