controllerLookAt


lookAt(target_id, target_dz, quickness, 
       face_angle, event_precision)

lookAt.messages = []
lookAt.events   = [start, end]

Description

Rotates the element in the 2D plane (around its Z axis) in such a way that it always faces with the same side another target element. Which side is the 'face' of the element (that is always oriented towards the target) can be set via the face_angle parameter. The parameter quickness controls how quickly the element rotates.

If parameter target_dz is different than 0, the "look at" effect becomes 3D, where the element is rotated in 3D space around its X and Y axes.

Applies one rotate transform.

Parameters

Visit page Controller # Common Parameters for documentation on the parameters, common to all controllers: id, paused and disabled.

Parameters of lookAt():

target_id: DOM node ID of the element that serves as a target to look at. You can change this parameter at any time, making the element turn towards and start looking at another target. Default value: ""
target_dz: Supplies a fixed Z-axis displacement of the target, relative to this element, enabling "looking" at the target in 3D space. When of value 0 (the default), the target is "looked-at" in 2D space, where this element is rotated around its Z axis (2D rotation). When target_dz is different than 0, the element is rotated in 3D space around its X and Y axes. Default value: 0
quickness: How quickly to follow the required orientation. Values should be in the range (0 - 1), where a value of 0 means indefinitely slowly, and a value of 1 - instantly. Default value: 0.2
face_angle: Angle [0 - 360) defining which side of the element is its face (that should face the target). Default face (face_angle = 0) is the left-hand side of the element. Default value: 0
event_precision: Precision, measured in rotation degrees, to use when measuring if the element has started or ended rotating. A value of 1 means that a start event will be fired when the controller has to rotate the element more than 1 degree, and the end event will be fired when the element has reached the target orientation within 1 degree. Default value: 1

Accepted Messages

Visit page Controller # Common Messages for documentation on the messages, accepted by all controllers: pause, unpause, enable, disable, params and remove.

Messages specific to lookAt(): none

Generated Events

Visit page Controller # Common Events for documentation on the events, generated by all controllers: frame, remove, paused, unpaused enabled and disabled.

Events fired by lookAt():

start: Fired upon the start of rotation of the element when the element has to rotate more than event_precision degrees. If the element has to rotate less than event_precision degrees, the event will not be fired. Event params: none
end: Fired upon reaching the required orientation within event_precision degrees. Event params: none

Interaction with DOM

Transforms: Applies one rotate transform.
CSS: Works with any styling. Does not set any style properties.
Events: Does not set event listeners.

Changes Log

Controller introduced in v.0.80