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/package.json +1 -1
- package/src/zim.js +709 -79
- package/ts-src/typings/zim/index.d.ts +92 -65
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(
|
|
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(
|
|
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
|
|
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
|
-
|
|
5641
|
-
|
|
5642
|
-
|
|
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
|
|
5663
|
+
RETURNS a positive Number that is the angle between first and second point
|
|
5645
5664
|
--*///+13.4
|
|
5646
|
-
zim.angle = function(
|
|
5665
|
+
zim.angle = function(a, b, c, d) {
|
|
5647
5666
|
if (!zim.angleCheck) {z_d("13.4"); zim.angleCheck = true;}
|
|
5648
|
-
if (zot(
|
|
5649
|
-
if (zot(
|
|
5650
|
-
|
|
5651
|
-
|
|
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 (
|
|
7223
|
-
|
|
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 (
|
|
7321
|
-
|
|
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
|
-
|
|
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(
|
|
22453
|
-
or animate as a sequence labels.animate({props:{scale:1.5}, loop:true, rewind:true, sequence
|
|
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,
|
|
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
|
|
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 &&
|
|
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
|
|
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)
|
|
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
|
|
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",
|
|
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(
|
|
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
|
|
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
|
|
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:
|
|
62327
|
-
if (zot(spacingV)) spacingV = DS.spacingV!=null?DS.spacingV:
|
|
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
|
-
|
|
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)
|
|
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",
|
|
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
|
|
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
|
-
|
|
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,
|
|
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,
|
|
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
|
|