Class Reference
IRIS for UNIX 2024.1.2
InterSystems: The power behind what matters   
Documentation  Search
  [USER] >  [%ZEN] >  [ComponentEx] >  [scribbleArea]
Private  Storage   

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

Inventory

Parameters Properties Methods Queries Indices ForeignKeys Triggers
2 4 29


Summary

Properties
%condition %import %includeFiles %page
%resource align aux clientType
composite containerStyle controlClass controlStyle
culling dataBinding disabled dragEnabled
dropEnabled enclosingClass enclosingStyle error
height hidden hint hintClass
hintStyle id index invalid
invalidMessage label labelClass labelDisabledClass
labelStyle name nib onafterdrag
onbeforedrag onblur onchange onclick
ondblclick ondrag ondrop onfocus
onhide onkeydown onkeypress onkeyup
onmousedown onmouseout onmouseover onmouseup
onrefresh onshow onsubmit ontouchend
ontouchmove ontouchstart onupdate onvalidate
originalValue parent readOnly required
requiredMessage showLabel slice smoothness
tabIndex title tuple valign
value visible width window

Methods
%AddToSaveSet %Attr %BindExport %ClassIsLatestVersion
%ClassName %ConstructClone %DispatchClassMethod %DispatchGetModified
%DispatchGetProperty %DispatchMethod %DispatchSetModified %DispatchSetMultidimProperty
%DispatchSetProperty %DrawComponentHTML %DrawHTML %DrawJSStrings
%EnclosingDivId %Eval %EvalC %Extends
%ForceClientRender %GetEventHandlers %GetForm %GetParameter
%GetXMLName %IsA %IsModified %MakeId
%Name %New %NormalizeObject %ObjectModified
%OnAddToPageAfter %OnAddToPageBefore %OnDrawEnclosingDiv %OnDrawObjectProperties
%OnObjectSynch %OnZENDeserialize %OriginalNamespace %PackageName
%QuoteValue %QuoteValueL10N %RemoveFromSaveSet %Self
%SerializeObject %SetDefaultValues %SetModified %ValidateObject
Export ValidateDataStream ValidateDestination XMLDTD
XMLExport XMLExportToStream XMLExportToString XMLNew
XMLSchema XMLSchemaNamespace XMLSchemaType addLine
addStroke clear clearCanvas dragFinishHandler
dragHandler dragNotifyHandler dragStartHandler dropHandler
dropStartHandler exportAsPath exportSignature exposeComponent
extractInkColor findElement fireOnUpdateEvent focus
formatValue getDisabled getDragData getEnclosingDiv
getForm getHidden getHintElement getInvalidReason
getLabelElement getProperty getReadOnly getSettings
getType getValue initialize invokeSuper
isModified isOfType isValid makeId
normalizeValue onCreate onDelete onDisplayHandler
onEndModalHandler onPopupAction onRefreshContents onSerialize
onStartModalHandler onchangeHandler onloadHandler onunloadHandler
onupdateHandler parseValue refreshContents render
renderContents renderSVG renderSignature renderSignatureCVS
renderSignatureVML select setDisabled setHidden
setOverlayMode setProperty setReadOnly setValue
showSource smoothSignature startProgressBar stopProgressBar
supportsCanvasAPI sysName touchEnd touchMove
touchStart track trimSignature unformatValue
updateControlValue validationHandler


Parameters

• 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.

Properties

• 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.

Methods

• 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


Copyright (c) 2025 by InterSystems Corporation. Cambridge, Massachusetts, U.S.A. All rights reserved. Confidential property of InterSystems Corporation.