diff --git a/Beverage.js b/Beverage.js
new file mode 100644
index 0000000..09cf87c
--- /dev/null
+++ b/Beverage.js
@@ -0,0 +1,101 @@
+function createBeverage(options) {
+ const view = document.createElement('fieldset');
+ view.className = 'beverage';
+ view.innerHTML = `
+ ×
+ Напиток №${options.number}
+
+
+ Сделайте напиток на
+
+
+
+
+
+
+ Добавьте к напитку:
+
+
+
+
+
+ `;
+ return view;
+}
+
+class Beverage {
+ view;
+ #container;
+ #number;
+ #numberView;
+ #variableElements;
+
+ constructor(options) {
+ this.view = createBeverage(options);
+ this.#number = options.number;
+ this.#container = options.container;
+ this.#numberView = this.view.getElementsByClassName('number')[0];
+ this.#variableElements = Array.from(this.view.getElementsByTagName('input'));
+
+ const wishesInput = this.view.querySelector('.wishes');
+ const wishesResult = this.view.querySelector('.wishes-result')
+ wishesInput.addEventListener('input', event => {
+ const regex = /срочно|быстрее|побыстрее|скорее|поскорее|очень нужно/gmi;
+ wishesResult.innerHTML = event.target.value.replace(regex, `$&`);
+ });
+
+ const deleteButton = this.view.querySelector('.btn-delete');
+ deleteButton.addEventListener('click', () => {
+ this.#container ? this.#container.remove(this.#number - 1) : this.view.remove();
+ });
+ }
+
+ set number(value) {
+ if (value < 0) {
+ throw 'incorrect number';
+ }
+ this.#number = value;
+ this.#updateView();
+ }
+
+ #updateView() {
+ this.#numberView.textContent = this.#number;
+ this.#variableElements.forEach(element => element.name = element.name.replace(/\d+/, this.#number));
+ }
+}
diff --git a/ItemContainer.js b/ItemContainer.js
new file mode 100644
index 0000000..10f20ef
--- /dev/null
+++ b/ItemContainer.js
@@ -0,0 +1,27 @@
+class ItemContainer {
+ #source = [];
+ #view;
+
+ constructor(view) {
+ this.#view = view;
+ }
+
+ get count() {
+ return this.#source.length;
+ }
+
+ append(item) {
+ this.#source.push(item);
+ this.#view.append(item.view);
+ }
+
+ remove(index) {
+ if (this.count > 1) {
+ const [removedItem] = this.#source.splice(index, 1);
+ removedItem.view.remove();
+ for (let subIndex = index; subIndex < this.#source.length; subIndex++) {
+ this.#source[subIndex].number = subIndex + 1;
+ }
+ }
+ }
+}
diff --git a/index.html b/index.html
index ddc8250..0f92928 100644
--- a/index.html
+++ b/index.html
@@ -6,56 +6,10 @@
-
+
+
+
+