Loop dragged image sequence


I have a series of 24 images of a molecule model that I can can drag back and forth so it looks like i am rotating the model. I would like to have it be able to turn infinitely in both directions. Right now it stops at the beginning and end of the timeline. Which is OK, but the other way would be nicer. I’ve included the sample project.

Thanks so much.
Mauriceobject_vr.zip (1.1 MB)

hello @pugscanfly or Maurice :),

i’ve changed your document
a bit and added a script onsymboldrag:

//store vars, could be optimized to just store once ...
var step = 0.0333, 
timelineName = 'turn',
symbol = hypeDocument.getSymbolInstanceById('c2h6one'), 
currTime = symbol.currentTimeInTimelineNamed(timelineName),
duration = symbol.durationForTimelineNamed(timelineName),

if(event['hypeGesturePhase'] === hypeDocument.kHypeGesturePhaseStart) {
//pause the timeline on dragstart
//gest startX on gestureStart
window.previous = event['hypeGestureXPosition'];

if(event['hypeGesturePhase'] === hypeDocument.kHypeGesturePhaseMove) 
//get x on further dragMove
var  next = event['hypeGestureXPosition'];

//check direction
if(window.previous > next){ 
currTime = currTime - step; 
//if timeline out of range step to end
if(currTime < 0){currTime = duration};


currTime = currTime + step;  
//if timeline out of range step to start
if(currTime > duration){currTime = 0};


//new startX for further dragmovement
window.previous = next;

//finally go to new time
symbol.goToTimeInTimelineNamed(currTime, timelineName)

if(event['hypeGesturePhase'] === hypeDocument.kHypeGesturePhaseEnd) 
//restart timline when drag ends
symbol.continueTimelineNamed(timelineName, hypeDocument.kDirectionForward, false)

object_vr.hype.zip (1.1 MB)


Hello Hans, this is fantastic! Thank you for the help. One question, how do I have it only turn when I drag? The rest of the time it is stationary? Thank you so much for your time.


Remove The behaviours on The Timelines within the symbol…