apuc/cg-select
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fixed initEvent methods and added methods close

Browse Source
This commit is contained in:
Макс Овсяников 2022-09-23 11:39:14 +03:00
parent d9ea1a592a
commit bf0eb08cc6
1 changed files with 27 additions and 45 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

72
src/cg-dropdown.js
View File

@ -10,7 +10,7 @@ export class DropDown {
this.#init(options); this.#init(options);
this.#initAmount(); this.#initAmount();
this.#render(); this.#render();
// this.#initEvent(); this.#initEvent();
} }
#init(options) { #init(options) {
@ -72,8 +72,6 @@ export class DropDown {
#render() { #render() {
const { items, styles } = this.#options; const { items, styles } = this.#options;
console.log(styles);
this.#initSelected(); this.#initSelected();
this.#element.querySelector(this.#options.selector); this.#element.querySelector(this.#options.selector);
@ -82,6 +80,7 @@ export class DropDown {
if (styles) { if (styles) {
const { list } = styles; const { list } = styles;
console.log(styles);
ul.classList.add('list'); ul.classList.add('list');
if (ul) { if (ul) {
@ -115,6 +114,11 @@ export class DropDown {
this.#caret.classList.toggle('caret_rotate'); this.#caret.classList.toggle('caret_rotate');
} }
#close() {
this.#list.classList.remove('open');
this.#caret.classList.remove('caret_rotate');
}
#selectItem() { #selectItem() {
const options = this.#element.querySelectorAll('.list__item'); const options = this.#element.querySelectorAll('.list__item');
const selected = this.#element.querySelector('.selected'); const selected = this.#element.querySelector('.selected');
@ -131,49 +135,30 @@ export class DropDown {
}); });
} }
//TODO: Fix problems in mouseenter #initEvent() {
// #initEvent() { const { event } = this.#options;
// const { event } = this.#options; if (!event) {
// if (!event) { return;
// return; }
// }
// this.#list = this.#element.querySelectorAll('.list'); this.#list = this.#element.querySelectorAll('.list');
// this.#caret = this.#element.querySelector('.caret'); this.#caret = this.#element.querySelector('.caret');
// // let list = this.#element.querySelectorAll('.list');
// if (event) {
// let list = this.#element.querySelectorAll('.list');
// console.log(list);
// // list.classList.add('open');
// if (event === 'mouseenter') {
// this.#element.addEventListener(event, () => {
// // this.#open();
// this.#list.classList.add('open');
// });
// this.#element.addEventListener('mouseleave', () => { if (event) {
// // this.#list.classList.remove('open'); let list = this.#element.querySelectorAll('.list');
// // this.#caret.classList.remove('caret_rotate'); console.log(list);
// // this.#open();
// console.log('bbb');
// });
// }
// }
// if (event === 'mouseenter') { if (event === 'mouseenter') {
// this.#element.addEventListener(event, () => { this.#element.addEventListener(event, () => {
// // this.#open(); this.#open();
// console.log('aaa'); });
// });
// this.#element.addEventListener('mouseleave', () => { this.#element.addEventListener('mouseleave', () => {
// // this.#list.classList.remove('open'); this.#close();
// // this.#caret.classList.remove('caret_rotate'); });
// // this.#open(); }
// console.log('bbb'); }
// }); }
// }
// }
#customStyles(styles) { #customStyles(styles) {
if (!styles) { if (!styles) {
@ -233,9 +218,6 @@ export class DropDown {
const { items } = this.#options; const { items } = this.#options;
items.push(item); items.push(item);
console.log(items);
this.#render(); this.#render();
} }
} }