chore: setup package.json

steve-lebleu · Mar 10, 2024 · 2b46ea4 · 2b46ea4
1 parent 1814598
commit 2b46ea4
Show file tree

Hide file tree

Showing 5 changed files with 90 additions and 36 deletions.
diff --git a/jsdoc.json b/jsdoc.json
@@ -0,0 +1,24 @@
+{
+  "plugins": ["plugins/markdown"],
+  "recurseDepth": 10,
+  "source": {
+    "include": ["src/autoComplete.js"]
+  },
+  "sourceType": "module",
+  "tags": {
+    "allowUnknownTags": true,
+    "dictionaries": ["jsdoc"]
+  },
+  "templates": {
+    "cleverLinks": false,
+    "monospaceLinks": false
+  },
+  "opts": {
+    "template": "templates/default",
+    "readme": "README.md",
+    "package": "package.json",
+    "encoding": "utf8",
+    "destination": "./out",
+    "recurse": true
+  }
+}
diff --git a/package.json b/package.json
@@ -4,33 +4,55 @@
   "description": "jQuery auto-complete plugin",
   "main": "src/js/index.js",
   "type": "module",
-  "scripts": {
-    "build": "mkdir -p dist && cp -r src/index.html src/files/ dist/ & npm run css & npm run js",
-    "css": "node-sass ./src/sass/kompleter.scss ./dist/css/kompleter.min.css --output-style compressed",
-    "js": "webpack",
-    "cypress:open": "cypress open",
-    "cypress:run": "cypress run --browser chrome ./cypress",
-    "start": "webpack serve --hot"
+  "author": {
+    "name": "Steve Lebleu",
+    "email": "[email protected]",
+    "url": "https://www.konfer.be"
   },
+  "homepage": "https://github.com/steve-lebleu/kompletr",
   "repository": {
     "type": "git",
-    "url": "https://github.com/steve-lebleu/kompleter.git"
+    "url": "https://github.com/steve-lebleu/kompletr.git"
+  },
+  "bugs": {
+    "url": "https://github.com/steve-lebleu/kompletr/issues",
+    "email": "[email protected]"
+  },
+  "demo": "",
+  "download": "",
+  "directories": {
+    "src": "src",
+    "dist": "dist",
+    "docs": "docs"
   },
+  "files": [
+    "dist",
+    "src"
+  ],
+  "browser": "dist/kompletr.min.js",
+  "unpkg": "dist/kompletr.min.js",
+  "module": "dist/kompletr.min.js",
   "keywords": [
     "html",
     "html5",
     "css",
     "css3",
     "vanilla",
     "javascript",
-    "jquery",
     "plugin",
-    "auto-complete"
+    "auto-complete",
+    "auto-completion",
+    "autocomplete",
+    "autocompletion"
   ],
-  "author": "Steve Lebleu",
   "license": "ISC",
-  "dependencies": {
-    "jquery": "^3.7.1"
+  "scripts": {
+    "build": "mkdir -p dist && cp -r src/index.html src/files/ dist/ & npm run css & npm run js",
+    "css": "node-sass ./src/sass/kompleter.scss ./dist/css/kompleter.min.css --output-style compressed",
+    "js": "webpack",
+    "cypress:open": "cypress open",
+    "cypress:run": "cypress run --browser chrome ./cypress",
+    "start": "webpack serve --hot"
   },
   "devDependencies": {
     "@babel/runtime": "^7.23.6",

diff --git a/src/js/kompleter.js b/src/js/kompleter.js
@@ -7,7 +7,6 @@ import { ViewEngine } from './kompletr.view-engine';
 import { EventManager } from './kompletr.events';
 
 import { animation, origin } from './kompletr.enums';
-import { uuid } from './kompletr.utils';
 import { fadeIn, fadeOut } from './kompletr.animations';
 
 ((window) => {
@@ -95,13 +94,13 @@ import { fadeIn, fadeOut } from './kompletr.animations';
             kompletr.cache.emit(value);
           } else if (kompletr.callbacks.onKeyup) {
             kompletr.callbacks.onKeyup(value, (data) => {
-              EventManager.trigger('requestDone', { from: origin.local, data })
+              EventManager.trigger(EventManager.event.requestDone, { from: origin.local, data })
             });
           } else {
-            EventManager.trigger('requestDone', { from: origin.local, data: kompletr.props.data })
+            EventManager.trigger(EventManager.event.requestDone, { from: origin.local, data: kompletr.props.data })
           }
         } catch(e) {
-          EventManager.trigger('error', e)
+          EventManager.trigger(EventManager.event.error, e)
         }
       },
 
@@ -146,9 +145,10 @@ import { fadeIn, fadeOut } from './kompletr.animations';
 
         kompletr.dom.input.value = typeof kompletr.props.data[idx] === 'object' ? kompletr.props.data[idx][kompletr.options.propToMapAsValue] : kompletr.props.data[idx];
 
-        kompletr.callbacks.onSelect(kompletr.props.data[idx]); // TODO more clean -> give details ? -> put in same handler listener dans selectDone
+        // TODO more clean -> give details ? -> put in same handler listener dans selectDone
+        kompletr.callbacks.onSelect(kompletr.props.data[idx]); 
 
-        EventManager.trigger('selectDone');
+        EventManager.trigger(EventManager.event.selectDone);
 
       },
     },
@@ -160,7 +160,6 @@ import { fadeIn, fadeOut } from './kompletr.animations';
 
     /**
      * @description kompletr events listeners of all religions.
-     * @dependency callbacks + dom + events + props + listeners
      */
     listeners: {
 
@@ -244,7 +243,7 @@ import { fadeIn, fadeOut } from './kompletr.animations';
             if (kompletr.dom.input.value !== kompletr.props.previousValue) {
               kompletr.handlers.hydrate(kompletr.dom.input.value);
             }
-            EventManager.trigger('navigationDone');
+            EventManager.trigger(EventManager.event.navigationDone);
             break
         }
       },
@@ -305,7 +304,7 @@ import { fadeIn, fadeOut } from './kompletr.animations';
 
         // 2. Assign 
 
-        if(data) {
+        if(data) { // TODO data should be a Promise<Array>
           kompletr.props = new Properties({ data });
         }
 
@@ -327,10 +326,8 @@ import { fadeIn, fadeOut } from './kompletr.animations';
 
         // 4. Listeners
 
+        kompletr.dom.body.addEventListener('click', kompletr.listeners.onHide);
         kompletr.dom.input.addEventListener('keyup', kompletr.listeners.onKeyup);
-
-        const body = document.getElementsByTagName('body')[0];
-        body.addEventListener('click', kompletr.listeners.onHide);
 
         document.addEventListener('kompletr.select.done', kompletr.listeners.onHide);
         document.addEventListener('kompletr.navigation.done', kompletr.listeners.onNavigationDone);        

diff --git a/src/js/kompletr.cache.js b/src/js/kompletr.cache.js
@@ -1,5 +1,4 @@
-import { animation, origin } from './kompletr.enums';
-import { build, uuid } from './kompletr.utils';
+import { origin } from './kompletr.enums';
 
  /**
    * @description Kompletr caching mechanism implementation.
@@ -32,7 +31,6 @@ export class Cache {
    * @returns {Void}
    */
   emit(string) {
-    console.log('get from the cache')
     window.caches.open(this._name)
       .then(cache => {
         cache.match(string)
@@ -41,7 +39,7 @@ export class Cache {
           });
       })
       .catch(e => {
-        this._eventManager.trigger('error', e);
+        this._eventManager.trigger(this._eventManager.event.error, e);
       });
   }
 
@@ -86,17 +84,15 @@ export class Cache {
    * @returns {Void}
    */
   set({ string, data }) {
-    console.log('set the cache')
-    data = JSON.stringify(data);
     window.caches.open(this._name)
       .then(cache => {
-        const headers = new Headers;
-        headers.set('content-type', 'application/json');
-        headers.set('cache-control', `max-age=${this._duration}`);
-        cache.put(`/${string}`, new Response(data, { headers }));
+        const headers = new Headers()
+          .set('Content-Type', 'application/json')
+          .set('Cache-Control', `max-age=${this._duration}`);
+        cache.put(`/${string}`, new Response(JSON.stringify(data), { headers }));
       })
       .catch(e => {
-        this._eventManager.trigger('error', e);
+        this._eventManager.trigger(this._eventManager.event.error, e);
       });
   }
 };
diff --git a/src/js/kompletr.dom.js b/src/js/kompletr.dom.js
@@ -5,6 +5,11 @@ import { build } from './kompletr.utils';
  */
 export class DOM {
 
+  /**
+   * @description Body tag
+   */
+  _body = null;
+
   /**
    * @description Main input text
    */
@@ -21,6 +26,8 @@ export class DOM {
   _result = null;
 
   constructor(input, options = { theme: 'light' }) {
+    this._body = document.getElementsByTagName('body')[0];
+
     this._input = input instanceof HTMLInputElement ? input : document.getElementById(input);
 
     this._result = build('div', [ { id: 'kpl-result' }, { class: 'form--search__result' } ]);
@@ -29,6 +36,14 @@ export class DOM {
     this._input.parentElement.appendChild(this._result);
   }
 
+  get body() {
+    return this._body;
+  }
+
+  set body(value) {
+    this._body = value;
+  }
+
   get input() {
     return this._input;
   }