@cocreate/unique 1.10.8 → 1.11.1

package/CHANGELOG.md

@@ -1,3 +1,25 @@
+## [1.11.1](https://github.com/CoCreate-app/CoCreate-unique/compare/v1.11.0...v1.11.1) (2023-05-18)
+
+
+### Bug Fixes
+
+* Refactor module imports for client file ([c0b1f24](https://github.com/CoCreate-app/CoCreate-unique/commit/c0b1f246e5adc69d953f62447b4fd4a5c8b6ae9e))
+
+# [1.11.0](https://github.com/CoCreate-app/CoCreate-unique/compare/v1.10.8...v1.11.0) (2023-05-17)
+
+
+### Bug Fixes
+
+* Refactor server.js to include the uid field in the response object for readDocument method. ([beb58e2](https://github.com/CoCreate-app/CoCreate-unique/commit/beb58e20f3f8e9b8ed7d5ffb646b3af0897ef787))
+
+
+### Features
+
+* Add "unique" attribute to input fields ([ebb0765](https://github.com/CoCreate-app/CoCreate-unique/commit/ebb076581ca1b64df4a27dd21f5d56287eae4674))
+* Add unique input check and server implementation ([5469faa](https://github.com/CoCreate-app/CoCreate-unique/commit/5469faae84157d45b1fa583e1c20336cbeb8b500))
+* Import Observer and pass unique attributes to target and callback. ([a63801d](https://github.com/CoCreate-app/CoCreate-unique/commit/a63801da65d9cbeca605bd5ba0f66e43d1dd74c1))
+* Refactor client.js init() to take an element arg and handle arrays ([4e63aa0](https://github.com/CoCreate-app/CoCreate-unique/commit/4e63aa070d79ae817b4364582f23b3af2f772b2d))
+
 ## [1.10.8](https://github.com/CoCreate-app/CoCreate-unique/compare/v1.10.7...v1.10.8) (2023-05-10)
 
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cocreate/unique",
-  "version": "1.10.8",
+  "version": "1.11.1",
   "description": "A simple unique component in vanilla javascript. Easily configured using HTML5 attributes and/or JavaScript API.",
   "keywords": [
     "unique",

package/src/client.js

@@ -0,0 +1,94 @@
+import observer from '@cocreate/observer';
+import crud from '@cocreate/crud-client';
+
+
+/**
+* Initializes input event listeners for the specified elements. This is a convenience method for calling setInputEvent on each element.
+* 
+* @param elements - The HTMLElement or array of HTMLElements to listen
+*/
+function init(elements) {
+    // Returns an array of unique elements
+    if (!elements)
+        elements = document.querySelectorAll('[unique]')
+    // If elements is not an array of elements returns an array of elements.
+    else if (!Array.isArray(elements))
+        elements = [elements]
+    for (let element of elements)
+        setInputEvent(element)
+}
+
+/**
+* Sets the input event to prevent duplicate. This is necessary because IE doesn't support unique = " true " in HTML5.
+* 
+* @param input - The input element to listen for changes on. Note that it's an object
+*/
+function setInputEvent(input) {
+    let delayTimer
+    input.addEventListener('input', function () {
+        input.setAttribute('unique', true);
+
+        clearTimeout(delayTimer);
+        delayTimer = setTimeout(function () {
+            isUnique(input)
+        }, 1000);
+    });
+}
+
+/**
+* Checks if a value is unique. This is a helper function for CRUD operations that need to be performed on documents in order to make sure they are unique.
+* 
+* @param element - The element that is being checked for uniqueness. It should have the attribute ` name `
+*/
+async function isUnique(element) {
+    let name = element.getAttribute('name');
+    let value = element.getValue();
+    let request = {
+        db: 'indexeddb',
+        collection: element.getAttribute('collection'),
+        filter: {
+            query: [{
+                name,
+                value,
+                operator: '$eq'
+            }]
+        }
+    };
+
+    let data = await crud.readDocument(request)
+    let response = {
+        element,
+        name,
+        unique: true
+    };
+
+    // If a document is returned, unique is set to false  
+    if (data.document && data.document.length) {
+        response.unique = false;
+    }
+
+    // If indexedb response is unique is true, check server response  
+    if (response.unique) {
+        delete request.db
+        response = await crud.socket.send('isUnique', request)
+    }
+
+    // Set unique attribute on the element
+    if (response.unique)
+        element.setAttribute('unique', true);
+    else
+        element.setAttribute('unique', false);
+
+}
+
+observer.init({
+    name: 'CoCreateUnique',
+    observe: ['addedNodes'],
+    target: '[unique]',
+    callback: mutation =>
+        init(mutation.target)
+});
+
+init();
+
+export default { init, isUnique }

package/src/index.js

@@ -1,63 +1,15 @@
-import crud from '@cocreate/crud-client';
-
-const CoCreateUnique = {
-
-	selector: `input[unique], textarea[unique], contenteditable[unique]`,
-	
-	init: function(container) {
-		
-		let mainContainer = container || document;
-		
-		if (!mainContainer.querySelectorAll) {
-			return;
-		}
-		
-		let items = mainContainer.querySelectorAll(this.selector)
-		const self = this;
-		
-		items.forEach((item) => {
-			self.setInputEvent(item)
-		})
-	},
-		
-	checkedUnique: function(data) {
-		const element = data.input
-		if (data['unique'])
-			element.setAttribute('unique', true);
-		else
-			element.setAttribute('unique', false);
-	},
-
-	setInputEvent: function(input) {
-		const self = this;
-		input.addEventListener('input', function(e) {
-			let name = input.getAttribute('name');
-			let value = input.getValue();
-			let request = {
-				collection: input.getAttribute('collection'),
-				filter: {
-					query: [{
-						name, 
-						value,
-						operator: '$eq'
-					}]
-				}
-			};
-
-			crud.readDocument(request).then((data) => {
-				let response = {
-					input,
-					name,
-					unique: true
-				};
-				if (data.document && data.document.length) {
-					response.unique = false;
-				}
-				self.checkedUnique(response)
-			})
-
-		});
-	},
-};
-
-CoCreateUnique.init();
+// Check if browser, return client or server file
+(function (root, factory) {
+    if (typeof define === 'function' && define.amd) {
+        define(["./client.js"], function (CoCreateUnique) {
+            return factory(CoCreateUnique)
+        });
+    } else if (typeof module === 'object' && module.exports) {
+        const CoCreateUnique = require("./server.js")
+        module.exports = factory(CoCreateUnique);
+    } else {
+        root.returnExports = factory(root["./client.js"]);
+    }
+}(typeof self !== 'undefined' ? self : this, function (CoCreateUnique) {
+    return CoCreateUnique;
+}));

package/src/server.js

@@ -0,0 +1,48 @@
+class CoCreateUnique {
+    /**
+    * @param crud
+    */
+    constructor(crud) {
+        this.wsManager = crud.wsManager
+        this.crud = crud
+        this.init();
+    }
+
+    init() {
+        if (this.wsManager) {
+            this.wsManager.on('isUnique',
+                (socket, data) => this.isUnique(socket, data));
+        }
+    }
+
+
+    /**
+    * Checks if a document is unique by sending a message to the socket. This is a blocking call so it returns a Promise
+    * 
+    * @param socket - the socket to send the message to
+    * @param data - the data to read from the database usually an object
+    * 
+    * @return { Promise } - resolves with the response from the server or rejects with an error if there was a
+    */
+    async isUnique(socket, data) {
+        const self = this
+        try {
+            this.crud.readDocument(data).then((data) => {
+                let response = {
+                    unique: true,
+                    uid: data.uid
+                };
+                // If the document is unique
+                if (data.document.length) {
+                    response.unique = false;
+                }
+                return self.wsManager.send(socket, 'isUnique', response);
+            })
+        } catch (error) {
+            console.log(error);
+        }
+    }
+
+}
+
+module.exports = CoCreateUnique;