adds JS tag filtering via allowlist

utdal · Sep 10, 2018 · f830b73 · f830b73
1 parent 058d270
commit f830b73
Show file tree

Hide file tree

Showing 4 changed files with 23 additions and 18 deletions.
diff --git a/Shortcodes/Profile.php b/Shortcodes/Profile.php
@@ -19,6 +19,7 @@ class Profile extends Shortcode
         'show_publications' => true,
         'show_support' => true,
         'show_tags' => true,
+        'allowed_tags' => false,
         'show_filter' => false,
         'publications_only' => false,
         'publication_limit' => 10,
@@ -37,6 +38,7 @@ class Profile extends Shortcode
         'show_publications' => FILTER_VALIDATE_BOOLEAN,
         'show_support' => FILTER_VALIDATE_BOOLEAN,
         'show_tags' => FILTER_VALIDATE_BOOLEAN,
+        'allowed_tags' => FILTER_SANITIZE_FULL_SPECIAL_CHARS,
         'show_filter' => FILTER_VALIDATE_BOOLEAN,
         'publications_only' => FILTER_VALIDATE_BOOLEAN,
         'publication_limit' => FILTER_VALIDATE_INT,

diff --git a/Views/content-profile.php b/Views/content-profile.php
@@ -5,13 +5,13 @@
 <div class="profiles-plugin profiles-container">
     <div id="publication-container"></div>
     <?php if ($show_filter): ?> 
-        <div id="filter-container">
-            <select id='filter-selector'>
+        <div class="filter-container">
+            <select class='filter-selector'>
                 <option value="">--Filter by--</option>
             </select>
         </div>
     <?php endif; ?>
-    <div class="profiles-plugin profile" data-person="<?= $person ?>" data-api-url="<?= $api ?>"  data-publications-only="<?= $publications_only ?>" data-publication-limit="<?= $publication_limit ?>" style="display:none;">
+    <div class="profiles-plugin profile" data-person="<?= $person ?>" data-api-url="<?= $api ?>"  data-publications-only="<?= $publications_only ?>" data-publication-limit="<?= $publication_limit ?>" data-allowed-tags="<?= $allowed_tags ?>" style="display:none;">
         <?php if ($show_image): ?>
             <div class="profile-image"></div>
         <?php endif; ?>
@@ -75,4 +75,4 @@
             <?php endif; ?>
       </div>
     </div>
-</div>
+</div>
diff --git a/public/css/profiles.css b/public/css/profiles.css
diff --git a/public/js/profile.js b/public/js/profile.js
@@ -17,14 +17,16 @@ var profile_reader = (function($, undefined) {
   var $awards_section = [];
   var all_pubs = [];
   var all_tags = [];
+  var allowed_tags = [];
   var $filter_container;
   var publications_only = false;
   var publication_limit = 10;
 
   var init = function(container) {
     $profile_container = $(container);
     $profile_template = $profile_container.find('.profiles-plugin.profile');
-    $filter_container = $profile_container.find('#filter-container');
+    $filter_container = $profile_container.find('.filter-container');
+    allowed_tags = $profile_template.data('allowed-tags').split(';').filter(Boolean);
     publications_only = $profile_template.data('publications-only') === 1;
     publication_limit = parseInt($profile_template.data('publication-limit')) || publication_limit;
 
@@ -142,9 +144,11 @@ var profile_reader = (function($, undefined) {
       // makeDataList(profile.tags, 'tags', $tags_section[profile.slug]);
       var $profile = $tags_section[profile.slug].parents('.profile');
       for (var i = 0; i < profile.tags.length; i++){
-        $tags_section[profile.slug].append('<span class="profile-tag ' + profile.tags[i].slug.en + '">' + profile.tags[i].name.en + '</span>');
-        $profile.addClass(profile.tags[i].slug.en);
-        all_tags[profile.tags[i].slug.en] = profile.tags[i].name.en;
+        if(allowed_tags.length == 0 || allowed_tags.includes(profile.tags[i].slug.en)){
+          $tags_section[profile.slug].append('<span class="profile-tag ' + profile.tags[i].slug.en + '">' + profile.tags[i].name.en + '</span>');
+          $profile.addClass(profile.tags[i].slug.en);
+          all_tags[profile.tags[i].slug.en] = profile.tags[i].name.en;
+        }
       }
     }
   }
@@ -175,10 +179,11 @@ var profile_reader = (function($, undefined) {
       Object.keys(all_tags).sort().forEach(function(key){
           sorted_tags[key] = all_tags[key];
       });
-      var tag_selector = $filter_container.find('#filter-selector');
+      var tag_selector = $filter_container.find('.filter-selector');
       for (var slug in sorted_tags){
         tag_selector.append('<option value="' + slug + '">' + sorted_tags[slug] + '</select>');
       }
+      all_tags = [];
 
       if(publications_only){
           all_pubs.sort(function(a, b){
@@ -233,14 +238,12 @@ jQuery(document).ready(function($) {
       profile_reader.init(this);
   });
 
-  $('#filter-selector').on('change', function(){
-    console.log(this.value);
-    $('.profiles-plugin.profile').show();
-    if(this.value != ''){
-      $('.profiles-plugin.profile:not(.' + this.value + ')').each(function(){
-        $(this).hide();
-      });
-    }
+  $('.filter-selector').on('change', function(){
+      var container = $(this).parents('.profiles-plugin.profiles-container')
+      container.find('.profiles-plugin.profile').show();
+      if(this.value){
+        container.find('.profiles-plugin.profile:not(.' + this.value + ')').hide();
+      }
   });
 
 });