title: Bootstrap Collapse - Jquery "Collapse all" function
body: <p>I'm writing a personal feed reader using Bootstrap on frontend, and wanted to add a "Collapse/Expand All" button.</p>
  
  <p>It's my first JavaScript/JQuery code, so I don't know how to debug it except printing variables in Firefox Developer Console.</p>
  
  <p>My page structure consist of panels. User can expand or collapse a panel by clicking on panel header. And a button to collapse or expand all panels.</p>
  
  <p>My solution works most of the times, but I noticed one odd behavior. Here is how I reproduce the problem:</p>
  
  <ol>
  <li>Open the page first time</li>
  <li>Expand one panel with clicking its header</li>
  <li>Now the collapse all button collapses the open panel, and expands the other ones. As if it "toggles" all panels instead of closing them.</li>
  <li>After this odd behavior, everything is normal, I can't reproduce the problem without refreshing the page. On every step <code>open_panel_count</code> variable looks normal.</li>
  </ol>
  
  <p>Here is the methods I'm using:</p>
  
  <pre class="lang-js prettyprint-override"><code>$(function() {
    open_panel_count = 0;
    function update_toggle_button() { 
      $('#toggle-btn').text((open_panel_count ? "Collapse" : "Expand") + " All")
    }
    update_toggle_button(); // Run once on page load to text #toggle-btn
  
    $('#toggle-btn').click(function() {
      $('.panel-collapse').collapse(open_panel_count ? 'hide' : 'show');
    });
  
    $('.panel-collapse').on('shown.bs.collapse', function () {
      open_panel_count++;
      update_toggle_button();
    });
  
    $('.panel-collapse').on('hidden.bs.collapse', function () {
      open_panel_count--;
      update_toggle_button();
    });
  });
  </code></pre>
  
  <p>Can anyone point me what I am doing wrong?</p>
  
  <p>You can see the whole template in: <a href="https://github.com/utdemir/furby/blob/master/template.erb">https://github.com/utdemir/furby/blob/master/template.erb</a>
  And access a demo at: <a href="http://p.cogunluklazararsiz.org/furby/">http://p.cogunluklazararsiz.org/furby/</a></p>