var HeaderView = View.extend({

  el: "nav",

  events: {
    "click .index": "toggleNav",
  },
  
  initialize: function(){
    this.$figText = this.$(".fig-text")
    this.$pageNumber = this.$(".page-no")
    this.$slideNumber = this.$(".slide-no")
    this.$slideCount = this.$(".slide-count")
    
    $("#curtain").click(this.toggleNav)
  },
  
  updateSlideNumber: function(n){
    n += 1
    if (n < 10) n = "0" + n
    this.$slideNumber.html(n)
  },

  updatePageNumber: function(n){
    n += 1
    if (n < 10) n = "0" + n
    this.$pageNumber.html(n)
  },

  updateSlideCount: function(n){
    if (n > 1) {
      if (n < 10) n = "0" + n
      this.$figText.show()
      this.$slideCount.html(n)
    }
    else {
      this.$figText.hide()
    }
  },
  
  toggleNav: function(){
    document.body.classList.toggle('navopen') // $('body').toggleClass('navopen')
  },

})