$(function () {
  /*$('.checkbox.enable').checkbox({onChange: function (e) {
      var $this = $(this).closest('.checkbox')
      var enabled = $this.checkbox('is enabled')
      $this.closest('.segment')
        .find('.top.label')
        .toggleClass('green', enabled)
        .toggleClass('red', !enabled)
        .end()
        .find('.example')
        .scrollLock(enabled ? 'enable' : 'disable')
        .end()
        .find('.checkbox.strict>input').prop('disabled', !enabled)
  }})
  $('.checkbox.strict').checkbox({onChange: function (e) {
      var $this = $(this).closest('.checkbox')
      $this.closest('.segment')
        .find('.example')
        .scrollLock('toggleStrict')
  }})*/
  document.querySelectorAll('.example').forEach(elem => {
      elem.scrollLock()
      elem.addEventListener('top.scrollLock', e => {
        console.log('top locked')
      })
      elem.addEventListener('bottom.scrollLock', e => {
        console.log('bottom locked')
      })
  })
  /*$('.example')
    .scrollLock()
    .on('top.scrollLock', function (event) {
      console.log('top locked')
    })
    .on('bottom.scrollLock', function (event) {
      console.log('bottom locked')
    })*/
  //!('ontouchstart' in window) && $('[data-content]').popup()
})
