How to solve Error: is not a function (code refactoring)

34 views Asked by At

How can I properly refactor this code (it works, but it needs to be placed in a separate function) When I put it in the function below, I get an error - getConcatCategories is not a function

this is a code and I want invoke the function in the same place inside if:

   define([
    'jquery',
    'can',
    'controls/base',
    'owl',
    'equalHeight',
    'imagesLoaded',
    'coreMods/categoryNav/categoryNav_model',
    'mustache!./relatedCategoryFeaturedMerchants_view'
  ],
  function ($, can, BaseControl, owl, equalHeight, imagesLoaded, CategoryNavModel, relatedCategoryFeaturedMerchantsView ) {

var MAX_FEATURED_MERCHANTS = 6;
var MAX_CATEGORIES = 2;

var StoreRelatedMerchantsControl = BaseControl({
  defaults: {
    moduleConfigName: 'relatedCategoryFeaturedMerchants',
    sectionHeader: '',
    hideRebatePrefix: true,
    useOldRebateValueWithoutCurrency: true,
    rebateAdditionalPrefix: 'Shop and',
    useCategoryNameForViewAllLink: false,
    viewAllLinkLanguage: 'View all',
    tiered: {
      useOldRebateValueWithoutCurrency: true,
      rebateAdditionalPrefix: 'Shop and earn',
    },
    currency: 'miles',
    showHeaderDivider: false,
    useCarousel: true,
    useConcatCategories: false,
  }
}, {
  init: function(element, options) {
    var that = this;

    var associatedCategoryIds = this.getAssociatedCategoryIds(options.merchant.categories);

    CategoryNavModel.findOne()
      .done(function (response) {
        var categories = [];

        response.each(function(category, index) {
          category.attr('featured', category.featured.slice(0, MAX_FEATURED_MERCHANTS));
          var hasFeaturedMerchants = category.featured && category.featured.length > 0;
          associatedCategoryIds.indexOf(category.id) !== -1 && hasFeaturedMerchants && categories.push(category);
        })

        var categoriesToDisplay = categories.slice(0, MAX_CATEGORIES);

        console.log(options.useConcatCategories);

        if (options.useConcatCategories) {
          //categoriesToDisplay = this.getConcatCategories(categories);
          categoriesToDisplay[0].attr('featured',
            categoriesToDisplay[0].attr('featured').concat(categoriesToDisplay[1].attr('featured')).slice(0, MAX_FEATURED_MERCHANTS)
          );
          categoriesToDisplay = categories.slice(0, 1);
          console.log(categoriesToDisplay);
        }

        if (categoriesToDisplay.length) {
          can.trigger(mn.events, 'relatedCategoryMerchants.confirmAvailability');

          var viewParams = {
            state: that.options,
            categories: categoriesToDisplay,
            mallServer: mn.mallServer,
          };

          that.element.html(can.view(relatedCategoryFeaturedMerchantsView, viewParams));

          that.$carouselHolder = that.element.find('.mn_merchantsList');
          that.manageCarouselAvailability();
        }
      })
      .fail(function() {
        mn.warn(arguments);
      });
  },

 // getConcatCategories: function(categoriesToDisplay) {
///    
  //  return categoriesToDisplay;
 // },

  getAssociatedCategoryIds: function(categories) {
    var associatedCategoryIds = [];

    categories.each(function(category) {
      associatedCategoryIds.push(category.id);
    })

    return associatedCategoryIds;
  },

  initCarousel: function () {
    if (!this.$carouselHolder.data('owl.carousel')) {
      this.$carouselHolder.addClass('owl-carousel owl-carousel-slider');
      this.$carouselHolder.addClass('mn_carousel');

        this.$merchantsList = this.element.find('.mn_dynamicMerchantsList');

        // smooth loading effect
        imagesLoaded(this.$merchantsList.find('.mn_logo')).on('progress', function (instance, image) {
            image.img.className += ' mn_loaded';
        });

        this.$carouselHolder.owlCarousel(
        $.extend(
          {
            items: 2,
            navSpeed: 800,
            margin: 20,
            dots: false,
            nav: false,
            responsive: {
              480: {
                items: 3
              },
              768: {
                items: 4,
                nav: true
              },
              950: {
                items: 6,
              }
            },
            navText: [
              '<span class="mn_carouselArrow mn_carouselArrowLeft" aria-hidden="true"></span>',
              '<span class="mn_carouselArrow mn_carouselArrowRight" aria-hidden="true"></span>'
            ],
            onInitialized: function() {
              mn.owlCarouselAccessibility();
            },
          },
          this.options.carousel
        )
      );
    }
  },

  destroyCarousel: function () {
    if (this.$carouselHolder.data('owl.carousel')) {
      this.$carouselHolder.trigger('destroy.owl.carousel');
      this.$carouselHolder.removeClass('owl-carousel owl-carousel-slider mn_carousel');
    }
  },

  '{window} resizeEnd': function(){
    this.manageCarouselAvailability();
  },

  manageCarouselAvailability: function(){
    if (this.isAllowedToDisplayCarousel()) {
      this.initCarousel();
    } else {
      this.destroyCarousel();
    }
  },

  isAllowedToDisplayCarousel: function(){
    return this.$carouselHolder && this.options.useCarousel;
  },
});

return StoreRelatedMerchantsControl;

});

So I need invoke this function in the same if statement: if (options.useConcatCategories) {

but code which now inside statement shoul be in separate function below named // getConcatCategories: function(categoriesToDisplay) {

But when I put it in this way - I receive an error: is not a function what I'm doing wrong?

0

There are 0 answers