side filter form

static/client/css/main.css

@@ -13122,6 +13122,19 @@ button.gray:hover {
     padding: 0px 10px;
 }
 
+.filters .links_block {
+    text-align: center;
+    margin-bottom: 30px;
+    margin-top: -15px;
+}
+
+.filters .links_block a{
+    display: inline-block;
+    margin-bottom: 5px;
+    text-decoration: none;
+    border-bottom: 1px dashed #f60;
+}
+
 
 
 

static/client/js/scripts.js

@@ -1,5 +1,60 @@
+function set_filter_block_height () {
+    var add_links = false;
+
+    $('#filter_form_wraper').find('ul').each(function(i, ul) {
+        var $ul  = $(this),
+            $block = $ul.parent('div');
+
+        add_links = false;
+
+        $ul.find('li').each(function(j, li) {
+            if ($(li).index() > 9) {
+                $(li).css('display', 'none');
+                add_links = true;
+            }
+        });
+
+        if (add_links){
+            var $show_more_link = $('<a></a>', {href: "#", text: 'показать еще 10', class: 'show_more_link'}),
+                $show_all_link = $('<a></a>', {href: '#', text: 'показать все', class: 'show_all_link'}),
+                $links_block = $('<div></div>', {class: 'links_block'});
+
+            $links_block
+                .append($show_more_link)
+                .append('<br />')
+                .append($show_all_link);
+
+            $block.append($links_block);
+        }
+    });
+}
+
 $(document).ready(function () {
 
+    set_filter_block_height();
+
+    $('#filter_form_wraper').on('click', '.show_more_link', function(e){
+        e.preventDefault();
+        var $block = $(this).parents('.filter_block'),
+            li_length = $block.find('li').length,
+            visible_length = $block.find('li:visible').length;
+
+        for (var i = 0; i < 10; i++){
+            if (visible_length + i != li_length) {
+                $block.find('li').eq(visible_length + i).fadeIn(200);
+            } else {
+                $(this).parent().hide();
+            }
+        }
+    })
+
+    $('#filter_form_wraper').on('click', '.show_all_link', function(e){
+        e.preventDefault();
+        var $block = $(this).parents('.filter_block');
+        $block.find('li').fadeIn(200);
+        $block.find('.links_block').hide();
+    })
+
 
 	//$('ul.about_block_menu li.m_01').click(function () {
     //    $(this).parents('ul').find('li').removeClass('active');
@@ -112,6 +167,7 @@ $(document).ready(function () {
             if (data.success) {
               $('.page-body').html(data.results);
               $('#filter_form_wraper').html(data.form);
+              set_filter_block_height();
               $loader.hide();
             }
         })
@@ -163,8 +219,6 @@ $(document).ready(function () {
 
 
 
-
-
 	var number_subjects_list = $("div.subjects_list ul li").length;
 
 	var number_subjects_list_x = number_subjects_list -5;

static/client/js/vendor.js

@@ -4915,8 +4915,63 @@ function placeInput(width){
 
 
 
+function set_filter_block_height () {
+    var add_links = false;
+
+    $('#filter_form_wraper').find('ul').each(function(i, ul) {
+        var $ul  = $(this),
+            $block = $ul.parent('div');
+
+        add_links = false;
+
+        $ul.find('li').each(function(j, li) {
+            if ($(li).index() > 9) {
+                $(li).css('display', 'none');
+                add_links = true;
+            }
+        });
+
+        if (add_links){
+            var $show_more_link = $('<a></a>', {href: "#", text: 'показать еще 10', class: 'show_more_link'}),
+                $show_all_link = $('<a></a>', {href: '#', text: 'показать все', class: 'show_all_link'}),
+                $links_block = $('<div></div>', {class: 'links_block'});
+
+            $links_block
+                .append($show_more_link)
+                .append('<br />')
+                .append($show_all_link);
+
+            $block.append($links_block);
+        }
+    });
+}
+
 $(document).ready(function () {
 
+    set_filter_block_height();
+
+    $('#filter_form_wraper').on('click', '.show_more_link', function(e){
+        e.preventDefault();
+        var $block = $(this).parents('.filter_block'),
+            li_length = $block.find('li').length,
+            visible_length = $block.find('li:visible').length;
+
+        for (var i = 0; i < 10; i++){
+            if (visible_length + i != li_length) {
+                $block.find('li').eq(visible_length + i).fadeIn(200);
+            } else {
+                $(this).parent().hide();
+            }
+        }
+    })
+
+    $('#filter_form_wraper').on('click', '.show_all_link', function(e){
+        e.preventDefault();
+        var $block = $(this).parents('.filter_block');
+        $block.find('li').fadeIn(200);
+        $block.find('.links_block').hide();
+    })
+
 
 	//$('ul.about_block_menu li.m_01').click(function () {
     //    $(this).parents('ul').find('li').removeClass('active');
@@ -5027,8 +5082,9 @@ $(document).ready(function () {
         })
         .done(function(data) {
             if (data.success) {
-              $('.page-body').html('appended' + data.results);
-              $('#filter_form_wraper').html('appended' + data.form);
+              $('.page-body').html(data.results);
+              $('#filter_form_wraper').html(data.form);
+              set_filter_block_height();
               $loader.hide();
             }
         })
@@ -5080,8 +5136,6 @@ $(document).ready(function () {
 
 
 
-
-
 	var number_subjects_list = $("div.subjects_list ul li").length;
 
 	var number_subjects_list_x = number_subjects_list -5;

templates/client/includes/events/filter_form.html

@@ -19,7 +19,7 @@
                 <i class="fa fa-caret-down"></i>
             </label>
             <span class="filter_help_text">{{ field.help_text|safe }}</span>
-            <div id="{{ field.auto_id }}">
+            <div id="{{ field.auto_id }}" class="filter_block">
                 {{ field }}
             </div>
             {{ field.errors }}