Расширение функционала Облака Тэгов

Мульти-выбор тегов для для передачи в строку /tags/search?q=

#1 28 апреля 2016 в 03:25
ICMS 2.5.1

Стоит задача позволить пользователю выбрать набор тэгов из облака, и нажав на кнопку поиска перейти на страницу поиска по выбранным тегам.
Интерфейс простой — кнопка сброса выбора и поиск:


Вот что у меня получилось:

в шаблоне \controllers\tags\widgets\cloud\cloud.tpl.php изменяем:
  1.  
  2. <li <?php if($color){ echo 'class="colored"'; } ?> style="font-size: <?php echo $fs; ?>px;<?php if($color){ echo ' color: '.$color; } ?>">
  3. <?php echo html_tags_bar($tag['tag']); ?>
  4. </li>
  5.  
на
  1.  
  2. <li <?php if($color){ echo 'class="colored tag"'; } else { echo 'class="tag"';} ?> style="font-size: <?php echo $fs; ?>px;<?php if($color){ echo ' color: '.$color; } ?>" id="<?php echo $tag['tag']; ?>" onClick="select_tag(this.id); return false;">
  3. <?php echo html_tags_bar($tag['tag']); ?>
  4. </li>
  5.  
после лупа добавляем:
  1.  
  2. <div id="tag_choice_buttons" style="display:none">
  3. <i class="mdi mdi-close" id="tag_choice_reset" onClick="reset_tags(); return false;"></i>
  4. <i class="mdi mdi-check" id="tag_choice_confirm" onClick="search_tags(); return false;"></i>
  5. </div>
  6.  
и скрипт:
  1.  
  2. <script>
  3.  
  4. var selected_color='#C2F1B7';
  5. var unselected_color='#F9F9F9';
  6. var selected_tags = [];
  7.  
  8. function select_tag(tag_id) {
  9. document.getElementById("tag_choice_buttons").style.setProperty('display', 'inline-block');
  10.  
  11. document.getElementById(tag_id).firstElementChild.style.setProperty('background-color', selected_color);
  12. selected_tags.push(tag_id);
  13. }
  14.  
  15. function reset_tags() {
  16. var x = document.getElementsByClassName("tag");
  17. var i;
  18.  
  19. for (i = 0; i < x.length; i++) {
  20. x[i].firstElementChild.style.setProperty('background-color', unselected_color);
  21. }
  22.  
  23. selected_tags = [];
  24. document.getElementById("tag_choice_buttons").style.setProperty('display', 'none');
  25. }
  26.  
  27. function search_tags() {
  28. var selected_tags_str = selected_tags.join('&');
  29. var search_str = selected_tags_str.replace(/ /g,"+");
  30. var selected_tags_encoded = encodeURI(search_str);
  31. var search_url = '/tags/search?q=' + selected_tags_encoded;
  32.  
  33. //alert(search_url);
  34.  
  35. location.replace(search_url);
  36. }
  37.  
  38. </script>
  39.  
дело остается за малым — "научить" \system\controllers\tags\actions\search.php принимать и выдавать результат поиска в формате
/tags/search?q=предназначение+женщины&созидание&сотрудничество

в PHP я не силен, как бы это провернуть?

+Может быть будут какие-нибудь замечания по поводу js?
Вы не можете отвечать в этой теме.
Войдите или зарегистрируйтесь, чтобы писать на форуме.
Используя этот сайт, вы соглашаетесь с тем, что мы используем файлы cookie.