controllerRotate

rotate(x, y, z, duration, angle, init_angle, marked_angle, repeat_start_pos, register_actions, half_step, spring_acc, spring_vdamp, ease_type, ease_amount, ease_mirror) rotate.messages = [start, start_back, start_reverse, start_new, start_new_back, pos0, pos1] rotate.events = [start, half, end, cycle, mark, start_back, half_back, end_back, cycle_back, mark_back, pos0, pos1]

Description

element

Performs a rotation animation, rotating the element around its own axis in a direction supplied by the parameters x, y and z. The amount of rotation is supplied by the parameter angle. The last performed rotation is remembered and at any time during or after it you can order performing it backwards or repeat it.

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 rotate():

duration
Duration of the animation in milliseconds. Default value: 1000
x, y, z
Components of a 3D vector giving the orientation of rotation. The absolute values of the components are not important, only the relations between them are, as the vector is normalized. This vector supplies only the orientation of the rotation. The amount of rotation is supplied by the parameter angle. Default values: 0, 0, 0
angle
Angle (in degrees) specifying the amount of rotation to animate. The starting position (angle) can be supplied with the init_angle parameter. Default value: 0
init_angle
Set initial position (angle) of rotation. Note that the initial rotation will be applied immediately (when the controller is enabled), not waiting for the rotation to be started with any of the start messages. Default value: 0
marked_angle
If different than -1, then the controller will fire event mark each time the rotation passes through this absolute angle. Default value: -1
repeat_start_pos
If true, then every start or start_back message will start a forward/reverse movement from the direction's starting position. If false (by default), then sending these messages when a movement is already started will continue the current movement (if already moving in the same direction), or will start a movement in the opposite direction, but continuing from the current position. This parameter has no effect on the start_new or start_new_back messages, as they start a new movement from the current position in all cases. Default value: false
register_actions
Tells whether to handle the element's show, hide, show_immediately and hide_immediately actions.
Values: false / true / "500" (i.e. react with 500 milliseconds delay) / "500 elm" (i.e. set event handlers with delay 500ms for HTML element #elm's actions). Default value: false
half_step
If set to less than 1, each frame the current angle will step closer to the required angle, where step = half_step * distance_to_required_angle. Values in the range (0 - 1) make sense. Default value: 1
spring_acc
If bigger than 0, the animated angle will behave as if attached to a spring. Bigger values of spring_acc result in stronger pulling of the "spring" and faster motion (i.e. shorter spring period). Note that setting too high of a value will cause a self-amplifying spring motion of the animated angle. What is the highest value before the positive feedback kicks in depends on the value of spring_vdamp, but values up to 2 are always safe. Default value: 0
spring_vdamp
When spring motion is enabled via parameter spring_acc, every frame the current speed of the spring is multiplied by this parameter, effectively slowing the spring motion. Values between 0 and 1 are reasonable, where smaller values result in faster dying of the spring motion and a value of 1 means absolute elasticity of the spring. Default value: 0.92
ease_type
What kind of 'easing' to be applied on the movement.
Currently supported values:
  • "linear" - constant speed in all movement parts,
  • "ease" - slower start and end of movement, elliptical shape,
  • "ease_in" - slower start, fast and sudden end,
  • "ease_out" - fast and sudden start, slow end.
Default value: "ease"
ease_amount
Strength of 'easing' to be applied on the movement.
Values in the range (0 - 1] make sense, though values greater than 1 (up to 2-3) can also be of use. Default value: 1
ease_mirror
Tells if the easing applied on 'backwards' movement is the same as the forward easing, or mirrored. If this parameter is set to true and parameter ease_type is "ease_in", then upon a backwards movement, "ease_out" easing will be applied. Default value: false

Accepted Messages

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

Message Parameters: Note that along the message parameters specific to each message type, every message (not only params) accepts as parameters any of the controller parameters, which are set before the message is executed.

Messages accepted by rotate():

start
Starts a rotation from the current angle to the target angle. The message has no effect if already in the target angle or rotating towards it. If currently rotating in the 'backwards' direction (from the target to the starting angle, ordered with messages start_back and start_new_back), then the rotation direction will be switched to 'forwards' and the 'forward' rotation will continue from the current angle to the target angle. Message params: none
start_back
Starts a 'backwards' rotation from the current angle to the starting angle of the current forward rotation. The message has no effect if already in the starting angle or rotating towards it. Message params: none
start_reverse
Start rotating in the reverse direction within the current (or last) rotation. Message params: none
start_new
Same as the start message, but does not continue a current rotation. It always starts a new rotation from the current angle to the supplied target angle. Message params: none
start_new_back
Start the 'backwards' motion (i.e. starting from the target angle) of a new rotation. So, calling controller.message('start_new_back', {angle: 20}) will cause the element to jump 20 deegrees clockwise and then start rotating backwards to the current angle. Message params: none
pos0
Position the element in the starting angle of the current rotation immediately. Message params: none
pos1
Position the element in the target angle of the current rotation immediately. Message params: 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 rotate():

start
Fired upon starting a (forward) rotation, as long as not already on the target angle. Event params: none
half
Fired upon reaching the middle of the current (forward) rotation. Event params: none
end
Fired upon reaching the end of the current (forward) rotation. Event params: none
cycle
When performing a rotation of an angle greater in absolute value than 360 degrees, this event is fired upon passing every 360 degrees (full turn) counting from the starting angle of the rotation. Event params: none
mark
If parameter marked_angle is supplied (i.e. is different than -1), then this event is fired upon every passing of this marked angle. The value of the angle is absolute, and not relative to the starting angle for the rotation. Event params: none
start_back
Fired upon start of 'backwards' rotation. Event params: none
half_back
Fired upon reaching the middle of the current 'backwards' rotation. Event params: none
end_back
Fired upon reaching the end of the current 'backwards' rotation. Event params: none
cycle_back
Same as the cycle event, but is fired when performing a 'backwards' rotation. Note that the event is fired on every passing of the starting angle of the current 'forward' rotation, not on every passing of 360 degrees counting from the start of the 'backwards' rotation. Event params: none
mark_back
Same as the mark event, but is fired when performing a 'backwards' rotation. Event params: none
pos0
Fired upon reaching the starting angle when rotating 'backwards', i.e. it is fired when end_back is fired. Event params: none
pos1
Fired upon reaching the target angle when rotating forward, i.e. it is fired when end is fired. Event params: none

Interaction with DOM

Changes Log

  1. Controller introduced in v.0.80

See Also