From 2b46ea46ba1dada9374cbb9a59d84aecc391be89 Mon Sep 17 00:00:00 2001 From: Steve Date: Sun, 10 Mar 2024 21:36:37 +0100 Subject: [PATCH] chore: setup package.json --- jsdoc.json | 24 ++++++++++++++++++++ package.json | 48 +++++++++++++++++++++++++++++----------- src/js/kompleter.js | 21 ++++++++---------- src/js/kompletr.cache.js | 18 ++++++--------- src/js/kompletr.dom.js | 15 +++++++++++++ 5 files changed, 90 insertions(+), 36 deletions(-) create mode 100644 jsdoc.json diff --git a/jsdoc.json b/jsdoc.json new file mode 100644 index 0000000..c3f626c --- /dev/null +++ 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 + } +} \ No newline at end of file diff --git a/package.json b/package.json index c1a1c6a..dd86f4c 100755 --- a/package.json +++ b/package.json @@ -4,18 +4,34 @@ "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": "steve@konfer.be", + "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": "steve@konfer.be" + }, + "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", @@ -23,14 +39,20 @@ "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 index d017706..b18deed 100644 --- 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 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 index 0e07fc2..6622e71 100644 --- 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); }); } }; \ No newline at end of file diff --git a/src/js/kompletr.dom.js b/src/js/kompletr.dom.js index 5048b12..b23bc45 100644 --- 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; }