zimjs 20.0.8 → 20.1.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "zimjs",
-  "version": "20.0.8",
+  "version": "20.1.0",
   "type": "module",
   "main": "./src/zim.js",
   "types": "./ts-src/typings/zim",

package/src/zim.js

@@ -26511,7 +26511,7 @@ EXAMPLE
 // copy the emoji or use the copy link and paste into the string below
 // leave the noto_ at the start and paste the emoji icon right after the _
 // where icon is the actual emoji icon (or a unicode number, or a noto code)
-// this will create and SVG that is the same across platforms (Windows, Linux, Android, iOS)
+// this will create an SVG that is the same across platforms (Windows, Linux, Android, iOS)
 new Emoji("noto_icon") 
 	.center()
 	.drag();
@@ -44485,7 +44485,7 @@ const emojiPicker = new EmojiPicker()
 	.change(() => {
 		// we will make a bigger emoji by passing the code of the currentEmoji 
 		// to the new Emoji - you can clone and then scale but that can look blotchy  
-		const emoji = new Emoji(emojiPicker.currentEmoji.code, 200)
+		const emoji = new Emoji(emojiPicker.selectedEmoji.code, 200)
 			.centerReg()
 			.drag();
 		S.update();
@@ -44535,9 +44535,11 @@ addChild(), removeChild(), addChildAt(), getChildAt(), contains(), removeAllChil
 
 PROPERTIES
 type - holds the class name as a String
-selectedEmoji - get the selected emoji - this is a zim Emoji object
+selectedEmoji - the selected ZIM Emoji object
 	clone the object to let the user use it
 	or make a new Emoji() from the selectedEmoji.code and pass in a different size, etc.
+selectedText - the text of the selected Emoji
+currentEmoji - (depricated) actually the Label of the selectedEmoji - left for backwards compatibility 
 emojiData - get the list of emojis - warning, if zog to console they will look like emojis
 wrapper - the ZIM Wrapper used for the picker 
 
@@ -44615,7 +44617,9 @@ added, click, dblclick, mousedown, mouseout, mouseover, pressdown (ZIM), pressmo
 		this.add(this.backdrop);
 		this.add(this.wrapper);
 		this.wrapper.tap(function(e) {
-			that.currentEmoji = e.target;
+			that.selectedText = e.target.text;
+			that.selectedEmoji = e.target.parent;
+			that.currentEmoji = e.target; // accidentally is the label property - leaving for backwards compatibility
 			that.dispatchEvent("change");
 		});
 		if (style!==false) zim.styleTransforms(this, DS);
@@ -58294,6 +58298,8 @@ ALSO: see noTilt() to remove tilt behaviors.
 
 ALSO: see tiltBoundary() to dynamically change or clear the boundary rectangle.
 
+SEE: https://zimjs.com/020/tilt.html
+
 EXAMPLE
 // Basic rolling ball constrained to stage bounds
 const ball = new Circle(30, red)
@@ -58356,35 +58362,11 @@ RETURNS obj for chaining
 
 		var dampX = damp ? new zim.Damp(mode == "position" ? obj.x : 0, damp) : null;
 		var dampY = damp ? new zim.Damp(mode == "position" ? obj.y : 0, damp) : null;
-		var currentRot = {x: 0, y: 0, z: 0};
+		var currentVector = {x: 0, y: 0};
 
 		function updateTilt() {
-			var orient = 0;
-			if (typeof WW != "undefined") {
-				if (WW.screen && WW.screen.orientation && WW.screen.orientation.angle != null) {
-					orient = WW.screen.orientation.angle;
-				} else if (typeof WW.orientation != "undefined") {
-					orient = WW.orientation;
-				}
-			}
-
-			var beta = currentRot.x;
-			var gamma = currentRot.y;
-			var tiltX, tiltY;
-
-			if (orient == 90) {
-				tiltX = beta;
-				tiltY = -gamma;
-			} else if (orient == -90 || orient == 270) {
-				tiltX = -beta;
-				tiltY = gamma;
-			} else if (orient == 180) {
-				tiltX = -gamma;
-				tiltY = -beta;
-			} else {
-				tiltX = gamma;
-				tiltY = beta;
-			}
+			var tiltX = currentVector.x;
+			var tiltY = currentVector.y;
 
 			if (mode == "move") {
 				var rotX = dampX ? dampX.convert(tiltX) : tiltX;
@@ -58416,14 +58398,50 @@ RETURNS obj for chaining
 
 			obj._tiltType = type;
 			obj._tiltListener = function(e) {
-				if (e.rotation) {
-					currentRot.x = e.rotation.x || 0;
-					currentRot.y = e.rotation.y || 0;
-					currentRot.z = e.rotation.z || 0;
+				var orient = 0;
+				if (typeof WW != "undefined") {
+					if (WW.screen && WW.screen.orientation && WW.screen.orientation.angle != null) {
+						orient = WW.screen.orientation.angle;
+					} else if (typeof WW.orientation != "undefined") {
+						orient = WW.orientation;
+					}
+				}
+
+				if (type == "devicemotion" || e.accelerationIncludingGravity || e.accelerationData) {
+					var acc = e.accelerationData || e.accelerationIncludingGravity || e.acceleration || e;
+					var ax = acc.x || 0;
+					var ay = acc.y || 0;
+
+					if (orient == 90) {
+						currentVector.x = ay * 5;
+						currentVector.y = ax * 5;
+					} else if (orient == -90 || orient == 270) {
+						currentVector.x = -ay * 5;
+						currentVector.y = -ax * 5;
+					} else if (orient == 180) {
+						currentVector.x = ax * 5;
+						currentVector.y = -ay * 5;
+					} else {
+						currentVector.x = -ax * 5;
+						currentVector.y = ay * 5;
+					}
 				} else {
-					currentRot.x = e.beta || 0;
-					currentRot.y = e.gamma || 0;
-					currentRot.z = e.alpha || 0;
+					var beta = e.rotation ? e.rotation.x : (e.beta || 0);
+					var gamma = e.rotation ? e.rotation.y : (e.gamma || 0);
+
+					if (orient == 90) {
+						currentVector.x = beta;
+						currentVector.y = -gamma;
+					} else if (orient == -90 || orient == 270) {
+						currentVector.x = -beta;
+						currentVector.y = gamma;
+					} else if (orient == 180) {
+						currentVector.x = -gamma;
+						currentVector.y = -beta;
+					} else {
+						currentVector.x = gamma;
+						currentVector.y = beta;
+					}
 				}
 			};
 			f.on(type, obj._tiltListener);
@@ -58432,24 +58450,29 @@ RETURNS obj for chaining
 			if (ready) ready(true, obj);
 		}
 
-		// Shared Permission check & queueing
-		if (f._permissionGranted) {
+		// Per-type Permission check & queueing
+		if (!f._permissionGranted) f._permissionGranted = {};
+		if (!f._permissionPending) f._permissionPending = {};
+		if (!f._permissionQueue) f._permissionQueue = {};
+		if (!f._permissionQueue[type]) f._permissionQueue[type] = [];
+
+		if (f._permissionGranted[type]) {
 			activate();
-		} else if (f._permissionPending) {
-			f._permissionQueue.push({ activate: activate, reject: function() { if (ready) ready(false, obj); } });
+		} else if (f._permissionPending[type]) {
+			f._permissionQueue[type].push({ activate: activate, reject: function() { if (ready) ready(false, obj); } });
 		} else {
-			f._permissionPending = true;
-			f._permissionQueue = [{ activate: activate, reject: function() { if (ready) ready(false, obj); } }];
+			f._permissionPending[type] = true;
+			f._permissionQueue[type].push({ activate: activate, reject: function() { if (ready) ready(false, obj); } });
 
 			new zim.PermissionAsk(function(yes) {
-				f._permissionPending = false;
+				f._permissionPending[type] = false;
 				if (yes) {
-					f._permissionGranted = true;
-					zim.loop(f._permissionQueue, function(item) { item.activate(); });
+					f._permissionGranted[type] = true;
+					zim.loop(f._permissionQueue[type], function(item) { item.activate(); });
 				} else {
-					zim.loop(f._permissionQueue, function(item) { item.reject(); });
+					zim.loop(f._permissionQueue[type], function(item) { item.reject(); });
 				}
-				f._permissionQueue = [];
+				f._permissionQueue[type] = [];
 			}, type);
 		}
 
@@ -58480,7 +58503,7 @@ RETURNS obj for chaining
 		var duo; if (duo = zob(zim.noTilt, arguments, sig)) return duo;
 		z_d("34.91");
 
-		if (zot(obj) || !obj.on || !obj.zimTouch) return;
+		if (zot(obj) || !obj.on) return;
 
 		// MONITOR
 		var mID = "z~noTilt";
@@ -58616,6 +58639,8 @@ To change buttons of the Dialog set: F.sensorAsk.yes.text = "OUI"; F.sensorAsk.n
 
 ALSO: see noTurn() to remove turning behaviors.
 
+SEE: https://zimjs.com/020/turn.html
+
 EXAMPLE
 // Point an arrow with device heading (stays pointing up in world space)
 const arrow = new Arrow({type:"thick"}).sca(4).rot(-90).centerReg().turn();
@@ -58673,7 +58698,8 @@ RETURNS obj for chaining
 		var dampRot = damp ? new zim.Damp(obj.rotation, damp) : null;
 		var startDeviceAngle = null;
 		var currentDeviceAngle = null;
-		var lastMode = null;
+		var lastSteerAng = null;
+		var lastFlatAng = null;
 
 		function angleDiff(a, b) {
 			var diff = (a - b) % 360;
@@ -58690,28 +58716,18 @@ RETURNS obj for chaining
 		}
 
 		function updateTurn() {
-			if (startDeviceAngle === null || currentDeviceAngle === null) return;
-
-			var orient = 0;
-			if (typeof WW != "undefined") {
-				if (WW.screen && WW.screen.orientation && WW.screen.orientation.angle != null) {
-					orient = WW.screen.orientation.angle;
-				} else if (typeof WW.orientation != "undefined") {
-					orient = WW.orientation;
-				}
-			}
+			if (currentDeviceAngle === null) return;
 
 			var startRot = obj._turnStartRot != null ? obj._turnStartRot : 0;
 			var targetRot = obj.rotation;
 
 			if (mode == "relative") {
-				var diff = angleDiff(currentDeviceAngle, startDeviceAngle);
+				var diff = currentDeviceAngle - (startDeviceAngle || 0);
 				targetRot = startRot - diff * factor;
 			} else if (mode == "absolute") {
-				var absHeading = (currentDeviceAngle - orient + 360) % 360;
-				targetRot = startRot - absHeading * factor;
+				targetRot = startRot - currentDeviceAngle * factor;
 			} else if (mode == "continuous") {
-				var cDiff = angleDiff(currentDeviceAngle, startDeviceAngle);
+				var cDiff = angleDiff(currentDeviceAngle, startDeviceAngle || 0);
 				targetRot = obj.rotation - (cDiff * factor * 0.05);
 			}
 
@@ -58733,38 +58749,70 @@ RETURNS obj for chaining
 			obj._turnStartRot = obj.rotation;
 			startDeviceAngle = null;
 			currentDeviceAngle = null;
-			lastMode = null;
+			lastSteerAng = null;
+			lastFlatAng = null;
 			if (dampRot) dampRot.immediate(obj.rotation);
 
 			obj._turnType = type;
 			obj._turnListener = function(e) {
+				var orient = 0;
+				if (typeof WW != "undefined") {
+					if (WW.screen && WW.screen.orientation && WW.screen.orientation.angle != null) {
+						orient = WW.screen.orientation.angle;
+					} else if (typeof WW.orientation != "undefined") {
+						orient = WW.orientation;
+					}
+				}
+
 				var beta = e.rotation ? e.rotation.x : (e.beta || 0);
 				var gamma = e.rotation ? e.rotation.y : (e.gamma || 0);
-				var alpha = e.rotation && e.rotation.z != null ? e.rotation.z : (e.alpha != null ? (360 - e.alpha) : 0);
+				var alpha = e.rotation && e.rotation.z != null ? e.rotation.z : (e.alpha != null ? (360 - e.alpha) % 360 : 0);
+
+				var tiltX, tiltY;
+				if (orient == 90) {
+					tiltX = beta;
+					tiltY = -gamma;
+				} else if (orient == -90 || orient == 270) {
+					tiltX = -beta;
+					tiltY = gamma;
+				} else if (orient == 180) {
+					tiltX = -gamma;
+					tiltY = -beta;
+				} else {
+					tiltX = gamma;
+					tiltY = beta;
+				}
 
-				var isUpright = Math.abs(beta) > 20 || Math.abs(gamma) > 20;
-				var curMode = isUpright ? "upright" : "flat";
-				var ang;
+				var mag = Math.sqrt(tiltX * tiltX + tiltY * tiltY);
+				var steerAng = Math.atan2(tiltX, tiltY) * (180 / Math.PI);
+				var flatAng = (alpha + orient + 360) % 360;
 
-				if (isUpright) {
-					var radB = beta * (Math.PI / 180);
-					var radG = gamma * (Math.PI / 180);
-					ang = Math.atan2(Math.sin(radG), Math.cos(radG) * Math.sin(radB)) * (180 / Math.PI);
+				if (mode == "absolute") {
+					currentDeviceAngle = flatAng;
+					if (startDeviceAngle === null) startDeviceAngle = flatAng;
 				} else {
-					ang = alpha;
-				}
+					if (currentDeviceAngle === null) {
+						startDeviceAngle = 0;
+						currentDeviceAngle = 0;
+						lastSteerAng = steerAng;
+						lastFlatAng = flatAng;
+						if (dampRot) dampRot.immediate(obj.rotation);
+					} else {
+						var dSteer = angleDiff(steerAng, lastSteerAng);
+						var dFlat = angleDiff(flatAng, lastFlatAng);
 
-				if (startDeviceAngle === null) {
-					startDeviceAngle = ang;
-					lastMode = curMode;
-					if (dampRot) dampRot.immediate(obj.rotation);
-				} else if (lastMode !== null && curMode !== lastMode) {
-					var prevDiff = angleDiff(currentDeviceAngle, startDeviceAngle);
-					startDeviceAngle = ang - prevDiff;
-					lastMode = curMode;
-				}
+						var delta;
+						if (mag > 35 && Math.abs(dSteer) > Math.abs(dFlat) && Math.abs(beta) < 70) {
+							delta = dSteer;
+						} else {
+							delta = dFlat;
+						}
 
-				currentDeviceAngle = ang;
+						currentDeviceAngle += delta;
+						lastSteerAng = steerAng;
+						lastFlatAng = flatAng;
+					}
+				}
 			};
 			f.on(type, obj._turnListener);
 
@@ -58772,24 +58820,29 @@ RETURNS obj for chaining
 			if (ready) ready(true, obj);
 		}
 
-		// Shared Permission check & queueing
-		if (f._permissionGranted) {
+		// Per-type Permission check & queueing
+		if (!f._permissionGranted) f._permissionGranted = {};
+		if (!f._permissionPending) f._permissionPending = {};
+		if (!f._permissionQueue) f._permissionQueue = {};
+		if (!f._permissionQueue[type]) f._permissionQueue[type] = [];
+
+		if (f._permissionGranted[type]) {
 			activate();
-		} else if (f._permissionPending) {
-			f._permissionQueue.push({ activate: activate, reject: function() { if (ready) ready(false, obj); } });
+		} else if (f._permissionPending[type]) {
+			f._permissionQueue[type].push({ activate: activate, reject: function() { if (ready) ready(false, obj); } });
 		} else {
-			f._permissionPending = true;
-			f._permissionQueue = [{ activate: activate, reject: function() { if (ready) ready(false, obj); } }];
+			f._permissionPending[type] = true;
+			f._permissionQueue[type].push({ activate: activate, reject: function() { if (ready) ready(false, obj); } });
 
 			new zim.PermissionAsk(function(yes) {
-				f._permissionPending = false;
+				f._permissionPending[type] = false;
 				if (yes) {
-					f._permissionGranted = true;
-					zim.loop(f._permissionQueue, function(item) { item.activate(); });
+					f._permissionGranted[type] = true;
+					zim.loop(f._permissionQueue[type], function(item) { item.activate(); });
 				} else {
-					zim.loop(f._permissionQueue, function(item) { item.reject(); });
+					zim.loop(f._permissionQueue[type], function(item) { item.reject(); });
 				}
-				f._permissionQueue = [];
+				f._permissionQueue[type] = [];
 			}, type);
 		}
 
@@ -58819,7 +58872,7 @@ RETURNS obj for chaining
 		var duo; if (duo = zob(zim.noTurn, arguments, sig)) return duo;
 		z_d("34.94");
 
-		if (zot(obj) || !obj.on || !obj.zimTouch) return;
+		if (zot(obj) || !obj.on) return;
 
 		// MONITOR
 		var mID = "z~noTurn";
@@ -58859,6 +58912,8 @@ To change buttons of the Dialog set: F.sensorAsk.yes.text = "OUI"; F.sensorAsk.n
 
 ALSO: see noShake() to remove shake listeners.
 
+SEE: https://zimjs.com/020/shake.html
+
 EXAMPLE
 const color = series(red,green,blue);
 const bottle = new Rectangle(80, 160, purple).centerReg().shake({
@@ -58927,16 +58982,27 @@ RETURNS obj for chaining
 		if (zot(type)) type = "devicemotion";
 
 		var lastX = 0, lastY = 0, lastZ = 0;
+		var seeded = false;
 		var lastTime = 0;
 
 		function handleMotion(e) {
-			var acc = e.acceleration && (e.acceleration.x != null || e.acceleration.y != null) ? 
-				e.acceleration : (e.accelerationIncludingGravity || e);
+			var acc = e.accelerationData || e.accelerationIncludingGravity || e.acceleration || e;
+			if (e.acceleration && (e.acceleration.x || e.acceleration.y || e.acceleration.z)) {
+				acc = e.acceleration;
+			}
 
 			var ax = acc.x || 0;
 			var ay = acc.y || 0;
 			var az = acc.z || 0;
 
+			if (!seeded) {
+				seeded = true;
+				lastX = ax;
+				lastY = ay;
+				lastZ = az;
+				return;
+			}
+
 			var deltaX = ax - lastX;
 			var deltaY = ay - lastY;
 			var deltaZ = az - lastZ;
@@ -59005,30 +59071,36 @@ RETURNS obj for chaining
 		}
 
 		function activate() {
+			seeded = false;
 			obj._shakeType = type;
 			obj._shakeListener = handleMotion;
 			f.on(type, obj._shakeListener);
 			if (ready) ready(true, obj);
 		}
 
-		// Shared Permission check & queueing
-		if (f._permissionGranted) {
+		// Per-type Permission check & queueing
+		if (!f._permissionGranted) f._permissionGranted = {};
+		if (!f._permissionPending) f._permissionPending = {};
+		if (!f._permissionQueue) f._permissionQueue = {};
+		if (!f._permissionQueue[type]) f._permissionQueue[type] = [];
+
+		if (f._permissionGranted[type]) {
 			activate();
-		} else if (f._permissionPending) {
-			f._permissionQueue.push({ activate: activate, reject: function() { if (ready) ready(false, obj); } });
+		} else if (f._permissionPending[type]) {
+			f._permissionQueue[type].push({ activate: activate, reject: function() { if (ready) ready(false, obj); } });
 		} else {
-			f._permissionPending = true;
-			f._permissionQueue = [{ activate: activate, reject: function() { if (ready) ready(false, obj); } }];
+			f._permissionPending[type] = true;
+			f._permissionQueue[type].push({ activate: activate, reject: function() { if (ready) ready(false, obj); } });
 
 			new zim.PermissionAsk(function(yes) {
-				f._permissionPending = false;
+				f._permissionPending[type] = false;
 				if (yes) {
-					f._permissionGranted = true;
-					zim.loop(f._permissionQueue, function(item) { item.activate(); });
+					f._permissionGranted[type] = true;
+					zim.loop(f._permissionQueue[type], function(item) { item.activate(); });
 				} else {
-					zim.loop(f._permissionQueue, function(item) { item.reject(); });
+					zim.loop(f._permissionQueue[type], function(item) { item.reject(); });
 				}
-				f._permissionQueue = [];
+				f._permissionQueue[type] = [];
 			}, type);
 		}
 
@@ -59059,7 +59131,7 @@ RETURNS obj for chaining
 		var duo; if (duo = zob(zim.noShake, arguments, sig)) return duo;
 		z_d("34.96");
 
-		if (zot(obj) || !obj.on || !obj.zimTouch) return;
+		if (zot(obj) || !obj.on) return;
 
 		// MONITOR
 		var mID = "z~noShake";
@@ -94587,12 +94659,12 @@ zim.Frame = function(scaling, width, height, color, outerColor, ready, assets, p
 			// 	// }
 			// }
 
-			
+			var svgRoot = "https://raw.githubusercontent.com/googlefonts/noto-emoji/v2.042/svg/";
 
 			var match;
 			if (a.match) match = a.match(/^noto_(.*)/);
 			if (match) {		
-				a = {id:a, src:"https://raw.githubusercontent.com/googlefonts/noto-emoji/main/svg/" + getNotoFilename(match[1])}
+				a = {id:a, src:svgRoot + getNotoFilename(match[1])}
 			}
             if (a.replace) a = a.replace(/gf_/i, "https://fonts.googleapis.com/css?family=");		
 			// split multi into individual ZIM asset objects and make the first of these
@@ -94606,8 +94678,8 @@ zim.Frame = function(scaling, width, height, color, outerColor, ready, assets, p
 					if (isVideoUrl(aj)) continue;
 					if (aj.match) match = aj.match(/^noto_(.*)/);
 					if (match) {		
-						aj = {id:aj, src:"https://raw.githubusercontent.com/googlefonts/noto-emoji/main/svg/" + getNotoFilename(match[1])}
-					}
+						aj = {id:aj, src:svgRoot + getNotoFilename(match[1])}
+					}					
 					if (aj.split) {
 						var temp = aj.split("?");
 						ext = temp[0].match(re);
@@ -97656,6 +97728,8 @@ added, click, dblclick, mousedown, mouseout, mouseover, pressdown (ZIM), pressmo
     }
     zim.extend(zim.SVG, zim.Container, ["clone"], "zimContainer", false);//-83.09
 
+
+
 /*--
 Speech = function()
 
@@ -98637,118 +98711,6 @@ END EXAMPLE
 // See Frame for the cursors property
 //-83.867
 
-/*--
-Tilt - device orientation event
-
-Tilt
-"deviceorientation" Frame event
-
-DESCRIPTION
-The Frame has a "deviceorientation" event to capture tilt or device rotation (like a compass)
-and a "devicemotion" event to capture shaking the device with the accelerometer.
-
-SEE: the tilt() method (just after gesture()) for a one line version
-
-SEE: Shake - for the "devicemotion" event for accelerometer motion
-
-SEE: the PermissionAsk() class which will handle asking for permissions on devices.
-
-EXAMPLE
-// SEE ALSO THE TILT METHOD FOR A ONE LINE VERSION
-
-// TILT OR COMPASS - https://zimjs.com/zapp/Z_Q5UYS
-// for capturing tilt on device (rotation about an axis)
-// be on a mobile device or a device with sensors
-new PermissionAsk(yes=>{
-	if (yes) { // the user answered yes to PermissionAsk
-		// all code goes in here
-		new Label("Tilt the device to move circle").alp(.3).pos(0,30,CENTER);
-		const circle = new Circle().center();
-		const amount = .5;
-		const compass = new Line(60, 4, light, "arrow").rot(90).centerReg(circle); // point up
-		F.on("deviceorientation", e=>{
-		    // for tilt 
-			circle.mov(e.rotation.y*amount, e.rotation.x*amount);
-			circle.x = constrain(circle.x, 0, W);
-			circle.y = constrain(circle.y, 0, H);
-			// for compass use e.rotation.z 
-			// which has 0 angle at device start rotation (not necessarily North)
-			compass.rot(90-e.rotation.z); // rotate opposite device rotation
-			S.update();
-		});
-	} else { // the user answered no to PermissionAsk 		
-		new Pane("SENSOR not available",yellow).show();	
-	}
-});
-END EXAMPLE
-
-EVENTS 
-"deviceorientation" - for tilt 
-	fired as device orientation changes:
-		eventObject.rotation.x (beta in HTML specs) holds rotation about the x axis between -180 and 180 (tipped forward or backward)
-		eventObject.rotation.y (gamma in HTML specs) holds rotation about the y axis between -90 and 90 (tipped left or right)
-		eventObject.rotation.z (alpha in HTML specs) holds rotation about the z axis 0-360 clockwise (relative to orientation when app loads)
-			note rotation.z is 360-alpha compared to the HTML 5 specs
-			note also that beta, gamma and alpha from the HTML 5 specs are also provided
---*///+83.86
-// Device motion and orientation events are available as Frame events
-//-83.86
-
-/*--
-Shake - device motion event
-
-Shake
-"devicemotion" Frame event
-
-DESCRIPTION
-The Frame has a "devicemotion" event to capture shaking the device with the accelerometer.
-
-SEE: Tilt - for the "deviceorientation" event for tilt or compass
-
-SEE: the PermissionAsk() class which will handle asking for permissions on devices.
-
-EXAMPLE
-// SHAKE - https://zimjs.com/zapp/Z_XF8JM
-// for capturing shaking motion on device (acceleration about an axis)
-// be on a mobile device or a device with sensors
-new PermissionAsk(init, "devicemotion");
-function init(yes) {	
-	if (yes) { // the user answered yes to PermissionAsk	
-		// all code goes in here		
-		new Label("Shake the device").center();
-		S.update();
-		let id;
-		F.on("devicemotion", e=>{
-			// for shake	
-		    if (
-		        Math.abs(e.acceleration.x) > 5 ||
-		        Math.abs(e.acceleration.y) > 5 ||
-		        Math.abs(e.acceleration.z) > 5
-		    ) {
-		        if (F.color != green) {
-		            F.color = green;
-		            S.update();
-		        }
-		        if (id) id.clear();
-		        id = timeout(.2, ()=>{
-		            F.color = light;
-		            S.update();
-		        });
-		    } 
-		});
-	} else { // the user answered no to PermissionAsk		
-		new Pane("SENSOR not available",yellow).show();
-	}	
-}
-END EXAMPLE
-
-EVENTS 
-"devicemotion" - for shake
-	fired on moving mobile device - like a shake - eventObject.acceleration holds x, y and z properties of motion   
---*///+83.87
-// Device motion and orientation events are available as Frame events
-//-83.87
-
 /*--
 zim.PermissionAsk = function(callback, permissionType, color, backgroundColor, style, group, inherit)
 
@@ -98769,6 +98731,9 @@ NOTE: as of ZIM 5.5.0 the zim namespace is no longer required (unless zns is set
 
 NOTE: sensor prompt text can be customized prior to calling with F.sensorText = "Custom message";
 
+NOTE: as of ZIM 020 tilt(), turn(), and shake() can be applied as methods to DisplayObjects
+and will call PermissionAsk automatically so would suggest using those methods
+
 EXAMPLE
 // DEVICE ORIENTATION - gives angle of device in all 3 dimensions
 // See https://zimjs.com/zapp/Z_Q5UYS
@@ -98938,8 +98903,18 @@ no - reference to the zim Button with NO
             return;
         }
 
-        // Sensors probe: iOS uses PermissionAsk popup; Android/Desktop probes hardware directly
-		if (typeof DeviceOrientationEvent != "undefined" && DeviceOrientationEvent && typeof DeviceOrientationEvent.requestPermission == "function") {
+        // Fast check: if sensors not supported in environment (e.g. non-secure HTTP or missing API)
+        var hasOrientAPI = typeof DeviceOrientationEvent != "undefined" && DeviceOrientationEvent;
+        var hasMotionAPI = typeof DeviceMotionEvent != "undefined" && DeviceMotionEvent;
+        if (WW.isSecureContext === false || (pt == "deviceorientation" && !hasOrientAPI) || (pt == "devicemotion" && !hasMotionAPI)) {
+            callback(false, pt == "deviceorientation" ? 1 : 2);
+            return;
+        }
+
+        var isIOS = (M == "ios" || (typeof navigator != "undefined" && (/iPad|iPhone|iPod/.test(navigator.userAgent) || (navigator.platform === "MacIntel" && navigator.maxTouchPoints > 1))));
+
+        // Sensors probe: Only iOS devices with requestPermission require the PermissionAsk popup
+		if (isIOS && typeof DeviceOrientationEvent != "undefined" && DeviceOrientationEvent && typeof DeviceOrientationEvent.requestPermission == "function") {
 			setPane();
 		} else {
 			var tested = false;
@@ -98948,7 +98923,7 @@ no - reference to the zim Button with NO
 				tested = true;
 				WW.removeEventListener(permissionType, testMe);
 				callback(false, 3); // 3 - timeout / no sensor hardware (e.g. desktop)
-			}, 1000);
+			}, 1500);
 
 			function testMe(e) {
 				if (tested || okay) return;
@@ -98959,6 +98934,7 @@ no - reference to the zim Button with NO
 						WW.removeEventListener(permissionType, testMe);
 						setEvents();
 					} else {
+						// Fast fail on desktop dummy event with nulls
 						tested = true;
 						clearTimeout(timer);
 						WW.removeEventListener(permissionType, testMe);
@@ -98973,6 +98949,7 @@ no - reference to the zim Button with NO
 						WW.removeEventListener(permissionType, testMe);
 						setEvents();
 					} else {
+						// Fast fail on desktop dummy motion with nulls
 						tested = true;
 						clearTimeout(timer);
 						WW.removeEventListener(permissionType, testMe);
@@ -98983,20 +98960,25 @@ no - reference to the zim Button with NO
 			WW.addEventListener(permissionType, testMe);
 		}
 
-		var lastZ = 0;
-		var flip = 0;
 		function deviceorientationEvent(e) {
-			var z = 360-e.alpha;
-			if (Math.abs(z-lastZ) > 180 - 45 && Math.abs(z-lastZ) < 180 + 45) flip = flip == 0 ? 180 : 0;
-			lastZ = z;
-			e.rotation = {x:e.beta, y:e.gamma, z:(z + flip) % 360};
+			var z = e.alpha != null ? (360 - e.alpha) % 360 : 0;
+			e.rotation = {x:e.beta || 0, y:e.gamma || 0, z:z};
 			frame.dispatchEvent(e);			
 		}
 		function devicemotionEvent(e) {
+			var acc = (e.accelerationIncludingGravity || e.acceleration || e);
+			e.accelerationData = {
+				x: acc.x || 0,
+				y: acc.y || 0,
+				z: acc.z || 0
+			};
 			frame.dispatchEvent(e);
 		}
 		function setEvents() {
-			if (frame) frame._permissionGranted = true;
+			if (frame) {
+				if (!frame._permissionGranted) frame._permissionGranted = {};
+				frame._permissionGranted[permissionType] = true;
+			}
 			if (permissionType=="deviceorientation") {		
 				frame.zimDeviceorientationEvent = deviceorientationEvent;
 				WW.addEventListener("deviceorientation", frame.zimDeviceorientationEvent);
@@ -108029,4 +108011,4 @@ export let Ticker = zim.Ticker;
 export let Style = zim.Style;
 export let assets = zim.assets;
 export let assetIDs = zim.assetIDs;
-export let ZIMON = zim.ZIMON;
+export let ZIMON = zim.ZIMON;

package/ts-src/typings/zim/index.d.ts

@@ -2906,6 +2906,8 @@ declare namespace zim {
 		enabled: boolean
 		// END ZIM Component Interface
 		readonly selectedEmoji: Emoji
+		readonly selectedText: string
+		readonly currentEmoji: Label
 		readonly emojiData: string[]
 	}
 	export class TextEditor extends Container implements zimComponent {
@@ -4279,6 +4281,7 @@ declare namespace zim {
 	export function parseAudioSprite(audioSpriteData: { resources: string[], spritemap: {} }, outputAudioSprite?: boolean): { src: string, data: {} }
 	export function previewAudioSprite(audioSpriteData: {}, numLetters?: number, frame?: Frame): Tabs
 	export function svgToBitmap(svg: string | SVGElement, callBack: Function): void
+	export function makeContent(content:string|number|DisplayObject|{}, maxWidth?:number, color?:color, scrollBar?:boolean): string|number|DisplayObject
 	export function fastFrame(cjs: any, stage: createjs.Stage | createjs.StageGL): Function
 	export function addWires({ }): {}
 	export function setBlurDetect(): void