Blocks

This page describes the attributes and methods of each building block type:

AudioBlock

(inherits from BaseBlock)

An AudioBlock adds a block that will be used in a GraphEditorBlock to create an audio processing graph. Depending on the type, the block may generate or process audio or perform other audio specific operations. Many of the blocks accept additional parameters which can be found on the Audio wiki page.

  • type (required) the type of the block. Must be one of: Output, Sine, Triangle, Saw, Square, Pulse, WhiteNoise, ADSREnvelope, Gain, Pan, CrossFade, LowPassFilter, HighPassFilter, BandPassFilter, BandRejectFilter, AllPassFilter, DCFilter, Lag, Delay, FeedbackDelay, CombFilter, DampedCombFilter, Reverb, SoftClip, BitCrusher, Add, Subtract, Multiply, Divide, Modulo, Reciprocal, MulAdd, Tanh
  • allowMove (default: false) if true, allow student to move this block within the graph editor
  • inToolBox (default: false) if true, this block starts in the editor's tool box (yellow rectangle)
  • column the column in which to place the block; if no column is specified, it will be placed according to the number of input and output pins

BaseBlock

A BaseBlock has attributes and methods common to all other blocks. You do not need to create a BaseBlock; you create other blocks that will automatically inherit the BaseBlock attributes.

  • name the name of the block; if not specified a name will be computed from the label (if any)
  • label a description of the block shown to the student
  • visible (default: true) whether the block is visible (when the page is first loaded)
  • initCode code to run when the page loads
  • updateCode code that will run on every simulation update (if a ControlBlock is defined)
  • hide() make the block invisible
  • show() make the block visible
  • enable() enable the block (value may update)
  • disable() disable the block (value will not update)

BlobBlock

(inherits from BaseBlock)

A BlobBlock adds a block that can be used with a CameraBlock to find brightly colored objects (blobs) or track a single brighty colored object (blob)

  • tracking (default: false) if set to true the block will track the largest brightly colored blob. This will include velocity information about this blob
  • backgroundType (default: white) must be one of: image, white, black, or none. Set to the background of the scene. A value of "none" means that the background has been subtracted; "white" and "black" mean a solid white or solid black background; "image" means there is no special background. When the setting is white or image, pure white objects will not be included.
  • threshold (default: 55) the value that will determine if an object is brightly colored enough. The higher the number the more brightly colored an object must be to be found.
  • minBlobSize (default: 10) the minimum number of pixels that will be counted as a blob. Objects below this size will be ingored
  • maxBlobSize (default: 0) the maximum number of pixels that will be counted as a blob. Objects above this size will be ignored. Set to 0 disable.
  • maxBlobCount (default: 10) the maximum number of blobs that will be found. These will be the n largest blobs, where n is the maxBlobCount.
  • showBlobs (default: true) determines if blobs will be shown on the camera display as outlined rectangles.

BlockDropBlock

(inherits from BaseBlock)

A BlockDropBlock adds a quiz-like widget that has the student sort terms into categories. The terms are represented as falling blocks and the categories as locations on the ground. See example.

  • canvasWidth (required) the width of area in which the blocks can move
  • canvasHeight (required) the height of area in which the blocks can move
  • answers (required) the answers; start each on a new line; each line should have the form "category: term"; like any multi-line attribute, this requires an end tag

ButtonBlock

(inherits from BaseBlock)

A ButtonBlock adds a button to the page (using the label attribute for the button text). See example.

  • clickCode (required) code that is run when the student clicks the button
  • enabled (default: true) if true the button is enabled (can be clicked)
  • color (default: green) can be yellow, orange, or green
  • enable() enable the button (set it to allow clicks)
  • disable() disable the button (prevent clicks)

CameraBlock

(inherits from BaseBlock)

A CameraBlock adds a camera/video display using a browser plugin.

  • canvasWidth (required) the width of the camera/video display
  • canvasHeight (required) the height of the camera/video display
  • regionSize if specified, vision statistics (computed by a VisionBlock) are calculated within a regionSize by regionSize square in the middle of the frame (measured in pixels relative to the canvasWidth and canvasHeight attributes)
  • mouseTouchCode code that runs when the student clicks/touches the camera/video display; this code is provided with mouseTouchX and mouseTouchY variables containing the mouse/touch coordinates (in the pixels from the lower left)

ChoiceBlock

(inherits from BaseBlock)

A ChoiceBlock presents a set of choices for the student, similar to a QuestionBlock, but used for controlling other blocks on the page, rather than asking a quiz question. See example.

  • choices (required) a set of choices, one per line starting with a., b., etc.; a choice that starts with a* will be pre-selected when the page loads; like any multi-line attribute, this requires an end tag
  • changeCode if specified, this code will be run when the student changes the selected item

ChoiceQuestionBlock

(inherits from QuestionBaseBlock and BaseBlock)

A ChoiceQuestionBlock adds a multiple-choice question. The question must have at least two answers (one of which must be marked as the correct answer). See example.

  • question (required) the question text
  • answers the answers; start each on a new line; prefix incorrect answers with a. and correct answers with b*; like any multi-line attribute, this requires an end tag

ControlBlock

(inherits from BaseBlock)

A ControlBlock adds control buttons and attributes for the timed events that run a simulation, game, or other interaction. This block is required for all other update functions to run.

  • autoStart (default: false) automatically start the simulation
  • updatesPerSecond (required) number of simulation updates per second (should be within the range [10, 30])
  • drawsPerSecond (default: updatesPerSecond) number of times per second to run the section's draw code
  • stepSize (default: 1) the number of updates to run when clicking the step button
  • stepLabel (default: Step) the label on the step button
  • allowStep (default: true) if true, shows a step button
  • allowReset (default: true) if true, shows a Reset button
  • allowFast (default: false) if true, allow fast-forward simulation
  • allowSlow (default: false) if false, allows slow-motion simulation
  • wide (default: true) display the control block as a wide box (buttons arranged horizontally)
  • sideBar (default: false) display the control block in the side bar
  • maxFastFactor (default: 16) the maximum fast-forward factor (16 means the maximum speed is 16 times normal speed)
  • maxSlowFactor (default: 16) the maximum slow-motion factor (16 means the minimum speed is 1/16th normal speed)
  • startCode this code is run when student clicks Start (or code calls simStart())
  • stopCode this code is run when student clicks Stop (or code calls simStop())
  • resetCode this code is run when student clicks Reset (or code calls simReset()); if not specified, will reload page

DataLabBlock

(inherits from BaseBlock)

A DataLabBlock adds a user interface for viewing and analyzing data sets.

  • dataSet the name of the dataset to load
  • canvasWidth (required) the width of the plotting area
  • canvasHeight (required) the height of the plotting area

DrawBlock

(inherits from BaseBlock)

A DrawBlock adds a canvas (graphic display area) to the page. It can be used to display simulations, games, and other graphics. The xMin/xMax/yMin/yMax attributes determine the coordinate system for drawing in the canvas. If they are not specified, their default values will provide a pixel-based coordinate system. (In both cases, the y coordinate increases from bottom to top.) See example.

  • canvasWidth (required) the width of the canvas in pixels
  • canvasHeight (required) the height of the canvas in pixels
  • xMin (default: 0) the minimum x-coordinate for drawing
  • xMax (default: canvasWidth) the maximum x-coordinate for drawing
  • yMin (default: 0) the minimum y-coordinate for drawing
  • yMax (default: canvasHeight) the maximum y-coordinate for drawing
  • showFrame (default: true) if true, adds axis labels and a frame
  • xLabel the x-axis label (displayed if showFrame is true)
  • yLabel the y-axis label (displayed if showFrame is true)
  • drawCode code that draws on the canvas; use the ctx variable to access various drawing functions (see the library documentation)
  • mouseTouchCode code that runs when the student clicks or touches the canvas; continues to be called as the mouse or finger moves; this code is provided with mouseTouchX and mouseTouchY variables containing the mouse coordinates (in the internal/drawing coordinate system)
  • mouseTouchReleaseCode code that runs after mouseTouchCode when the mouse button is released or the finger is lifted; this code is provided with mouseTouchX and mouseTouchY variables containing the mouse coordinates (in the internal/drawing coordinate system)
  • xMin access the xMin value from code (can read/write)
  • xMax access the xMax value from code (can read/write)
  • yMin access the yMin value from code (can read/write)
  • yMax access the yMax value from code (can read/write)

DrawItemBlock

(inherits from BaseBlock)

A DrawItemBlock adds an graphical element to be drawn within a DrawBlock (the DrawItemBlock must be the child of a DrawBlock). See example.

  • x (required) the x-coordinate of the center of the item
  • y (required) the y-coordinate of the center of the item
  • angle (default: 0) the orientation/rotation of the item (in radians)
  • width (default: 20) the width of the item
  • height (default: 20) the height of the item
  • r (default: 0) the red component of the item's interior color (0 to 255)
  • g (default: 0) the green component of the item's interior color (0 to 255)
  • b (default: 0) the blue component of the item's interior color (0 to 255)
  • lineWidth (default: 1) the width of the item's outline
  • shape (default: circle) the item's shape (options: circle, rectangle, triangle)
  • image a file name of a lesson image to display (if specified, item shape is ignored)
  • drawCode custom code for drawing the item; code is passed a ctx variable
  • drawItem.setColor( r, g, b ) sets fill color of item; r, g, and b should be in [0, 255]
  • drawItem.setRadius( radius ) sets width and height to two times the given radius
  • drawItem.draw( ctx ) draws the item in the given context
  • drawItem.collides( otherDrawItem ) returns true if the object intersects the given draw item
  • drawItem.setImage( image, width, height ) sets the image file name for drawing the item; width and height are in drawing coordinates (not screen coordinates); the code must call ctx.flip() before and after calling drawItem.draw( ctx ) for any image-based DrawItem

FilterBlock

(inherits from NumericBlock)

A FilterBlock adds a numeric processing block. A FilterBlock can be used in a GraphEditorBlock or as a stand-alone block. It typically has 2 or more inputs, though some filter types work with 1 input. Inputs can be specified using the inputChildren attribute, the addInputChild method, or by the user when the FilterBlock is placed inside a GraphEditorBlock.

  • type (required) the filter type; current options: and, or, xor, not, plus, minus, times, dividedBy, equals, lessThan, greaterThan
  • inputChildren names of the blocks (comma-separated) that will be inputs to the filter
  • addInputChild( block ) adds an input child block

GoalBlock

(inherits from BaseBlock)

A GoalBlock adds a goal to the Goal section. The label attribute determines the goal text. See example.

  • type can be used to specify special types of blocks; these special types do not require goalCode (the behavior is controlled automatically); currently allowed values are answerAll (requires all quiz questions to be answered) and checkAnswers (requires that the student use the QuizCheckBlock button to check the quiz answers)
  • goalCode code that determines whether goal has been met; should return a true/false value
  • satisfied() set the goal to a satisfied state
  • notSatisfied() set the goal to a not-satisfied state
  • setStatus() display a message with additional information about the goal state

GraphBlock

(inherits from NumericBlock and BaseBlock)

A GraphBlock adds a numeric block that will be used in a GraphEditorBlock. This block inherits all of the attributes and methods of the NumericBlock.

  • inputPins (default: 0) the number of input pins (0 to 2)
  • outputPins (default: 0) the number of output pins (0 to 1)
  • expression an expression computed from the block's inputs; use $1 to denote the first input and $2 to denote the second input
  • operator (default: +) an operator to apply to the inputs; currently these are allowed: +,-,*,/,&,|,^ (with standard JavaScript behavior)
  • allowMove (default: false) if true, allow student to move this block within the graph editor
  • inToolBox (default: false) if true, this block starts in the editor's tool box (yellow rectangle)
  • column the column in which to place the block; if no column is specified, it will be placed according to the number of input and output pins
  • inputs a comma-separated list of pre-connected input blocks
  • isInput( blockName ) returns true if this block has the given block as a currently connected input (note: this method is also available for non-GraphBlock blocks within a GraphEditor)

GraphEditorBlock

(inherits from BaseBlock)

A GraphEditorBlock adds a box containing blocks (including GraphBlocks, InputBlocks, SensorBlocks, VisionBlocks, OutputBlocks, etc.) that can be connected by the student to create a computational network.

  • canvasWidth (required) the width of the editor box in pixels
  • canvasHeight (required) the height of the editor box in pixels
  • columnCount (default: 3) the number of columns of blocks to create (the blocks are automatically arrange within these columns according to input/output pin counts and the blocks' column attributes)
  • blockWidth (default: 100) the width of the blocks (in pixels)

GridBlock

(inherits from BaseBlock)

A GridBlock contains a set of other blocks arranged in a grid. See example.

  • rowCount (required) the number of rows in the grid
  • colCount (required) the number of columns in the grid
  • children (required) a comma-separated list of block names to be included in the grid (the grid is filled by rows)

HeadingBlock

(inherits from BaseBlock)

A HeadingBlock adds a heading to the page.

  • text (required) the heading text

HorizontalGroupBlock

(inherits from BaseBlock)

A HorizontalGroupBlock contains a set of other blocks, arranged horizontally. See example.

  • children (required) a comma-separated list of block names to be included in the group

HorizontalLineBlock

(inherits from BaseBlock)

A HorizontalLineBlock creates a horizontal line.

ImageBlock

(inherits from BaseBlock)

An ImageBlock adds an image to the page. See example.

  • image (required) the file name of the image (no path); the image must be uploaded to the lesson in the editor
  • width the width of the image (if neither width nor height is specified, uses original image size)
  • height the height of the image (if neither width nor height is specified, uses original image size)
  • border (default: false) if true, displays a thin border around the image

ImageSequenceBlock

(inherits from BaseBlock)

An ImageSequenceBlock adds a widget to display a sequence of images See example.

  • image (required) the file name prefix of the images (no path); any file names that have the given prefix will be included (make sure only valid images match the prefix); images will be displayed in alphabetical order by image file name; the images must be uploaded to the lesson in the editor
  • width the width of the images (if neither width nor height is specified, uses original image size)
  • height the height of the images (if neither width nor height is specified, uses original image size)
  • border (default: false) if true, displays a thin border around the image
  • stepInterval the number of seconds to wait before switching to the next image when playing the sequence; if zero or unspecified, no playing mode is provided; instead next/prev buttons are displayed

InputBlock

(inherits from NumericBlock and BaseBlock)

An InputBlock displays a numeric value that can be edited by the student. This block inherits all of the attributes and methods of the NumericBlock. See example.

  • minValue the minimum value that is allowed
  • maxValue the maximum value that is allowed
  • showBounds (default: true) if true and bounds are specified, show the bounds (*minValue and/or *maxValue)
  • maxLength (default: 10) the maximum number of characters that can be entered
  • allowText (default: false) if true, the input block allows text input; the value attribute will be a string
  • changeCode code that is executed whenever the value has changed (as long as the value is valid and within the specified bounds)
  • changed() returns true if the block value has changed (and the new value is valid)

InputQuestionBlock

(inherits from QuestionBaseBlock and BaseBlock)

An InputQuestionBlock adds a quiz question with a short free-text answer See example.

  • question (required) the question text
  • answer (required) the correct answer
  • caseSensitive (default: false) if true, the student answer must exactly match the correct answer (include case)
  • numeric (default: false) if true, the answer is required to be numeric
  • tolerance (default: 0.000001) the allowed difference between the student answer and correct answer (for numeric questions only)

InstructionBlock

(inherits from BaseBlock)

An InstructionBlock adds instruction text to the Instruction section.

  • text (required) the instruction text to display

KeyInputBlock

(inherits from NumericBlock and BaseBlock)

A KeyInputBlock adds a numeric block that is 1 when the specified key is pressed and zero otherwise. This block inherits all of the attributes and methods of the NumericBlock. See example.

  • key (required) the keyboard letter that will trigger the block; can also capture arrow keys with these special values: left, right, up, down
  • keyCode this code will be run when the key is pressed
  • releaseKeyCode this code will be run when the key is released

MatchLinkBlock

(inherits from BaseBlock)

A MatchLinkBlock adds a quiz-like widget that has the student match terms and definitions.

  • canvasWidth (required) the width of area in which the blocks can move
  • canvasHeight (required) the height of area in which the blocks can move
  • answers (required) the answers; start each on a new line; each line should have the form "term: definition"; like any multi-line attribute, this requires an end tag

MatchingTileBlock

(inherits from BaseBlock)

A MatchingTileBlock add a tile-matching puzzle (student needs to find pairs of matching tiles). See example.

  • rowCount (required) number of row in tile grid
  • colCount (required) number of columns in tile grid
  • answers (required) the items to be matched; each pair is a single line, seperated by a colon; the number of pairs (answers) should be 1/2 the number of rows times the number of columns; like any multi-line attribute, this requires an end tag
  • tileWidth (default: 100) width of each tile in pixels
  • tileHeight (default: 100) height of each tile in pixles

MicrocontrollerBlock

(inherits from BaseBlock)

A MicrocontrollerBlock set parameters for the microcontroller (used with SensorBlocks, OutputBlocks, etc.)

  • sendInterval (default: 100) the interval between each time the microcontroller send values from remote blocks (in milliseconds)
  • updateInterval (default: *sendInterval) the interval between each time the microcontroller updates values of remote blocks (in milliseconds)

NumericBlock

(inherits from BaseBlock)

A NumericBlock adds a generic numeric block. See example.

  • decimalPlaces (default: 0) the number of decimal places (right of the period) to display
  • minWidth the minimum width of the block in pixels
  • maxHistory (default: 30) the amount of history to keep (for plotting, etc.) in seconds
  • initValue (default: 0) the initial value of the block
  • rule a text description of the block's mathematic definition
  • allowPlot (default: true) allow the student to plot the block's value over time
  • showStats (default: false) show statistcs (min/mean/max/stdev/median) of the block's value over time
  • showPlot (default: false) show a plot of the block's value over time
  • autoStore (default: true) automatically store the value of the block in its history on every update
  • plotMin the lower bound on the block's plot (determined automatically if not specified)
  • plotMax the upper bound on the block's plot (determined automatically if not specified)
  • value a JavaScript expression to be evaluated on every update; if specified, block will update its own value according to the express
  • minValue the minimum value the block is allowed to take (currently only used if value expression is specified)
  • maxValue the maximum value the block is allowed to take (currently only used if value expression is specified)
  • value the current value of the block
  • defined if false, the block will display a ? instead of the value (this property can be modified independently of value)
  • format( value ) format a value according to the block's decimalPlaces attribute
  • plotted() returns true if the student has plotted the value (if allowPlot is true)
  • min() the minimum value of the recent history (as definde by maxHistory)
  • mean() the mean value of the recent history (as definde by maxHistory)
  • max() the maximum value of the recent history (as definde by maxHistory)
  • median() the median value of the recent history (as definde by maxHistory)
  • stdev() the standard deviation value of the recent history (as definde by maxHistory)

OutputBlock

(inherits from NumericBlock and BaseBlock)

An OutputBlock adds a block that sends values to an output device (Arduino, etc.) connected to the computer.

  • pin (required) the I/O pin number to which the output will be sent; should be in the [2, 13] range
  • mode (default: binary) the output mode; options include binary (0 outputs 0V and 1 outputs 5V) and pwm (outputs a pulse-width-modulated signal, where 0 corresponds to the a 0% duty cycle and 100 corresponds to a 100% duty cycle); PWM mode only works on pins 3, 5, 6, 9, 10, and 11

PageTemplate

A PageTemplate is a meta-block that specifies properties for the entire page specification.

  • title (required) the title of the page(s) generated from the template
  • partCount (default: 1) the number of pages/parts generated from the template
  • name the name for the specification; only required if blocks are imported from this template into another template

PlotBlock

(inherits from BaseBlock)

A PlotBlock adds a block for plotting numeric data. It is more flexible than a NumericBlock with *showPlot enabled.

  • canvasWidth (required) the width of the drawing canvas in pixels
  • canvasHeight (required) the height of the drawing canvas in pixels
  • drawCode if specified, this code can be used to draw a plot (not needed if use setData(), etc.); use the ctx variable to access various drawing functions (see the library documentation)
  • xLabel (required) the x-axis label
  • yLabel (required) the y-axis label
  • xMin (default: 0) the minimum value to display on the x-axis
  • xMax (default: 1) the maximum value to display on the x-axis
  • yMin (default: 0) the minimum value to display on the y-axis
  • yMax (default: 1) the maximum value to display on the y-axis
  • setData( xData, yData ) set the data to plot
  • setBounds( xMin, xMax, yMin, yMax ) set the displayed bounds of the plot
  • autoBounds( xData, yData ) set the bounds according to the data
  • plotter a plotter object being used to display the data (see the library documentation)

PluginCheckBlock

(inherits from BaseBlock)

A PluginCheckBlock checks for serial/camera/audio connectivity via the browser plugin. This block should be placed in the first section. Other hardware blocks should not be placed in the first section.

  • requireMicrocontroller (default: false) set to true if the lesson requires an attached microcontroller
  • requireCamera (default: false) set to true if the lesson requires an attached camera
  • requireAudioInput (default: false) set to true if the lesson requires audio input
  • requireAudioOutput (default: false) set to true if the lesson requires audio output

QuestionBaseBlock

(inherits from BaseBlock)

A QuestionBaseBlock has attributes and methods common to question blocks. You do not need to create a QuestionBaseBlock; question blocks you create will automatically inherit the QuestionBaseBlock attributes.

  • points (default: 1) the number of points a student will obtain for answering this question correctly
  • explanation an explanation to be shown after the student answers the question
  • hint an hint to be shown before the student answers the question
  • bold (default: true) if true, the question text will be displayed in bold
  • allowReAnswer (default: false) if true, answer can be changed after checked
  • checkSingle (default: true) if true, will add a button to check just this answer; default is false if on same page as QuizCheckBlock
  • correctCode if specified, this code will be run when the question is answered correctly
  • incorrectCode if specified, this code will be run when the question is answered incorrectly

QuizCheckBlock

(inherits from BaseBlock)

A QuizCheckBlock adds a button that can be used by the student to check the quiz answers (for all questions on the current page). Once the quiz is checked, the answers cannot be changed.

SensorBlock

(inherits from NumericBlock and BaseBlock)

A SensorBlock adds a block that displays sensor values obtained from an external device (Arduino, etc.) connected to the computer.

  • pin (required) the I/O pin number from which to read the values; should be in the [2, 19] range; values 14 to 19 refer to analog inputs 0 to 5
  • offset (default: 0) an offset added to the sensor value (after scaling)
  • scale (default: 1) the sensor value is mulitplied by this value

SerialMonitorBlock

(inherits from BaseBlock)

A SerialMonitorBlock adds a block that allows direct communication with a microcontroller

SliderBlock

(inherits from NumericBlock and BaseBlock)

A SliderBlock displays a slider that the student can use to specify a bounded numeric value. See example.

  • minValue (required) the lower bound on the slider values
  • maxValue (required) the upper bound on the slider values
  • step (default: 1) the step size between each discrete position on the slider
  • showBounds (default: true) if true, displays the lower and upper bounds
  • changeCode this code will be executed whenever the student changes the slider value
  • showValue (default: true) if true, shows the numeric value
  • horizLayout (default: false) if true, places the slider next to the label

SlidingGroupBlock

(inherits from BaseBlock)

A SlidingGroupBlock displays a set of blocks one at a time, with arrow buttons to step through the blocks. See example.

  • children (required) a comma-separated list of block names to be included in the slider group

SpacerBlock

(inherits from BaseBlock)

A SpacerBlock creates an empty space in the page. See example.

  • width (default: 10) the width of the space (in pixels)
  • height (default: 10) the height of the space (in pixels)

StringBlock

(inherits from BaseBlock)

A StringBlock creates a block for displaying a string value. This is similar to a NumericBlock, but intended for text values. See example.

  • minWidth the minimum width of the block in pixels
  • initValue the initial value of the block
  • value the current value of the block (a string)

TableBlock

(inherits from BaseBlock)

A TableBlock creates a table of string or numeric values. Row and column numbers are zero-based. (Row 0 is the first row. Row 1 is the second row. Column 0 is the first column.) See example.

  • rowCount (required) number of rows in table (not including headers)
  • colCount (required) number of colums in table (not including headers)
  • colHeadings comma-separated list of column headings
  • rowHeadings comma-separated list of row headings
  • data each row on a separate line; each line starts with row number, followed by colon, followed by comma-separated list of values; for example ("0: 1, 2, 3"); row numbers start with zero
  • editable (default: false) if true, makes all cells (not including headers) editable
  • buttonCode code to run when student clicks a button in the table; in this code, the row and col variables specify which button was clicked
  • clear() makes all cells empty
  • cellText( row, col ) returns the specified cell as a string
  • cellValue( row, col ) returns the specified cell as a float value
  • setCellText( row, col, text ) sets the text value of the specified cell
  • setCellValue( row, col, value, decimalPlaces ) sets the numeric value of the specified cell
  • setCellColor( row, col, color ) sets the color of the specified cell; color is in HTML form (e.g. "#ff0000" or "#0f0")
  • makeButton( row, col, label ) creates a button in the specified cell with the given label; button clicks will run the code specified in the buttonCode attribute
  • makeEditable( row, col ) make the specified cell editable (input text box)
  • makeCheckBox( row, col ) make the specified cell into a check box
  • allEntered() returns true if all cells have a value
  • selectRow( row, minCol, maxCol ) highlights the cells in the given row, within the given column range
  • setRowHeader( row, header ) sets row header
  • setColHeader( col, header ) sets column header
  • setRowHeaders( header ) sets row headers; use a string with commas ("a,b,c")
  • setColHeaders( header ) sets column header; use a string with commas ("a,b,c")

TextBlock

(inherits from BaseBlock)

A TextBlock adds text to the page. See example.

  • text (required) the text to display
  • fontSize a font size modifier, such as -1, +1, or +2
  • indent (default: 0) amount of indentation (of the entire text block), in pixels
  • setText( text ) sets the block's text contents

TextQuestionBlock

(inherits from QuestionBaseBlock and BaseBlock)

A TextQuestionBlock adds a quiz question with a long free-text answer. This form of question block does not have a pre-specified correct answer. The teacher must grade each question using the teacher tools interface.

  • question (required) the question text
  • minWords (default: 1) the mininum number of words required for the student's answer
  • maxWords (default: 1000) the maximum number of words required for the student's answer
  • lines (default: 4) the number of (blank) lines displayed in the input area
  • bold (default: true) if true, the question text will be displayed in bold

VerticalGroupBlock

(inherits from BaseBlock)

A VerticalGroupBlock contains a set of other blocks, arranged vertically. See example.

  • children (required) a comma-separated list of block names to be included in the group

VideoBlock

(inherits from BaseBlock)

A VideoBlock adds a block that displays a Youtube video. The start and end times may be specified

  • videoId (required) the id of the Youtube video to display.
  • width (default: 640) the width of the video player.
  • height (default: 385) the height of the video player.
  • startTime the time the video should play from in the format "minutes:seconds".
  • endTime the time the video should stop at in the format "minutes:seconds".
  • showControls (default: true) Whether the basic video controls including play/pause and replay should be shown.
  • videoStarted() true if the video has been started, false if it has not.
  • videoDone() true if the video has ended, false if it has not.

VisionBlock

(inherits from NumericBlock and BaseBlock)

A VisionBlock adds a block that displays values computed from a camera/video input.

  • type (required) the type of value to display; current options include: brightness, red, green, blue, xCenter, and yCenter (the available options depend on the version of the browser plugin)
  • scale (default: 1/100) a scale factor applied to the vision values; for spatial values, a scale of 1 gives results in pixels; for brightness/color values, the default scale is 100
© 2015 ManyLabs
Creative Commons License