javascript - Reusing the same block helper in Meteor causes odd context issue -

i'm attempting reuse custom block helper wrote provide basic carousel functionality of templates.

simple-carousel.html

<template name="simplecarousel">   <div class="simple-carousel {{class}}">     <div class="slides">       {{#each slides}}         {{> ui.contentblock this}}       {{/each}}     </div>     {{#if showcontrols}}       {{> simplecarouselcontrols}}     {{/if}}   </div> </template>  <template name="simplecarouselcontrols">   // control structure here </template> 

simple-carousel.js

var actions = {   back: function() {     // move slide once   },   forward: function() {     // move slide forward once   } };  var showslide = function() {    // code show next slide  };  template.simplecarousel.onrendered(function() {   // set carousel logic here });  template.simplecarousel.events({   'click [data-sc-move="forward"]': function() {       actions.forward();   },   'click [data-sc-move="back"]': function() {       actions.back();   } }); 

breaking_stories.html

<template name="breakingstories">   {{#simplecarousel class="breaking-stories" showcontrols=false autoforward=8000 slides=breakingstories}}     {{> breakingstoryslide}}   {{/simplecarousel}} </template>  <template name="breakingstoryslide">   <div class="breaking-story slide">     <div class=breaking-story-title">{{title}}</div>   </div> </template> 

breaking_stories.js

template.breakingstories.helpers({   breakingstories: function() {     return breakingstories.find();   } }); 

daily_summary.html

<template name="dailysummary">   {{#with thisdailysummary}}     {{#simplecarousel class="daily-summaries" showcontrols=true slides=items}}       {{> dailysummaryslide}}     {{/simplecarousel}}   {{/with}} </template>  <template name="dailysummaryslide">   <div class="daily-summary slide">     <div class="daily-summary-title">{{title}}</div>   </div> </template> 

i've tried simplify code there lot more html involved in templates. anyway, can see i've defined #simplecarousel block helper , used in 2 places: breaking stories section, , daily summaries section. these 2 templates happen on same page (route), near each other on page. need 1 of them auto cycle through, in i've provided autoforward property helper, , other 1 should show controls.

both templates render fine , show correct data, problem lies in instead of breaking news template doing automatic cycling, other 1 (and twice), if sharing same context.

my question is, can use custom block helpers multiple times on same route safely? i'm open suggestions on how better/different way.

thanks @jeremyk pointing me in right direction; happened exact code left out problem. of course!

here's had in old version:

simple_carousel.js

var $slidecontainer, $controls, $markers, $activeslide, $nextslide;  var actions = {     back: function() {         // move slide     },      forward: function() {         // move slide forward     } };  function showslide() {     // show "next" slide }  template.simplecarousel.onrendered(function() {     var data = this.data;      $slidecontainer = this.$('.sc-slides');     // rest of code irrelevant }); 

i had thought variables had declared on first line independent of multiple instantiations of templates using, wrong. first use of $slidecontainer = this.$('.sc-slides'); worked fine, $slidecontainer , others shared.

to fix this, moved local variables/actions template.simplecarousel.onrendered

template.simplecarousel.onrendered(function() {     var $slidecontainer, $markers, ...      this.actions = {       //...     }; });  template.simplecarousel.events({     'click [data-sc-move="forward"]': function( event, template ) {         template.actions.forward();     }     //... });