Bladeren bron

Tweak sidebar show/hide

Thibaut Courouble 9 jaren geleden
bovenliggende
commit
4fc1126015

+ 2 - 3
assets/javascripts/app/settings.coffee

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

+ 27 - 8
assets/javascripts/views/layout/document.coffee

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

+ 16 - 12
assets/javascripts/views/layout/resizer.coffee

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

+ 0 - 2
assets/javascripts/views/search/search.coffee

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