Merge pull request #8 from lemurlene/module7-task1

package.json

@@ -36,6 +36,7 @@
   "dependencies": {
     "dayjs": "1.11.7",
     "flatpickr": "4.6.13",
+    "he": "1.2.0",
     "nanoid": "4.0.2"
   }
 }

src/const.js

@@ -1,30 +1,44 @@
-export const DESTINATIONS = ['Amsterdam', 'Chamonix', 'Geneva'];
-
 export const POINTS_TYPES = ['Taxi', 'Bus', 'Train', 'Ship', 'Drive', 'Flight', 'Check-in', 'Sightseeing', 'Restaurant'];
 
+export const DEFAULT_POINT_TYPE = 'Flight';
+
+export const POINT_EMPTY = {
+  basePrice: 0,
+  dateFrom: null,
+  dateTo: null,
+  destination: null,
+  isFavorite: false,
+  offers: [],
+  type: DEFAULT_POINT_TYPE,
+};
+
 export const SortTypes = {
-  DAY: 'day',
-  EVENT: 'event',
-  TIME: 'time',
-  PRICE: 'price',
-  OFFER: 'offer',
+  DAY: 'DAY',
+  EVENT: 'EVENT',
+  TIME: 'TIME',
+  PRICE: 'PRICE',
+  OFFER: 'OFFER',
 };
 
-export const SORT_TYPES_BLOCK = ['event', 'offer'];
+export const SORT_TYPE_DEFAULT = 'DAY';
+
+export const SORT_TYPES_BLOCK = ['EVENT', 'OFFER'];
+
+export const FILTER_TYPE_DEFAULT = 'EVERYTHING';
 
 export const FilterTypes = {
-  EVERYTHING : 'everything',
-  FUTURE: 'future',
-  PRESENT: 'present',
-  PAST: 'past',
+  EVERYTHING : 'EVERYTHING',
+  FUTURE: 'FUTURE',
+  PRESENT: 'PRESENT',
+  PAST: 'PAST',
 };
 
 export const MessageText = {
   LOADING: 'Loading...',
-  LIST_EMPTY__EVERYTHING: 'Click New Event to create your first point',
-  LIST_EMPTY__PAST: 'There are no past events now',
-  LIST_EMPTY__PRESENT: 'There are no present events now',
-  LIST_EMPTY__FUTURE: 'There are no future events now',
+  EVERYTHING: 'Click New Event to create your first point',
+  PAST: 'There are no past events now',
+  PRESENT: 'There are no present events now',
+  FUTURE: 'There are no future events now',
   FAIL: 'Failed to load latest route information',
 };
 
@@ -40,3 +54,20 @@ export const Mode = {
   DEFAULT: 'DEFAULT',
   EDITING: 'EDITING',
 };
+
+export const EditMode = {
+  ADD: 'ADD',
+  EDIT: 'EDIT'
+};
+
+export const UserAction = {
+  UPDATE_POINT: 'UPDATE_POINT',
+  ADD_POINT: 'ADD_POINT',
+  DELETE_POINT: 'DELETE_POINT',
+};
+
+export const UpdateType = {
+  PATCH: 'PATCH',
+  MINOR: 'MINOR',
+  MAJOR: 'MAJOR',
+};

src/main.js

@@ -1,25 +1,48 @@
 import PointModel from './model/point-model.js';
 import DestinationsModel from './model/destinations-model.js';
 import OffersModel from './model/offers-model.js';
-
-import ListPresenter from './presenter/list-presenter.js';
+import FilterModel from './model/filter-model.js';
+import FilterPresenter from './presenter/filter-presenter.js';
+import BoardPresenter from './presenter/board-presenter.js';
+import ButtonNewEventPresenter from './presenter/button-new-event-presenter.js';
 
 const siteContent = document.querySelector('.trip-events');
 const siteMainHeader = document.querySelector('.page-header');
-const siteHeaderElement = siteMainHeader.querySelector('.trip-controls__filters');
+const siteHeaderElement = siteMainHeader.querySelector('.trip-main');
+const siteFilterContainer = siteMainHeader.querySelector('.trip-controls__filters');
 
 const pointModel = new PointModel();
 pointModel.init();
 const destinationsModel = new DestinationsModel();
 destinationsModel.init();
 const offersModel = new OffersModel();
 offersModel.init();
+const filterModel = new FilterModel();
+
+const buttonNewEventPresenter = new ButtonNewEventPresenter({
+  headerContainer: siteHeaderElement
+});
+
+const filterPresenter = new FilterPresenter({
+  filterContainer: siteFilterContainer,
+  filterModel: filterModel,
+  pointModel: pointModel,
+});
 
-const listPresenter = new ListPresenter({
+const boardPresenter = new BoardPresenter({
   headerContainer: siteHeaderElement,
   eventContainer: siteContent,
   pointModel: pointModel,
   destinationsModel: destinationsModel,
-  offersModel: offersModel
+  offersModel: offersModel,
+  filterModel: filterModel,
+  buttonNewEventPresenter: buttonNewEventPresenter,
+});
+
+buttonNewEventPresenter.init({
+  onAddPointButtonClick: () => {
+    boardPresenter.addPointButtonClickHandler();
+  }
 });
-listPresenter.init();
+filterPresenter.init();
+boardPresenter.init();

src/mock/points.js

@@ -1,4 +1,4 @@
-import { getRandomArrayElement } from '../utils/utils.js'
+import { getRandomArrayElement } from '../utils/utils.js';
 
 const mockPoints = [
   {
@@ -333,5 +333,5 @@ function getRandomPoint() {
   return getRandomArrayElement(mockPoints);
 }
 
-export { getRandomPoint }
+export { getRandomPoint };
 

src/model/destinations-model.js

@@ -1,9 +1,11 @@
 import { destinations } from '../mock/destinations.js';
+import Observable from '../framework/observable.js';
 
-export default class DestinationsModel {
+export default class DestinationsModel extends Observable {
   #destinations;
 
   constructor() {
+    super();
     this.#destinations = [];
   }
 

src/model/filter-model.js

@@ -0,0 +1,16 @@
+
+import Observable from '../framework/observable.js';
+import {FILTER_TYPE_DEFAULT} from '../const.js';
+
+export default class FilterModel extends Observable {
+  #filter = FILTER_TYPE_DEFAULT;
+
+  get filter() {
+    return this.#filter;
+  }
+
+  setFilter(updateType, filter) {
+    this.#filter = filter;
+    this._notify(updateType, filter);
+  }
+}

src/model/offers-model.js

@@ -1,9 +1,11 @@
 import { offers } from '../mock/offers.js';
+import Observable from '../framework/observable.js';
 
-export default class OffersModel {
+export default class OffersModel extends Observable {
   #offers;
 
   constructor() {
+    super();
     this.#offers = [];
   }
 

src/model/point-model.js

@@ -1,10 +1,12 @@
+import Observable from '../framework/observable.js';
 import { getRandomPoint } from '../mock/points.js';
 const POINT_COUNT = 4;
 
-export default class PointModel {
+export default class PointModel extends Observable {
   #points;
 
   constructor() {
+    super();
     this.#points = [];
   }
 
@@ -15,6 +17,19 @@ export default class PointModel {
   get points() {
     return this.#points;
   }
-}
 
+  updatePoint(updateType, updatedPoint) {
+    this.#points = this.#points.map((point) => point.id === updatedPoint.id ? updatedPoint : point);
+    this._notify(updateType, updatedPoint);
+  }
+
+  addPoint(updateType, newPoint) {
+    this.#points = [newPoint, ...this.#points];
+    this._notify(updateType, newPoint);
+  }
 
+  deletePoint(updateType, deletedPoint) {
+    this.#points = this.#points.filter((point) => point.id !== deletedPoint.id);
+    this._notify(updateType);
+  }
+}