From 97e3d0b4f09225b7923131a72c66608d9f02d304 Mon Sep 17 00:00:00 2001 From: Mantas Masalskis Date: Thu, 6 Jun 2019 03:23:45 +0200 Subject: [PATCH] Added KB icon modifiers to categories and answers in editor mode. --- .../knowledge_base/search_item.coffee | 3 +- .../javascripts/app/lib/app_post/utils.coffee | 4 +- .../knowledge_base_can_be_published.coffee | 8 +- .../mixins/knowledge_base_translatable.coffee | 8 +- .../app/lib/mixins/view_helpers.coffee | 19 ++- .../app/models/knowledge_base_category.coffee | 8 ++ .../_icon_with_modifier.jst.eco | 8 ++ .../knowledge_base/_reader_list_item.jst.eco | 8 +- ...ent_can_be_published_header_suffix.jst.eco | 6 +- .../views/knowledge_base/navigation.jst.eco | 8 +- .../views/knowledge_base/search_item.jst.eco | 8 +- .../sidebar/generic_list.jst.eco | 1 + .../knowledge_base_public/search.js | 2 +- app/assets/stylesheets/knowledge_base.scss | 5 + app/assets/stylesheets/svg-dimensions.css | 3 + app/assets/stylesheets/zammad.scss | 135 ++++++++++++++---- .../knowledge_base/search_controller.rb | 16 +-- app/helpers/knowledge_base_helper.rb | 2 +- .../public/answers/show.html.erb | 2 +- .../public/categories/index.html.erb | 2 +- contrib/icon-sprite.sketch | Bin 260502 -> 267068 bytes public/assets/images/icons.svg | 26 +++- .../assets/images/icons/archived-modifier.svg | 10 ++ public/assets/images/icons/draft-modifier.svg | 10 ++ .../assets/images/icons/internal-modifier.svg | 10 ++ 25 files changed, 235 insertions(+), 77 deletions(-) create mode 100644 app/assets/javascripts/app/views/knowledge_base/_icon_with_modifier.jst.eco create mode 100644 public/assets/images/icons/archived-modifier.svg create mode 100644 public/assets/images/icons/draft-modifier.svg create mode 100644 public/assets/images/icons/internal-modifier.svg diff --git a/app/assets/javascripts/app/controllers/knowledge_base/search_item.coffee b/app/assets/javascripts/app/controllers/knowledge_base/search_item.coffee index b554b7378..a042d1ce2 100644 --- a/app/assets/javascripts/app/controllers/knowledge_base/search_item.coffee +++ b/app/assets/javascripts/app/controllers/knowledge_base/search_item.coffee @@ -12,7 +12,8 @@ class App.KnowledgeBaseSearchItem extends App.Controller data: -> output = @details || {} - output['url'] = @object?.uiUrl("search-return/#{@pathSuffix}") || '#' + output['url'] = @object?.uiUrl("search-return/#{@pathSuffix}") || '#' + output['state'] = @object.parent().attributesForRendering(App.KnowledgeBaseLocale.localeFor(@object)).state output render: -> diff --git a/app/assets/javascripts/app/lib/app_post/utils.coffee b/app/assets/javascripts/app/lib/app_post/utils.coffee index 5610be987..6ea202fa0 100644 --- a/app/assets/javascripts/app/lib/app_post/utils.coffee +++ b/app/assets/javascripts/app/lib/app_post/utils.coffee @@ -952,9 +952,9 @@ class App.Utils path = if window.svgPolyfill then '' else 'assets/images/icons.svg' "" - @fontIcon: (name, font) -> + @fontIcon: (name, font, className = '') -> @loadIconFont(font) - "#{String.fromCharCode('0x'+ name)}" + "#{String.fromCharCode('0x'+ name)}" @loadIconFont: (font) -> el = $("[data-icon-font=\"#{font}\"]") diff --git a/app/assets/javascripts/app/lib/mixins/knowledge_base_can_be_published.coffee b/app/assets/javascripts/app/lib/mixins/knowledge_base_can_be_published.coffee index a18f0d496..82e345ecc 100644 --- a/app/assets/javascripts/app/lib/mixins/knowledge_base_can_be_published.coffee +++ b/app/assets/javascripts/app/lib/mixins/knowledge_base_can_be_published.coffee @@ -29,13 +29,7 @@ InstanceMethods = @["#{state}_at"] can_be_published_state_css: -> - switch @can_be_published_state() - when 'archived' - 'label-danger' - when 'published' - 'label-success' - when 'draft' - 'label-subtle' + "state-#{@can_be_published_state()}" can_be_published_quick_actions: -> switch @can_be_published_state() diff --git a/app/assets/javascripts/app/lib/mixins/knowledge_base_translatable.coffee b/app/assets/javascripts/app/lib/mixins/knowledge_base_translatable.coffee index 3d57d1117..535203852 100644 --- a/app/assets/javascripts/app/lib/mixins/knowledge_base_translatable.coffee +++ b/app/assets/javascripts/app/lib/mixins/knowledge_base_translatable.coffee @@ -40,8 +40,11 @@ InstanceMethods = else attrs.editorOnly = false + attrs.state = @visibilityState(kb_locale) + if @ instanceof App.KnowledgeBaseAnswer - attrs.icon = 'knowledge-base-answer' + attrs.icon = 'knowledge-base-answer' + attrs.state = @can_be_published_state() if options.isEditor attrs.editorOnly = !@is_internally_published(kb_locale) @@ -53,9 +56,6 @@ InstanceMethods = # else if attrs.editorOnly # 'kb-item--invisible' - attrs.className = if attrs.editorOnly - 'kb-item--invisible' - attrs.icons = {} if attrs.missingTranslation diff --git a/app/assets/javascripts/app/lib/mixins/view_helpers.coffee b/app/assets/javascripts/app/lib/mixins/view_helpers.coffee index 2fbf9aa73..be4666f28 100644 --- a/app/assets/javascripts/app/lib/mixins/view_helpers.coffee +++ b/app/assets/javascripts/app/lib/mixins/view_helpers.coffee @@ -142,8 +142,8 @@ App.ViewHelpers = Icon: (name, className = '') -> App.Utils.icon(name, className) - fontIcon: (name, font) -> - App.Utils.fontIcon(name, font) + fontIcon: (name, font, className = '') -> + App.Utils.fontIcon(name, font, className) # define richtext helper RichText: (string) -> @@ -199,3 +199,18 @@ App.ViewHelpers = return false if _.isEmpty(contentType) return true if contentType.match(/image\/(png|jpg|jpeg|gif)/i) false + + # icon with modifier based on visibility state + # params: className, iconset, addStateClass + iconWithModifier: (item, params) -> + if !params.className + params.className = '' + + if params.addStateClass + params.className += " state-#{item.state}" + + App.view('knowledge_base/_icon_with_modifier')( + item: item + className: params.className + iconset: params.iconset + ) diff --git a/app/assets/javascripts/app/models/knowledge_base_category.coffee b/app/assets/javascripts/app/models/knowledge_base_category.coffee index 21f6244a0..4a0fb6b1e 100644 --- a/app/assets/javascripts/app/models/knowledge_base_category.coffee +++ b/app/assets/javascripts/app/models/knowledge_base_category.coffee @@ -141,6 +141,14 @@ class App.KnowledgeBaseCategory extends App.Model record.findDeepAnswer(callback) ) + visibilityState: (kb_locale) -> + if @visiblePublicly(kb_locale) + 'published' + else if @visibleInternally(kb_locale) + 'internal' + else + 'draft' + visibleInternally: (kb_locale) => @findDeepAnswer( (record) -> record.is_internally_published(kb_locale) diff --git a/app/assets/javascripts/app/views/knowledge_base/_icon_with_modifier.jst.eco b/app/assets/javascripts/app/views/knowledge_base/_icon_with_modifier.jst.eco new file mode 100644 index 000000000..1d5b6194d --- /dev/null +++ b/app/assets/javascripts/app/views/knowledge_base/_icon_with_modifier.jst.eco @@ -0,0 +1,8 @@ + + <% if @item.iconFont: %> + <%- @fontIcon(@item.icon, @iconset, 'section-inner-icon') %> + <% else: %> + <%- @Icon(@item.icon, 'section-inner-icon') %> + <% end %> + <%- @Icon("#{@item.state}-modifier", 'modified-icon-modifier') %> + diff --git a/app/assets/javascripts/app/views/knowledge_base/_reader_list_item.jst.eco b/app/assets/javascripts/app/views/knowledge_base/_reader_list_item.jst.eco index 033d462b9..e63571838 100644 --- a/app/assets/javascripts/app/views/knowledge_base/_reader_list_item.jst.eco +++ b/app/assets/javascripts/app/views/knowledge_base/_reader_list_item.jst.eco @@ -1,10 +1,6 @@ - <% if @item.iconFont: %> - <%- @fontIcon(@item.icon, @iconset) %> - <% else: %> - <%- @Icon(@item.icon) %> - <% end %> - <%= @item.title %> + <%- @iconWithModifier(@item, className: 'section-inner-icon-holder', iconset: @iconset, addStateClass: true) %> + <%= @item.title %> diff --git a/app/assets/javascripts/app/views/knowledge_base/content_can_be_published_header_suffix.jst.eco b/app/assets/javascripts/app/views/knowledge_base/content_can_be_published_header_suffix.jst.eco index 988c7be82..6bda52341 100644 --- a/app/assets/javascripts/app/views/knowledge_base/content_can_be_published_header_suffix.jst.eco +++ b/app/assets/javascripts/app/views/knowledge_base/content_can_be_published_header_suffix.jst.eco @@ -2,14 +2,14 @@ <%- @T(@object.can_be_published_state()) %> <% if @object.can_be_published_internal_in_future(): %> - <%- @T('Will be internal') %> <%= @humanTime @object.internal_at %> + <%- @T('Will be internal') %> <%- @humanTime(@object.internal_at) %> <% end %> <% if @object.can_be_published_publish_in_future(): %> - <%- @T('Will be published') %> <%= @humanTime @object.published_at %> + <%- @T('Will be published') %> <%- @humanTime(@object.published_at) %> <% end %> <% if @object.can_be_published_archive_in_future(): %> - <%- @T('Will be archived') %> <%- @humanTime @object.archived_at %> + <%- @T('Will be archived') %> <%- @humanTime(@object.archived_at) %> <% end %> diff --git a/app/assets/javascripts/app/views/knowledge_base/navigation.jst.eco b/app/assets/javascripts/app/views/knowledge_base/navigation.jst.eco index e3bb66544..8ce1e0555 100644 --- a/app/assets/javascripts/app/views/knowledge_base/navigation.jst.eco +++ b/app/assets/javascripts/app/views/knowledge_base/navigation.jst.eco @@ -1,12 +1,8 @@