diff --git a/assets/javascripts/templates/sidebar_tmpl.coffee b/assets/javascripts/templates/sidebar_tmpl.coffee
index 07c71fb3..a2e4f6ee 100644
--- a/assets/javascripts/templates/sidebar_tmpl.coffee
+++ b/assets/javascripts/templates/sidebar_tmpl.coffee
@@ -27,7 +27,10 @@ templates.sidebarLabel = (doc, options = {}) ->
label += 'checked' if options.checked
label + ">#{doc.name}"
-templates.sidebarDisabled = '
Disabled
'
+templates.sidebarDisabledList = (options) ->
+ """#{templates.render 'sidebarDoc', options.docs, disabled: true}
"""
+
+templates.sidebarDisabled = 'Disabled
'
templates.sidebarVote = 'Vote for new documentation'
diff --git a/assets/javascripts/views/sidebar/doc_list.coffee b/assets/javascripts/views/sidebar/doc_list.coffee
index 3b4dfcc0..5080ae44 100644
--- a/assets/javascripts/views/sidebar/doc_list.coffee
+++ b/assets/javascripts/views/sidebar/doc_list.coffee
@@ -4,10 +4,15 @@ class app.views.DocList extends app.View
@events:
open: 'onOpen'
close: 'onClose'
+ click: 'onClick'
@routes:
after: 'afterRoute'
+ @elements:
+ disabledTitle: '._list-title'
+ disabledList: '._disabled-list'
+
init: ->
@lists = {}
@@ -32,11 +37,23 @@ class app.views.DocList extends app.View
render: =>
@html @tmpl('sidebarDoc', app.docs.all())
@renderDisabled() unless app.isSingleDoc() or app.settings.hasDocs()
+ @refreshElements()
return
renderDisabled: ->
- @append @tmpl('sidebarDisabled') +
- @tmpl('sidebarDoc', app.disabledDocs.all(), disabled: true)
+ @append @tmpl('sidebarDisabled')
+ @renderDisabledList()
+ return
+
+ renderDisabledList: ->
+ @append @tmpl('sidebarDisabledList', docs: app.disabledDocs.all())
+ @refreshElements()
+ @disabledTitle.classList.add('open-title')
+ return
+
+ removeDisabledList: ->
+ @disabledList.remove()
+ @disabledTitle.classList.remove('open-title')
return
reset: ->
@@ -97,6 +114,15 @@ class app.views.DocList extends app.View
$.scrollTo @find("a[href='#{model.fullPath()}']"), null, 'top', margin: 0
return
+ onClick: (event) =>
+ return unless @disabledTitle and $.hasChild @disabledTitle, event.target
+ $.stopEvent(event)
+ if @disabledTitle.classList.contains('open-title')
+ @removeDisabledList()
+ else
+ @renderDisabledList()
+
+
afterRoute: (route, context) =>
if context.init
@reset()
diff --git a/assets/stylesheets/components/_sidebar.scss b/assets/stylesheets/components/_sidebar.scss
index 606af5b3..2b9b6ea6 100644
--- a/assets/stylesheets/components/_sidebar.scss
+++ b/assets/stylesheets/components/_sidebar.scss
@@ -59,7 +59,10 @@
}
._list-title {
- margin: 1rem 0 .5rem 2.25rem;
+ position: relative;
+ margin: .5rem 0 0;
+ padding-left: 2.25rem;
+ line-height: 2rem;
font-size: .75rem;
color: $textColorLight;
text-transform: uppercase;
@@ -158,7 +161,7 @@
&:before {
@extend %icon, %icon-dir;
- .open > & {
+ .open, .open-title > & {
-webkit-transform: rotate(90deg);
transform: rotate(90deg);
}