feat: 1.0.0-alpha.0

CanvasNative.podspec

@@ -2,7 +2,7 @@ Pod::Spec.new do |s|
 
     s.name         = "CanvasNative"
 
-    s.version      = "0.9.19"
+    s.version      = "1.0.0-alpha.0"
 
     s.summary      = "A Canvas library"
 

apps/demo/src/plugin-demos/canvas.xml

@@ -4,12 +4,12 @@
         </ActionBar>
     </Page.actionBar>
   <GridLayout loaded="{{ gridLoaded }}" rows="*,*" columns="*,*" iosOverflowSafeArea="false" width="100%" height="100%">
-		 <canvas:Canvas rowSpan="2" colSpan="2" width="100%" height="100%" ready="{{ canvasLoaded }}"
-									 layoutChanged="{{ onLayout }}"/> 
-                                     <!-- <canvas:Svg  id="1" width="100%" height="100%" src="{{src1}}" loaded="{{svgViewLoaded}}"/>
-                                     <canvas:Svg  id="2" col="1" width="100%" height="100%" src="{{src2}}" loaded="{{svgViewLoaded}}"/>
-                                      <canvas:Svg id="3" row="1" width="100%" height="100%" src="{{src3}}" loaded="{{svgViewLoaded}}"/>
-                                     <canvas:Svg  id="4" row="1" col="1" width="100%" height="100%" src="{{src4}}" loaded="{{svgViewLoaded}}"/> -->
+		 <!-- <canvas:Canvas rowSpan="2" colSpan="2" width="100%" height="100%" ready="{{ canvasLoaded }}"
+									 layoutChanged="{{ onLayout }}"/>  -->
+                                     <canvas:Svg ignorePixelScaling="true"  id="1" width="100%" height="100%" src="{{src1}}" loaded="{{svgViewLoaded}}"/>
+                                     <canvas:Svg ignorePixelScaling="true"  id="2" col="1" width="100%" height="100%" src="{{src2}}" loaded="{{svgViewLoaded}}"/>
+                                      <canvas:Svg ignorePixelScaling="true" id="3" row="1" width="100%" height="100%" src="{{src3}}" loaded="{{svgViewLoaded}}"/>
+                                     <canvas:Svg ignorePixelScaling="true"  id="4" row="1" col="1" width="100%" height="100%" src="{{src4}}" loaded="{{svgViewLoaded}}"/>
     <Button height="40" tap="{{  draw }}" text="Draw"/>
 
     <!-- <ScrollView  rowSpan="4" visibility="{{ show ? 'visible': 'collapse' }}" orientation="vertical">

package.json

@@ -22,6 +22,7 @@
 		"@nativescript/core": "~7.0.0",
 		"@nativescript/types": "~7.0.0",
 		"@nativescript/webpack": "~3.0.0",
+		"@nativescript-community/gesturehandler": "^0.1.45",
 		"@ngtools/webpack": "~10.1.0",
 		"@nrwl/eslint-plugin-nx": "~10.1.0",
 		"@nrwl/jest": "~10.1.0",
@@ -73,8 +74,7 @@
 		"typescript": "~3.9.3",
 		"vexflow": "^3.0.9",
 		"xml2js": "^0.4.23",
-		"xmldom": "^0.3.0",
-		"xmldom-qsa": "^1.0.3",
+		"xmldom": "~0.6.0",
 		"zen-3d": "0.0.3",
 		"zone.js": "0.11.1"
 	},
@@ -87,6 +87,5 @@
 		"**/*": [
 			"nx format:write --files"
 		]
-	},
-	"dependencies": {}
+	}
 }

packages/canvas-babylon/package.json

@@ -33,7 +33,7 @@
 	"readmeFilename": "README.md",
 	"bootstrapper": "@nativescript/plugin-seed",
 	"peerDependencies": {
-		"@nativescript/canvas": "~0.9.2",
+		"@nativescript/canvas": "~1.0.0-alpha.0",
 		"babylonjs": "^4.1.0"
 	}
 }

packages/canvas-phaser-ce/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@nativescript/canvas-phaser-ce",
-	"version": "1.0.0-alpha7",
+	"version": "1.0.0-beta.0",
 	"description": "Tools for using Phaser-ce to build native 2D games in NativeScript 👾",
 	"main": "index",
 	"typings": "index.d.ts",
@@ -33,7 +33,7 @@
 	"readmeFilename": "README.md",
 	"bootstrapper": "@nativescript/plugin-seed",
 	"peerDependencies": {
-		"@nativescript/canvas": "~0.9.2",
+		"@nativescript/canvas": "~1.0.0-alpha.0",
 		"phaser-ce": "2.15.0"
 	}
 }

packages/canvas-phaser/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@nativescript/canvas-phaser",
-	"version": "1.0.0-alpha6",
+	"version": "1.0.0-beta.0",
 	"description": "Build awesome 2D games with Phaser.js and NativeScript",
 	"main": "index",
 	"typings": "index.d.ts",
@@ -33,7 +33,7 @@
 	"readmeFilename": "README.md",
 	"bootstrapper": "@nativescript/plugin-seed",
 	"peerDependencies": {
-		"@nativescript/canvas": "~0.9.2",
+		"@nativescript/canvas": "~1.0.0-alpha.0",
 		"phaser": "^3.24.1"
 	}
 }

packages/canvas-pixi/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@nativescript/canvas-pixi",
-	"version": "1.0.0-alpha6",
+	"version": "1.0.0-beta.0",
 	"description": "Plugin for using pixi.js in NativeScript",
 	"main": "index",
 	"typings": "index.d.ts",
@@ -33,7 +33,7 @@
 	"readmeFilename": "README.md",
 	"bootstrapper": "nativescript-plugin-seed",
 	"peerDependencies": {
-		"@nativescript/canvas": "~0.9.2",
+		"@nativescript/canvas": "~1.0.0-alpha.0",
 		"pixi.js": "^5.3.3"
 	}
 }

packages/canvas-polyfill/DOM/Document.ts

@@ -2,6 +2,7 @@ import { Element } from './Element';
 import { HTMLVideoElement } from './HTMLVideoElement';
 import { HTMLImageElement } from './HTMLImageElement';
 import { HTMLCanvasElement } from './HTMLCanvasElement';
+import { SVGElement, SVGCircleElement, SVGRectElement , SVGGElement, SVGPathElement} from './svg';
 import { Text } from './Text';
 import { Canvas } from '@nativescript/canvas';
 import { Frame } from '@nativescript/core';
@@ -33,6 +34,16 @@ export class Document extends Element {
 			case 'iframe':
 				// Return nothing to keep firebase working.
 				return null;
+			case 'svg':
+				return new SVGElement();
+			case 'rect':
+				return new SVGRectElement();
+			case 'circle':
+				return new SVGCircleElement();
+			case 'g':
+				return new SVGGElement();
+			case 'path':
+				return new SVGPathElement();
 			default:
 				return new Element(tagName);
 		}
@@ -76,8 +87,4 @@ export class Document extends Element {
 		}
 		return new Element('div');
 	}
-
-	querySelector(selector) {
-		return new Element(selector);
-	}
 }

packages/canvas-polyfill/DOM/Element.ts

@@ -26,9 +26,13 @@ export class Element extends Node {
 		return this.nodeName;
 	}
 
-	setAttribute() {}
+	setAttribute(key, value) {
+		console.log(this.className,'setAttribute', key, value);
+	}
 
-	removeAttribute() {}
+	removeAttribute(key, value) {
+		console.log(this.className,'removeAttribute', key, value);
+	}
 
 	setAttributeNS() {}
 
@@ -77,4 +81,14 @@ export class Element extends Node {
 	get ontouchstart() {
 		return {};
 	}
+
+	querySelectorAll(selector) {
+		console.log('querySelectorAll', 'selector', selector);
+		return [];
+	}
+
+	querySelector(selector) {
+	///	return new Element(selector);
+	console.log(this.__internalElement._dom);
+	}
 }