From 2ece8d13da24fbdbfe5228368a237b2e5ca093b8 Mon Sep 17 00:00:00 2001
From: Thibaut Courouble <thibaut@me.com>
Date: Sat, 23 Jan 2016 15:17:43 -0500
Subject: [PATCH] Improve doc list for versioned docs
Ref #25.
---
assets/javascripts/templates/sidebar_tmpl.coffee | 15 ++++++++++-----
assets/javascripts/views/list/list_focus.coffee | 10 ++++++++--
assets/javascripts/views/list/list_fold.coffee | 4 ++--
assets/javascripts/views/sidebar/doc_list.coffee | 16 +++++++++++++++-
.../javascripts/views/sidebar/doc_picker.coffee | 2 +-
assets/stylesheets/components/_sidebar.scss | 1 +
6 files changed, 37 insertions(+), 11 deletions(-)
diff --git a/assets/javascripts/templates/sidebar_tmpl.coffee b/assets/javascripts/templates/sidebar_tmpl.coffee
index 885af928..6cb5718b 100644
--- a/assets/javascripts/templates/sidebar_tmpl.coffee
+++ b/assets/javascripts/templates/sidebar_tmpl.coffee
@@ -3,13 +3,15 @@ templates = app.templates
templates.sidebarDoc = (doc, options = {}) ->
link = """<a href="#{doc.fullPath()}" class="_list-item _icon-#{doc.icon} """
link += if options.disabled then '_list-disabled' else '_list-dir'
- link += """" data-slug="#{doc.slug}" title="#{doc.name}">"""
+ link += """" data-slug="#{doc.slug}" title="#{doc.name} #{doc.version || ''}">"""
if options.disabled
link += """<span class="_list-enable" data-enable="#{doc.slug}">Enable</span>"""
else
link += """<span class="_list-arrow"></span>"""
link += """<span class="_list-count">#{doc.release}</span>""" if doc.release
- link + "#{doc.name}</a>"
+ link += "#{doc.name}"
+ link += " #{doc.version}" if options.disabled and doc.version
+ link + "</a>"
templates.sidebarType = (type) ->
"""<a href="#{type.fullPath()}" class="_list-item _list-dir" data-slug="#{type.slug}"><span class="_list-arrow"></span><span class="_list-count">#{type.count}</span>#{type.name}</a>"""
@@ -48,12 +50,15 @@ templates.sidebarVersionedDoc = (doc, versions, options = {}) ->
html += " open" if options.open
html + """"><span class="_list-arrow"></span>#{doc.name}</div><div class="_list _list-sub">#{versions}</div>"""
-templates.sidebarDisabledList = (options) ->
- """<div class="_disabled-list">#{templates.render 'sidebarDoc', options.docs, disabled: true}</div>"""
-
templates.sidebarDisabled = (options) ->
"""<h6 class="_list-title"><span class="_list-arrow"></span>Disabled (#{options.count})</h6>"""
+templates.sidebarDisabledList = (html) ->
+ """<div class="_disabled-list">#{html}</div>"""
+
+templates.sidebarDisabledVersionedDoc = (doc, versions) ->
+ """<a class="_list-item _list-dir _icon-#{doc.icon} _list-disabled"><span class="_list-arrow"></span>#{doc.name}</a><div class="_list _list-sub">#{versions}</div>"""
+
templates.sidebarPickerNote = """
<div class="_list-note">Tip: for faster and better search results, select only the docs you need.</div>
<a href="https://trello.com/b/6BmTulfx/devdocs-documentation" class="_list-link" target="_blank">Vote for new documentation</a>
diff --git a/assets/javascripts/views/list/list_focus.coffee b/assets/javascripts/views/list/list_focus.coffee
index 117d5bf3..6b8c1744 100644
--- a/assets/javascripts/views/list/list_focus.coffee
+++ b/assets/javascripts/views/list/list_focus.coffee
@@ -38,7 +38,10 @@ class app.views.ListFocus extends app.View
$.click(next)
@findNext cursor
else if next.tagName is 'DIV' # sub-list
- @findFirst(next) or @findNext(next)
+ if cursor.className.indexOf('open') >= 0
+ @findFirst(next) or @findNext(next)
+ else
+ @findNext(next)
else if next.tagName is 'H6' # title
@findNext(next)
else if cursor.parentElement isnt @el
@@ -61,7 +64,10 @@ class app.views.ListFocus extends app.View
$.click(prev)
@findPrev cursor
else if prev.tagName is 'DIV' # sub-list
- @findLast(prev) or @findPrev(prev)
+ if prev.previousSibling.className.indexOf('open') >= 0
+ @findLast(prev) or @findPrev(prev)
+ else
+ @findPrev(prev)
else if prev.tagName is 'H6' # title
@findPrev(prev)
else if cursor.parentElement isnt @el
diff --git a/assets/javascripts/views/list/list_fold.coffee b/assets/javascripts/views/list/list_fold.coffee
index b5476212..e33aedf0 100644
--- a/assets/javascripts/views/list/list_fold.coffee
+++ b/assets/javascripts/views/list/list_fold.coffee
@@ -10,7 +10,7 @@ class app.views.ListFold extends app.View
left: 'onLeft'
right: 'onRight'
- constructor: (@el, @options = {}) -> super
+ constructor: (@el) -> super
open: (el) ->
if el and not el.classList.contains @constructor.activeClass
@@ -60,5 +60,5 @@ class app.views.ListFold extends app.View
$.stopEvent(event)
@toggle el.parentElement
else if el.classList.contains @constructor.targetClass
- if @options.toggleOnclick then @toggle(el) else @open(el)
+ if el.hasAttribute('href') then @open(el) else @toggle(el)
return
diff --git a/assets/javascripts/views/sidebar/doc_list.coffee b/assets/javascripts/views/sidebar/doc_list.coffee
index 3ee4ea14..338cd29d 100644
--- a/assets/javascripts/views/sidebar/doc_list.coffee
+++ b/assets/javascripts/views/sidebar/doc_list.coffee
@@ -54,7 +54,21 @@ class app.views.DocList extends app.View
return
appendDisabledList: ->
- @append @tmpl('sidebarDisabledList', docs: app.disabledDocs.all())
+ html = ''
+ docs = [].concat(app.disabledDocs.all()...)
+
+ while doc = docs.shift()
+ if doc.version
+ versions = ''
+ loop
+ versions += @tmpl('sidebarDoc', doc, disabled: true)
+ break if docs[0].name isnt doc.name
+ doc = docs.shift()
+ html += @tmpl('sidebarDisabledVersionedDoc', doc, versions)
+ else
+ html += @tmpl('sidebarDoc', doc, disabled: true)
+
+ @append @tmpl('sidebarDisabledList', html)
@disabledTitle.classList.add('open-title')
@refreshElements()
return
diff --git a/assets/javascripts/views/sidebar/doc_picker.coffee b/assets/javascripts/views/sidebar/doc_picker.coffee
index 2bcd0cad..9cc73183 100644
--- a/assets/javascripts/views/sidebar/doc_picker.coffee
+++ b/assets/javascripts/views/sidebar/doc_picker.coffee
@@ -11,7 +11,7 @@ class app.views.DocPicker extends app.View
enter: 'onEnter'
init: ->
- @addSubview @listFold = new app.views.ListFold(@el, toggleOnclick: true)
+ @addSubview @listFold = new app.views.ListFold(@el)
return
activate: ->
diff --git a/assets/stylesheets/components/_sidebar.scss b/assets/stylesheets/components/_sidebar.scss
index cd8d820f..2d878aa0 100644
--- a/assets/stylesheets/components/_sidebar.scss
+++ b/assets/stylesheets/components/_sidebar.scss
@@ -197,6 +197,7 @@
.open + & { display: block; }
> ._list-item { padding-left: 2.375rem; }
> ._list-dir, > ._list-sub > ._list-item { padding-left: 2.75rem; }
+ > ._list-disabled { padding-left: 3.875rem; }
> ._list-item:before { content: none; }
> ._list-dir { line-height: 1.375rem; }