zimjs 16.2.5 → 16.2.6
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 +179 -160
- package/ts-src/typings/zim/index.d.ts +4 -0
package/package.json
CHANGED
package/src/zim.js
CHANGED
|
@@ -3458,8 +3458,8 @@ NOTE: as of ZIM 5.5.0 the zim namespace is no longer required (unless zns is set
|
|
|
3458
3458
|
EXAMPLE
|
|
3459
3459
|
const blob = new Blob().center();
|
|
3460
3460
|
const points = blob.segmentPoints;
|
|
3461
|
-
S.on("stagemousedown",
|
|
3462
|
-
const point = blob.globalToLocal(
|
|
3461
|
+
S.on("stagemousedown", ()=>{
|
|
3462
|
+
const point = blob.globalToLocal(F.mouseX, F.mouseY)
|
|
3463
3463
|
zog(closestPointAlongCurve({x:point.x, y:point.y}, points))
|
|
3464
3464
|
// gives index of point on curve before mouse location
|
|
3465
3465
|
});
|
|
@@ -13788,7 +13788,8 @@ clone(exact) - makes a copy of the shape
|
|
|
13788
13788
|
For instance, if the object's color is [blue, green]
|
|
13789
13789
|
then its clone might be blue or green - which could be different than the original
|
|
13790
13790
|
If exact is set to true then the clone will be the color of the original object
|
|
13791
|
-
|
|
13791
|
+
Warning: clone does not clone any content added to a shape - use a Container for that - see cloneAll()
|
|
13792
|
+
cloneAll(exact, style, group, inherit) - copies shape and any custom content in shape - experimental
|
|
13792
13793
|
exact (default false) in theory will copy ZIM VEE values as they are in the original
|
|
13793
13794
|
see main class for style, group, inherit parameters
|
|
13794
13795
|
dispose() - removes from parent, removes event listeners - must still set outside references to null for garbage collection
|
|
@@ -14062,7 +14063,8 @@ clone(exact) - makes a copy of the shape
|
|
|
14062
14063
|
For instance, if the object's color is [blue, green]
|
|
14063
14064
|
then its clone might be blue or green - which could be different than the original
|
|
14064
14065
|
If exact is set to true then the clone will be the color of the original object
|
|
14065
|
-
|
|
14066
|
+
Warning: clone does not clone any content added to a shape - use a Container for that - see cloneAll()
|
|
14067
|
+
cloneAll(exact style, group, inherit) - copies shape and any custom content in shape - experimental
|
|
14066
14068
|
exact (default false) in theory will copy ZIM VEE values as they are in the original
|
|
14067
14069
|
see main class for style, group, inherit parameters
|
|
14068
14070
|
dispose() - removes from parent, removes event listeners - must still set outside references to null for garbage collection
|
|
@@ -14305,12 +14307,13 @@ if one color is used, the current color is used and color1 is the second color i
|
|
|
14305
14307
|
cache(see Container docs for parameter description) - overrides CreateJS cache() and returns object for chaining
|
|
14306
14308
|
Leave parameters blank to cache bounds of shape (plus outer edge of border if borderWidth > 0)
|
|
14307
14309
|
hasProp(property as String) - returns true if property exists on object else returns false
|
|
14308
|
-
clone() - makes a copy of the shape
|
|
14309
|
-
exact (default false) ZIM VEE (Pick) values are active in clones unless exact is set to true
|
|
14310
|
+
clone(exact) - makes a copy of the shape
|
|
14311
|
+
exact (default false) ZIM VEE (Pick) values are active in clones unless exact is set to true
|
|
14310
14312
|
For instance, if the object's color is [blue, green]
|
|
14311
14313
|
then its clone might be blue or green - which could be different than the original
|
|
14312
14314
|
If exact is set to true then the clone will be the color of the original object
|
|
14313
|
-
|
|
14315
|
+
Warning: clone does not clone any content added to a shape - use a Container for that - see cloneAll()
|
|
14316
|
+
cloneAll(exact style, group, inherit) - copies shape and any custom content in shape - experimental
|
|
14314
14317
|
exact (default false) in theory will copy ZIM VEE values as they are in the original
|
|
14315
14318
|
see main class for style, group, inherit parameters
|
|
14316
14319
|
exact (default false) in theory will copy ZIM VEE values as they are in the original
|
|
@@ -36134,6 +36137,7 @@ added, click, dblclick, mousedown, mouseout, mouseover, pressdown (ZIM), pressmo
|
|
|
36134
36137
|
this.type = "NumPad";
|
|
36135
36138
|
|
|
36136
36139
|
var that = this;
|
|
36140
|
+
|
|
36137
36141
|
|
|
36138
36142
|
function ms(letter, color) {
|
|
36139
36143
|
if (zot(color)) color = mist;
|
|
@@ -36143,7 +36147,12 @@ added, click, dblclick, mousedown, mouseout, mouseover, pressdown (ZIM), pressmo
|
|
|
36143
36147
|
ms("C",zim.red.darken(.1)),ms(new zim.Label({text:"␣", size:90, shiftV:-24}),zim.yellow.darken(.1)),ms(new zim.Label({text:"/",size:48,bold:true,shiftV:3})),ms(new zim.Label({text:"*", size:65, shiftV:18})),
|
|
36144
36148
|
1,2,3,ms(new zim.Label({text:"-",size:60,shiftV:-3})),4,5,6,ms(new zim.Label({text:"+",size:55,shiftV:3})),
|
|
36145
36149
|
7,8,9,ms(new zim.Label({text:"⌫",size:M=="ios"?60:35}), zim.red.darken(.1)),
|
|
36146
|
-
ms(new zim.Label({text:",",size:70,shiftV:-3})),ms(new Label({text:".",size:70,shiftV:-3})),0,ms(new zim.Label({text:"⏎", size:M=="ios"?40:50, shiftV:5}), zim.green.darken(.1))]
|
|
36150
|
+
ms(new zim.Label({text:",",size:70,shiftV:-3})),ms(new Label({text:".",size:70,shiftV:-3})),0,ms(new zim.Label({text:"⏎", size:M=="ios"?40:50, shiftV:5}), zim.green.darken(.1))];
|
|
36151
|
+
|
|
36152
|
+
|
|
36153
|
+
function isRTL(){
|
|
36154
|
+
return getComputedStyle(zdf.canvas).direction == "rtl";
|
|
36155
|
+
};
|
|
36147
36156
|
if (advanced=="simple") {
|
|
36148
36157
|
padArray.splice(0,4);
|
|
36149
36158
|
padArray.splice(3,1);
|
|
@@ -36155,8 +36164,8 @@ added, click, dblclick, mousedown, mouseout, mouseover, pressdown (ZIM), pressmo
|
|
|
36155
36164
|
} else if (advanced) {
|
|
36156
36165
|
padArray.splice(2,0,ms("%", yellow.darken(.1)));
|
|
36157
36166
|
padArray.splice(4,0,ms(new zim.Label({text:"^",size:47,shiftV:10}), yellow.darken(.1)));
|
|
36158
|
-
padArray.splice(4,0,ms(")", yellow.darken(.1)));
|
|
36159
|
-
padArray.splice(4,0,ms("(", yellow.darken(.1)));
|
|
36167
|
+
padArray.splice(4,0,ms(isRTL()?"(":")", yellow.darken(.1)));
|
|
36168
|
+
padArray.splice(4,0,ms(isRTL()?")":"(", yellow.darken(.1)));
|
|
36160
36169
|
}
|
|
36161
36170
|
that.pad = new zim.Pad({
|
|
36162
36171
|
width:advanced=="simple"?290:380,
|
|
@@ -39266,6 +39275,7 @@ Dispatches a "keydown" event with an event object having a letter property
|
|
|
39266
39275
|
keyboard.on("keydown", function(e) {zog(e.letter);}); // logs letter pressed or "del" for delete
|
|
39267
39276
|
Dispatches a "special" event if the special parameter is used and the special key is pressed
|
|
39268
39277
|
Dispatches a "close" event when close keyboard icon at bottom right is pressed
|
|
39278
|
+
Dispatches "numpadopen" and "numpadclose" events when the NumPad is opened or closed
|
|
39269
39279
|
|
|
39270
39280
|
ALSO: see the CreateJS Easel Docs for Container events such as:
|
|
39271
39281
|
added, click, dblclick, mousedown, mouseout, mouseover, pressdown (ZIM), pressmove, pressup, removed, rollout, rollover
|
|
@@ -40042,15 +40052,18 @@ added, click, dblclick, mousedown, mouseout, mouseover, pressdown (ZIM), pressmo
|
|
|
40042
40052
|
that.toggled = false;
|
|
40043
40053
|
removeCursorShiftMenu();
|
|
40044
40054
|
}
|
|
40055
|
+
that.dispatchEvent("numpadclose");
|
|
40045
40056
|
});
|
|
40046
40057
|
}
|
|
40047
40058
|
|
|
40048
40059
|
numPadKey.removeChildAt(2);
|
|
40049
40060
|
if (that.numPad.parent || status === false) {
|
|
40050
40061
|
that.numPad.removeFrom();
|
|
40062
|
+
that.dispatchEvent("numpadclose");
|
|
40051
40063
|
showNumPadIcon.clone().scaleTo(numPadKey, 60, 60).centerReg(numPadKey,2);
|
|
40052
40064
|
} else if (!that.numPad.parent || status === true) {
|
|
40053
40065
|
that.numPad.addTo();
|
|
40066
|
+
that.dispatchEvent("numpadopen");
|
|
40054
40067
|
hideNumPadIcon.clone().scaleTo(numPadKey, 60, 60).centerReg(numPadKey,2);
|
|
40055
40068
|
}
|
|
40056
40069
|
currentKeyboard.updateCache();
|
|
@@ -50399,9 +50412,8 @@ RETURNS obj for chaining
|
|
|
50399
50412
|
if (!redoChache) obj.updateCache();
|
|
50400
50413
|
else obj.cache();
|
|
50401
50414
|
}
|
|
50402
|
-
if (obj.alphaMask) {
|
|
50403
|
-
|
|
50404
|
-
obj.alphaMask.updateCache();
|
|
50415
|
+
if (obj.effects && obj.effects.alpha && obj.effects.alpha.alphaMask.updateCache) {
|
|
50416
|
+
obj.effects.alpha.alphaMask.updateCache();
|
|
50405
50417
|
}
|
|
50406
50418
|
return obj;
|
|
50407
50419
|
};//-33.163
|
|
@@ -57323,19 +57335,18 @@ There are settings that can adjust when the Ticker updates so see Usage notes be
|
|
|
57323
57335
|
NOTE: as of ZIM 5.5.0 the zim namespace is no longer required (unless zns is set to true before running zim)
|
|
57324
57336
|
|
|
57325
57337
|
EXAMPLE
|
|
57326
|
-
const circle = new Circle(50, red);
|
|
57327
|
-
circle.center();
|
|
57338
|
+
const circle = new Circle(50, red).center();
|
|
57328
57339
|
Ticker.add(()=>{
|
|
57329
57340
|
circle.x++;
|
|
57330
|
-
}
|
|
57341
|
+
}); // can also pass in a specific stage
|
|
57331
57342
|
|
|
57332
57343
|
// to be able to remove the function:
|
|
57333
|
-
Ticker.add(tryMe
|
|
57344
|
+
Ticker.add(tryMe);
|
|
57334
57345
|
function tryMe() {circle.x++;}
|
|
57335
57346
|
Ticker.remove(tryMe);
|
|
57336
57347
|
|
|
57337
57348
|
// OR with function literal, use the return value
|
|
57338
|
-
var tickerFunction = Ticker.add(()=>{circle.x++;}
|
|
57349
|
+
var tickerFunction = Ticker.add(()=>{circle.x++;});
|
|
57339
57350
|
Ticker.remove(tickerFunction);
|
|
57340
57351
|
|
|
57341
57352
|
// Check to see if a function is in the Ticker for that stage:
|
|
@@ -57349,6 +57360,7 @@ however, OPTIMIZE can be overridden as follows (or with the always() method):
|
|
|
57349
57360
|
METHODS (static)
|
|
57350
57361
|
** As of ZIM 5.1.0, stage is optional and will default to the stage of first Frame object made
|
|
57351
57362
|
** WARNING - if you are in a second Frame you should pass stage as a parameter so it does not point to the first Frame's stage
|
|
57363
|
+
** NOTE - if no stage is provided, the Ticker will update the stage of the zdf - ZIM default frame (usually the first Frame made)
|
|
57352
57364
|
Ticker.always(stage) - overrides OPTIMIZE and always runs an update for the stage even with no function in queue
|
|
57353
57365
|
Ticker.alwaysOff(stage) - stops an always Ticker for a stage
|
|
57354
57366
|
Ticker.add(function, stage) - adds the function to the Ticker queue for a given stage and returns the function that was added
|
|
@@ -57726,7 +57738,7 @@ const pages = new Pages({
|
|
|
57726
57738
|
}).addTo();
|
|
57727
57739
|
|
|
57728
57740
|
// handle any events inserted into the swipe arrays
|
|
57729
|
-
pages.on("info",
|
|
57741
|
+
pages.on("info", ()=>{zog("info requested")});
|
|
57730
57742
|
|
|
57731
57743
|
// handle any custom requirements when arriving at a page
|
|
57732
57744
|
// the event gives you the page object
|
|
@@ -57734,13 +57746,13 @@ pages.on("info", function(){zog("info requested")});
|
|
|
57734
57746
|
home.name = "home";
|
|
57735
57747
|
hide.name = "hide";
|
|
57736
57748
|
find.name = "find";
|
|
57737
|
-
pages.on("page",
|
|
57749
|
+
pages.on("page", ()=>{
|
|
57738
57750
|
zog(pages.page.name); // now we know which page we are on
|
|
57739
57751
|
})
|
|
57740
57752
|
|
|
57741
57753
|
// you can manually go to pages as well
|
|
57742
57754
|
// we will make a little triangle to click:
|
|
57743
|
-
|
|
57755
|
+
const back = new Triangle({color:red});
|
|
57744
57756
|
back.center(find); // add triangle to find page
|
|
57745
57757
|
// not really supposed to add things to zim shapes
|
|
57746
57758
|
// they default to mouseChildren false
|
|
@@ -57748,8 +57760,7 @@ back.center(find); // add triangle to find page
|
|
|
57748
57760
|
// so we have to set the mouseChildren of find to true
|
|
57749
57761
|
find.mouseChildren = true;
|
|
57750
57762
|
back.cur();
|
|
57751
|
-
back.on("click",
|
|
57752
|
-
S.update();
|
|
57763
|
+
back.on("click", ()=>{pages.go(home, UP)});
|
|
57753
57764
|
END EXAMPLE
|
|
57754
57765
|
|
|
57755
57766
|
PARAMETERS
|
|
@@ -58689,6 +58700,125 @@ Additional "mousedown", "click" or other button events can be added if desired
|
|
|
58689
58700
|
zim.extend(zim.Arrow, zim.Button, "clone", "zimButton", false);
|
|
58690
58701
|
//-71.2
|
|
58691
58702
|
|
|
58703
|
+
|
|
58704
|
+
/*--
|
|
58705
|
+
zim.HotSpot = function(obj, x, y, width, height, call, callOver, callOut, local, talk)
|
|
58706
|
+
|
|
58707
|
+
HotSpot
|
|
58708
|
+
zim class - extends a zim.Container which extends a createjs.Container
|
|
58709
|
+
|
|
58710
|
+
DESCRIPTION
|
|
58711
|
+
HotSpot adds an invisible button to a container object (often think of this as the page).
|
|
58712
|
+
If you want multiple spots it is more efficient to use the HotSpots class above
|
|
58713
|
+
which manages multiple HotSpot objects (otherwise you end up with multiple event functions).
|
|
58714
|
+
The spot is a pixel rect with an alpha of .01 and then uses a hitArea of a backing shape.
|
|
58715
|
+
The spot will get a cursor of "pointer".
|
|
58716
|
+
|
|
58717
|
+
NOTE: as of ZIM 5.5.0 the zim namespace is no longer required (unless zns is set to true before running zim)
|
|
58718
|
+
|
|
58719
|
+
EXAMPLE
|
|
58720
|
+
const hs = new HotSpot(S, 100, 100, 50, 50, myFunction);
|
|
58721
|
+
function myFunction() {
|
|
58722
|
+
zog("activation!");
|
|
58723
|
+
}
|
|
58724
|
+
// hs.show(); // uncomment this to see rectangle hotSpot
|
|
58725
|
+
END EXAMPLE
|
|
58726
|
+
|
|
58727
|
+
PARAMETERS supports DUO - parameters or single object with properties below
|
|
58728
|
+
holder - container object in which to place the hotspot (stage for instance)
|
|
58729
|
+
x, y, width and height - of the rectangle for the hotspot
|
|
58730
|
+
call - the function to call when the spot is pressed
|
|
58731
|
+
local - (default true) hotSpot rect is based on local coordinates of the container
|
|
58732
|
+
use when the element scale independently from the stage
|
|
58733
|
+
if set to false then you pass in global coordinates and hotSpot will convert them
|
|
58734
|
+
talk - (default "hotspot") text for ZIM Accessibility screen reader
|
|
58735
|
+
|
|
58736
|
+
METHODS
|
|
58737
|
+
show() - helps when creating the spot to see where it is
|
|
58738
|
+
hide() - hides the hotspot
|
|
58739
|
+
dispose() - removes the listener and the spot
|
|
58740
|
+
|
|
58741
|
+
PROPERTIES
|
|
58742
|
+
type - holds the class name as a String
|
|
58743
|
+
spot - the actual hotSpot object that gets added to the container can be accessed with the spot property
|
|
58744
|
+
eg. hs.spot
|
|
58745
|
+
|
|
58746
|
+
ACTIONEVENT
|
|
58747
|
+
This component is affected by the general ACTIONEVENT setting
|
|
58748
|
+
The default is "mousedown" - if set to something else the component will act on click (press)
|
|
58749
|
+
--*///+73
|
|
58750
|
+
zim.HotSpot = function(obj, x, y, width, height, call, callOver, callOut, local, talk) {
|
|
58751
|
+
var sig = "obj, x, y, width, height, call, callOver, callOut, local, talk";
|
|
58752
|
+
var duo; if (duo = zob(zim.HotSpot, arguments, sig, this)) return duo;
|
|
58753
|
+
z_d("73");
|
|
58754
|
+
this.zimContainer_constructor(null,null,null,null,false);
|
|
58755
|
+
this.type = "HotSpot";
|
|
58756
|
+
|
|
58757
|
+
if (zot(obj) || !obj.addChild) {zogy("zim controls - HotSpot():\nPlease pass in container object for obj"); return;}
|
|
58758
|
+
if (obj instanceof createjs.Container == false) {zogy("zim controls - HotSpot():\nObjects passed in should be Containers"); return;}
|
|
58759
|
+
if (zot(x) || zot(y) || zot(width) || zot(height)) {zogy("zim controls - HotSpot():\nPlease pass in x, y, width, height"); return;}
|
|
58760
|
+
if (zot(local)) local = true;
|
|
58761
|
+
var eventType = (!zns?WW.ACTIONEVENT=="mousedown":zim.ACTIONEVENT=="mousedown")?"mousedown":"click";
|
|
58762
|
+
|
|
58763
|
+
var w = width; var h = height;
|
|
58764
|
+
var point,newW,newH;
|
|
58765
|
+
if (!local) {
|
|
58766
|
+
point = obj.globalToLocal(x,y);
|
|
58767
|
+
var point2 = obj.globalToLocal(x+w,y+h);
|
|
58768
|
+
newW = point2.x-point.x;
|
|
58769
|
+
newH = point2.y-point.y;
|
|
58770
|
+
} else {
|
|
58771
|
+
point = new zim.Point(x,y);
|
|
58772
|
+
newW = width;
|
|
58773
|
+
newH = height;
|
|
58774
|
+
}
|
|
58775
|
+
var but = new zim.Shape(width, height);
|
|
58776
|
+
but.talk = zot(talk)?"HotSpot":talk;
|
|
58777
|
+
but.alpha = 0;
|
|
58778
|
+
but.graphics.f("black").dr(0,0,newW,newH);
|
|
58779
|
+
but.x = point.x;
|
|
58780
|
+
but.y = point.y;
|
|
58781
|
+
but.cur("pointer");
|
|
58782
|
+
but.expand(0);
|
|
58783
|
+
this.spot = but;
|
|
58784
|
+
|
|
58785
|
+
if (typeof(call) == "function") {
|
|
58786
|
+
var butEvent = but.on(eventType,function(e) {
|
|
58787
|
+
call(e);
|
|
58788
|
+
});
|
|
58789
|
+
}
|
|
58790
|
+
if (typeof(callOver) == "function") {
|
|
58791
|
+
var butOverEvent = but.on("mouseover",function(e) {
|
|
58792
|
+
callOver(e);
|
|
58793
|
+
});
|
|
58794
|
+
}
|
|
58795
|
+
if (typeof(callOut) == "function") {
|
|
58796
|
+
var butOutEvent = but.on("mouseout",function(e) {
|
|
58797
|
+
callOut(e);
|
|
58798
|
+
});
|
|
58799
|
+
}
|
|
58800
|
+
obj.addChild(but);
|
|
58801
|
+
|
|
58802
|
+
this.show = function() {
|
|
58803
|
+
but.alpha = .5;
|
|
58804
|
+
if (obj.stage) obj.stage.update();
|
|
58805
|
+
};
|
|
58806
|
+
this.hide = function() {
|
|
58807
|
+
but.alpha = 0;
|
|
58808
|
+
if (obj.stage) obj.stage.update();
|
|
58809
|
+
};
|
|
58810
|
+
this.dispose = function() {
|
|
58811
|
+
if (butEvent) but.off(eventType, butOverEvent);
|
|
58812
|
+
if (butOverEvent) but.off("mouseover", butOverEvent);
|
|
58813
|
+
if (butOutEvent) but.off("mouseout", butOutEvent);
|
|
58814
|
+
obj.removeChild(but);
|
|
58815
|
+
but = null;
|
|
58816
|
+
return true;
|
|
58817
|
+
};
|
|
58818
|
+
};
|
|
58819
|
+
zim.extend(zim.HotSpot, zim.Container, "dispose", "zimContainer", false);
|
|
58820
|
+
//-73
|
|
58821
|
+
|
|
58692
58822
|
/*--
|
|
58693
58823
|
zim.HotSpots = function(spots, local, mouseDowns)
|
|
58694
58824
|
|
|
@@ -58705,25 +58835,20 @@ NOTE: as of ZIM 5.5.0 the zim namespace is no longer required (unless zns is set
|
|
|
58705
58835
|
|
|
58706
58836
|
EXAMPLE
|
|
58707
58837
|
// our first hotSpot will be a 50 pixel square at 100, 100
|
|
58708
|
-
// then we will add hotSpots to these items as well
|
|
58709
|
-
var circle = new Circle(60, red);
|
|
58710
|
-
circle.center();
|
|
58711
58838
|
|
|
58712
|
-
|
|
58713
|
-
|
|
58714
|
-
button
|
|
58715
|
-
button.y = H - button.height - 100;
|
|
58839
|
+
// then we will add hotSpots to these items as well
|
|
58840
|
+
const circle = new Circle(60, red).center();
|
|
58841
|
+
const button = new Button().pos(100,100,RIGHT,BOTTOM);
|
|
58716
58842
|
|
|
58717
58843
|
// make the hotSpots object
|
|
58718
58844
|
// these are all on the same page
|
|
58719
58845
|
// gets really handy when you have multiple pages with Pages
|
|
58720
58846
|
const hs = new HotSpots([
|
|
58721
|
-
{page:
|
|
58722
|
-
{page:
|
|
58723
|
-
{page:
|
|
58847
|
+
{page:S, rect:[100,100,50,50], call:()=>{zog("hot!");}},
|
|
58848
|
+
{page:S, rect:circle, call:()=>{zog("circle!");}},
|
|
58849
|
+
{page:S, rect:button, call:()=>{zog("button!");}},
|
|
58724
58850
|
]);
|
|
58725
58851
|
// hs.show(); // uncomment this to see rectangle hotSpots
|
|
58726
|
-
S.update();
|
|
58727
58852
|
END EXAMPLE
|
|
58728
58853
|
|
|
58729
58854
|
PARAMETERS supports DUO - parameters or single object with properties below
|
|
@@ -58901,125 +59026,6 @@ the class creates HotSpot objects - see the class underneath this one
|
|
|
58901
59026
|
//-72
|
|
58902
59027
|
|
|
58903
59028
|
|
|
58904
|
-
/*--
|
|
58905
|
-
zim.HotSpot = function(obj, x, y, width, height, call, callOver, callOut, local, talk)
|
|
58906
|
-
|
|
58907
|
-
HotSpot
|
|
58908
|
-
zim class - extends a zim.Container which extends a createjs.Container
|
|
58909
|
-
|
|
58910
|
-
DESCRIPTION
|
|
58911
|
-
HotSpot adds an invisible button to a container object (often think of this as the page).
|
|
58912
|
-
If you want multiple spots it is more efficient to use the HotSpots class above
|
|
58913
|
-
which manages multiple HotSpot objects (otherwise you end up with multiple event functions).
|
|
58914
|
-
The spot is a pixel rect with an alpha of .01 and then uses a hitArea of a backing shape.
|
|
58915
|
-
The spot will get a cursor of "pointer".
|
|
58916
|
-
|
|
58917
|
-
NOTE: as of ZIM 5.5.0 the zim namespace is no longer required (unless zns is set to true before running zim)
|
|
58918
|
-
|
|
58919
|
-
EXAMPLE
|
|
58920
|
-
const hs = new HotSpot(stage, 100, 100, 50, 50, myFunction);
|
|
58921
|
-
function myFunction() {
|
|
58922
|
-
zog("activation!");
|
|
58923
|
-
}
|
|
58924
|
-
// hs.show(); // uncomment this to see rectangle hotSpot
|
|
58925
|
-
S.update();
|
|
58926
|
-
END EXAMPLE
|
|
58927
|
-
|
|
58928
|
-
PARAMETERS supports DUO - parameters or single object with properties below
|
|
58929
|
-
holder - container object in which to place the hotspot (stage for instance)
|
|
58930
|
-
x, y, width and height - of the rectangle for the hotspot
|
|
58931
|
-
call - the function to call when the spot is pressed
|
|
58932
|
-
local - (default true) hotSpot rect is based on local coordinates of the container
|
|
58933
|
-
use when the element scale independently from the stage
|
|
58934
|
-
if set to false then you pass in global coordinates and hotSpot will convert them
|
|
58935
|
-
talk - (default "hotspot") text for ZIM Accessibility screen reader
|
|
58936
|
-
|
|
58937
|
-
METHODS
|
|
58938
|
-
show() - helps when creating the spot to see where it is
|
|
58939
|
-
hide() - hides the hotspot
|
|
58940
|
-
dispose() - removes the listener and the spot
|
|
58941
|
-
|
|
58942
|
-
PROPERTIES
|
|
58943
|
-
type - holds the class name as a String
|
|
58944
|
-
spot - the actual hotSpot object that gets added to the container can be accessed with the spot property
|
|
58945
|
-
eg. hs.spot
|
|
58946
|
-
|
|
58947
|
-
ACTIONEVENT
|
|
58948
|
-
This component is affected by the general ACTIONEVENT setting
|
|
58949
|
-
The default is "mousedown" - if set to something else the component will act on click (press)
|
|
58950
|
-
--*///+73
|
|
58951
|
-
zim.HotSpot = function(obj, x, y, width, height, call, callOver, callOut, local, talk) {
|
|
58952
|
-
var sig = "obj, x, y, width, height, call, callOver, callOut, local, talk";
|
|
58953
|
-
var duo; if (duo = zob(zim.HotSpot, arguments, sig, this)) return duo;
|
|
58954
|
-
z_d("73");
|
|
58955
|
-
this.zimContainer_constructor(null,null,null,null,false);
|
|
58956
|
-
this.type = "HotSpot";
|
|
58957
|
-
|
|
58958
|
-
if (zot(obj) || !obj.addChild) {zogy("zim controls - HotSpot():\nPlease pass in container object for obj"); return;}
|
|
58959
|
-
if (obj instanceof createjs.Container == false) {zogy("zim controls - HotSpot():\nObjects passed in should be Containers"); return;}
|
|
58960
|
-
if (zot(x) || zot(y) || zot(width) || zot(height)) {zogy("zim controls - HotSpot():\nPlease pass in x, y, width, height"); return;}
|
|
58961
|
-
if (zot(local)) local = true;
|
|
58962
|
-
var eventType = (!zns?WW.ACTIONEVENT=="mousedown":zim.ACTIONEVENT=="mousedown")?"mousedown":"click";
|
|
58963
|
-
|
|
58964
|
-
var w = width; var h = height;
|
|
58965
|
-
var point,newW,newH;
|
|
58966
|
-
if (!local) {
|
|
58967
|
-
point = obj.globalToLocal(x,y);
|
|
58968
|
-
var point2 = obj.globalToLocal(x+w,y+h);
|
|
58969
|
-
newW = point2.x-point.x;
|
|
58970
|
-
newH = point2.y-point.y;
|
|
58971
|
-
} else {
|
|
58972
|
-
point = new zim.Point(x,y);
|
|
58973
|
-
newW = width;
|
|
58974
|
-
newH = height;
|
|
58975
|
-
}
|
|
58976
|
-
var but = new zim.Shape(width, height);
|
|
58977
|
-
but.talk = zot(talk)?"HotSpot":talk;
|
|
58978
|
-
but.alpha = 0;
|
|
58979
|
-
but.graphics.f("black").dr(0,0,newW,newH);
|
|
58980
|
-
but.x = point.x;
|
|
58981
|
-
but.y = point.y;
|
|
58982
|
-
but.cur("pointer");
|
|
58983
|
-
but.expand(0);
|
|
58984
|
-
this.spot = but;
|
|
58985
|
-
|
|
58986
|
-
if (typeof(call) == "function") {
|
|
58987
|
-
var butEvent = but.on(eventType,function(e) {
|
|
58988
|
-
call(e);
|
|
58989
|
-
});
|
|
58990
|
-
}
|
|
58991
|
-
if (typeof(callOver) == "function") {
|
|
58992
|
-
var butOverEvent = but.on("mouseover",function(e) {
|
|
58993
|
-
callOver(e);
|
|
58994
|
-
});
|
|
58995
|
-
}
|
|
58996
|
-
if (typeof(callOut) == "function") {
|
|
58997
|
-
var butOutEvent = but.on("mouseout",function(e) {
|
|
58998
|
-
callOut(e);
|
|
58999
|
-
});
|
|
59000
|
-
}
|
|
59001
|
-
obj.addChild(but);
|
|
59002
|
-
|
|
59003
|
-
this.show = function() {
|
|
59004
|
-
but.alpha = .5;
|
|
59005
|
-
if (obj.stage) obj.stage.update();
|
|
59006
|
-
};
|
|
59007
|
-
this.hide = function() {
|
|
59008
|
-
but.alpha = 0;
|
|
59009
|
-
if (obj.stage) obj.stage.update();
|
|
59010
|
-
};
|
|
59011
|
-
this.dispose = function() {
|
|
59012
|
-
if (butEvent) but.off(eventType, butOverEvent);
|
|
59013
|
-
if (butOverEvent) but.off("mouseover", butOverEvent);
|
|
59014
|
-
if (butOutEvent) but.off("mouseout", butOutEvent);
|
|
59015
|
-
obj.removeChild(but);
|
|
59016
|
-
but = null;
|
|
59017
|
-
return true;
|
|
59018
|
-
};
|
|
59019
|
-
};
|
|
59020
|
-
zim.extend(zim.HotSpot, zim.Container, "dispose", "zimContainer", false);
|
|
59021
|
-
//-73
|
|
59022
|
-
|
|
59023
59029
|
/*--
|
|
59024
59030
|
zim.Guide = function(obj, vertical, pixels, hideKey, pixelKey, style, group, inherit)
|
|
59025
59031
|
|
|
@@ -61616,7 +61622,7 @@ note: the item is not the event object target - as that is the tile
|
|
|
61616
61622
|
if (style!==false) zim.styleTransforms(this, DS); // global function - would have put on DisplayObject if had access to it
|
|
61617
61623
|
|
|
61618
61624
|
this.clone = function(exact) {
|
|
61619
|
-
if (unique) exact = true; // added ZIM 016
|
|
61625
|
+
if (zot(exact) && unique) exact = true; // added ZIM 016
|
|
61620
61626
|
if (exact) {
|
|
61621
61627
|
var exactItems = [];
|
|
61622
61628
|
if (backgroundColor) var exactBackgroundColors = [];
|
|
@@ -69758,11 +69764,24 @@ join(obj1, obj2, point1, point2, minAngle, maxAngle, type) - creates and returns
|
|
|
69758
69764
|
break(joint) - break a joint created with join()
|
|
69759
69765
|
to use, store the result of the join() method in a variable and pass that variable in to break()
|
|
69760
69766
|
attach(control, obj) attach a physics object (obj) to a ZIM object (control) to like a mousejoint to the ZIM object not the mouse
|
|
69761
|
-
|
|
69762
|
-
|
|
69763
|
-
|
|
69764
|
-
|
|
69767
|
+
the control can then be animated, wiggled, dragged and the physics object will follow it
|
|
69768
|
+
returns an id to be able to unattach
|
|
69769
|
+
const id = physics.attach(triangle, circle);
|
|
69770
|
+
timeout(2, ()=>{physics.unattach(id)});
|
|
69765
69771
|
unattach(id) unattach a physics object from the ZIM object based on the stored id from attach();
|
|
69772
|
+
buoyancy(height, denisity, linear, angular) returns a Box2D buoyancy controller. Then need to add() or remove() objects
|
|
69773
|
+
height - (default H/2) is pixels from bottom of the stage
|
|
69774
|
+
density - (default 3) density of fluid - the higher the more an object floats
|
|
69775
|
+
linear - (default 4) linear damping to reduce movement
|
|
69776
|
+
angular - (default 4) angular damping to reduce rotation
|
|
69777
|
+
the buoyancy controller will have the following methods:
|
|
69778
|
+
add(obj) - add object with physics or an array of objects with physics to buoyancy controller
|
|
69779
|
+
returns buoyancy object for chaining
|
|
69780
|
+
remove(obj) - remove object or an array of objects from buoyancy controller
|
|
69781
|
+
returns buoyancy object for chaining
|
|
69782
|
+
clear() - remove all objects from buoyancy controller
|
|
69783
|
+
returns buoyancy object for chaining
|
|
69784
|
+
dispose() - deletes buoyancy controller
|
|
69766
69785
|
debug() - activates the debugging - returns object for chaining
|
|
69767
69786
|
updateDebug() - updates the debug canvas if the frame has been scaled (put in frame resize event)
|
|
69768
69787
|
removeDebug() - removes the debug canvas - you can add it again later (or toggle, etc.)
|
|
@@ -79092,7 +79111,7 @@ the result of the play() or tone() method will dispatch a "complete" event when
|
|
|
79092
79111
|
}, (releaseTime+1)*1000);
|
|
79093
79112
|
};
|
|
79094
79113
|
// if (duration) this.stop(startTime+duration-.1);
|
|
79095
|
-
if (duration) setTimeout(function () {
|
|
79114
|
+
if (duration) setTimeout(function () { // reverted back to this in ZIM 015
|
|
79096
79115
|
that2.stop();
|
|
79097
79116
|
}, (duration-.1) * 1000);
|
|
79098
79117
|
|
|
@@ -90872,8 +90891,8 @@ export let outline = zim.outline;
|
|
|
90872
90891
|
export let blendmodes = zim.blendmodes;
|
|
90873
90892
|
export let Pages = zim.Pages;
|
|
90874
90893
|
export let Arrow = zim.Arrow;
|
|
90875
|
-
export let HotSpots = zim.HotSpots;
|
|
90876
90894
|
export let HotSpot = zim.HotSpot;
|
|
90895
|
+
export let HotSpots = zim.HotSpots;
|
|
90877
90896
|
export let Guide = zim.Guide;
|
|
90878
90897
|
export let Grid = zim.Grid;
|
|
90879
90898
|
export let Wrapper = zim.Wrapper;
|
|
@@ -3616,8 +3616,12 @@ declare namespace zim {
|
|
|
3616
3616
|
borders(boundary?: Boundary | {}): void
|
|
3617
3617
|
drag(array?: [any]): void
|
|
3618
3618
|
noDrag(): void
|
|
3619
|
+
pause(type?:boolean): void;
|
|
3619
3620
|
join(obj1: DisplayObject, obj2: DisplayObject, point1?: Point | {}, point2?: Point | {}, minAngle?: number, maxAngle?: number, type?: string): any
|
|
3620
3621
|
break(joint: any): void
|
|
3622
|
+
attach(control:DisplayObject, obj:DisplayObject):string
|
|
3623
|
+
unattach(id:string):void
|
|
3624
|
+
buoyancy(height?:number, denisity?:number, linear?:number, angular?:number):any
|
|
3621
3625
|
debug(): void
|
|
3622
3626
|
updateDebug(): void
|
|
3623
3627
|
removeDebug(): void
|