Tweak sidebar show/hide

pull/412/merge
Thibaut Courouble 9 years ago
parent dd4b9bfa1f
commit 4fc1126015

@ -82,10 +82,9 @@ class app.Settings
hasLayout: (name) -> hasLayout: (name) ->
try try
layout = (Cookies.get(LAYOUT_KEY) || '').split(' ') layout = (Cookies.get(LAYOUT_KEY) || '').split(' ')
$.arrayDelete(layout, '') layout.indexOf(name) isnt -1
return layout.indexOf(name) isnt -1
catch catch
return false false
setSize: (value) -> setSize: (value) ->
try try

@ -20,6 +20,10 @@ class app.views.Document extends app.View
@addSubview @content = new app.views.Content @addSubview @content = new app.views.Content
@addSubview @path = new app.views.Path unless app.isSingleDoc() or app.isMobile() @addSubview @path = new app.views.Path unless app.isSingleDoc() or app.isMobile()
@sidebar.search
.on 'searching', @onSearching
.on 'clear', @onSearchClear
@activate() @activate()
return return
@ -39,17 +43,32 @@ class app.views.Document extends app.View
app.appCache?.updateInBackground() app.appCache?.updateInBackground()
return return
toggleSidebar: (saveLayout = true) -> showSidebar: (options = {}) ->
hasHiddenClass = app.el.classList.contains(HIDE_SIDEBAR_CLASS) @toggleSidebar(options, true)
forceShow = (!hasHiddenClass || !@hasSidebar()) && !saveLayout return
app.el.classList[if hasHiddenClass or forceShow then 'remove' else 'add'](HIDE_SIDEBAR_CLASS)
return unless saveLayout hideSidebar: (options = {}) ->
app.settings.setLayout(HIDE_SIDEBAR_CLASS, !hasHiddenClass) @toggleSidebar(options, false)
app.appCache?.updateInBackground() return
toggleSidebar: (options = {}, shouldShow) ->
shouldShow ?= if options.save then !@hasSidebar() else app.el.classList.contains(HIDE_SIDEBAR_CLASS)
app.el.classList[if shouldShow then 'remove' else 'add'](HIDE_SIDEBAR_CLASS)
app.settings.setLayout(HIDE_SIDEBAR_CLASS, !shouldShow) if options.save
return return
hasSidebar: -> hasSidebar: ->
return !app.el.classList.contains(HIDE_SIDEBAR_CLASS) && !app.settings.hasLayout(HIDE_SIDEBAR_CLASS) !app.settings.hasLayout(HIDE_SIDEBAR_CLASS)
onSearching: =>
unless @hasSidebar()
@showSidebar()
return
onSearchClear: =>
unless @hasSidebar()
@hideSidebar()
return
setTitle: (title) -> setTitle: (title) ->
@el.title = if title then "DevDocs - #{title}" else 'DevDocs API Documentation' @el.title = if title then "DevDocs - #{title}" else 'DevDocs API Documentation'

@ -14,7 +14,7 @@ class app.views.Resizer extends app.View
@appendTo $('._app') @appendTo $('._app')
@style = $('style[data-resizer]') @style = $('style[data-resizer]')
@size = @style.getAttribute('data-size') @size = @savedSize = @style.getAttribute('data-size')
return return
MIN = 260 MIN = 260
@ -22,18 +22,27 @@ class app.views.Resizer extends app.View
resize: (value, save) -> resize: (value, save) ->
value -= app.el.offsetLeft value -= app.el.offsetLeft
return unless value > 0 return unless value >= 0
if value <= 5
app.document.hideSidebar({save})
newSize = @savedSize
else
app.document.showSidebar({save})
value = Math.min(Math.max(Math.round(value), MIN), MAX) value = Math.min(Math.max(Math.round(value), MIN), MAX)
newSize = "#{value}px" newSize = "#{value}px"
@style.innerHTML = @style.innerHTML.replace(new RegExp(@size, 'g'), newSize) @style.innerHTML = @style.innerHTML.replace(new RegExp(@size, 'g'), newSize)
@size = newSize @size = newSize
if save if save
app.settings.setSize(value) @savedSize = @size
app.settings.setSize(parseInt(@savedSize))
app.appCache?.updateInBackground() app.appCache?.updateInBackground()
return return
onDblClick: (event) -> onDblClick: (event) ->
app.document.toggleSidebar() app.document.toggleSidebar(save: true)
return return
onDragStart: (event) => onDragStart: (event) =>
@ -55,12 +64,7 @@ class app.views.Resizer extends app.View
onDragEnd: (event) => onDragEnd: (event) =>
$.off(window, 'dragover', @onDrag) $.off(window, 'dragover', @onDrag)
value = event.pageX or (event.screenX - window.screenX) value = event.pageX or (event.screenX - window.screenX)
if value <= 5 if @lastDragValue and value > 0 and not (@lastDragValue - 5 < value < @lastDragValue + 5) # https://github.com/Thibaut/devdocs/issues/265
app.document.toggleSidebar()
return
else if !app.document.hasSidebar()
app.document.toggleSidebar(true)
if @lastDragValue and not (@lastDragValue - 5 < value < @lastDragValue + 5) # https://github.com/Thibaut/devdocs/issues/265
value = @lastDragValue value = @lastDragValue
@resize(value, true) @resize(value, true)
return return

@ -68,10 +68,8 @@ class app.views.Search extends app.View
@value = @input.value @value = @input.value
if @value.length if @value.length
app.document.toggleSidebar(false)
@search() @search()
else else
app.document.toggleSidebar() unless app.document.hasSidebar()
@clear() @clear()
return return

Loading…
Cancel
Save