@cocreate/api 1.2.18 → 1.2.22

package/CHANGELOG.md

@@ -1,3 +1,32 @@
+## [1.2.22](https://github.com/CoCreate-app/CoCreate-api/compare/v1.2.21...v1.2.22) (2022-01-01)
+
+
+### Bug Fixes
+
+* get-value attribute value now supports a selector added # to all values currently in get-value attributes ([e36f596](https://github.com/CoCreate-app/CoCreate-api/commit/e36f5961be023c7dbb1eb7643ac2e995f1c6d0c0))
+
+## [1.2.21](https://github.com/CoCreate-app/CoCreate-api/compare/v1.2.20...v1.2.21) (2022-01-01)
+
+
+### Bug Fixes
+
+* removed data- from attributes ([ed63cfd](https://github.com/CoCreate-app/CoCreate-api/commit/ed63cfd6375cba25960fc0a3349ee39ddb98eebc))
+
+## [1.2.20](https://github.com/CoCreate-app/CoCreate-api/compare/v1.2.19...v1.2.20) (2021-12-31)
+
+
+### Bug Fixes
+
+* clean code ([a44ef95](https://github.com/CoCreate-app/CoCreate-api/commit/a44ef95a5fb2e0686d811fdd11144d093c2e0455))
+* removed data- and added elements.getValue ([d339cbd](https://github.com/CoCreate-app/CoCreate-api/commit/d339cbd783f9fe5f244337907dc3ec3cd2d2cf54))
+
+## [1.2.19](https://github.com/CoCreate-app/CoCreate-api/compare/v1.2.18...v1.2.19) (2021-12-15)
+
+
+### Bug Fixes
+
+* update dependencies ([c50ad0d](https://github.com/CoCreate-app/CoCreate-api/commit/c50ad0d654955591a26a7eb2ccb903584d302227))
+
 ## [1.2.18](https://github.com/CoCreate-app/CoCreate-api/compare/v1.2.17...v1.2.18) (2021-12-14)
 
 

package/demo/index.html

@@ -10,31 +10,31 @@
         <h1>Form Demo</h1>
         
         <form>
-            <input data-xxx="xxxCreateRequest.name">
+            <input xxx="xxxCreateRequest.name">
         
-            <div data-xxx="xxxCreateRequest.address" data-xxx_array="address">
-            	<input data-xxx="address.home.city">
-            	<input data-xxx="address.work">
+            <div xxx="xxxCreateRequest.address" xxx_array="address">
+            	<input xxx="address.home.city">
+            	<input xxx="address.work">
             </div>
             
-            <div data-xxx="xxxCreateRequest.address" data-xxx_array="address">
-            	<input data-xxx="address.home.city">
-            	<input data-xxx="address.name">
-            	<input data-xxx="address.line1">
-        
-            	<div data-xxx="address.billing" data-xxx_array="b">
-            	    <input data-xxx="b.address1">
-            	    <input data-xxx="b.city">
-            	    <input data-xxx="b.code.zip">
-            	    <input data-xxx="b.code.postal">
+            <div xxx="xxxCreateRequest.address" xxx_array="address">
+            	<input xxx="address.home.city">
+            	<input xxx="address.name">
+            	<input xxx="address.line1">
+        
+            	<div xxx="address.billing" xxx_array="b">
+            	    <input xxx="b.address1">
+            	    <input xxx="b.city">
+            	    <input xxx="b.code.zip">
+            	    <input xxx="b.code.postal">
             	</div>
             </div>
-            <input data-xxx="xxxCreateRequest.email">
+            <input xxx="xxxCreateRequest.email">
             
-            <div template_id="xxxCreateCard" render-array="data.card" render-key="c"  data-xxx="xxxCreateCard.card" data-xxx_array="card">
-                <input data-xxx="card.number" value="c.number">
-                <input data-xxx="card.cvv" value="c.cvv">
-                <input data-xxx="card.expiry" value="c.expiry">
+            <div template_id="xxxCreateCard" render-array="data.card" render-key="c"  xxx="xxxCreateCard.card" xxx_array="card">
+                <input xxx="card.number" value="c.number">
+                <input xxx="card.cvv" value="c.cvv">
+                <input xxx="card.expiry" value="c.expiry">
             </div>
             
             

package/docs/form.html

@@ -194,7 +194,7 @@
 										<div class="svSplitter svHorizontal"> </div>
 		
 										<div class="svPanel">
-											<iframe get-value="demo" frameBorder="0" height="100%" width="100%" class="min-width:300px"></iframe>
+											<iframe get-value="#demo" frameBorder="0" height="100%" width="100%" class="min-width:300px"></iframe>
 										</div>
 		
 									</div>

package/docs/index.html

@@ -156,22 +156,22 @@
 								<p class="padding:10px_0px line-height:1.5">
 									<pre><code class="language-html">
 	&lt;form&gt;  
-	   &lt;input data-stripe=&quot;createCustomer.name&quot;&gt;
-	   &lt;div data-stripe=&quot;createCustomer.address&quot; data-stripe_array=&quot;address&quot;&gt;
-	    	&lt;input data-stripe=&quot;address.home.city&quot;&gt;
-	    	&lt;input data-stripe=&quot;address.work&quot;&gt;
+	   &lt;input stripe=&quot;createCustomer.name&quot;&gt;
+	   &lt;div stripe=&quot;createCustomer.address&quot; stripe_array=&quot;address&quot;&gt;
+	    	&lt;input stripe=&quot;address.home.city&quot;&gt;
+	    	&lt;input stripe=&quot;address.work&quot;&gt;
 	    &lt;/div&gt;
 	    
-	    &lt;div data-stripe=&quot;createCustomer.address&quot; data-xxx_array=&quot;address&quot;&gt;
-	    	&lt;input data-stripe=&quot;address.home.city&quot;&gt;
-	    	&lt;input data-stripe=&quot;address.name&quot;&gt;
-	    	&lt;input data-stripe=&quot;address.line1&quot;&gt;
+	    &lt;div stripe=&quot;createCustomer.address&quot; xxx_array=&quot;address&quot;&gt;
+	    	&lt;input stripe=&quot;address.home.city&quot;&gt;
+	    	&lt;input stripe=&quot;address.name&quot;&gt;
+	    	&lt;input stripe=&quot;address.line1&quot;&gt;
 	
-	    	&lt;div data-stripe=&quot;address.billing&quot; data-xxx_array=&quot;b&quot;&gt;
-	    	    &lt;input data-stripe=&quot;b.address1&quot;&gt;
-	    	    &lt;input data-stripe=&quot;b.city&quot;&gt;
-	    	    &lt;input data-stripe=&quot;b.code.zip&quot;&gt;
-	    	    &lt;input data-stripe=&quot;b.code.postal&quot;&gt;
+	    	&lt;div stripe=&quot;address.billing&quot; xxx_array=&quot;b&quot;&gt;
+	    	    &lt;input stripe=&quot;b.address1&quot;&gt;
+	    	    &lt;input stripe=&quot;b.city&quot;&gt;
+	    	    &lt;input stripe=&quot;b.code.zip&quot;&gt;
+	    	    &lt;input stripe=&quot;b.code.postal&quot;&gt;
 	    	&lt;/div&gt;
 	    &lt;/div&gt;
 	   &lt;button actions=&#39;createCustomer&#39;&gt;Create Form&lt;/button&gt;
@@ -220,7 +220,7 @@
 										<div class="svSplitter svHorizontal"> </div>
 		
 										<div class="svPanel">
-											<iframe get-value="demo" frameBorder="0" height="100%" width="100%" class="min-width:300px"></iframe>
+											<iframe get-value="#demo" frameBorder="0" height="100%" width="100%" class="min-width:300px"></iframe>
 										</div>
 		
 									</div>

package/docs/module.html

@@ -184,7 +184,7 @@
 									<div class="svSplitter svHorizontal"> </div>
 	
 									<div class="svPanel">
-										<iframe get-value="demo" frameBorder="0" height="100%" width="100%" class="min-width:300px"></iframe>
+										<iframe get-value="#demo" frameBorder="0" height="100%" width="100%" class="min-width:300px"></iframe>
 									</div>
 	
 								</div>

package/docs/server.html

@@ -195,7 +195,7 @@
 									<div class="svSplitter svHorizontal"> </div>
 	
 									<div class="svPanel">
-										<iframe get-value="demo" frameBorder="0" height="100%" width="100%" class="min-width:300px"></iframe>
+										<iframe get-value="#demo" frameBorder="0" height="100%" width="100%" class="min-width:300px"></iframe>
 									</div>
 	
 								</div>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cocreate/api",
-  "version": "1.2.18",
+  "version": "1.2.22",
   "description": "A simple api helper component in vanilla javascript used by JavaScript developers to create thirdparty api intergrations. CoCreate-api includes the client component and server side for api processing. Thirdparty apis can be accessible using HTML5 attributes and/or JavaScript API. ",
   "keywords": [
     "thirdparty-api-intergration",
@@ -62,11 +62,12 @@
     "webpack-log": "^3.0.1"
   },
   "dependencies": {
-    "@cocreate/actions": "^1.3.24",
-    "@cocreate/crud-client": "^1.4.39",
-    "@cocreate/docs": "^1.2.61",
-    "@cocreate/hosting": "^1.2.57",
-    "@cocreate/render": "^1.3.23",
-    "@cocreate/socket-client": "^1.4.15"
+    "@cocreate/actions": "^1.3.25",
+    "@cocreate/crud-client": "^1.4.40",
+    "@cocreate/docs": "^1.2.62",
+    "@cocreate/elements": "^1.5.0",
+    "@cocreate/hosting": "^1.2.58",
+    "@cocreate/render": "^1.3.24",
+    "@cocreate/socket-client": "^1.4.16"
   }
 }

package/src/client.js

@@ -2,6 +2,7 @@
 import CoCreateSocket from "@cocreate/socket-client";
 import CoCreateAction from '@cocreate/actions';
 import CoCreateRender from '@cocreate/render';
+import CoCreateElements from '@cocreate/elements';
 
 let socketApi = new CoCreateSocket('api');
 
@@ -44,9 +45,9 @@ const CoCreateApi = {
 		}
 	},
 	
-	__responseProcess: function(m_name, data) {
+	__responseProcess: function(id, data) {
 		const {type, response} = data;
-		const m_instance = this.modules[m_name];
+		const m_instance = this.modules[id];
 		
 		if (type && response && m_instance) {
 		
@@ -65,24 +66,29 @@ const CoCreateApi = {
 	},
 	
 	__commonAction: function(id, action, element) {
-		const container = element.closest("form") || document;
-		let data = CoCreateApi.getFormData(id, action,  container);
+		const form = element.closest("form") || document;
+		let data = CoCreateApi.getFormData(id, action,  form);
 		CoCreateApi.send(id, action, data);
 	},
 	
 	
-	getFormData : function(m_name, action, container){
-		const mainAttr = `data-${m_name}`;
+	getFormData: function(id, action, form){
+		const mainAttr = id;
 		const self = this;
-		const elements = container.querySelectorAll(`[${mainAttr}^="${action}."]`);
+		const elements = form.querySelectorAll(`[${mainAttr}^="${action}."]`);
 
 		let data = {};
 		elements.forEach(element => {
 			let name = element.getAttribute(mainAttr);
-			let array_name = element.getAttribute(mainAttr + "_array");
-			let value = self.__getElValue(element);
-			
 			if (!name) return;
+			
+			let array_name = element.getAttribute(mainAttr + "_array");
+
+			let value;
+			if(element.getValue)
+				value = element.getValue(element);
+			else
+				value = CoCreateElements.getValue(element);
 
 			if (action) {
 				let re = new RegExp(`^${action}.`, 'i');
@@ -97,7 +103,7 @@ const CoCreateApi = {
 				if (!data[name]) {
 					data[name] = [];
 				}
-				data[name].push(self.getFormData(m_name, array_name, element));
+				data[name].push(self.getFormData(id, array_name, element));
 			} else if (value != null) {
 				data[name] = value;
 			}
@@ -118,31 +124,6 @@ const CoCreateApi = {
 		return objectData;
 	},
 	
-	__getElValue: function(element) {
-		let value = null;
-		if(element.getValue)
-			value = element.getValue(element);
-		else if (typeof element.value !== "undefined") {
-			switch (element.type.toLocaleLowerCase()) {
-				case 'checkbox':
-					if (element.checked) {
-						value = element.value;
-					}
-					break;
-				default:
-					value = element.value;
-					break;
-			}
-		} else {
-			value = element.getAttribute('value');
-			if (!value) {
-				value = element.innerHTML;
-			}
-		}
-		
-		return value;
-	},
-	
 	__mergeObject: function(target, source) {
 		target = target || {};
 		for (let key of Object.keys(source)) {
@@ -180,13 +161,12 @@ const CoCreateApi = {
 		});
 	},
 	
-	getCommonParams: function(info) 
-	{
+	getCommonParams: function(info) {
 		return {
 			"apiKey":           info.apiKey || config.apiKey,
 			"organization_id":  info.organization_id || config.organization_Id,
-		}
+		};
 	}
-}
+};
                 
 export default CoCreateApi;