diff --git a/assets/javascripts/app/router.coffee b/assets/javascripts/app/router.coffee index ba25148acd..040a010fb6 100644 --- a/assets/javascripts/app/router.coffee +++ b/assets/javascripts/app/router.coffee @@ -92,6 +92,13 @@ class app.Router settings: (context) -> return "/#/#{context.path}" if app.isSingleDoc() @triggerRoute 'settings' + + # Allows check all the checkboxes in /settings. + # This event needs to be added runtime since the button is + # added to the sidebar when the page is loaded, not like + # other elements that are hidden and are shown when the page + # loads + app.document.settings.setCheckboxesEvent() return offline: (context)-> diff --git a/assets/javascripts/templates/sidebar_tmpl.coffee b/assets/javascripts/templates/sidebar_tmpl.coffee index 46797e5658..1bd4b300f3 100644 --- a/assets/javascripts/templates/sidebar_tmpl.coffee +++ b/assets/javascripts/templates/sidebar_tmpl.coffee @@ -60,7 +60,10 @@ templates.sidebarDisabledList = (html) -> templates.sidebarDisabledVersionedDoc = (doc, versions) -> """<a class="_list-item _list-dir _icon-#{doc.icon} _list-disabled" data-slug="#{doc.slug_without_version}" tabindex="-1">#{arrow}#{doc.name}</a><div class="_list _list-sub">#{versions}</div>""" -templates.docPickerHeader = """<div class="_list-picker-head"><span>Documentation</span> <span>Enable</span></div>""" +templates.docPickerHeader = """ +<div class="_list-picker-head"><span>Documentation</span> <span>Enable</span></div> +<div class="_list-picker-head _centered-list-picker-head" id="enable-all"><div>Enable all</div></div> +""" templates.docPickerNote = """ <div class="_list-note">Tip: for faster and better search results, select only the docs you need.</div> diff --git a/assets/javascripts/views/layout/settings.coffee b/assets/javascripts/views/layout/settings.coffee index 6941b9cd25..27aa81ab21 100644 --- a/assets/javascripts/views/layout/settings.coffee +++ b/assets/javascripts/views/layout/settings.coffee @@ -81,3 +81,19 @@ class app.views.Settings extends app.View $.stopEvent(event) app.router.show '/' return + + setCheckboxesEvent: => + button = document.getElementById('enable-all') + button.addEventListener 'click', @checkAllCheckboxes + return + + checkAllCheckboxes: => + checkboxes = document.getElementsByClassName('_list-checkbox') + i = 0 + + while (i < checkboxes.length) + checkboxes[i].checked = true + i++ + + @addClass('_dirty') + return diff --git a/assets/stylesheets/components/_sidebar.scss b/assets/stylesheets/components/_sidebar.scss index 8813f92dac..831b4137d6 100644 --- a/assets/stylesheets/components/_sidebar.scss +++ b/assets/stylesheets/components/_sidebar.scss @@ -367,3 +367,20 @@ &:after { visibility: hidden; } &:hover:after { visibility: visible; } } + +._centered-list-picker-head { + cursor: pointer; + text-aling: center; + color: var(--textColor); + @extend %border-box; + + & div{ + margin-left: auto; + margin-right: auto; + } + + &:active { + box-shadow: inset 0 1px 1px rgba(black, .05), inset 0 1px 4px var(--boxBorder); + } + +}