From 0fe933cdc4a04925d2f08997c982eb34e86634a2 Mon Sep 17 00:00:00 2001
From: Damir Sultanbekov <Damir.Sultanbekov@yandex.ru>
Date: Thu, 18 Apr 2024 02:29:29 +0500
Subject: [PATCH 1/5] Added icons support to checkbox_group partial and moved
 it to shared folder. Modified labels retrieval for checkboxes. Rewritten
 copyright filter in author browse page using checkbox_group partial. Added
 filter/languages partial for languages filter

---
 app/controllers/authors_controller.rb         |  13 +-
 app/views/authors/_browse_filters.html.haml   | 122 +++---------------
 app/views/authors/_checkbox_group.html.haml   |  11 --
 .../shared/filters/_checkbox_group.html.haml  |  13 ++
 .../shared/filters/_checkboxes.html.haml      |  12 ++
 app/views/shared/filters/_languages.html.haml |  31 +++++
 6 files changed, 78 insertions(+), 124 deletions(-)
 delete mode 100644 app/views/authors/_checkbox_group.html.haml
 create mode 100644 app/views/shared/filters/_checkbox_group.html.haml
 create mode 100644 app/views/shared/filters/_checkboxes.html.haml
 create mode 100644 app/views/shared/filters/_languages.html.haml

diff --git a/app/controllers/authors_controller.rb b/app/controllers/authors_controller.rb
index 171c381c..1ca1897f 100644
--- a/app/controllers/authors_controller.rb
+++ b/app/controllers/authors_controller.rb
@@ -126,15 +126,10 @@ def build_es_filter_from_filters
     end
     # languages
     if params['ckb_languages'].present?
-      if params['ckb_languages'] == ['xlat']
-        ret << {must_not: {term: {language: 'he'}}}
-        @filters << [I18n.t(:translations), 'lang_xlat', :checkbox]
-      else
-        @languages = params['ckb_languages'].reject{|x| x == 'xlat'}
-        if @languages.present?
-          ret << {terms: {language: @languages}}
-          @filters += @languages.map{|x| ["#{I18n.t(:orig_lang)}: #{helpers.textify_lang(x)}", "lang_#{x}", :checkbox]}
-        end
+      @languages = params['ckb_languages'].reject{|x| x == 'xlat'}
+      if @languages.present?
+        ret << {terms: {language: @languages}}
+        @filters += @languages.map{|x| ["#{I18n.t(:orig_lang)}: #{helpers.textify_lang(x)}", "lang_#{x}", :checkbox]}
       end
     end
     # tags by tag_id
diff --git a/app/views/authors/_browse_filters.html.haml b/app/views/authors/_browse_filters.html.haml
index 0234bcf2..ca7cb72b 100644
--- a/app/views/authors/_browse_filters.html.haml
+++ b/app/views/authors/_browse_filters.html.haml
@@ -11,59 +11,42 @@
       %input.field-v02.field-without-label#search_input{
         name: 'search_input', placeholder: t(:first_last_name), type: :text, value: @search_input
       }
-      = hidden_field_tag :author_id, @author_id.presence
 
-    = render partial: 'checkbox_group',
+    = render partial: 'shared/filters/checkbox_group',
              locals: { group_name: :gender,
                        title: t(:author_gender),
                        field_name: :ckb_genders,
                        all_values: Person.genders.keys,
-                       i18n_prefix: '',
                        selected_values: @genders,
                        facet: @gender_facet }
 
-    .sort-type
-      .vertical-expand.fcoll#fcopyright{'data-target' =>'.collfcopyright', 'data-toggle' =>'collapse'}
-        .sort-type-headline= t(:copyright_status)
-      .nested.active.collapse.show.collfcopyright
-        .nested-content.nested-list
-          - attrs = {name: "ckb_copyright[]", :type => "checkbox", id: 'copyright_0', value: 0}
-          - attrs.merge!({checked: 'checked'}) if @copyright.present? && @copyright.include?(0)
-          %input{attrs}
-          %label
-            %span.by-icon-v02> m
-            = t(:public_domain)
-            - count_text = @copyright_facet[0] || '0'
-            - count_text = t(:filtered) if count_text == '0' && @copyright.present?
-            %span= "(#{count_text})"
-          %br/
-          - attrs = {name: "ckb_copyright[]", :type => "checkbox", id: 'copyright_1', value: 1}
-          - attrs.merge!({checked: 'checked'}) if @copyright.present? && @copyright.include?(1)
-          %input{attrs}
-          %label
-            %span.by-icon-v02> x
-            = t(:by_permission)
-            - count_text = @copyright_facet[1] || '0'
-            - count_text = t(:filtered) if count_text == '0' && @copyright.present?
-            %span= "(#{count_text})"
-          %br/
+    = render partial: 'shared/filters/checkbox_group',
+             locals: { group_name: :copyright,
+                       title: t(:copyright_status),
+                       field_name: :ckb_copyright,
+                       all_values: [0, 1],
+                       labels: {0 => t(:public_domain), 1 => t(:by_permission) },
+                       selected_values: @copyright,
+                       facet: @copyright_facet,
+                       icons: {0 => 'm', 1 => 'x'} }
 
-    = render partial: 'checkbox_group',
+    = render partial: 'shared/filters/checkbox_group',
              locals: { group_name: :genre,
                        title: t(:genres),
                        field_name: :ckb_genres,
                        all_values: get_genres,
-                       i18n_prefix: '',
                        selected_values: @genres,
-                       facet: @genre_facet }
-    = render partial: 'checkbox_group',
+                       facet: @genre_facet,
+                       icons: Work::GENRES.map { |g| [g, glyph_for_genre(g)] }.to_h }
+
+    = render partial: 'shared/filters/checkbox_group',
              locals: { group_name: :period,
                        title: t(:periods),
                        field_name: :ckb_periods,
                        all_values: Expression.periods.keys,
-                       i18n_prefix: '',
                        selected_values: @periods,
                        facet: @period_facet }
+
     = render layout: 'shared/collapsible_block', locals: { container_name: 'collftags', title: t(:tags) } do
       = autocomplete_field_tag :tagstr, '', autocomplete_tag_name_path,
                                id_element: '#tag_id',
@@ -89,55 +72,8 @@
           'data-target' => '#todate'
         }/
 
-    = render layout: 'shared/collapsible_block', locals: { container_name: 'collflang', title: t(:writing_language) } do
-      %ul
-        %li
-          - attrs = { name: 'ckb_languages[]', type: :checkbox, id: 'lang_he', value: 'he' }
-          -# attrs.merge!({disabled: 'disabled'}) if @language_facet['he'].nil? || @language_facet['he'] == 0
-          - attrs.merge!({ checked: 'checked' }) if @languages.present? && @languages.include?('he')
-          %input{ attrs }
-            %label
-            = t(:hebrew)
-            - count_text = @language_facet['he'] || '0'
-            - count_text = t(:filtered) if count_text == '0' && @languages.present?
-            %span
-              (#{count_text})
-        %li
-          - attrs = { name: 'ckb_languages[]', type: :checkbox, id: 'lang_xlat', class: 'lang_xlat', value: 'xlat' }
-          -# attrs.merge!({disabled: 'disabled'}) if @language_facet[:xlat].nil? || @language_facet[:xlat] == 0
-          - attrs.merge!({ checked: 'checked' }) if @languages.present? && @languages.include?('xlat')
-          %input{ attrs }
-          %label
-            = t(:non_hebrew_languages)
-            %span
-              (#{@language_facet[:xlat] || '0'})
-          .languages-filters
-            %ul.nested-list.xlat_langs
-              - emitted_langs = ['he', :xlat]
-              - @language_facet.sort { |a, b| b[1] <=> a[1] }.each do |lang, amount|
-                - next if [:xlat, 'he'].include?(lang)
+    = render partial: 'shared/filters/languages', locals: { facet: @language_facet, selected_values: @languages }
 
-                - emitted_langs << lang
-                %li
-                  - attrs = { name: 'ckb_languages[]', type: :checkbox, id: "lang_#{lang}", value: lang }
-                  -# attrs.merge!({disabled: 'disabled'}) if @language_facet[lang].nil? || @language_facet[lang] == 0
-                  - attrs.merge!({ checked: 'checked' }) if @all_xlat || @languages&.include?(lang)
-                  %input{ attrs }
-                  %label
-                    = textify_lang(lang)
-                    - count_text = amount || '0'
-                    - count_text = t(:filtered) if count_text == '0' && @languages.present?
-                    %span
-                      (#{count_text})
-              - get_langs.reject { |x| emitted_langs.include?(x) }.each do |lang|
-                %li
-                  %input{ name: 'ckb_languages[]', type: :checkbox, id: "lang_#{lang}", value: lang }
-                  %label
-                    = textify_lang(lang)
-                    - count_text = '0'
-                    - count_text = t(:filtered) if @languages.present?
-                    %span
-                      (#{count_text})
     = hidden_field_tag(:search_after_value, nil)
     = hidden_field_tag(:search_after_id, nil)
     = hidden_field_tag(:page, 1)
@@ -147,7 +83,6 @@
       .bottom-button-area
         %button.by-button-v02#apply_mobile_filters{ type: :submit }= t(:apply_mobile_filters)
 
-
 :javascript
   function resetPagination() {
     $('##{form_id} #page_tag').val('1');
@@ -200,28 +135,7 @@
       resetPagination();
       submit_author_filters();
     });
-    $('.lang_xlat').change(function(){
-      // set all translated languages on/off accordingly
-      var checked = $(this).is(":checked");
-      $('.xlat_langs input').each(function(li){
-        $(this).prop('checked', checked);
-      });
-    });
-    $('.xlat_langs input').change(function(){
-      if($(this).is(":checked")) {
-      } else {
-        $('.lang_xlat').prop('checked', false);
-      }
-    });
-    var should_check_xlat = $('.xlat_langs input').length > 0 && !$('.lang_xlat').parent().text().match(/\(0\)/);
-    $('.xlat_langs input').each(function(li){
-      if($(this).prop('checked') == false && !$(this).parent().text().match(/\(0\)/)) {
-        should_check_xlat = false;
-      }
-    });
-    if(should_check_xlat) {
-      $('.lang_xlat').prop('checked', true);
-    }
+
     if("#{@datetype}" == "") {
       $('#birth').addClass('active');
       $('#date_type').val('birth');
diff --git a/app/views/authors/_checkbox_group.html.haml b/app/views/authors/_checkbox_group.html.haml
deleted file mode 100644
index 568e2156..00000000
--- a/app/views/authors/_checkbox_group.html.haml
+++ /dev/null
@@ -1,11 +0,0 @@
-= render layout: 'shared/collapsible_block',
-         locals: { container_name: "collf#{group_name}", title: title, content_class: 'nested-list' } do
-  - all_values.each do |value|
-    - checked = selected_values.present? && selected_values.include?(value)
-    %input{ name: "#{field_name}[]", id: "#{group_name}_#{value}", type: :checkbox, value: value, checked: checked }
-    %label
-      = t("#{i18n_prefix}#{value}")
-      - count_text = facet[value] || (selected_values.present? ? t(:filtered) : '0')
-      %span
-        (#{count_text})
-    %br/
diff --git a/app/views/shared/filters/_checkbox_group.html.haml b/app/views/shared/filters/_checkbox_group.html.haml
new file mode 100644
index 00000000..ae402568
--- /dev/null
+++ b/app/views/shared/filters/_checkbox_group.html.haml
@@ -0,0 +1,13 @@
+- icons ||= {}
+- labels ||= all_values.map { |val| [val, t(val) ] }.to_h
+
+= render layout: 'shared/collapsible_block',
+         locals: { container_name: "collf#{group_name}", title: title, content_class: 'nested-list' } do
+  = render partial: 'shared/filters/checkboxes',
+           locals: { group_name: group_name,
+                     field_name: field_name,
+                     all_values: all_values,
+                     labels: labels,
+                     selected_values: selected_values,
+                     facet: facet,
+                     icons: icons }
diff --git a/app/views/shared/filters/_checkboxes.html.haml b/app/views/shared/filters/_checkboxes.html.haml
new file mode 100644
index 00000000..9aad6863
--- /dev/null
+++ b/app/views/shared/filters/_checkboxes.html.haml
@@ -0,0 +1,12 @@
+- all_values.each do |value|
+  - checked = selected_values.present? && selected_values.include?(value)
+  - icon = icons[value]
+  %input{ name: "#{field_name}[]", id: "#{group_name}_#{value}", type: :checkbox, value: value, checked: checked }
+  %label
+    - if icon.present?
+      %span.by-icon-v02>=icon
+    = labels[value]
+    - count_text = facet[value] || (selected_values.present? ? t(:filtered) : '0')
+    %span
+      (#{count_text})
+  %br/
diff --git a/app/views/shared/filters/_languages.html.haml b/app/views/shared/filters/_languages.html.haml
new file mode 100644
index 00000000..0fcbacb9
--- /dev/null
+++ b/app/views/shared/filters/_languages.html.haml
@@ -0,0 +1,31 @@
+= render layout: 'shared/collapsible_block', locals: { container_name: 'collflang', title: t(:writing_language) } do
+  :ruby
+    foreign_langs = get_langs.reject { |lang| lang == 'he' }.sort_by { |lang| textify_lang(lang) }
+    selected_values ||= []
+    selected_top_level_values = []
+    selected_top_level_values << 'he' if selected_values.include?('he')
+    selected_top_level_values << :xlat if foreign_langs.all? { |lang| selected_values.include?(lang) }
+  = render partial: 'shared/filters/checkboxes',
+           locals: { group_name: :lang,
+                     field_name: :ckb_languages,
+                     all_values: ['he', :xlat],
+                     labels: { 'he' => textify_lang('he'), :xlat => t(:non_hebrew_languages)},
+                     selected_values: selected_top_level_values,
+                     facet: facet,
+                     icons: {} }
+
+  .languages-filters.nested-list
+    = render partial: 'shared/filters/checkboxes',
+             locals: { group_name: :lang,
+                       field_name: :ckb_languages,
+                       all_values: foreign_langs,
+                       labels: foreign_langs.map { |lang| [lang, textify_lang(lang)] }.to_h,
+                       selected_values: selected_values,
+                       facet: facet,
+                       icons: {} }
+:javascript
+  $(function() {
+    $('input#lang_xlat').change(function(){
+      $('.languages-filters input').prop('checked', $(this).is(":checked"));
+    });
+  });

From a9f6beb12091aac101a19850d04b9c5f149f1eb2 Mon Sep 17 00:00:00 2001
From: Damir Sultanbekov <Damir.Sultanbekov@yandex.ru>
Date: Thu, 18 Apr 2024 05:29:03 +0500
Subject: [PATCH 2/5] rewritten works/browse filters using shared partials

---
 .../filtering_and_pagination_concern.rb       |   9 -
 app/controllers/manifestation_controller.rb   |  19 +-
 .../manifestation/_browse_filters.html.haml   | 315 ++++--------------
 3 files changed, 82 insertions(+), 261 deletions(-)

diff --git a/app/controllers/concerns/filtering_and_pagination_concern.rb b/app/controllers/concerns/filtering_and_pagination_concern.rb
index daa0166e..acea9777 100644
--- a/app/controllers/concerns/filtering_and_pagination_concern.rb
+++ b/app/controllers/concerns/filtering_and_pagination_concern.rb
@@ -8,15 +8,6 @@ module FilteringAndPaginationConcern
 
   private
 
-  def es_buckets_to_facet(buckets, codes)
-    facet = {}
-    buckets.each do |facethash|
-      code = codes[facethash['key']]
-      facet[code] = facethash['doc_count'] unless code.nil?
-    end
-    facet
-  end
-
   def buckets_to_totals_hash(buckets)
     buckets.to_h { |facethash| [facethash['key'], facethash['doc_count']] }
   end
diff --git a/app/controllers/manifestation_controller.rb b/app/controllers/manifestation_controller.rb
index 84514777..acbdf686 100644
--- a/app/controllers/manifestation_controller.rb
+++ b/app/controllers/manifestation_controller.rb
@@ -717,16 +717,17 @@ def prepare_totals(collection)
 
     collection = collection.aggregations(standard_aggregations)
 
-    @gender_facet = es_buckets_to_facet(collection.aggs['author_genders']['buckets'], Person.genders)
-    @tgender_facet = es_buckets_to_facet(collection.aggs['translator_genders']['buckets'], Person.genders)
-    @period_facet = es_buckets_to_facet(collection.aggs['periods']['buckets'], Expression.periods)
-    @genre_facet = es_buckets_to_facet(collection.aggs['genres']['buckets'], get_genres.to_h { |g| [g, g] })
-    @language_facet = es_buckets_to_facet(collection.aggs['languages']['buckets'], get_langs.to_h { |l| [l, l] })
+    @gender_facet = buckets_to_totals_hash(collection.aggs['author_genders']['buckets'])
+    @tgender_facet = buckets_to_totals_hash(collection.aggs['translator_genders']['buckets'])
+    @period_facet = buckets_to_totals_hash(collection.aggs['periods']['buckets'])
+    @genre_facet = buckets_to_totals_hash(collection.aggs['genres']['buckets'])
+
+    @language_facet = buckets_to_totals_hash(collection.aggs['languages']['buckets'])
     @language_facet[:xlat] = @language_facet.except('he').values.sum
-    @copyright_facet = es_buckets_to_facet(
-      collection.aggs['copyright_status']['buckets'],
-      { 'false' => 0, 'true' => 1 }
-    )
+
+    @copyright_facet = collection.aggs['copyright_status']['buckets'].map do |hash|
+      [ hash['key'] == 'true' ? 1 : 0, hash['doc_count'] ]
+    end.to_h
 
     # Preparing list of authors to show in multiselect modal on works browse page
     if collection.filter.present?
diff --git a/app/views/manifestation/_browse_filters.html.haml b/app/views/manifestation/_browse_filters.html.haml
index 1f3bc926..ea7d7a47 100644
--- a/app/views/manifestation/_browse_filters.html.haml
+++ b/app/views/manifestation/_browse_filters.html.haml
@@ -6,230 +6,81 @@
   .by-card-content-v02.desktop-only#filters_panel
     .headline-2-v02= t(:filter_by)
     %span.reset.linkcolor.pointer= t(:reset_filter)
-    .sort-type
-      .vertical-expand.fcoll#fauthor{'data-target' =>'.collfauthor', 'data-toggle' =>'collapse'}
-        .sort-type-headline= t(:name)
-      .nested.active.collapse.show.collfauthor
-        .nested-content
-          .search-mobile-switch
-            %button.search-mobile-option.opt_workname= t(:work_title)
-            %button.search-mobile-option.opt_authorname= t(:author_name)
-          %break
-          %input.field-v02.field-without-label#search_input{:placeholder => t(:what_to_search_for), name: 'search_input', :type => "text", value: @search_input}/
-          = autocomplete_field_tag :authorstr, @authorstr.present? ? @authorstr : '', autocomplete_person_name_path, id_element: '#author_id', 'data-noMatchesLabel' => t(:no_matches_found), style:'display:none', 'class' => 'field-v02 field-without-label author-name-field', id: 'authors', placeholder: t(:author_names)
-          = hidden_field_tag :author_id, @author_id.present? ? @author_id : nil
+    = render layout: 'shared/collapsible_block', locals: { container_name: 'collfauthor', title: t(:name) } do
+      .search-mobile-switch
+        %button.search-mobile-option.opt_workname= t(:work_title)
+        %button.search-mobile-option.opt_authorname= t(:author_name)
+      %break
+      %input.field-v02.field-without-label#search_input{:placeholder => t(:what_to_search_for), name: 'search_input', :type => "text", value: @search_input}/
+      = autocomplete_field_tag :authorstr, @authorstr.present? ? @authorstr : '', autocomplete_person_name_path, id_element: '#author_id', 'data-noMatchesLabel' => t(:no_matches_found), style:'display:none', 'class' => 'field-v02 field-without-label author-name-field', id: 'authors', placeholder: t(:author_names)
+      = hidden_field_tag :author_id, @author_id.present? ? @author_id : nil
 
-          .multi-name-sort.pointer{style:'display:inline-block;'}
-            %span.linkcolor.pointer{'data-toggle' => 'modal', 'data-target' => '#authorsDlg'}= t(:multiselect)
-          = hidden_field_tag(:search_type, id: 'search_type')
-          = hidden_field_tag(:authors, @authors, id: 'author_ids')
-          = hidden_field_tag(:authors_names, @authors_names, id: 'authors_names')
-    .sort-type
-      .vertical-expand.fcoll{'data-target' =>'.collfgender', 'data-toggle' =>'collapse'}
-        .sort-type-headline= t(:author_gender)
-      .nested.active.collapse.show.collfgender
-        .nested-content.nested-list
-          - Person.genders.invert.each do |p|
-            -# attrs = @gender_facet[p[0]].nil? ? {disabled: 'disabled'} : {}
-            - attrs = {}
-            - attrs.merge!({:name => "ckb_genders[]", :type => "checkbox", id: "gender_#{p[1]}", value: p[1]})
-            - attrs.merge!({checked: 'checked'}) if @genders.present? && @genders.include?(p[1])
-            %input{ attrs}
-            %label
-              = t(p[1])
-              - count_text = @gender_facet[p[0]] || '0'
-              - count_text = t(:filtered) if count_text == '0' && @genders.present?
-              %span= "(#{count_text})"
-            %br/
-    .sort-type
-      .vertical-expand.fcoll{'data-target' =>'.collftgender', 'data-toggle' =>'collapse'}
-        .sort-type-headline= t(:translator_gender)
-      .nested.active.collapse.show.collftgender
-        .nested-content.nested-list
-          - Person.genders.invert.each do |p|
-            -# attrs = @tgender_facet[p[0]].nil? ? {disabled: 'disabled'} : {}
-            - attrs = {}
-            - attrs.merge!({:name => "ckb_tgenders[]", :type => "checkbox", id: "tgender_#{p[1]}", value: p[1]})
-            - attrs.merge!({checked: 'checked'}) if @tgenders.present? && @tgenders.include?(p[1])
-            %input{ attrs}
-            %label
-              = t(p[1])
-              - count_text = @tgender_facet[p[0]] || '0'
-              - count_text = t(:filtered) if count_text == '0' && @tgenders.present?
-              %span= "(#{count_text})"
-            %br/
+      .multi-name-sort.pointer{style:'display:inline-block;'}
+        %span.linkcolor.pointer{'data-toggle' => 'modal', 'data-target' => '#authorsDlg'}= t(:multiselect)
+      = hidden_field_tag(:search_type, id: 'search_type')
+      = hidden_field_tag(:authors, @authors, id: 'author_ids')
+      = hidden_field_tag(:authors_names, @authors_names, id: 'authors_names')
 
-    .sort-type
-      .vertical-expand.fcoll#fcopyright{'data-target' =>'.collfcopyright', 'data-toggle' =>'collapse'}
-        .sort-type-headline= t(:copyright_status)
-      .nested.active.collapse.show.collfcopyright
-        .nested-content.nested-list
-          - attrs = {name: "ckb_copyright[]", :type => "checkbox", id: 'copyright_0', value: 0}
-          -# attrs.merge!({disabled: 'disabled'}) if @copyright_facet[0].nil?
-          - attrs.merge!({checked: 'checked'}) if @copyright.present? && @copyright.include?(0)
-          %input{attrs}
-          %label
-            %span.by-icon-v02> m
-            = t(:public_domain)
-            - count_text = @copyright_facet[0] || '0'
-            - count_text = t(:filtered) if count_text == '0' && @copyright.present?
-            %span= "(#{count_text})"
-          %br/
-          - attrs = {name: "ckb_copyright[]", :type => "checkbox", id: 'copyright_1', value: 1}
-          -# attrs.merge!({disabled: 'disabled'}) if @copyright_facet[1].nil?
-          - attrs.merge!({checked: 'checked'}) if @copyright.present? && @copyright.include?(1)
-          %input{attrs}
-          %label
-            %span.by-icon-v02> x
-            = t(:by_permission)
-            - count_text = @copyright_facet[1] || '0'
-            - count_text = t(:filtered) if count_text == '0' && @copyright.present?
-            %span= "(#{count_text})"
-          %br/
-    .sort-type
-      .vertical-expand.fcoll#fgenre{'data-target' =>'.collfgenre', 'data-toggle' =>'collapse'}
-        .sort-type-headline= t(:genres)
-      .nested.active.collapse.show.collfgenre
-        .nested-content.nested-list
-          - get_genres.each do |g|
-            -# attrs = @genre_facet[g].nil? ? {disabled: 'disabled'} : {}
-            - attrs = {}
-            - attrs.merge!({:name => "ckb_genres[]", :type => "checkbox", id: "genre_#{g}", value: g})
-            - attrs.merge!({checked: 'checked'}) if @genres.present? && @genres.include?(g)
-            %input{ attrs}
-            %label
-              %span.by-icon-v02>= glyph_for_genre(g)
-              = textify_genre(g)
-              - count_text = @genre_facet[g] || '0'
-              - count_text = t(:filtered) if count_text == '0' && @genres.present?
-              %span= "(#{count_text})"
-            %br/
-    .sort-type
-      .vertical-expand.fcoll#fperiod{'data-target' =>'.collfperiod', 'data-toggle' =>'collapse'}
-        .sort-type-headline= t(:periods)
-      .nested.active.collapse.show.collfperiod
-        .nested-content.nested-list
-          - Expression.periods.invert.each do |p|
-            -# attrs = @period_facet[p[0]].nil? ? {disabled: 'disabled'} : {}
-            - attrs = {}
-            - attrs.merge!({:name => "ckb_periods[]", :type => "checkbox", id: "period_#{p[1]}", value: p[1]})
-            - attrs.merge!({checked: 'checked'}) if @periods.present? && @periods.include?(p[1])
-            %input{ attrs}
-            %label
-              = t(p[1])
-              - count_text = @period_facet[p[0]] || '0'
-              - count_text = t(:filtered) if count_text == '0' && @periods.present?
-              %span= "(#{count_text})"
-            %br/
-    .sort-type
-      .vertical-expand.fcoll#ftags{'data-target' =>'.collftags', 'data-toggle' =>'collapse'}
-        .sort-type-headline= t(:tags)
-      .nested.active.collapse.show.collftags
-        .nested-content
-          /%input.field-v02.field-without-label#tag_input{:placeholder => t(:what_to_search_for), name: 'tag_input', :type => "text"}/
-          = autocomplete_field_tag :tagstr, '', autocomplete_tag_name_path, id_element: '#tag_id', 'data-noMatchesLabel' => t(:no_matches_found), 'class' => 'field-v02 field-without-label author-name-field', id: 'tags', placeholder: t(:tag)
-          = hidden_field_tag :tag_ids, @tag_ids, id: 'tag_ids'
+    = render partial: 'shared/filters/checkbox_group',
+             locals: { group_name: :gender,
+                       title: t(:author_gender),
+                       field_name: :ckb_genders,
+                       all_values: Person.genders.keys,
+                       selected_values: @genders,
+                       facet: @gender_facet }
 
-    / .sort-type
-    /   .vertical-expand
-    /     .sort-type-headline מאפיינים
-    /   .nested.active
-    /     .nested-content.nested-list
-    /       .col-md-6.col-sm-12
-    /         %input#CheckboxGroup4_1{:name => "CheckboxGroup4", :type => "checkbox", value: "sort_by_curatorial_content"}/
-    /         %label
-    /           תוכן אוצרותי
-    /           %span (4)
-    /         %br/
-    /         %input#CheckboxGroup4_2{:name => "CheckboxGroup4", :type => "checkbox", value: "sort_by_recommendations"}/
-    /         %label
-    /           המלצות קוראים
-    /           %span (12)
-    /         %br/
-    /         %input#CheckboxGroup4_3{:name => "CheckboxGroup4", :type => "checkbox", value: "sort_by_liked"}/
-    /         %label
-    /           יצירות שאהבתי
-    /           %span (2)
-    /       .col-md-6.col-sm-12
-    /         %input#CheckboxGroup4_4{:disabled => "disabled", :name => "CheckboxGroup4", :type => "checkbox", value: "sort_by_active_bookmark"}/
-    /         %label
-    /           סימניה מופעלת
-    /           %span (0)
-    /         %br/
-    /         %input#CheckboxGroup4_5{:name => "CheckboxGroup4", :type => "checkbox", value: "sort_by_no_properties"}/
-    /         %label
-    /           ללא מאפיינים
-    /           %span (312)
-    .sort-type
-      .vertical-expand.fcoll#fdate{'data-target' =>'.collfdate', 'data-toggle' =>'collapse'}
-        .sort-type-headline= t(:thedate)
-      .nested.active.collapse.show.collfdate
-        .nested-content
-          .search-mobile-switch
-            %button.search-mobile-option.datetype#published= t(:publication)
-            %button.search-mobile-option.datetype#created= t(:creation)
-            %button.search-mobile-option.datetype#uploaded= t(:upload)
-            = hidden_field_tag(:date_type, '', id: 'date_type')
-          %break
-          .dates-range
-            / #histogramSlider
-            /.dates-graph-area
-            /.range-outside
-            /  .range-inside
-            /    .range-handle-right
-            /    .range-handle-left
-            %input.datepicker.datetimepicker-input.field-v02.field-without-label.range-date-field#fromdate{:placeholder => t(:year), name: "fromdate", 'data-toggle' => 'datetimepicker', 'data-target' => '#fromdate' }/
-            .date-range-to= t(:until)
-            %input.datepicker.datetimepicker-input.field-v02.field-without-label.range-date-field#todate{:placeholder => t(:year), :style => "float: left", 'data-toggle' => 'datetimepicker', name: "todate", 'data-target' => '#todate'}/
-    .sort-type
-      .vertical-expand.fcoll#flang{'data-target' =>'.collflang', 'data-toggle' =>'collapse'}
-        .sort-type-headline= t(:orig_lang)
-      .nested.active.collapse.show.collflang
-        .nested-content{:style => "padding-right: 0"}
-          %ul
-            %li
-              - attrs = {name: "ckb_languages[]", :type => "checkbox", id: 'lang_he', value: 'he'}
-              -# attrs.merge!({disabled: 'disabled'}) if @language_facet['he'].nil? || @language_facet['he'] == 0
-              - attrs.merge!({checked: 'checked'}) if @languages.present? && @languages.include?('he')
-              %input{attrs}
-                %label
-                = t(:hebrew)
-                - count_text = @language_facet['he'] || '0'
-                - count_text = t(:filtered) if count_text == '0' && @languages.present?
-                %span= "(#{count_text})"
-            %li
-              - attrs = {name: "ckb_languages[]", :type => "checkbox", id: 'lang_xlat', class: 'lang_xlat', value: 'xlat'}
-              -# attrs.merge!({disabled: 'disabled'}) if @language_facet[:xlat].nil? || @language_facet[:xlat] == 0
-              - attrs.merge!({checked: 'checked'}) if (@all_xlat || (@languages.present? && @languages.include?('xlat')))
-              %input{attrs}
-              %label
-                = t(:translations)
-                %span= "(#{@language_facet[:xlat] || '0'})"
-              .languages-filters
-                %ul.nested-list.xlat_langs
-                  - emitted_langs = ['he', :xlat]
-                  - @language_facet.sort{|a,b| b[1] <=> a[1]}.each do |lang, amount|
-                    - next if lang == :xlat || lang == 'he'
-                    - emitted_langs << lang
-                    %li
-                      - attrs = {name: "ckb_languages[]", :type => "checkbox", id: "lang_#{lang}", value: lang}
-                      -# attrs.merge!({disabled: 'disabled'}) if @language_facet[lang].nil? || @language_facet[lang] == 0
-                      - attrs.merge!({checked: 'checked'}) if @all_xlat || (@languages.present? && @languages.include?(lang))
-                      %input{attrs}
-                      %label
-                        = textify_lang(lang)
-                        - count_text = amount || '0'
-                        - count_text = t(:filtered) if count_text == '0' && @languages.present?
-                        %span= "(#{count_text})"
-                  - get_langs.reject{|x| emitted_langs.include?(x)}.each do |lang|
-                    %li
-                      %input{name: "ckb_languages[]", :type => "checkbox", id: "lang_#{lang}", value: lang}
-                      %label
-                        = textify_lang(lang)
-                        - count_text = '0'
-                        - count_text = t(:filtered) if @languages.present?
-                        %span= "(#{count_text})"
+    = render partial: 'shared/filters/checkbox_group',
+             locals: { group_name: :tgender,
+                       title: t(:translator_gender),
+                       field_name: :ckb_tgenders,
+                       all_values: Person.genders.keys,
+                       selected_values: @tgenders,
+                       facet: @tgender_facet }
 
+    = render partial: 'shared/filters/checkbox_group',
+             locals: { group_name: :copyright,
+                       title: t(:copyright_status),
+                       field_name: :ckb_copyright,
+                       all_values: [0, 1],
+                       labels: {0 => t(:public_domain), 1 => t(:by_permission) },
+                       selected_values: @copyright,
+                       facet: @copyright_facet,
+                       icons: {0 => 'm', 1 => 'x'} }
+
+    = render partial: 'shared/filters/checkbox_group',
+             locals: { group_name: :genre,
+                       title: t(:genres),
+                       field_name: :ckb_genres,
+                       all_values: get_genres,
+                       selected_values: @genres,
+                       facet: @genre_facet,
+                       icons: Work::GENRES.map { |g| [g, glyph_for_genre(g)] }.to_h }
+
+    = render partial: 'shared/filters/checkbox_group',
+             locals: { group_name: :period,
+                       title: t(:periods),
+                       field_name: :ckb_periods,
+                       all_values: Expression.periods.keys,
+                       selected_values: @periods,
+                       facet: @period_facet }
+
+    = render layout: 'shared/collapsible_block', locals: { container_name: 'collftags', title: t(:tags) } do
+      = autocomplete_field_tag :tagstr, '', autocomplete_tag_name_path, id_element: '#tag_id', 'data-noMatchesLabel' => t(:no_matches_found), 'class' => 'field-v02 field-without-label author-name-field', id: 'tags', placeholder: t(:tag)
+      = hidden_field_tag :tag_ids, @tag_ids, id: 'tag_ids'
+
+    = render layout: 'shared/collapsible_block', locals: { container_name: 'collfdate', title: t(:thedate) } do
+      .search-mobile-switch
+        %button.search-mobile-option.datetype#published= t(:publication)
+        %button.search-mobile-option.datetype#created= t(:creation)
+        %button.search-mobile-option.datetype#uploaded= t(:upload)
+        = hidden_field_tag(:date_type, '', id: 'date_type')
+      %break
+      .dates-range
+        %input.datepicker.datetimepicker-input.field-v02.field-without-label.range-date-field#fromdate{:placeholder => t(:year), name: "fromdate", 'data-toggle' => 'datetimepicker', 'data-target' => '#fromdate' }/
+        .date-range-to= t(:until)
+        %input.datepicker.datetimepicker-input.field-v02.field-without-label.range-date-field#todate{:placeholder => t(:year), :style => "float: left", 'data-toggle' => 'datetimepicker', name: "todate", 'data-target' => '#todate'}/
+
+    = render partial: 'shared/filters/languages', locals: { facet: @language_facet, selected_values: @languages }
 
     = hidden_field_tag(:emit_filters, 'true', id: 'emit_filters')
     = hidden_field_tag(:search_after_value, '')
@@ -317,28 +168,7 @@
       $('#toletter_tag').val(''); // reset pagination
       submit_filters();
     });
-    $('.lang_xlat').change(function(){
-      // set all translated languages on/off accordingly
-      var checked = $(this).is(":checked");
-      $('.xlat_langs input').each(function(li){
-        $(this).prop('checked', checked);
-      });
-    });
-    $('.xlat_langs input').change(function(){
-      if($(this).is(":checked")) {
-      } else {
-        $('.lang_xlat').prop('checked', false);
-      }
-    });
-    var should_check_xlat = $('.xlat_langs input').length > 0 && !$('.lang_xlat').parent().text().match(/\(0\)/);
-    $('.xlat_langs input').each(function(li){
-      if($(this).prop('checked') == false && !$(this).parent().text().match(/\(0\)/)) {
-        should_check_xlat = false;
-      }
-    });
-    if(should_check_xlat) {
-      $('.lang_xlat').prop('checked', true);
-    }
+
     if("#{@datetype}" == "") {
       $('#created').addClass('active');
       $('#date_type').val('created');
@@ -373,5 +203,4 @@
       $('#search_type').val('authorname');
       submit_filters();
     });
-
   });

From be66640a8512c0de61e387539fa52e8d293c7277 Mon Sep 17 00:00:00 2001
From: Damir Sultanbekov <Damir.Sultanbekov@yandex.ru>
Date: Sun, 21 Apr 2024 00:21:22 +0500
Subject: [PATCH 3/5] refactored works filter to use same html form for mobile
 and desktop views.

---
 app/assets/javascripts/application.js         |   9 -
 app/assets/stylesheets/BY_styles_General.css  |   7 -
 app/assets/stylesheets/BY_styles_Max767.css   |   3 -
 app/assets/stylesheets/application.css        |   3 -
 .../filtering_and_pagination_concern.rb       |   2 -
 app/controllers/manifestation_controller.rb   |  36 +-
 app/views/authors/_browse_filters.html.haml   |   5 -
 app/views/authors/_browse_list.html.haml      |   6 +-
 .../manifestation/_authors_select.html.haml   |   2 +-
 .../manifestation/_browse_filters.html.haml   | 109 +++---
 .../manifestation/_browse_list.html.haml      |  49 +--
 app/views/manifestation/_browse_top.html.haml |  29 +-
 .../manifestation/_mobile_filters.html.haml   | 310 ------------------
 app/views/manifestation/browse.html.haml      |  30 +-
 app/views/manifestation/browse.js.erb         |   8 +-
 app/views/shared/_pagination.html.haml        |  80 +----
 16 files changed, 144 insertions(+), 544 deletions(-)
 delete mode 100644 app/views/manifestation/_mobile_filters.html.haml

diff --git a/app/assets/javascripts/application.js b/app/assets/javascripts/application.js
index 7decf733..6a80c1b2 100644
--- a/app/assets/javascripts/application.js
+++ b/app/assets/javascripts/application.js
@@ -27,12 +27,3 @@ var mobileWidth = 767;
 function isMobile() {
   return window.innerWidth < mobileWidth;
 }
-
-function submit_filters() {
-  startModal('spinnerdiv');
-  if(window.innerWidth < mobileWidth) {
-    $('#mobile_filters').submit();
-  } else {
-    $('#works_filters').submit();
-  }
-}
diff --git a/app/assets/stylesheets/BY_styles_General.css b/app/assets/stylesheets/BY_styles_General.css
index 22f1a5b7..df4f2c75 100644
--- a/app/assets/stylesheets/BY_styles_General.css
+++ b/app/assets/stylesheets/BY_styles_General.css
@@ -3998,13 +3998,6 @@ a .by-icon-v02:disabled{
 #sort-by{
 	width: auto;
 }
-.sort-by-desktop{
-	display: block;
-	margin-right: 8px;
-}
-.sort-by-mobile{
-	display: none;
-}
 
 .sort-type{
 	margin-top: 15px;
diff --git a/app/assets/stylesheets/BY_styles_Max767.css b/app/assets/stylesheets/BY_styles_Max767.css
index 47e2e36e..7f23e59b 100644
--- a/app/assets/stylesheets/BY_styles_Max767.css
+++ b/app/assets/stylesheets/BY_styles_Max767.css
@@ -142,9 +142,6 @@
 #author-whats-new-popup{
 	    background-color: #eeeced;
 	}
-.sort-by-desktop{
-	display: none;
-}
 .author-side-sort{
   display:none;
 }
diff --git a/app/assets/stylesheets/application.css b/app/assets/stylesheets/application.css
index 05fb7d0f..393ebc0e 100644
--- a/app/assets/stylesheets/application.css
+++ b/app/assets/stylesheets/application.css
@@ -408,9 +408,6 @@ body.modal-open{
 .notice a {color:#514721;}
 .success a {color:#264409;}
 
-.sort-by-mobile{
-	display: block !important;
-}
 .flex-row {
   display: flex;
   /* flex: 1 0 100%; */
diff --git a/app/controllers/concerns/filtering_and_pagination_concern.rb b/app/controllers/concerns/filtering_and_pagination_concern.rb
index acea9777..df080ac7 100644
--- a/app/controllers/concerns/filtering_and_pagination_concern.rb
+++ b/app/controllers/concerns/filtering_and_pagination_concern.rb
@@ -20,8 +20,6 @@ def paginate(collection)
     # in works list (e.g. to start second page from index 101)
     @page = (params[:page] || 1).to_i
 
-    @emit_filters = params[:load_filters] == 'true' || params[:emit_filters] == 'true'
-
     prepare_totals(collection) # This method should be implemented in controllers using this concern
 
     # checking if non-first page should be loaded
diff --git a/app/controllers/manifestation_controller.rb b/app/controllers/manifestation_controller.rb
index acbdf686..ad91c18c 100644
--- a/app/controllers/manifestation_controller.rb
+++ b/app/controllers/manifestation_controller.rb
@@ -641,16 +641,6 @@ def build_es_filter_from_filters
       @filters += @tgenders.map { |x| [I18n.t(:translator) + ': ' + I18n.t(x), "tgender_#{x}", :checkbox] }
     end
 
-    # author ids - multi-select authors
-    if params['authors'].present?
-      @search_type = 'authorname'
-      author_ids = params['authors'].split(',').map(&:to_i)
-      ret['author_ids'] = author_ids
-      @authors = author_ids # .join(',')
-      @authors_names = params['authors_names']
-      @filters << [I18n.t(:authors_xx, xx: @authors_names), 'authors', :authorlist]
-    end
-
     # languages
     @languages = params['ckb_languages']
     if @languages.present?
@@ -685,17 +675,29 @@ def build_es_filter_from_filters
       ret[datefield] = range_expr
     end
 
+    # author ids - multi-select authors
+    if params['authors'].present?
+      author_ids = params['authors'].split(',').map(&:to_i)
+      ret['author_ids'] = author_ids
+      @authors = author_ids # .join(',')
+      @authors_names = params['authors_names']
+      @filters << [I18n.t(:authors_xx, xx: @authors_names), 'authors', :authorlist]
+    end
+
     # in browse UI we can either use search by author name or by title, but not together
-    @authorstr = params['authorstr']
-    @search_input = params['search_input']
-    if @search_input.present? || @authorstr.present?
-      if params['search_type'] == 'authorname' || (@authorstr.present? && @search_input.empty?)
+    @search_type = params['search_type'] || 'authorname'
+    if @search_type == 'authorname'
+      @authorstr = params['authorstr']
+      @search_input = ''
+      if @authorstr.present?
         ret['author'] = @authorstr
-        @search_type = 'authorname'
         @filters << [I18n.t(:author_x, x: @authorstr), :authors, :text]
-      else
+      end
+    else
+      @authorstr = ''
+      @search_input = params['search_input']
+      if @search_input.present?
         ret['title'] = @search_input
-        @search_type = 'workname'
         @filters << [I18n.t(:title_x, x: @search_input), :search_input, :text]
       end
     end
diff --git a/app/views/authors/_browse_filters.html.haml b/app/views/authors/_browse_filters.html.haml
index ca7cb72b..0f12d504 100644
--- a/app/views/authors/_browse_filters.html.haml
+++ b/app/views/authors/_browse_filters.html.haml
@@ -84,11 +84,6 @@
         %button.by-button-v02#apply_mobile_filters{ type: :submit }= t(:apply_mobile_filters)
 
 :javascript
-  function resetPagination() {
-    $('##{form_id} #page_tag').val('1');
-    $('##{form_id} #to_letter').val('');
-  }
-
   $(document).ready(function() {
     $('#sort_by_select').val("#{@sort}");
     $('.datetype').click(function(e) {
diff --git a/app/views/authors/_browse_list.html.haml b/app/views/authors/_browse_list.html.haml
index 1534334b..732fe946 100644
--- a/app/views/authors/_browse_list.html.haml
+++ b/app/views/authors/_browse_list.html.haml
@@ -17,7 +17,8 @@
         = f
         %span.pointer.tag-x{'data-ele': id, 'data-which' => which}= '-'
 .by-card-content-v02
-  = render partial: 'shared/pagination', locals: { add_js: false }
+  = render partial: 'shared/pagination',
+           locals: { submit_function: 'submit_author_filters', form_id: 'authors_filters', add_js: false }
   .select-all-with-buttons
     .headline-4-v02= t(:sort_by)
     #sort-by
@@ -44,7 +45,8 @@
           = link_to au.sort_name.presence || '_', person_path(au.id)
           .authors-list-years= decorator.call(au)
   = hidden_field_tag(:hurl, request.original_url)
-  = render partial: 'shared/pagination', locals: { add_js: true }
+  = render partial: 'shared/pagination',
+           locals: { submit_function: 'submit_author_filters', form_id: 'authors_filters', add_js: true }
 :javascript
   $(document).ready(function() {
     $('.tag-x').click(function() {
diff --git a/app/views/manifestation/_authors_select.html.haml b/app/views/manifestation/_authors_select.html.haml
index 65780019..2b78163a 100644
--- a/app/views/manifestation/_authors_select.html.haml
+++ b/app/views/manifestation/_authors_select.html.haml
@@ -58,4 +58,4 @@
       submit_filters();
       return false;
     });
-  });
\ No newline at end of file
+  });
diff --git a/app/views/manifestation/_browse_filters.html.haml b/app/views/manifestation/_browse_filters.html.haml
index ea7d7a47..c68384b4 100644
--- a/app/views/manifestation/_browse_filters.html.haml
+++ b/app/views/manifestation/_browse_filters.html.haml
@@ -1,9 +1,10 @@
 %link{ rel:'stylesheet', href:'https://cdnjs.cloudflare.com/ajax/libs/tempusdominus-bootstrap-4/5.0.0-alpha14/css/tempusdominus-bootstrap-4.min.css'}
 %script{ src: 'https://use.fontawesome.com/3f861a49f5.js'}
 
-= form_tag(works_path, remote: true, method: :post, id: 'works_filters') do
+- form_id = 'works_filters'
+= form_tag(works_path, remote: true, method: :post, id: form_id, autocomplete: :off) do
   = hidden_field_tag(:sort_by, @sort)
-  .by-card-content-v02.desktop-only#filters_panel
+  .by-card-content-v02#filters_panel
     .headline-2-v02= t(:filter_by)
     %span.reset.linkcolor.pointer= t(:reset_filter)
     = render layout: 'shared/collapsible_block', locals: { container_name: 'collfauthor', title: t(:name) } do
@@ -11,16 +12,25 @@
         %button.search-mobile-option.opt_workname= t(:work_title)
         %button.search-mobile-option.opt_authorname= t(:author_name)
       %break
-      %input.field-v02.field-without-label#search_input{:placeholder => t(:what_to_search_for), name: 'search_input', :type => "text", value: @search_input}/
-      = autocomplete_field_tag :authorstr, @authorstr.present? ? @authorstr : '', autocomplete_person_name_path, id_element: '#author_id', 'data-noMatchesLabel' => t(:no_matches_found), style:'display:none', 'class' => 'field-v02 field-without-label author-name-field', id: 'authors', placeholder: t(:author_names)
+      %input.field-v02.field-without-label#search_input{ placeholder: t(:what_to_search_for),
+                                                         name: 'search_input',
+                                                         type: :text,
+                                                         value: @search_input}/
+      = autocomplete_field_tag :authorstr, @authorstr, autocomplete_person_name_path,
+                               id_element: '#author_id',
+                               'data-noMatchesLabel' => t(:no_matches_found),
+                               style:'display:none',
+                               class: 'field-v02 field-without-label author-name-field',
+                               id: 'authors',
+                               placeholder: t(:author_names)
       = hidden_field_tag :author_id, @author_id.present? ? @author_id : nil
-
-      .multi-name-sort.pointer{style:'display:inline-block;'}
+      .multi-name-sort.desktop-only.pointer
         %span.linkcolor.pointer{'data-toggle' => 'modal', 'data-target' => '#authorsDlg'}= t(:multiselect)
-      = hidden_field_tag(:search_type, id: 'search_type')
       = hidden_field_tag(:authors, @authors, id: 'author_ids')
       = hidden_field_tag(:authors_names, @authors_names, id: 'authors_names')
 
+      = hidden_field_tag(:search_type, id: 'search_type')
+
     = render partial: 'shared/filters/checkbox_group',
              locals: { group_name: :gender,
                        title: t(:author_gender),
@@ -82,49 +92,56 @@
 
     = render partial: 'shared/filters/languages', locals: { facet: @language_facet, selected_values: @languages }
 
-    = hidden_field_tag(:emit_filters, 'true', id: 'emit_filters')
     = hidden_field_tag(:search_after_value, '')
     = hidden_field_tag(:search_after_id, '')
     = hidden_field_tag(:page, '1')
     = hidden_field_tag(:reverse, 'false')
-    = hidden_field_tag(:to_letter, '', id: 'toletter_tag')
+    = hidden_field_tag(:to_letter, @to_letter)
+    .mobile-only
+      .bottom-button-area
+        %button.by-button-v02#apply_mobile_filters{ type: :submit }= t(:apply_mobile_filters)
 
 :javascript
-  $(document).ready(function() {
-    $('#sort_by_dd').val("#{@sort}");
-    if("#{@search_type}" == 'authorname') {
+  function toggleSearchType(type) {
+    $('#search_type').val(type);
+    const author = (type == 'authorname');
+
+    if (author) {
       $('.opt_authorname').addClass('active');
-      $('.multi-name-sort').show();
-      $('#authors').show();
-      $('#search_input').hide();
-      $('#search_type').val('authorname');
+      $('.opt_workname').removeClass('active');
     } else {
-      $('.multi-name-sort').hide();
+      $('.opt_authorname').removeClass('active');
       $('.opt_workname').addClass('active');
-      $('#search_type').val('workname');
     }
+    if (!isMobile()) {
+      $('.multi-name-sort').toggle(author);
+    }
+    $('#authors').toggle(author);
+    $('#search_input').toggle(!author);
+  }
+
+  $(document).ready(function() {
+    $('#sort_by_dd').val("#{@sort}");
+
+    toggleSearchType('#{@search_type}');
+
     $('.datetype').click(function(e) {
       e.preventDefault();
       $('.datetype').removeClass('active');
       $(this).addClass('active');
       $('#date_type').val($(this).attr('id'));
     });
+
     $('.opt_authorname').click(function(e){
       e.preventDefault();
-      $('.opt_workname').removeClass('active');
-      $('.opt_authorname').addClass('active');
-      $('#authors').show();
-      $('#search_input').hide();
-      $('.multi-name-sort').show();
+      toggleSearchType('authorname');
     });
+
     $('.opt_workname').click(function(e){
       e.preventDefault();
-      $('.opt_workname').addClass('active');
-      $('.opt_authorname').removeClass('active');
-      $('#authors').hide();
-      $('#search_input').show();
-      $('.multi-name-sort').hide();
+      toggleSearchType('workname');
     });
+
     var submit_timeout = null;
     $('#tags').on('railsAutocomplete.select', function(event, data){
       event.preventDefault();
@@ -132,20 +149,22 @@
       $('#tag_ids').val( $('#tag_ids').val() == '' ? tag_id : $('#tag_ids').val()+','+tag_id);
       submit_filters();
     });
+
     $('#works_filters').on('change', function(e){
-      if(e.target.id != 'tags') {
-        if(window.innerWidth >= mobileWidth) {
-          if(submit_timeout != null){
-            window.clearTimeout(submit_timeout);
-          }
-          if($('.opt_workname').hasClass('active'))
-            $('#search_type').val('workname');
-          else
-            $('#search_type').val('authorname');
-          submit_timeout = window.setTimeout(submit_filters, 300);
+      if(e.target.id == 'tags') {
+        return;
+      }
+
+      if(!isMobile()) {
+        // On Desktop we automatically submit form after some values were changed by user
+        if(submit_timeout != null){
+          window.clearTimeout(submit_timeout);
         }
+        resetPagination();
+        submit_timeout = window.setTimeout(submit_filters, 300);
       }
     });
+
     $('.reset').click(function(){
       $('#works_filters').find(':input').each(function() {
         switch(this.type) {
@@ -161,11 +180,11 @@
                 this.checked = false;
         }
       });
+
       $('#author_ids').val('');
       $('#tag_ids').val('');
       $('#authors_names').val('');
-      $('#emit_filters').val('true');
-      $('#toletter_tag').val(''); // reset pagination
+      resetPagination();
       submit_filters();
     });
 
@@ -176,6 +195,7 @@
       $("##{@datetype}").addClass('active');
       $('#date_type').val("#{@datetype}");
     }
+
     $('.datepicker').datetimepicker({
       viewMode: 'years',
       rtl: true,
@@ -192,6 +212,7 @@
     }).on('hide.datetimepicker', function(e){
       window.setTimeout(submit_filters, 2000);
     });
+
     if("#{@fromdate}" != "") {
       $('#fromdate').val("#{@fromdate}");
     }
@@ -203,4 +224,12 @@
       $('#search_type').val('authorname');
       submit_filters();
     });
+
+    $('#apply_mobile_filters').click(function() {
+      resetPagination();
+      // TODO: adjust
+      $('#browse_intro').toggle();
+      $('#sort_filter_panel').toggle();
+      $('#thelist').toggle();
+    });
   });
diff --git a/app/views/manifestation/_browse_list.html.haml b/app/views/manifestation/_browse_list.html.haml
index 4918a5e3..0bbc4910 100644
--- a/app/views/manifestation/_browse_list.html.haml
+++ b/app/views/manifestation/_browse_list.html.haml
@@ -17,7 +17,8 @@
         = f
         %span.pointer.tag-x{'data-ele': id, 'data-which' => which}= '-'
 .by-card-content-v02
-  = render partial: 'shared/pagination', locals: { add_js: false }
+  = render partial: 'shared/pagination',
+           locals: { submit_function: 'submit_filters', form_id: 'works_filters', add_js: false }
   %hr
   .select-all-with-buttons
     .select-text-checkbox-area
@@ -58,7 +59,8 @@
           = link_to m.title_and_authors, manifestation_path(m.id)
           = decorator.call(m)
   = hidden_field_tag(:hurl, request.original_url)
-  = render partial: 'shared/pagination', locals: { add_js: true }
+  = render partial: 'shared/pagination',
+           locals: { submit_function: 'submit_filters', form_id: 'works_filters', add_js: true }
 :javascript
   /**
    * Handle Animation (Start, Reset, Restart)
@@ -78,34 +80,18 @@
     $('.tag-x').click(function(){
       const field = $(this).data('ele');
 
-      if (field == 'to_letter') {
-        const filters = #{@emit_filters == true};
-        if(filters) {
-          submit_filters();
-        } else {
-          const url = urlWithoutPaging();
-          url.searchParams.delete('to_letter');
-          window.history.pushState($('#works_filters').serialize(), null, '/works');
-          $.get(url.href, '', null, 'script');
-        }
-        return;
-      }
-
-      // uncheck/clear the appropriate field
-      var prefix = (window.innerWidth < mobileWidth) ? '#mobile_filters ' : '#works_filters ';
-
       if($(this).attr('data-which') == 'text') {
-        $(prefix + '#' + field).val('');
+        $('#works_filters #' + field).val('');
       } else if ($(this).attr('data-which') == 'authorlist') {
-        $(prefix + '#author_ids').val('');
-        $(prefix + '#authors_names').val('');
-        $(prefix + 'input[name="ckb_authors[]"]').prop('checked', false);
+        $('#works_filters #author_ids').val('');
+        $('#works_filters #authors_names').val('');
+        $('#works_filters input[name="ckb_authors[]"]').prop('checked', false);
       } else {
-        $(prefix + '#' + field).prop("checked", false);
+        $('#works_filters #' + field).prop("checked", false);
       }
       // and submit the form
       $('input').attr('disabled', false); // re-enable checkboxes to preserve other filters
-      window.history.pushState($(prefix).serialize(), null, '/works');
+
       submit_filters();
     });
 
@@ -138,14 +124,17 @@
         });
       }
     }
+
     $('#reset_multiselect').click(function() {
       $('.mainlist li input[type=checkbox]').prop('checked', false);
       $('#select-all').prop('checked', false);
       $('#selected_counter').text($('.multiselect_checkbox:checked').length);
     });
+
     $('#multiselect_btn').click(function(){
       $.fn.browse_multi_select_toggle();
     });
+
     $('#select-all').change(function(){
       $('.mainlist li input[type=checkbox]').prop('checked', $(this).prop('checked'));
       if($('.add-to-anthology').css('display') == 'none' && $(this).prop('checked')) {
@@ -154,16 +143,12 @@
       }
       $('#selected_counter').text($('.multiselect_checkbox:checked').length);
     });
+
     $('#sort_by_dd').change(function(){
       $('input[name=sort_by]').val($('#sort_by_dd option:selected').val());
-      if($('#works_filters').length > 0) {
-        window.history.pushState($('#works_filters').serialize(), null, '/works');
-        submit_filters();
-      } else {
-        startModal('spinnerdiv');
-        window.location = "/works?sort_by="+$('#sort_by_dd option:selected').val();
-      }
+      submit_filters();
     });
+
     $('#add-to-anth-btn').click(function() {
       if(#{@anthology.nil? ? 'true' : 'false'} == true) {
         alert('create or select an anthology first.');
@@ -188,7 +173,7 @@
     });
 
     $('#current_sort_by').click(function(){
-      $('#mobileFilterDlg').modal('show');
+      // TODO: display dialog on mobile
       $('.mobile-sort-area').show();
       $('.sort-by-mobile').show();
       $('.author-mobile-filters-area').hide();
diff --git a/app/views/manifestation/_browse_top.html.haml b/app/views/manifestation/_browse_top.html.haml
index 87dfc450..c5a02c5d 100644
--- a/app/views/manifestation/_browse_top.html.haml
+++ b/app/views/manifestation/_browse_top.html.haml
@@ -76,28 +76,13 @@
   }
   $(document).ready(function(){
     $('#sort_filter_toggle').click(function() {
-      if(window.innerWidth < mobileWidth) {
-        $('#mobileFilterDlg').modal('show');
-        $('#opt_filter').addClass('active');
-        $('#opt_sort').removeClass('active');
+      $('#browse_intro').toggle();
+      $('#sort_filter_panel').toggle();
+      if (isMobile()) {
+        $('#thelist').toggle();
       } else {
-        $('#browse_intro').toggle();
-        $('#sort_filter_panel').toggle();
+        $('.toggle-button-no').toggle();
+        $('.toggle-button-yes').toggle();
       }
-      
-      if($('#filters_panel .temporary').length) { // if filter panel yet to be loaded
-        startModal('spinnerdiv');
-        var url = $('#hurl').val().replace(/page=\d+/,'');
-        if(url.indexOf('?') == -1) {
-          url = url + '?';
-        }
-        else {
-          url = url + '&';
-        }
-        url = url + 'load_filters=true';
-        $.get(url,'',null, 'script');
-      }
-      $('.toggle-button-no').toggle();
-      $('.toggle-button-yes').toggle();
     });
-  });
\ No newline at end of file
+  });
diff --git a/app/views/manifestation/_mobile_filters.html.haml b/app/views/manifestation/_mobile_filters.html.haml
deleted file mode 100644
index f92ab188..00000000
--- a/app/views/manifestation/_mobile_filters.html.haml
+++ /dev/null
@@ -1,310 +0,0 @@
-= form_tag(works_path, remote: true, method: :post, id: 'mobile_filters') do
-  = hidden_field_tag(:sort_by, @sort)
-  = hidden_field_tag(:author_id, @author_id.present? ? @author_id : nil)
-  = hidden_field_tag(:search_type, '' ,id: 'search_type')
-  = hidden_field_tag(:authors, @authors, id: 'author_ids')
-  = hidden_field_tag(:authors_names, @authors_names, id: 'authors_names')
-  = hidden_field_tag(:date_type, '', id: 'date_type')
-  = hidden_field_tag(:emit_filters, sortonly ? 'false' : 'true', id: 'emit_filters')
-  = hidden_field_tag(:search_after_value, '')
-  = hidden_field_tag(:search_after_id, '')
-  = hidden_field_tag(:page, '1')
-  = hidden_field_tag(:reverse, 'false')
-  = hidden_field_tag(:to_letter, '', id: 'toletter_tag')
-  #texts-list-filter_M.flex-popup.filter-sort-m-popup
-    .popup-top
-      %button.btn-small-outline-v02{'data-dismiss'=>'modal'}
-        .btn-text-v02
-          %span.right-arrow 2
-          %span= t(:back)
-      .headline-2-v02{style: "text-align: center;margin: 0; padding-top: 3px;"} סינון ומיון
-      - unless sortonly
-        %button.reset.btn-small-outline-v02
-          .btn-text-v02= t(:reset_filter)
-    .by-popup-v02
-      .by-card-content-v02.limited-height-popup-content-v02
-        .author-mobile-sort-and-filter
-          - unless sortonly
-            .search-mobile-switch
-              %button.search-mobile-option#opt_filter= t(:filter)
-              %button.search-mobile-option#opt_sort= t(:sort)
-            .by-horizontal-seperator-light
-          .mobile-sort-area{style:'display: none'}
-            %div{style: "margin-top: 15px"}
-              .headline-2-v02= t(:sort_by)
-              #sort-by
-                .sort-by-mobile
-                  %p
-                    = radio_button_tag(:sort_by, 'alphabetical_asc', @sort == 'alphabetical_asc' ? true: nil)
-                    %label= t(:alefbet_asc)
-                    %br
-                    = radio_button_tag(:sort_by, 'alphabetical_desc', @sort == 'alphabetical_desc' ? true: nil)
-                    %label= t(:alefbet_desc)
-                    %br
-                    = radio_button_tag(:sort_by, 'popularity_desc', @sort == 'popularity_desc' ? true: nil)
-                    %label= t(:popularity_desc)
-                    %br
-                    = radio_button_tag(:sort_by, 'popularity_asc', @sort == 'popularity_asc' ? true: nil)
-                    %label= t(:popularity_asc)
-                    %br
-                    %b
-                      %label= t(:dates)
-                    %br
-                    = radio_button_tag(:sort_by, 'publication_date_asc', @sort == 'publication_date_asc' ? true: nil)
-                    %label= t(:pubdate_asc)
-                    %br
-                    = radio_button_tag(:sort_by, 'publication_date_desc', @sort == 'publication_date_desc' ? true: nil)
-                    %label= t(:pubdate_desc)
-                    %br
-                    = radio_button_tag(:sort_by, 'creation_date_asc', @sort == 'creation_date_asc' ? true: nil)
-                    %label= t(:workdate_asc)
-                    %br
-                    = radio_button_tag(:sort_by, 'creation_date_desc', @sort == 'creation_date_desc' ? true: nil)
-                    %label= t(:workdate_desc)
-                    %br
-                    = radio_button_tag(:sort_by, 'upload_date_asc', @sort == 'upload_date_asc' ? true: nil)
-                    %label= t(:uploaddate_asc)
-                    %br
-                    = radio_button_tag(:sort_by, 'upload_date_desc', @sort == 'upload_date_desc' ? true: nil)
-                    %label= t(:uploaddate_desc)
-                    %br
-          - unless sortonly
-            .author-mobile-filters-area{style:'display: none'}
-              .headline-2-v02= t(:filter_by)
-              .sort-type
-                .vertical-expand.collapsed{'data-target' =>'.collfauthor', 'data-toggle' =>'collapse'}
-                  .sort-type-headline= t(:name)
-                .collapse.collfauthor
-                  .nested-content
-                    .search-mobile-switch
-                      %button.search-mobile-option.opt_workname= t(:work_title)
-                      %button.search-mobile-option.opt_authorname= t(:author_name)
-                    %break
-                    %input.field-v02.field-without-label.author-name-field#search_input{:placeholder => t(:what_to_search_for), name: 'search_input', :type => "text", value: @search_input}
-                    = autocomplete_field_tag :authorstr, @authorstr.present? ? @authorstr : '', autocomplete_person_name_path, id_element: '#author_id', 'data-noMatchesLabel' => t(:no_matches_found), style:'display:none', 'class' => 'field-v02 field-without-label author-name-field', id: 'authors', placeholder: t(:author_names)
-                    = hidden_field_tag :author_id, @author_id.present? ? @author_id : nil
-          
-                    .multi-name-sort.pointer
-                      %span.linkcolor{'data-toggle' => 'modal', 'data-target' => '#authorsDlg'}= t(:multiselect)
-              .sort-type
-                .vertical-expand.collapsed{'data-target' =>'.collfgender', 'data-toggle' =>'collapse'}
-                  .sort-type-headline= t(:author_gender)
-                .collapse.collfgender
-                  .nested-content.nested-list
-                    - Person.genders.invert.each do |p|
-                      -# attrs = @gender_facet[p[0]].nil? ? {disabled: 'disabled'} : {}
-                      - attrs = {}
-                      - attrs.merge!({:name => "ckb_genders[]", :type => "checkbox", id: "gender_#{p[1]}", value: p[1]})
-                      - attrs.merge!({checked: 'checked'}) if @genders.present? && @genders.include?(p[1])
-                      %input{ attrs}
-                      %label
-                        = t(p[1])
-                        - count_text = @gender_facet[p[0]] || '0'
-                        - count_text = t(:filtered) if count_text == '0' && @genders.present?
-                        %span= "(#{count_text})"
-                      %br/
-              .sort-type
-                .vertical-expand.collapsed{'data-target' =>'.collftgender', 'data-toggle' =>'collapse'}
-                  .sort-type-headline= t(:translator_gender)
-                .collapse.collftgender
-                  .nested-content.nested-list
-                    - Person.genders.invert.each do |p|
-                      -# attrs = @tgender_facet[p[0]].nil? ? {disabled: 'disabled'} : {}
-                      - attrs = {}
-                      - attrs.merge!({:name => "ckb_tgenders[]", :type => "checkbox", id: "tgender_#{p[1]}", value: p[1]})
-                      - attrs.merge!({checked: 'checked'}) if @tgenders.present? && @tgenders.include?(p[1])
-                      %input{ attrs}
-                      %label
-                        = t(p[1])
-                        - count_text = @tgender_facet[p[0]] || '0'
-                        - count_text = t(:filtered) if count_text == '0' && @tgenders.present?
-                        %span= "(#{count_text})"
-                      %br/
-
-              .sort-type
-                .vertical-expand.collapsed{'data-target' =>'.collfcopyright', 'data-toggle' =>'collapse'}
-                  .sort-type-headline= t(:copyright_status)
-                .collapse.collfcopyright
-                  .nested-content.nested-list
-                    - attrs = {name: "ckb_copyright[]", :type => "checkbox", id: 'copyright_0', value: 0}
-                    -# attrs.merge!({disabled: 'disabled'}) if @copyright_facet[0].nil?
-                    - attrs.merge!({checked: 'checked'}) if @copyright.present? && @copyright.include?(0)
-
-                    %input{attrs}
-                    %label
-                      %span.by-icon-v02> m
-                      = t(:public_domain)
-                      - count_text = @copyright_facet[0] || '0'
-                      - count_text = t(:filtered) if count_text == '0' && @copyright.present?
-                      %span= "(#{count_text})"
-                    %br/
-                    - attrs = {name: "ckb_copyright[]", :type => "checkbox", id: 'copyright_1', value: 1}
-                    -# attrs.merge!({disabled: 'disabled'}) if @copyright_facet[1].nil?
-                    - attrs.merge!({checked: 'checked'}) if @copyright.present? && @copyright.include?(1)
-                    %input{attrs}
-                    %label
-                      %span.by-icon-v02> x
-                      = t(:by_permission)
-                      - count_text = @copyright_facet[1] || '0'
-                      - count_text = t(:filtered) if count_text == '0' && @copyright.present?
-                      %span= "(#{count_text})"
-                    %br/
-              .sort-type
-                .vertical-expand.collapsed{'data-target' =>'.collfgenre', 'data-toggle' =>'collapse'}
-                  .sort-type-headline= t(:genres)
-                .collapse.collfgenre
-                  .nested-content.nested-list
-                    - get_genres.each do |g|
-                      -# attrs = @genre_facet[g].nil? ? {disabled: 'disabled'} : {}
-                      - attrs = {}
-                      - attrs.merge!({:name => "ckb_genres[]", :type => "checkbox", id: "genre_#{g}", value: g})
-                      - attrs.merge!({checked: 'checked'}) if @genres.present? && @genres.include?(g)
-                      %input{ attrs}
-                      %label
-                        %span.by-icon-v02>= glyph_for_genre(g)
-                        = textify_genre(g)
-                        - count_text = @genre_facet[g] || '0'
-                        - count_text = t(:filtered) if count_text == '0' && @genres.present?
-                        %span= "(#{count_text})"
-                      %br/
-              .sort-type
-                .vertical-expand.collapsed{'data-target' =>'.collfperiod', 'data-toggle' =>'collapse'}
-                  .sort-type-headline= t(:periods)
-                .collapse.collfperiod
-                  .nested-content.nested-list
-                    - Expression.periods.invert.each do |p|
-                      -# attrs = @period_facet[p[0]].nil? ? {disabled: 'disabled'} : {}
-                      - attrs = {}
-                      - attrs.merge!({:name => "ckb_periods[]", :type => "checkbox", id: "period_#{p[1]}", value: p[1]})
-                      - attrs.merge!({checked: 'checked'}) if @periods.present? && @periods.include?(p[1])
-                      %input{ attrs}
-                      %label
-                        = t(p[1])
-                        - count_text = @period_facet[p[0]] || '0'
-                        - count_text = t(:filtered) if count_text == '0' && @periods.present?
-                        %span= "(#{count_text})"
-                      %br/
-              .sort-type
-                .vertical-expand.collapsed{'data-target' =>'.collfdate', 'data-toggle' =>'collapse'}
-                  .sort-type-headline= t(:thedate)
-                .collapse.collfdate
-                  .nested-content
-                    .search-mobile-switch
-                      %button.search-mobile-option.datetype#published= t(:publication)
-                      %button.search-mobile-option.datetype#created= t(:creation)
-                      %button.search-mobile-option.datetype#uploaded= t(:upload)
-                    %break
-                    .dates-range
-                      / #histogramSlider
-                      /.dates-graph-area
-                      /.range-outside
-                      /  .range-inside
-                      /    .range-handle-right
-                      /    .range-handle-left
-                      %input.datepicker.datetimepicker-input.field-v02.field-without-label.range-date-field#fromdate{:placeholder => t(:year), name: "fromdate", 'data-toggle' => 'datetimepicker', 'data-target' => '#fromdate' }/
-                      .date-range-to= t(:until)
-                      %input.datepicker.datetimepicker-input.field-v02.field-without-label.range-date-field#todate{:placeholder => t(:year), :style => "float: left", 'data-toggle' => 'datetimepicker', name: "todate", 'data-target' => '#todate'}/
-              .sort-type
-                .vertical-expand.collapsed{'data-target' =>'.collflang', 'data-toggle' =>'collapse'}
-                  .sort-type-headline= t(:orig_lang)
-                .collapse.collflang
-                  .nested-content{style: "padding-right: 0"}
-                    %ul
-                      %li
-                        - attrs = {name: "ckb_languages[]", :type => "checkbox", id: 'lang_he', value: 'he'}
-                        -# attrs.merge!({disabled: 'disabled'}) if @language_facet['he'].nil? || @language_facet['he'] == 0
-                        - attrs.merge!({checked: 'checked'}) if @languages.present? && @languages.include?('he')
-                        %input{attrs}
-                        %label
-                          = t(:hebrew)
-                          - count_text = @language_facet['he'] || '0'
-                          - count_text = t(:filtered) if count_text == '0' && @languages.present?
-                          %span= "(#{count_text})"
-                      %li
-                        - attrs = {name: "ckb_languages[]", :type => "checkbox", id: 'lang_xlat', class: 'lang_xlat', value: 'xlat'}
-                        -# attrs.merge!({disabled: 'disabled'}) if @language_facet[:xlat].nil? || @language_facet[:xlat] == 0
-                        - attrs.merge!({checked: 'checked'}) if @all_xlat || (@languages.present? && @languages.include?('xlat'))
-                        %input{attrs}
-                        %label
-                          = t(:translations)
-                          %span= "(#{@language_facet[:xlat] || '0'})"
-                        .languages-filters
-                          %ul.nested-list.xlat_langs
-                            - emitted_langs = ['he', :xlat]
-                            - @language_facet.sort{|a,b| b[1] <=> a[1]}.each do |lang, amount|
-                              - next if lang == :xlat || lang == 'he'
-                              - emitted_langs << lang
-                              %li
-                                - attrs = {name: "ckb_languages[]", :type => "checkbox", id: "lang_#{lang}", value: lang}
-                                -# attrs.merge!({disabled: 'disabled'}) if @language_facet[lang].nil? || @language_facet[lang] == 0
-                                - attrs.merge!({checked: 'checked'}) if @languages.present? && @languages.include?(lang)
-                                %input{attrs}
-                                %label
-                                  = textify_lang(lang)
-                                  - count_text = amount || '0'
-                                  - count_text = t(:filtered) if count_text == '0' && @languages.present?
-                                  %span= "(#{count_text})"
-                            - get_langs.reject{|x| emitted_langs.include?(x)}.each do |lang|
-                              %li
-                                %input{name: "ckb_languages[]", :type => "checkbox", id: "lang_#{lang}", value: lang}
-                                %label
-                                  = textify_lang(lang)
-                                  - count_text = '0'
-                                  - count_text = t(:filtered) if @languages.present?
-                                  %span= "(#{count_text})"
-      .bottom-button-area
-        %button.by-button-v02#apply_mobile_filters= t(:apply_mobile_filters)
-:javascript
-  $(document).ready(function() {
-    if("#{@sort_or_filter}" == 'sort') {
-      $('.mobile-sort-area').show();
-      $('.author-mobile-filters-area').hide();
-      $('#opt_sort').addClass('active');
-      $('#opt_filter').removeClass('active');
-    } else {
-      $('.mobile-sort-area').hide();
-      $('.author-mobile-filters-area').show();
-      $('#opt_filter').addClass('active');
-      $('#opt_sort').removeClass('active');
-    }
-    $('#opt_filter').click(function(e){
-      e.preventDefault();
-      $('.mobile-sort-area').hide();
-      $('.author-mobile-filters-area').show();
-      $('#opt_filter').addClass('active');
-      $('#opt_sort').removeClass('active');
-    });
-    $('#opt_sort').click(function(e){
-      e.preventDefault();
-      $('.mobile-sort-area').show();
-      $('.author-mobile-filters-area').hide();
-      $('#opt_sort').addClass('active');
-      $('#opt_filter').removeClass('active');
-    });
-    $('#apply_mobile_filters').click(function(e){
-      e.preventDefault();
-      $('#mobileFilterDlg').modal('hide');
-      submit_filters();
-    });
-    $('.lang_xlat').change(function(){
-      // set all translated languages on/off accordingly
-      var checked = $(this).is(":checked");
-      $('.xlat_langs input').each(function(li){
-        $(this).prop('checked', checked);
-      });
-    });
-    var mshould_check_xlat = $('.xlat_langs input').length > 0;
-    var m_any_checked = false;
-    $('.xlat_langs input').each(function(li){
-      if($(this).prop('checked') == false) {
-        if(!$(this).parent().text().match(/\(0\)/)) {
-          mshould_check_xlat = false;
-        }
-      } else {
-        m_any_checked = true;
-      }
-    });
-    if(mshould_check_xlat && m_any_checked) {
-      $('.lang_xlat').prop('checked', true);
-    }
-  });
diff --git a/app/views/manifestation/browse.html.haml b/app/views/manifestation/browse.html.haml
index e8bd0dcc..58e23701 100644
--- a/app/views/manifestation/browse.html.haml
+++ b/app/views/manifestation/browse.html.haml
@@ -1,32 +1,28 @@
 -# Browse works
 #content.container-fluid
   .row.list-all-texts
-    .col-12.col-lg-4
-      .by-card-v02.desktop-only#browse_intro{style:"display:#{ @filters.empty? ? 'show' : 'none'}"}
+    .col-sm-12.col-md-4
+      .by-card-v02#browse_intro{ style: "display:#{ @filters.empty? ? 'block' : 'none'}" }
         .work-area
           .work-content
             .headline-1-v02= t(:welcome_to_works_browsing)
             %p!= t(:works_browsing_intro_html)
           .work-side-color
             .work-genre.prose-side-icon
-      - if @filters.empty?
-        .by-card-v02.text-sorting#sort_filter_panel{style: 'display:none'}
-          .by-card-header-v02
-            .headline-2-v02= t(:sort_by)
-          .by-card-content-v02#filters_panel
-            .temporary
-      - else
-        .by-card-v02.text-sorting#sort_filter_panel{style: 'display:show'}
-          = render partial: 'browse_filters'
-    .col-12.col-lg-8
+      .by-card-v02.text-sorting#sort_filter_panel{ style: 'display:none' }
+        = render partial: 'browse_filters'
+    .col-sm-12.col-md-8
       .by-card-v02#thelist
         = render partial: 'browse_list'
+
 #authorsDlg.modal{'aria-hidden' => 'true', role: 'dialog', tabindex: '-1'}
   = render partial: 'authors_select', locals: {authors: @authors, list: @authors_list}
 - if current_user
   = render partial: 'shared/anth_stuff'
-#mobileFilterDlg.modal{'aria-hidden' => 'true', role: 'dialog', tabindex: '-1'}
-  - unless @filters.empty?
-    = render partial: 'mobile_filters', locals: {sortonly: false}
-  - else
-    = render partial: 'mobile_filters', locals: {sortonly: true}
+
+:javascript
+  function submit_filters() {
+    window.history.pushState($('#works_filters').serialize(), null, '/works');
+    startModal('spinnerdiv');
+    $('#works_filters').submit();
+  }
diff --git a/app/views/manifestation/browse.js.erb b/app/views/manifestation/browse.js.erb
index 801d03a7..4d183c14 100644
--- a/app/views/manifestation/browse.js.erb
+++ b/app/views/manifestation/browse.js.erb
@@ -1,8 +1,6 @@
 $('#thelist').html("<%= j(render partial: 'browse_list') %>");
-<% if @emit_filters %>
 $('#sort_filter_panel').html("<%= j(render partial: 'browse_filters') %>");
 $('#authorsDlg').html("<%= j(render partial: 'authors_select', locals: {authors: @authors, list: @authors_list}) %>");
-$('#mobileFilterDlg').html("<%= j(render partial: 'mobile_filters', locals: {authors: @authors, list: @authors_list, sortonly: false}) %>");
 if("#{@sort_or_filter}" == 'sort') {
   $('.mobile-sort-area').show();
   $('.author-mobile-filters-area').hide();
@@ -12,8 +10,4 @@ if("#{@sort_or_filter}" == 'sort') {
   $('.author-mobile-filters-area').show();
   $('#opt_filter').addClass('active');
 }
-<% else %>
-$('#mobileFilterDlg').html("<%= j(render partial: 'mobile_filters', locals: {authors: @authors, list: @authors_list, sortonly: true}) %>");
-
-<% end %>
-stopModal('spinnerdiv');
\ No newline at end of file
+stopModal('spinnerdiv');
diff --git a/app/views/shared/_pagination.html.haml b/app/views/shared/_pagination.html.haml
index 8bbfa33a..63f08a48 100644
--- a/app/views/shared/_pagination.html.haml
+++ b/app/views/shared/_pagination.html.haml
@@ -20,88 +20,34 @@
               '',
               { class: (letter == @to_letter ? 'letterbutton active' : 'letterbutton'), data: { letter: letter } }
 
-- if add_js && controller_name == 'manifestation'
-  -# TODO: this block of code is made for compatibility with works controller. Should be removed after works browse
-     will be updated
+- if add_js
   :javascript
-    function urlWithoutPaging() {
-      const urlObject = new URL($('#hurl').val());
-      urlObject.searchParams.delete('search_after_value');
-      urlObject.searchParams.delete('search_after_id');
-      urlObject.searchParams.delete('page');
-      urlObject.searchParams.delete('reverse');
-      return urlObject;
+    function resetPagination() {
+      $('##{form_id} #page').val('1');
+      $('##{form_id} #to_letter').val('');
     }
 
     $(function() {
       $('.letterbutton').click(function(e) {
         e.stopImmediatePropagation();
         e.preventDefault();
-        const filters = #{@emit_filters == true};
         const letter = $(this).data('letter');
-        if(filters) {
-          $('#toletter_tag').val(letter);
-          $('#search_after_value').val('');
-          $('#search_after_id').val('');
-          submit_filters();
-        } else {
-          const urlObject = urlWithoutPaging();
-          urlObject.searchParams.set('to_letter', letter);
-          window.history.pushState($('#works_filters').serialize(), null, '/works');
-          $.get(urlObject.href, '', null, 'script');
-        }
+        $('##{form_id} #to_letter').val(letter);
+        $('##{form_id} #search_after_value').val('');
+        $('##{form_id} #search_after_id').val('');
+        #{submit_function}();
       });
 
       $('.browse_paging').click(function() {
-        const filters = #{@emit_filters == true};
         const id = $(this).data('search-after-id') || '';
         const value = $(this).data('search-after-value') || '';
         const page = $(this).data('search-after-page') || 1;
         const reverse = $(this).data('search-after-reverse') || false;
 
-        if(filters) {
-          $('#search_after_value').val(value);
-          $('#search_after_id').val(id);
-          $('#page').val(page);
-          $('#reverse').val(reverse);
-          $('#toletter_tag').val('#{@to_letter}');
-          window.history.pushState($('#works_filters').serialize(), null, '/works');
-          submit_filters();
-        } else {
-          const urlObject = new URL($('#hurl').val());
-          urlObject.searchParams.set('search_after_value', value);
-          urlObject.searchParams.set('search_after_id', id);
-          urlObject.searchParams.set('page', page);
-          urlObject.searchParams.set('reverse', reverse);
-          window.history.pushState($('#works_filters').serialize(), null, '/works');
-          $.get(urlObject.href, '', null, 'script');
-        }
-      });
-    });
-
-- if add_js && controller_name == 'authors'
-  :javascript
-    $(function() {
-      $('.letterbutton').click(function(e) {
-        e.stopImmediatePropagation();
-        e.preventDefault();
-        const letter = $(this).data('letter');
-        $('#to_letter').val(letter);
-        $('#search_after_value').val('');
-        $('#search_after_id').val('');
-        submit_author_filters();
-      });
-
-      $('.browse_paging').click(function() {
-        const id = $(this).data('search-after-id') || '';
-        const value = $(this).data('search-after-value') || '';
-        const page = $(this).data('search-after-page') || 1;
-        const reverse = $(this).data('search-after-reverse') || false;
-
-        $('#search_after_value').val(value);
-        $('#search_after_id').val(id);
-        $('#page').val(page);
-        $('#reverse').val(reverse);
-        submit_author_filters();
+        $('##{form_id} #search_after_value').val(value);
+        $('##{form_id} #search_after_id').val(id);
+        $('##{form_id} #page').val(page);
+        $('##{form_id} #reverse').val(reverse);
+        #{submit_function}();
       });
     });

From f9066f13dc608595e07330695d9d6dfa26bf4807 Mon Sep 17 00:00:00 2001
From: Damir Sultanbekov <Damir.Sultanbekov@yandex.ru>
Date: Sun, 21 Apr 2024 03:19:44 +0500
Subject: [PATCH 4/5] updated pagination partial to use fixed submit function
 name submit_filter and moved this partial to shared/filters folder.

---
 app/assets/stylesheets/BY_styles_General.css  |  3 --
 app/assets/stylesheets/BY_styles_Max991.css   | 14 +++----
 app/controllers/authors_controller.rb         |  7 ++--
 app/controllers/manifestation_controller.rb   |  7 ++--
 app/views/authors/_browse_filters.html.haml   | 16 ++++----
 app/views/authors/_browse_list.html.haml      | 10 ++---
 app/views/authors/browse.html.haml            |  2 +-
 .../manifestation/_browse_filters.html.haml   | 41 ++++++++++++-------
 .../manifestation/_browse_list.html.haml      | 20 ++-------
 app/views/manifestation/browse.html.haml      |  2 +-
 app/views/manifestation/browse.js.erb         |  9 ----
 .../shared/filters/_checkbox_group.html.haml  |  2 +-
 .../shared/filters/_checkboxes.html.haml      |  2 +-
 app/views/shared/filters/_languages.html.haml |  4 +-
 .../{ => filters}/_pagination.html.haml       |  4 +-
 config/locales/en.yml                         | 11 ++---
 config/locales/he.yml                         | 11 ++---
 17 files changed, 73 insertions(+), 92 deletions(-)
 rename app/views/shared/{ => filters}/_pagination.html.haml (96%)

diff --git a/app/assets/stylesheets/BY_styles_General.css b/app/assets/stylesheets/BY_styles_General.css
index df4f2c75..7de71e50 100644
--- a/app/assets/stylesheets/BY_styles_General.css
+++ b/app/assets/stylesheets/BY_styles_General.css
@@ -5061,9 +5061,6 @@ position: absolute;
 #sort_by_dd{
 	display: block;
 }
-#current_sort_by{
-	display: none;
-}
 .select-text label{
 	line-height: 24px;
 	margin-top: 0px;
diff --git a/app/assets/stylesheets/BY_styles_Max991.css b/app/assets/stylesheets/BY_styles_Max991.css
index 321358f6..ac25e745 100644
--- a/app/assets/stylesheets/BY_styles_Max991.css
+++ b/app/assets/stylesheets/BY_styles_Max991.css
@@ -837,16 +837,12 @@
 #sort_by_dd{
 	display: none;
 }
-#current_sort_by{
-	display: block;
-	padding: 0 4px;
+.side-sort{
+	display:none;
+}
+.author-side-sort{
+	display: none;
 }
-	.side-sort{
-		display:none;
-	}
-	.author-side-sort{
-		display: none;
-	}
 .author-sort-area{
 	width: auto;
 	padding: 0;
diff --git a/app/controllers/authors_controller.rb b/app/controllers/authors_controller.rb
index 1ca1897f..afabd973 100644
--- a/app/controllers/authors_controller.rb
+++ b/app/controllers/authors_controller.rb
@@ -126,10 +126,10 @@ def build_es_filter_from_filters
     end
     # languages
     if params['ckb_languages'].present?
-      @languages = params['ckb_languages'].reject{|x| x == 'xlat'}
+      @languages = params['ckb_languages'].reject { |x| x == 'xlat' }
       if @languages.present?
-        ret << {terms: {language: @languages}}
-        @filters += @languages.map{|x| ["#{I18n.t(:orig_lang)}: #{helpers.textify_lang(x)}", "lang_#{x}", :checkbox]}
+        ret << { terms: { language: @languages } }
+        @filters += @languages.map { |x| ["#{I18n.t(:orig_lang)}: #{helpers.textify_lang(x)}", "lang_#{x}", :checkbox] }
       end
     end
     # tags by tag_id
@@ -209,7 +209,6 @@ def get_sort_column(sort_by)
   def es_prep_collection
     @sort_dir = 'default'
     if params[:sort_by].present?
-      @sort_or_filter = 'sort'
       @sort = params[:sort_by].dup
       @sort_by = params[:sort_by].sub(/_(a|de)sc$/, '')
       @sort_dir = Regexp.last_match(0)[1..] unless Regexp.last_match(0).nil?
diff --git a/app/controllers/manifestation_controller.rb b/app/controllers/manifestation_controller.rb
index ad91c18c..0f7841e0 100644
--- a/app/controllers/manifestation_controller.rb
+++ b/app/controllers/manifestation_controller.rb
@@ -727,9 +727,9 @@ def prepare_totals(collection)
     @language_facet = buckets_to_totals_hash(collection.aggs['languages']['buckets'])
     @language_facet[:xlat] = @language_facet.except('he').values.sum
 
-    @copyright_facet = collection.aggs['copyright_status']['buckets'].map do |hash|
-      [ hash['key'] == 'true' ? 1 : 0, hash['doc_count'] ]
-    end.to_h
+    @copyright_facet = collection.aggs['copyright_status']['buckets'].to_h do |hash|
+      [hash['key'] == 'true' ? 1 : 0, hash['doc_count']]
+    end
 
     # Preparing list of authors to show in multiselect modal on works browse page
     if collection.filter.present?
@@ -748,7 +748,6 @@ def get_sort_column(sort_by)
   def es_prep_collection
     @sort_dir = 'default'
     if params[:sort_by].present?
-      @sort_or_filter = 'sort'
       @sort = params[:sort_by].dup
       @sort_by = params[:sort_by].sub(/_(a|de)sc$/,'')
       @sort_dir = $&[1..-1] unless $&.nil?
diff --git a/app/views/authors/_browse_filters.html.haml b/app/views/authors/_browse_filters.html.haml
index 0f12d504..170ab1ef 100644
--- a/app/views/authors/_browse_filters.html.haml
+++ b/app/views/authors/_browse_filters.html.haml
@@ -25,10 +25,10 @@
                        title: t(:copyright_status),
                        field_name: :ckb_copyright,
                        all_values: [0, 1],
-                       labels: {0 => t(:public_domain), 1 => t(:by_permission) },
+                       labels: { 0 => t(:public_domain), 1 => t(:by_permission) },
                        selected_values: @copyright,
                        facet: @copyright_facet,
-                       icons: {0 => 'm', 1 => 'x'} }
+                       icons: { 0 => 'm', 1 => 'x' } }
 
     = render partial: 'shared/filters/checkbox_group',
              locals: { group_name: :genre,
@@ -37,7 +37,7 @@
                        all_values: get_genres,
                        selected_values: @genres,
                        facet: @genre_facet,
-                       icons: Work::GENRES.map { |g| [g, glyph_for_genre(g)] }.to_h }
+                       icons: Work::GENRES.index_with { |g| glyph_for_genre(g) } }
 
     = render partial: 'shared/filters/checkbox_group',
              locals: { group_name: :period,
@@ -97,7 +97,7 @@
       event.preventDefault();
       tag_id = data.item.tag_id.toString();
       $('#tag_ids').val( $('#tag_ids').val() == '' ? tag_id : $('#tag_ids').val()+','+tag_id);
-      submit_author_filters();
+      submit_filters();
     });
 
     if (!isMobile()) {
@@ -108,7 +108,7 @@
             window.clearTimeout(submit_timeout);
           }
           resetPagination();
-          submit_timeout = window.setTimeout(submit_author_filters, 300);
+          submit_timeout = window.setTimeout(submit_filters, 300);
       });
     }
 
@@ -128,7 +128,7 @@
         }
       });
       resetPagination();
-      submit_author_filters();
+      submit_filters();
     });
 
     if("#{@datetype}" == "") {
@@ -152,7 +152,7 @@
         next: 'fa fa-chevron-left',
       }
     }).on('hide.datetimepicker', function(e){
-      window.setTimeout(submit_author_filters, 2000);
+      window.setTimeout(submit_filters, 2000);
     });
 
     if("#{@fromdate}" != "") {
@@ -164,7 +164,7 @@
     $('#authors').bind('railsAutocomplete.select', function(event, data){
       event.preventDefault();
       $('#search_type').val('authorname');
-      submit_author_filters();
+      submit_filters();
     });
     $('#apply_mobile_filters').click(function() {
       resetPagination();
diff --git a/app/views/authors/_browse_list.html.haml b/app/views/authors/_browse_list.html.haml
index 732fe946..cb907aa6 100644
--- a/app/views/authors/_browse_list.html.haml
+++ b/app/views/authors/_browse_list.html.haml
@@ -17,8 +17,7 @@
         = f
         %span.pointer.tag-x{'data-ele': id, 'data-which' => which}= '-'
 .by-card-content-v02
-  = render partial: 'shared/pagination',
-           locals: { submit_function: 'submit_author_filters', form_id: 'authors_filters', add_js: false }
+  = render partial: 'shared/filters/pagination', locals: { form_id: 'authors_filters', add_js: false }
   .select-all-with-buttons
     .headline-4-v02= t(:sort_by)
     #sort-by
@@ -45,8 +44,7 @@
           = link_to au.sort_name.presence || '_', person_path(au.id)
           .authors-list-years= decorator.call(au)
   = hidden_field_tag(:hurl, request.original_url)
-  = render partial: 'shared/pagination',
-           locals: { submit_function: 'submit_author_filters', form_id: 'authors_filters', add_js: true }
+  = render partial: 'shared/filters/pagination', locals: { form_id: 'authors_filters', add_js: true }
 :javascript
   $(document).ready(function() {
     $('.tag-x').click(function() {
@@ -59,12 +57,12 @@
       }
 
       $('#authors_filters input').attr('disabled', false);
-      submit_author_filters();
+      submit_filters();
     });
 
     $('#sort_by_select').change(function(){
       $('#authors_filters input[name=sort_by]').val($('#sort_by_select option:selected').val());
       resetPagination();
-      submit_author_filters();
+      submit_filters();
     });
   });
diff --git a/app/views/authors/browse.html.haml b/app/views/authors/browse.html.haml
index 5d98ae2e..3e04b204 100644
--- a/app/views/authors/browse.html.haml
+++ b/app/views/authors/browse.html.haml
@@ -17,7 +17,7 @@
       = render partial: 'browse_list'
 
 :javascript
-  function submit_author_filters() {
+  function submit_filters() {
     window.history.pushState($('#authors_filters').serialize(), null, '/authors');
     startModal('spinnerdiv');
     $('#authors_filters').submit();
diff --git a/app/views/manifestation/_browse_filters.html.haml b/app/views/manifestation/_browse_filters.html.haml
index c68384b4..11d57e43 100644
--- a/app/views/manifestation/_browse_filters.html.haml
+++ b/app/views/manifestation/_browse_filters.html.haml
@@ -12,20 +12,20 @@
         %button.search-mobile-option.opt_workname= t(:work_title)
         %button.search-mobile-option.opt_authorname= t(:author_name)
       %break
-      %input.field-v02.field-without-label#search_input{ placeholder: t(:what_to_search_for),
-                                                         name: 'search_input',
-                                                         type: :text,
-                                                         value: @search_input}/
+      = text_field_tag :search_input, @search_input,
+                       id: :search_input,
+                       class: %w(field-v02 field-without-label),
+                       placeholder: t(:what_to_search_for)
       = autocomplete_field_tag :authorstr, @authorstr, autocomplete_person_name_path,
                                id_element: '#author_id',
                                'data-noMatchesLabel' => t(:no_matches_found),
-                               style:'display:none',
+                               style: 'display:none',
                                class: 'field-v02 field-without-label author-name-field',
                                id: 'authors',
                                placeholder: t(:author_names)
-      = hidden_field_tag :author_id, @author_id.present? ? @author_id : nil
+      = hidden_field_tag :author_id, @author_id
       .multi-name-sort.desktop-only.pointer
-        %span.linkcolor.pointer{'data-toggle' => 'modal', 'data-target' => '#authorsDlg'}= t(:multiselect)
+        %span.linkcolor.pointer{ data: { toggle: :modal, target: '#authorsDlg' } }= t(:multiselect)
       = hidden_field_tag(:authors, @authors, id: 'author_ids')
       = hidden_field_tag(:authors_names, @authors_names, id: 'authors_names')
 
@@ -52,10 +52,10 @@
                        title: t(:copyright_status),
                        field_name: :ckb_copyright,
                        all_values: [0, 1],
-                       labels: {0 => t(:public_domain), 1 => t(:by_permission) },
+                       labels: { 0 => t(:public_domain), 1 => t(:by_permission) },
                        selected_values: @copyright,
                        facet: @copyright_facet,
-                       icons: {0 => 'm', 1 => 'x'} }
+                       icons: { 0 => 'm', 1 => 'x' } }
 
     = render partial: 'shared/filters/checkbox_group',
              locals: { group_name: :genre,
@@ -64,7 +64,7 @@
                        all_values: get_genres,
                        selected_values: @genres,
                        facet: @genre_facet,
-                       icons: Work::GENRES.map { |g| [g, glyph_for_genre(g)] }.to_h }
+                       icons: Work::GENRES.index_with { |g| glyph_for_genre(g) } }
 
     = render partial: 'shared/filters/checkbox_group',
              locals: { group_name: :period,
@@ -75,7 +75,12 @@
                        facet: @period_facet }
 
     = render layout: 'shared/collapsible_block', locals: { container_name: 'collftags', title: t(:tags) } do
-      = autocomplete_field_tag :tagstr, '', autocomplete_tag_name_path, id_element: '#tag_id', 'data-noMatchesLabel' => t(:no_matches_found), 'class' => 'field-v02 field-without-label author-name-field', id: 'tags', placeholder: t(:tag)
+      = autocomplete_field_tag :tagstr, '', autocomplete_tag_name_path,
+                               id_element: '#tag_id',
+                               'data-noMatchesLabel' => t(:no_matches_found),
+                               class: 'field-v02 field-without-label author-name-field',
+                               id: 'tags',
+                               placeholder: t(:tag)
       = hidden_field_tag :tag_ids, @tag_ids, id: 'tag_ids'
 
     = render layout: 'shared/collapsible_block', locals: { container_name: 'collfdate', title: t(:thedate) } do
@@ -86,9 +91,18 @@
         = hidden_field_tag(:date_type, '', id: 'date_type')
       %break
       .dates-range
-        %input.datepicker.datetimepicker-input.field-v02.field-without-label.range-date-field#fromdate{:placeholder => t(:year), name: "fromdate", 'data-toggle' => 'datetimepicker', 'data-target' => '#fromdate' }/
+        %input.datepicker.datetimepicker-input.field-v02.field-without-label.range-date-field#fromdate{
+          placeholder: t(:year),
+          name: :fromdate,
+          data: { toggle: :datetimepicker, target: '#fromdate' }
+        }/
         .date-range-to= t(:until)
-        %input.datepicker.datetimepicker-input.field-v02.field-without-label.range-date-field#todate{:placeholder => t(:year), :style => "float: left", 'data-toggle' => 'datetimepicker', name: "todate", 'data-target' => '#todate'}/
+        %input.datepicker.datetimepicker-input.field-v02.field-without-label.range-date-field#todate{
+          placeholder: t(:year),
+          style: 'float: left;',
+          name: :todate,
+          data: { toggle: :datetimepicker, target: '#todate' }
+        }/
 
     = render partial: 'shared/filters/languages', locals: { facet: @language_facet, selected_values: @languages }
 
@@ -227,7 +241,6 @@
 
     $('#apply_mobile_filters').click(function() {
       resetPagination();
-      // TODO: adjust
       $('#browse_intro').toggle();
       $('#sort_filter_panel').toggle();
       $('#thelist').toggle();
diff --git a/app/views/manifestation/_browse_list.html.haml b/app/views/manifestation/_browse_list.html.haml
index 0bbc4910..bd3e82a5 100644
--- a/app/views/manifestation/_browse_list.html.haml
+++ b/app/views/manifestation/_browse_list.html.haml
@@ -17,10 +17,9 @@
         = f
         %span.pointer.tag-x{'data-ele': id, 'data-which' => which}= '-'
 .by-card-content-v02
-  = render partial: 'shared/pagination',
-           locals: { submit_function: 'submit_filters', form_id: 'works_filters', add_js: false }
+  = render partial: 'shared/filters/pagination', locals: { form_id: 'works_filters', add_js: false }
   %hr
-  .select-all-with-buttons
+  .select-all-with-buttons.desktop-only
     .select-text-checkbox-area
       .select-all-checkbox
         %input#select-all{type: 'checkbox', style:'display:none'}
@@ -30,8 +29,6 @@
     #sort-by
       %div
         #custom-select{title: t(:worklist_sort_tt)}
-          %button#current_sort_by.btn-small-outline-v02
-            .btn-text-v02#current_sort_text
           %select#sort_by_dd{name: 'sort_by'}
             %optgroup{label: t(:alefbet)}
               %option{value: 'alphabetical_asc', selected: @sort == 'alphabetical_asc' ? 'true': nil}= t(:alefbet_asc)
@@ -59,8 +56,7 @@
           = link_to m.title_and_authors, manifestation_path(m.id)
           = decorator.call(m)
   = hidden_field_tag(:hurl, request.original_url)
-  = render partial: 'shared/pagination',
-           locals: { submit_function: 'submit_filters', form_id: 'works_filters', add_js: true }
+  = render partial: 'shared/filters/pagination', locals: { form_id: 'works_filters', add_js: true }
 :javascript
   /**
    * Handle Animation (Start, Reset, Restart)
@@ -171,14 +167,4 @@
       }
       // notify user
     });
-
-    $('#current_sort_by').click(function(){
-      // TODO: display dialog on mobile
-      $('.mobile-sort-area').show();
-      $('.sort-by-mobile').show();
-      $('.author-mobile-filters-area').hide();
-      $('#opt_sort').addClass('active');
-      $('#opt_filter').removeClass('active');
-    });
-    $('#current_sort_text').text($('#sort_by_dd option:selected').text());
   });
diff --git a/app/views/manifestation/browse.html.haml b/app/views/manifestation/browse.html.haml
index 58e23701..86915f34 100644
--- a/app/views/manifestation/browse.html.haml
+++ b/app/views/manifestation/browse.html.haml
@@ -2,7 +2,7 @@
 #content.container-fluid
   .row.list-all-texts
     .col-sm-12.col-md-4
-      .by-card-v02#browse_intro{ style: "display:#{ @filters.empty? ? 'block' : 'none'}" }
+      .by-card-v02#browse_intro{ style: "display:#{@filters.empty? ? 'block' : 'none'}" }
         .work-area
           .work-content
             .headline-1-v02= t(:welcome_to_works_browsing)
diff --git a/app/views/manifestation/browse.js.erb b/app/views/manifestation/browse.js.erb
index 4d183c14..85343c6e 100644
--- a/app/views/manifestation/browse.js.erb
+++ b/app/views/manifestation/browse.js.erb
@@ -1,13 +1,4 @@
 $('#thelist').html("<%= j(render partial: 'browse_list') %>");
 $('#sort_filter_panel').html("<%= j(render partial: 'browse_filters') %>");
 $('#authorsDlg').html("<%= j(render partial: 'authors_select', locals: {authors: @authors, list: @authors_list}) %>");
-if("#{@sort_or_filter}" == 'sort') {
-  $('.mobile-sort-area').show();
-  $('.author-mobile-filters-area').hide();
-  $('#opt_sort').addClass('active');
-} else {
-  $('.mobile-sort-area').hide();
-  $('.author-mobile-filters-area').show();
-  $('#opt_filter').addClass('active');
-}
 stopModal('spinnerdiv');
diff --git a/app/views/shared/filters/_checkbox_group.html.haml b/app/views/shared/filters/_checkbox_group.html.haml
index ae402568..92dfff5d 100644
--- a/app/views/shared/filters/_checkbox_group.html.haml
+++ b/app/views/shared/filters/_checkbox_group.html.haml
@@ -1,5 +1,5 @@
 - icons ||= {}
-- labels ||= all_values.map { |val| [val, t(val) ] }.to_h
+- labels ||= all_values.index_with { |val| t(val) }
 
 = render layout: 'shared/collapsible_block',
          locals: { container_name: "collf#{group_name}", title: title, content_class: 'nested-list' } do
diff --git a/app/views/shared/filters/_checkboxes.html.haml b/app/views/shared/filters/_checkboxes.html.haml
index 9aad6863..69aeff6a 100644
--- a/app/views/shared/filters/_checkboxes.html.haml
+++ b/app/views/shared/filters/_checkboxes.html.haml
@@ -4,7 +4,7 @@
   %input{ name: "#{field_name}[]", id: "#{group_name}_#{value}", type: :checkbox, value: value, checked: checked }
   %label
     - if icon.present?
-      %span.by-icon-v02>=icon
+      %span.by-icon-v02>= icon
     = labels[value]
     - count_text = facet[value] || (selected_values.present? ? t(:filtered) : '0')
     %span
diff --git a/app/views/shared/filters/_languages.html.haml b/app/views/shared/filters/_languages.html.haml
index 0fcbacb9..e3010455 100644
--- a/app/views/shared/filters/_languages.html.haml
+++ b/app/views/shared/filters/_languages.html.haml
@@ -9,7 +9,7 @@
            locals: { group_name: :lang,
                      field_name: :ckb_languages,
                      all_values: ['he', :xlat],
-                     labels: { 'he' => textify_lang('he'), :xlat => t(:non_hebrew_languages)},
+                     labels: { 'he' => textify_lang('he'), :xlat => t(:non_hebrew_languages) },
                      selected_values: selected_top_level_values,
                      facet: facet,
                      icons: {} }
@@ -19,7 +19,7 @@
              locals: { group_name: :lang,
                        field_name: :ckb_languages,
                        all_values: foreign_langs,
-                       labels: foreign_langs.map { |lang| [lang, textify_lang(lang)] }.to_h,
+                       labels: foreign_langs.index_with { |lang| textify_lang(lang) },
                        selected_values: selected_values,
                        facet: facet,
                        icons: {} }
diff --git a/app/views/shared/_pagination.html.haml b/app/views/shared/filters/_pagination.html.haml
similarity index 96%
rename from app/views/shared/_pagination.html.haml
rename to app/views/shared/filters/_pagination.html.haml
index 63f08a48..e1d34297 100644
--- a/app/views/shared/_pagination.html.haml
+++ b/app/views/shared/filters/_pagination.html.haml
@@ -35,7 +35,7 @@
         $('##{form_id} #to_letter').val(letter);
         $('##{form_id} #search_after_value').val('');
         $('##{form_id} #search_after_id').val('');
-        #{submit_function}();
+        submit_filters();
       });
 
       $('.browse_paging').click(function() {
@@ -48,6 +48,6 @@
         $('##{form_id} #search_after_id').val(id);
         $('##{form_id} #page').val(page);
         $('##{form_id} #reverse').val(reverse);
-        #{submit_function}();
+        submit_filters();
       });
     });
diff --git a/config/locales/en.yml b/config/locales/en.yml
index 841e48c7..56f1de28 100644
--- a/config/locales/en.yml
+++ b/config/locales/en.yml
@@ -2,11 +2,12 @@ en:
   name_starts_with_x: "Name starts with: '%{x}'"
   title_starts_with_x: "Title starts with: '%{x}'"
   shared:
-    pagination:
-      page_x_of_total: Page %{page} of %{total}
-      next_page: Next page
-      previous_page: Previous page
-      first_page: First page
+    filters:
+      pagination:
+        page_x_of_total: Page %{page} of %{total}
+        next_page: Next page
+        previous_page: Previous page
+        first_page: First page
   welcome:
     submit_contact:
       ziburit_failed: Control question failed
diff --git a/config/locales/he.yml b/config/locales/he.yml
index 4fe7852c..044d06bf 100644
--- a/config/locales/he.yml
+++ b/config/locales/he.yml
@@ -1343,11 +1343,12 @@ he:
       - "month"
       - "year"
   shared:
-    pagination:
-      page_x_of_total: דף %{page} מתוך %{total}
-      next_page: לדף הבא
-      previous_page: לדף הקודם
-      first_page: לדף הראשון
+    filters:
+      pagination:
+        page_x_of_total: דף %{page} מתוך %{total}
+        next_page: לדף הבא
+        previous_page: לדף הקודם
+        first_page: לדף הראשון
   welcome:
     submit_contact:
       ziburit_failed: לא השתכנענו שאינך רובוט.

From 4a174a99e1afc5c43921670523156d2471ac8986 Mon Sep 17 00:00:00 2001
From: Damir Sultanbekov <Damir.Sultanbekov@yandex.ru>
Date: Tue, 23 Apr 2024 23:11:04 +0500
Subject: [PATCH 5/5] adjusted logic used to set initial state of browse_intro
 blocks on authors and mobile pages: they should not be shown on mobile at
 all. Added scrolling to the top of the list when mobile filter is applied.

---
 app/views/authors/_browse_filters.html.haml       | 6 +++---
 app/views/authors/_browse_top.html.haml           | 2 +-
 app/views/authors/browse.html.haml                | 2 +-
 app/views/manifestation/_browse_filters.html.haml | 6 +++---
 app/views/manifestation/_browse_top.html.haml     | 2 +-
 app/views/manifestation/browse.html.haml          | 9 +++++++--
 6 files changed, 16 insertions(+), 11 deletions(-)

diff --git a/app/views/authors/_browse_filters.html.haml b/app/views/authors/_browse_filters.html.haml
index 170ab1ef..883d845c 100644
--- a/app/views/authors/_browse_filters.html.haml
+++ b/app/views/authors/_browse_filters.html.haml
@@ -168,8 +168,8 @@
     });
     $('#apply_mobile_filters').click(function() {
       resetPagination();
-      $('#browse_intro').toggle();
-      $('#sort_filter_panel').toggle();
-      $('#thelist').toggle();
+      $('#sort_filter_panel').hide();
+      $('#thelist').show();
+      $('html').scrollTop($('#thelist').offset().top);
     });
   });
diff --git a/app/views/authors/_browse_top.html.haml b/app/views/authors/_browse_top.html.haml
index 286a3b93..871e66f9 100644
--- a/app/views/authors/_browse_top.html.haml
+++ b/app/views/authors/_browse_top.html.haml
@@ -58,11 +58,11 @@
   }
   $(document).ready(function(){
     $('#sort_filter_toggle').click(function() {
-      $('#browse_intro').toggle();
       $('#sort_filter_panel').toggle();
       if (isMobile()) {
         $('#thelist').toggle();
       } else {
+        $('#browse_intro').toggle();
         $('.toggle-button-no').toggle();
         $('.toggle-button-yes').toggle();
       }
diff --git a/app/views/authors/browse.html.haml b/app/views/authors/browse.html.haml
index 3e04b204..01c19eaa 100644
--- a/app/views/authors/browse.html.haml
+++ b/app/views/authors/browse.html.haml
@@ -1,7 +1,7 @@
 -# Browse authors
 .row
   .col-sm-12.col-md-4
-    .by-card-v02#browse_intro{ style: "display:#{@filters.empty? ? 'block' : 'none'}" }
+    .by-card-v02.desktop-only#browse_intro
       .work-area
         .work-content
           .headline-1-v02= t(:welcome_to_authors_browsing)
diff --git a/app/views/manifestation/_browse_filters.html.haml b/app/views/manifestation/_browse_filters.html.haml
index 11d57e43..0acac942 100644
--- a/app/views/manifestation/_browse_filters.html.haml
+++ b/app/views/manifestation/_browse_filters.html.haml
@@ -241,8 +241,8 @@
 
     $('#apply_mobile_filters').click(function() {
       resetPagination();
-      $('#browse_intro').toggle();
-      $('#sort_filter_panel').toggle();
-      $('#thelist').toggle();
+      $('#sort_filter_panel').hide();
+      $('#thelist').show();
+      $('html').scrollTop($('#thelist').offset().top);
     });
   });
diff --git a/app/views/manifestation/_browse_top.html.haml b/app/views/manifestation/_browse_top.html.haml
index c5a02c5d..358ddfc0 100644
--- a/app/views/manifestation/_browse_top.html.haml
+++ b/app/views/manifestation/_browse_top.html.haml
@@ -76,11 +76,11 @@
   }
   $(document).ready(function(){
     $('#sort_filter_toggle').click(function() {
-      $('#browse_intro').toggle();
       $('#sort_filter_panel').toggle();
       if (isMobile()) {
         $('#thelist').toggle();
       } else {
+        $('#browse_intro').toggle();
         $('.toggle-button-no').toggle();
         $('.toggle-button-yes').toggle();
       }
diff --git a/app/views/manifestation/browse.html.haml b/app/views/manifestation/browse.html.haml
index 86915f34..9f7c283e 100644
--- a/app/views/manifestation/browse.html.haml
+++ b/app/views/manifestation/browse.html.haml
@@ -2,14 +2,14 @@
 #content.container-fluid
   .row.list-all-texts
     .col-sm-12.col-md-4
-      .by-card-v02#browse_intro{ style: "display:#{@filters.empty? ? 'block' : 'none'}" }
+      .by-card-v02#browse_intro
         .work-area
           .work-content
             .headline-1-v02= t(:welcome_to_works_browsing)
             %p!= t(:works_browsing_intro_html)
           .work-side-color
             .work-genre.prose-side-icon
-      .by-card-v02.text-sorting#sort_filter_panel{ style: 'display:none' }
+      .by-card-v02.text-sorting#sort_filter_panel
         = render partial: 'browse_filters'
     .col-sm-12.col-md-8
       .by-card-v02#thelist
@@ -21,6 +21,11 @@
   = render partial: 'shared/anth_stuff'
 
 :javascript
+  $(function() {
+    $('#browse_intro').toggle(#{@filters.empty?} && !isMobile());
+    $('#sort_filter_panel').toggle(#{@filters.present?} && !isMobile());
+  });
+
   function submit_filters() {
     window.history.pushState($('#works_filters').serialize(), null, '/works');
     startModal('spinnerdiv');