Class Papercube.CircleViewHTML
| Extends: | NodeGraph.DragPanMixin, SC.View |
| Defined in: | clients/papercube/views/circleviewhtml.js |
| Version: | 1.0 |
| Author: | Peter Bergstrom |
| Copyright: | 2008-2009 Peter Bergström. |
Overview
This is CircleView, a view for navigating a paper's references.
Property Summary
-
- (DOM Element) _animateElm [R/W]The element that is being animated to the the middle. -
- (Integer) _animateOpacity [R/W]The opacity of the rest of the visualization while animating a paper to the middle. -
- (Integer) _animatePosDeltaD [R/W]Source circle diameter frame delta for animating a paper to the middle. -
- (Integer) _animatePosDeltaX [R/W]Source x position frame delta for animating a paper to the middle. -
- (Integer) _animatePosDeltaY [R/W]Source y position frame delta for animating a paper to the middle. -
- (Integer) _animateSrcD [R/W]Source circle diameter for animating a paper to the middle. -
- (Integer) _animateSrcX [R/W]Source x position for animating a paper to the middle. -
- (Integer) _animateSrcY [R/W]Source y position for animating a paper to the middle. -
- (Integer) _cached_citeThreshold [R/W]Cite threshold cached value. -
- (Integer) _cached_refThreshold [R/W]Ref threshold cached value. -
- (Paper) _cachedContent [R/W]The cached content object. -
- (Integer) _canvasHeight [R/W]Cached height of the view's canvas, set by the displayProperties. -
- (Integer) _canvasWidth [R/W]Cached width of the view's canvas, set by the displayProperties. -
- (String) _detailGUID [R/W]The guid of the detail paper. -
- (Boolean) _displayRefs [R/W]Display references or citations. -
- (Object) _filteredCites [R/W]Filtered citation relations. -
- (Object) _filteredRefs [R/W]Filtered reference relations. -
- (Object) _guidCache [R/W]The cache of guids. -
- (Integer) _h [R/W]Cached height property from displayProperties. -
- (Object) _htmlCache [R/W]The cache of HTML. -
- (Boolean) _isAnimating [R/W]boolean specifying if the view is animating. -
- (Boolean) _isAnimatingToMiddle [R/W]Is YES when you're animating to the middle. -
- (String) _lastContentGUID [R/W]The guid of the last center paper, to avoid unnecessary loading of data. -
- (Object) _lineColorCache [R/W]Color cache for the top level lines. -
- (Integer) _maxCites [R/W]The maximum number of citations in the visualization. -
- (Integer) _maxRefs [R/W]The maximum number of references in the visualization. -
- (Integer) _minCites [R/W]The minimum number of citations in the visualization. -
- (Integer) _minRefs [R/W]The minimum number of references in the visualization. -
- (DOM Element) _mouseDownCircle [R/W]The DOM element of the last clicked paper. -
- (String) _mouseDownGUID [R/W]The guid of the last clicked paper or author. -
- (Integer) _numberOfFirstCircles [R/W]Stored value of the number of first level circles to be displayed. -
- (Integer) _numberOfFirstCites [R/W]Stored value of the number of first level citations. -
- (Integer) _numberOfFirstRefs [R/W]Stored value of the number of first level references. -
- (String) _rotateFromGUID [R/W]Departure guid during rotation. -
- (String) _rotateToGUID [R/W]Destination guid during rotation. -
- (Boolean) _rotatingLeft [R/W]boolean specifying that the visualization is rotating left. -
- (Boolean) _rotatingRight [R/W]boolean specifying that the visualization is rotating right. -
- (Integer) _rotationSpeed [R/W]The rotation speed. -
- (Integer) _sAngle [R/W]The angle of the detail paper. -
- (String) _selection [R/W]The currently selected guid. -
- (Boolean) _showingMetaData [R/W]boolean that determines if the meta data box is showing or not. -
- (DOM Element) _styleSheet [R/W]Cached stylesheet reference. -
- (Integer) _tAIncr [R/W]The number of degrees per frame. -
- (Integer) _twoPI [R/W]2*PI saved so that we don't have to do it all over the place. -
- (Integer) _w [R/W]Cached width property from displayProperties. -
- (Integer) _x [R/W]Cached x-axis offset property from displayProperties. -
- (Integer) _xC [R/W]The local x-axis center of the view. -
- (Integer) _y [R/W]Cached y-axis offset property from displayProperties. -
- (Integer) _yC [R/W]The local y-axis center of the view. -
- (Object) canvas [R/W]Canvas tag DOM element. -
- (Integer) citeThresholdBinding [R/W]Bind the cite threshold binding. -
- (Array) displayPropertiesBinding [R/W]Bind the display properties from the canvasController. -
- (Object) divCanvas [R/W]HTML canvas DOM element. -
- (Object) metaDataView [R/W]The DOM element that contains the meta data for an item. -
- (Object) outlets [R/W]Outlets for CircleView. -
- (Integer) refThresholdBinding [R/W]Bind the ref threshold binding. -
- (Object) rotateLeftButton [R/W]"rotateLeftButton" for button to initiate rotation to the left. -
- (Object) rotateRightButton [R/W]"rotateRightButton" for button to initiate rotation to the left. -
- (String) viewDirectionBinding [R/W]Bind the view direction from the viewController.
Method Summary
-
- (Boolean) _createLargeText(record, type)Given a record, create the text DIV for a large circle. -
- (Boolean) _createSmallText(record)Given a record, create the text DIV for a small circle. -
- (void) _cRotationSpeed(dist)Determine the speed of the rotation depending on the distance from paper A to paper B if passed in. -
- (Array) _filterByRels(content, forceCites)Filters based on the cite and ref threshold and then caches the values. -
- (Array) _genCircle(childNode, guid, cacheStr, lineColor)Generate a circle DIV element. -
- (void) _hideMetaData()Hide meta data box. -
- (Integer) _lineColor(count, isRef)Pick a line color. -
- (Boolean) _render()This is the rendering driver. -
- (Boolean) _renderOneDepth()Render the first and second level papers. -
- (Boolean) _renderZeroDepth()Render the main paper. -
- (Boolean) _setPaperRefVisibilty(show, guid)Given a paper guid, show or hide it. -
- (void) _setProperties(x, y, r, className, lineWidth, guid)Set the class name and style attributes for a circle DIV element. -
- (Boolean) _setSecondLevelVisibility(show)Hide or show the second level circles. -
- (Boolean) _showMetaData()Show meta data for paper! -
- (void) action()Rotate to the right. -
- (Boolean) animateToMiddle(guid)Initiate an animation to the middle. -
- (Boolean) displayPropertiesDidChange(force)When the displayProperities binding changes, update the view appropriately. -
- (void) doAnimateToMiddle(frame)Perform the animation from detail paper to main paper. -
- (void) init()Initalization function. -
- (Boolean) mouseDown(evt)There are various operations that happend on mouseDown. -
- (Boolean) mouseMoved(evt)If the mouse is moved on top of the view, see if there is any meta data to show. -
- (Boolean) redrawParamsDidChange()Redraw based on 'content', 'isVisible', 'viewDirection', 'refThreshold', 'citeThreshold' binding changes. -
- (Boolean) retrieveLevelDone()When a level is retrieved from the server, redraw the view. -
- (void) rotateLeft(hasGUID)Rotate to the left. -
- (void) rotateRight(hasGUID)Rotate to the right. -
- (void) rotateTo(guid)Given a guid, find the shortest path and rotate the circle to it in that direction. -
- (void) stopRotation(doNotRender)Stop the rotation.
Property Details
_animateOpacity [R/W]
The opacity of the rest of the visualization while animating a paper to the middle.
- Integer _animateOpacity
Default Value: 100
_animatePosDeltaD [R/W]
Source circle diameter frame delta for animating a paper to the middle.
- Integer _animatePosDeltaD
Default Value: 0px
_animatePosDeltaX [R/W]
Source x position frame delta for animating a paper to the middle.
- Integer _animatePosDeltaX
Default Value: 0px
_animatePosDeltaY [R/W]
Source y position frame delta for animating a paper to the middle.
- Integer _animatePosDeltaY
Default Value: 0px
_animateSrcD [R/W]
Source circle diameter for animating a paper to the middle.
- Integer _animateSrcD
Default Value: 0px
_animateSrcX [R/W]
Source x position for animating a paper to the middle.
- Integer _animateSrcX
Default Value: 0px
_animateSrcY [R/W]
Source y position for animating a paper to the middle.
- Integer _animateSrcY
Default Value: 0px
_cached_citeThreshold [R/W]
Cite threshold cached value.
- Integer _cached_citeThreshold
Default Value: 1
_cached_refThreshold [R/W]
Ref threshold cached value.
- Integer _cached_refThreshold
Default Value: 1
_canvasHeight [R/W]
Cached height of the view's canvas, set by the displayProperties.
- Integer _canvasHeight
Default Value: 600px
_canvasWidth [R/W]
Cached width of the view's canvas, set by the displayProperties.
- Integer _canvasWidth
Default Value: 800px
_isAnimating [R/W]
boolean specifying if the view is animating.
- Boolean _isAnimating
Default Value: NO
_isAnimatingToMiddle [R/W]
Is YES when you're animating to the middle.
- Boolean _isAnimatingToMiddle
Default Value: NO
_lastContentGUID [R/W]
The guid of the last center paper, to avoid unnecessary loading of data.
- String _lastContentGUID
_maxCites [R/W]
The maximum number of citations in the visualization.
- Integer _maxCites
Default Value: 0
_maxRefs [R/W]
The maximum number of references in the visualization.
- Integer _maxRefs
Default Value: 0
_minCites [R/W]
The minimum number of citations in the visualization.
- Integer _minCites
Default Value: 0
_minRefs [R/W]
The minimum number of references in the visualization.
- Integer _minRefs
Default Value: 0
_numberOfFirstCircles [R/W]
Stored value of the number of first level circles to be displayed.
- Integer _numberOfFirstCircles
Default Value: 0
_numberOfFirstCites [R/W]
Stored value of the number of first level citations.
- Integer _numberOfFirstCites
Default Value: 0
_numberOfFirstRefs [R/W]
Stored value of the number of first level references.
- Integer _numberOfFirstRefs
Default Value: 0
_rotatingLeft [R/W]
boolean specifying that the visualization is rotating left.
- Boolean _rotatingLeft
Default Value: NO
_rotatingRight [R/W]
boolean specifying that the visualization is rotating right.
- Boolean _rotatingRight
Default Value: NO
_rotationSpeed [R/W]
The rotation speed.
- Integer _rotationSpeed
Default Value: 1px
Discussion
Default is 1x depending on the angle. It slows down when it is about to stop.
_showingMetaData [R/W]
boolean that determines if the meta data box is showing or not.
- Boolean _showingMetaData
Default Value: NO
canvas [R/W]
Canvas tag DOM element.
- Object canvas
Discussion
Contains the lines. Bound to the '.canvas?' element.
citeThresholdBinding [R/W]
Bind the cite threshold binding.
- Integer citeThresholdBinding
Bound To: "Papercube.circleViewController.citeThreshold"
Discussion
Don't show papers with less cites.
displayPropertiesBinding [R/W]
Bind the display properties from the canvasController.
- Array displayPropertiesBinding
Bound To: "Papercube.canvasController.displayProperties"
divCanvas [R/W]
HTML canvas DOM element.
- Object divCanvas
Discussion
Contains the text and circles. Bound to the '.div-canvas?' element.
metaDataView [R/W]
The DOM element that contains the meta data for an item.
- Object metaDataView
Discussion
Bound to the '.meta-data?' element.
refThresholdBinding [R/W]
Bind the ref threshold binding.
- Integer refThresholdBinding
Bound To: "Papercube.circleViewController.refThreshold"
Discussion
Don't show papers with less refs.
rotateLeftButton [R/W]
"rotateLeftButton" for button to initiate rotation to the left.
- Object rotateLeftButton
rotateRightButton [R/W]
"rotateRightButton" for button to initiate rotation to the left.
- Object rotateRightButton
viewDirectionBinding [R/W]
Bind the view direction from the viewController.
- String viewDirectionBinding
Bound To: "Papercube.viewController.viewDirection"
Method Detail
_createLargeText()
Given a record, create the text DIV for a large circle.
- (Boolean) _createLargeText (record, type)
Parameters
record {Paper} The content object.
type {string} The type of circle. Can be 'large', 'detail', or 'medium'.
Returns
(Boolean) Returns NO if there is no content.
Discussion
Prints Title, authors, references, and citations.
_createSmallText()
Given a record, create the text DIV for a small circle.
- (Boolean) _createSmallText (record)
Parameters
record {Paper} The content object.
Returns
(Boolean) Returns NO if there is no content.
_cRotationSpeed()
Determine the speed of the rotation depending on the distance from paper A to paper B if passed in.
- (void) _cRotationSpeed (dist)
Parameters
dist {Integer} If specified, it is the distance from A to B.
_filterByRels()
Filters based on the cite and ref threshold and then caches the values.
- (Array) _filterByRels (content, forceCites)
Parameters
content {Paper} The content object.
forceCites {boolean} If YES, always return citations no matter of the value of the _displayRefs.
Returns
(Array) Returns an array containing relations for a given content object.
Discussion
Cache is invalidated when thresholds change.
_genCircle()
Generate a circle DIV element.
- (Array) _genCircle (childNode, guid, cacheStr, lineColor)
Parameters
(DOM Element)childNode A child node to append to the circle. This is usually a text element.
guid {string} The guid of the paper.
cacheStr {string} The guid cache string.
lineColor {string} The line color
Returns
(Array) {DOM Element} Returns the newly generated circle DIV element.
_lineColor()
Pick a line color.
- (Integer) _lineColor (count, isRef)
Parameters
count {Integer} The relation count.
isRef {boolean} True if it is a reference, NO if it is a citation.
Returns
(Integer) Returns the calculated hex color.
Discussion
This is a gradient.
_render()
This is the rendering driver.
- (Boolean) _render ()
Returns
(Boolean) Returns NO if there the view is not visible.
_renderOneDepth()
Render the first and second level papers.
- (Boolean) _renderOneDepth ()
Returns
(Boolean) Returns NO if there is no content.
_renderZeroDepth()
Render the main paper.
- (Boolean) _renderZeroDepth ()
Returns
(Boolean) Returns NO if there is no content.
_setPaperRefVisibilty()
Given a paper guid, show or hide it.
- (Boolean) _setPaperRefVisibilty (show, guid)
Parameters
show {boolean} If YES, show circle, otherwise hide.
guid {string} The guid of the paper.
Returns
(Boolean) Returns NO if there is no content.
_setProperties()
Set the class name and style attributes for a circle DIV element.
- (void) _setProperties (x, y, r, className, lineWidth, guid)
Parameters
x {Integer} x-position in pixels.
y {Integer} y-position in pixels.
r {Integer} radius in pixels.
className {string} The class name for the div.
lineWidth {Integer} The width of the border line.
guid {string} The guid of the paper.
_setSecondLevelVisibility()
Hide or show the second level circles.
- (Boolean) _setSecondLevelVisibility (show)
Parameters
show {boolean} If YES, show circles, otherwise hide.
Returns
(Boolean) Returns NO if there is no content.
_showMetaData()
Show meta data for paper!
- (Boolean) _showMetaData ()
Returns
(Boolean) Returns NO if there is no content.
animateToMiddle()
Initiate an animation to the middle.
- (Boolean) animateToMiddle (guid)
Parameters
guid {string} The guid of the paper to animate.
Returns
(Boolean) Returns NO if there is no element.
Discussion
Basically move from detail paper to main paper.
displayPropertiesDidChange()
When the displayProperities binding changes, update the view appropriately.
- (Boolean) displayPropertiesDidChange (force)
Parameters
force {boolean} If YES, force a redraw.
Returns
(Boolean) Returns NO if there is no guid of if the view is not visible.
Observes
displayProperties
doAnimateToMiddle()
Perform the animation from detail paper to main paper.
- (void) doAnimateToMiddle (frame)
Parameters
frame {Integer} The current frame.
init()
Initalization function.
- (void) init ()
Discussion
Set up the canvas and rotation buttons.
Set up the fan menu actions:
smallFan: { CiteSeer: citeseerFunc, Save: saveFunc, Refocus: refocusFunc, "Zoom +": zoomInFunc, "Zoom -": zoomOutFunc }, mediumFan: { CiteSeer: citeseerFunc, Save: saveFunc, Refocus: refocusFunc, Detail: detailFunc, "Zoom +": zoomInFunc, "Zoom -": zoomOutFunc }, largeFan: { CiteSeer: citeseerFunc, Save: saveFunc, "Zoom +": zoomInFunc, "Zoom -": zoomOutFunc }, detailFan: { CiteSeer: citeseerFunc, Save: saveFunc, Refocus: refocusDetailFunc, "Zoom +": zoomInFunc, "Zoom -": zoomOutFunc }
mouseDown()
There are various operations that happend on mouseDown.
- (Boolean) mouseDown (evt)
Parameters
(DOM Event)evt The mouseDown event.
Returns
(Boolean) Returns NO if the view is not visible.
Discussion
If it is a detail paper, then animate it to the middle. If it is a first level reference, make it the detail paper. If it is a second level reference, refocus to that immediately.
mouseMoved()
If the mouse is moved on top of the view, see if there is any meta data to show.
- (Boolean) mouseMoved (evt)
Parameters
(DOM Event)evt The mouseMoved event.
Returns
(Boolean) Returns NO if there is no guid of if the view is not visible.
redrawParamsDidChange()
Redraw based on 'content', 'isVisible', 'viewDirection', 'refThreshold', 'citeThreshold' binding changes.
- (Boolean) redrawParamsDidChange ()
Returns
(Boolean) Returns NO if there is no guid of if the view is not visible.
Observes
content
isVisible
viewDirection
refThreshold
citeThreshold
retrieveLevelDone()
When a level is retrieved from the server, redraw the view.
- (Boolean) retrieveLevelDone ()
Returns
(Boolean) Returns NO if there is no content.
rotateLeft()
Rotate to the left.
- (void) rotateLeft (hasGUID)
Parameters
hasGUID {boolean} If YES, that means that there is a guid to rotate to.
Discussion
If the hasGUID property is YES, rotate to a destination guid. Otherwise, rotate to the next one.
rotateRight()
Rotate to the right.
- (void) rotateRight (hasGUID)
Parameters
hasGUID {boolean} If YES, that means that there is a guid to rotate to.
Discussion
If the hasGUID property is YES, rotate to a destination guid. Otherwise, rotate to the next one.
rotateTo()
Given a guid, find the shortest path and rotate the circle to it in that direction.
- (void) rotateTo (guid)
Parameters
guid {string} The guid to rotate to.
stopRotation()
Stop the rotation.
- (void) stopRotation (doNotRender)
Parameters
doNotRender {boolean} If YES, do not re-render the visualization.
Discussion
Then, if desired, render the view.