Skip to content

Commit

Permalink
move common tangible code to tangible repo,
Browse files Browse the repository at this point in the history
  • Loading branch information
zepumph committed Apr 7, 2020
1 parent bef2d84 commit 0f876e6
Show file tree
Hide file tree
Showing 6 changed files with 91,938 additions and 0 deletions.
38 changes: 38 additions & 0 deletions js/MarkerInput.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,38 @@
// Copyright 2020, University of Colorado Boulder

/**
* This file is to prototype mechamarkers as an input controller to a phetsim, see https://github.com/phetsims/a11y-research/issues/153
* @author Michael Kauzmann (PhET Interactive Simulations)
*/

// modules
import tangible from './tangible.js';
import timer from '../../axon/js/timer.js';

class MarkerInput {

/**
* @param {function(Mechamarkers)} updateFunction
*/
static init( updateFunction ) {

function update() {

// Mechamarkers stuff
window.Mechamarkers.update( Date.now() );

updateFunction( window.Mechamarkers );

}

timer.addListener( update );

const canvas = document.createElement( 'canvas' );
const ctx = canvas.getContext( '2d' );
document.body.appendChild( canvas );
window.Mechamarkers.init( canvas, ctx );
}
}

tangible.register( 'MarkerInput', MarkerInput );
export default MarkerInput;
60 changes: 60 additions & 0 deletions js/SliderGroupMarker.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,60 @@
// Copyright 2020, University of Colorado Boulder

/**
* A class for a slider mechamarkers input group set up to control an AXON/Property
* @author Michael Kauzmann (PhET Interactive Simulations)
*/

// modules
import tangible from './tangible.js';
import merge from '../../phet-core/js/merge.js';

class SliderGroupMarker {

/**
*
* @param {string} inputGroup
* @param {string} inputName
* @param {Property.<number>} property
* @param {Object} [options]
*/
constructor( inputGroup, inputName, property, options ) {
options = merge( {

// {Range} By default use the range from the Property
range: property.range
}, options );

assert && assert( options.range, 'options.range needs to be provided, or Property.range supplied.' );

// private
this.inputGroup = inputGroup;
this.inputName = inputName;
this.property = property;
this.range = options.range;
}

/**
* Set the value based on the range of the property
* @param {number} inputValue - output from mechamarkers, between 0 and 1
* @private
*/
setProperty( inputValue ) {
this.property.value = inputValue * this.property.range.getLength() + this.property.range.min;
}

/**
* Update the state of the slider, setting the Property value if applicable
* @public
*/
update() {
const group = window.Mechamarkers.getGroup( this.inputGroup );
if ( group && group.anchor.present ) {
const value = group.getInput( this.inputName ).val;
this.setProperty( value );
}
}
}

tangible.register( 'SliderGroupMarker', SliderGroupMarker );
export default SliderGroupMarker;
11 changes: 11 additions & 0 deletions js/preload/.eslintrc.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
// Copyright 2020, University of Colorado Boulder
// @author Michael Kauzmann

'use strict';

module.exports = {

"extends": "../../../chipper/eslint/sim_es6_eslintrc.js",

"ignorePatterns": [ "mechamarkers-*.js" ] // don't lint 3rd party library file
};
12 changes: 12 additions & 0 deletions js/preload/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@



### Mechamarkers as an input controller to PhET Interactive Simulations


Beginning in early 2020, the PhET accessibility team began to prototype and research using tangibles
to interact with a phetsim. This folder houses the code to begin this process within the confines of
Gravity Force Lab.

It relies on the mechamarkers library (https://github.com/atlas-acme-lab/mechamarkers-boilerplate/)
and uses specific markers to control the simulation.
Loading

0 comments on commit 0f876e6

Please sign in to comment.