Merge pull request #16 from SergeySofronov/master

htmlacademy-ecmascript · Jan 28, 2025 · a26a1bc · a26a1bc
2 parents 4544c1a + 4340bbd
commit a26a1bc
Show file tree

Hide file tree

Showing 14 changed files with 170 additions and 160 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -35,7 +35,6 @@
   "dependencies": {
     "dayjs": "1.11.7",
     "flatpickr": "4.6.13",
-    "he": "1.2.0",
     "nanoid": "5.0.9"
   }
 }
diff --git a/src/const.js b/src/const.js
@@ -1,3 +1,19 @@
+export const EVENT_MAX_PICE = 100000;
+
+export const EventApi = {
+  AUTHORIZATION: 'Basic jESk1yTUPy1e3ElM4kxi0',
+  END_POINT: 'https://22.objects.htmlacademy.pro/big-trip',
+};
+
+export const ButtonText = {
+  CANCEL: 'Cancel',
+  CREATE: 'New Event',
+  SAVE: 'Save',
+  SAVING: 'Saving...',
+  DELETE: 'Delete',
+  DELETING: 'Deleting...',
+};
+
 export const DateFormat = {
   EVENT_DEFAULT: 'YYYY-MM-DD',
   EVENT_HUMAN: 'MMM DD',
@@ -9,6 +25,11 @@ export const DateFormat = {
   FORM_INPUT: 'd/m/y H:i',
 };
 
+export const ElementSelectors = {
+  ROLL_UP_BUTTON: '.event__rollup-btn',
+  EVENT_ITEM: '.trip-events__item',
+};
+
 export const EventMode = {
   DEFAULT: 'default',
   FORM: 'form',
@@ -28,11 +49,24 @@ export const FilterType = {
 
 export const EventListMessage = {
   [FilterType.EVERYTHING]: 'Click New Event to create your first point',
-  [FilterType.PAST]: 'There are no past events now',
-  [FilterType.PRESENT]: 'There are no present events now',
   [FilterType.FUTURE]: 'There are no future events now',
+  [FilterType.PRESENT]: 'There are no present events now',
+  [FilterType.PAST]: 'There are no past events now',
   LOADING: 'Loading...',
-  ERROR: 'The app is not available'
+  ERROR: 'Failed to load latest route information'
+};
+
+export const KeyCode = {
+  ESC: 'Escape',
+  ENTER: 'Enter',
+  DELETE: 'Delete',
+};
+
+export const Method = {
+  GET: 'GET',
+  PUT: 'PUT',
+  POST: 'POST',
+  DELETE: 'DELETE',
 };
 
 export const SortType = {
@@ -43,37 +77,24 @@ export const SortType = {
   OFFER: 'offers',
 };
 
-export const KeyCode = {
-  ESC: 'Escape',
-  ENTER: 'Enter',
-};
-
 export const tripDefault = {
   basePrice: 0,
+  destinationId: '',
   isFavorite: false,
   offerIds: [],
   type: 'flight',
 };
 
-export const ElementSelectors = {
-  ROLL_UP_BUTTON: '.event__rollup-btn',
-  EVENT_ITEM: '.trip-events__item',
-};
-
-export const ButtonText = {
-  CANCEL: 'Cancel',
-  CREATE: 'New Event',
-  SAVE: 'Save',
-  SAVING: 'Saving...',
-  DELETE: 'Delete',
-  DELETING: 'Deleting...',
-};
-
 export const TripTitleQuantity = {
   MIN: 1,
   MAX: 3,
 };
 
+export const UiBlockerTimeLimit = {
+  LOWER_LIMIT: 350,
+  UPPER_LIMIT: 1000,
+};
+
 export const UserAction = {
   UPDATE_EVENT: 'UPDATE_EVENT',
   CREATE_EVENT: 'CREATE_EVENT',
@@ -85,15 +106,3 @@ export const UpdateType = {
   MINOR: 'MINOR',
   MAJOR: 'MAJOR',
 };
-
-export const Method = {
-  GET: 'GET',
-  PUT: 'PUT',
-  POST: 'POST',
-  DELETE: 'DELETE',
-};
-
-export const UiBlockerTimeLimit = {
-  LOWER_LIMIT: 350,
-  UPPER_LIMIT: 1000,
-};
diff --git a/src/main.js b/src/main.js
@@ -1,17 +1,14 @@
-import { nanoid } from 'nanoid';
 import EventApiService from './event-api-service';
 import TripModel from './model/trip-model';
 import BoardPresenter from './presenter/board-presenter';
 import HeaderPresenter from './presenter/header-presenter';
-
-const AUTHORIZATION = `Basic ${nanoid()}`;
-const END_POINT = 'https://22.objects.htmlacademy.pro/big-trip';
+import { EventApi } from './const';
 
 const tripInfoContainer = document.querySelector('.trip-main');
 const filtersContainer = tripInfoContainer.querySelector('.trip-controls__filters');
 const contentContainer = document.querySelector('.trip-events');
 
-const model = new TripModel(new EventApiService(END_POINT, AUTHORIZATION));
+const model = new TripModel(new EventApiService(EventApi.END_POINT, EventApi.AUTHORIZATION));
 model.init();
 
 const header = new HeaderPresenter(tripInfoContainer, filtersContainer, model);

diff --git a/src/model/trip-model.js b/src/model/trip-model.js
@@ -2,7 +2,6 @@ import Observable from '../framework/observable';
 import { createFilters } from '../utils/filter';
 import { createSortItems } from '../utils/sort';
 import { EventListMessage, FilterType, tripDefault, UpdateType } from '../const';
-import dayjs from 'dayjs';
 
 export default class TripModel extends Observable {
   #eventApiService = null;
@@ -55,26 +54,29 @@ export default class TripModel extends Observable {
   }
 
   getDefaultEvent = () => {
-    const date = dayjs();
+    const date = new Date().toISOString();
     const type = this.#offers.has(tripDefault.type) ? tripDefault.type : this.#offers.keys()[0];
 
     return {
       ...tripDefault,
-      dateFrom: date.toISOString(),
-      dateTo: date.add(1, 'day').toISOString(),
-      destinationId: this.#destinations.values().next().value.id,
+      dateFrom: date,
+      dateTo: date,
       type,
     };
   };
 
   async init() {
     try {
-      const [rawEvents, rawOffers, rawDestinations] = await this.#eventApiService.getTripData();
+      const [rawEvents = [], rawOffers = [], rawDestinations = []] = await this.#eventApiService.getTripData();
+
+      if ((rawOffers.length === 0) || (rawDestinations.length === 0)) {
+        throw new Error('Empty offers/destination list');
+      }
 
       this.#events = new Map(rawEvents.map(this.#adaptEventToClient));
       this.#offers = new Map(rawOffers.map(this.#adaptOffersToClient));
       this.#destinations = new Map(rawDestinations.map(this.#adaptDestinationsToClient));
-    } catch {
+    } catch (error) {
       this.#error = EventListMessage.ERROR;
     } finally {
       this._notify(UpdateType.MAJOR);

diff --git a/src/presenter/board-presenter.js b/src/presenter/board-presenter.js
@@ -1,13 +1,14 @@
-import { sortEvents } from '../utils/sort';
-import { ElementSelectors as E, EventListMessage, EventMode, FilterType, FormMode, KeyCode, SortType, UiBlockerTimeLimit, UpdateType, UserAction } from '../const';
 import SortView from '../view/sort-view';
-import EventListView from '../view/event-list-view';
+import UiBlocker from '../framework/ui-blocker/ui-blocker';
 import NoEventsView from '../view/no-events-view';
+import EventListView from '../view/event-list-view';
+import EventPresenter from './event-presenter';
 import NewEventButtonView from '../view/new-event-button-view';
+import { nanoid } from 'nanoid';
+import { sortEvents } from '../utils/sort';
 import { filterEvents } from '../utils/filter';
-import EventPresenter from './event-presenter';
 import { remove, render } from '../framework/render';
-import UiBlocker from '../framework/ui-blocker/ui-blocker';
+import { ElementSelectors as E, EventListMessage, EventMode, FilterType, FormMode, KeyCode, SortType, UiBlockerTimeLimit, UpdateType, UserAction } from '../const';
 
 export default class BoardPresenter {
   #boardContainer = null;
@@ -24,10 +25,9 @@ export default class BoardPresenter {
   /** @type {TripModel} */
   #tripModel = null;
 
-  #activeSortType = SortType.PRICE;
+  #activeSortType = SortType.DAY;
   #eventPresenters = new Map();
   #activeEventId = '';
-  #newEventPresenter = null;
 
   #isLoading = true;
 
@@ -70,7 +70,6 @@ export default class BoardPresenter {
       return;
     }
 
-    this.#newEventButtonComponent.enable();
     this.#renderSort();
     this.#renderEventList();
     this.#renderEvents();
@@ -87,10 +86,11 @@ export default class BoardPresenter {
       return EventListMessage.LOADING;
     }
 
-    if (this.#tripModel.error) {
-      return this.#tripModel.error;
+    if (this.#tripModel.errorMessage) {
+      return this.#tripModel.errorMessage;
     }
 
+    this.#newEventButtonComponent.enable();
     return (this.#events.length === 0) ? EventListMessage[this.#tripModel.filterType] : '';
   }
 
@@ -120,20 +120,22 @@ export default class BoardPresenter {
     .init(event, this.#offers, this.#destinations, mode)
     .setViewActionHandler(this.#viewActionHandler);
 
-  #renderEvents = () => this.#sortedEvents.forEach((event) => {
-    const presenter = this.#createEventPresenter(event);
-    this.#eventPresenters.set(event.id, presenter);
-  });
+  #renderEvents = () => this.#sortedEvents.forEach((event) => this.#eventPresenters.set(event.id, this.#createEventPresenter(event)));
 
   #newEventHandler = () => {
     this.#toggleEventMode();
     this.#activeSortType = SortType.DAY;
     this.#tripModel.updateFilterType(UpdateType.MAJOR, FilterType.EVERYTHING);
     this.#newEventButtonComponent.disable();
+
     if (this.#events.length === 0) {
       this.#renderEventList();
     }
-    this.#newEventPresenter = this.#createEventPresenter(this.#tripModel.getDefaultEvent(), FormMode.CREATE);
+
+    const newEvent = this.#tripModel.getDefaultEvent();
+    const newEventId = nanoid();
+    this.#eventPresenters.set(newEventId, this.#createEventPresenter(newEvent, FormMode.CREATE));
+    this.#toggleEventMode(newEventId);
   };
 
   #updateEventList = () => {
@@ -152,7 +154,7 @@ export default class BoardPresenter {
   };
 
   #destroyEventPresenters = () => {
-    this.#destroyNewEventPresenter();
+    this.#newEventButtonComponent.enable();
     this.#eventPresenters.forEach((presenter) => presenter.destroy());
     this.#eventPresenters.clear();
     this.#activeEventId = '';
@@ -165,24 +167,13 @@ export default class BoardPresenter {
     this.#destroyEventPresenters();
   };
 
-  #destroyNewEventPresenter = () => {
-    if (this.#newEventPresenter) {
-      this.#newEventButtonComponent.enable();
-      this.#newEventPresenter.destroy();
-      this.#newEventPresenter = null;
-    }
-  };
-
   #deleteEvent = async (updateType, updatedEvent) => {
     if (updatedEvent.id) {
       await this.#tripModel.deleteEvent(updateType, updatedEvent);
       return;
     }
 
-    this.#destroyNewEventPresenter();
-    if (this.#events.length === 0) {
-      this.#renderNoEvents();
-    }
+    this.#updateEventList();
   };
 
   #viewActionHandler = async (actionType, updateType, updatedEvent) => {
@@ -201,7 +192,7 @@ export default class BoardPresenter {
         try {
           await this.#tripModel.createEvent(updateType, updatedEvent);
         } catch {
-          this.#newEventPresenter.abort();
+          this.#eventPresenters.get(this.#activeEventId).abort();
         }
         break;
 
@@ -236,12 +227,10 @@ export default class BoardPresenter {
   };
 
   #toggleEventMode = (newEventId = '') => {
-    this.#destroyNewEventPresenter();
-
     const eventId = this.#activeEventId;
     if (this.#activeEventId) {
-      this.#eventPresenters.get(eventId).toggleEventView(EventMode.DEFAULT);
       this.#activeEventId = '';
+      this.#eventPresenters.get(eventId).toggleEventView(EventMode.DEFAULT);
     }
 
     if (newEventId && (eventId !== newEventId)) {
@@ -251,7 +240,7 @@ export default class BoardPresenter {
   };
 
   #escKeyHandler = (evt) => {
-    if ((evt.key === KeyCode.ESC) && (this.#activeEventId || this.#newEventPresenter)) {
+    if ((evt.key === KeyCode.ESC) && (this.#activeEventId)) {
       this.#toggleEventMode();
     }
   };