ремонт доки

This commit is contained in:
vigdorov
2020-07-10 00:19:05 +03:00
parent 3fe0b232fd
commit 9abc6a6c92
8 changed files with 30 additions and 12171 deletions

View File

@ -4,7 +4,7 @@
"browser": true, "browser": true,
"es2020": true "es2020": true
}, },
"extends": "eslint:recommended", "extends": ["eslint:recommended"],
"parserOptions": { "parserOptions": {
"ecmaVersion": 11, "ecmaVersion": 11,
"sourceType": "module" "sourceType": "module"

1
.gitignore vendored
View File

@ -5,3 +5,4 @@
/out /out
**.DS_Store **.DS_Store
package-lock.json

12056
package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@ -7,7 +7,7 @@
"build": "webpack --mode=production", "build": "webpack --mode=production",
"start": "webpack-dev-server --open", "start": "webpack-dev-server --open",
"dev": "webpack-dev-server", "dev": "webpack-dev-server",
"docs": "jsdoc -r ./src", "docs": "rm -rf out && documentation build src/** -f html -o out",
"show:docs": "lite-server --baseDir=\"out\"", "show:docs": "lite-server --baseDir=\"out\"",
"lint": "eslint -c .eslintrc.json src --fix" "lint": "eslint -c .eslintrc.json src --fix"
}, },
@ -32,13 +32,13 @@
"clean-webpack-plugin": "^3.0.0", "clean-webpack-plugin": "^3.0.0",
"css-loader": "^3.6.0", "css-loader": "^3.6.0",
"cssnano": "^4.1.10", "cssnano": "^4.1.10",
"documentation": "^13.0.2",
"eslint": "^7.4.0", "eslint": "^7.4.0",
"eslint-loader": "^4.0.2", "eslint-loader": "^4.0.2",
"file-loader": "^6.0.0", "file-loader": "^6.0.0",
"html-loader": "^1.1.0", "html-loader": "^1.1.0",
"html-webpack-plugin": "^4.3.0", "html-webpack-plugin": "^4.3.0",
"image-webpack-loader": "^6.0.0", "image-webpack-loader": "^6.0.0",
"jsdoc": "^3.6.4",
"mini-css-extract-plugin": "^0.9.0", "mini-css-extract-plugin": "^0.9.0",
"postcss-import": "^12.0.1", "postcss-import": "^12.0.1",
"postcss-loader": "^3.0.0", "postcss-loader": "^3.0.0",

View File

@ -2,31 +2,21 @@ import {v4 as uuidv4} from 'uuid';
import StorageServiceApi from './StorageServiceAPI'; import StorageServiceApi from './StorageServiceAPI';
/**
* @typedef Element
* @type {object}
* @property {string} _id - уникальный id элемента
*/
/** /**
* Класс создания api для списков данных * Класс создания api для списков данных
* @class *
* @class StorageListApi
* @param {string} key - уникальный ключ для api, который будет записан в сервисе
*/ */
class StorageListApi { class StorageListApi {
/**
* @param {string} key - уникальный ключ для api, который будет записан в сервисе
*/
constructor (key) { constructor (key) {
this.key = key; this.key = key;
this.api = new StorageServiceApi(); this.api = new StorageServiceApi();
} }
/** /**
* @private * @param {Array<{_id: string}>} list - список элементов по которым осуществялется поиск
*
* @param {Array.<Element>} list - список элементов по которым осуществялется поиск
* @param {string} _id - _id искомого элемента * @param {string} _id - _id искомого элемента
*
* @returns {number} - Возвращает индекс искомого эллемента по _id * @returns {number} - Возвращает индекс искомого эллемента по _id
*/ */
_findIndex = (list, _id) => { _findIndex = (list, _id) => {
@ -34,20 +24,15 @@ class StorageListApi {
} }
/** /**
* @private * @param {Array<{_id: string}>} list - новый список элементов
* * @returns {Promise<Array<{_id: string}>>} - возвращает обновленный список элементов
* @param {Array<Element>} list - новый список элементов
*
* @returns {Promise<Array<Element>>} - возвращает обновленный список элементов
*/ */
_updateList = async (list) => { _updateList = async (list) => {
return await this.api.createOrUpdate(this.key, list); return await this.api.createOrUpdate(this.key, list);
} }
/** /**
* @public * @returns {Promise<Array<{_id: string}>>} - возвращает все элементы списка
*
* @returns {Promise<Array<Element>>} - возвращает все элементы списка
*/ */
request = async () => { request = async () => {
const data = await this.api.find(this.key); const data = await this.api.find(this.key);
@ -55,11 +40,8 @@ class StorageListApi {
} }
/** /**
* @public
*
* @param {string} _id - _id искомого элемента списка * @param {string} _id - _id искомого элемента списка
* * @returns {Promise<{_id: string}>} - возвращает элемент списка или генерит ошибку
* @returns {Promise<Element>} - возвращает элемент списка или генерит ошибку
*/ */
find = async (_id) => { find = async (_id) => {
const list = await this.request(); const list = await this.request();
@ -71,11 +53,8 @@ class StorageListApi {
} }
/** /**
* @public * @param {object} data - элемент списка
* * @returns {Promise<{_id: string}>} - Возвращает вновь созданный элемент с уникальным полем _id
* @param {Object} data - элемент списка
*
* @returns {Promise<Element>} - Возвращает вновь созданный элемент с уникальным полем _id
*/ */
create = async (data) => { create = async (data) => {
const list = await this.request(); const list = await this.request();
@ -89,11 +68,8 @@ class StorageListApi {
} }
/** /**
* @public * @param {{_id: string}} data - элемент списка
* * @returns {Promise<{_id: string}>} - Возвращает обновленный элемент списка
* @param {Element} data - элемент списка
*
* @returns {Promise<Element>} - Возвращает обновленный элемент списка
*/ */
update = async (data) => { update = async (data) => {
const list = await this.request(); const list = await this.request();
@ -107,10 +83,7 @@ class StorageListApi {
} }
/** /**
* @public
*
* @param {string} _id - _id удаляемого элемента * @param {string} _id - _id удаляемого элемента
*
* @returns {Promise<string>} - Возвращает _id удаленного элемента или ошибку * @returns {Promise<string>} - Возвращает _id удаленного элемента или ошибку
*/ */
remove = async (_id) => { remove = async (_id) => {

View File

@ -2,13 +2,6 @@ import axios from 'axios';
import {API_URL, ENDPOINT} from './consts'; import {API_URL, ENDPOINT} from './consts';
/**
* @typedef Store
* @type {object}
* @property {string} key
* @property {unknown} value
*/
/** /**
* Класс для работы с store-service api * Класс для работы с store-service api
* @class * @class
@ -17,9 +10,8 @@ class StorageServiceApi {
URL = `${API_URL}${ENDPOINT}`; URL = `${API_URL}${ENDPOINT}`;
/** /**
* @public * Запрос полного списка всех пар ключ-значение
* * @returns {Promise<Array<{key: string, value: unknown}>>} - Возвращает список всех пар ключ-значение
* @returns {Promise<Array<Store>>} - Возвращает список всех пар ключ-значение
*/ */
request = async () => { request = async () => {
const {data} = await axios.get(this.URL); const {data} = await axios.get(this.URL);
@ -27,10 +19,8 @@ class StorageServiceApi {
} }
/** /**
* @public * Запрос одной пары ключ-значение
*
* @param {string} key - ключ хранилища в api * @param {string} key - ключ хранилища в api
*
* @returns {Promise<unknown>} - Возвращает значение по указанному ключу * @returns {Promise<unknown>} - Возвращает значение по указанному ключу
*/ */
find = async (key) => { find = async (key) => {
@ -39,11 +29,9 @@ class StorageServiceApi {
} }
/** /**
* @public * Создание или обновление пары ключ-значение
*
* @param {string} key - ключ хранилища в api * @param {string} key - ключ хранилища в api
* @param {unknown} value - значение, которое будет хранится под указанным ключом * @param {unknown} value - значение, которое будет хранится под указанным ключом
*
* @returns {Promise<unknown>} - возвращает вновь созданный элемент * @returns {Promise<unknown>} - возвращает вновь созданный элемент
*/ */
createOrUpdate = async (key, value) => { createOrUpdate = async (key, value) => {
@ -52,10 +40,8 @@ class StorageServiceApi {
} }
/** /**
* @public * Удаление пары ключ-значение
*
* @param {string} key - ключ хранилища api * @param {string} key - ключ хранилища api
*
* @returns {Promise<string>} - возвращает 'ok', если удаление было выполнено * @returns {Promise<string>} - возвращает 'ok', если удаление было выполнено
*/ */
remove = async (key) => { remove = async (key) => {

View File

@ -1,15 +1,7 @@
/**
* @type {string}
*/
export const API_URL = 'http://vigdorov.ru:4001'; export const API_URL = 'http://vigdorov.ru:4001';
/**
* @type {string}
*/
export const ENDPOINT = '/store'; export const ENDPOINT = '/store';
/**
* @type {Object<string, string>}
*/
export const API_KEYS = { export const API_KEYS = {
}; };

View File

@ -1,58 +1,28 @@
/** /**
* @typedef Listener * Класс для создания компонентов приложения. Необходим для наследования.
* @type {Object} * @param {string} mainNodeSelector - селектор, с помощью которого извлекается шаблон компонента
* @property {Node} element * @param {Node} parentNode - родительский Node, в который следует положить созданный элемент
* @property {string} eventName
* @property {function} listener
*/
/**
* @function EventListener
* @param {unknown[]} args - аргументы функции
*/
/**
* @typedef Events
* @type {Object<string, EventListener[]>}
*/
/**
* Класс для создания компонентов приложения. Необходим для нследования.
* @class
*/ */
class Component { class Component {
/** /**
* @private * Список слушателей компонента
* * @type {{element: Node, eventName: string, listener: Function}[]}
* @type {Listener[]}
*/ */
_listeners; _listeners;
/** /**
* События компонента * События компонента
* @private * @type {Object<string, Function[]>}
*
* @type {Events}
*/ */
_events; _events;
/** /**
* Корневой элемент компонента * Корневой элемент компонента
* @public
*
* @type {Node} - корневой элемент компонента * @type {Node} - корневой элемент компонента
*/ */
mainNode; mainNode;
/**
* @param {string} mainNodeSelector - селектор, с помощью которого извлекается шаблон компонента
* @param {Node} parentNode - родительский Node, в который следует положить созданный элемент
* @constructor
*/
constructor (mainNodeSelector, parentNode) { constructor (mainNodeSelector, parentNode) {
/**
* @type {DocumentFragment}
*/
const content = document.querySelector(mainNodeSelector).content; const content = document.querySelector(mainNodeSelector).content;
if (content.children.length > 1) { if (content.children.length > 1) {
const message = '<template> должен содержать только один элемент children'; const message = '<template> должен содержать только один элемент children';
@ -66,11 +36,9 @@ class Component {
/** /**
* Метод добавления обработчиков события на Node'ы компонента * Метод добавления обработчиков события на Node'ы компонента
* @public
*
* @param {Node} element - элемент, на который будет навешен обработчик * @param {Node} element - элемент, на который будет навешен обработчик
* @param {string} eventName - событие, на которое будет реагировать обработчик * @param {string} eventName - событие, на которое будет реагировать обработчик
* @param {function} listener - обработчик события * @param {Function} listener - обработчик события
*/ */
addEventListener = (element, eventName, listener) => { addEventListener = (element, eventName, listener) => {
element.addEventListener(eventName, listener); element.addEventListener(eventName, listener);
@ -79,10 +47,8 @@ class Component {
/** /**
* Метод подписки на события компонента * Метод подписки на события компонента
* @public
*
* @param {string} eventName - событие компонента, на которое будет реагировать обработчик * @param {string} eventName - событие компонента, на которое будет реагировать обработчик
* @param {EventListener} listener - обработчик события * @param {Function} listener - обработчик события
*/ */
subscribe = (eventName, listener) => { subscribe = (eventName, listener) => {
const listeners = this._events[eventName] || []; const listeners = this._events[eventName] || [];
@ -94,8 +60,6 @@ class Component {
/** /**
* Метод генерирует событие * Метод генерирует событие
* @public
*
* @param {string} eventName - событие, которое необходимо сгенерировать * @param {string} eventName - событие, которое необходимо сгенерировать
* @param {unknown[]} args - аругемнты, который необходимо передать обработчикам события * @param {unknown[]} args - аругемнты, который необходимо передать обработчикам события
*/ */
@ -108,7 +72,6 @@ class Component {
/** /**
* Метод уничтожения компонента. Удаляет элемент из верстки, снимает обработчики и очищает подписки * Метод уничтожения компонента. Удаляет элемент из верстки, снимает обработчики и очищает подписки
* @public
*/ */
destroy = () => { destroy = () => {
this._listeners.forEach(({element, eventName, listener}) => { this._listeners.forEach(({element, eventName, listener}) => {