<%
function layoutTocBody() {
  var tocBody = toc(page.content, {
    list_number: item.list_number,
    min_depth: item.min_depth,
    max_depth: item.max_depth
  })
  if (tocBody.length === 0) {
    return ''
  }
  return tocBody.replace('class="toc"', 'class="toc ui-collection-adapter"')
}

function layoutTocAction() {
  return '<a class="cap-action" onclick="sidebar.toggleTOC()">' + icon('default:rightbar', '', true) + '</a>'
}

function layoutFooter(hasComments) {
  var footer = '<div class="widget-footer">'
  footer += '<a class="top" onclick="util.scrollTop()">'
  footer += icon('default:upup', '', true)
  footer += '<span>' + __('btn.top') + '</span></a>'
  if (hasComments) {
    footer += '<a class="buttom" onclick="util.scrollComment()">'
    footer += icon('default:tocomment', '', true)
    footer += '<span>' + __('btn.comments') + '</span></a>'
  }
  footer += '</div>'
  return footer
}

function layoutDiv() {
  var tocBody = layoutTocBody()
  var hasToc = tocBody.trim().length > 0
  var hasRemoteMd = has_remote_md(page)
  var hasComments = page.cmt_rendered === true
  if (!hasToc && !hasRemoteMd && !hasComments) {
    return ''
  }
  return partial('_partial/components/widget-frame', {
    className: 'toc',
    title: hasToc || hasRemoteMd ? __('meta.toc') : '',
    action: hasToc || hasRemoteMd ? layoutTocAction() : '',
    body: hasToc ? tocBody : (hasRemoteMd ? '<nav class="toc ui-collection-adapter"></nav>' : ''),
    footer: layoutFooter(hasComments),
    attrs: {
      id: 'data-toc',
      collapse: item.collapse === 'auto' ? 'auto' : String(item.collapse === true)
    }
  })
}
%>

<%- layoutDiv() %>
