activities/text/FillInBlanks. FillInBlanksPanel

Constructor

new FillInBlanksPanel(act, ps, $divopt)

FillInBlanksPanel constructor

Parameters:
NameTypeAttributesDescription
actmodule:Activity.Activity

The Activity to which this Panel belongs

psmodule:JClicPlayer.JClicPlayer

Any object implementing the methods defined in the
PlayStation Java interface.

$divexternal:jQuery<optional>

The jQuery DOM element where this Panel will deploy

Extends

Members

$animatedBg :external:jQuery

Background element (currently a span) used to place animated GIFs when needed

$animatedBgB :external:jQuery

Additional background element for animated GIFs, used in associations

$canvas :external:jQuery

The jQuery main canvas element used by this panel

$checkButton :external:jQuery

The button used to check the activity, only when Activity.checkButtonText is not null

$currentPopup :external:jQuery

The popup currently been displayed

$div :external:jQuery

The jQuery div element used by this panel

accessibleCanvas :boolean

Always true, since canvas hit regions have been deprecated!
See: https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Tutorial/Hit_regions_and_accessibility

Type:
  • boolean

act :module:Activity.Activity

The Activity this panel is related to

bc :module:boxes/BoxConnector.BoxConnector

The object used to connect cells and other elements in some types of activity

bgImage :external:HTMLImageElement

The realized image used as a background

currentItem :number

Currently selected item. Used in some types of activities.

Type:
  • number

currentPopupTimer :number

A timer controlling the time the current popup will be displayed

Type:
  • number

dim :module:AWT.Dimension

The Dimension of the Rectangle

events :Array.<string>

List of events intercepted by this ActivityPanel. Current events are: 'keydown', 'keyup',
'keypress', 'mousedown', 'mouseup', 'click', 'dblclick', 'mousemove', 'mouseenter',
'mouseleave', 'mouseover', 'mouseout', 'touchstart', 'touchend', 'touchmove' and 'touchcancel'.

Type:
  • Array.<string>

firstRun :boolean

true if the activity is running for first time (not due to a click on the replay button)

Type:
  • boolean

invalidatedRect :module:AWT.Rectangle

The currently "invalidated" area

locked :boolean

Flag indicating if the activity is open or locked

Type:
  • boolean

minimumSize :module:AWT.Dimension

The minimum size of this kind of ActivityPanel

playing :boolean

true while the activity is playing

Type:
  • boolean

popupWaitTimer :number

A timer prepared to display a popup after a while

Type:
  • number

pos :module:AWT.Point

The current position of the shape

preferredSize :module:AWT.Dimension

The preferred size of this kind of ActivityPanel

prevScreenTimer :number

System timer used to close the previous document when act.maxTime is reached.

Type:
  • number

ps :module:JClicPlayer.JClicPlayer

The PlayStation used to realize media objects and communicate with the player services
(usually a JClicPlayer

skin :module:skins/Skin.Skin

The realized current Skin

solved :boolean

true when the activity is solved, false otherwise

Type:
  • boolean

spanChars :boolean

When true, text spanning will be done at char level: each single letter will be a clickacle span.
Used only in activities of type "itentify letters"

Type:
  • boolean

spanText :boolean

When true, all text outside of targets and cells will be inserted as independent words or letters,
using 'span' elements. module:activities/text/TextActivityBase.TextActivityBasePanel#$createSpanElement can be used
to customize these elements.

Type:
  • boolean

targets :Array.<external:jQuery>

Array of jQuery DOM elements (usually of type 'span') containing the targets of this activity

Type:

targetsMarked :boolean

Flag indicating if targets must be visually marked at the beginning of the activity.
Should be true except for IdentifyText activities.

Type:
  • boolean

type :string

Shape type id

Type:
  • string

Methods

$createSpanElement($span) → {external:jQuery}

Creates a 'span' element, used to isolate elements of text not involved in targets.
Used only when spanText is true.

Parameters:
NameTypeDescription
$spanexternal:jQuery

An initial DOM object (usually a span) that can be used
to store the target, or replaced by another type of object.

Returns:
  • The jQuery DOM element loaded with the span data.
Type: 
external:jQuery

$createTargetElement(target, $span) → {external:jQuery}

Creates a target DOM element for the provided target. This DOM element can be an editable
span or a select with specific option elements (when the target is a drop-down list)

Parameters:
NameTypeDescription
targetmodule:activities/text/TextActivityDocument.TextTarget

The target related to the DOM object to be created

$spanexternal:jQuery
  • An initial DOM object (usually a span) that can be used
    to store the target, or replaced by another type of object.
Returns:
  • The jQuery DOM element loaded with the target data.
Type: 
external:jQuery

activityReady()

Called by JClicPlayer when this activity panel is fully visible, just after the
initialization process.

add(shape) → {module:AWT.Rectangle}

Adds the boundaries of another shape to the current one

Parameters:
NameTypeDescription
shapemodule:AWT.Shape

The module:AWT.Shape to be added

Returns:
Type: 
module:AWT.Rectangle

attachEvent($obj, evt)

Attaches a single event to the specified object

Parameters:
NameTypeDescription
$objexternal:jQuery

The object to which the event will be attached

evtstring

The event name

attachEvents()

Attaches the events specified in the events member to the $div member

buildAccessibleComponents()

Builds the accessible components needed for this ActivityPanel
This method is called when all main elements are placed and visible, when the activity is ready
to start or when resized.

buildVisualComponents()

Prepares the visual components of the activity

checkTarget(target, onlyCheck, jumpDirectionopt) → {boolean}

Checks if the specified TextTarget has a valid answer in its currentText field

Parameters:
NameTypeAttributesDescription
targetmodule:activities/text/TextActivityDocument.TextTarget

The target to check

onlyCheckboolean

When true, the cursor will no be re-positioned

jumpDirectionnumber<optional>

1 to go forward, -1 to go back.

Returns:
  • true when the target contains a valid answer
Type: 
boolean

clear()

Miscellaneous cleaning operations

clip(ctx, fillRuleopt) → {external:CanvasRenderingContext2D}

Creates a clipping region on the specified HTML canvas 2D rendering context

Parameters:
NameTypeAttributesDefaultDescription
ctxexternal:CanvasRenderingContext2D

The rendering context

fillRulestring<optional>
'nonzero'

Can be 'nonzero' (default when not set) or 'evenodd'

Returns:
  • The provided rendering context
Type: 
external:CanvasRenderingContext2D

clone() → {module:AWT.Rectangle}

Clones this Rectangle

Returns:
Type: 
module:AWT.Rectangle

contains(_p) → {boolean}

Checks if the provided module:AWT.Point is inside this shape.

Parameters:
NameTypeDescription
_pmodule:AWT.Point

The point to check

Returns:
Type: 
boolean

countSolvedTargets(checkNow, markopt) → {number}

Counts the number of targets with SOLVED status

Parameters:
NameTypeAttributesDescription
checkNowboolean

When true, all targets will be evaluated. Otherwise, only the
current value of targetStatus will be checked.

markboolean<optional>

When true, errors in the target answer will be marked.

Returns:
  • The number of targets currently solved.
Type: 
number

enableCounters(eTime, eScore, eActions)

Enables or disables the three counters (time, score and actions)

Parameters:
NameTypeDescription
eTimeboolean

Whether to enable or disable the time counter

eScoreboolean

Whether to enable or disable the score counter

eActionsboolean

Whether to enable or disable the actions counter

end()

Ends the activity

equals(r) → {boolean}

Checks if two shapes are equivalent.

Parameters:
NameTypeDescription
rmodule:AWT.Shape

The Shape to compare against

Returns:
Type: 
boolean

evaluatePanel() → {boolean}

Evaluates all the targets in this panel. This method is usually called from the Check button.

Returns:
  • true when all targets are OK, false otherwise.
Type: 
boolean

fill(ctx, dirtyRegionopt) → {external:CanvasRenderingContext2D}

Fills the Shape with the current style in the provided HTML canvas context

Parameters:
NameTypeAttributesDescription
ctxexternal:CanvasRenderingContext2D

The canvas 2D rendering context where to fill this shape.

dirtyRegionmodule:AWT.Rectangle<optional>

The context region to be updated. Used as clipping
region when drawing.

Returns:
  • The provided rendering context
Type: 
external:CanvasRenderingContext2D

fitTo(proposed, bounds)

Fits the panel within the proposed rectangle. The panel can occupy more space, but always
not surpassing the bounds rectangle.

Parameters:
NameTypeDescription
proposedmodule:AWT.Rectangle

The proposed rectangle

boundsmodule:AWT.Rectangle

The maximum allowed bounds

forceFinishActivity()

Forces the ending of the activity.

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.

Returns:
  • The resulting object, with minimal attrributes
Type: 
object

getBounds() → {module:AWT.Rectangle}

Gets the enclosing Rectangle of this Shape.

Returns:
Type: 
module:AWT.Rectangle

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)

Returns:
Type: 
string

getOppositeVertex() → {module:AWT.Point}

Gets the module:AWT.Point corresponding to the lower-right vertex of the Rectangle.

Returns:
Type: 
module:AWT.Point

getShape(rect) → {module:AWT.Shape}

Gets a clone of this shape moved to the pos component of the rectangle and scaled
by its dim value.

Parameters:
NameTypeDescription
rectmodule:AWT.Rectangle

The rectangle to be taken as a base for moving and scaling
this shape.

Returns:
Type: 
module:AWT.Shape

grow(dx, dy) → {module:AWT.Rectangle}

Expands the boundaries of this shape. This affects the current position and dimension.

Parameters:
NameTypeDescription
dxnumber

The amount to grow (or decrease) in horizontal direction

dynumber

The amount to grow (or decrease) in vertical direction

Returns:
Type: 
module:AWT.Rectangle

intersects(_r) → {boolean}

Checks if the provided Rectangle r intersects with this shape.

Parameters:
NameTypeDescription
_rmodule:AWT.Rectangle
Returns:
Type: 
boolean

invalidate(rect)

Adds the provided rectangle to the invalidated area.

Parameters:
NameTypeDescription
rectmodule:AWT.Rectangle

isRect() → {boolean}

Shorthand method for determining if a Shape is an Rectangle

Returns:
Type: 
boolean

markTarget(target, attributes)

Visually marks the target as 'solved OK' or 'with errors'.

Parameters:
NameTypeDescription
targetmodule:activities/text/TextActivityDocument.TextTarget

The text target to be marked.

attributesArray.<number>
  • Array of flags indicating the status (OK or error) for each
    character in target.currentText.

moveBy(delta) → {module:AWT.Shape}

Shifts the shape a specified amount in horizontal and vertical directions

Parameters:
NameTypeDescription
deltaPoint | Dimension

The amount to shift the Shape

Returns:
Type: 
module:AWT.Shape

moveTo(newPos) → {module:AWT.Shape}

Moves this shape to a new position

Parameters:
NameTypeDescription
newPosmodule:AWT.Point

The new position of the shape

Returns:
Type: 
module:AWT.Shape

playEvent(event)

Plays the specified event sound

Parameters:
NameTypeDescription
eventstring

The type of event to be performed

preInitActivity()

Called when the text activity has a 'previous screen' information to be shown before the
activity starts

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.

Parameters:
NameTypeDescription
ctxexternal:CanvasRenderingContext2D
Returns:
  • The provided rendering context
Type: 
external:CanvasRenderingContext2D

scaleBy(delta) → {module:AWT.Rectangle}

Multiplies the dimension of the Shape by the specified delta amount.

Parameters:
NameTypeDescription
deltaPoint | Dimension

Object containing the X and Y ratio to be scaled.

Returns:
Type: 
module:AWT.Rectangle

setAndPlayMsg(msgCode, eventSoundsCodeopt)

Sets the message to be displayed in the skin message box and optionally plays a sound event.

Parameters:
NameTypeAttributesDescription
msgCodestring

Type of message (initial, final, finalError...)

eventSoundsCodestring<optional>

Optional name of the event sound to be played.

setAttributes(data) → {module:AWT.Rectangle}

Reads the properties of this Rectangle from a data object

Parameters:
NameTypeDescription
dataobject

The data object to be parsed

Returns:
Type: 
module:AWT.Rectangle

setBounds(rect)

Sets the size and position of this activity panel

Parameters:
NameTypeDescription
rectmodule:AWT.Rectangle

setDimension(maxSize) → {module:AWT.Dimension}

Sets the real dimension of this ActivityPanel.

Parameters:
NameTypeDescription
maxSizemodule:AWT.Dimension

The maximum surface available for the activity panel

Returns:
Type: 
module:AWT.Dimension

setDocContent($div, doc)

Fills a jQuery DOM element (usually a 'div') with the specified TextActivityDocument.

Parameters:
NameTypeDescription
$divexternal:jQuery

The jQuery DOM object to be filled with the document.

docmodule:activities/text/TextActivityDocument.TextActivityDocument

The document

showHelp()

Displays help about the activity

showPopup($popup, maxTime, waitTime)

Parameters:
NameTypeDescription
$popupexternal:jQuery

The popup to display, or _null _ to just hide the current popup

maxTimenumber

The maximum time to mantain the popup on screen, in seconds

waitTimenumber

When set, indicates the number of seconds to wait before show the popup

shuffle(bg, visible, fitInArea)

Shuffles the contents of the activity

Parameters:
NameTypeDescription
bgArray.<module:boxes/ActiveBoxBag.ActiveBoxBag>

The sets of boxes to be shuffled

visibleboolean

The shuffle process must be animated on the screen (not yet implemented!)

fitInAreaboolean

Shuffled pieces cannot go out of the current area

stroke(ctx) → {external:CanvasRenderingContext2D}

Draws this shape in the provided HTML canvas 2D rendering context.

Parameters:
NameTypeDescription
ctxexternal:CanvasRenderingContext2D

The canvas 2D rendering context where to draw the shape.

Returns:
  • The provided rendering context
Type: 
external:CanvasRenderingContext2D

toString() → {string}

Overwrites the original 'Object.toString' method with a more descriptive text

Returns:
Type: 
string

update()

Updates the invalidated area

updateContent(dirtyRegion)

Activities should implement this method to update the graphic content of its panel. The method
will be called from module:AWT.Container#update when needed.

Parameters:
NameTypeDescription
dirtyRegionmodule:AWT.Rectangle

Specifies the area to be updated. When null,
it's the whole panel.