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

Merge branch 'interface' of github.com:martini/zammad into interface

Browse source
This commit is contained in:
Martin Edenhofer 2014-09-15 22:56:41 +02:00
commit d9b5e428e7
11 changed files with 240 additions and 239 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -417,15 +417,15 @@ class App.GenericHistory extends App.ControllerModal
class App.Sidebar extends App.Controller
events:
'click .sidebar-tabs': 'toggleTab'
'click .close-sidebar': 'toggleSidebar'
'click .tabsSidebar-tab': 'toggleTab'
'click .tabsSidebar-close': 'toggleSidebar'
constructor: ->
super
@render()
# get first tab
name = @el.find('.sidebar-tab').first().data('content')
name = @el.find('.tabsSidebar-tab').first().data('content')
# activate first tab
@toggleTabAction(name)
@ -439,17 +439,17 @@ class App.Sidebar extends App.Controller
item.callback( @el.find( '.sidebar-content[data-content=' + item.name + ']' ) )
toggleSidebar: ->
$('.content.active > div').toggleClass('state--sidebar-hidden')
$('.content.active .tabsSidebarSpace').toggleClass('is-closed')
$('.content.active .tabsSidebar').toggleClass('is-closed')
showSidebar: ->
# show sidebar if not shown
if $('.content.active > div').hasClass('state--sidebar-hidden')
$('.content.active > div').removeClass('state--sidebar-hidden')
$('.content.active .tabsSidebarSpace').removeClass('is-closed')
$('.content.active .tabsSidebar').removeClass('is-closed')
toggleTab: (e) ->
# get selected tab
name = $(e.target).closest('.sidebar-tab').data('content')
name = $(e.target).closest('.tabsSidebar-tab').data('content')
if name
@ -466,10 +466,10 @@ class App.Sidebar extends App.Controller
return if !name
# remove active state
@el.find('.sidebar-tab').removeClass('active')
@el.find('.tabsSidebar-tab').removeClass('active')
# add active state
@el.find('.sidebar-tab[data-content=' + name + ']').addClass('active')
@el.find('.tabsSidebar-tab[data-content=' + name + ']').addClass('active')
# hide all content tabs
@el.find('.sidebar-content').addClass('hide')
@ -483,7 +483,7 @@ class App.Sidebar extends App.Controller
@el.find('.sidebar h2').html(title)
# set tab actions
@el.find('.sidebar-tab-actions').html('')
@el.find('.tabsSidebar-tabActions').html('')
# add item acctions
for item in @items
@ -491,7 +491,7 @@ class App.Sidebar extends App.Controller
if item.actions
for action in item.actions
do (action) =>
@el.find('.sidebar-tab-actions').append("<div class='sidebar-tab-action #{action.class}'></div>").find(".sidebar-tab-action").last().bind(
@el.find('.tabsSidebar-tabActions').append("<div class='tabsSidebar-tabAction #{action.class}'></div>").find(".tabsSidebar-tabAction").last().bind(
'click'
(e) =>
e.stopPropagation()

2
app/assets/javascripts/app/controllers/agent_ticket_create.js.coffee
View file

@ -469,7 +469,7 @@ class Sidebar extends App.Controller
}
new App.Sidebar(
el: @el.find('.sidebar-holder')
el: @el.find('.tabsSidebar')
items: items
)

22
app/assets/javascripts/app/controllers/layout_ref.js.coffee
View file

@ -43,10 +43,32 @@ App.Config.set( 'layout_ref/content_sidebar_right_sidebar_optional', ContentSide
class ContentSidebarTabsRight extends App.ControllerContent
elements:
'.tabsSidebar' : 'sidebar'
constructor: ->
super
@render()
items = [
head: 'Ticket Settings'
name: 'ticket'
icon: 'message'
,
head: 'Customer'
name: 'customer'
icon: 'person'
,
head: 'Organization'
name: 'organization'
icon: 'group'
]
new App.Sidebar(
el: sidebar
items: items
)
render: ->
@html App.view('layout_ref/content_sidebar_tabs_right')()

2
app/assets/javascripts/app/controllers/ticket_zoom.js.coffee
View file

@ -235,7 +235,7 @@ class App.TicketZoom extends App.Controller
}
new App.Sidebar(
el: @el.find('.sidebar-holder')
el: @el.find('.tabsSidebar')
items: items
)

318
app/assets/javascripts/app/views/agent_ticket_create.jst.eco
View file

@ -1,174 +1,168 @@
<div class="fit ticket-zoom vertical">
<div class="flex u-positionOrigin">
<div class="main no-padding">
<div class="flex-overflow u-positionOrigin sidebar-tabs--spacing">
<div class="main no-padding fit tabsSidebarSpace">
<div class="newTicket">
<div class="box">
<div class="page-header">
<h1><%- @T( @head ) %></h1>
</div>
<div class="box">
<div class="page-header">
<h1><%- @T( @head ) %></h1>
<ul class="horizontal tabs type-tabs">
<li class="tab u-textTruncate" data-type="phone-in">
<div class="gray received-calls channel icon"></div>
<%- @T( 'Received Call' ) %>
</li>
<li class="tab u-textTruncate" data-type="phone-out">
<div class="gray outbound-calls channel icon"></div>
<%- @T( 'Outbound Call' ) %>
</li>
<li class="tab u-textTruncate" data-type="email-out">
<div class="gray email channel icon"></div>
<%- @T( 'Send E-Mail' ) %>
</li>
</ul>
<form role="form" class="form-large ticket-create">
<input type="hidden" name="formSenderType"/>
<div class="ticket-form-top"></div>
<div class="article-form-top"></div>
<div class="formset-inset">
<div class="ticket-form-middle horizontal two-columns"></div>
<div class="ticket-form-bottom"></div>
</div>
<div class="form-actions horizontal">
<a class="subtle-link standalone cancel" href="#/"><%- @T( 'Cancel & Go Back' ) %></a>
<button type="submit" class="btn btn-create submit align-right"><%- @T( 'Create' ) %></button>
</div>
</form>
</div>
</div>
</div>
<div class="tabsSidebar vertical"></div>
<!--
<div class="sidebar">
<div class="widgets">
<div class="customer_info">
<div class="drox"><!-- Customer Info -/->
<div class="drox-header">
<h2>Customer Info</h2>
</div>
<div class="drox-body">
<p>
<span class="customer-name">Benjamin Wahlers</span>
<span class="customer-email u-highlight">benjamin@wahlers.de</span>
</p>
<div class="form-group">
<label for="customer-info-note"><%- @T('Note') %></label>
<textarea class="form-control" id="customer-info-note" rows="5">Not assigned</textarea>
</div>
<ul class="horizontal tabs type-tabs">
<li class="tab u-textTruncate" data-type="phone-in">
<div class="gray received-calls channel icon"></div>
<%- @T( 'Received Call' ) %>
</li>
<li class="tab u-textTruncate" data-type="phone-out">
<div class="gray outbound-calls channel icon"></div>
<%- @T( 'Outbound Call' ) %>
</li>
<li class="tab u-textTruncate" data-type="email-out">
<div class="gray email channel icon"></div>
<%- @T( 'Send E-Mail' ) %>
</li>
</ul>
<form role="form" class="form-large ticket-create">
<input type="hidden" name="formSenderType"/>
<div class="ticket-form-top"></div>
<div class="article-form-top"></div>
<div class="formset-inset">
<div class="ticket-form-middle horizontal two-columns"></div>
<div class="ticket-form-bottom"></div>
<label><%- @T('Tickets') %></label>
<ol class="tasks tasks-standalone"> <!-- vaguely based on task_widget_tasks.jst.eco -/->
<li class="task level-1 horizontal">
<div class="icon-holder">
<div class="priority icon"></div>
</div>
<div class="flex">
<div class="u-highlight name u-textTruncate">Micro-SIM doesn't work</div>
<div class="time">23 minutes ago</div>
</div>
<li class="task level-3 horizontal">
<div class="icon-holder">
<div class="priority icon"></div>
</div>
<div class="flex">
<div class="u-highlight name u-textTruncate">Superb Service!</div>
<div class="time">43 minutes ago</div>
</div>
<li class="task level-2 horizontal">
<div class="icon-holder">
<div class="priority icon"></div>
</div>
<div class="flex">
<div class="u-highlight name u-textTruncate">Print sheets strip off</div>
<div class="time">1 hour ago</div>
</div>
<li class="task level-3 horizontal">
<div class="icon-holder">
<div class="priority icon"></div>
</div>
<div class="flex">
<div class="u-highlight name u-textTruncate">Block not properly wrought</div>
<div class="time">2 hour ago</div>
</div>
</ol>
</div>
</div>
</div>
<div class="ticket_template">
<div class="drox hide"><!-- Template Wizard Step One -/->
<div class="drox-header">
<h2>Choose Template:</h2>
</div>
<div class="drox-body">
<p>No template created yet.</p>
<p>With templates you can pre-fill ticket attributes.</p>
<p>Choose attributes and then save them as a new template.</p>
<p><a class="create u-clickable">Save new template</a></p>
</div>
</div>
<div class="drox hide"><!-- Template Wizard Step Two -/->
<div class="drox-header">
<h2>Create Template:</h2>
</div>
<div class="drox-body">
<form>
<div class="form-group">
<label for="template-title"><%- @T('Template Title') %>:</label>
<input class="form-control" id="template-title" placeholder="<%- @T('Enter Template Name') %>">
</div>
<div class="form-actions horizontal">
<a class="subtle-link standalone cancel" href="#/"><%- @T( 'Cancel & Go Back' ) %></a>
<button type="submit" class="btn btn-create submit align-right"><%- @T( 'Create' ) %></button>
<p>This template saves the following attributes:</p>
<ul class="template-attributes">
<li class="template-attribute horizontal">
<div class="key">Owner</div> | <div class="value flex u-textTruncate">Web-Dev</div>
<div class="delete u-clickable">&times;</div>
<li class="template-attribute horizontal">
<div class="key">Type</div> | <div class="value flex u-textTruncate">Question</div>
<div class="delete u-clickable">&times;</div>
<li class="template-attribute horizontal">
<div class="key">Status</div> | <div class="value flex u-textTruncate">open</div>
<div class="delete u-clickable">&times;</div>
<li class="template-attribute horizontal">
<div class="key">Priority</div> | <div class="value flex u-textTruncate">high</div>
<div class="delete u-clickable">&times;</div>
<li class="template-attribute horizontal">
<div class="key">Tag</div> | <div class="value flex u-textTruncate">New Website</div>
<div class="delete u-clickable">&times;</div>
<li class="template-attribute horizontal">
<div class="key">Tag</div> | <div class="value flex u-textTruncate">Feedback</div>
<div class="delete u-clickable">&times;</div>
</ul>
<div class="horizontal">
<button class="btn btn-primary" type="submit"><%- @T('Save Template') %></button>
<a class="subtle-link standalone cancel align-right u-clickable"><%- @T('Cancel') %></a>
</div>
</form>
</div>
</div>
</div>
</div>
<div class="sidebar-holder vertical"></div>
<!--
<div class="sidebar">
<div class="widgets">
<div class="customer_info">
<div class="drox"><!-- Customer Info -/->
<div class="drox-header">
<h2>Customer Info</h2>
</div>
<div class="drox-body">
<p>
<span class="customer-name">Benjamin Wahlers</span>
<span class="customer-email u-highlight">benjamin@wahlers.de</span>
</p>
<div class="form-group">
<label for="customer-info-note"><%- @T('Note') %></label>
<textarea class="form-control" id="customer-info-note" rows="5">Not assigned</textarea>
</div>
<label><%- @T('Tickets') %></label>
<ol class="tasks tasks-standalone"> <!-- vaguely based on task_widget_tasks.jst.eco -/->
<li class="task level-1 horizontal">
<div class="icon-holder">
<div class="priority icon"></div>
</div>
<div class="flex">
<div class="u-highlight name u-textTruncate">Micro-SIM doesn't work</div>
<div class="time">23 minutes ago</div>
</div>
<li class="task level-3 horizontal">
<div class="icon-holder">
<div class="priority icon"></div>
</div>
<div class="flex">
<div class="u-highlight name u-textTruncate">Superb Service!</div>
<div class="time">43 minutes ago</div>
</div>
<li class="task level-2 horizontal">
<div class="icon-holder">
<div class="priority icon"></div>
</div>
<div class="flex">
<div class="u-highlight name u-textTruncate">Print sheets strip off</div>
<div class="time">1 hour ago</div>
</div>
<li class="task level-3 horizontal">
<div class="icon-holder">
<div class="priority icon"></div>
</div>
<div class="flex">
<div class="u-highlight name u-textTruncate">Block not properly wrought</div>
<div class="time">2 hour ago</div>
</div>
</ol>
</div>
<div class="drox hide"><!-- Template Chooser, shown instead of Template Wizard Step One when there are templates there -/->
<div class="drox-header">
<h2>Choose Template:</h2>
</div>
<div class="drox-body">
<ul class="templates">
<li class="u-clickable u-highlight">Feedback New Website
</ul>
<p>Choose attributes and then save them as a new template.</p>
<p><a class="create u-clickable">Save new template</a></p>
</div>
</div>
<div class="ticket_template">
<div class="drox hide"><!-- Template Wizard Step One -/->
<div class="drox-header">
<h2>Choose Template:</h2>
</div>
<div class="drox-body">
<p>No template created yet.</p>
<p>With templates you can pre-fill ticket attributes.</p>
<p>Choose attributes and then save them as a new template.</p>
<p><a class="create u-clickable">Save new template</a></p>
</div>
</div>
<div class="drox hide"><!-- Template Wizard Step Two -/->
<div class="drox-header">
<h2>Create Template:</h2>
</div>
<div class="drox-body">
<form>
<div class="form-group">
<label for="template-title"><%- @T('Template Title') %>:</label>
<input class="form-control" id="template-title" placeholder="<%- @T('Enter Template Name') %>">
</div>
<p>This template saves the following attributes:</p>
<ul class="template-attributes">
<li class="template-attribute horizontal">
<div class="key">Owner</div> | <div class="value flex u-textTruncate">Web-Dev</div>
<div class="delete u-clickable">&times;</div>
<li class="template-attribute horizontal">
<div class="key">Type</div> | <div class="value flex u-textTruncate">Question</div>
<div class="delete u-clickable">&times;</div>
<li class="template-attribute horizontal">
<div class="key">Status</div> | <div class="value flex u-textTruncate">open</div>
<div class="delete u-clickable">&times;</div>
<li class="template-attribute horizontal">
<div class="key">Priority</div> | <div class="value flex u-textTruncate">high</div>
<div class="delete u-clickable">&times;</div>
<li class="template-attribute horizontal">
<div class="key">Tag</div> | <div class="value flex u-textTruncate">New Website</div>
<div class="delete u-clickable">&times;</div>
<li class="template-attribute horizontal">
<div class="key">Tag</div> | <div class="value flex u-textTruncate">Feedback</div>
<div class="delete u-clickable">&times;</div>
</ul>
<div class="horizontal">
<button class="btn btn-primary" type="submit"><%- @T('Save Template') %></button>
<a class="subtle-link standalone cancel align-right u-clickable"><%- @T('Cancel') %></a>
</div>
</form>
</div>
</div>
<div class="drox hide"><!-- Template Chooser, shown instead of Template Wizard Step One when there are templates there -/->
<div class="drox-header">
<h2>Choose Template:</h2>
</div>
<div class="drox-body">
<ul class="templates">
<li class="u-clickable u-highlight">Feedback New Website
</ul>
<p>Choose attributes and then save them as a new template.</p>
<p><a class="create u-clickable">Save new template</a></p>
</div>
</div>
</div>
<div class="text_module"></div>
</div>
<div class="text_module"></div>
</div>
-->
</div>
-->

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

@ -1,8 +1,8 @@
<div class="sidebar bottom-form-shadow flex">
<div class="horizontal center">
<h2 class="flex u-textTruncate"></h2>
<div class="close-sidebar centered u-clickable">
<div class="sidebar-tab-actions"></div>
<div class="tabsSidebar-close centered u-clickable">
<div class="tabsSidebar-tabActions"></div>
<div class="arrow-right icon"></div>
</div>
</div>
@ -13,9 +13,9 @@
<% end %>
</div>
<div class="sidebar-tabs vertical justified">
<div class="tabsSidebar-tabs vertical justified">
<% for item in @items: %>
<div class="sidebar-tab centered" data-content="<%= item.name %>">
<div class="tabsSidebar-tab centered" data-content="<%= item.name %>">
<div class="dark icon <%= item.icon %>"></div>
</div>
<% end %>

14
app/assets/javascripts/app/views/layout_ref/content_sidebar_tabs_right.jst.eco
View file

@ -1,5 +1,4 @@
<div class="main fit">
<div class="main fit tabsSidebarSpace">
<h1>content</h1>
<p>
@ -13,10 +12,9 @@ Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus
<p>
Maecenas sed diam eget risus varius blandit sit amet non magna. Donec id elit non mi porta gravida at eget metus. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit.
</p>
</div>
<div class="sidebar-holder">
<div class="tabsSidebar vertical">
<!-- ticket information content -->
<div class="sidebar flex" data-tab="ticket">
@ -72,17 +70,17 @@ Maecenas sed diam eget risus varius blandit sit amet non magna. Donec id elit no
</div>
<div class="sidebar-tabs vertical justified">
<div class="tabsSidebar-tabs vertical justified">
<div class="sidebar-tab centered active" data-tab="ticket">
<div class="tabsSidebar-tab centered active" data-tab="ticket">
<div class="dark icon message"></div>
</div>
<div class="sidebar-tab centered" data-tab="customer">
<div class="tabsSidebar-tab centered" data-tab="customer">
<div class="dark icon person"></div>
</div>
<div class="sidebar-tab centered" data-tab="organization">
<div class="tabsSidebar-tab centered" data-tab="organization">
<div class="dark icon group"></div>
</div>

9
app/assets/javascripts/app/views/ticket_zoom.jst.eco
View file

@ -1,7 +1,7 @@
<div class="fit ticket-zoom vertical">
<div class="flex vertical">
<div class="flex u-positionOrigin">
<div class="main no-padding">
<div class="flex-overflow u-positionOrigin sidebar-tabs--spacing">
<div class="main no-padding fit tabsSidebarSpace">
<div class="ticketZoom">
<div class="page-header horizontal">
<div class="flex vertical center">
<div class="big avatar user-popover" data-id="<%- @ticket.customer.id %>" style="background-image: url(<%- @ticket.customer.imageUrl %>)"></div>
@ -26,10 +26,9 @@
<div class="ticket-edit is-public"></div>
</div>
</div>
<div class="sidebar-holder vertical">
<div class="tabsSidebar vertical">
</div>
</div>

4
app/assets/stylesheets/application.css
View file

@ -10,9 +10,11 @@
*= require ./bootstrap-tokenfield.css
*= require ./noty_theme_twitter.css
*= require ./sew.css
*= require ./layout.css
*= require ./zzz.css
*= require ./fonts/fira-sans.css
*= require ./layout.css
*
* layout.css after zzz.css because .fix's position absolute should overwrite others
*
*= require_tree ./custom/
*

4
app/assets/stylesheets/layout.css
View file

@ -59,8 +59,8 @@
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
bottom: 0;
right: 0;
}
body.fit {

72
app/assets/stylesheets/zzz.css.erb
View file

@ -2322,31 +2322,11 @@ footer {
appearance: none;
}
.ticket-zoom {
overflow: hidden;
.ticketZoom {
background: #f8f9fa;
}
.ticket-zoom .main {
right: 0;
left: 0;
top: 0;
bottom: 0;
margin-right: 280px;
position: absolute;
transition: 500ms;
}
.ticket-zoom .flex-overflow {
overflow: hidden;
min-height: 100%;
}
.ticket-zoom.state--sidebar-hidden .main {
margin-right: 0;
}
.ticket-zoom .page-header {
.ticketZoom .page-header {
margin-top: 62px;
margin-bottom: 46px;
border-bottom: none;
@ -2811,16 +2791,26 @@ footer {
border-radius: 0 4px 4px 0;
}
.ticket-zoom .sidebar {
.tabsSidebarSpace {
padding-right: 62px !important;
margin-right: 280px;
transition: 500ms;
}
.tabsSidebarSpace.is-closed {
margin-right: 0;
}
.tabsSidebar .sidebar {
width: 280px;
border-left: 1px solid #e6e6e6;
}
.ticket-zoom .sidebar h2 {
.tabsSidebar .sidebar h2 {
margin: 5px 0 0;
}
.close-sidebar {
.tabsSidebar-close {
padding: 20px;
margin: -15px;
}
@ -2833,7 +2823,7 @@ footer {
0 -4px rgba(0,0,0,.005) inset;
}
.sidebar-holder {
.tabsSidebar {
position: absolute;
right: 0;
top: 0;
@ -2841,28 +2831,24 @@ footer {
transition: 500ms;
}
.ticket-zoom.state--sidebar-hidden .sidebar-holder {
.tabsSidebar.is-closed {
-webkit-transform: translateX(280px);
transform: translateX(280px);
}
.sidebar-tabs {
.tabsSidebar-tabs {
position: absolute;
left: -55px;
top: 0;
bottom: 0;
}
.sidebar-tabs--spacing {
padding-right: 62px;
}
.test {
position: absolute;
width: 100%;
}
.sidebar-tab {
.tabsSidebar-tab {
width: 56px;
height: 60px;
background: hsl(197,20%,93%);
@ -2871,7 +2857,7 @@ footer {
border-top: 1px solid hsl(202,12%,87%);
}
.sidebar-tab.is-changed:before {
.tabsSidebar-tab.is-changed:before {
position: absolute;
content: '';
left: -3px;
@ -2884,20 +2870,20 @@ footer {
box-shadow: 0 0 0 2px hsl(210,17%,98%);
}
.sidebar-tab:first-child {
.tabsSidebar-tab:first-child {
border-top-left-radius: 8px;
border-top: none;
}
.sidebar-tab:last-child {
.tabsSidebar-tab:last-child {
border-bottom-left-radius: 8px;
}
.sidebar-tab .icon {
.tabsSidebar-tab .icon {
opacity: 0.3;
}
.sidebar-tab.active .icon {
.tabsSidebar-tab.active .icon {
opacity: 1;
}
@ -2937,17 +2923,17 @@ footer {
opacity: 0.5;
}
.create-new .main {
.newTicket {
padding: 34px;
}
.create-new .sidebar {
.newTicket .sidebar {
width: 290px;
}
.create-new .form-control:not(:focus):not(.focus) {
.newTicket .form-control:not(:focus):not(.focus) {
border-color: hsl(0,0%,90%);
}
.create-new .subtle-link {
.newTicket .subtle-link {
color: hsl(0,0%,89%);
}
@ -3065,7 +3051,7 @@ footer {
margin-top: 20px;
}
.create-new .templates {
.newTicket .templates {
border-bottom: 1px solid hsl(240,4%,95%);
padding-bottom: 14px;
}