Class Minimap

Defined in: minimap.js.

Class Summary
Constructor Attributes	Constructor Name and Description
	Minimap(bigCanvas, minimapContainer) Creates a minimap for the big canvas

Field Summary
Field Attributes	Field Name and Description
	bigCanvas The big canvas DOM object (canvas).
	minimapContainer The minimap DOM object (div).
<static>	Minimap.prefferedHeight Preffered/default height
<static>	Minimap.prefferedWidth Preffered/default width
	ratio The ratio between the big map and the small one
<static>	Minimap.scrollBarWidth Scrollbar width 19px is the width added to a scollable area (Zack discovered this into Chrome) We might compute this dimension too but for now it's fine even if we are wrong by a pixel or two
	selected Keeps track it minimap is selected or not
	smallCanvas Reference to small DOM canvas (minimap)

Method Summary
Method Attributes	Method Name and Description
	getBounds() Computes the boundary of minimap relative to the whole page
	getInternalXY(event) Get the (x, y) position relative to current DOM object (minimap div in our case)
	initMinimap() Reset/init ratio and minimap's height
	onScrollMinimap(event) Called when we move over the minimap and the 'minimap' was previously selected
	updateMapPosition() Called by Minimap, usually it just moves/shift the big canvas into the right position
	updateMinimap() Update the minimap (canvas) with a scalled down version of the big map (canvas)
	updateMinimapPosition() Called whenever we scroll the big map/canvas.

Class Detail

Minimap(bigCanvas, minimapContainer)

Creates a minimap for the big canvas
Author: Zack Newsham , Alex Gheorghiu .

Parameters:
{HTMLObject} bigCanvas: (usually the canvas object)
{HTMLObject} minimapContainer: The minimap DOM Object (usually the container DIV)

See:: See /documents/specs/minimap.jpg for a visual representation of the minimap architecture.; See minimap.css to fully understand the CSS positioning

Field Detail

bigCanvas

The big canvas DOM object (canvas). You can get it also by document.getElementById('map')

minimapContainer

The minimap DOM object (div). You can get it also by document.getElementById('minimap')

<static> Minimap.prefferedHeight

Preffered/default height

<static> Minimap.prefferedWidth

Preffered/default width

ratio

The ratio between the big map and the small one

<static> Minimap.scrollBarWidth

Scrollbar width 19px is the width added to a scollable area (Zack discovered this into Chrome) We might compute this dimension too but for now it's fine even if we are wrong by a pixel or two

selected

Keeps track it minimap is selected or not

smallCanvas

Reference to small DOM canvas (minimap)

Method Detail

getBounds()

Computes the boundary of minimap relative to the whole page
Author: Zack, (comments) Alex.

See:: http://www.quirksmode.org/js/findpos.html

{Array} getInternalXY(event)

Get the (x, y) position relative to current DOM object (minimap div in our case)
Author: Zack, (comments) Alex.

Parameters:
{Event} event: - the event triggered

Returns:: {Array} of [x, y] relative position inside DOM object

initMinimap()

Reset/init ratio and minimap's height
Author: Zack, Alex.

onScrollMinimap(event)

Called when we move over the minimap and the 'minimap' was previously selected
Author: Zack.

Parameters:
{Event} event: - the event triggered

updateMapPosition()

Called by Minimap, usually it just moves/shift the big canvas into the right position

updateMinimap()

Update the minimap (canvas) with a scalled down version of the big map (canvas)
Author: Zack TODO: because of this the whole paiting is very slow. We need to optimize it Ideea: make update not real time....but with a delay...1 s for example so instead of hundreds of micro repaint we will have only a few.

updateMinimapPosition()

Called whenever we scroll the big map/canvas. It will update the minimap
Author: Zack.

Classes

Class Minimap