@pixi/mesh-extras - npm Package Compare versions

Comparing version 5.1.5 to 5.2.0

dist/mesh-extras.js

 /*!
- * @pixi/mesh-extras - v5.1.5
- * Compiled Tue, 24 Sep 2019 04:07:05 UTC
+ * @pixi/mesh-extras - v5.2.0
+ * Compiled Wed, 06 Nov 2019 02:32:43 UTC
  *
@@ -9,3 +9,3 @@ * @pixi/mesh-extras is licensed under the MIT License.
 this.PIXI = this.PIXI || {};
-var _pixi_mesh_extras = (function (exports, mesh, core) {
+var _pixi_mesh_extras = (function (exports, mesh, constants, core) {
     'use strict';
@@ -107,5 +107,6 @@
     var RopeGeometry = /*@__PURE__*/(function (MeshGeometry) {
-        function RopeGeometry(width, points)
+        function RopeGeometry(width, points, textureScale)
         {
             if ( width === void 0 ) width = 200;
+            if ( textureScale === void 0 ) textureScale = 0;
 
@@ -129,2 +130,9 @@ MeshGeometry.call(this, new Float32Array(points.length * 4),
 
+            /**
+             * Rope texture scale, if zero then the rope texture is stretched.
+             * @member {number}
+             * @readOnly
+             */
+            this.textureScale = textureScale;
+
             this.build();
@@ -172,5 +180,5 @@ }
 
-            // indices[0] = 0;
-            // indices[1] = 1;
-
+            var amount = 0;
+            var prev = points[0];
+            var textureWidth = this.width * this.textureScale;
             var total = points.length; // - 1;
@@ -182,4 +190,19 @@
                 var index = i * 4;
-                var amount = i / (total - 1);
 
+                if (this.textureScale > 0)
+                {
+                    // calculate pixel distance from previous point
+                    var dx = prev.x - points[i].x;
+                    var dy = prev.y - points[i].y;
+                    var distance = Math.sqrt((dx * dx) + (dy * dy));
+
+                    prev = points[i];
+                    amount += distance / textureWidth;
+                }
+                else
+                {
+                    // stretch texture
+                    amount = i / (total - 1);
+                }
+
                 uvs[index] = amount;
@@ -231,4 +254,2 @@ uvs[index + 1] = 0;
 
-            // this.count -= 0.2;
-
             var vertices = this.buffers[0].data;
@@ -262,3 +283,3 @@ var total = points.length;
                 var perpLength = Math.sqrt((perpX * perpX) + (perpY * perpY));
-                var num = this.width / 2; // (20 + Math.abs(Math.sin((i + this.count) * 0.3) * 50) )* ratio;
+                var num = this.textureScale > 0 ? this.textureScale * this.width / 2 : this.width / 2;
 
@@ -284,3 +305,10 @@ perpX /= perpLength;
         {
-            this.updateVertices();
+            if (this.textureScale > 0)
+            {
+                this.build(); // we need to update UVs
+            }
+            else
+            {
+                this.updateVertices();
+            }
         };
@@ -307,7 +335,14 @@
     var SimpleRope = /*@__PURE__*/(function (Mesh) {
-        function SimpleRope(texture, points)
+        function SimpleRope(texture, points, textureScale)
         {
-            var ropeGeometry = new RopeGeometry(texture.height, points);
+            if ( textureScale === void 0 ) textureScale = 0;
+
+            var ropeGeometry = new RopeGeometry(texture.height, points, textureScale);
             var meshMaterial = new mesh.MeshMaterial(texture);
 
+            if (textureScale > 0)
+            {
+                // attempt to set UV wrapping, will fail on non-power of two textures
+                texture.baseTexture.wrapMode = constants.WRAP_MODES.REPEAT;
+            }
             Mesh.call(this, ropeGeometry, meshMaterial);
@@ -784,4 +819,4 @@
 
-}({}, PIXI, PIXI));
+}({}, PIXI, PIXI, PIXI));
 Object.assign(this.PIXI, _pixi_mesh_extras);
 //# sourceMappingURL=mesh-extras.js.map

dist/mesh-extras.min.js

 /*!
- * @pixi/mesh-extras - v5.1.5
- * Compiled Tue, 24 Sep 2019 04:07:05 UTC
+ * @pixi/mesh-extras - v5.2.0
+ * Compiled Wed, 06 Nov 2019 02:32:43 UTC
  *
@@ -8,3 +8,3 @@ * @pixi/mesh-extras is licensed under the MIT License.
  */
-this.PIXI=this.PIXI||{};var _pixi_mesh_extras=function(t,e,i){"use strict";var r=function(t){function e(e,i,r,h){void 0===e&&(e=100),void 0===i&&(i=100),void 0===r&&(r=10),void 0===h&&(h=10),t.call(this),this.segWidth=r,this.segHeight=h,this.width=e,this.height=i,this.build()}return t&&(e.__proto__=t),e.prototype=Object.create(t&&t.prototype),e.prototype.constructor=e,e.prototype.build=function(){for(var t=this.segWidth*this.segHeight,e=[],i=[],r=[],h=this.segWidth-1,o=this.segHeight-1,s=this.width/h,n=this.height/o,a=0;a<t;a++){var u=a%this.segWidth,d=a/this.segWidth|0;e.push(u*s,d*n),i.push(u/h,d/o)}for(var p=h*o,g=0;g<p;g++){var f=g%h,c=g/h|0,_=c*this.segWidth+f,l=c*this.segWidth+f+1,y=(c+1)*this.segWidth+f,v=(c+1)*this.segWidth+f+1;r.push(_,l,y,l,v,y)}this.buffers[0].data=new Float32Array(e),this.buffers[1].data=new Float32Array(i),this.indexBuffer.data=new Uint16Array(r),this.buffers[0].update(),this.buffers[1].update(),this.indexBuffer.update()},e}(e.MeshGeometry),h=function(t){function e(e,i){void 0===e&&(e=200),t.call(this,new Float32Array(4*i.length),new Float32Array(4*i.length),new Uint16Array(6*(i.length-1))),this.points=i,this.width=e,this.build()}return t&&(e.__proto__=t),e.prototype=Object.create(t&&t.prototype),e.prototype.constructor=e,e.prototype.build=function(){var t=this.points;if(t){var e=this.getBuffer("aVertexPosition"),i=this.getBuffer("aTextureCoord"),r=this.getIndex();if(!(t.length<1)){e.data.length/4!==t.length&&(e.data=new Float32Array(4*t.length),i.data=new Float32Array(4*t.length),r.data=new Uint16Array(6*(t.length-1)));var h=i.data,o=r.data;h[0]=0,h[1]=0,h[2]=0,h[3]=1;for(var s=t.length,n=0;n<s;n++){var a=4*n,u=n/(s-1);h[a]=u,h[a+1]=0,h[a+2]=u,h[a+3]=1}for(var d=0,p=0;p<s-1;p++){var g=2*p;o[d++]=g,o[d++]=g+1,o[d++]=g+2,o[d++]=g+2,o[d++]=g+1,o[d++]=g+3}i.update(),r.update(),this.updateVertices()}}},e.prototype.updateVertices=function(){var t=this.points;if(!(t.length<1)){for(var e,i=t[0],r=0,h=0,o=this.buffers[0].data,s=t.length,n=0;n<s;n++){var a=t[n],u=4*n;h=-((e=n<t.length-1?t[n+1]:a).x-i.x),r=e.y-i.y;var d=10*(1-n/(s-1));d>1&&(d=1);var p=Math.sqrt(r*r+h*h),g=this.width/2;r/=p,h/=p,r*=g,h*=g,o[u]=a.x+r,o[u+1]=a.y+h,o[u+2]=a.x-r,o[u+3]=a.y-h,i=a}this.buffers[0].update()}},e.prototype.update=function(){this.updateVertices()},e}(e.MeshGeometry),o=function(t){function i(i,r){var o=new h(i.height,r),s=new e.MeshMaterial(i);t.call(this,o,s),this.autoUpdate=!0}return t&&(i.__proto__=t),i.prototype=Object.create(t&&t.prototype),i.prototype.constructor=i,i.prototype._render=function(e){(this.autoUpdate||this.geometry.width!==this.shader.texture.height)&&(this.geometry.width=this.shader.texture.height,this.geometry.update()),t.prototype._render.call(this,e)},i}(e.Mesh),s=function(t){function h(h,o,s){var n=new r(h.width,h.height,o,s),a=new e.MeshMaterial(i.Texture.WHITE);t.call(this,n,a),this.texture=h}t&&(h.__proto__=t),h.prototype=Object.create(t&&t.prototype),h.prototype.constructor=h;var o={texture:{configurable:!0}};return h.prototype.textureUpdated=function(){this._textureID=this.shader.texture._updateID,this.geometry.width=this.shader.texture.width,this.geometry.height=this.shader.texture.height,this.geometry.build()},o.texture.set=function(t){this.shader.texture!==t&&(this.shader.texture=t,this._textureID=-1,t.baseTexture.valid?this.textureUpdated():t.once("update",this.textureUpdated,this))},o.texture.get=function(){return this.shader.texture},h.prototype._render=function(e){this._textureID!==this.shader.texture._updateID&&this.textureUpdated(),t.prototype._render.call(this,e)},Object.defineProperties(h.prototype,o),h}(e.Mesh),n=function(t){function r(r,h,o,s,n){void 0===r&&(r=i.Texture.EMPTY);var a=new e.MeshGeometry(h,o,s);a.getBuffer("aVertexPosition").static=!1;var u=new e.MeshMaterial(r);t.call(this,a,u,null,n),this.autoUpdate=!0}t&&(r.__proto__=t),r.prototype=Object.create(t&&t.prototype),r.prototype.constructor=r;var h={vertices:{configurable:!0}};return h.vertices.get=function(){return this.geometry.getBuffer("aVertexPosition").data},h.vertices.set=function(t){this.geometry.getBuffer("aVertexPosition").data=t},r.prototype._render=function(e){this.autoUpdate&&this.geometry.getBuffer("aVertexPosition").update(),t.prototype._render.call(this,e)},Object.defineProperties(r.prototype,h),r}(e.Mesh),a=10,u=function(t){function e(e,r,h,o,s){t.call(this,i.Texture.WHITE,4,4),this._origWidth=e.orig.width,this._origHeight=e.orig.height,this._width=this._origWidth,this._height=this._origHeight,this._leftWidth=void 0!==r?r:a,this._rightWidth=void 0!==o?o:a,this._topHeight=void 0!==h?h:a,this._bottomHeight=void 0!==s?s:a,this.texture=e}t&&(e.__proto__=t),e.prototype=Object.create(t&&t.prototype),e.prototype.constructor=e;var r={vertices:{configurable:!0},width:{configurable:!0},height:{configurable:!0},leftWidth:{configurable:!0},rightWidth:{configurable:!0},topHeight:{configurable:!0},bottomHeight:{configurable:!0}};return e.prototype.textureUpdated=function(){this._textureID=this.shader.texture._updateID,this._refresh()},r.vertices.get=function(){return this.geometry.getBuffer("aVertexPosition").data},r.vertices.set=function(t){this.geometry.getBuffer("aVertexPosition").data=t},e.prototype.updateHorizontalVertices=function(){var t=this.vertices,e=this._topHeight+this._bottomHeight,i=this._height>e?1:this._height/e;t[9]=t[11]=t[13]=t[15]=this._topHeight*i,t[17]=t[19]=t[21]=t[23]=this._height-this._bottomHeight*i,t[25]=t[27]=t[29]=t[31]=this._height},e.prototype.updateVerticalVertices=function(){var t=this.vertices,e=this._leftWidth+this._rightWidth,i=this._width>e?1:this._width/e;t[2]=t[10]=t[18]=t[26]=this._leftWidth*i,t[4]=t[12]=t[20]=t[28]=this._width-this._rightWidth*i,t[6]=t[14]=t[22]=t[30]=this._width},r.width.get=function(){return this._width},r.width.set=function(t){this._width=t,this._refresh()},r.height.get=function(){return this._height},r.height.set=function(t){this._height=t,this._refresh()},r.leftWidth.get=function(){return this._leftWidth},r.leftWidth.set=function(t){this._leftWidth=t,this._refresh()},r.rightWidth.get=function(){return this._rightWidth},r.rightWidth.set=function(t){this._rightWidth=t,this._refresh()},r.topHeight.get=function(){return this._topHeight},r.topHeight.set=function(t){this._topHeight=t,this._refresh()},r.bottomHeight.get=function(){return this._bottomHeight},r.bottomHeight.set=function(t){this._bottomHeight=t,this._refresh()},e.prototype._refresh=function(){var t=this.texture,e=this.geometry.buffers[1].data;this._origWidth=t.orig.width,this._origHeight=t.orig.height;var i=1/this._origWidth,r=1/this._origHeight;e[0]=e[8]=e[16]=e[24]=0,e[1]=e[3]=e[5]=e[7]=0,e[6]=e[14]=e[22]=e[30]=1,e[25]=e[27]=e[29]=e[31]=1,e[2]=e[10]=e[18]=e[26]=i*this._leftWidth,e[4]=e[12]=e[20]=e[28]=1-i*this._rightWidth,e[9]=e[11]=e[13]=e[15]=r*this._topHeight,e[17]=e[19]=e[21]=e[23]=1-r*this._bottomHeight,this.updateHorizontalVertices(),this.updateVerticalVertices(),this.geometry.buffers[0].update(),this.geometry.buffers[1].update()},Object.defineProperties(e.prototype,r),e}(s);return t.NineSlicePlane=u,t.PlaneGeometry=r,t.RopeGeometry=h,t.SimpleMesh=n,t.SimplePlane=s,t.SimpleRope=o,t}({},PIXI,PIXI);Object.assign(this.PIXI,_pixi_mesh_extras);
+this.PIXI=this.PIXI||{};var _pixi_mesh_extras=function(t,e,i,r){"use strict";var h=function(t){function e(e,i,r,h){void 0===e&&(e=100),void 0===i&&(i=100),void 0===r&&(r=10),void 0===h&&(h=10),t.call(this),this.segWidth=r,this.segHeight=h,this.width=e,this.height=i,this.build()}return t&&(e.__proto__=t),e.prototype=Object.create(t&&t.prototype),e.prototype.constructor=e,e.prototype.build=function(){for(var t=this.segWidth*this.segHeight,e=[],i=[],r=[],h=this.segWidth-1,o=this.segHeight-1,s=this.width/h,a=this.height/o,n=0;n<t;n++){var u=n%this.segWidth,d=n/this.segWidth|0;e.push(u*s,d*a),i.push(u/h,d/o)}for(var p=h*o,g=0;g<p;g++){var f=g%h,c=g/h|0,_=c*this.segWidth+f,l=c*this.segWidth+f+1,y=(c+1)*this.segWidth+f,x=(c+1)*this.segWidth+f+1;r.push(_,l,y,l,x,y)}this.buffers[0].data=new Float32Array(e),this.buffers[1].data=new Float32Array(i),this.indexBuffer.data=new Uint16Array(r),this.buffers[0].update(),this.buffers[1].update(),this.indexBuffer.update()},e}(e.MeshGeometry),o=function(t){function e(e,i,r){void 0===e&&(e=200),void 0===r&&(r=0),t.call(this,new Float32Array(4*i.length),new Float32Array(4*i.length),new Uint16Array(6*(i.length-1))),this.points=i,this.width=e,this.textureScale=r,this.build()}return t&&(e.__proto__=t),e.prototype=Object.create(t&&t.prototype),e.prototype.constructor=e,e.prototype.build=function(){var t=this.points;if(t){var e=this.getBuffer("aVertexPosition"),i=this.getBuffer("aTextureCoord"),r=this.getIndex();if(!(t.length<1)){e.data.length/4!==t.length&&(e.data=new Float32Array(4*t.length),i.data=new Float32Array(4*t.length),r.data=new Uint16Array(6*(t.length-1)));var h=i.data,o=r.data;h[0]=0,h[1]=0,h[2]=0,h[3]=1;for(var s=0,a=t[0],n=this.width*this.textureScale,u=t.length,d=0;d<u;d++){var p=4*d;if(this.textureScale>0){var g=a.x-t[d].x,f=a.y-t[d].y,c=Math.sqrt(g*g+f*f);a=t[d],s+=c/n}else s=d/(u-1);h[p]=s,h[p+1]=0,h[p+2]=s,h[p+3]=1}for(var _=0,l=0;l<u-1;l++){var y=2*l;o[_++]=y,o[_++]=y+1,o[_++]=y+2,o[_++]=y+2,o[_++]=y+1,o[_++]=y+3}i.update(),r.update(),this.updateVertices()}}},e.prototype.updateVertices=function(){var t=this.points;if(!(t.length<1)){for(var e,i=t[0],r=0,h=0,o=this.buffers[0].data,s=t.length,a=0;a<s;a++){var n=t[a],u=4*a;h=-((e=a<t.length-1?t[a+1]:n).x-i.x),r=e.y-i.y;var d=10*(1-a/(s-1));d>1&&(d=1);var p=Math.sqrt(r*r+h*h),g=this.textureScale>0?this.textureScale*this.width/2:this.width/2;r/=p,h/=p,r*=g,h*=g,o[u]=n.x+r,o[u+1]=n.y+h,o[u+2]=n.x-r,o[u+3]=n.y-h,i=n}this.buffers[0].update()}},e.prototype.update=function(){this.textureScale>0?this.build():this.updateVertices()},e}(e.MeshGeometry),s=function(t){function r(r,h,s){void 0===s&&(s=0);var a=new o(r.height,h,s),n=new e.MeshMaterial(r);s>0&&(r.baseTexture.wrapMode=i.WRAP_MODES.REPEAT),t.call(this,a,n),this.autoUpdate=!0}return t&&(r.__proto__=t),r.prototype=Object.create(t&&t.prototype),r.prototype.constructor=r,r.prototype._render=function(e){(this.autoUpdate||this.geometry.width!==this.shader.texture.height)&&(this.geometry.width=this.shader.texture.height,this.geometry.update()),t.prototype._render.call(this,e)},r}(e.Mesh),a=function(t){function i(i,o,s){var a=new h(i.width,i.height,o,s),n=new e.MeshMaterial(r.Texture.WHITE);t.call(this,a,n),this.texture=i}t&&(i.__proto__=t),i.prototype=Object.create(t&&t.prototype),i.prototype.constructor=i;var o={texture:{configurable:!0}};return i.prototype.textureUpdated=function(){this._textureID=this.shader.texture._updateID,this.geometry.width=this.shader.texture.width,this.geometry.height=this.shader.texture.height,this.geometry.build()},o.texture.set=function(t){this.shader.texture!==t&&(this.shader.texture=t,this._textureID=-1,t.baseTexture.valid?this.textureUpdated():t.once("update",this.textureUpdated,this))},o.texture.get=function(){return this.shader.texture},i.prototype._render=function(e){this._textureID!==this.shader.texture._updateID&&this.textureUpdated(),t.prototype._render.call(this,e)},Object.defineProperties(i.prototype,o),i}(e.Mesh),n=function(t){function i(i,h,o,s,a){void 0===i&&(i=r.Texture.EMPTY);var n=new e.MeshGeometry(h,o,s);n.getBuffer("aVertexPosition").static=!1;var u=new e.MeshMaterial(i);t.call(this,n,u,null,a),this.autoUpdate=!0}t&&(i.__proto__=t),i.prototype=Object.create(t&&t.prototype),i.prototype.constructor=i;var h={vertices:{configurable:!0}};return h.vertices.get=function(){return this.geometry.getBuffer("aVertexPosition").data},h.vertices.set=function(t){this.geometry.getBuffer("aVertexPosition").data=t},i.prototype._render=function(e){this.autoUpdate&&this.geometry.getBuffer("aVertexPosition").update(),t.prototype._render.call(this,e)},Object.defineProperties(i.prototype,h),i}(e.Mesh),u=10,d=function(t){function e(e,i,h,o,s){t.call(this,r.Texture.WHITE,4,4),this._origWidth=e.orig.width,this._origHeight=e.orig.height,this._width=this._origWidth,this._height=this._origHeight,this._leftWidth=void 0!==i?i:u,this._rightWidth=void 0!==o?o:u,this._topHeight=void 0!==h?h:u,this._bottomHeight=void 0!==s?s:u,this.texture=e}t&&(e.__proto__=t),e.prototype=Object.create(t&&t.prototype),e.prototype.constructor=e;var i={vertices:{configurable:!0},width:{configurable:!0},height:{configurable:!0},leftWidth:{configurable:!0},rightWidth:{configurable:!0},topHeight:{configurable:!0},bottomHeight:{configurable:!0}};return e.prototype.textureUpdated=function(){this._textureID=this.shader.texture._updateID,this._refresh()},i.vertices.get=function(){return this.geometry.getBuffer("aVertexPosition").data},i.vertices.set=function(t){this.geometry.getBuffer("aVertexPosition").data=t},e.prototype.updateHorizontalVertices=function(){var t=this.vertices,e=this._topHeight+this._bottomHeight,i=this._height>e?1:this._height/e;t[9]=t[11]=t[13]=t[15]=this._topHeight*i,t[17]=t[19]=t[21]=t[23]=this._height-this._bottomHeight*i,t[25]=t[27]=t[29]=t[31]=this._height},e.prototype.updateVerticalVertices=function(){var t=this.vertices,e=this._leftWidth+this._rightWidth,i=this._width>e?1:this._width/e;t[2]=t[10]=t[18]=t[26]=this._leftWidth*i,t[4]=t[12]=t[20]=t[28]=this._width-this._rightWidth*i,t[6]=t[14]=t[22]=t[30]=this._width},i.width.get=function(){return this._width},i.width.set=function(t){this._width=t,this._refresh()},i.height.get=function(){return this._height},i.height.set=function(t){this._height=t,this._refresh()},i.leftWidth.get=function(){return this._leftWidth},i.leftWidth.set=function(t){this._leftWidth=t,this._refresh()},i.rightWidth.get=function(){return this._rightWidth},i.rightWidth.set=function(t){this._rightWidth=t,this._refresh()},i.topHeight.get=function(){return this._topHeight},i.topHeight.set=function(t){this._topHeight=t,this._refresh()},i.bottomHeight.get=function(){return this._bottomHeight},i.bottomHeight.set=function(t){this._bottomHeight=t,this._refresh()},e.prototype._refresh=function(){var t=this.texture,e=this.geometry.buffers[1].data;this._origWidth=t.orig.width,this._origHeight=t.orig.height;var i=1/this._origWidth,r=1/this._origHeight;e[0]=e[8]=e[16]=e[24]=0,e[1]=e[3]=e[5]=e[7]=0,e[6]=e[14]=e[22]=e[30]=1,e[25]=e[27]=e[29]=e[31]=1,e[2]=e[10]=e[18]=e[26]=i*this._leftWidth,e[4]=e[12]=e[20]=e[28]=1-i*this._rightWidth,e[9]=e[11]=e[13]=e[15]=r*this._topHeight,e[17]=e[19]=e[21]=e[23]=1-r*this._bottomHeight,this.updateHorizontalVertices(),this.updateVerticalVertices(),this.geometry.buffers[0].update(),this.geometry.buffers[1].update()},Object.defineProperties(e.prototype,i),e}(a);return t.NineSlicePlane=d,t.PlaneGeometry=h,t.RopeGeometry=o,t.SimpleMesh=n,t.SimplePlane=a,t.SimpleRope=s,t}({},PIXI,PIXI,PIXI);Object.assign(this.PIXI,_pixi_mesh_extras);
 //# sourceMappingURL=mesh-extras.min.js.map

lib/mesh-extras.es.js

 /*!
- * @pixi/mesh-extras - v5.1.5
- * Compiled Tue, 24 Sep 2019 04:07:05 UTC
+ * @pixi/mesh-extras - v5.2.0
+ * Compiled Wed, 06 Nov 2019 02:32:43 UTC
  *
@@ -9,2 +9,3 @@ * @pixi/mesh-extras is licensed under the MIT License.
 import { MeshGeometry, Mesh, MeshMaterial } from '@pixi/mesh';
+import { WRAP_MODES } from '@pixi/constants';
 import { Texture } from '@pixi/core';
@@ -106,5 +107,6 @@
 var RopeGeometry = /*@__PURE__*/(function (MeshGeometry) {
-    function RopeGeometry(width, points)
+    function RopeGeometry(width, points, textureScale)
     {
         if ( width === void 0 ) width = 200;
+        if ( textureScale === void 0 ) textureScale = 0;
 
@@ -128,2 +130,9 @@ MeshGeometry.call(this, new Float32Array(points.length * 4),
 
+        /**
+         * Rope texture scale, if zero then the rope texture is stretched.
+         * @member {number}
+         * @readOnly
+         */
+        this.textureScale = textureScale;
+
         this.build();
@@ -171,5 +180,5 @@ }
 
-        // indices[0] = 0;
-        // indices[1] = 1;
-
+        var amount = 0;
+        var prev = points[0];
+        var textureWidth = this.width * this.textureScale;
         var total = points.length; // - 1;
@@ -181,4 +190,19 @@
             var index = i * 4;
-            var amount = i / (total - 1);
 
+            if (this.textureScale > 0)
+            {
+                // calculate pixel distance from previous point
+                var dx = prev.x - points[i].x;
+                var dy = prev.y - points[i].y;
+                var distance = Math.sqrt((dx * dx) + (dy * dy));
+
+                prev = points[i];
+                amount += distance / textureWidth;
+            }
+            else
+            {
+                // stretch texture
+                amount = i / (total - 1);
+            }
+
             uvs[index] = amount;
@@ -230,4 +254,2 @@ uvs[index + 1] = 0;
 
-        // this.count -= 0.2;
-
         var vertices = this.buffers[0].data;
@@ -254,3 +276,3 @@ var total = points.length;
             var perpLength = Math.sqrt((perpX * perpX) + (perpY * perpY));
-            var num = this.width / 2; // (20 + Math.abs(Math.sin((i + this.count) * 0.3) * 50) )* ratio;
+            var num = this.textureScale > 0 ? this.textureScale * this.width / 2 : this.width / 2;
 
@@ -276,3 +298,10 @@ perpX /= perpLength;
     {
-        this.updateVertices();
+        if (this.textureScale > 0)
+        {
+            this.build(); // we need to update UVs
+        }
+        else
+        {
+            this.updateVertices();
+        }
     };
@@ -299,7 +328,14 @@
 var SimpleRope = /*@__PURE__*/(function (Mesh) {
-    function SimpleRope(texture, points)
+    function SimpleRope(texture, points, textureScale)
     {
-        var ropeGeometry = new RopeGeometry(texture.height, points);
+        if ( textureScale === void 0 ) textureScale = 0;
+
+        var ropeGeometry = new RopeGeometry(texture.height, points, textureScale);
         var meshMaterial = new MeshMaterial(texture);
 
+        if (textureScale > 0)
+        {
+            // attempt to set UV wrapping, will fail on non-power of two textures
+            texture.baseTexture.wrapMode = WRAP_MODES.REPEAT;
+        }
         Mesh.call(this, ropeGeometry, meshMaterial);
@@ -306,0 +342,0 @@

lib/mesh-extras.js

 /*!
- * @pixi/mesh-extras - v5.1.5
- * Compiled Tue, 24 Sep 2019 04:07:05 UTC
+ * @pixi/mesh-extras - v5.2.0
+ * Compiled Wed, 06 Nov 2019 02:32:43 UTC
  *
@@ -13,2 +13,3 @@ * @pixi/mesh-extras is licensed under the MIT License.
 var mesh = require('@pixi/mesh');
+var constants = require('@pixi/constants');
 var core = require('@pixi/core');
@@ -110,5 +111,6 @@
 var RopeGeometry = /*@__PURE__*/(function (MeshGeometry) {
-    function RopeGeometry(width, points)
+    function RopeGeometry(width, points, textureScale)
     {
         if ( width === void 0 ) width = 200;
+        if ( textureScale === void 0 ) textureScale = 0;
 
@@ -132,2 +134,9 @@ MeshGeometry.call(this, new Float32Array(points.length * 4),
 
+        /**
+         * Rope texture scale, if zero then the rope texture is stretched.
+         * @member {number}
+         * @readOnly
+         */
+        this.textureScale = textureScale;
+
         this.build();
@@ -175,5 +184,5 @@ }
 
-        // indices[0] = 0;
-        // indices[1] = 1;
-
+        var amount = 0;
+        var prev = points[0];
+        var textureWidth = this.width * this.textureScale;
         var total = points.length; // - 1;
@@ -185,4 +194,19 @@
             var index = i * 4;
-            var amount = i / (total - 1);
 
+            if (this.textureScale > 0)
+            {
+                // calculate pixel distance from previous point
+                var dx = prev.x - points[i].x;
+                var dy = prev.y - points[i].y;
+                var distance = Math.sqrt((dx * dx) + (dy * dy));
+
+                prev = points[i];
+                amount += distance / textureWidth;
+            }
+            else
+            {
+                // stretch texture
+                amount = i / (total - 1);
+            }
+
             uvs[index] = amount;
@@ -234,4 +258,2 @@ uvs[index + 1] = 0;
 
-        // this.count -= 0.2;
-
         var vertices = this.buffers[0].data;
@@ -258,3 +280,3 @@ var total = points.length;
             var perpLength = Math.sqrt((perpX * perpX) + (perpY * perpY));
-            var num = this.width / 2; // (20 + Math.abs(Math.sin((i + this.count) * 0.3) * 50) )* ratio;
+            var num = this.textureScale > 0 ? this.textureScale * this.width / 2 : this.width / 2;
 
@@ -280,3 +302,10 @@ perpX /= perpLength;
     {
-        this.updateVertices();
+        if (this.textureScale > 0)
+        {
+            this.build(); // we need to update UVs
+        }
+        else
+        {
+            this.updateVertices();
+        }
     };
@@ -303,7 +332,14 @@
 var SimpleRope = /*@__PURE__*/(function (Mesh) {
-    function SimpleRope(texture, points)
+    function SimpleRope(texture, points, textureScale)
     {
-        var ropeGeometry = new RopeGeometry(texture.height, points);
+        if ( textureScale === void 0 ) textureScale = 0;
+
+        var ropeGeometry = new RopeGeometry(texture.height, points, textureScale);
         var meshMaterial = new mesh.MeshMaterial(texture);
 
+        if (textureScale > 0)
+        {
+            // attempt to set UV wrapping, will fail on non-power of two textures
+            texture.baseTexture.wrapMode = constants.WRAP_MODES.REPEAT;
+        }
         Mesh.call(this, ropeGeometry, meshMaterial);
@@ -310,0 +346,0 @@

package.json

 {
   "name": "@pixi/mesh-extras",
-  "version": "5.1.5",
+  "version": "5.2.0",
   "main": "lib/mesh-extras.js",
@@ -27,12 +27,12 @@ "module": "lib/mesh-extras.es.js",
   "dependencies": {
-    "@pixi/constants": "^5.1.0",
-    "@pixi/core": "^5.1.5",
-    "@pixi/math": "^5.1.0",
-    "@pixi/mesh": "^5.1.5",
-    "@pixi/utils": "^5.1.3"
+    "@pixi/constants": "^5.2.0",
+    "@pixi/core": "^5.2.0",
+    "@pixi/math": "^5.2.0",
+    "@pixi/mesh": "^5.2.0",
+    "@pixi/utils": "^5.2.0"
   },
   "devDependencies": {
-    "@pixi/loaders": "^5.1.5"
+    "@pixi/loaders": "^5.2.0"
   },
-  "gitHead": "8cf3db88d06355cbabea64150cdb0774191e502c"
+  "gitHead": "aaf96b460582b83a1fa73037ef2dd69dd9e84415"
 }

No alert changes

Improved metrics

Total package byte prevSize

225256

increased by7.28%

Lines of code

2020

increased by5.37%

Dependency changes

• Updated@pixi/constants@^5.2.0

• Updated@pixi/core@^5.2.0

• Updated@pixi/math@^5.2.0

• Updated@pixi/mesh@^5.2.0

• Updated@pixi/utils@^5.2.0