@cocreate/utils 1.1.35 → 1.3.0

package/CHANGELOG.md

@@ -1,3 +1,36 @@
+# [1.3.0](https://github.com/CoCreate-app/CoCreate-utils/compare/v1.2.1...v1.3.0) (2021-11-01)
+
+
+### Bug Fixes
+
+* cssPath did not push and return path if it was id ([4af00bd](https://github.com/CoCreate-app/CoCreate-utils/commit/4af00bd4c3fd376a1fd15d7dd1eeeec63ff0ddcf))
+
+
+### Features
+
+* cssPath will stop and return path if id or eid found... rather then continuing to travel up the dom tree ([17d6ced](https://github.com/CoCreate-app/CoCreate-utils/commit/17d6ced222f0552f870f2feeffecf7970ad653a3))
+
+## [1.2.1](https://github.com/CoCreate-app/CoCreate-utils/compare/v1.2.0...v1.2.1) (2021-10-29)
+
+
+### Bug Fixes
+
+* update dependencies ([f77e945](https://github.com/CoCreate-app/CoCreate-utils/commit/f77e945e2b17310d20769434492bd074e99a1d78))
+
+# [1.2.0](https://github.com/CoCreate-app/CoCreate-utils/compare/v1.1.36...v1.2.0) (2021-10-29)
+
+
+### Features
+
+* cssPath and domParser ([25c5088](https://github.com/CoCreate-app/CoCreate-utils/commit/25c508855c663f5e2f64596549d1eccb14eb4292))
+
+## [1.1.36](https://github.com/CoCreate-app/CoCreate-utils/compare/v1.1.35...v1.1.36) (2021-10-17)
+
+
+### Bug Fixes
+
+* update dependendies ([c5a34a9](https://github.com/CoCreate-app/CoCreate-utils/commit/c5a34a9ce6cff492f76e8e614a35860037d1f722))
+
 ## [1.1.35](https://github.com/CoCreate-app/CoCreate-utils/compare/v1.1.34...v1.1.35) (2021-10-16)
 
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cocreate/utils",
-  "version": "1.1.35",
+  "version": "1.3.0",
   "description": "A simple utils component in vanilla javascript. Easily configured using HTML5 attributes and/or JavaScript API.",
   "keywords": [
     "utils",
@@ -61,6 +61,6 @@
     "webpack-log": "^3.0.1"
   },
   "dependencies": {
-    "@cocreate/docs": "^1.2.38"
+    "@cocreate/docs": "^1.2.43"
   }
 }

package/src/index.js

@@ -12,34 +12,94 @@ export function parseTextToHtml(text) {
   else return doc.body.children[0];
 }
 
-export function cssPath(node) {
-  let pathSplits = [];
-  do {
-    if (!node || !node.tagName) return false;
-    let pathSplit = node.tagName.toLowerCase();
-    if (node.id && node.tagName !== "BODY") pathSplit += "#" + node.id;
+export function cssPath(node, container) {
+    let pathSplits = [];
+    do {
+        if (!node || !node.tagName) return false;
+        let pathSplit = node.tagName.toLowerCase();
+        if (node.id){
+            pathSplit += "#" + node.id;
+            node = '';
+        }
+        else {
+            let eid = node.getAttribute('eid');
+            if (eid) {
+                pathSplit += `[eid="${eid}"]`;
+                node = '';
+            }
+            else {
+                if (node.classList.length) {
+                    node.classList.forEach((item) => {
+                        if (item.indexOf(":") === -1) pathSplit += "." + item;
+                    });
+                }
+        
+                if (node.parentNode) {
+                    let index = Array.prototype.indexOf.call(
+                        node.parentNode.children,
+                        node
+                    );
+                    pathSplit += `:nth-child(${index + 1})`;
+                }
+        
+                // pathSplits.unshift(pathSplit);
+                node = node.parentNode;
+                if (node.tagName == "HTML" || node.nodeName == "#document" || node.hasAttribute('contenteditable'))
+                	node = '';
+            }
+        }
+        pathSplits.unshift(pathSplit);
+    } while (node);
+    return pathSplits.join(" > ");
+}
 
-    if (node.classList.length && node.tagName !== "BODY") {
-      node.classList.forEach((item) => {
-        if (item.indexOf(":") === -1) pathSplit += "." + item;
-      });
-    }
+export function domParser(str) {
+    let mainTag = str.match(/\<(?<tag>[a-z0-9]+)(.*?)?\>/).groups.tag;
+    if (!mainTag)
+        throw new Error('find position: can not find the main tag');
 
-    if (node.tagName !== "BODY" && node.parentNode) {
-      let index = Array.prototype.indexOf.call(
-        node.parentNode.children,
-        node
-      );
-      pathSplit += `:nth-child(${index + 1})`;
-    }
+    let doc;
+    switch (mainTag) {
+        case 'html':
+            doc = new DOMParser().parseFromString(str, "text/html");
+            return doc.documentElement;
+        case 'body':
+            doc = new DOMParser().parseFromString(str, "text/html");
+            return doc.body;
+        case 'head':
+            doc = new DOMParser().parseFromString(str, "text/html");
+            return doc.head;
 
-    pathSplits.unshift(pathSplit);
-    node = node.parentNode;
-  } while (node.tagName !== "HTML");
+        default:
+            let con = document.createElement('div');
+            con.innerHTML = str;
+            return con;
+    }
+}
 
-  return pathSplits.join(" > ");
+export function queryFrameSelector(selector) {
+		if(selector.indexOf(';') !== -1) {
+			let [frameSelector, target] = selector.split(';');
+			let frame = document.querySelector(frameSelector);
+			if (frame) {
+			 	let Document = frame.contentDocument;
+			 	let elements = Document.querySelectorAll(target);
+			 	return elements;
+			}
+		}
 }
 
+export function queryFrameSelectorAll(selector) {
+		if(selector.indexOf(';') !== -1) {
+			let [frameSelector, target] = selector.split(';');
+			let frame = document.querySelector(frameSelector);
+			if (frame) {
+			 	let Document = frame.contentDocument;
+			 	let element = Document.querySelector(target);
+			 	return element;
+			}
+		}
+}
 // export function computeStyles(el, properties) {
 //   let computed = window.getComputedStyle(el);
 //   let result = {};
@@ -64,5 +124,6 @@ export function cssPath(node) {
 export default {
   parseTextToHtml,
   getAttributes,
-  cssPath
+  cssPath,
+  domParser
 };

package/src/index.old.js

@@ -319,6 +319,33 @@ export function frameQuerySelectorAll(comSelector) {
 
 }
 
+async function complexSelector(comSelector, callback) {
+	let [canvasSelector, selector] = comSelector.split(';');
+	let canvas = document.querySelector(canvasSelector);
+	if(!canvas) {
+		console.warn('complex selector canvas now found for', comSelector);
+		return;
+	}
+
+	if(canvas.contentDocument.readyState === 'loading') {
+		try {
+			await new Promise((resolve, reject) => {
+				canvas.contentWindow.addEventListener('load', (e) => resolve());
+			});
+		}
+		catch(err) {
+			console.error('iframe can not be loaded');
+		}
+	}
+
+	if(canvas.contentWindow.parent.CoCreate.observer && !observerInit.has(canvas.contentWindow)) {
+		observerElements(canvas.contentWindow);
+	}
+
+	return callback(canvas.contentWindow.document, selector);
+}
+
+
 // export function computeStyles(el, properties) {
 //   let computed = window.getComputedStyle(el);
 //   let result = {};