Allow manual firing

[j-hernandez]

I didn't see it anywhere in the docs - I'm curious to know how easy/difficult it would be to allow dynamo to change lines via another event on the page.

For example, I'd like to use dynamo along with a deck of slides - change slides via click/arrow key, and tell dynamo to switch to the next word.

Thoughts? Also: Thanks!

[jdan]

I like this idea. I'll see what I can hack together this weekend.

[lightyrs]

Any luck?

[jdan]

Got something working, just testing it further (and trying to make it more JS-y).

[lightyrs]

Thanks for the quick reply!

[jdan]

0e745a8 d6933ef3

Thanks for recommending this feature, I think it fits really nicely in with everything. So I went ahead and added a pause attribute (data-pause="true") which sets up the dynamo object (placing everything in inline-block divs, styling, etc), but does not transition using the delay attribute.

On top of this, I also extended jQuery to another function, dynamo_trigger. This does exactly what dynamo used to do in a setInterval() (slides up the top element, then places it at the end). In fact, even if the user does not manually fire off transitions, our main dynamo() function actually calls dynamo_trigger() (didn't want to repeat myself!)

So as far as usage goes, simply place data-pause="true" in your dynamo target, then write a hint of javascript later in your document to fire it off. For example.

$('#mytarget').click(function() {
    $(this).dynamo_trigger();
}

It will use the same speed attribute defined in your dynamo target.

[j-hernandez]

Nice! This does exactly what it says on the tin. I did however have to comment out line 13 though. It generates a <span> containing all the elements in data-lines and it was displaying in the dynamo rotation. Manual and automatic firing seems to work ok without that line - can it be safely omitted?

[jdan]

It's bad that I can't even debug my own code - but this was something reported to me on twitter for some strange case (I think it was another JS library include?) Does this show up on the test document? (And could you explain your setup? browser, OS, jQuery version, etc.)

I'm hoping to wipe away this issue once and for all, I honestly have no idea why v.text() would contain all of data-lines.

[j-hernandez]

It was occuring to me in latest Opera/Firefox with jQuery 1.7.2 on Windows 7. It may not help that I am attempting to dynamo a text element that uses a webfont and kerning.js - but I'm not sure why that would cause the extra span.

Test website works fine, fwiw.

[j-hernandez]

I think this is more of an issue with kerning.js. It breaks up all the words into separate containers with a container for each letter within, and I guess it picked up on the data-lines attribute and broke it up. Turning off kerning.js resolves the issue. Off to scratch my head on this one.