Пришёл, увидел, загрузил (часть 1) (#7)

* подключил API, работают поинты и форма редактирования
* Заработала форма добавления поинта
* Пришёл, увидел, загрузил

src/main.js

@@ -1,34 +1,57 @@
 import Presenter from './presenter/presenter.js';
 import PointsModel from './model/points-model.js';
-import DestinationsModel from './model/destinations-model.js';
-import OffersModel from './model/offers-model.js';
 import FilterModel from './model/filter-model.js';
 import FilterPresenter from './presenter/presenter-filter.js';
+import PointsApiService from './points-api-service.js';
+import CreationForm from './view/creation-form.js';
+import { render } from './framework/render.js';
 
 const filterContainer = document.querySelector('.trip-controls__filters');
+const tripMainElement = document.querySelector('.trip-main');
 
 
-const pointsModel = new PointsModel();
-const destinationsModel = new DestinationsModel();
-const offersModel = new OffersModel();
-const filterModel = new FilterModel();
+const AUTHORIZATION = 'Basic hf7898sdfscv83';
+const END_POINT = 'https://23.objects.htmlacademy.pro/big-trip';
+
 
+const pointsModel = new PointsModel({
+  pointsApiService: new PointsApiService(END_POINT, AUTHORIZATION)
+});
+const filterModel = new FilterModel();
 
 const presenter = new Presenter({
   pointsModel,
-  destinationsModel,
-  offersModel,
   filterModel,
-
+  onNewPointDestroy: handleNewPointButtonClose
 });
 
-
 const filterPresenter = new FilterPresenter({
   filterContainer: filterContainer,
   filterModel,
   pointsModel
 });
 
+const newPointButtonComponent = new CreationForm({
+  onClick: handleNewPointButtonClick
+});
+
+function handleNewPointButtonClick() {
+  presenter.createPoint();
+  newPointButtonComponent.element.disabled = true;
+}
+
+function handleNewPointButtonClose() {
+  newPointButtonComponent.element.disabled = false;
+}
+
+render(newPointButtonComponent, tripMainElement);
+
+newPointButtonComponent.element.disabled = true;
+
 
 presenter.init();
 filterPresenter.init();
+pointsModel.init()
+  .finally(() => {
+    newPointButtonComponent.element.disabled = false;
+  });

src/model/points-model.js

@@ -1,56 +1,132 @@
-import { MOCKED_EVENTS } from '../mock/trip-event.js';
+// import { MOCKED_EVENTS } from '../mock/trip-event.js';
 import Observable from '../framework/observable.js';
+import { UpdateType } from '../utils.js/const.js';
 
 export default class PointsModel extends Observable {
-  #tripEventAll = null;
-  constructor() {
+  #pointsApiService = null;
+  #points = [];
+  #offers = [];
+  #destinations = [];
+
+  constructor({ pointsApiService }) {
     super();
-    this.#tripEventAll = MOCKED_EVENTS;
+    this.#pointsApiService = pointsApiService;
   }
 
   get event() {
-    return this.#tripEventAll;
+    return this.#points;
+  }
+
+  get offers() {
+    return this.#offers;
   }
 
-  updatePoint(updateType, update) {
-    const index = this.#tripEventAll.findIndex((point) => point.id === update.id);
+  get destinations() {
+    return this.#destinations;
+  }
+
+  async init() {
+    try {
+      const points = await this.#pointsApiService.points;
+      const offers = await this.#pointsApiService.offers;
+      const destinations = await this.#pointsApiService.destinations;
+
+      this.#points = points.map(this.#adaptToClient);
+      this.#offers = offers;
+      this.#destinations = destinations;
+    } catch (err) {
+      this.#points = [];
+      this.#offers = [];
+      this.#destinations = [];
+    }
+
+
+    this._notify(UpdateType.INIT);
+  }
+
+  async updatePoint(updateType, update) {
+    const index = this.#points.findIndex((point) => point.id === update.id);
 
     if (index === -1) {
       throw new Error('Can\'t update unexisting point');
     }
+    try {
+      const response = await this.#pointsApiService.updatePoint(update);
+      const updatedPoint = this.#adaptToClient(response);
 
-    this.#tripEventAll = [
-      ...this.#tripEventAll.slice(0, index),
-      update,
-      ...this.#tripEventAll.slice(index + 1)
-    ];
+      this.#points = [
+        ...this.#points.slice(0, index),
+        updatedPoint,
+        ...this.#points.slice(index + 1)
+      ];
 
-    this._notify(updateType, update);
+      this._notify(updateType, updatedPoint);
+    } catch (err) {
+      throw new Error('Can\'t update point');
+    }
   }
 
-  addPoint(updateType, update) {
-    update.id = crypto.randomUUID();
-    this.#tripEventAll = [
-      update,
-      ...this.#tripEventAll,
-    ];
+  async addPoint(updateType, update) {
+    try {
+      const response = await this.#pointsApiService.addPoint(update);
+      const newPoint = this.#adaptToClient(response);
 
-    this._notify(updateType, update);
-  }
+      this.#points = [
+        newPoint,
+        ...this.#points
+      ];
 
-  deletePoint(updateType, update) {
-    const index = this.#tripEventAll.findIndex((point) => point.id === update.id);
+      this._notify(updateType, newPoint);
+    } catch (err) {
+      throw new Error('Can\'t add point');
+    }
+
+  }
 
+  async deletePoint(updateType, update) {
+    const index = this.#points.findIndex((point) => point.id === update.id);
     if (index === -1) {
       throw new Error('Can\'t update unexisting point');
     }
 
-    this.#tripEventAll = [
-      ...this.#tripEventAll.slice(0, index),
-      ...this.#tripEventAll.slice(index + 1)
-    ];
+    try {
+      await this.#pointsApiService.deletePoint(update);
+      this.#points = [
+        ...this.#points.slice(0, index),
+        ...this.#points.slice(index + 1)
+      ];
+
+      this._notify(updateType);
+    } catch (err) {
+      throw new Error('Can\'t delete point');
+    }
+  }
+
+  #adaptToClient(point) {
+    const adaptedPoint = {
+      ...point,
+      basePrice: point['base_price'],
+      dateFrom: new Date(point['date_from']),
+      dateTo: new Date(point['date_to']),
+      isFavorite: point['is_favorite']
+    };
+
+    delete adaptedPoint['base_price'];
+    delete adaptedPoint['date_from'];
+    delete adaptedPoint['date_to'];
+    delete adaptedPoint['is_favorite'];
+
+    return adaptedPoint;
+  }
+
+  getCurrentOffer(type) {
+    if (this.offers) {
+      return this.offers.find((item) => item.type === type);
+    }
+  }
 
-    this._notify(updateType);
+  getDestinationId(id) {
+    return this.destinations.find((item) => item.id === id);
   }
 }