zimjs 17.0.0 → 17.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/src/zim.js CHANGED
@@ -1698,7 +1698,7 @@ RETURNS any value returned from the loop - or true if no value is returned from
1698
1698
  }
1699
1699
  length = type=="number"?obj:obj.length;
1700
1700
  total = getTotal(length-1);
1701
- if (total == 0) return;
1701
+ if (total == 0) return true;
1702
1702
  if (reverse) {
1703
1703
  if (interval === 0) {
1704
1704
  for(i=start; i>=end; i-=step) {
@@ -1785,7 +1785,7 @@ RETURNS any value returned from the loop - or true if no value is returned from
1785
1785
  props.push(i);
1786
1786
  }
1787
1787
  total = getTotal(length-1);
1788
- if (total == 0) return;
1788
+ if (total == 0) return true;
1789
1789
  if (reverse) {
1790
1790
  if (interval === 0) {
1791
1791
  for(i=start; i>=end; i-=step) {
@@ -5317,7 +5317,7 @@ zog(decimals(1.8345, 2)); // 1.83
5317
5317
  zog(decimals(123,-1)); // 120
5318
5318
  zog(decimals(2.3,null,2)); // 2.30
5319
5319
  zog(decimals(3,null,null,2)); // 03
5320
- zog(decimals(.12,2,2,1,null,true)); // 0:12
5320
+ zog(decimals(12/60,2,2,1,null,true)); // 0:12
5321
5321
  END EXAMPLE
5322
5322
 
5323
5323
  PARAMETERS
@@ -5327,6 +5327,7 @@ addZeros - (default 0) set to number of places to fill in zeros after decimal (a
5327
5327
  addZerosBefore - (default 1) set to number of places to fill in zeros before decimal (and return String)
5328
5328
  includeZero - (default true) set to false to always have zero just be 0 without any extra zeros
5329
5329
  time - (default false) a swap of : for . to handle minutes and seconds (not hours)
5330
+ take time in seconds and divide by 60 and pass that in for num
5330
5331
 
5331
5332
  RETURNS a rounded Number or a String if addZeros, addZerosBefore or time is true
5332
5333
  --*///+13
@@ -5617,13 +5618,13 @@ representing the rectangle around the points provided
5617
5618
  };//-13.34
5618
5619
 
5619
5620
  /*--
5620
- zim.angle = function(x1, y1, x2, y2)
5621
+ zim.angle = function(a, b, c, d)
5621
5622
 
5622
5623
  angle
5623
5624
  zim function
5624
5625
 
5625
5626
  DESCRIPTION
5626
- Calculates the angle between two points relative to the positive x axis
5627
+ Calculates the angle between two points
5627
5628
 
5628
5629
  NOTE: as of ZIM 5.5.0 the zim namespace is no longer required (unless zns is set to true before running zim)
5629
5630
 
@@ -5636,19 +5637,51 @@ const angle2 = angle(W/2, H/2, W/2-100, H/2+100); // 135
5636
5637
  const angle3 = angle(W/2, H/2, W/2+100, H/2-100); // 315
5637
5638
  END EXAMPLE
5638
5639
 
5640
+ EXAMPLE
5641
+ // make an orange orthographic pipe with a red end
5642
+ const circle1 = new Circle(20,orange).center();
5643
+ const circle2 = new Circle(20,red).loc(600,500);
5644
+ new Rectangle(20,20,orange)
5645
+ .reg(LEFT,CENTER)
5646
+ .loc(circle1)
5647
+ .bot()
5648
+ .siz(dist(circle1, circle2), circle1.width)
5649
+ .rot(angle(circle1, circle2));
5650
+ END EXAMPLE
5651
+
5639
5652
  PARAMETERS
5640
- x1, y1 - first point x and y
5641
- unless no second point in which case x1, y1 will be second point and first point will be 0, 0
5642
- x2, y2 - second point x and y
5653
+ a - first Point - any object with x and y values - eg. a zim Container or zim Point or {x:10, y:30}
5654
+ or if four parameter values, an x value of the first point
5655
+ b - second Point - any object with x and y values
5656
+ or if four parameter values, a y value of the first point - see also **
5657
+ c - (default null) an x value of a second point - if using x and y values
5658
+ d - (default null) a y value of a second point - if using x and y values
5659
+
5660
+ ** if there is only one point provided, then a first point of 0,0 is assumed
5661
+ and the the point provided becomes the second point
5643
5662
 
5644
- RETURNS a positive Number that is the angle between first and second point relative to positive x axis
5663
+ RETURNS a positive Number that is the angle between first and second point
5645
5664
  --*///+13.4
5646
- zim.angle = function(x1, y1, x2, y2) {
5665
+ zim.angle = function(a, b, c, d) {
5647
5666
  if (!zim.angleCheck) {z_d("13.4"); zim.angleCheck = true;}
5648
- if (zot(x1) || zot(y1)) return;
5649
- if (zot(x2)) {x2 = x1; x1 = 0;}
5650
- if (zot(y2)) {y2 = y1; y1 = 0;}
5651
- return (Math.atan2(y2-y1, x2-x1)*180/Math.PI+360)%360;
5667
+ if (zot(a) || zot(b)) return;
5668
+ if (!zot(a.x)) {
5669
+ if (zot(b)) {
5670
+ a = 0;
5671
+ b = 0;
5672
+ c = a.x;
5673
+ d = a.y;
5674
+ } else {
5675
+ d = b.y;
5676
+ c = b.x;
5677
+ b = a.y;
5678
+ a = a.x;
5679
+ }
5680
+ } else {
5681
+ if (zot(c)) {c = a; a = 0;}
5682
+ if (zot(d)) {d = b; b = 0;}
5683
+ }
5684
+ return (Math.atan2(d-b, c-a)*180/Math.PI+360)%360;
5652
5685
  };//-13.4
5653
5686
 
5654
5687
 
@@ -7155,7 +7188,7 @@ lastValue - setting this would go immediately to this value (would not normally
7155
7188
  };//-14
7156
7189
 
7157
7190
  /*--
7158
- zim.Proportion = function(baseMin, baseMax, targetMin, targetMax, factor, targetRound, clamp)
7191
+ zim.Proportion = function(baseMin, baseMax, targetMin, targetMax, factor, targetRound, clamp, clampMin, clampMax)
7159
7192
 
7160
7193
  Proportion
7161
7194
  zim class
@@ -7167,6 +7200,8 @@ For instance, like a slider controlling the scale of an object or sound volume.
7167
7200
  Make a Proportion object and then in an interval, ticker or event,
7168
7201
  convert the base value to the target value using the convert method.
7169
7202
 
7203
+ SEE: https://zimjs.com/test8/clamp.html
7204
+
7170
7205
  NOTE: as of ZIM 5.5.0 the zim namespace is no longer required (unless zns is set to true before running zim)
7171
7206
 
7172
7207
  EXAMPLE
@@ -7191,6 +7226,9 @@ targetMax - (default 1) max for the output scale (say volume)
7191
7226
  factor - (default 1) is going the same direction and -1 is going in opposite direction
7192
7227
  targetRound - (default false) set to true to round the converted number
7193
7228
  clamp - (default true) set to false to let results go outside min and max range
7229
+ also see clampMin and clampMax to adjust ends individually
7230
+ clampMin - (default clamp) set to true or false to let results go outside min range
7231
+ clampMax - (default clamp) set to true or false to let results go outside max range
7194
7232
 
7195
7233
  METHODS
7196
7234
  convert(input) - will return the output property (for instance, a volume)
@@ -7200,8 +7238,8 @@ just call the convert method right away if you want it to start at a different b
7200
7238
  for instance, if your slider went from 100 to 500 and you want to start at half way
7201
7239
  make the object and call p.convert(300); on the next line
7202
7240
  --*///+15
7203
- zim.Proportion = function(baseMin, baseMax, targetMin, targetMax, factor, targetRound, clamp) {
7204
- var sig = "baseMin, baseMax, targetMin, targetMax, factor, targetRound, clamp";
7241
+ zim.Proportion = function(baseMin, baseMax, targetMin, targetMax, factor, targetRound, clamp, clampMin, clampMax) {
7242
+ var sig = "baseMin, baseMax, targetMin, targetMax, factor, targetRound, clamp, clampMin, clampMax";
7205
7243
  var duo; if (duo = zob(zim.Proportion, arguments, sig, this)) return duo;
7206
7244
  z_d("15");
7207
7245
  // factor - set to 1 for increasing and -1 for decreasing
@@ -7211,6 +7249,8 @@ make the object and call p.convert(300); on the next line
7211
7249
  if (zot(factor)) factor = 1;
7212
7250
  if (zot(targetRound)) targetRound = false;
7213
7251
  if (zot(clamp)) clamp = true;
7252
+ if (zot(clampMin)) clampMin = clamp;
7253
+ if (zot(clampMax)) clampMax = clamp;
7214
7254
 
7215
7255
  // proportion
7216
7256
  var proportion;
@@ -7219,10 +7259,8 @@ make the object and call p.convert(300); on the next line
7219
7259
  this.convert = function(baseAmount) {
7220
7260
  if (zot(baseAmount)) baseAmount = baseMin; // just start at the min otherwise call immediate(baseValue);
7221
7261
  if (isNaN(baseAmount) || (baseMax-baseMin==0)) {return;}
7222
- if (clamp) {
7223
- baseAmount = Math.max(baseAmount, baseMin);
7224
- baseAmount = Math.min(baseAmount, baseMax);
7225
- }
7262
+ if (clampMin) baseAmount = Math.max(baseAmount, baseMin);
7263
+ if (clampMax) baseAmount = Math.min(baseAmount, baseMax);
7226
7264
  proportion = (baseAmount - baseMin) / (baseMax - baseMin);
7227
7265
  if (factor > 0) {
7228
7266
  targetAmount = targetMin + (targetMax-targetMin) * proportion;
@@ -7235,7 +7273,7 @@ make the object and call p.convert(300); on the next line
7235
7273
  };//-15
7236
7274
 
7237
7275
  /*--
7238
- zim.ProportionDamp = function(baseMin, baseMax, targetMin, targetMax, damp, factor, targetRound, clamp)
7276
+ zim.ProportionDamp = function(baseMin, baseMax, targetMin, targetMax, damp, factor, targetRound, clamp, clampMin, clampMax)
7239
7277
 
7240
7278
  ProportionDamp
7241
7279
  zim class
@@ -7266,6 +7304,9 @@ damp - (default .1) the damp value with 1 being no damping and 0 being no moveme
7266
7304
  factor - (default 1) is going the same direction and -1 is going in opposite direction
7267
7305
  targetRound - (default false) set to true to round the converted number
7268
7306
  clamp - (default true) set to false to let results go outside min and max range
7307
+ also see clampMin and clampMax to adjust ends individually
7308
+ clampMin - (default clamp) set to true or false to let results go outside min range
7309
+ clampMax - (default clamp) set to true or false to let results go outside max range
7269
7310
 
7270
7311
  METHODS
7271
7312
  convert(input) - converts a base value to a target value
@@ -7280,8 +7321,8 @@ NOTE: the object always starts by assuming baseMin as baseValue
7280
7321
  if you want to start or go to an immediate value without easing then
7281
7322
  call the pd.immediate(baseValue) method with your desired baseValue (not targetValue)
7282
7323
  --*///+16
7283
- zim.ProportionDamp = function(baseMin, baseMax, targetMin, targetMax, damp, factor, targetRound, clamp) {
7284
- var sig = "baseMin, baseMax, targetMin, targetMax, damp, factor, targetRound, clamp";
7324
+ zim.ProportionDamp = function(baseMin, baseMax, targetMin, targetMax, damp, factor, targetRound, clamp, clampMin, clampMax) {
7325
+ var sig = "baseMin, baseMax, targetMin, targetMax, damp, factor, targetRound, clamp, clampMin, clampMax";
7285
7326
  var duo; if (duo = zob(zim.ProportionDamp, arguments, sig, this)) return duo;
7286
7327
  z_d("16");
7287
7328
  // damp - can be changed via damp get/set method property
@@ -7294,6 +7335,8 @@ call the pd.immediate(baseValue) method with your desired baseValue (not targetV
7294
7335
  if (zot(factor)) factor = 1;
7295
7336
  if (zot(targetRound)) targetRound = false;
7296
7337
  if (zot(clamp)) clamp = true;
7338
+ if (zot(clampMin)) clampMin = clamp;
7339
+ if (zot(clampMax)) clampMax = clamp;
7297
7340
 
7298
7341
  this.damp = damp; // want to expose as a property we can change
7299
7342
  var that = this;
@@ -7317,10 +7360,8 @@ call the pd.immediate(baseValue) method with your desired baseValue (not targetV
7317
7360
  function calculate() {
7318
7361
  if (isNaN(baseAmount) || (baseMax-baseMin==0)) {return;}
7319
7362
 
7320
- if (clamp) {
7321
- baseAmount = Math.max(baseAmount, baseMin);
7322
- baseAmount = Math.min(baseAmount, baseMax);
7323
- }
7363
+ if (clampMin) baseAmount = Math.max(baseAmount, baseMin);
7364
+ if (clampMax) baseAmount = Math.min(baseAmount, baseMax);
7324
7365
 
7325
7366
  proportion = (baseAmount - baseMin) / (baseMax - baseMin);
7326
7367
  targetDifference = targetMax - targetMin;
@@ -10428,6 +10469,7 @@ width - gets or sets the width. Setting the width will scale the height to keep
10428
10469
  height - gets or sets the height. Setting the height will scale the width to keep proportion (see heightOnly below)
10429
10470
  widthOnly - gets or sets the width. This sets only the width and may change the aspect ratio of the object
10430
10471
  heightOnly - gets or sets the height. This sets only the height and may change the aspect ratio of the object
10472
+ cacheScale - get the requested scale parameter or if cached, the cache scale
10431
10473
  draggable - set to true for a default drag() and false for a noDrag()
10432
10474
  level - gets or sets the level of the object in its parent container (or the stage) - a property for parent.getChildIndex() and parent.setChildIndex()
10433
10475
  depth - for ZIM VR - the depth used to shift left and right channel and for parallax in VR - also see dep() ZIM Display method
@@ -10480,7 +10522,9 @@ zim.Bitmap = function(image, width, height, left, top, scale, style, group, inhe
10480
10522
 
10481
10523
  var that = this;
10482
10524
  this.type = "Bitmap";
10483
- if (!zot(width) && !zot(height)) this.setBounds(0,0,width,height);
10525
+ if (!zot(width) && !zot(height)) this.setBounds(0,0,width*scale,height*scale);
10526
+
10527
+ this.cacheScale = scale;
10484
10528
 
10485
10529
  this.drawImageData = function(x, y, sourceX, sourceY, sourceWidth, sourceHeight) {
10486
10530
  if (zot(x)) x = 0;
@@ -10567,6 +10611,7 @@ zim.Bitmap = function(image, width, height, left, top, scale, style, group, inhe
10567
10611
  var sig = "a,b,c,d,scale,options,rtl,willReadFrequently";
10568
10612
  var duo; if (duo = zob(that.cache, arguments, sig)) return duo;
10569
10613
  var bounds;
10614
+ that.cacheScale = scale;
10570
10615
  if (zot(c)) {
10571
10616
  if (zot(a)) {
10572
10617
  bounds = this.getBounds();
@@ -14806,7 +14851,7 @@ adjust - (default 0) pixels to bring center towards vertical base
14806
14851
  dashed - (default false) set to true for dashed border (if borderWidth or borderColor set)
14807
14852
  or set to an array of line size then space size, etc.
14808
14853
  eg. [20, 10] is 20 line and 10 space repeated and [20,100,50,10] is 20 line, 100 space, 50 line, 10 space, etc.
14809
- strokeObj - (default {caps:"butt", joints:"miter", miterLimit:10, ignoreScale:false}) set to adjust stroke properties
14854
+ strokeObj - (default {caps:"butt", joints:"miter", miterLimit:10, ignoreScale:false}) set to adjust stroke properties
14810
14855
  caps options: "butt", "round", "square" or 0,1,2
14811
14856
  joints options: "miter", "round", "bevel" or 0,1,2
14812
14857
  miterLimit is the ration at which the mitered joint will be clipped
@@ -22449,8 +22494,8 @@ type - the name of the class as a String
22449
22494
  text - get or set the text on the path
22450
22495
  path - read-only access to path - but can manipulate the path
22451
22496
  letters - access to ZIM Container of labels used for letters
22452
- for instance labels.loop(function (label) {label.color = red;});
22453
- or animate as a sequence labels.animate({props:{scale:1.5}, loop:true, rewind:true, sequence:200});
22497
+ for instance labels.loop(label=>{label.color = red;});
22498
+ or animate as a sequence labels.animate({props:{scale:1.5}, loop:true, rewind:true, sequence:.2});
22454
22499
  numLetters - how many letters - same as letters.numChildren
22455
22500
  percents - access to the array of percents for letter positioning - resize() after changing unless interactive which auto resizes
22456
22501
  color - get or set the color of the text
@@ -24109,8 +24154,10 @@ METHODS
24109
24154
  setBacking(type, newBacking) - dynamically set any type of backing for button (if null removes backing for that type)
24110
24155
  Backing types are: "backing", "rollBacking", "downBacking", "toggleBacking", "rollToggleBacking", "downToggleBacking", "waitBacking", "rollWaitBacking", "downWaitBacking"
24111
24156
  note - all backing will have a pattern property if a pattern is set as a backing
24157
+ returns object for chaining
24112
24158
  setIcon(type, newIcon) - dynamically set any type of icon for button (if null removes icon for that type)
24113
24159
  Icon types are: "icon", "rollIcon", "downIcon", "toggleIcon", "rollToggleIcon", "downToggleIcon", "waitIcon", "rollWaitIcon", "downWaitIcon"
24160
+ returns object for chaining
24114
24161
  toggle(state) - forces a toggle of label, backing and icon if set
24115
24162
  state defaults to null so just toggles if left blank
24116
24163
  pass in true to go to the toggled state and false to go to the original state
@@ -24955,10 +25002,12 @@ added, click, dblclick, mousedown, mouseout, mouseover, pressdown (ZIM), pressmo
24955
25002
  // setBacking or leave backing parameter blank to remove this type of backing
24956
25003
  this.setBacking = function(type, newBacking) {
24957
25004
  setObject(type, newBacking);
25005
+ return that;
24958
25006
  };
24959
25007
  // setIcon or leave icon parameter blank to remove this type of icon
24960
25008
  this.setIcon = function(type, newIcon) {
24961
25009
  setObject(type, newIcon);
25010
+ return that;
24962
25011
  };
24963
25012
  function setObject(type, newObject) {
24964
25013
  if (zot(type)) return that;
@@ -27094,7 +27143,7 @@ added, click, dblclick, mousedown, mouseout, mouseover, pressdown (ZIM), pressmo
27094
27143
  });
27095
27144
  var titleBarLabel = that.titleBarLabel = t;
27096
27145
  if (zot(tBarBackgroundColor)) tBarBackgroundColor = "rgba(0,0,0,.2)";
27097
- that.titleBar = titleBar = new zim.Container(width, titleBarHeight, null, null, false).loc(0,0,that);
27146
+ that.titleBar = titleBar = new zim.Container(width, titleBarHeight, null, null, false).loc(0,-borderWidth/2,that);
27098
27147
  var titleBarRect = that.titleBar.backing = new zim.Rectangle(width+borderWidth, titleBarHeight, tBarBackgroundColor, null, null, [corner[0]*.95, corner[1]*.95, 0, 0], true, null, null, false).center(titleBar);
27099
27148
  if (titleBar) positionBar();
27100
27149
  that.label = t;
@@ -27467,7 +27516,8 @@ scrollBarH - (default true) if scrolling in horizontal is needed then show scrol
27467
27516
  scrollBarV - (default true) if scrolling in vertical is needed then show scrollBar
27468
27517
  slide - (default true) Boolean to throw the content when drag/swipe released
27469
27518
  slideFactor - (default .9) is the factor multiplied by dragging velocity (1 no slowing, .7 fast slowing)
27470
- slideSnap - (default true) slides past boundary and then snaps back to boundary when released - also VERTICAL, HORIZONTAL, and false
27519
+ slideSnap - (default true - false if no vertical scroll) slides past boundary and then snaps back to boundary when released
27520
+ also VERTICAL, HORIZONTAL, and false
27471
27521
  slideSnapDamp - (default .1) the damping to snap back to boundary
27472
27522
  interactive - (default true) allows interaction with content in window
27473
27523
  set to false and whole window will be swipeable but not interactive inside
@@ -27655,6 +27705,7 @@ added, click, dblclick, mousedown, mouseout, mouseover, pressdown (ZIM), pressmo
27655
27705
  if (scrollBarDrag) scrollBarFade = DS.scrollBarFade!=null?DS.scrollBarFade:false;
27656
27706
  if (zot(slide)) slide=DS.slide!=null?DS.slide:true;
27657
27707
  if (zot(slideFactor)) slideFactor=DS.slideFactor!=null?DS.slideFactor:.9;
27708
+ if (!scrollBarV && zot(slideSnap) && DS.slideSnap==null) slideSnap = false;
27658
27709
  if (zot(slideSnap)) slideSnap=DS.slideSnap!=null?DS.slideSnap:"vertical"; // true / auto, vertical, horizontal, false / none
27659
27710
  if (zot(interactive)) interactive=DS.interactive!=null?DS.interactive:true;
27660
27711
  if (zot(shadowColor)) shadowColor=DS.shadowColor!=null?DS.shadowColor:"rgba(0,0,0,.3)";
@@ -30764,7 +30815,7 @@ zim.TextInput = function(width, height, placeholder, text, size, font, color, ba
30764
30815
  that.stage.update();
30765
30816
  }
30766
30817
  }
30767
- if (placeholderInstant && that.placeholderLabel.parent) {
30818
+ if (placeholderInstant && that.placeholderLabel.parent) {
30768
30819
  that.placeholderLabel.removeFrom();
30769
30820
  if (that.stage) that.stage.update();
30770
30821
  }
@@ -30880,6 +30931,8 @@ zim.TextInput = function(width, height, placeholder, text, size, font, color, ba
30880
30931
  that.label.dispose();
30881
30932
  edgeLeft.dispose();
30882
30933
  edgeRight.dispose();
30934
+ that.label.positionBlinkerAndSelection();
30935
+ if (that.label.focus) that.label.blinker.replayTween();
30883
30936
  }
30884
30937
 
30885
30938
  var lastText = label.text;
@@ -30926,6 +30979,7 @@ zim.TextInput = function(width, height, placeholder, text, size, font, color, ba
30926
30979
  lastText = value;
30927
30980
  label.setText(value, true); // true for noEvent
30928
30981
  doPlaceholder();
30982
+ that.label.positionBlinkerAndSelection();
30929
30983
  if ((!zim.OPTIMIZE&&(zns||!WW.OPTIMIZE)) && that.stage) that.stage.update();
30930
30984
  }
30931
30985
  });
@@ -31186,7 +31240,7 @@ zim.TextInput.LabelInput = function(text, size, maxLength, password, selectionCo
31186
31240
  var paddingH = this.backing || this.background ? this.paddingH : 0;
31187
31241
  var paddingV = this.backing || this.background ? this.paddingV : 0;
31188
31242
 
31189
- if (this.hiddenInput.selectionStart !== this.hiddenInput.selectionEnd) {
31243
+ if (this.hiddenInput.selectionStart !== this.hiddenInput.selectionEnd || le == 0) {
31190
31244
  var startX, endX;
31191
31245
  if (rtl) {
31192
31246
  startX = this.textWidthArray[le-this.hiddenInput.selectionStart]
@@ -31206,8 +31260,10 @@ zim.TextInput.LabelInput = function(text, size, maxLength, password, selectionCo
31206
31260
  }
31207
31261
  this.blinker.heightOnly = this.textHeight;
31208
31262
  var xIdx = this.hiddenInput.selectionDirection === "backward" ? this.hiddenInput.selectionStart : this.hiddenInput.selectionEnd;
31209
- if (!xIdx) xIdx = 0; // ZIM NFT 00 Patch
31263
+ // if (!xIdx) xIdx = 0; // ZIM NFT 00 Patch
31264
+ if (xIdx==null) xIdx = le; // ZIM 017 Patch
31210
31265
  if (rtl) xIdx = le-xIdx;
31266
+
31211
31267
  this.blinker.pos(this.textWidthArray[xIdx] + paddingH - 1 + ((align=="right" && this.text == "")?this.width:(align=="center" && this.text == "")?this.width/2:0) + shiftH, paddingV+shiftV);
31212
31268
  this.dispatchEvent("blinker");
31213
31269
  }
@@ -31327,7 +31383,7 @@ zim.extend(zim.TextInput.LabelInput, zim.Label, "dispose", "zimLabel", false);
31327
31383
 
31328
31384
 
31329
31385
  /*--
31330
- zim.List = function(width, height, list, viewNum, vertical, currentSelected, align, valign, labelAlign, labelValign, labelIndent, labelIndentH, labelIndentV, indent, spacing, backgroundColor, rollBackgroundColor, downBackgroundColor, selectedBackgroundColor, selectedRollBackgroundColor, backdropColor, color, rollColor, downColor, selectedColor, selectedRollColor, borderColor, borderWidth, padding, corner, swipe, scrollBarActive, scrollBarDrag, scrollBarColor, scrollBarAlpha, scrollBarFade, scrollBarH, scrollBarV, scrollBarOverlay, slide, slideFactor, slideSnap, slideSnapDamp, shadowColor, shadowBlur, paddingH, paddingV, scrollWheel, damp, titleBar, titleBarColor, titleBarBackgroundColor, titleBarHeight, draggable, boundary, onTop, close, closeColor, collapse, collapseColor, collapsed, excludeCustomTap, organizer, checkBox, pulldown, clone, cancelCurrentDrag, index, noScale, pulldownToggle, optimize, keyEnabled, resizeHandle, resizeBoundary, resizeVisible, continuous, closeOthers, selectedIndex, style, group, inherit)
31386
+ zim.List = function(width, height, list, viewNum, vertical, currentSelected, align, valign, labelAlign, labelValign, labelIndent, labelIndentH, labelIndentV, indent, spacing, backgroundColor, rollBackgroundColor, downBackgroundColor, selectedBackgroundColor, selectedRollBackgroundColor, backdropColor, color, rollColor, downColor, selectedColor, selectedRollColor, borderColor, borderWidth, padding, corner, swipe, scrollBarActive, scrollBarDrag, scrollBarColor, scrollBarAlpha, scrollBarFade, scrollBarH, scrollBarV, scrollBarOverlay, slide, slideFactor, slideSnap, slideSnapDamp, shadowColor, shadowBlur, paddingH, paddingV, scrollWheel, damp, titleBar, titleBarColor, titleBarBackgroundColor, titleBarHeight, draggable, boundary, onTop, close, closeColor, collapse, collapseColor, collapsed, excludeCustomTap, organizer, checkBox, pulldown, clone, cancelCurrentDrag, index, noScale, pulldownToggle, optimize, keyEnabled, resizeHandle, resizeBoundary, resizeVisible, continuous, closeOthers, drop, dropTargets, dropColor, dropThickness, dropScrollSpeed, dropReticleAlpha, selectedIndex, style, group, inherit)
31331
31387
 
31332
31388
  List
31333
31389
  zim class - extends a zim.Window which extends a zim.Container which extends a createjs.Container
@@ -31399,6 +31455,30 @@ const list = new List({
31399
31455
  S.update();
31400
31456
  END EXAMPLE
31401
31457
 
31458
+ EXAMPLE
31459
+ // drop items onto own list or other list
31460
+ // drop is set to true in the STYLE - this means the list can drop its items onto itself
31461
+ // dropTargets is set after the lists are made - to be able to drop onto other lists
31462
+ // these two things are separate - items can be dropped onto other lists but not their own, etc.
31463
+
31464
+ const w = 60;
31465
+ const h = 60;
31466
+ STYLE = {
31467
+ Rectangle:{width:w, height:h, color:series(blue,green,orange,yellow,pink)},
31468
+ List:{vertical:false, spacing:null, viewNum:9, drop:true}
31469
+ }
31470
+ const items = [];
31471
+ loop(40,()=>{items.push(new Rectangle())})
31472
+ const list = new List(600, h*1.5, items).center().mov(0, -100);
31473
+
31474
+ const items2 = [];
31475
+ loop(40,()=>{items2.push(new Rectangle())})
31476
+ const list2 = new List(600, h*1.5, items2).center().mov(0,100);
31477
+
31478
+ list.dropTargets = list2;
31479
+ list2.dropTargets = list;
31480
+ END EXAMPLE
31481
+
31402
31482
  EXAMPLE
31403
31483
  // make a pulldown - this must start with a name for the list
31404
31484
  // see https://zimjs.com/ten/pulldown.html for nested lists
@@ -31627,6 +31707,24 @@ resizeBoundary - (default null) add a ZIM Boundary() object for the resize handl
31627
31707
  resizeVisible - (default false) set to true to always see the resizeHandle - if resizeHandle is set to true
31628
31708
  continuous - (default false) set to true to make the list scroll continuously - should have more elements than the viewNum for this
31629
31709
  closeOthers - (default false) set to true to close any open branches before expanding selected branch
31710
+ drop - (default false) - set to true to allow drag and drop of items onto the current list
31711
+ if the list is vertical, dragging the item horizontally will pull it from the list
31712
+ the item can then be dragged to a different location and dropped in place
31713
+ for a horizontal list, dragging the item vertical will pull it from the list
31714
+ also see the dropTargets parameter and the drop and dropTarget properties
31715
+ note: the dropTargets alone can be set to drop onto other lists but not the current list
31716
+ also see updateDrop() method if a list has been moved or scaled
31717
+ dropTargets - (default null) - add a list or an array of lists to drop an item from the current list
31718
+ see the drop parameter and the drop and dropTargets properties
31719
+ note: dropTargets can be set without setting the drop parameter to true
31720
+ and then items can be dragged to the target lists but not onto the current list
31721
+ also see updateDrop() method if a list has been moved or scaled
31722
+ dropColor - (default white) - the color of the diamond reticle that indicates where an item will be dropped
31723
+ dropThickness - (default 1) - the thickness of the diamond reticle that indicates where an item will be dropped
31724
+ dropScrollSpeed - (default 5) - the speed the list is scrolled as a drop item is dragged up to 50px off an end of the list
31725
+ this is only applied if the list scrolls on that end
31726
+ the speed is multiplied by 1.5 when the item is between 50px and 80px off the end
31727
+ dropReticleAlpha - (default 1) - set the alpha of the drop reticle diamond - set to 0 to not show reticle
31630
31728
  selectedIndex - same as index, kept in for backwards compatibility in ZIM DUO
31631
31729
  style - (default true) set to false to ignore styles set with the STYLE - will receive original parameter defaults
31632
31730
  group - (default null) set to String (or comma delimited String) so STYLE can set default styles to the group(s) (like a CSS class)
@@ -31674,6 +31772,7 @@ openAtNum(idNum, closeOthers) - open an accordion list at a specific id number
31674
31772
  and then expand any ids to see more ids nested inside
31675
31773
  the idNum should be something like 6 or 12 without the word id.
31676
31774
  closeOthers defaults to false - set to true to close any open branches before opening at idNum
31775
+ updateDrop() - updates global locations of list if being used as a drop location and list has been moved or scaled
31677
31776
  hasProp(property as String) - returns true if property exists on object else returns false
31678
31777
  clone() - makes a copy with properties such as x, y, etc. also copied
31679
31778
  dispose() - removes from parent, removes event listeners - must still set outside references to null for garbage collection
@@ -31739,6 +31838,7 @@ checkBoxes - read-only array of CheckBox objects if checkBox parameter is true
31739
31838
  itemsText - read-only array of text for labels (or null element if no label)
31740
31839
  itemWidth - the width of each item (unless custom items)
31741
31840
  itemHeight - the height of each item (unless custom items)
31841
+ spacing - get the spacing
31742
31842
  length - read-only length of the list
31743
31843
  tabs - a reference to the tabs object used in the list
31744
31844
  organizer - a reference to the organizer object if used
@@ -31752,6 +31852,15 @@ toggled - for accordion get or set whether the main (root) accordion is open (tr
31752
31852
  collapseIcon - access to the ZIM Shape if there is a collapse triangle
31753
31853
  collapsed - get or set whether the list is collapsed - must start with collapse parameter set to true
31754
31854
  also see collapse() method
31855
+ drop - get or set to allow drag and drop of items onto the current lists - see drop parameter
31856
+ dropTargets - get or set a list or an array of lists to drop an item from the current list - see dropTargets parameter
31857
+ dropColor - get or set the color of the diamond reticle that indicates where an item will be dropped - see dropColor
31858
+ dropReticle - each list that can be dropped on gets a dropReticle property that is the ZIM rectangle
31859
+ so individual reticles can be adjusted - say different colors for different lists
31860
+ dropItem - after a dropdown event, the dropItem is the ghost being dragged
31861
+ dropIndex - after a dropdown event, the dropIndex is the original index of the item being dragged
31862
+ dropList - after a dropup event, the dropList is the list that the item was dropped into (could be original list)
31863
+ dropNewIndex - after a dropup event, the dropNewIndex is the index in the list the item has been dropped
31755
31864
  enabled - default is true - set to false to disable
31756
31865
 
31757
31866
  ALSO: see all Window properties - like titleBar, titleBarLabel, resizeHandle, etc.
@@ -31771,14 +31880,18 @@ dispatches a "bloom" event for each item that is created when blooming
31771
31880
  dispatches an "expanded" event when items have been expanded
31772
31881
  this receives an event object with an items property of the items just opened
31773
31882
  dispatches a "collapsed" event when items have been collapsed
31883
+ dispatches a "dropdown" event when drop item is pulled from list
31884
+ list will have dropItem and dropIndex properties
31885
+ dispatches a "dropup" event when drop item is dropped
31886
+ list will have dropItem, dropList and dropNewIndex properties
31774
31887
 
31775
31888
  ALSO: All Window events including "scrolling"
31776
31889
 
31777
31890
  ALSO: see the CreateJS Easel Docs for Container events such as:
31778
31891
  added, click, dblclick, mousedown, mouseout, mouseover, pressdown (ZIM), pressmove, pressup, removed, rollout, rollover
31779
31892
  --*///+60.5
31780
- zim.List = function(width, height, list, viewNum, vertical, currentSelected, align, valign, labelAlign, labelValign, labelIndent, labelIndentH, labelIndentV, indent, spacing, backgroundColor, rollBackgroundColor, downBackgroundColor, selectedBackgroundColor, selectedRollBackgroundColor, backdropColor, color, rollColor, downColor, selectedColor, selectedRollColor, borderColor, borderWidth, padding, corner, swipe, scrollBarActive, scrollBarDrag, scrollBarColor, scrollBarAlpha, scrollBarFade, scrollBarH, scrollBarV, scrollBarOverlay, slide, slideFactor, slideSnap, slideSnapDamp, shadowColor, shadowBlur, paddingH, paddingV, scrollWheel, damp, titleBar, titleBarColor, titleBarBackgroundColor, titleBarHeight, draggable, boundary, onTop, close, closeColor, collapse, collapseColor, collapsed, excludeCustomTap, organizer, checkBox, pulldown, clone, cancelCurrentDrag, index, noScale, pulldownToggle, optimize, keyEnabled, resizeHandle, resizeBoundary, resizeVisible, continuous, closeOthers, selectedIndex, style, group, inherit) {
31781
- var sig = "width, height, list, viewNum, vertical, currentSelected, align, valign, labelAlign, labelValign, labelIndent, labelIndentH, labelIndentV, indent, spacing, backgroundColor, rollBackgroundColor, downBackgroundColor, selectedBackgroundColor, selectedRollBackgroundColor, backdropColor, color, rollColor, downColor, selectedColor, selectedRollColor, borderColor, borderWidth, padding, corner, swipe, scrollBarActive, scrollBarDrag, scrollBarColor, scrollBarAlpha, scrollBarFade, scrollBarH, scrollBarV, scrollBarOverlay, slide, slideFactor, slideSnap, slideSnapDamp, shadowColor, shadowBlur, paddingH, paddingV, scrollWheel, damp, titleBar, titleBarColor, titleBarBackgroundColor, titleBarHeight, draggable, boundary, onTop, close, closeColor, collapse, collapseColor, collapsed, excludeCustomTap, organizer, checkBox, pulldown, clone, cancelCurrentDrag, index, noScale, pulldownToggle, optimize, keyEnabled, resizeHandle, resizeBoundary, resizeVisible, continuous, closeOthers, selectedIndex, style, group, inherit";
31893
+ zim.List = function(width, height, list, viewNum, vertical, currentSelected, align, valign, labelAlign, labelValign, labelIndent, labelIndentH, labelIndentV, indent, spacing, backgroundColor, rollBackgroundColor, downBackgroundColor, selectedBackgroundColor, selectedRollBackgroundColor, backdropColor, color, rollColor, downColor, selectedColor, selectedRollColor, borderColor, borderWidth, padding, corner, swipe, scrollBarActive, scrollBarDrag, scrollBarColor, scrollBarAlpha, scrollBarFade, scrollBarH, scrollBarV, scrollBarOverlay, slide, slideFactor, slideSnap, slideSnapDamp, shadowColor, shadowBlur, paddingH, paddingV, scrollWheel, damp, titleBar, titleBarColor, titleBarBackgroundColor, titleBarHeight, draggable, boundary, onTop, close, closeColor, collapse, collapseColor, collapsed, excludeCustomTap, organizer, checkBox, pulldown, clone, cancelCurrentDrag, index, noScale, pulldownToggle, optimize, keyEnabled, resizeHandle, resizeBoundary, resizeVisible, continuous, closeOthers, drop, dropTargets, dropColor, dropThickness, dropScrollSpeed, dropReticleAlpha, selectedIndex, style, group, inherit) {
31894
+ var sig = "width, height, list, viewNum, vertical, currentSelected, align, valign, labelAlign, labelValign, labelIndent, labelIndentH, labelIndentV, indent, spacing, backgroundColor, rollBackgroundColor, downBackgroundColor, selectedBackgroundColor, selectedRollBackgroundColor, backdropColor, color, rollColor, downColor, selectedColor, selectedRollColor, borderColor, borderWidth, padding, corner, swipe, scrollBarActive, scrollBarDrag, scrollBarColor, scrollBarAlpha, scrollBarFade, scrollBarH, scrollBarV, scrollBarOverlay, slide, slideFactor, slideSnap, slideSnapDamp, shadowColor, shadowBlur, paddingH, paddingV, scrollWheel, damp, titleBar, titleBarColor, titleBarBackgroundColor, titleBarHeight, draggable, boundary, onTop, close, closeColor, collapse, collapseColor, collapsed, excludeCustomTap, organizer, checkBox, pulldown, clone, cancelCurrentDrag, index, noScale, pulldownToggle, optimize, keyEnabled, resizeHandle, resizeBoundary, resizeVisible, continuous, closeOthers, drop, dropTargets, dropColor, dropThickness, dropScrollSpeed, dropReticleAlpha, selectedIndex, style, group, inherit";
31782
31895
  var duo; if (duo = zob(zim.List, arguments, sig, this)) return duo;
31783
31896
  z_d("60.5");
31784
31897
 
@@ -31871,6 +31984,14 @@ added, click, dblclick, mousedown, mouseout, mouseover, pressdown (ZIM), pressmo
31871
31984
  if (zot(continuous)) continuous = DS.continuous!=null?DS.continuous:false;
31872
31985
  if (zot(closeOthers)) closeOthers = DS.closeOthers!=null?DS.closeOthers:false;
31873
31986
 
31987
+ if (zot(drop)) drop = DS.drop!=null?DS.drop:false;
31988
+ if (zot(dropTargets)) dropTargets = DS.dropTargets!=null?DS.dropTargets:null;
31989
+ if (zot(dropColor)) dropColor = DS.dropColor!=null?DS.dropColor:zim.white;
31990
+ if (zot(dropThickness)) dropThickness = DS.dropThickness!=null?DS.dropThickness:1;
31991
+ if (zot(dropScrollSpeed)) dropScrollSpeed = DS.dropScrollSpeed!=null?DS.dropScrollSpeed:5;
31992
+ if (zot(dropReticleAlpha)) dropReticleAlpha = DS.dropReticleAlpha!=null?DS.dropReticleAlpha:1;
31993
+
31994
+
31874
31995
  if (titleBar === false) titleBar = null;
31875
31996
  this.vertical = vertical;
31876
31997
 
@@ -31965,6 +32086,7 @@ added, click, dblclick, mousedown, mouseout, mouseover, pressdown (ZIM), pressmo
31965
32086
  this.align = align;
31966
32087
  this.valign = valign;
31967
32088
  this.indent = indent;
32089
+ this.spacing = spacing;
31968
32090
 
31969
32091
  if (!zot(organizer)) {
31970
32092
  height = height - organizer.height;
@@ -32415,6 +32537,8 @@ added, click, dblclick, mousedown, mouseout, mouseover, pressdown (ZIM), pressmo
32415
32537
 
32416
32538
  this.addAt = function(items, index, style, clone) {
32417
32539
  if (zot(items)) return that;
32540
+ var lastO = that.optimize;
32541
+ that.optimize = false;
32418
32542
  that.tabs.loop(function(item) {
32419
32543
  item.visible = true;
32420
32544
  });
@@ -32463,19 +32587,22 @@ added, click, dblclick, mousedown, mouseout, mouseover, pressdown (ZIM), pressmo
32463
32587
  // that.contentContainer.y = 0;
32464
32588
 
32465
32589
  that.update();
32590
+ that.optimize = lastO;
32466
32591
  return that;
32467
32592
  };
32468
32593
 
32469
32594
  this.removeAt = function(num, index) {
32595
+ var lastO = that.optimize;
32596
+ that.optimize = false;
32470
32597
  if (continuous) that.tabs.removeAt(num, index+list.length);
32471
32598
  that.tabs.removeAt(num, index);
32472
- that.tabs.loop(function(item) {
32599
+ that.tabs.loop(function(item) { // optimize sets off stage items to visible false
32473
32600
  item.visible = true;
32474
32601
  });
32475
32602
  _index = that.tabs.index;
32476
32603
  var b = tabs.getBounds();
32477
32604
  tabs.setBounds(0,0,b.width,b.height);
32478
-
32605
+
32479
32606
  // that.contentContainer.x = 0; // why go back to 0? Changed in Cat 01
32480
32607
  // that.contentContainer.y = 0;
32481
32608
 
@@ -32484,6 +32611,7 @@ added, click, dblclick, mousedown, mouseout, mouseover, pressdown (ZIM), pressmo
32484
32611
  if (b.height < height) that.scrollY = 0; // zot(titleBar)?0:titleBarHeight;
32485
32612
 
32486
32613
  that.update();
32614
+ that.optimize = lastO;
32487
32615
 
32488
32616
  return that;
32489
32617
  };
@@ -32516,6 +32644,397 @@ added, click, dblclick, mousedown, mouseout, mouseover, pressdown (ZIM), pressmo
32516
32644
  });
32517
32645
  return that;
32518
32646
  };
32647
+
32648
+ // DROP - Added for ZIM 017 to drag and drop items to same list or other lists
32649
+
32650
+ var dropCheck = false;
32651
+ var frame;
32652
+ if (drop || dropTargets) makeDrop();
32653
+
32654
+ function makeDrop() {
32655
+ if (dropCheck) return true;
32656
+ dropCheck = true;
32657
+
32658
+ var downPoint;
32659
+ var downItem;
32660
+ var checkItem;
32661
+ var itemPoint;
32662
+ var itemIndex;
32663
+ var itemAlpha;
32664
+ var ghost;
32665
+
32666
+
32667
+ // drop and dropTargets are assigned independently but both are added to dropTargets array
32668
+ if (dropTargets && !Array.isArray(dropTargets)) dropTargets = [dropTargets];
32669
+ if (!dropTargets) dropTargets = [];
32670
+ if (drop) dropTargets.unshift(that);
32671
+
32672
+ that.added(function(stage) {
32673
+ frame = stage.frame;
32674
+ zim.loop(dropTargets, function(target) {
32675
+ target.dropReticle = new zim.Rectangle(20,20,clear,dropColor,dropThickness).reg(CENTER).rot(45).alp(dropReticleAlpha);
32676
+ target.dropReticleIndex = null;
32677
+ target.zgb = target.boundsToGlobal();
32678
+ target.zgs = target.getConcatenatedDisplayProps().matrix.decompose().scaleX/stage.scaleX;
32679
+ });
32680
+ });
32681
+
32682
+ that.dropDown = that.on("mousedown", function(e){
32683
+ // make sure is item in list
32684
+ downItem = checkItem = e.target;
32685
+ // e.target can be something in the item - or the item
32686
+ // but custom List items are usually in a Container
32687
+ // so want to drag the item which is the child of the container that is in the List items
32688
+ if (!that.items.includes(downItem)) {
32689
+ var good = false;
32690
+ var checkItem = downItem
32691
+ while(checkItem.parent) {
32692
+ if (that.items.includes(checkItem.parent)) {
32693
+ good = true;
32694
+ downItem = checkItem;
32695
+ break;
32696
+ }
32697
+ checkItem = checkItem.parent;
32698
+ }
32699
+ if (!good) return;
32700
+ }
32701
+ downPoint = that.globalToLocal(frame.mouseX, frame.mouseY);
32702
+ itemPoint = downItem.globalToLocal(frame.mouseX, frame.mouseY);
32703
+ itemIndex = zot(checkItem.znum) ? checkItem.parent.znum : checkItem.znum;
32704
+ itemAlpha = downItem.alpha;
32705
+
32706
+ that.dropList = null;
32707
+ that.dropNewIndex = null;
32708
+ });
32709
+
32710
+ function scrollUp(target, dropScrollSpeed) {
32711
+ if (target.scrollInt) target.scrollInt.clear();
32712
+ target.scrollInt = zim.interval(.01, function() {
32713
+ if (target.dropReticle.parent) target.dropReticle.removeFrom();
32714
+ if (target.vertical) {
32715
+ target.scrollY += dropScrollSpeed;
32716
+ if (target.scrollY > 0) {
32717
+ target.scrollY = 0;
32718
+ target.scrollInt.clear();
32719
+ }
32720
+ } else {
32721
+ target.scrollX += dropScrollSpeed;
32722
+ if (target.scrollX > 0) {
32723
+ target.scrollX = 0;
32724
+ target.scrollInt.clear();
32725
+ }
32726
+ }
32727
+ }, null, null, null, "seconds");
32728
+ }
32729
+
32730
+ function scrollDown(target, dropScrollSpeed) {
32731
+ if (target.scrollInt) target.scrollInt.clear();
32732
+ target.scrollInt = zim.interval(.01, function() {
32733
+ if (target.dropReticle.parent) target.dropReticle.removeFrom();
32734
+ if (target.vertical) {
32735
+ target.scrollY -= dropScrollSpeed;
32736
+ if (target.scrollY < -target.scrollYMax) {
32737
+ target.scrollY = -target.scrollYMax;
32738
+ target.scrollInt.clear();
32739
+ }
32740
+ } else {
32741
+ target.scrollX -= dropScrollSpeed;
32742
+ if (target.scrollX < -target.scrollXMax) {
32743
+ target.scrollX = -target.scrollXMax;
32744
+ target.scrollInt.clear();
32745
+ }
32746
+ }
32747
+ }, null, null, null, "seconds");
32748
+ }
32749
+
32750
+ that.dropMove = that.on("pressmove", function() {
32751
+ if (ghost || !downPoint) return;
32752
+ var point = that.localToGlobal(downPoint.x, downPoint.y);
32753
+ if (
32754
+ ((
32755
+ // mouse is mostly not in direction of travel
32756
+ (that.vertical && Math.abs(point.x-frame.mouseX) > Math.abs(point.y-frame.mouseY)) ||
32757
+ (!that.vertical && Math.abs(point.x-frame.mouseX) < Math.abs(point.y-frame.mouseY))
32758
+ ) && !that.hitTestPoint(frame.mouseX, frame.mouseY))
32759
+
32760
+ || (that.vertical && !scrollBarV)
32761
+ || (!that.vertical && !scrollBarH)
32762
+ ) {
32763
+ that.cancelCurrentDrag();
32764
+ var sc = downItem.getConcatenatedDisplayProps().matrix.decompose().scaleX/F.stage.scaleX; // sigh
32765
+ ghost = downItem.clone().reg(itemPoint.x, itemPoint.y).sca(sc).alp(.5); //.sha("rgba(0,0,0,.3)",5,5,5);
32766
+ that.dropItem = ghost;
32767
+ that.dropIndex = itemIndex;
32768
+ that.dropStage = frame.stage.on("stagemousemove", function(){
32769
+ ghost.loc(frame.mouseX, frame.mouseY)
32770
+
32771
+ // scroll if ghost is at edges of scrollable list
32772
+ var onCheck = false;
32773
+ zim.loop(dropTargets, function(target) {
32774
+ if (target.type != "List") return;
32775
+ if (onCheck) {
32776
+ if (target.scrollInt) target.scrollInt.clear();
32777
+ target.dropReticle.removeFrom();
32778
+ target.dropReticleIndex = null;
32779
+ return; // next in loop
32780
+ }
32781
+ if (target.vertical) {
32782
+ if (ghost.x > target.zgb.x && ghost.x < target.zgb.x + target.zgb.width) {
32783
+ if (ghost.y < target.zgb.y) { // carefull - need to do these separately to turn off diamond
32784
+ if (ghost.y > target.zgbtarget.zgb.y - 50) scrollUp(target, dropScrollSpeed);
32785
+ else if (ghost.y > target.zgbtarget.zgb.y - 80) scrollUp(target, dropScrollSpeed*1.5);
32786
+ onCheck = true;
32787
+ } else if (ghost.y > target.zgbtarget.zgb.y + target.zgbtarget.zgb.height) {
32788
+ if (ghost.y < target.zgbtarget.zgb.y + target.zgbtarget.zgb.height + 50) scrollDown(target, dropScrollSpeed);
32789
+ else if (ghost.y < target.zgbtarget.zgb.y + target.zgbtarget.zgb.height + 80) scrollDown(target, dropScrollSpeed*1.5);
32790
+ onCheck = true;
32791
+ } else if (target.scrollInt) target.scrollInt.clear();
32792
+ } else {
32793
+ if (target.scrollInt) target.scrollInt.clear();
32794
+ }
32795
+ } else {
32796
+ if (ghost.y > target.zgb.y && ghost.y < target.zgb.y + target.zgb.height) {
32797
+ if (ghost.x < target.zgb.x) {
32798
+ if (ghost.x > target.zgb.x - 50) scrollUp(target, dropScrollSpeed);
32799
+ else if (ghost.x > target.zgb.x - 80) scrollUp(target, dropScrollSpeed*1.5);
32800
+ onCheck = true;
32801
+ } else if (ghost.x > target.zgb.x + target.zgb.width) {
32802
+ if (ghost.x < target.zgb.x + target.zgb.width + 50) scrollDown(target, dropScrollSpeed);
32803
+ else if (ghost.x < target.zgb.x + target.zgb.width + 80) scrollDown(target, dropScrollSpeed*1.5);
32804
+ onCheck = true;
32805
+ } else if (target.scrollInt) target.scrollInt.clear();
32806
+ } else {
32807
+ if (target.scrollInt) target.scrollInt.clear();
32808
+ }
32809
+ }
32810
+
32811
+ // place reticle
32812
+ if (target.hitTestReg(ghost)) {
32813
+ onCheck = true;
32814
+ var point = target.tabs.globalToLocal(ghost.x, ghost.y);
32815
+ var item = target.tabs.getObjectUnderPoint(point.x, point.y, 1);
32816
+ var yy;
32817
+ var xx;
32818
+ var bounds;
32819
+ if (item) {
32820
+ checkItem = item;
32821
+ var good = target.items.includes(checkItem);
32822
+ if (zot(item.znum)) {
32823
+ while(checkItem.parent) {
32824
+ if (target.items.includes(checkItem.parent)) {
32825
+ good = true;
32826
+ item = checkItem.parent;
32827
+ break;
32828
+ }
32829
+ checkItem = checkItem.parent;
32830
+ }
32831
+ }
32832
+ if (!good) return;
32833
+ bounds = item.boundsToGlobal();
32834
+
32835
+ // target.dropReticle.visible = true;
32836
+ // if (checkItem == downItem) target.dropReticle.visible = false;
32837
+
32838
+ if (target.vertical) {
32839
+ if (ghost.y > bounds.y + bounds.height/2) {
32840
+ yy = bounds.y + bounds.height + target.spacing*target.zgs/2;
32841
+ if (yy > target.zgb.y && yy < target.zgb.y + target.zgb.height) {
32842
+ target.dropReticle.loc(bounds.x + bounds.width/2, yy);
32843
+ target.dropReticleIndex = item.znum + 1;
32844
+ }
32845
+ } else {
32846
+ yy = bounds.y - target.spacing*target.zgs/2;
32847
+ if (yy > target.zgb.y && yy < target.zgb.y + target.zgb.height) {
32848
+ target.dropReticle.loc(bounds.x + bounds.width/2, yy);
32849
+ target.dropReticleIndex = item.znum;
32850
+ }
32851
+ }
32852
+ } else {
32853
+ if (ghost.x > bounds.x + bounds.width/2) {
32854
+ xx = bounds.x + bounds.width + target.spacing*target.zgs/2;
32855
+ if (xx > target.zgb.x && xx < target.zgb.x + target.zgb.width) {
32856
+ target.dropReticle.loc(xx, bounds.y + bounds.height/2);
32857
+ target.dropReticleIndex = item.znum + 1;
32858
+ }
32859
+ } else {
32860
+ xx = bounds.x - target.spacing*target.zgs/2;
32861
+ if (xx > target.zgb.x && xx < target.zgb.x + target.zgb.width) {
32862
+ target.dropReticle.loc(xx, bounds.y + bounds.height/2);
32863
+ target.dropReticleIndex = item.znum;
32864
+ }
32865
+ }
32866
+ }
32867
+ } else {
32868
+ if (target.items.length > 0) {
32869
+ bounds = target.items[target.items.length-1].boundsToGlobal();
32870
+ if (target.vertical) {
32871
+ if (ghost.y > bounds.y + bounds.height) {
32872
+ yy = bounds.y + bounds.height + target.spacing*target.zgs/2;
32873
+ target.dropReticle.loc(target.zgb.x + target.zgb.width/2, yy);
32874
+ target.dropReticleIndex = target.items.length;
32875
+ } else {
32876
+ target.dropReticle.removeFrom();
32877
+ target.dropReticleIndex = null;
32878
+ }
32879
+ } else {
32880
+ if (ghost.x > bounds.x + bounds.width) {
32881
+ xx = bounds.x + bounds.width + target.spacing*target.zgs/2;
32882
+ target.dropReticle.loc(xx, target.zgb.y + target.zgb.height/2);
32883
+ target.dropReticleIndex = target.items.length;
32884
+ } else {
32885
+ target.dropReticle.removeFrom();
32886
+ target.dropReticleIndex = null;
32887
+ }
32888
+ }
32889
+ } else {
32890
+ if (target.vertical) {
32891
+ yy = target.zgb.y + target.spacing*target.zgs/2;
32892
+ target.dropReticle.loc(target.zgb.x + target.zgb.width/2, yy);
32893
+ target.dropReticleIndex = 0;
32894
+ } else {
32895
+ xx = target.zgb.x + target.spacing*target.zgs/2;
32896
+ target.dropReticle.loc(xx, target.zgb.y + target.zgb.height/2);
32897
+ target.dropReticleIndex = 0;
32898
+ }
32899
+ }
32900
+ }
32901
+ } else {
32902
+ target.dropReticle.removeFrom();
32903
+ target.dropReticleIndex = null;
32904
+ }
32905
+ });
32906
+ });
32907
+
32908
+ that.dispatchEvent("dropdown");
32909
+
32910
+ frame.stage.on("stagemouseup", function(){
32911
+ frame.stage.off("stagemousemove", that.dropStage);
32912
+
32913
+ var empty = zim.loop(dropTargets, function(target) {
32914
+ if (target.type != "List") return;
32915
+ if (target.scrollInt) target.scrollInt.clear();
32916
+ if (!zot(target.dropReticleIndex)) {
32917
+ target.dropReticle.removeFrom();
32918
+ that.removeAt(1,itemIndex);
32919
+
32920
+ if (itemIndex < target.dropReticleIndex && that == target) target.dropReticleIndex--;
32921
+ target.addAt(downItem, target.dropReticleIndex);
32922
+
32923
+ ghost.dispose();
32924
+ downItem.alpha = itemAlpha;
32925
+ ghost = null;
32926
+ downPoint = null;
32927
+
32928
+ that.dropItem = downItem;
32929
+ that.dropList = target;
32930
+ that.dropNewIndex = target.dropReticleIndex;
32931
+ target.dropReticleIndex = null;
32932
+
32933
+ return false;
32934
+ }
32935
+ });
32936
+
32937
+ if (empty) {
32938
+ var point = downItem.localToGlobal(itemPoint.x, itemPoint.y);
32939
+ ghost.animate({x:point.x, y:point.y}, .1, null, function() {
32940
+ ghost.dispose();
32941
+ downItem.alpha = itemAlpha;
32942
+ ghost = null;
32943
+ downPoint = null;
32944
+ })
32945
+ that.dropItem = downItem;
32946
+ that.dropList = that;
32947
+ that.dropNewIndex = that.dropIndex;
32948
+ }
32949
+
32950
+ that.dispatchEvent("dropup");
32951
+
32952
+ }, null, true); // once
32953
+ downItem.alp(.5);
32954
+ }
32955
+ });
32956
+ }
32957
+
32958
+ function disposeDrop() {
32959
+ if (that.dropDown) that.off("mousedown", that.dropDown);
32960
+ if (that.dropMove) that.off("pressmove", that.dropMove);
32961
+ if (that.dropStage) frame.stage.off("stagemousemove", that.dropStage);
32962
+ zim.loop(dropTargets, function(target) {
32963
+ if (target.scrollInt) target.scrollInt.clear();
32964
+ });
32965
+ dropTargets = [];
32966
+ dropCheck = false;
32967
+ }
32968
+
32969
+ Object.defineProperty(that, 'drop', {
32970
+ get: function() {
32971
+ return drop;
32972
+ },
32973
+ set: function(value) {
32974
+ drop = value;
32975
+ if (value) {
32976
+ makeDrop(); // if already made, it will just return
32977
+ // if not in dropTarget, add it
32978
+ if (!dropTargets.includes(that)) dropTargets.unshift(that);
32979
+ } else {
32980
+ // if in dropTarget, remove it
32981
+ if (dropTargets) {
32982
+ var ii = dropTargets.indexOf(that);
32983
+ if (ii >= 0) dropTargets.splice(ii, 1);
32984
+ if (dropTargets.length == 0) disposeDrop();
32985
+ }
32986
+ }
32987
+ }
32988
+ });
32989
+
32990
+ that.updateDrop = function() {
32991
+ zim.loop(dropTargets, function(target) {
32992
+ target.zgb = target.boundsToGlobal();
32993
+ target.zgs = target.getConcatenatedDisplayProps().matrix.decompose().scaleX/frame.stage.scaleX;
32994
+ });
32995
+ return that;
32996
+ }
32997
+
32998
+ Object.defineProperty(that, 'dropTargets', {
32999
+ get: function() {
33000
+ return dropTargets;
33001
+ },
33002
+ set: function(value) {
33003
+ dropTargets = value;
33004
+ var already = false
33005
+ // makeDrop will handle things
33006
+ already = makeDrop(); // if already made, it will just return true
33007
+ if (already) { // then need to handle new list
33008
+ if (value && !Array.isArray(dropTargets)) dropTargets = [dropTargets];
33009
+ if (!dropTargets) dropTargets = [];
33010
+ if (drop && !dropTargets.includes(that)) dropTargets.unshift(that);
33011
+ zim.loop(dropTargets, function(target) {
33012
+ if (target.dropReticle) target.dropReticle.dispose();
33013
+ target.dropReticle = new zim.Rectangle(20,20,clear,dropColor,dropThickness).reg(CENTER).rot(45).alp(dropReticleAlpha);
33014
+ target.zgb = target.boundsToGlobal();
33015
+ target.zgs = target.getConcatenatedDisplayProps().matrix.decompose().scaleX/zdf.stage.scaleX;
33016
+ target.dropReticleIndex = null;
33017
+ });
33018
+ if (dropTargets.length == 0) disposeDrop();
33019
+ }
33020
+ }
33021
+ });
33022
+
33023
+ Object.defineProperty(that, 'dropColor', {
33024
+ get: function() {
33025
+ return dropColor;
33026
+ },
33027
+ set: function(value) {
33028
+ dropColor = value;
33029
+ zim.loop(dropTargets, function(target) {
33030
+ if (target.dropReticle) target.dropReticle.borderColor = value;
33031
+ });
33032
+ }
33033
+ });
33034
+
33035
+ // END DROP - Also see gets setter methods lower below
33036
+
33037
+
32519
33038
 
32520
33039
  Object.defineProperty(that, 'items', {
32521
33040
  get: function() {
@@ -32797,7 +33316,7 @@ added, click, dblclick, mousedown, mouseout, mouseover, pressdown (ZIM), pressmo
32797
33316
 
32798
33317
  if (style!==false) zim.styleTransforms(this, DS);
32799
33318
  this.clone = function() {
32800
- return that.cloneProps(new zim.List(width, originalHeight, zim.copy(that.originalList, true), viewNum, vertical, currentSelected, align, valign, labelAlign, labelValign, labelIndent, labelIndentH, labelIndentV, indent, spacing, backgroundColor, rollBackgroundColor, downBackgroundColor, selectedBackgroundColor, selectedRollBackgroundColor, backdropColor, color, rollColor, downColor, selectedColor, selectedRollColor, originalBorderColor, originalBorderWidth, padding, zim.copy(corner), swipe, scrollBarActive, scrollBarDrag, scrollBarColor, scrollBarAlpha, scrollBarFade, scrollBarH, scrollBarV, scrollBarOverlay, slide, slideFactor, slideSnap, slideSnapDamp, shadowColor, shadowBlur, paddingH, paddingV, scrollWheel, damp, titleBar, titleBarColor, titleBarBackgroundColor, titleBarHeight, draggable, boundary, onTop, close, closeColor, collapse, collapseColor, collapsed, excludeCustomTap, organizer, checkBox, pulldown, clone, cancelCurrentDrag, index, noScale, pulldownToggle, optimize, keyEnabled, resizeHandle, resizeBoundary, resizeVisible, continuous, closeOthers, selectedIndex, style, this.group, inherit));
33319
+ return that.cloneProps(new zim.List(width, originalHeight, zim.copy(that.originalList, true), viewNum, vertical, currentSelected, align, valign, labelAlign, labelValign, labelIndent, labelIndentH, labelIndentV, indent, spacing, backgroundColor, rollBackgroundColor, downBackgroundColor, selectedBackgroundColor, selectedRollBackgroundColor, backdropColor, color, rollColor, downColor, selectedColor, selectedRollColor, originalBorderColor, originalBorderWidth, padding, zim.copy(corner), swipe, scrollBarActive, scrollBarDrag, scrollBarColor, scrollBarAlpha, scrollBarFade, scrollBarH, scrollBarV, scrollBarOverlay, slide, slideFactor, slideSnap, slideSnapDamp, shadowColor, shadowBlur, paddingH, paddingV, scrollWheel, damp, titleBar, titleBarColor, titleBarBackgroundColor, titleBarHeight, draggable, boundary, onTop, close, closeColor, collapse, collapseColor, collapsed, excludeCustomTap, organizer, checkBox, pulldown, clone, cancelCurrentDrag, index, noScale, pulldownToggle, optimize, keyEnabled, resizeHandle, resizeBoundary, resizeVisible, continuous, closeOthers, drop, dropTargets, dropColor, dropThickness, dropScrollSpeed, dropReticleAlpha, selectedIndex, style, this.group, inherit));
32801
33320
  };
32802
33321
  this.dispose = function(a,b,disposing) {
32803
33322
  if (!disposing) {
@@ -34012,7 +34531,7 @@ expandBarVertical - (default 0 or 20 for horizontal) set to value to expand the
34012
34531
  useLabels - (default false) - add Labels to ticks if useTicks is true - can apply STYLE
34013
34532
  labelMargin - (default 20) - distance from ticks to Label if useLabels is true
34014
34533
  labelColor - (default 20) - distance from ticks to Label if useLabels is true
34015
- range - (default null) make the slider a range slider with two circle buttons
34534
+ range - (default false) set to true to change to a range slider with two circle buttons
34016
34535
  this will provide read and write rangeMin, rangeMax and rangeAve values instead of value
34017
34536
  also will provide a read only rangeAmount
34018
34537
  rangeBar, rangeSliderA, rangeSliderB, rangeButtonA and rangeButtonB properties will be added
@@ -36429,6 +36948,7 @@ added, click, dblclick, mousedown, mouseout, mouseover, pressdown (ZIM), pressmo
36429
36948
 
36430
36949
  // finalize index, location, bounds
36431
36950
  function prepareAllButtons() {
36951
+
36432
36952
  var lastX = 0; var lastY = 0; var button;
36433
36953
  for (i=0; i<buttons.length; i++) {
36434
36954
  button = buttons[i];
@@ -36459,7 +36979,8 @@ added, click, dblclick, mousedown, mouseout, mouseover, pressdown (ZIM), pressmo
36459
36979
  else if (valign=="bottom") button.y = height-button.height-(button.type=="TabsButton" && !mix?0:indent);
36460
36980
  }
36461
36981
  if (i==myIndex && !currentEnabled) button.enabled = false;
36462
- else button.enabled = true;
36982
+ else button.enabled = true;
36983
+ button.visible = true; // need to override optimize
36463
36984
  }
36464
36985
 
36465
36986
  // might have to use w and h rather than width and height if run multiple times...
@@ -36556,6 +37077,7 @@ added, click, dblclick, mousedown, mouseout, mouseover, pressdown (ZIM), pressmo
36556
37077
  };
36557
37078
 
36558
37079
  this.removeAt = function(num, index) {
37080
+
36559
37081
  if (buttons.length == 0) return that;
36560
37082
  if (zot(num)) num = 1;
36561
37083
  if (zot(index)) index = buttons.length-num;
@@ -36563,7 +37085,7 @@ added, click, dblclick, mousedown, mouseout, mouseover, pressdown (ZIM), pressmo
36563
37085
 
36564
37086
  // adjust selection
36565
37087
  if (myIndex >= index && myIndex <= index+num) myIndex = -1;
36566
- if (myIndex > index+num) myIndex -= num;
37088
+ if (myIndex > index+num) myIndex -= num;
36567
37089
 
36568
37090
  // remove listeners
36569
37091
  for (i=index; i<index+num; i++) {
@@ -36575,6 +37097,8 @@ added, click, dblclick, mousedown, mouseout, mouseover, pressdown (ZIM), pressmo
36575
37097
  else buttons[i].off((!zns?WW.ACTIONEVENT=="mousedown":zim.ACTIONEVENT=="mousedown")?"mousedown":"click", buttons[i].zimTabEvent);
36576
37098
  buttons[i].removeFrom();
36577
37099
  }
37100
+
37101
+
36578
37102
  // splice from buttons and labels from labels
36579
37103
  buttons.splice(index, num);
36580
37104
  labels.splice(index, num);
@@ -48983,6 +49507,7 @@ RETURNS obj for chaining
48983
49507
  }
48984
49508
  return {x:x,y:y};
48985
49509
  }
49510
+ obj.zimCheckBounds = checkBounds;
48986
49511
 
48987
49512
  function testMove(o,x,y,desiredX,desiredY) {
48988
49513
  if (Math.abs(o.x-lastX) < .1 && Math.abs(o.y-lastY) < .1) {
@@ -49125,13 +49650,15 @@ END EXAMPLE
49125
49650
 
49126
49651
  PARAMETERS
49127
49652
  recursive (default true) - turns off drags on children
49653
+ snapBack (default true) - if outside of bounds will animate back to inside bounds
49128
49654
 
49129
49655
  RETURNS obj for chaining
49130
49656
  --*///+32
49131
- zim.noDrag = function(obj, recursive) {
49657
+ zim.noDrag = function(obj, recursive, snapBack) {
49132
49658
  z_d("32");
49133
49659
  if (zot(obj) || !obj.on) return;
49134
49660
  if (zot(recursive)) recursive = true;
49661
+ if (zot(snapBack)) snapBack = true;
49135
49662
  if (recursive && obj.numChildren && obj.numChildren > 1) {
49136
49663
  for (var i=0; i<obj.numChildren; i++) {
49137
49664
  var o = obj.getChildAt(i);
@@ -49152,9 +49679,15 @@ RETURNS obj for chaining
49152
49679
  if (obj.stage) obj.stage.frame.off("mouseupplus", obj.zmu);
49153
49680
  else WW.zdf.off("mouseupplus", obj.zmu);
49154
49681
  }
49155
- if (zim.Ticker) {
49156
- if (obj.zimDragSlide) zim.Ticker.remove(obj.zimDragSlide);
49157
- if (obj.zimDragTicker) zim.Ticker.remove(obj.zimDragTicker);
49682
+ if (zim.Ticker) {
49683
+ if (obj.zimDragSlide) zim.Ticker.remove(obj.zimDragSlide);
49684
+ if (obj.zimDragTicker) {
49685
+ zim.Ticker.remove(obj.zimDragTicker);
49686
+ if (snapBack) {
49687
+ var f = obj.zimCheckBounds(obj, obj.x, obj.y);
49688
+ obj.animate({x:f.x, y:f.y}, .3);
49689
+ }
49690
+ }
49158
49691
  }
49159
49692
  obj.zimDragMoving=obj.zimAdded=obj.zimRemoved=obj.zimDown=obj.zimMove=obj.zimUp=obj.zimBoundary=obj.zimDragSlide=null;
49160
49693
  obj.slideStartX = obj.slideStartY = obj.zimDragImmediate = null;
@@ -51843,7 +52376,8 @@ addPhysics
51843
52376
  zim DisplayObject method
51844
52377
 
51845
52378
  DESCRIPTION
51846
- Add Physics to a DisplayObject. DisplayObject should be centerReg() on the stage (or in non-transformed Container at 0,0 on stage)
52379
+ Add Physics to a DisplayObject. DisplayObject should have its registration point centered reg(CENTER) or centerReg()
52380
+ and be on the stage (or in non-transformed Container at 0,0 on stage)
51847
52381
  The Physics world can be set up with the ZIM Physics() class in the Controls module.
51848
52382
  Box2D and ZIM physics JavaScript helper module need to be imported.
51849
52383
  If no physics world has been created, the addPhysics() method will create a default world.
@@ -52680,7 +53214,7 @@ var circle = new Circle(50, red)
52680
53214
  from:true
52681
53215
  });
52682
53216
  // toggle pause the circle when stage is pressed
52683
- S.on("stagemousedown", function() {
53217
+ S.on("stagemousedown", ()=>{
52684
53218
  circle.pauseAnimate(!circle.paused);
52685
53219
  });
52686
53220
  END EXAMPLE
@@ -52734,7 +53268,6 @@ const rect = new Rectangle({color:pink})
52734
53268
  .sca(0); // hiding it to start
52735
53269
 
52736
53270
  const circle = new Circle({color:purple}) // chaining the rest
52737
- .addTo(stage)
52738
53271
  .pos(400,300)
52739
53272
  .animate({ // circle will be the default object for the inner animations
52740
53273
  props:[
@@ -52755,7 +53288,7 @@ const circle = new Circle({color:purple}) // chaining the rest
52755
53288
  });
52756
53289
 
52757
53290
  var paused = false;
52758
- S.on("stagemousedown", () => {
53291
+ S.on("stagemousedown", ()=>{
52759
53292
  paused = !paused;
52760
53293
  pauseAnimate(paused, "square");
52761
53294
  });
@@ -52763,7 +53296,7 @@ END EXAMPLE
52763
53296
 
52764
53297
  EXAMPLE
52765
53298
  // sequence example to pulse two circles
52766
- const circles = new Container(W, H).addTo(stage);
53299
+ const circles = new Container(W, H).addTo();
52767
53300
  const circle1 = new Circle(50, red).center(circles);
52768
53301
  const circle2 = new Circle(50, blue).center(circles).mov(70);
52769
53302
  circles.animate({
@@ -52940,6 +53473,7 @@ props - the object literal holding properties and values to animate
52940
53473
  time - |ZIM VEE| (default 1) the time for the tween in seconds (also see ZIM TIME constant)
52941
53474
  see also the rate parameter and property to dynamically change the time the animation takes (its speed)
52942
53475
  ease - |ZIM VEE| (default "quadInOut") the equation type for easing ("bounceOut", "elasticIn", "backInOut", "linear", etc)
53476
+ no ease is "linear" or "none"- this is often good for constantly falling or rotating objects
52943
53477
  also ZIM preset eases: "snapIn", "snapOut", "snapInOut", "ballisticIn", "ballisticOut", "ballisticInOut", "slowmoIn", "slowmoOut", "slowmoInOut"
52944
53478
  ** CUSTOM EASE: see https://zimjs.com/ease for custom ease which can be passed in here as a value like so:
52945
53479
  ease:zimEase([.2,.4,.6,.8]) // would be linear
@@ -53082,7 +53616,7 @@ easeAmount - |ZIM VEE| (default null) set to change the tween effect
53082
53616
  quint (default 5) - exponent
53083
53617
  back (default 1.7) - strength
53084
53618
  elastic (default 1) - amplitude - also see easeFrequency
53085
- linear, bounce, circ, sin - no affect
53619
+ linear/none, bounce, circ, sin - no affect
53086
53620
  Note: used mostly with back and elastic (backIn, backOut, backInOut, etc.)
53087
53621
  as setting the tween to quadInOut and then easeAmount to 5
53088
53622
  would be the same as a quintInOut.
@@ -53236,6 +53770,7 @@ RETURNS the target for chaining (or null if no target is provided and run on zim
53236
53770
  if (zikTypes.indexOf(prop) >= 0) cjsProps[prop] = zim.Pick.choose(cjsProps[prop]);
53237
53771
  }
53238
53772
  }
53773
+ if (ease == "none") ease = "linear";
53239
53774
 
53240
53775
  // CJSPROPS
53241
53776
  // convert loop and rewind properties into the legacy cjs props object
@@ -56427,7 +56962,7 @@ RETURNS any value returned from the loop - or true if no value is returned from
56427
56962
  }
56428
56963
  length = type=="number"?obj:obj.length;
56429
56964
  total = getTotal(length-1);
56430
- if (total == 0) return;
56965
+ if (total == 0) return true;
56431
56966
  if (reverse) {
56432
56967
  if (interval === 0) {
56433
56968
  for(i=start; i>=end; i-=step) {
@@ -56513,7 +57048,7 @@ RETURNS any value returned from the loop - or true if no value is returned from
56513
57048
  props.push(i);
56514
57049
  }
56515
57050
  total = getTotal(length-1);
56516
- if (total == 0) return;
57051
+ if (total == 0) return true;
56517
57052
  if (reverse) {
56518
57053
  if (interval === 0) {
56519
57054
  for(i=start; i>=end; i-=step) {
@@ -56842,7 +57377,7 @@ zim DisplayObject method
56842
57377
  DESCRIPTION
56843
57378
  Returns a createjs Rectangle of the bounds of object projected onto the stage.
56844
57379
  Handles scaling and rotation.
56845
- If a createjs rectangle is passed in then it converts this rectangle
57380
+ If a ZIM Boundary object (or CreateJS Rectangle) is passed in then it converts this rectangle
56846
57381
  from within the frame of the obj to a global rectangle.
56847
57382
  If flip (default false) is set to true it goes from global to local rect.
56848
57383
  Used by drag() and hitTestBounds() above - probably you will not use this directly.
@@ -56852,7 +57387,7 @@ zog(circle.boundsToGlobal().x); // global x of circle
56852
57387
  END EXAMPLE
56853
57388
 
56854
57389
  PARAMETERS
56855
- rect - (default null) a rect inside an object which you would like mapped to global
57390
+ rect - (default null) a ZIM Boundary() object or CreateJS Rectangle inside an object which you would like mapped to global
56856
57391
  flip - (default false) make a global rect ported to local values
56857
57392
  inside - (default false) [NOT WORKING YET] make a rectangle from smallest projection rather than largest
56858
57393
  globalObj - (default stage) project rectangle into a Container other than the stage
@@ -59186,7 +59721,7 @@ transition - (default "none") the type of transition "none", "reveal", "slide",
59186
59721
  NOTE: if using pages that are smaller than the stage, use a Rectangle() as the holder
59187
59722
  and the transition effects will be automatically masked by the rectangle.
59188
59723
  speed - (default .2) speed in seconds of the transition if set (see also ZIM TIME constant)
59189
- transitionTable - (default none) an array to override general transitions with following format:
59724
+ transitionTable - (default "none") an array to override general transitions with following format:
59190
59725
  [[fromPage, toPage, "transition", seconds(optional)], etc.]
59191
59726
  holder - (default the default stage) where are we putting the pages (used for setting transition properties)
59192
59727
  If using pages that are smaller than the stage
@@ -59985,6 +60520,7 @@ Additional "mousedown", "click" or other button events can be added if desired
59985
60520
  this.group = group;
59986
60521
  var DS = style===false?{}:zim.getStyle("Arrow", this.group, inherit);
59987
60522
 
60523
+ if (zot(pages)) pages = DS.pages!=null?DS.pages:null;
59988
60524
  if (zot(direction)) direction = DS.direction!=null?DS.direction:"right";
59989
60525
  if (zot(backgroundColor)) backgroundColor = DS.backgroundColor!=null?DS.backgroundColor:zim.blue;
59990
60526
  this.arrowBackgroundColor = backgroundColor;
@@ -62323,8 +62859,8 @@ note: the item is not the event object target - as that is the tile
62323
62859
  if (!zot(width)) colSize = null; // width and height override sizes
62324
62860
  if (!zot(height)) rowSize = null;
62325
62861
 
62326
- if (zot(spacingH)) spacingH = DS.spacingH!=null?DS.spacingH:defaultFlag?3:null;
62327
- if (zot(spacingV)) spacingV = DS.spacingV!=null?DS.spacingV:defaultFlag?3:null;
62862
+ if (zot(spacingH)) spacingH = DS.spacingH!=null?DS.spacingH:null;
62863
+ if (zot(spacingV)) spacingV = DS.spacingV!=null?DS.spacingV:null;
62328
62864
  var spacingHO = spacingH;
62329
62865
  var spacingVO = spacingV;
62330
62866
  if (zot(spacingH) || !zot(colSize) || !zot(width)) spacingH = 0; // sizes override spacing
@@ -70191,7 +70727,7 @@ dispatches a "moving" event if target is moving and "startmoving" and "stopmovin
70191
70727
  if (target.type == "Pen") target.write = false;
70192
70728
  mouseEvent = stage.on("stagemousedown", function(e) {
70193
70729
  var pp;
70194
- // if (target.type == "Pen" || type == "pressmove") {
70730
+ if (target.type == "Pen" && target.draggingCheck) zogb();
70195
70731
  var con;
70196
70732
  if (!mouseOutside && that.boundary && !that.boundary.type=="Blob") con = that.boundary;
70197
70733
  else if (!mouseOutside && container && container.boundsToGlobal) con = container.boundsToGlobal();
@@ -70346,7 +70882,7 @@ dispatches a "moving" event if target is moving and "startmoving" and "stopmovin
70346
70882
  function moveMe() {
70347
70883
  var p = container.globalToLocal(that.moveX, that.moveY);
70348
70884
  that.x = p.x; that.y = p.y;
70349
- calculate();
70885
+ calculate();
70350
70886
  if (target.type == "Pen" && !moveCheck && target.drawing) moveCheck = true;
70351
70887
  }
70352
70888
 
@@ -70430,6 +70966,7 @@ dispatches a "moving" event if target is moving and "startmoving" and "stopmovin
70430
70966
  var lastDirY=0;
70431
70967
 
70432
70968
  var mainTicker = zim.Ticker.add(function() {
70969
+ if (target.draggingCheck) return;
70433
70970
  if (type == "manual") calculate();
70434
70971
  if (that.boundary && that.boundary.type!="Blob") {
70435
70972
  that.x = zim.constrain(that.x, that.boundary.x, that.boundary.x+that.boundary.width);
@@ -73314,7 +73851,10 @@ ALSO See the CreateJS Easel Docs for Filter methods, such as: getBounds()
73314
73851
 
73315
73852
  this.alphaMask = mask;
73316
73853
  var that = this;
73317
- if (dynamic) this.ticker = zim.Ticker.add(function(){that.alphaMask.updateCache()});
73854
+ if (dynamic) {
73855
+ if (!that.alphaMask.cacheCanvas) that.alphaMask.cache();
73856
+ this.ticker = zim.Ticker.add(function(){that.alphaMask.updateCache()});
73857
+ }
73318
73858
 
73319
73859
  // VEE
73320
73860
  var oa = remember(mask);
@@ -73835,7 +74375,7 @@ paused - read-only boolean whether the parallax is paused - see pause() and star
73835
74375
  var factor = (zot(layer.factor)) ? 1 : layer.factor;
73836
74376
  var integer = (zot(layer.integer)) ? false : layer.integer;
73837
74377
 
73838
- // baseMin, baseMax, targetMin, targetMax, damp, factor, targetRound, clamp
74378
+ // baseMin, baseMax, targetMin, targetMax, damp, factor, targetRound, clamp, clampMin, clampMax
73839
74379
  obj["p_"+obj.prop] = new zim.ProportionDamp(inMin, inMax, 0, obj[obj.prop], _damp, factor, integer, clamp);
73840
74380
  if (obj.prop == "scale") {
73841
74381
  obj["s_"+obj.prop] = obj.obj.scaleX; // helper to allow scale to be property
@@ -78451,6 +78991,49 @@ pen.animate({
78451
78991
  })
78452
78992
  END EXAMPLE
78453
78993
 
78994
+ EXAMPLE
78995
+ // A Pen used on two different Pages with ZIM Pages
78996
+ // See https://zimjs.com/zapp/Z_VKB33
78997
+
78998
+ const page1 = new Page(W,H,orange,red);
78999
+ page1.paper = new Container(W,H).addTo(page1);
79000
+ const page2 = new Page(W,H,pink,purple);
79001
+ page2.paper = new Container(W,H).addTo(page2);
79002
+
79003
+ const pages = new Pages([page1, page2]).addTo();
79004
+ pages.active = false; // so drawing does not accidentally swipe pages
79005
+
79006
+ STYLE = {
79007
+ Arrow: {
79008
+ type:"angle",
79009
+ pages:pages,
79010
+ direction:series(RIGHT, LEFT),
79011
+ trans:"fan",
79012
+ rotation:series(0,180)
79013
+ }
79014
+ }
79015
+ const next = new Arrow().pos(50,50,RIGHT,BOTTOM);
79016
+ const prev = new Arrow().pos(50,50,LEFT,BOTTOM);
79017
+
79018
+ const pen = new Pen({
79019
+ paper:page1.paper,
79020
+ size:20,
79021
+ color:series(white,black)
79022
+ }).addTo();
79023
+
79024
+ // switch papers
79025
+ pages.on("page", ()=>{
79026
+ pen.paper = pages.page.paper;
79027
+ });
79028
+
79029
+ new MotionController({
79030
+ target:pen,
79031
+ type:"pressmove",
79032
+ speed:40,
79033
+ mousedownIncludes:[pages] // so will track mouse on pages
79034
+ });
79035
+ END EXAMPLE
79036
+
78454
79037
  PARAMETERS
78455
79038
  ** supports DUO - parameters or single object with properties below
78456
79039
  ** supports VEE - parameters marked with ZIM VEE mean a zim Pick() object or Pick Literal can be passed
@@ -78511,12 +79094,8 @@ saveState(obj, startLayer, endLayer) - record an undo state for the paper or a l
78511
79094
  startLayer and endLayer are for if the layer level of the shape changes
78512
79095
  undo() - go back one undo state (called automatically by CTRL Z if undoKeys is true - default)
78513
79096
  redo() - go forward one undo state (called automatically by CTRL Y or CTRL SHIFT Z if undoKeys is true - default)
78514
- delete(index) - delete a line segment at a given index (actually sets its alpha to 0 to maintain layers on undo)
78515
- use: pen.paper.on("mousedown", function (e) {
78516
- pen.delete(paper.getChildIndex(e.target)); // for instance
78517
- })
78518
79097
  deleteSegment(object) - delete a line segment object
78519
- use: pen.paper.on("mousedown", function (e) {
79098
+ use: pen.paper.on("mousedown", e => {
78520
79099
  pen.deleteSegment(e.target); // for instance
78521
79100
  })
78522
79101
  clone() - clone the pen (note there is no exact clone)
@@ -79179,6 +79758,7 @@ dispatches an "undo" and a "redo" whenever undo and redo happens
79179
79758
  });
79180
79759
  paper.drag({onTop:onTop});
79181
79760
  paper.on("pressup", function (e) {
79761
+ that.draggingCheck = false;
79182
79762
  if (deleteable && that.shiftKey) return;
79183
79763
  // if (e.target.alpha == 0) return;
79184
79764
  if (e.target.visible == false) return;
@@ -81993,6 +82573,18 @@ EXAMPLE
81993
82573
  new Pane({content:"START", keyboardAccess:true}).show();
81994
82574
  END EXAMPLE
81995
82575
 
82576
+ EXAMPLE
82577
+ // dynamically adjusting touch - there are also touch and singleTouch parameters of Frame
82578
+ // also, drag() has its own singleTouch parameter
82579
+ const radio = new RadioButtons(30, ["MULTI TOUCH", "SINGLE TOUCH", "NO TOUCH"]).center().mov(0,-200).change(()=>{
82580
+ if (radio.text.includes("MULTI")) F.singleTouch = false;
82581
+ else if (radio.text.includes("SINGLE")) F.singleTouch = true;
82582
+ else F.touch = false;
82583
+ });
82584
+ new Circle(50,white,red,5).center().mov(-100,50).drag();
82585
+ new Circle(50,white,purple,5).center().mov(100,50).drag();
82586
+ END EXAMPLE
82587
+
81996
82588
  PARAMETERS supports DUO - parameters or single object with properties below
81997
82589
  scaling - (default FULL) can have values as follows
81998
82590
  Note: as of ZIM Cat 04, the constant FIT or the string "fit", etc. can be used
@@ -82041,7 +82633,9 @@ ticker - (default null) - an optional callback function to be added to the ZIM T
82041
82633
  progress - (default null) - set to a Waiter() or ProgressBar() object to show while loading
82042
82634
  rollover - (default true or false on mobile) activates rollovers
82043
82635
  touch - (default true) activates touch on mobile - this will be multitouch by default
82044
- set to false for no touch on mobile - also see singleTouch parameter to set singleTouch
82636
+ set to false for no touch on mobile
82637
+ also see singleTouch parameter to set singleTouch
82638
+ also see touch and singleTouch properties
82045
82639
  scrollTop - (default false) activates scrolling on older apple devices to hide the url bar
82046
82640
  align - (default CENTER) for FIT and FILL, the horizontal alignment LEFT, CENTER, RIGHT
82047
82641
  valign - (default CENTER) for FIT and FILL, the vertical alignment TOP, CENTER, BOTTOM
@@ -82090,6 +82684,7 @@ maxNum - for sound this is how many instances of the sound can play at once
82090
82684
  also see sound interrupt parameter
82091
82685
  singleTouch - set to true for single touch rather than the default multitouch (or touch false)
82092
82686
  this will override the touch setting to turn touch to true
82687
+ also see touch and singleTouch properties
82093
82688
 
82094
82689
  METHODS
82095
82690
  loadAssets(assets, path, progress, xhr, time, loadTimeout, outputAudioSprite, crossOrigin, fileType, queueOnly, maxConnections, maxNum) |ZIM DUO| also accepts ZIM DUO configuration object as single parameter
@@ -82373,7 +82968,11 @@ zil - reference to zil events that stop canvas from shifting or scrolling - also
82373
82968
  can set allowDefault property to false then allow specific defaults by removing zil events - see zil global function
82374
82969
  example: window.removeEventListener("keydown", F.zil[0]); removes keydown preventions (for page up, page down, home, end, etc)
82375
82970
  allowDefault - set to true to remove zil or false to set zil (see above) also affects body overflow
82376
- colors: orange, green, pink, blue, brown, yellow, red, purple, silver, tin, grey, lighter, moon, light, dark, darker, white, black, clear (0 alpha), faint (.01 alpha)
82971
+ touch - get or set the touch setting - setting to false will not allow touch on mobile
82972
+ also see touch and singleTouch parameters and singleTouch property
82973
+ singleTouch - get or set the singleTouch setting - set to true to turn on single touch and false to turn on multitouch
82974
+ setting either true or false will set the touch property to true
82975
+ also see the touch and singleTouch parameters and touch property
82377
82976
  followBoundary - update with a ZIM Boundary for follow() if "full" mode Frame "resize" event happens, etc.
82378
82977
  altKey - true if the alt key is being pressed otherwise false
82379
82978
  ctrlKey - true if the ctrl key is being pressed otherwise false
@@ -83199,6 +83798,7 @@ zim.Frame = function(scaling, width, height, color, outerColor, ready, assets, p
83199
83798
 
83200
83799
  // ASSETS
83201
83800
  this.loadAssets = function(assets, path, progress, xhr, time, loadTimeout, outputAudioSprite, crossOrigin, fileType, queueOnly, maxConnections, maxNum) {
83801
+
83202
83802
  if (zot(assets)) return endEarly();
83203
83803
  if (zot(assets.src)) { // might be sending single parameter of asset object or audiosprite
83204
83804
  var sig = "assets, path, progress, xhr, time, loadTimeout, outputAudioSprite, crossOrigin, fileType, queueOnly, maxConnections, maxNum";
@@ -83948,6 +84548,31 @@ zim.Frame = function(scaling, width, height, color, outerColor, ready, assets, p
83948
84548
  }
83949
84549
  });
83950
84550
 
84551
+ Object.defineProperty(that, 'touch', {
84552
+ get: function() {
84553
+ return touch;
84554
+ },
84555
+ set: function(value) {
84556
+ touch = value;
84557
+ createjs.Touch.disable(that.stage);
84558
+ if (touch) {
84559
+ createjs.Touch.enable(that.stage, singleTouch); // true for single touch, false for multitouch
84560
+ }
84561
+ }
84562
+ });
84563
+
84564
+ Object.defineProperty(that, 'singleTouch', {
84565
+ get: function() {
84566
+ return singleTouch;
84567
+ },
84568
+ set: function(value) {
84569
+ singleTouch = value;
84570
+ touch = true;
84571
+ createjs.Touch.disable(that.stage);
84572
+ createjs.Touch.enable(that.stage, singleTouch); // true for single touch, false for multitouch
84573
+ }
84574
+ });
84575
+
83951
84576
 
83952
84577
  // CURSOR SYSTEM WITH CUR()
83953
84578
  // added ZIM 014
@@ -86525,9 +87150,9 @@ alpha, cursor, shadow, name, mouseChildren, mouseEnabled, parent, numChildren, e
86525
87150
  zim.extend(zim.PermissionAsk, zim.Pane, null, "zimPane", false);//-83.01
86526
87151
 
86527
87152
  /*--
86528
- Colors - orange, green, pink, blue, brown, yellow, purple, red, interstellar, black, darker, licorice, dark, charcoal, grey, gray, granite, tin, pewter, silver, fog, mist, light, moon, lighter, white, faint, clear
87153
+ Colors - red, salmon, orange, green, pink, blue, brown, yellow, purple, interstellar, black, darker, licorice, dark, charcoal, grey, gray, granite, tin, pewter, silver, fog, mist, light, moon, lighter, white, faint, clear
86529
87154
 
86530
- Colors - orange, green, pink, blue, brown, yellow, purple, red, interstellar, black, darker, licorice, dark, charcoal, grey, gray, granite, tin, pewter, silver, fog, mist, light, moon, lighter, wh¡te, faint, clear
87155
+ Colors - red, salmon, orange, green, pink, blue, brown, yellow, purple, interstellar, black, darker, licorice, dark, charcoal, grey, gray, granite, tin, pewter, silver, fog, mist, light, moon, lighter, wh¡te, faint, clear
86531
87156
  zim constants (lowercase)
86532
87157
 
86533
87158
  DESCRIPTION
@@ -86586,12 +87211,13 @@ new Circle(100, blue.darken(.5)).center();
86586
87211
  new Circle(100, blue.toColor(red, .2)).center();
86587
87212
  END EXAMPLE
86588
87213
  --*///+83.55
86589
- zim.colorsHex = ["#fb4758","#f58e25","#ebcb35","#acd241","#50c4b7","#993399","#e472c4","#d1a170","#112233","#000000","#111111","#222222","#333333","#444444","#555555","#555555","#666666","#777777","#888888","#999999","#aaaaaa","#bbbbbb","#cccccc","#dddddd","#eeeeee","#ffffff","rgba(0,0,0,.01)","rgba(0,0,0,0)"];
86590
- zim.colors = ["red","orange","yellow","green","blue","purple","pink","brown","interstellar","black","darker","licorice","dark","charcoal","grey","gray","granite","tin","pewter","silver","fog","mist","light","moon","lighter","white","faint","clear"];
87214
+ zim.colorsHex = ["#fb4758","#fa8072","#f58e25","#ebcb35","#acd241","#50c4b7","#993399","#e472c4","#d1a170","#112233","#000000","#111111","#222222","#333333","#444444","#555555","#555555","#666666","#777777","#888888","#999999","#aaaaaa","#bbbbbb","#cccccc","#dddddd","#eeeeee","#ffffff","rgba(0,0,0,.01)","rgba(0,0,0,0)"];
87215
+ zim.colors = ["red","salmon","orange","yellow","green","blue","purple","pink","brown","interstellar","black","darker","licorice","dark","charcoal","grey","gray","granite","tin","pewter","silver","fog","mist","light","moon","lighter","white","faint","clear"];
86591
87216
  for (z_i=0; z_i<zim.colors.length; z_i++) {
86592
87217
  zim[zim.colors[z_i]] = zim.colorsHex[z_i];
86593
87218
  }
86594
87219
  // zim.red = "#fb4758"; // red dedicated to Alexa
87220
+ // zim.salmon = "#FFE5B4";
86595
87221
  // zim.orange = "#f58e25";
86596
87222
  // zim.yellow = "#ebcb35";
86597
87223
  // zim.green = "#acd241";
@@ -88781,7 +89407,7 @@ but usually, just pass the callback as the first parameter
88781
89407
  tile.center(pane);
88782
89408
  }
88783
89409
 
88784
- if (M && !( WW.matchMedia('(display-mode: standalone)').matches || (WW.navigator.standalone) || document.referrer.includes('android-app://') )) {
89410
+ if (M && !( WW.matchMedia('(display-mode: fullscreen)').matches || WW.matchMedia('(display-mode: standalone)').matches || (WW.navigator.fullscreen) || (WW.navigator.standalone) || document.referrer.includes('android-app://') )) {
88785
89411
  showMessage();
88786
89412
  } else {
88787
89413
  if (call && call.constructor === Function) call();
@@ -89283,6 +89909,8 @@ riveevent - dispatched when a Rive Event gets reported
89283
89909
 
89284
89910
  this.canvas = riveCanvas;
89285
89911
  riveCanvas.style.visibility = "hidden";
89912
+ riveCanvas.style.position = "absolute";
89913
+ riveCanvas.style.top = "0px";
89286
89914
  var riveObj = {canvas:riveCanvas, src:src, buffer:buffer, file:file, artboard:artboard, animations:animations, stateMachines:stateMachines, layout:layout, autoplay:autoplay, useOffscreenRenderer:useOffscreenRenderer, enableRiveAssetCDN:enableRiveAssetCDN, shouldDisableRiveListeners:shouldDisableRiveListeners, isTouchScrollEnabled:isTouchScrollEnabled, automaticallyHandleEvents:automaticallyHandleEvents, onLoad:null, onLoadError:onLoadError, onPlay:onPlay, onPause:onPause, onStop:onStop, onLoop:onLoop, onStateChange:onStateChange, onAdvance:onAdvance, assetLoader:assetLoader};
89287
89915
  this.super_constructor(riveObj);
89288
89916
  this.type = "Rive";
@@ -89414,6 +90042,8 @@ pointerup - dispatches a pointerup event when pointer is up
89414
90042
 
89415
90043
  this.canvas = riveCanvas;
89416
90044
  riveCanvas.style.visibility = "hidden";
90045
+ riveCanvas.style.position = "absolute";
90046
+ riveCanvas.style.top = "0px";
89417
90047
  this.type = "RiveListener";
89418
90048
 
89419
90049