From 99d86d74e07f2e054f168dc1494acdf448e2597a Mon Sep 17 00:00:00 2001 From: Felix Niklas Date: Thu, 6 Nov 2014 16:18:22 +0100 Subject: [PATCH] rewrite avatar first param: 40, 50 or 80 depricated avatar class: 'big' new avatar classes: size-40 (default, equal to no additional avatar class), size-50 and size-80 --- .../app/controllers/layout_ref.js.coffee | 16 ++++++++++++- .../javascripts/app/models/user.js.coffee | 16 ++++++------- .../layout_ref/communication_overview.jst.eco | 2 +- .../app/views/layout_ref/content.jst.eco | 24 ++++++++++++++++--- .../layout_ref/content_sidebar_right.jst.eco | 6 ----- .../app/views/profile/avatar-holder.jst.eco | 2 +- .../app/views/profile/avatar.jst.eco | 6 ++--- .../javascripts/app/views/ticket_zoom.jst.eco | 2 +- .../views/ticket_zoom/article_view.jst.eco | 2 +- .../app/views/ticket_zoom/edit.jst.eco | 2 +- .../javascripts/app/views/widget/user.jst.eco | 2 +- app/assets/stylesheets/zammad.css.scss | 19 +++++++++++---- 12 files changed, 68 insertions(+), 31 deletions(-) diff --git a/app/assets/javascripts/app/controllers/layout_ref.js.coffee b/app/assets/javascripts/app/controllers/layout_ref.js.coffee index 7e5831f3e..e446e71a0 100644 --- a/app/assets/javascripts/app/controllers/layout_ref.js.coffee +++ b/app/assets/javascripts/app/controllers/layout_ref.js.coffee @@ -24,7 +24,10 @@ class Content extends App.ControllerContent for avatar in @$('.user.avatar') avatar = $(avatar) - size = if avatar.hasClass('big') then 50 else 40 + size = switch + when avatar.hasClass('size-80') then 80 + when avatar.hasClass('size-50') then 50 + else 40 @createUniqueAvatar avatar, size, avatar.data('firstname'), avatar.data('lastname'), avatar.data('userid') createUniqueAvatar: (holder, size, firstname, lastname, id) -> @@ -576,4 +579,15 @@ class ImportWizard extends App.ControllerContent App.Config.set( 'layout_ref/import_wizard', ImportWizard, 'Routes' ) +class UserZoom extends App.ControllerContent + + constructor: -> + super + @render() + + render: -> + @html App.view('layout_ref/user_zoom')() + +App.Config.set( 'layout_ref/user_zoom', UserZoom, 'Routes' ) + App.Config.set( 'LayoutRef', { prio: 1700, parent: '#current_user', name: 'Layout Reference', target: '#layout_ref', role: [ 'Admin' ] }, 'NavBarRight' ) diff --git a/app/assets/javascripts/app/models/user.js.coffee b/app/assets/javascripts/app/models/user.js.coffee index 19625a39c..0734eefea 100644 --- a/app/assets/javascripts/app/models/user.js.coffee +++ b/app/assets/javascripts/app/models/user.js.coffee @@ -52,24 +52,24 @@ class App.User extends App.Model else return '??' - avatar: (big = false, placement = '', cssClass = '') -> - if big - cssClass += ' big' + avatar: (size = 40, placement = '', cssClass = '') -> + cssClass += " size-#{ size }" + if placement placement = "data-placement=\"#{placement}\"" if @image is 'none' - return @uniqueAvatar(big, placement, cssClass) + return @uniqueAvatar(size, placement, cssClass) else "" - uniqueAvatar: (big = false, placement = '', cssClass = '') -> - if big - cssClass += ' big' + uniqueAvatar: (size = 40, placement = '', cssClass = '') -> + if size and !cssClass + cssClass += " size-#{ size }" width = 300 height = 226 - size = if big then 50 else 40 + size = parseInt(size, 10) rng = new Math.seedrandom(@id) x = rng() * (width - size) diff --git a/app/assets/javascripts/app/views/layout_ref/communication_overview.jst.eco b/app/assets/javascripts/app/views/layout_ref/communication_overview.jst.eco index 5f5448bb1..7fb82e5ab 100644 --- a/app/assets/javascripts/app/views/layout_ref/communication_overview.jst.eco +++ b/app/assets/javascripts/app/views/layout_ref/communication_overview.jst.eco @@ -32,7 +32,7 @@
- NB + NB

Welcome to Zammad! We want to entertain you and your whole family!

diff --git a/app/assets/javascripts/app/views/layout_ref/content.jst.eco b/app/assets/javascripts/app/views/layout_ref/content.jst.eco index 4586c066b..022bcd76f 100644 --- a/app/assets/javascripts/app/views/layout_ref/content.jst.eco +++ b/app/assets/javascripts/app/views/layout_ref/content.jst.eco @@ -16,6 +16,21 @@

Avatars

+
+ +

.avatar

+ +
+ +

.avatar.size-50

+ +
+ +

.avatar.size-80

+ + +

Unique Avatars

+

Users and customers might not have a profile images because:

@@ -36,9 +51,12 @@ - - - + + + + + +
diff --git a/app/assets/javascripts/app/views/layout_ref/content_sidebar_right.jst.eco b/app/assets/javascripts/app/views/layout_ref/content_sidebar_right.jst.eco index 1112e5594..76146796f 100644 --- a/app/assets/javascripts/app/views/layout_ref/content_sidebar_right.jst.eco +++ b/app/assets/javascripts/app/views/layout_ref/content_sidebar_right.jst.eco @@ -7,12 +7,6 @@ Nullam quis risus eget urna mollis ornare vel eu leo. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nullam id dolor id nibh ultricies vehicula.

-

-

-
-
-
-

diff --git a/app/assets/javascripts/app/views/profile/avatar-holder.jst.eco b/app/assets/javascripts/app/views/profile/avatar-holder.jst.eco index 265f4985d..e0d37a29e 100644 --- a/app/assets/javascripts/app/views/profile/avatar-holder.jst.eco +++ b/app/assets/javascripts/app/views/profile/avatar-holder.jst.eco @@ -1,4 +1,4 @@

- +
\ No newline at end of file diff --git a/app/assets/javascripts/app/views/profile/avatar.jst.eco b/app/assets/javascripts/app/views/profile/avatar.jst.eco index 5cda454e9..bbeea8257 100644 --- a/app/assets/javascripts/app/views/profile/avatar.jst.eco +++ b/app/assets/javascripts/app/views/profile/avatar.jst.eco @@ -11,13 +11,13 @@
- <%- App.Session.get().uniqueAvatar(true) %> + <%- App.Session.get().uniqueAvatar("50") %>
- <%- App.Session.get().avatar(true, undefined, 'is-active') %> + <%- App.Session.get().avatar("50", undefined, 'is-active') %>
\ No newline at end of file diff --git a/app/assets/javascripts/app/views/ticket_zoom.jst.eco b/app/assets/javascripts/app/views/ticket_zoom.jst.eco index c24850dd5..9450c636f 100644 --- a/app/assets/javascripts/app/views/ticket_zoom.jst.eco +++ b/app/assets/javascripts/app/views/ticket_zoom.jst.eco @@ -25,7 +25,7 @@
- <%- @ticket.customer.avatar(true) %> + <%- @ticket.customer.avatar("50") %>
diff --git a/app/assets/javascripts/app/views/ticket_zoom/article_view.jst.eco b/app/assets/javascripts/app/views/ticket_zoom/article_view.jst.eco index 0505594f0..db367cf14 100644 --- a/app/assets/javascripts/app/views/ticket_zoom/article_view.jst.eco +++ b/app/assets/javascripts/app/views/ticket_zoom/article_view.jst.eco @@ -39,7 +39,7 @@ <% else: %> <% position = 'right' %> <% end %> - <%- article.created_by.avatar(false, position) %> + <%- article.created_by.avatar("40", position) %>
<%- article.html %>
diff --git a/app/assets/javascripts/app/views/ticket_zoom/edit.jst.eco b/app/assets/javascripts/app/views/ticket_zoom/edit.jst.eco index d92111bad..7349c3582 100644 --- a/app/assets/javascripts/app/views/ticket_zoom/edit.jst.eco +++ b/app/assets/javascripts/app/views/ticket_zoom/edit.jst.eco @@ -4,7 +4,7 @@
- <%- App.User.fullLocal( @S('id') ).avatar(false, 'right', 'zIndex-5') %> + <%- App.User.fullLocal( @S('id') ).avatar("40", 'right', 'zIndex-5') %>
diff --git a/app/assets/javascripts/app/views/widget/user.jst.eco b/app/assets/javascripts/app/views/widget/user.jst.eco index fbf22f122..40c5014a7 100644 --- a/app/assets/javascripts/app/views/widget/user.jst.eco +++ b/app/assets/javascripts/app/views/widget/user.jst.eco @@ -1,7 +1,7 @@
- <%- @user.avatar(true) %> + <%- @user.avatar("50") %>
<%= @user.displayName() %> diff --git a/app/assets/stylesheets/zammad.css.scss b/app/assets/stylesheets/zammad.css.scss index b44c1c8ca..192996287 100644 --- a/app/assets/stylesheets/zammad.css.scss +++ b/app/assets/stylesheets/zammad.css.scss @@ -5,12 +5,13 @@ body { background: hsl(210,17%,98%); } -ol, +p, +ol, ul { + color: #bcbcbb; } p { - color: #bcbcbb; margin: 14px 0; } @@ -2100,11 +2101,16 @@ footer { vertical-align: bottom; } - .big.avatar { + .avatar.size-50 { width: 50px; height: 50px; } + .avatar.size-80 { + width: 82px; + height: 82px; + } + .unique.avatar { background-image: image_url("avatar-bg.png"); background-size: auto; @@ -2117,11 +2123,16 @@ footer { text-shadow: 0 1px rgba(0,0,0,.2); } - .unique.big.avatar { + .unique.avatar.size-50 { font-size: 16px; line-height: 52px; } + .unique.avatar.size-80 { + font-size: 20px; + line-height: 84px; + } + .sidebar { width: 32%; max-width: 300px;