Merge pull request #9 from lemurlene/module8-task1

package.json

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

public/index.html

@@ -18,7 +18,6 @@
           <div class="trip-main__trip-controls  trip-controls">
             <div class="trip-controls__filters">
               <h2 class="visually-hidden">Filter events</h2>
-              <!-- Фильтры -->
             </div>
           </div>
         </div>
@@ -28,10 +27,6 @@ <h2 class="visually-hidden">Filter events</h2>
       <div class="page-body__container">
           <section class="trip-events">
             <h2 class="visually-hidden">Trip events</h2>
-
-            <!-- Сортировка -->
-
-            <!-- Контент -->
           </section>
       </div>
     </main>

src/const.js

@@ -1,73 +1,136 @@
-export const POINTS_TYPES = ['Taxi', 'Bus', 'Train', 'Ship', 'Drive', 'Flight', 'Check-in', 'Sightseeing', 'Restaurant'];
+const AUTHORIZATION = 'Basic itdlerjh51158115';
+const END_POINT = 'https://22.objects.htmlacademy.pro/big-trip';
+const DESTINATIONS_COUNT = 3;
+const EVENT_TYPE_DEFAULT = 'flight';
 
-export const DEFAULT_POINT_TYPE = 'Flight';
+const SeparatorTotalInfo = {
+  DEFAULT: ' — ',
+  MANY_INFO: ' … '
+};
 
-export const POINT_EMPTY = {
-  basePrice: 0,
-  dateFrom: null,
-  dateTo: null,
-  destination: null,
-  isFavorite: false,
-  offers: [],
-  type: DEFAULT_POINT_TYPE,
+const Attribute = {
+  CHECKED: 'checked',
+  DISABLED: 'disabled'
 };
 
-export const SortTypes = {
-  DAY: 'DAY',
-  EVENT: 'EVENT',
-  TIME: 'TIME',
-  PRICE: 'PRICE',
-  OFFER: 'OFFER',
+const FilterType = {
+  EVERYTHING: 'everything',
+  FUTURE: 'future',
+  PRESENT: 'present',
+  PAST: 'past'
 };
 
-export const SORT_TYPE_DEFAULT = 'DAY';
+const MessageText = {
+  [FilterType.EVERYTHING]: 'Click New Event to create your first point',
+  [FilterType.FUTURE]: 'There are no future events now',
+  [FilterType.PRESENT]: 'There are no present events now',
+  [FilterType.PAST]: 'There are no past events now',
 
-export const SORT_TYPES_BLOCK = ['EVENT', 'OFFER'];
+  LOADING: 'Loading...',
+  FAIL: 'Failed to load latest route information',
 
-export const FILTER_TYPE_DEFAULT = 'EVERYTHING';
+  ERROR_ADD: 'Can\'t add point',
+  ERROR_DELETE: 'Can\'t delete point',
+  ERROR_UPDATE: 'Can\'t update point',
+};
 
-export const FilterTypes = {
-  EVERYTHING : 'EVERYTHING',
-  FUTURE: 'FUTURE',
-  PRESENT: 'PRESENT',
-  PAST: 'PAST',
+const UserAction = {
+  UPDATE_POINT: 'UPDATE_POINT',
+  ADD_POINT: 'ADD_POINT',
+  DELETE_POINT: 'DELETE_POINT',
 };
 
-export const MessageText = {
-  LOADING: 'Loading...',
-  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',
+const UpdateType = {
+  PATCH: 'PATCH',
+  MINOR: 'MINOR',
+  MAJOR: 'MAJOR',
+  INIT: 'INIT',
+  ERROR: 'ERROR'
+};
+
+const EventType = {
+  TAXI: 'taxi',
+  BUS: 'bus',
+  TRAIN: 'train',
+  SHIP: 'ship',
+  DRIVE: 'drive',
+  FLIGHT: 'flight',
+  CHECK_IN: 'check-in',
+  SIGHTSEEING: 'sightseeing',
+  RESTAURANT: 'restaurant'
 };
 
-export const FormatsDate = {
+const SortType = {
+  DEFAULT: {
+    name: 'day',
+    isEnabled: true,
+  },
+  EVENT: {
+    name: 'event',
+    isEnabled: false,
+  },
+  TIME: {
+    name: 'time',
+    isEnabled: true,
+  },
+  PRICE: {
+    name: 'price',
+    isEnabled: true,
+  },
+  OFFERS: {
+    name: 'offer',
+    isEnabled: false,
+  },
+};
+
+const DateFormat = {
   DATE: 'MMM D',
+  DATE_2: 'D MMM',
   TIME: 'HH:mm',
   DATE_FULL: 'YYYY-MM-DD',
   DATE_TIME: 'DD/MM/YY HH:mm',
   DATE_TIME_FULL: 'YYYY-MM-DDTHH:mm',
 };
 
-export const Mode = {
+const EditType = {
+  ADD: 'add',
+  EDIT: 'edit'
+};
+
+const BLANK_POINT = {
+  basePrice: 0,
+  dateFrom: '',
+  dateTo: '',
+  destination: null,
+  isFavorite: false,
+  offers: [],
+  type: EVENT_TYPE_DEFAULT
+};
+
+const Mode = {
   DEFAULT: 'DEFAULT',
   EDITING: 'EDITING',
 };
 
-export const EditMode = {
-  ADD: 'ADD',
-  EDIT: 'EDIT'
+const Method = {
+  GET: 'GET',
+  PUT: 'PUT',
+  POST: 'POST',
+  DELETE: 'DELETE'
 };
 
-export const UserAction = {
-  UPDATE_POINT: 'UPDATE_POINT',
-  ADD_POINT: 'ADD_POINT',
-  DELETE_POINT: 'DELETE_POINT',
+const TimeLimit = {
+  LOWER: 350,
+  UPPER: 1000,
 };
 
-export const UpdateType = {
-  PATCH: 'PATCH',
-  MINOR: 'MINOR',
-  MAJOR: 'MAJOR',
+const ApiEndPoint = {
+  POINTS: 'points',
+  DESTINATIONS: 'destinations',
+  OFFERS: 'offers',
 };
+
+export { DESTINATIONS_COUNT, BLANK_POINT, SeparatorTotalInfo, Attribute, EventType, SortType, DateFormat, EditType, FilterType, MessageText, Mode,
+  UserAction, UpdateType, Method, AUTHORIZATION, END_POINT, TimeLimit, ApiEndPoint};
+
+

src/main.js

@@ -1,48 +1,67 @@
-import PointModel from './model/point-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/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-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
-});
+import BoardPresenter from './presenter/board-presenter';
+import PointsModel from './model/points-model';
+import OffersModel from './model/offers-model';
+import DestinationsModel from './model/destinations-model';
+import FiltersModel from './model/filter-model';
+import FilterPresenter from './presenter/filter-presenter';
+import ButtonNewEventView from './view/button-new-event-view';
+import PointApiService from './service/points-api-service';
+import TotalInfoPresenter from './presenter/total-info-presenter';
+import { render, RenderPosition } from './framework/render';
+import { END_POINT, AUTHORIZATION } from './const';
 
-const filterPresenter = new FilterPresenter({
-  filterContainer: siteFilterContainer,
-  filterModel: filterModel,
-  pointModel: pointModel,
+const infoElement = document.querySelector('.trip-main');
+const siteMainElement = document.querySelector('.page-body');
+const siteHeaderElement = siteMainElement.querySelector('.trip-controls__filters');
+const siteSortElement = siteMainElement.querySelector('.trip-events');
+const pointApiService = new PointApiService(END_POINT, AUTHORIZATION);
+const offersModel = new OffersModel({ offersApiService: pointApiService });
+const destinationsModel = new DestinationsModel({ destinationsApiService: pointApiService });
+const pointsModel = new PointsModel({
+  pointApiService: pointApiService,
+  offersModel: offersModel,
+  destinationsModel: destinationsModel,
 });
+const filterModel = new FiltersModel();
 
 const boardPresenter = new BoardPresenter({
-  headerContainer: siteHeaderElement,
-  eventContainer: siteContent,
-  pointModel: pointModel,
+  boardContainer: siteSortElement,
+  filterModel: filterModel,
+  pointsModel: pointsModel,
+  offersModel: offersModel,
   destinationsModel: destinationsModel,
+  isCreatingPoint: false,
+  onNewPointDestroy: handleNewPointFormClose
+});
+
+const newPointButtonComponent = new ButtonNewEventView({
+  onButtonClick: handleNewPointButtonClick
+});
+
+const totalInfoPresenter = new TotalInfoPresenter({
+  headerContainer: infoElement,
+  pointsModel: pointsModel,
   offersModel: offersModel,
-  filterModel: filterModel,
-  buttonNewEventPresenter: buttonNewEventPresenter,
+  destinationsModel: destinationsModel
 });
 
-buttonNewEventPresenter.init({
-  onAddPointButtonClick: () => {
-    boardPresenter.addPointButtonClickHandler();
-  }
+function handleNewPointButtonClick() {
+  boardPresenter.createPoint();
+  newPointButtonComponent.disableButton();
+}
+
+function handleNewPointFormClose() {
+  newPointButtonComponent.enableButton();
+}
+
+const filterPresenter = new FilterPresenter({
+  filterContainer: siteHeaderElement,
+  filterModel: filterModel,
+  pointsModel: pointsModel
 });
-filterPresenter.init();
+
 boardPresenter.init();
+filterPresenter.init();
+render(newPointButtonComponent, infoElement, RenderPosition.BEFOREEND);
+pointsModel.init();
+totalInfoPresenter.init();