Constructor
new TextGrid(parent, container, boxBase, x, y, ncw, nch, cellW, cellH, border)
TextGrid constructor
Name | Type | Description |
---|---|---|
parent | module:boxes/AbstractBox. | The AbstractBox to which this text grid belongs |
container | module:AWT. | The container where this text grid is placed. |
boxBase | module:boxes/BoxBase. | The object where colors, fonts, border and other graphic properties |
x | number |
|
y | number |
|
ncw | number | Number of columns of the grid |
nch | number | Nomber of rows of the grid |
cellW | number | Width of the cells |
cellH | number | Height of the cells |
border | boolean | When |
- Source
Extends
Members
$accessibleElement :external:jQuery
DOM element used to display this cell content in wai-aria contexts
- Source
$hostedComponent :external:jQuery
An external JQuery DOM element hosted by this box
- Source
accessibleAlwaysActive :boolean
Flag indicating that $accessibleElement should be always active
- boolean
- Source
accessibleText :string
Text to be used in accessible contexts
- string
- Source
alternative :boolean
Whether this box must be displayed with alternative or regular color and font settings
- boolean
- Source
answers :Array.<Array.<string>>
Two-dimension array with the expected characters, used to check user's answers.
- Array.<Array.<string>>
- Source
attributes :Array.<Array.<number>>
Two-dimension array of bytes used as containers of boolean attributes
- Array.<Array.<number>>
- Source
- See
- TextGrid.flags
border :boolean
Whether this box has a border or not
- boolean
- Source
boxBase :module:boxes/BoxBase.BoxBase
The BoxBase
related to this AbstractBox. When null
, the parent can provide an
alternative one.
- Source
cellHeight :number
The cell height, in pixels
- number
- Source
cellWidth :number
The cell width, in pixels
- number
- Source
chars :Array.<Array.<string>>
Two-dimension array of characters
- Array.<Array.<string>>
- Source
container :module:AWT.Container
The Container to which this AbstractBox belongs
- Source
cursor :module:AWT.Point
The current position of the cursor
- Source
cursorBlink :boolean
true
when the cursor is "blinking" (cell drawn with BoxBase
inverse
attributes)
- boolean
- Source
cursorEnabled :boolean
Whether the blinking cursor is enabled or disabled
- boolean
- Source
cursorTimer :module:AWT.Timer
Controls the blinking of the cursor
- Source
dim :module:AWT.Dimension
The Dimension
of the Rectangle
focused :boolean
Whether this box holds the input focus
- boolean
- Source
inactive :boolean
Whether this box is active or inactive
- boolean
- Source
inverted :boolean
Whether this box must be displayed with inverted or regular colors
- boolean
- Source
marked :boolean
Whether this box is marked (selected) or not
- boolean
- Source
nCols :number
Number of columns
- number
- Source
nRows :number
Number of rows
- number
- Source
parent :module:boxes/AbstractBox.AbstractBox
The parent AbstractBox (can be null
)
- Source
pos :module:AWT.Point
The current position of the shape
preferredBounds :module:AWT.Rectangle
The preferred bounds of this grid
- Source
randomChars :string
Characters that can be used when randomizing the content of this grid
- string
- Source
- See
- TextGridContent#randomChars
role :string
Describes the main role of this box on the activity. Useful in wai-aria descriptions.
- string
- Source
shape :module:AWT.Shape
The shape of this box (the box Rectangle or a special Shape, if set)
- Source
specialShape :boolean
Whether this box has a shape that is not a rectangle
- boolean
- Source
temporaryHidden :boolean
Used to temporary hide a box while other drawing operations are done
- boolean
- Source
tmpTrans :boolean
Cells with this attribute will be transparent but with painted border
- boolean
- Source
type :string
Shape type id
- string
useCursor :boolean
Whether this grid uses a blinking cursor or not
- boolean
- Source
visible :boolean
Whether this box is visible or not
- boolean
- Source
wild :string
The character to be used as wildcard
- string
- Source
wildTransparent :boolean
Whether the wildcard character is transparent or opaque
- boolean
- Source
(static, constant) defaults :object
TextGrid default values
- object
- Source
(static, constant) flags :object
Binary flags used to mark status
- object
- Source
Methods
add(shape) → {module:AWT.Rectangle}
Adds the boundaries of another shape to the current one
Name | Type | Description |
---|---|---|
shape | module:AWT. | The |
- Type:
- module:AWT.
Rectangle
blink(status)
Makes the cursor blink, alternating between two states. This method should be called only bymodule:boxes/TextGrid.TextGrid#cursorTimer
Name | Type | Description |
---|---|---|
status | boolean |
- Source
clip(ctx, fillRuleopt) → {external:CanvasRenderingContext2D}
Creates a clipping region on the specified HTML canvas 2D rendering context
Name | Type | Attributes | Default | Description |
---|---|---|---|---|
ctx | external:CanvasRenderingContext2D | The rendering context | ||
fillRule | string | <optional> | 'nonzero' | Can be 'nonzero' (default when not set) or 'evenodd' |
- The provided rendering context
clone() → {module:AWT.Rectangle}
Clones this Rectangle
- Type:
- module:AWT.
Rectangle
countCharsLike(ch) → {number}
Counts the number of cells of this grid with the specified character
Name | Type | Description |
---|---|---|
ch | string |
- Source
- Type:
- number
countCoincidences(checkCase) → {number}
Counts the number of coincidences between the answers
array and the current content of this grid
Name | Type | Description |
---|---|---|
checkCase | boolean | Make comparisions case-sensitive |
- Source
- Type:
- number
drawBorder(ctx)
Draws the box border
Name | Type | Description |
---|---|---|
ctx | external:CanvasRenderingContext2D | The canvas rendering context where the border |
- Source
end()
Stops the cursor timer if not null
and active
- Source
equals(r) → {boolean}
Checks if two shapes are equivalent.
Name | Type | Description |
---|---|---|
r | module:AWT. | The Shape to compare against |
- Type:
- boolean
fill(ctx, dirtyRegionopt) → {external:CanvasRenderingContext2D}
Fills the Shape with the current style in the provided HTML canvas context
Name | Type | Attributes | Description |
---|---|---|---|
ctx | external:CanvasRenderingContext2D | The canvas 2D rendering context where to fill this shape. | |
dirtyRegion | module:AWT. | <optional> | The context region to be updated. Used as clipping |
- The provided rendering context
findFreeCell(from, dx, dy) → {module:AWT.Point}
Finds the coordinates of the nearest non-locked cell (non-wildcard) moving on the indicated
'X' and 'Y' directions.
Name | Type | Description |
---|---|---|
from | module:AWT. | Logical coordinates of the starting point |
dx | number | 0 means no movement, 1 go right, -1 go left. |
dy | number | 0 means no movement, 1 go down, -1 go up. |
- Source
- Type:
- module:AWT.
Point
findNextCellWithAttr(startX, startY, attr, dx, dy, attrState) → {module:AWT.Point}
Finds the first cell with the specified attributes at the specified state, starting
at specified point.
Name | Type | Description |
---|---|---|
startX | number | Starting X coordinate |
startY | number | Starting Y coordinate |
attr | number | Attribute to check. See |
dx | number | 0 means no movement, 1 go right, -1 go left. |
dy | number | 0 means no movement, 1 go down, -1 go up. |
attrState | boolean | Desired state (enabled or disabled) of |
- Source
- Type:
- module:AWT.
Point
getAttributes() → {object}
Gets a object with the basic attributes needed to rebuild this instance excluding functions,
parent references, constants and also attributes retaining the default value.
The resulting object is commonly usued to serialize elements in JSON format.
- The resulting object, with minimal attrributes
- Type:
- object
getBorderBounds() → {module:AWT.Rectangle}
Returns the enclosing Rectangle of this box including its border (if any)
- Source
- Type:
- module:AWT.
Rectangle
getBounds() → {module:AWT.Rectangle}
Gets the enclosing Rectangle
of this Shape.
- Type:
- module:AWT.
Rectangle
getBoxBaseResolve() → {module:boxes/BoxBase.BoxBase}
Gets the real BoxBase
associated to this box, scanning down parent relationships.
- Source
getCellAttribute(px, py, attribute) → {boolean}
Gets the specified attribute of a cell
Name | Type | Description |
---|---|---|
px | number | The 'X' coordinate of the cell |
py | number | The 'Y' coordinate of the cell |
attribute | number | The binary flag representing this attribute. See |
- Source
true
if the cell has this attribute,false
otherwise.
- Type:
- boolean
getCellBorderBounds(px, py) → {module:AWT.Rectangle}
Gets the rectangle enclosing a specific cell, including the border thick.
Name | Type | Description |
---|---|---|
px | number | The 'X' coordinate of the cell |
py | number | The 'Y' coordinate of the cell |
- Source
- Type:
- module:AWT.
Rectangle
getCellRect(px, py) → {module:AWT.Rectangle}
Gets the rectangle enclosing a specific cell
Name | Type | Description |
---|---|---|
px | number | The 'X' coordinate of the cell |
py | number | The 'Y' coordinate of the cell |
- Source
- Type:
- module:AWT.
Rectangle
getCharAt(px, py) → {string}
Gets the character of the cell at the specified coordinates
Name | Type | Description |
---|---|---|
px | number | 'X' coordinate |
py | number | 'Y' coordinate |
- Source
- Type:
- string
getContainerResolve() → {module:AWT.Container}
Gets the container associated to this box, asking its parents when null
.
- Source
- Type:
- module:AWT.
Container
getContainerX() → {module:AWT.Container}
Gets the container
attribute of this box, without checking its parent
- Source
- Type:
- module:AWT.
Container
getCoords() → {string}
Gets a string with the co-ordinates of the upper-left and lower-right vertexs of this rectangle,
(with values rounded to int)
- Type:
- string
getCursor() → {module:AWT.Point}
Gets the current position of the blinking cursor
- Source
- Type:
- module:AWT.
Point
getHostedComponent() → {external:jQuery}
Gets the current $hostedComponent
member
- Source
- Type:
- external:jQuery
getItemFor(rx, ry) → {module:AWT.Point}
For a specific cell located at column rx
and row ry
, finds the number of words delimited
by wildchars located behind its current position and in the same row and column. Used inCrossWord
activities to find the definition for a specific cell.
The result is returned as 'x' and 'y' properties of a logical point.
Name | Type | Description |
---|---|---|
rx | number | The 'X' position of the cell |
ry | number | The 'Y' position of the cell |
- Source
- The logical positions of the definition for this cell inside the list
of current definitions of its row and column. '0' means first definition of its row/column,
'1' the second one, etc.
- Type:
- module:AWT.
Point
getLogicalCoords(devicePoint) → {module:AWT.Point}
Gets the logical coordinates (in 'cell' units) of a device point into the grid
Name | Type | Description |
---|---|---|
devicePoint | module:AWT. |
- Source
- Type:
- module:AWT.
Point
getMinimumSize() → {module:AWT.Dimension}
Gets the minimum size of this grid
- Source
- Type:
- module:AWT.
Dimension
getNumCells() → {number}
Gets the number of cells of this grid
- Source
- Type:
- number
getOppositeVertex() → {module:AWT.Point}
Gets the module:AWT.Point
corresponding to the lower-right vertex of the Rectangle.
- Type:
- module:AWT.
Point
getParent() → {module:boxes/AbstractBox.AbstractBox}
Gets the current parent of this box
- Source
getPreferredSize() → {module:AWT.Dimension}
Gets the preferred size of this grid
- Source
- Type:
- module:AWT.
Dimension
getScaledSize(scale) → {module:AWT.Dimension}
Scales the grid to a new size
Name | Type | Description |
---|---|---|
scale | number | The factor used to multiply all coordinates and sizes |
- Source
- Type:
- module:AWT.
Dimension
getShape() → {module:AWT.Shape}
Gets the current shape used in this box
- Source
- Type:
- module:AWT.
Shape
getStringBetween(x0, y0, x1, y1) → {string}
Gets the text formed by the letters between two cells that share a straight line on the grid.
The text can be formed horizontally, vertically and diagonal, both in left-to-right or
right-to-left direction.
Name | Type | Description |
---|---|---|
x0 | number | 'X' coordinate of the first cell |
y0 | number | 'Y' coordinate of the first cell |
x1 | number | 'X' coordinate of the second cell |
y1 | number | 'Y' coordinate of the second cell |
- Source
- Type:
- string
grow(dx, dy) → {module:AWT.Rectangle}
Expands the boundaries of this shape. This affects the current position and dimension.
Name | Type | Description |
---|---|---|
dx | number | The amount to grow (or decrease) in horizontal direction |
dy | number | The amount to grow (or decrease) in vertical direction |
- Type:
- module:AWT.
Rectangle
hasBorder() → {boolean}
Checks if this box has border
- Source
- Type:
- boolean
intersects(_r) → {boolean}
Checks if the provided Rectangle
r
intersects with this shape.
Name | Type | Description |
---|---|---|
_r | module:AWT. |
- Type:
- boolean
invalidate(rect)
Invalidates the zone corresponding to this box in the associated module:AWT.Container
, if any.
Name | Type | Description |
---|---|---|
rect | module:AWT. | The rectangle to be invalidated. When |
- Source
isAlternative() → {boolean}
Checks if this box is in alternative
state.
- Source
- Type:
- boolean
isCellOk(px, py, checkCase) → {boolean}
Checks if a specific cell is equivalent to the content of answers
at its position
Name | Type | Description |
---|---|---|
px | number | X coordinate |
py | number | Y coordinate |
checkCase | boolean | Make comparisions case-sensitive |
- Source
- Type:
- boolean
isFocused() → {boolean}
Checks if this box has the input focus
- Source
- Type:
- boolean
isInactive() → {boolean}
Checks if this box is currently inactive.
- Source
- Type:
- boolean
isInverted() → {boolean}
Checks if this box is in inverted
state.
- Source
- Type:
- boolean
isMarked() → {boolean}
Checks if this box is marked
- Source
- Type:
- boolean
isRect() → {boolean}
Shorthand method for determining if a Shape is an Rectangle
- Type:
- boolean
isTemporaryHidden() → {boolean}
Checks if this box is temporary hidden
- Source
- Type:
- boolean
isValidCell(px, py) → {boolean}
Checks if the specified logical coordinates are inside the valid bounds of the grid.
Name | Type | Description |
---|---|---|
px | number | 'X' coordinate |
py | number | 'Y' coordinate |
- Source
- Type:
- boolean
isVisible() → {boolean}
Checks if this box is fully visible
- Source
- Type:
- boolean
moveBy(dx, dy)
Sets a new location to this box. In JClic this method was named translate
.
Name | Type | Description |
---|---|---|
dx | number | The displacement on the X axis |
dy | number | The displacement on the Y axis |
- Source
moveCursor(dx, dy, skipLocked)
Moves the cursor in the specified x and y directions.
Name | Type | Description |
---|---|---|
dx | number | Amount to move in the 'X' axis |
dy | number | Amount to move in the 'Y' axis |
skipLocked | boolean | Skip locked cells (wildcards in |
- Source
moveTo(newPos, yopt)
Sets a new location for this box. In JClic this method was named setLocation
Name | Type | Attributes | Description |
---|---|---|---|
newPos | AWT. | A point or the | |
y | number | <optional> | The |
- Source
preparePath(ctx) → {external:CanvasRenderingContext2D}
Prepares an HTML canvas 2D rendering context with a path that can be used to stroke a line,
to fill a surface or to define a clipping region.
Name | Type | Description |
---|---|---|
ctx | external:CanvasRenderingContext2D |
- The provided rendering context
randomize()
Substitutes the current content of all cells with wildcards with a randomly generated char.
- Source
- See
- TextGridContent#randomChars
repaintCell(px, py)
Repaints a cell
Name | Type | Description |
---|---|---|
px | number | The 'X' coordinate of the cell |
py | number | The 'Y' coordinate of the cell |
- Source
scaleBy(delta) → {module:AWT.Rectangle}
Multiplies the dimension of the Shape by the specified delta
amount.
Name | Type | Description |
---|---|---|
delta | Point | | Object containing the X and Y ratio to be scaled. |
- Type:
- module:AWT.
Rectangle
setAllCellsAttribute(attribute, state)
Sets the specified attribute to all cells.
Name | Type | Description |
---|---|---|
attribute | number | The binary flag representing this attribute. See |
state | boolean | Whether to set or unset the attribute. |
- Source
setAlternative(newVal)
Sets this box in alternative
mode, or restores its original state.
Name | Type | Description |
---|---|---|
newVal | boolean |
- Source
setAttribute(px, py, attribute, state)
Sets or unsets a specifi attrobut to a cell.
Name | Type | Description |
---|---|---|
px | number | The 'X' coordinate of the cell |
py | number | The 'Y' coordinate of the cell |
attribute | number | The binary flag representing this attribute. See |
state | boolean | Whether to set or unset the attribute. |
- Source
setAttributeBetween(x0, y0, x1, y1, attribute, value)
Sets a specific attribute to all cells forming a straight line between two cells on the grid.
Name | Type | Description |
---|---|---|
x0 | number | 'X' coordinate of the first cell |
y0 | number | 'Y' coordinate of the first cell |
x1 | number | 'X' coordinate of the second cell |
y1 | number | 'Y' coordinate of the second cell |
attribute | number | The binary flag representing this attribute. See |
value | boolean | Whether to set or unset the attribute. |
- Source
setAttributes(data) → {module:AWT.Rectangle}
Reads the properties of this Rectangle from a data object
Name | Type | Description |
---|---|---|
data | object | The data object to be parsed |
- Type:
- module:AWT.
Rectangle
setBorder(newVal)
Sets/unsets a border to this box
Name | Type | Description |
---|---|---|
newVal | boolean |
|
- Source
setBoxBase(boxBase)
Sets the BoxBase
of this box
Name | Type | Description |
---|---|---|
boxBase | module:boxes/BoxBase. | The new BoxBase |
- Source
setCellAttributes(lockWild, clearChars)
Clears or sets global attributes to all cells
Name | Type | Description |
---|---|---|
lockWild | boolean | When |
clearChars | boolean | When |
- Source
setCellLocked(px, py, locked)
Sets or unsets the locked
properties (black cell) to a specific cell.
Name | Type | Description |
---|---|---|
px | number | The logical 'X' coordinate of the cell |
py | number | The logical 'Y' coordinate of the cell |
locked | boolean | When true, the |
- Source
setCharAt(px, py, ch)
Sets the specified character as a content of the cell at specified coordinates
Name | Type | Description |
---|---|---|
px | number | 'X' coordinate |
py | number | 'Y' coordinate |
ch | string | The character to set. |
- Source
setChars(text)
Sets the characters to be placed in the cells of this TextGrid
Name | Type | Description |
---|---|---|
text | string |
- Source
setContainer(newContainer)
Setter method for container
Name | Type | Description |
---|---|---|
newContainer | module:AWT. | The new Container assigned to this box |
- Source
setCursorAt(px, py, skipLocked)
Sets the blinking cursor at a specific point
Name | Type | Description |
---|---|---|
px | number | X coordinate |
py | number | Y coordinate |
skipLocked | boolean | Skip locked (wildcard) cells |
- Source
setCursorEnabled(status)
Whether the blinking cursor must be enabled or disabled.
Name | Type | Description |
---|---|---|
status | boolean |
- Source
setFocused(newVal)
Sets or unsets the input focus to this box.
Name | Type | Description |
---|---|---|
newVal | boolean |
- Source
setHostedComponent($hc)
Sets the $hostedComponent
member.
Name | Type | Description |
---|---|---|
$hc | external:jQuery | The jQuery DOM component hosted by this box. |
- Source
setHostedComponentBorder()
Sets the $hostedComponent
border, based on the currentBoxBase
of this box.
- Source
setHostedComponentBounds(_sizeChanged)
Places and resizes $hostedComponent
, based on the size
and position of this box.
Name | Type | Description |
---|---|---|
_sizeChanged | boolean |
|
- Source
setHostedComponentColors()
Sets $hostedComponent
colors and other css properties
based on the current BoxBase
of this box.
- Source
setHostedComponentVisible()
Makes module:boxes/AbstractBox.AbstractBox#$hostedComponent
visible or invisible, based on the value of
the AbstractBox visible
flag.
- Source
setInactive(newVal)
Makes this box active (false
) or inactive (true
)
Name | Type | Description |
---|---|---|
newVal | boolean |
- Source
setInverted(newVal)
Puts this box in inverted
mode or restores its original state.
Name | Type | Description |
---|---|---|
newVal | boolean |
- Source
setMarked(newVal)
Sets this box in marked
mode, or restores its original state.
Name | Type | Description |
---|---|---|
newVal | boolean |
- Source
setParent(parent)
Setter method for parent
Name | Type | Description |
---|---|---|
parent | module:boxes/AbstractBox. | The new parent of this box |
- Source
setShape(sh)
Sets the shape used to draw the content of this box
Name | Type | Description |
---|---|---|
sh | module:AWT. | The shape to be set |
- Source
setSize(width, height)
Changes the size of this box
Name | Type | Description |
---|---|---|
width | number | |
height | number |
- Source
setTemporaryHidden(newVal)
Makes this box temporary hidden (newVal true
) or resets its original state (newVal false
)
Name | Type | Description |
---|---|---|
newVal | boolean |
- Source
setUseCursor(value)
Sets the useCursor
property of this text grid
Name | Type | Description |
---|---|---|
value | boolean |
- Source
setVisible(newVal)
Sets this box visible or invisible
Name | Type | Description |
---|---|---|
newVal | boolean |
|
- Source
startCursorBlink()
Starts the module:AWT.Timer
that makes the cursor blink.
- Source
stopCursorBlink()
Stops the module:AWT.Timer
that makes the cursor blink.
- Source
stroke(ctx) → {external:CanvasRenderingContext2D}
Draws this shape in the provided HTML canvas 2D rendering context.
Name | Type | Description |
---|---|---|
ctx | external:CanvasRenderingContext2D | The canvas 2D rendering context where to draw the shape. |
- The provided rendering context
toString() → {string}
Overwrites the original 'Object.toString' method with a more descriptive text
- Type:
- string
update(ctx, dirtyRegionopt)
Draws the content of this box on an HTML canvas
element. At this level, only background
and border are painted/stroked. Derived classes should implement specific drawing tasks inmodule:boxes/AbstractBox.AbstractBox#updateContent
.
Name | Type | Attributes | Default | Description |
---|---|---|---|---|
ctx | external:CanvasRenderingContext2D | The canvas rendering context used to draw the | ||
dirtyRegion | module:AWT. | <optional> | null | The area that must be repainted. |
- Source
updateContent(ctx, dirtyRegionopt)
Name | Type | Attributes | Description |
---|---|---|---|
ctx | external:CanvasRenderingContext2D | The canvas rendering context used to draw the | |
dirtyRegion | module:AWT. | <optional> | The area that must be repainted. |
- Source
(static) createEmptyGrid(parent, container, x, y, tgc, wildTransparent) → {module:boxes/TextGrid.TextGrid}
Factory constructor that creates an empty grid based on a TextGridContent
Name | Type | Description |
---|---|---|
parent | module:boxes/AbstractBox. | The AbstractBox to which the text grid belongs |
container | module:AWT. | The container where the text grid will be placed. |
x | number |
|
y | number |
|
tgc | module:boxes/TextGridContent. | Object with the content and other settings of the grid |
wildTransparent | boolean | When |
- Source