Photoswipe: Uncaught TypeError: Cannot create property 'initialLayout' on boolean 'false'

Created on 30 Jan 2019  路  4Comments  路  Source: dimsemenov/PhotoSwipe

I already have more than 6 hours trying to solve this problem and I do not know what to do.

captura de tela 2019-01-30 as 16 04 17

my HTML:

<ul class="wp-block-gallery columns-3 is-cropped">
    <li class="blocks-gallery-item">
        <figure>
            <a href="https://s1n7ese.com/wp-content/uploads/2019/01/DyFtPpCVAAAmQKY-1024x576.jpg">
                <img src="https://s1n7ese.com/wp-content/uploads/2019/01/DyFtPpCVAAAmQKY-1024x576.jpg" alt="" data-id="5708" data-link="https://s1n7ese.com/?attachment_id=5708" class="wp-image-5708" sizes="(max-width: 1024px) 100vw, 1024px" data-pin-no-hover="true">
            </a>
        </figure>
    </li>
</ul>

my JS:

popupcontainer: null,
container: null,
init: function ($container) {
  var base = this;
  if ($container === undefined) {
    base.container = $('body');
  } else {
    base.container = $container;
  }

  this.popupcontainer = $('.pswp').get(0);

  if (jnewsoption.popup_script === "photoswipe") {
    this.popup_photoswipe();
  } else if (jnewsoption.popup_script === "magnific") {
    this.popup_magnific();
  }
}

// Gallery with link
$(base.container)
.find("li.blocks-gallery-item figure")
.find("a[href$='.gif'], a[href$='.jpg'], a[href$='.jpeg'], a[href$='.png'], a[href$='.bmp']")
.bind('click', function (e) {
    e.preventDefault();
    base.expand_wp_gallery(this);
  }
);

expand_wp_gallery: function (element) {
  var parent = $(element).parents('.wp-block-gallery');
  var figure = $(element).parents('figure');
  var index = $(figure).index('figure');

  var base = this;
  var items = [];

  // populate item
  $(parent).find('a').each(function (i) {
    var link = this;
    var image = $(link).find('img');
    var caption = $(link).parents('figure').find('figcaption').text();

    // Get Image Height and Width
    var img = new Image();
    img.onload = function () {
      items[i] = {
        src: image.attr('src'),
        w: parseInt(this.width, 10),
        h: parseInt(this.height, 10),
        title: caption
      };
    };
    img.src = image.attr('src');
  });

  console.log(items, index)
  var options = {
    index: index,
    showAnimationDuration: 0,
    hideAnimationDuration: 0,
    barsSize: {top: 44, bottom: 0}
  };
  var photoswipe = new PhotoSwipe(base.popupcontainer, PhotoSwipeUI_Default, items, options);
  photoswipe.init();
}

Most helpful comment

I met this problem too, but I found out I pass an empty array to the item param, so maybe you can try again,

All 4 comments

@slowaways Did you resolve this?

@0FilipK No. I gave up.

@slowaways oh, ok. I find a sneaky way - just use closeOnScroll: false in options and it will prevent photoswipe to be closed on scroll. It changes behavior but in my case it doesn't matter.

I met this problem too, but I found out I pass an empty array to the item param, so maybe you can try again,

Was this page helpful?
0 / 5 - 0 ratings

Related issues

skyghis picture skyghis  路  5Comments

WebCustoms picture WebCustoms  路  3Comments

jamminjames picture jamminjames  路  3Comments

chilluk7 picture chilluk7  路  3Comments

caztcha picture caztcha  路  5Comments