Sutty/trabajo-afectivo
5
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

ticket zoom: make title into dropdown-toggle

Browse source
This commit is contained in:
Felix Niklas 2014-11-17 11:13:44 +01:00
parent 09b0ef24db
commit 5c88907e56
3 changed files with 34 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

19
app/assets/javascripts/app/controllers/_application_controller_generic.js.coffee
View file

@ -477,16 +477,21 @@ class App.ActionRow extends App.Controller
) )
class App.Sidebar extends App.Controller class App.Sidebar extends App.Controller
elements:
'.tabsSidebar-tab': 'tabs'
'.sidebar': 'sidebars'
events: events:
'click .tabsSidebar-tab': 'toggleTab' 'click .tabsSidebar-tab': 'toggleTab'
'click .tabsSidebar-close': 'toggleSidebar' 'click .tabsSidebar-close': 'toggleSidebar'
'click .sidebar-header h2': 'toggleDropdown'
constructor: -> constructor: ->
super super
@render() @render()
# get first tab # get first tab
name = @el.find('.tabsSidebar-tab').first().data('tab') name = @tabs.first().data('tab')
# activate first tab # activate first tab
@toggleTabAction(name) @toggleTabAction(name)
@ -508,7 +513,11 @@ class App.Sidebar extends App.Controller
type: 'small' type: 'small'
) )
toggleSidebar: -> toggleDropdown: (e) =>
e.stopPropagation()
$(e.currentTarget).next('.js-actions').find('.dropdown-toggle').dropdown('toggle')
toggleSidebar: =>
@el.parent().find('.tabsSidebar-sidebarSpacer').toggleClass('is-closed') @el.parent().find('.tabsSidebar-sidebarSpacer').toggleClass('is-closed')
@el.parent().find('.tabsSidebar').toggleClass('is-closed') @el.parent().find('.tabsSidebar').toggleClass('is-closed')
@el.parent().next('.attributeBar').toggleClass('is-closed') @el.parent().next('.attributeBar').toggleClass('is-closed')
@ -518,7 +527,7 @@ class App.Sidebar extends App.Controller
@el.parent().find('.tabsSidebar').removeClass('is-closed') @el.parent().find('.tabsSidebar').removeClass('is-closed')
@el.parent().next('.attributeBar').addClass('is-closed') @el.parent().next('.attributeBar').addClass('is-closed')
toggleTab: (e) -> toggleTab: (e) =>
# get selected tab # get selected tab
name = $(e.target).closest('.tabsSidebar-tab').data('tab') name = $(e.target).closest('.tabsSidebar-tab').data('tab')
@ -537,13 +546,13 @@ class App.Sidebar extends App.Controller
return if !name return if !name
# remove active state # remove active state
@el.find('.tabsSidebar-tab').removeClass('active') @tabs.removeClass('active')
# add active state # add active state
@el.find('.tabsSidebar-tab[data-tab=' + name + ']').addClass('active') @el.find('.tabsSidebar-tab[data-tab=' + name + ']').addClass('active')
# hide all content tabs # hide all content tabs
@el.find('.sidebar').addClass('hide') @sidebars.addClass('hide')
# show active tab content # show active tab content
tabContent = @el.find('.sidebar[data-tab=' + name + ']') tabContent = @el.find('.sidebar[data-tab=' + name + ']')

2
app/assets/javascripts/app/views/generic/sidebar_tabs.jst.eco
View file

@ -2,7 +2,7 @@
<div class="sidebar bottom-form-shadow flex hide" data-tab="<%= item.name %>"> <div class="sidebar bottom-form-shadow flex hide" data-tab="<%= item.name %>">
<div class="sidebar-header"> <div class="sidebar-header">
<h2 class="u-textTruncate"><%- @T( item.head ) %></h2> <h2 class="u-textTruncate"><%- @T( item.head ) %></h2>
<div class="sidebar-actions js-actions flex"></div> <div class="js-actions flex"></div>
<div class="tabsSidebar-close centered u-clickable"> <div class="tabsSidebar-close centered u-clickable">
<div class="arrow-right icon"></div> <div class="arrow-right icon"></div>
</div> </div>

18
app/assets/stylesheets/zammad.css.scss
View file

@ -3452,16 +3452,24 @@ footer {
.tabsSidebar .sidebar-header { .tabsSidebar .sidebar-header {
@extend .horizontal; @extend .horizontal;
@extend .center; @extend .center;
padding: 20px 20px 0; margin: 20px 20px 0;
} padding: 0 0 5px;
position: relative;
.tabsSidebar .sidebar h2 { h2 {
margin: 0 0 -1px; margin: 0 0 -1px;
line-height: 1; line-height: 1;
padding-right: 8px;
@extend .u-clickable;
} }
.tabsSidebar .sidebar-actions { + hr {
padding-left: 8px; margin-top: 15px;
}
.dropdown {
position: static;
}
} }
.tabsSidebar-close { .tabsSidebar-close {