-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Ten frame nodes can be dragged out of the icon, see #2
- Loading branch information
Showing
6 changed files
with
244 additions
and
35 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,38 @@ | ||
| // Copyright 2019, University of Colorado Boulder | ||
|
|
||
| /** | ||
| * The model information for a DraggableTenFrameNode | ||
| * | ||
| * @author Chris Klusendorf (PhET Interactive Simulations) | ||
| */ | ||
| define( require => { | ||
| 'use strict'; | ||
|
|
||
| // modules | ||
| const numberPlay = require( 'NUMBER_PLAY/numberPlay' ); | ||
| const TenFrameNode = require( 'NUMBER_PLAY/common/view/TenFrameNode' ); | ||
| const Vector2Property = require( 'DOT/Vector2Property' ); | ||
|
|
||
| class TenFrame { | ||
|
|
||
| /** | ||
| * @param {number} sideLength - see doc below | ||
| * @param {Vector2} initialPosition | ||
| */ | ||
| constructor( squareSideLength, initialPosition ) { | ||
|
|
||
| // @public {number} - the side length of the squares that make up the ten frame | ||
| this.squareSideLength = squareSideLength; | ||
|
|
||
| // @public {Vector2[]} | ||
| this.spotCenters = TenFrameNode.getSpotCenters( { | ||
| sideLength: squareSideLength | ||
| } ); | ||
|
|
||
| // @public {Vector2Property} | ||
| this.positionProperty = new Vector2Property( initialPosition ); | ||
| } | ||
| } | ||
|
|
||
| return numberPlay.register( 'TenFrame', TenFrame ); | ||
| } ); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,60 @@ | ||
| // Copyright 2019, University of Colorado Boulder | ||
|
|
||
| /** | ||
| * A ten frame node that can be dragged around and hold play objects. | ||
| * | ||
| * @author Chris Klusendorf (PhET Interactive Simulations) | ||
| */ | ||
| define( require => { | ||
| 'use strict'; | ||
|
|
||
| // modules | ||
| const DragListener = require( 'SCENERY/listeners/DragListener' ); | ||
| const Node = require( 'SCENERY/nodes/Node' ); | ||
| const numberPlay = require( 'NUMBER_PLAY/numberPlay' ); | ||
| const TenFrameNode = require( 'NUMBER_PLAY/common/view/TenFrameNode' ); | ||
| const Vector2 = require( 'DOT/Vector2' ); | ||
|
|
||
| class DraggableTenFrameNode extends Node { | ||
|
|
||
| /** | ||
| * @param {number} sideLength - see doc below | ||
| * @param {Vector2} initialPosition | ||
| */ | ||
| constructor( tenFrame, modelViewTransform, dropListener ) { | ||
| super(); | ||
|
|
||
| // @public {TenFrame} | ||
| this.tenFrame = tenFrame; | ||
|
|
||
| const tenFrameNode = TenFrameNode.getTenFramePath( { | ||
| sideLength: tenFrame.squareSideLength | ||
| } ); | ||
| tenFrameNode.center = new Vector2( 0, -tenFrameNode.height / 2 ); | ||
| this.addChild( tenFrameNode ); | ||
|
|
||
| // @public {DragListener} | ||
| this.dragListener = new DragListener( { | ||
| targetNode: this, | ||
| transform: modelViewTransform, | ||
| locationProperty: tenFrame.positionProperty, | ||
| end: () => { | ||
| dropListener(); | ||
| } | ||
| } ); | ||
|
|
||
| this.cursor = 'pointer'; | ||
| // TODO: add a 'dragging' bar and make only that have a forwarding listener | ||
| this.inputListeners = [ DragListener.createForwardingListener( event => { | ||
| this.dragListener.press( event, this ); | ||
| this.moveToFront(); | ||
| } ) ]; | ||
|
|
||
| tenFrame.positionProperty.link( position => { | ||
| this.translation = modelViewTransform.modelToViewPosition( position ); | ||
| } ); | ||
| } | ||
| } | ||
|
|
||
| return numberPlay.register( 'DraggableTenFrameNode', DraggableTenFrameNode ); | ||
| } ); |
Oops, something went wrong.