jQuery - Function Global Variable

Question

Basically the function atm makes it so when you load the script it will show a next and previous button plus a stream. Then if you click next it'll bring you to the second stream in the list. By doing this it increases a counter by 1 and then calls the function showStream(counter) using the counter. I want to make it so that when you call the function if you click previous and the counter is less than 0 like -1 for example it will just show the stream #100 and if you click previous again it'll show #99. Also I need to make sure if you pass #100 by pressing next it'll bring you to number 1. Think of it as if theres no beginning and no end, just a giant loop of them.

Any ideas?

Function:

  function showStream(videoIndexToShow) {
      if(videoIndexToShow >= streams.length-1) {
         jQuery("#next").hide();
       }
       else {
        jQuery("#next").show();
       }
       if(videoIndexToShow <= 0) {
         jQuery("#prev").show();
       } else {
        jQuery("#prev").show();
       }
       jQuery.each(streams, function (index, item) {  
           // $stream = <stream number>;
           // if(index == $stream){ 
           // } else {
           if(index == videoIndexToShow) {
            console.log(videoIndexToShow, index);
           jQuery("#content").empty();
           jQuery("#content").html('<object style="margin-left:0.5%;" type="application/x-shockwave-flash" height="378" width="620" id="live_embed_player_flash" data="http://www.twitch.tv/widgets/live_embed_player.swf?channel=' + item.channel.display_name+ '&auto_play=false&start_volume=25" /></object><iframe frameborder="0" scrolling="no" id="chat_embed" src="http://twitch.tv/chat/embed?channel=' + item.channel.display_name +'&amp;popout_chat=true" height="378" width="350"></iframe>');
           }
           // }
      });
  }

Other Code:

  var streams = null;
  jQuery.getJSON("https://api.twitch.tv/kraken/search/streams?q=path%20of%20exile&limit=100&callback=?", function (data) {
      streams =  data.streams;
      showStream(0);
  });

  var globalCnt = 0;
  jQuery("#next").click(function() {
      showStream(++globalCnt);
  });
  jQuery("#prev").click(function() {
      showStream(--globalCnt);
  });

If its possible to make it instead of 100 just make it when it passes streams.length it'll restart at 1 or if its at 0 and you press previous it'll bring you to streams.length. Not sure if thats possible :)

But any ideas how I'd do this?

Click Event:

  jQuery("#prev").click(function() {
      globalCnt = globalCnt + 1 > 100 ? 1 : --globalCnt;
      showStream(globalCnt);
  });

tymeJV · Accepted Answer · 2013-11-30 01:17:17Z

1

Just use a ternary right before you call showStream

globalCnt = globalCnt + 1 > 100 ? 1 : ++globalCnt;

And for less:

globalCnt = globalCnt - 1 < 0 ? 100 : --globalCnt;

edited Nov 30, 2013 at 1:17

answered Nov 30, 2013 at 0:54

tymeJV

105k14 gold badges165 silver badges158 bronze badges

Sign up to request clarification or add additional context in comments.

11 Comments

user3023566 Over a year ago

I'd do this in showStream? Like: showStream(globalCnt + 1 > 100 : 1 ? ++globalCnt;) ?

tymeJV Over a year ago

You can, or you can do it right before with the globalCnt = \

user3023566 Over a year ago

I tried that but it displays nothing now. jsfiddle.net/bjCmS Original before I changed it to that is at codeeplus.net/new.php

tymeJV Over a year ago

one min, take a look at it :)

tymeJV Over a year ago

Well I'm an idiot, I had the : and the ? backwards in the ternary, I edited the answer, try it with that

|

Collectives™ on Stack Overflow

jQuery - Function Global Variable

1 Answer 1

11 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

11 Comments

Your Answer

Sign up or log in

Post as a guest

Related