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")
    this.$time = this.$("#time")
    this.$hours = this.$("#hours")
    this.$minutes = this.$("#minutes")
    
    $("#curtain").click(this.toggleNav)
  },
  
//   startTime: function(){
//     this.updateTime()
//     this.$time.show()
//   },
//   
//   lastTime: +new Date() - 1000,
//   updateTime: function(){
//     setTimeout( this.updateTime.bind(this), 500 )
//     var t = new Date()
//     var secs = +t
//     if (secs - this.lastTime < 1000) { return }
//     this.lastTime = secs
//     var y = t.getYear() + 1900
//     var mm = t.getMonth() + 1
//     var d = t.getDate()
//     var h = t.getHours() % 12
//     var m = t.getMinutes()
//     var s = t.getSeconds()
//     if (mm < 10) mm = "0" + mm
//     if (d < 10) d = "0" + d
//     if (h < 10) h = "0" + h
//     if (m < 10) m = "0" + m
//     if (s < 10) s = "0" + s
//     this.$hours.html(""+y+"/"+mm+"/"+d+" "+h+":"+m+":"+s)
//   },
  
  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')
  },

})