Аватар пользователя Dima

Программное cоздание блока меню на основе таксономии с учетом иерархии c jQuery в Drupal 6

Вообщем: на сайте есть раздел помощи, сформирован с помощью views, и принимающий tid, в качестве аргумента.

Задача: создать блок с иерархическим выводом терминов таксономии определеного словаря, при этом по умолчанию родительская категория должна быть свернута и розкрываться по клику. Также определенная родительская категория должна быть раскрытой если на предыдущей странице был выбран дочерный термин этой категории.

Решение:

  1. программно создать блок
  2. создать иерархический вывод терминов таксономии
  3. создать java script код, реализующий возможность скрывать и раскрывать дочерные термины таксономии по клику

По пунктам:
1. Создаем блок:

  1. /**
  2.  * Implementation hook_block()
  3.  */
  4.  
  5. function my_module_block($op, $delta = 0){
  6.  
  7. if ($op == 'list') {
  8. $blocks[0]['info'] = t('Help menu block');
  9. return $blocks;
  10. }
  11.  
  12. $output = "";
  13.  
  14. if ($op == 'view') {
  15. $block['subject'] = t('All cаtegories');
  16. $block['content'] = $output;
  17. return $block;
  18. }
  19. }

2. Создаем иерархический вывод терминов таксономии:

  1. $vid = [vid];//<-- vocabulary id
  2. $terms = taxonomy_get_tree($vid);
  3. $class = "";
  4. // create menu-like html output
  5. $output = '<ul>';
  6. foreach ( $terms as $term ) {
  7. $children_terms = taxonomy_get_children($term->tid);
  8. if ($term->depth == 0) {
  9. if(!$children_terms) {
  10. $class = 'no-children';
  11. }else {
  12. $class = 'has-children';
  13. }
  14. $output .= "<li class=".$class.">";
  15. $output .= l($term->name,'help/'.$term->tid, array('title' => $term->name));
  16. if ($children_terms) {
  17. $output .= "<ul>";
  18. foreach ( $children_terms as $children_term ) {
  19. $output .= "<li>";
  20. $output .= l($children_term->name,'help/'.$children_term->tid, array('title' => $children_term->name));
  21. $output .= "</li>";
  22. }/* end foreach children */
  23. $output .= "</ul>";
  24. }
  25. $output .= "</li>";
  26. }
  27. } /* end foreach */
  28. $output .= "</ul>";

Теперь наш блок будет выглядеть так:

  1. /**
  2.  * Implementation hook_block()
  3.  */
  4.  
  5. function my_module_block($op, $delta = 0){
  6.  
  7. if ($op == 'list') {
  8. $blocks[0]['info'] = t('Help menu block');
  9. return $blocks;
  10. }
  11.  
  12. $vid = [vid]; //<-- vocabulary id
  13. $terms = taxonomy_get_tree($vid);
  14. $class = "";
  15. // create menu-like html output
  16. $output = '<ul>';
  17. foreach ( $terms as $term ) {
  18. $children_terms = taxonomy_get_children($term->tid);
  19. if ($term->depth == 0) {
  20. if(!$children_terms) {
  21. $class = 'no-children';
  22. }else {
  23. $class = 'has-children';
  24. }
  25. $output .= "<li class=".$class.">";
  26. $output .= l($term->name,'help/'.$term->tid, array('title' => $term->name));
  27. if ($children_terms) {
  28. $output .= "<ul>";
  29. foreach ( $children_terms as $children_term ) {
  30. $output .= "<li>";
  31. $output .= l($children_term->name,'help/'.$children_term->tid, array('title' => $children_term->name));
  32. $output .= "</li>";
  33. }/* end foreach children */
  34. $output .= "</ul>";
  35. }
  36. $output .= "</li>";
  37. }
  38. } /* end foreach */
  39. $output .= "</ul>";
  40.  
  41. if ($op == 'view') {
  42. $block['subject'] = t('All cаtegories');
  43. $block['content'] = $output;
  44. return $block;
  45. }
  46. }

3. javascript:
  1. $(document).ready(function() {
  2. // if js is enabled, coollaps children elements
  3. $('li.has-children').addClass('collapsed');
  4. $('.collapsed ul').css('display', 'none');
  5. // if menu activ element is in subcategory, expand his parent
  6. var hasChildren= $('li.has-children');
  7. $.each(hasChildren, function(){
  8. if($(this).find('.active').length > 0){
  9. $(this).removeClass('collapsed').addClass('expanded');
  10. $(this).children('ul').css('display', 'block');
  11. }
  12. });
  13. // expand/collapse items with children/child
  14. $('.has-children a').click(function() {
  15. if(!$(this).next().is(':visible')){
  16. $(this).next().slideDown('fast');
  17. $(this).parent().removeClass('collapsed');
  18. $(this).parent().addClass('expanded');
  19. }else{
  20. $(this).next().slideUp('fast');
  21. $(this).parent().removeClass('expanded');
  22. $(this).parent().addClass('collapsed');
  23. }
  24. return false;
  25. });
  26. // reaction on link click
  27. $('.has-children ul a').click(function(){
  28. var url = $(this).attr('href');
  29. $(location).attr('href',url );
  30. });
  31. });

Сохраним java script код в файл, например help_block_menu.js,
и добавим вызов этого файла во время отображения нашего блока с помощью функции drupal_add_js().
В результате код блока будет выглядеть следующим образом:

  1. /**
  2.  * Implementation hook_block()
  3.  */
  4. function my_module_block($op, $delta = 0){
  5.  
  6. if ($op == 'list') {
  7. $blocks[0]['info'] = t('Help menu block');
  8. return $blocks;
  9. }
  10.  
  11. $vid =[vid]; //<-- vocabulary id
  12. $terms = taxonomy_get_tree($vid);
  13. $class = "";
  14.  
  15. $output = '<ul>';
  16. foreach ( $terms as $term ) {
  17. $children_terms = taxonomy_get_children($term->tid);
  18. if ($term->depth == 0) {
  19. if(!$children_terms) {
  20. $class = 'no-children';
  21. }else {
  22. $class = 'has-children';
  23. }
  24. $output .= "<li class=".$class.">";
  25. $output .= l($term->name,'help/'.$term->tid, array('title' => $term->name));
  26. if ($children_terms) {
  27. $output .= "<ul>";
  28. foreach ( $children_terms as $children_term ) {
  29. $output .= "<li>";
  30. $output .= l($children_term->name,'help/'.$children_term->tid, array('title' => $children_term->name));
  31. $output .= "</li>";
  32. }/* end foreach children */
  33. $output .= "</ul>";
  34. }
  35. $output .= "</li>";
  36. }
  37. } /* end foreach */
  38. $output .= "</ul>";
  39.  
  40. if ($op == 'view') {
  41. drupal_add_js('path/to/js/file/help_block_menu.js');
  42. $block['subject'] = t('All cаtegories');
  43. $block['content'] = $output;
  44. return $block;
  45. }
  46. }