Uncaught TypeError: $frames.filter(...).sort is not a function

[BackuPs]

I am testing jquery 4.0.0 beta 2 i get a error ( Uncaught TypeError: $frames.filter(...).sort is not a function) because the .sort() is removed from jquery. The slider stops working.

Any idea how to fix this?

`
function frameAppend ($frames, $shaft, type) {
if (!frameAppend[type]) {

  var thumbsFLAG = type === 'nav' && o_navThumbs,
      left = 0;

  $shaft.append(
    $frames
        .filter(function () {
          var actual,
              $this = $(this),
              frameData = $this.data();
          for (var _i = 0, _l = data.length; _i < _l; _i++) {
            if (frameData.data === data[_i]) {
              actual = true;
              frameData.eq = _i;
              break;
            }
          }
          return actual || $this.remove() && false;
        })
        .sort(function (a, b) {
          return $(a).data().eq - $(b).data().eq;
        })
        .each(function () {

          if (!thumbsFLAG) return;

          var $this = $(this),
              frameData = $this.data(),
              thumbwidth = Math.round(o_thumbSide2 * frameData.data.thumbratio) || o_thumbSide;

          frameData.l = left;
          frameData.w = thumbwidth;

          $this.css({width: thumbwidth});

          left += thumbwidth + opts.thumbmargin;
        })
  );

  frameAppend[type] = true;
}

}`

[BackuPs]

You need to rewrite the function to this

`

	  function frameAppend ($frames, $shaft, type) {
		if (!frameAppend[type]) {

			var thumbsFLAG = type === 'nav' && o_navThumbs,
			  left = 0;

			$frames.filter(function () {
				  var actual,
					  $this = $(this),
					  frameData = $this.data();
				  for (var _i = 0, _l = data.length; _i < _l; _i++) {
					if (frameData.data === data[_i]) {
					  actual = true;
					  frameData.eq = _i;
					  break;
					}
				  }
				  return actual || $this.remove() && false;
			});
			[].sort.call( $frames, function (a, b) {
				  return $(a).data().eq - $(b).data().eq;
			});

			$shaft.append(
				$frames
					.each(function () {

					  if (!thumbsFLAG) return;

					  var $this = $(this),
						  frameData = $this.data(),
						  thumbwidth = Math.round(o_thumbSide2 * frameData.data.thumbratio) || o_thumbSide;

					  frameData.l = left;
					  frameData.w = thumbwidth;

					  $this.css({width: thumbwidth});

					  left += thumbwidth + opts.thumbmargin;
					})
			);
			frameAppend[type] = true;
		}
	  }
	  
	  
	  `

Also change all $.now() to Date.now()

After these changes it will work with jQuery 4.0

On request i can provide the complete fotorama js file.

[BackuPs]

The full fixed fotorama.js for jquery 4.0 can be downloaded here

https://pastebin.com/k5VeBXMT

the minified versions is here

https://pastebin.com/p6wdvcq7

or grab them directly from my forked version

https://github.com/BackuPs/fotorama/tree/master/src/js

the files are called fotorama.dev.js & fotorama.dev.min.js