  if(!$){$ = jQuery;}
  
  (function (resources, $, undefined) {
    resources.initial = {
      _hasArgs: false,
      _params: {},
      _filter: -1,
      _posts: -1,
    }
  
    resources.data = {
      mode: "post_types", //post_types or events
      posts_container_selector: ".posts_wrapper",
      filter_hash: -1, // prevents posts overwriting
      page: 1,
      post_num: 9,
      mobile_post_num: 3,
      post_type: "",
      events_type: "",
      _data_types: [],
      term_id: [],
      categories: {
        initialized: false, // default: false, sets to true: 
        defs: {},
      },
      nav: {
        max_pages_to_show: 3,
      },
      timeouts: {
        posts_container_max_height: -1,
      }
    }
  
    resources.debug = {
      printAjaxUrl: false
    }
  
    resources.assets = {
      right_arrow: '<div class="arrow_holder">  <svg class="btn-child-arrow-head" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="14" height="12"  viewBox="0 0 448 512" shape-rendering="geometricPrecision" text-rendering="geometricPrecision">    <g>    <path d="M438.6,278.6l-160,160c-6.2,6.3-14.4,9.4-22.6,9.4s-16.38-3.125-22.62-9.375c-12.5-12.5-12.5-32.75,0-45.25L338.8,288h-296.187512L32,288c-17.67,0-31.9984-14.3-31.9984-32s14.3284-32,31.9984-32h11.25h295.55L233.4,118.6c-12.5-12.5-12.5-32.75,0-45.25s32.75-12.5,45.25,0l160,160c12.45,12.55,12.45,32.75-.05,45.25Z" transform="translate(.018799 0)"/>    </g>  </svg>  <svg class="btn-child-arrow-neck" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="14" height="12" viewBox="0 0 448 512" shape-rendering="geometricPrecision" text-rendering="geometricPrecision">    <g><path d="M338.8,288h-296.187512L32,288c-17.67,0-31.9984-14.3-31.9984-32s14.3284-32,31.9984-32h11.25h295.55" transform="translate(-.0016 0)"/></g>  </svg></div>',
    }
  
    // Added to add filter to uri query
    resources.get_uri_params = function() {
      var _return = false;
      let urlSearchParams = new URLSearchParams(window.location.search);
      resources.initial._params = Object.fromEntries(urlSearchParams.entries());
      if(Object.keys(resources.initial._params).length>0) { _return = resources.initial._hasArgs = true; }
      return _return;
    };
  
    // Added to add filter to uri query
    resources.get_filter_value = function(input) {
      let return_value = false;
      let reverse_dict_data = {
        "blog_posts": {val:"blogs"},
        "news_posts": {val:"news"},
        "case_study_posts": {val:"casestudies"},
        "ebook_posts": {val:"ebooks"},
      }
      if(reverse_dict_data.hasOwnProperty(input)) {
        return_value = reverse_dict_data[input].val;
      }
      return return_value;
    }
  
    // Added to add filter to uri query
    resources.handle_params = function(){
      if(resources.initial._params.hasOwnProperty('pt')) {
        var _user_filter = resources.initial._params['pt'];
        var _dict_data = {
          "blogs": {val:"blog_posts"},
          "news": {val:"news_posts"},
          "casestudies": {val:"case_study_posts"},
          "ebooks": {val:"ebook_posts"},
        }
        if(_dict_data.hasOwnProperty(_user_filter)) {
          resources.initial._filter = _dict_data[_user_filter].val;
          resources.initial._posts = _dict_data[_user_filter].val;
        }
      }
      // if(resources.initial._params.hasOwnProperty('gc')) { //gatedcode
      //   var _gated_code = resources.initial._params['gc'];
      //   jQuery('.gated-lightbox').addClass('active');
      //   jQuery('#input_7_9').val(_gated_code);
      // }
    }
  
    resources.hash = function(str, seed = 0) {
      let h1 = 0xdeadbeef ^ seed, h2 = 0x41c6ce57 ^ seed;
      for (let i = 0, ch; i < str.length; i++) {
          ch = str.charCodeAt(i);
          h1 = Math.imul(h1 ^ ch, 2654435761);
          h2 = Math.imul(h2 ^ ch, 1597334677);
      }
      h1 = Math.imul(h1 ^ (h1>>>16), 2246822507) ^ Math.imul(h2 ^ (h2>>>13), 3266489909);
      h2 = Math.imul(h2 ^ (h2>>>16), 2246822507) ^ Math.imul(h1 ^ (h1>>>13), 3266489909);
      return 4294967296 * (2097151 & h2) + (h1>>>0);
    }
  
    resources.set_uri = function(label, value) {
      var to_set = value; // value that you want to set
      var url = new URL(window.location);
      if(to_set.length == 0) {
        url.searchParams.delete('pt')
        history.pushState({},null,url);
        return false;
      }
      (url.searchParams.has(label) ? url.searchParams.set(label, to_set) : url.searchParams.append(label, to_set));
  
      // if you want to append into URL without reloading the page
      url.search = url.searchParams;
      url        = url.toString();
      history.replaceState({}, null, url);
    }
  
    //  if category mode
    //  fills resources.data.categories.defs with all the category id's
    resources.init = async function () {
      if(resources.get_uri_params()){
        console.log('\t\t\t resources - attempting handle_params');
        resources.handle_params();
        console.log('\t\t\t resources - end of get_uri_params');
        console.log(resources);
        if(resources.initial._filter) {
          resources.data.post_type = [resources.initial._filter]
          $(`.filter input`).prop('checked','');
          $(`.filter input#${resources.initial._filter}`).prop('checked','true')
        }
      }
  
      resources.data.mode = $('section.resources_panel ').attr('run_mode');
      if(resources.data.mode == "post_types") {
        resources.filterPosts();
        resources.getWritePosts(resources.setHash());
      }
      else if(resources.data.mode == "events") {
        resources.filterPosts();
        resources.getWritePosts(resources.setHash());
      }
      else if(resources.data.mode == "categories") {
        let all_category_terms = $('section.resources_panel input[name="All"]').attr('data-filter');
        fetch(`/wp-json/wp/v2/integrations?categories=${all_category_terms}`)
          .then(response => response.json())
          .then(function (data) {
            for (key in data) {
              let item = data[key];
              resources.data.categories.defs[item.id] = item;
            }
            resources.data.categories.initialized = true;
          })
          .then(function () {
            resources.filterPosts();
            resources.getWritePosts(resources.setHash());
          })
      }
    }
  
    resources.setHash = function() {
      let request_hash = resources.hash(Date.now().toString());
      resources.data.filter_hash = request_hash;
      return request_hash;
    }
  
    resources.getWritePosts = async function (in_hash = "", onlyShowNewPosts = true) {
      if(resources.data.mode == "post_types") {
        let num_posts_per_page = (document.documentElement.clientWidth > 767) ? resources.data.post_num : resources.data.mobile_post_num;
        var url = `/wp-json/custom/v2/all-posts?&post_type=${resources.data.post_type}&page=${resources.data.page}&posts_per_page=${num_posts_per_page}`;
      }
      else if(resources.data.mode == "events") {
        let num_posts_per_page = (document.documentElement.clientWidth > 767) ? resources.data.post_num : resources.data.mobile_post_num;
        var url = `/wp-json/custom/v2/all-posts?&post_type=${resources.data.post_type}&events_type=${resources.data.events_type}&page=${resources.data.page}&posts_per_page=${num_posts_per_page}`;
      }
      else if(resources.data.mode == "categories") {
        let cat_query = (resources.data.term_id == 0) ? "" : `categories=${resources.data.term_id}`; // == 0, exclude the blog-posts-categories filter
        let num_posts_per_page = (document.documentElement.clientWidth < 376) ? resources.data.mobile_post_num : resources.data.post_num; // == mobile - use mobile_post_num, else use post_num
        var url = `/wp-json/custom/v2/integrations?${cat_query}&page=${resources.data.page}&per_page=${num_posts_per_page}&filter[orderby]=date&order=desc`;
      }
  
      
      if (resources.debug.printAjaxUrl) { console.log(url); }
      // check if latest
      if(in_hash !== "" && in_hash !== resources.data.filter_hash) {
        console.log('\t\tskipped due to hash mismatch -- before ajax');
        return;
      }
  
      $.ajax(url, {
        type: 'GET',
        success: function (data, status, xhr) {
          let ctr = 0;
          console.log(`in_hash: ${in_hash} resources.data.filter_hash ${resources.data.filter_hash}`);
          // check if latest
          if(in_hash !== "" && in_hash !== resources.data.filter_hash) {
            console.log('\t\tskipped due to hash mismatch -- in ajax');
            return;
          }
          if('data' in data) {
            // clear existing posts
            if(onlyShowNewPosts) {
              $(resources.data.posts_container_selector).html('');
            }
  
            data.data.forEach(post => {
              var categoryCPT;
              var thumbnailCPT;
  
              async function fetchThumbnail(ctr) {
                const response = await fetch(`/wp-json/wp/v2/media/${post['acf']['blog_post']['thumbnail']}`)
                const img_data = await response.json();
                let img_src = img_data['guid']['rendered'];
                let img = $(`.individual_post[post-id=${ctr}] a.post_image > img`).attr('src', img_src);
              }
  
              function postResources(ctr) {
                let this_category = (resources.data.categories.initialized) ? "" : "Resource"; // look 
  
                if (this_category == "" || this_category == "Resource") {
                  let new_arr = $.map(post['blog-posts-categories'], function (i) { return resources.data.categories.defs[i].name; });  //  $.map(array, function(el){return el;}) //takes array and creates a new array made with the values returned from function(el){return el;}
                  this_category = new_arr.join(', ');
                }
  
                let postHtml;
                if(resources.data.mode == "post_types" || resources.data.mode == "events" || resources.data.mode == "categories") {
                  let dynamic_els = {button:"", image:"", title:""};
                  let button_logic = true;
                  if(true && button_logic) {
                    if(post['type'] == 'news_posts' || post['type'] == 'blog_posts') {
                      let dynamic_props = {};
                      dynamic_props['button'] = {
                        base_class: "button has_arrow", // base css class
                        a_text: "READ MORE" + resources.assets.right_arrow // content within a element
                      };
                      _has_image = (post['image'] !== null && post['image'] && post['image']['url'] !== null && post['image']) ? true : false;
                      _has_scaling = (post['data'].hasOwnProperty('image_scaling')) ? post['data']['image_scaling'] : false;
                      console.log(post['data']);
                      _image = (_has_image) ? 
                            // content within a element
                            `<img
                              ${"src="+post['image']['url']}
                              style="background: rgb(250 250 250);${(_has_scaling) ? "--image_scaling: "+_has_scaling+";" : ""}"
                            >`:
                            "";
                      dynamic_props['image'] = {
                          base_class: "post_image", // base css class
                          a_text: _image,
                      };
                      dynamic_props['title'] = {
                          base_class: "nostyle", // base css class
                          a_text: `<p class="title">${post['data']['title']}</p>` // content within a element
                      };
                      dynamic_els['text_content'] = "";
  
                      for(let i = 0; i < 3; i++) {
                        let mode = Object.keys(dynamic_props)[i]; //which element are we building
                        let base_class = dynamic_props[mode].base_class;
                        let extra_class = "";
                        let a_text = dynamic_props[mode].a_text;
                        let prop_target = post['link']['target'];
                        dynamic_els[mode] = `
                          <a 
                            href="${post['link']['url']}"
                            class="${base_class} ${extra_class}"
                            data-link="${post['link']['url']}"
                            data-title="${post['data']['title']}"
                            data-resource-type="redirect"
                            bg="transparent"
                            color="lightblue"
                            size-resources
                            target="${prop_target}"
                          >
                          ${a_text}
                          </a>`;
                      }
                    }
                    else if(post['type'] == 'integrations') {
                      console.log('integrations');
                      let dynamic_props = {};
                      dynamic_props['button'] = {
                        base_class: "arrow cta", // base css class
                        a_text: "READ MORE" + resources.assets.right_arrow // content within a element
                      };
                      dynamic_props['image'] = {
                          base_class: "post_image", // base css class
                          a_text: `<img 
                                        ${(post['image'] !== null && post['image']['url'] !== null) ? "src="+post['image']['url'] : 'no_image'}
                                        style="background: #fff;">` // content within a element
                      };
                      dynamic_props['title'] = {
                          base_class: "nostyle", // base css class
                          a_text: `<p class="title">${post['data']['title']}</p>` // content within a element
                      };
                      dynamic_els['text_content'] = "";
  
                      for(let i = 0; i < 3; i++) {
                        let mode = Object.keys(dynamic_props)[i]; //which element are we building
                        let add_wrapping_a_elem = true;
                        let a_text = dynamic_props[mode].a_text;
                        if(mode != "image") {
                          let base_class = dynamic_props[mode].base_class;
                          let extra_class = "";
                          let prop_target = "";
                          dynamic_els[mode] = `
                            <a 
                              href="${post['link']}"
                              class="${base_class} ${extra_class}"
                              data-link="${post['link']['url']}"
                              data-title="${post['data']['title']}"
                              data-resource-type="redirect"
                              target="${prop_target}"
                            >
                            ${a_text}
                            </a>`;
                        }
                        else {
                          dynamic_els[mode] = a_text;
                        }
                      }
                    }
                    else if(post['type'] == 'newsletter_posts') {
                      let is_gated = (post['data']['is_gated'] == "yes");
                      let extra_class = (is_gated) ? "activate_gated_lightbox" : "";
                      let prop_target = (is_gated)?"":"_blank";
                      let dynamic_props = {
                        'button': {
                          base_class: "button", // base css class
                          a_text: "VIEW" // content within a element
                        },
                        'image': {
                          base_class: "post_image", // base css class
                          a_text: `<img src="${post['image']['link']}" style="background: lightgray;">` // content within a element
                        }, 
                        'title': {
                          base_class: "nostyle", // base css class
                          a_text: `<p class="title">${post['data']['title']}</p>` // content within a element
                        }
                      };
                      for(let i = 0; i < 3; i++) {
                        let mode = Object.keys(dynamic_props)[i]; //which element are we building
                        let base_class = dynamic_props[mode].base_class;
                        let a_text = dynamic_props[mode].a_text;
                        dynamic_els[mode] = `
                          <a 
                            href="${post['link']}"
                            class="${base_class} ${extra_class}"
                            data-link="${post['link']}"
                            data-title="${post['data']['title']}"
                            data-resource-type="redirect"
                            target="${prop_target}"
                          >
                          ${a_text}
                          </a>`;
                      }
                    }
                    else if(post['type'] == 'externalresources') {
                      console.log('externalresources');
                      console.log(post);
                      // let is_gated = (post['data']['is_gated'] == "yes");
                      let extra_class = "";
                      let prop_target = post['data']['link']['target'];
                      let dynamic_props = {
                        'button': {
                          base_class: "cta arrow", // base css class
                          a_text: "READ MORE" + resources.assets.right_arrow // content within a element
                        },
                        'image': {
                          base_class: "post_image", // base css class
                          a_text: `<img 
                                        ${(post['image'] !== null && post['image']['url'] !== null) ? "src="+post['image']['url'] : 'no_image'}
                                        style="background: lightgray;">` // content within a element
                        }, 
                        'title': {
                          base_class: "nostyle", // base css class
                          a_text: `<p class="title">${post['data']['title']}</p>` // content within a element
                        }
                      };
                      for(let i = 0; i < 3; i++) {
                        let mode = Object.keys(dynamic_props)[i]; //which element are we building
                        let base_class = dynamic_props[mode].base_class;
                        let a_text = dynamic_props[mode].a_text;
                        dynamic_els[mode] = `
                          <a 
                            href="${post['link']}"
                            class="${base_class} ${extra_class}"
                            data-link="${post['link']}"
                            data-title="${post['data']['title']}"
                            data-resource-type="redirect"
                            target="${prop_target}"
                          >
                          ${a_text}
                          </a>`;
                      }
                    }
                    else if(post['type'] == 'case_study_posts') {
                      let is_gated = (post['data']['is_gated'] == "yes");
                      let extra_class = (is_gated) ? "activate_gated_lightbox" : "";
                      let prop_target = (is_gated)?"":"_blank";
                      let dynamic_props = {
                        'button': {
                        base_class: "button has_arrow", // base css class
                        a_text: "READ MORE" + resources.assets.right_arrow // content within a element
                        },
                        'image': {
                          base_class: "post_image", // base css class
                          a_text: `<img src="${post['image']['link']}" style="background: lightgray;">` // content within a element
                        }, 
                        'title': {
                          base_class: "nostyle", // base css class
                          a_text: `<p class="title">${post['data']['title']}</p>` // content within a element
                        }
                      };
                      for(let i = 0; i < 3; i++) {
                        let mode = Object.keys(dynamic_props)[i]; //which element are we building
                        let base_class = dynamic_props[mode].base_class;
                        let a_text = dynamic_props[mode].a_text;
                        dynamic_els[mode] = `
                          <a 
                            href="${post['link']}"
                            class="${base_class} ${extra_class}"
                            data-link="${post['link']['url']}"
                            data-title="${post['data']['title']}"
                            data-resource-type="redirect"
                            bg="transparent"
                            color="lightblue"
                            size-resources
                            target="${prop_target}"
                          >
                          ${a_text}
                          </a>`;
                      }
                    }
                    else if(post['type'] == 'ebook_posts') {
                      console.log(post);
                      let is_gated = (post['data']['is_gated'] == "yes");
                      let extra_class = (is_gated) ? "activate_gated_lightbox" : "";
                      let prop_target = (is_gated)?"":"_blank";
                      let dynamic_props = {
                        'button': {
                        base_class: "button has_arrow", // base css class
                        a_text: "READ MORE" + resources.assets.right_arrow // content within a element
                        },
                        'image': {
                          base_class: "post_image", // base css class
                          a_text: `<img src="${post['image']['url']}" style="background: lightgray;">` // content within a element
                        }, 
                        'title': {
                          base_class: "nostyle", // base css class
                          a_text: `<p class="title">${post['data']['title']}</p>` // content within a element
                        }
                      };
                      for(let i = 0; i < 3; i++) {
                        let mode = Object.keys(dynamic_props)[i]; //which element are we building
                        let base_class = dynamic_props[mode].base_class;
                        let a_text = dynamic_props[mode].a_text;
                        dynamic_els[mode] = `
                          <a 
                            href="${post['link']}"
                            class="${base_class} ${extra_class}"
                            data-link="${post['link']['url']}"
                            data-title="${post['data']['title']}"
                            data-resource-type="redirect"
                            bg="transparent"
                            color="lightblue"
                            size-resources
                            target="${prop_target}"
                          >
                          ${a_text}
                          </a>`;
                      }
                    }
                    else if(post['type'] == 'whitepapers') {
                      let is_gated = (post['data']['is_gated'] == "yes");
                      let extra_class = (is_gated) ? "activate_gated_lightbox" : "";
                      let prop_target = (is_gated)?"":"_blank";
                      let dynamic_props = {
                        'button': {
                          base_class: "button", // base css class
                          a_text: "DOWNLOAD" // content within a element
                        },
                        'image': {
                          base_class: "post_image", // base css class
                          a_text: `<img src="${post['image']['link']}" style="background: lightgray;">` // content within a element
                        }, 
                        'title': {
                          base_class: "nostyle", // base css class
                          a_text: `<p class="title">${post['data']['title']}</p>` // content within a element
                        }
                      };
                      for(let i = 0; i < 3; i++) {
                        let mode = Object.keys(dynamic_props)[i]; //which element are we building
                        let base_class = dynamic_props[mode].base_class;
                        let a_text = dynamic_props[mode].a_text;
                        dynamic_els[mode] = `
                          <a 
                            href="${post['data']['download']['url']}"
                            class="${base_class} ${extra_class}"
                            data-link="${post['data']['download']['url']}"
                            data-title="${post['data']['title']}"
                            data-resource-type="download"
                            target="${prop_target}"
                          >
                          ${a_text}
                          </a>`;
                      }
                    }
                    else if(post['type'] == 'events') {
                      console.log('events');
                      let is_gated = (post['data']['is_gated'] == "yes");
                      let extra_class = "";
                      let prop_target = post['data']['link']['target'];
                      let dynamic_props = {};
                      dynamic_props['button'] = {
                        base_class: "arrow cta", // base css class
                        a_text: post['data']['link']['title'] + resources.assets.right_arrow // content within a element
                      };
                      dynamic_props['image'] = {
                          base_class: "post_image", // base css class
                          a_text: `<img 
                                        ${(post['image'] !== null && post['image']['url'] !== null) ? "src="+post['image']['url'] : 'no_image'}
                                        style="background: lightgray;">` // content within a element
                      };
                      dynamic_props['title'] = {
                          base_class: "nostyle", // base css class
                          a_text: `<p class="title">${post['data']['title']}</p>` // content within a element
                      };
                      for(let i = 0; i < 3; i++) {
                        let mode = Object.keys(dynamic_props)[i]; //which element are we building
                        let base_class = dynamic_props[mode].base_class;
                        let a_text = dynamic_props[mode].a_text;
                        dynamic_els[mode] = `
                          <a 
                            href="${post['data']['link']['url']}"
                            class="${base_class} ${extra_class}"
                            data-link="${post['data']['link']['url']}"
                            data-title="${post['data']['title']}"
                            data-resource-type="redirect"
                            target="${prop_target}"
                          >
                          ${a_text}
                          </a>`;
                      }
                      let date_range = (post['data']['end_date'] !== null) ?
                                    post['data']['start_date'] + " - " + post['data']['end_date'] :
                                    post['data']['end_date'];
                      let location = (post['data']['location'] !== null) ? post['data']['location'] : "TBA";
                      let additional_content = (post['data']['additional_content'] !== null && post['data']['additional_content'].length > 0 ) ? 
                                              `<p>${post['data']['additional_content']}</p>` :
                                              "";
                      dynamic_els['text_content'] = `
                        <div class="text_content">
                          <p>${date_range}</p>
                          <p>${location}</p>
                          ${additional_content}
                        </div>
                      `;
                    }
                  }
                  if(resources.data.mode == "events") {
                    console.log('in events');
                      postHtml = `
                      <div class="card"
                        resources-post-type=${post['type']}
                        size="normal"
                        mode="image_text"
                        shadow="false"
                        rounded="false"
                        orientation="vertical"
                        post-id="${ctr}"
                      >
                        <div class="media" style="--vertical_alignment_resources_page:${('vertical_alignment_resources_page' in post['data']) ? post['data']['vertical_alignment_resources_page'] : ""}%">
                          ${dynamic_els.image}
                        </div>
                        <div class="text">
                          <p class="label display_none">${post['label']}</p>
                          ${dynamic_els.title}
                          ${dynamic_els.text_content}
                          <p class="preview_text">${post['preview_text']}</p>
                          <div class="_a_wrapper">
                            ${dynamic_els.button}
                          </div>
                        </div>
                      </div>`;
                  }
                  else if (resources.data.mode == "categories") {
                      postHtml = `
                      <div class="card item-resource"
                        resources-post-type=${post['type']}
                        size="normal"
                        mode="image"
                        rounded-15
                        shadow-5
                        orientation="vertical"
                        post-id="${ctr}"
                      >
                        <div class="media">
                          ${dynamic_els.image}
                        </div>
                      </div>`;
                  }
                  else {
                      postHtml = `
                      <div class="card item-resource"
                        resources-post-type=${post['type']}
                        size="normal"
                        mode="image_text"
                        shadow="false"
                        rounded="false"
                        orientation="vertical"
                        post-id="${ctr}"
                      >
                        <div 
                          class="media"
                          style="--vertical_alignment_resources_page:${('vertical_alignment_resources_page' in post['data']) ? post['data']['vertical_alignment_resources_page'] : ""}%"
                          rounded-20
                        >
                          ${dynamic_els.image}
                        </div>
                        <div class="text">
                          <p class="label display_none">${post['label']}</p>
                          <div class="meta_info">
                            <p class="date">${post['date']}</p>
                            <p divider>|</p>
                            <p class="label">${post['label']}</p>
                            <p class="comments display_none">${post['comments_num']} Comments</p>
                          </div>
                          <div class="title">
                            ${dynamic_els.title}
                          </div>
                          <div class="preview_text">
                            <p class="preview_text">${post['preview_text']}</p>
                          </div>
                        </div>
                        <div class="_a_wrapper">
                          ${dynamic_els.button}
                        </div>
                      </div>`;
                  }
                }
  
                $(resources.data.posts_container_selector).append(postHtml);
              }
  
              postResources(ctr);
              ctr++;
            });
  
            // fade in
            $(`${resources.data.posts_container_selector}[requesting]`).css('min-height','0px');
            $(`${resources.data.posts_container_selector}[requesting]`).css('max-height',$(resources.data.posts_container_selector)[0].scrollHeight+"px");
            $(resources.data.posts_container_selector).removeAttr('requesting');
  
            // Handle load more button
            let num_posts_per_page = (document.documentElement.clientWidth > 767) ? resources.data.post_num : resources.data.mobile_post_num;
            let nav = $('.resources_panel_nav');
            if($('.resources_panel_nav').attr('mode') == "pages") {
              let previous_arrow_display = (data.page !== '1') ? 'visible' : 'hidden';
              let next_arrow_display = (data.is_last_page !== true) ? 'visible' : 'hidden';
              nav.find('a.nav[previous]:eq(0)').css('visibility', previous_arrow_display);
              nav.find('a.nav[next]:eq(0)').css('visibility', next_arrow_display);
              pages = resources.get_nav_pages(data.page, data.last_page);
              nav.find('a.nav[page]').remove();
              pages.map(function(i){
                let extra = (i == data.page) ? "current" : "";
                nav.find('.pagination .pages').append(`<a class="nav" rounded-10 page="${i}" ${extra}>${i}</a>`);
              })
            }
            else {
            if (data.is_last_page) {
              $('.load_more_posts').css("display", "none");
            }
            else {
              $('.load_more_posts').css("display", "inline-flex");
            }
            }
          }
  
          console.log('\t\t gwp success ' + in_hash);
        },
        error: function (jqXhr, textStatus, errorMessage) {
          console.log(errorMessage);
        }
      });
    }
   
    resources.fadeOutPosts = function (request_hash) {
      return new Promise(resolve => {
        if($( `${resources.data.posts_container_selector}[requesting]` ).length == 0) {
          $(resources.data.posts_container_selector).attr('requesting','');
          clearTimeout(resources.data.timeouts.posts_container_max_height);
          $(resources.data.posts_container_selector).css('min-height',$(resources.data.posts_container_selector)[0].scrollHeight+"px");
          $(resources.data.posts_container_selector).css('max-height',$(resources.data.posts_container_selector)[0].scrollHeight+"px");
          setTimeout(function(){
            $(resources.data.posts_container_selector).css('min-height','unset');
            $(resources.data.posts_container_selector).css('max-height','unset');
          }, 500);
        }
        resolve(true);
      })
    }
  
    resources.refreshPosts = async function(onlyShowNewPosts = true){
      let request_hash = resources.setHash();
      if(onlyShowNewPosts) {
        let result = resources.fadeOutPosts(request_hash);
      }
      await resources.getWritePosts(request_hash, onlyShowNewPosts);
    }
    
  
    resources.get_nav_pages = function(page, last_page) {
        last_page = parseInt(last_page);
        page = parseInt(page);
        let pages = [];
        let num_surrounding_elements = Math.floor((resources.data.nav.max_pages_to_show - 1) / 2);
        // need to have more on one side or the other (this page is not centered)
        if(last_page < (page + num_surrounding_elements)) {
          let less_pages_than_allowed = last_page < resources.data.nav.max_pages_to_show;
          let pages_out = 0;
          for(i = ((less_pages_than_allowed) ? 1 : last_page - (resources.data.nav.max_pages_to_show-1)); i <= last_page && pages_out < resources.data.nav.max_pages_to_show; i++) {
            pages.push(i);
            pages_out++;
          }
        }
        // page is centered, enough pages
        else if(page >= 1 + num_surrounding_elements) {
          let pages_out = 0;
          for(i = (page - num_surrounding_elements); (i <= (page + num_surrounding_elements) && pages_out < resources.data.nav.max_pages_to_show); i++) {
            pages.push(i);
            pages_out++;
          }
        }
        else {
          let pages_out = 0;
          for(i = 1; i <= last_page  && pages_out < resources.data.nav.max_pages_to_show; i++) {
            pages.push(i);
            pages_out++;
          }
        }
        return pages;
    }
  
    resources.filterPosts = function () {
      let new_filters = [];
  
      var this_input = $('.filter input');
      mode = "default";
      if(mode == "default") {
        $('.filter input').each(function (i, val) {
          var this_input = $(val);
          var this_data_post = this_input.attr('data-filter');
  
          // if (this_data_post !== 0) {
          //   $('.filter input[data-filter=0]').prop('checked', false);
          // }
  
          if (this_input.prop('checked')) {
            new_filters.push(this_data_post);
          }
        })
  
        if(resources.data.mode == "post_types") {
          // if nothing is checked, handle
          if (new_filters.length == 0) {
            new_filters = [];
            if((resources.data.mode == "post_types")) {
              let representation_of_all = "all_posts";
              new_filters.push(representation_of_all);
              $(`.filter input[data-filter=${representation_of_all}]`).prop('checked', true);
            }
            else { // old categories, which would include ALL categories and not just ALL of the ones to be shown on the page
              let representation_of_all = "0";
              new_filters.push(representation_of_all);
              $(`.filter input[data-filter=${representation_of_all}]`).prop('checked', true);
            }
          }
  
          if(new_filters.includes("all_posts")) {
            new_filters = $.map($('input[data-filter]:not([data-filter=all_posts])'),function(i,val,e){return $(i).attr('data-filter');});
          }
          resources.data.post_type = new_filters;
        }
        else if (resources.data.mode == "events") {
          // if nothing is checked, handle
          if (new_filters.length == 0) {
            $(`.filter input[data-filter=upcoming]`).prop('checked', true);
          }
  
          resources.data.post_type = 'events';
          resources.data.events_type = $.map($('input[data-filter]:checked'),function(i,val,e){return $(i).attr('data-filter');});
        }
        else if(resources.data.mode == "categories") {
          // if nothing is checked, handle
          if (new_filters.length == 0) {
            let representation_of_all = "All";
            new_filters.push($(`.filter input[data-filter][name="All"]`).attr('data-filter'));
            $(`.filter input[data-filter][name="${representation_of_all}"]`).prop('checked', true);
          }
          
          resources.data.term_id = new_filters;
        }
      }
    }
  
  }(window.resources = window.resources || {}, jQuery));
  
  resources.init(); // pulls data from wp-json categories, then loads posts for first page load
  
  // var input = $('.filter input[data-filter]');
  
  // ███████╗██╗██╗  ████████╗███████╗██████╗ ███████╗     ██████╗ ███╗   ██╗     ██████╗██╗     ██╗ ██████╗██╗  ██╗
  // ██╔════╝██║██║  ╚══██╔══╝██╔════╝██╔══██╗██╔════╝    ██╔═══██╗████╗  ██║    ██╔════╝██║     ██║██╔════╝██║ ██╔╝
  // █████╗  ██║██║     ██║   █████╗  ██████╔╝███████╗    ██║   ██║██╔██╗ ██║    ██║     ██║     ██║██║     █████╔╝ 
  // ██╔══╝  ██║██║     ██║   ██╔══╝  ██╔══██╗╚════██║    ██║   ██║██║╚██╗██║    ██║     ██║     ██║██║     ██╔═██╗ 
  // ██║     ██║███████╗██║   ███████╗██║  ██║███████║    ╚██████╔╝██║ ╚████║    ╚██████╗███████╗██║╚██████╗██║  ██╗
  // ╚═╝     ╚═╝╚══════╝╚═╝   ╚══════╝╚═╝  ╚═╝╚══════╝     ╚═════╝ ╚═╝  ╚═══╝     ╚═════╝╚══════╝╚═╝ ╚═════╝╚═╝  ╚═╝
                                                                                                                 
  var inputs = document.querySelectorAll('.filter input[data-filter]');
  
  inputs.forEach(input => {
    input.addEventListener('click', function () {
      if(resources.data.mode == "post_types") {
        
        let dataPosts = input.getAttribute('data-filter');
        //  if all posts is selected, uncheck rest
        //  if you want mutually exclusive, in the else, uncomment first line
        if (dataPosts == "all_posts") {
          resources.set_uri('pt','');
          $('.filter input[data-filter]').prop('checked', false);
          $('.filter input[data-filter=all_posts]').prop('checked', true);
        }
        else {
          // set URI
          resources.set_uri('pt',resources.get_filter_value(dataPosts));
          // set checked
          $(`.filter input:not([data-filter=${dataPosts}])`).prop('checked', false);
          $('.filter input[data-filter=all_posts]').prop('checked', false);
        }
        resources.filterPosts();
        resources.data.page = 1;
        resources.refreshPosts();
      }
      else if (resources.data.mode == 'events') {
        let dataPosts = input.getAttribute('data-filter');
        resources.filterPosts();
        resources.data.page = 1;
        resources.refreshPosts();
      }
      else if(resources.data.mode == "categories") {
        let dataPosts = input.getAttribute('data-filter');
        let is_all_filter = input.getAttribute('name') == "All" ? true : false;
        //  if all posts is selected, uncheck rest
        if (is_all_filter) {
          $('.filter input[data-filter]').prop('checked', false);
          $('.filter input[name=All]').prop('checked', true);
        }
        else {
          $(`.filter input:not([name="${this_attr_name}"])`).prop('checked', false);
          $('.filter input[name=All]').prop('checked', false);
        }
        resources.filterPosts();
        resources.data.page = 1;
        resources.refreshPosts();
      }
    });
  })





  
  $(resources.data.posts_container_selector).on('mouseenter','.card a', function(){
    let this_card = $($(this).closest('.card'));
    this_card.find('a').map(function(i, el){$(el).addClass('hover');});
  })

  $(resources.data.posts_container_selector).on('mouseleave','.card a', function(){
    let this_card = $($(this).closest('.card'));
    this_card.find('a.hover').map(function(i, el){$(el).removeClass('hover');});
  })
  
  
  // load more - button - event listener
  $('.load_more_posts').on('click', function() {
    resources.data.page++;
    resources.refreshPosts(false);
  })
  
  if($('.resources_panel_nav').attr('mode') == "pages") {
    $('.resources_panel_nav').on('click', 'a.nav[page]:not([current])', function(){
      // pagination
      resources.data.page = $(this).attr('page');
      resources.refreshPosts();
      document.querySelector('.resources_panel').scrollIntoView({
        behavior: "smooth",
        block: "start",
        inline: "start"
      });
      // set styling on page we are trying to get to
      $('[current]').removeAttr('current');
      $('a.nav.temporary[page]').removeClass('temporary');
      $(this).addClass('temporary');
    })
  
    // bottom nav - previous arrow handling
    $('.resources_panel_nav').on('click', 'a.nav[previous]', function() {
      resources.data.page = (resources.data.page == 1) ? 1 : resources.data.page - 1;
      resources.refreshPosts();
      document.querySelector('.resources_panel').scrollIntoView({
        behavior: "smooth",
        block: "start",
        inline: "start"
      });
      // set styling on page we are trying to get to
      $('[current]').removeAttr('current');
      $('a.nav.temporary[page]').removeClass('temporary');
      $(`a.nav[page=${resources.data.page}]`).addClass('temporary');
    })
  
    // bottom nav - next arrow handling
    $('.resources_panel_nav').on('click', 'a.nav[next]', function(){
      resources.data.page++;
      resources.refreshPosts();
      document.querySelector('.resources_panel').scrollIntoView({
        behavior: "smooth",
        block: "start",
        inline: "start"
      });
      // set styling on page we are trying to get to
      $('[current]').removeAttr('current');
      $('a.nav.temporary[page]').removeClass('temporary');
      $(`a.nav[page=${resources.data.page}]`).addClass('temporary');
    })
  }