Merge pull request htmlacademy-univer-js2#18 from DashaKukartseva/master

package.json

@@ -15,23 +15,23 @@
     "url": "https://github.com/DashaKukartseva/2433045-big-trip-4"
   },
   "dependencies": {
-    "dayjs": "^1.11.6",
-    "flatpickr": "^4.6.13",
-    "he": "^1.2.0"
+    "dayjs": "1.11.6",
+    "flatpickr": "4.6.13",
+    "he": "1.2.0"
   },
   "devDependencies": {
-    "@babel/core": "^7.24.0",
-    "@babel/preset-env": "^7.24.0",
-    "babel-loader": "^9.1.3",
-    "copy-webpack-plugin": "^11.0.0",
-    "css-loader": "^6.11.0",
+    "@babel/core": "7.24.0",
+    "@babel/preset-env": "7.24.0",
+    "babel-loader": "9.1.3",
+    "copy-webpack-plugin": "11.0.0",
+    "css-loader": "6.11.0",
     "eslint": "8.28.0",
     "eslint-config-htmlacademy": "8.0.0",
-    "html-webpack-plugin": "^5.6.0",
-    "style-loader": "^3.3.4",
-    "webpack": "^5.75.0",
-    "webpack-cli": "^5.0.0",
-    "webpack-dev-server": "^4.11.1"
+    "html-webpack-plugin": "5.6.0",
+    "style-loader": "3.3.4",
+    "webpack": "5.75.0",
+    "webpack-cli": "5.0.0",
+    "webpack-dev-server": "4.11.1"
   },
   "engines": {
     "node": "18"

src/const.js

@@ -1,4 +1,3 @@
-const TYPES = ['taxi','bus','train','ship','drive','flight','check-in','sightseeing','restaurant'];
 const DEFAULT_TYPE = 'flight';
 const DESTINATION_ITEMS_LENGTH = 3;
 
@@ -86,7 +85,6 @@ export {
   UpdateType,
   Mode,
   FilterType,
-  TYPES,
   POINT_EMPTY,
   MSEC_IN_HOUR,
   MSEC_IN_DAY, DESTINATION_ITEMS_LENGTH, SortType};

src/main.js

@@ -8,7 +8,7 @@ import pointApiService from './service/apiservice.js';
 import FilterModel from './model/filters.js';
 import { render, RenderPosition } from './framework/render.js';
 
-const AUTHORIZATION = 'Basic dd89j3m2h5l';
+const AUTHORIZATION = 'Basic dd89j3m2h10l';
 const END_POINT = 'https://21.objects.htmlacademy.pro/big-trip';
 const apiService = new pointApiService(END_POINT, AUTHORIZATION);
 
@@ -28,7 +28,8 @@ const routePresenter = new TripPointsPresenter({
   offersModel,
   pointsModel,
   filterModel,
-  onNewPointDestroy: handleNewPointFormClose
+  onNewPointDestroy: handleNewPointFormClose,
+  onNewPointClick: handleNewPointClick,
 });
 
 const filterPresenter = new FilterPresenter({
@@ -46,12 +47,11 @@ function handleNewPointFormClose() {
 }
 
 function handleNewPointButtonClick() {
-  routePresenter.createPoint();
-  newPointButtonComponent.element.disabled = true;
+  routePresenter.createEvent();
+  handleNewPointClick();
 }
 
 render(newPointButtonComponent, tripMainContainer, RenderPosition.BEFOREEND);
-
-routePresenter.init();
 filterPresenter.init();
+routePresenter.init();
 pointsModel.init();

src/presenters/filterpresenter.js

@@ -1,7 +1,7 @@
 import { render, replace, remove } from '../framework/render.js';
 import FilterView from '../view/filter.js';
 import { filter } from '../utils.js';
-import { UpdateType } from '../const';
+import { UpdateType, FilterType} from '../const';
 
 export default class FilterPresenter {
   #filterContainer = null;
@@ -25,7 +25,7 @@ export default class FilterPresenter {
     return Object.entries(filter).map(
       ([filterType, filterPoints]) => ({
         type: filterType,
-        exists: filterPoints(points).length > 0
+        exists: filterType === FilterType.EVERYTHING ? true : filterPoints(points).length > 0
       })
     );
   }

src/presenters/newpointpresenter.js

@@ -1,16 +1,14 @@
 import { remove, render, RenderPosition } from '../framework/render.js';
 import EditablePointView from '../view/modpoint.js';
-import { UserAction, UpdateType, EditType, Method } from '../const.js';
+import {UserAction, UpdateType, EditType} from '../const.js';
 import { isEscapeKey, } from '../utils.js';
-import pointApiService from '../service/apiservice.js';
 
 export default class NewPointPresenter {
   #pointListContainer = null;
   #destinationsModel = null;
   #offersModel = null;
   #handleDataChange = null;
   #handleDestroy = null;
-
   #pointEditComponent = null;
 
   constructor({pointListContainer, destinationsModel, offersModel, onDataChange, onDestroy}) {
@@ -59,11 +57,11 @@ export default class NewPointPresenter {
     });
   }
 
-  #handleEditSubmit = (event) => {
+  #handleEditSubmit = (point) => {
     this.#handleDataChange(
       UserAction.ADD_EVENT,
       UpdateType.MINOR,
-      {id: crypto.randomUUID(), ...event},
+      point
     );
   };
 
@@ -79,7 +77,6 @@ export default class NewPointPresenter {
     this.#pointEditComponent.shake(resetFormState);
   }
 
-
   #handleResetClick = () => {
     this.destroy();
   };
@@ -90,24 +87,4 @@ export default class NewPointPresenter {
       this.destroy();
     }
   };
-
-  async addPoint(update) {
-    const response = await this._load({
-      url: 'points',
-      method: Method.POST,
-      body: JSON.stringify(adaptToServer(update)),
-      headers: new Headers({'Content-Type': 'application/json'}),
-    });
-    const parsedResponse = await pointApiService.parseResponse(response);
-    return parsedResponse;
-    }
-
-  async deleteEvent(update) {
-    const response = await this._load({
-      url: `points/${update.id}`,
-      method: Method.DELETE,
-    });
-
-    return response;
-  }
 }

src/presenters/pointpresenter.js

@@ -1,29 +1,28 @@
 import { render, replace, remove } from '../framework/render.js';
-import { Mode } from '../const.js';
-import { isEscapeKey } from '../utils.js';
+import { isEscapeKey, isBigDifference } from '../utils.js';
 import PointView from '../view/point.js';
 import EditablePointView from '../view/modpoint.js';
-import { UserAction, UpdateType } from '../const.js';
-import { isBigDifference } from '../utils.js';
+import { UserAction, UpdateType, Mode } from '../const.js';
 
 export default class PointPresenter {
   #pointListContainer = null;
   #destinationsModel = null;
   #offersModel = null;
 
-  #onDataChange = null;
+  #handleDataChange = null;
   #point = null;
   #pointComponent = null;
   #pointEditComponent = null;
-  #onModeChange = null;
+  #handleDataChange = null;
+  #handleModeChange = null;
   #mode = Mode.DEFAULT;
 
   constructor({pointListContainer, destinationsModel, offersModel, onDataChange, onModeChange}) {
     this.#pointListContainer = pointListContainer;
     this.#destinationsModel = destinationsModel;
     this.#offersModel = offersModel;
-    this.#onDataChange = onDataChange;
-    this.#onModeChange = onModeChange;
+    this.#handleDataChange = onDataChange;
+    this.#handleModeChange = onModeChange;
   }
 
   init(point) {
@@ -107,7 +106,7 @@ export default class PointPresenter {
   #replacePointToEditor() {
     replace(this.#pointEditComponent, this.#pointComponent);
     document.addEventListener('keydown', this.#escKeyDownHandler);
-    this.#onModeChange();
+    this.#handleModeChange();
     this.#mode = Mode.EDITING;
   }
 
@@ -122,7 +121,7 @@ export default class PointPresenter {
   };
 
   #favoriteClickHandler = () => {
-    this.#onDataChange( UserAction.UPDATE_EVENT, UpdateType.PATCH, {...this.#point, isFavorite: !this.#point.isFavorite});
+    this.#handleDataChange( UserAction.UPDATE_EVENT, UpdateType.PATCH, {...this.#point, isFavorite: !this.#point.isFavorite});
   };
 
   #editorRollupClickHandler = () => {
@@ -132,7 +131,7 @@ export default class PointPresenter {
 
   #editSubmitHandler = (update) => {
     const isMinorUpdate = isBigDifference(update, this.#point);
-    this.#onDataChange(
+    this.#handleDataChange(
       UserAction.UPDATE_EVENT,
       isMinorUpdate ? UpdateType.MINOR : UpdateType.PATCH,
       update,
@@ -141,7 +140,7 @@ export default class PointPresenter {
   };
 
   #editResetHandler = (event) => {
-    this.#onDataChange(
+    this.#handleDataChange(
       UserAction.DELETE_EVENT,
       UpdateType.MINOR,
       event,

src/presenters/trippresenter.js

@@ -13,33 +13,40 @@ export default class TripPointsPresenter {
   #listComponent = new ListView();
   #sortComponent = null;
   #noPointComponent = null;
+
   #tripContainer = null;
   #tripInfoContainer = null;
 
   #destinationsModel = null;
   #offersModel = null;
   #pointsModel = null;
   #filterModel = null;
+  #handleNewPointClick = null;
+  #handleNewPointDestroy = null;
+
   #tripInfoPresenter = null;
   #pointPresenters = new Map();
   #newPointPresenter = null;
+
   #currentSortType = SortType.DAY;
   #filterType = FilterType.EVERYTHING;
   #isLoading = true;
   #isLoadingError = false;
+  #isCreating = false;
   #uiBlocker = new UiBlocker({
     lowerLimit: TimeLimit.LOWER_LIMIT,
     upperLimit: TimeLimit.UPPER_LIMIT
   });
 
-  constructor({tripInfoContainer, tripContainer, destinationsModel, offersModel, pointsModel,filterModel, onNewPointDestroy}) {
+  constructor({tripInfoContainer, tripContainer, destinationsModel, offersModel, pointsModel,filterModel, onNewPointDestroy, onNewPointClick}) {
     this.#tripInfoContainer = tripInfoContainer;
     this.#tripContainer = tripContainer;
     this.#destinationsModel = destinationsModel;
     this.#offersModel = offersModel;
     this.#pointsModel = pointsModel;
     this.#filterModel = filterModel;
-    this.#tripContainer = tripContainer;
+    this.#handleNewPointClick = onNewPointClick;
+    this.#handleNewPointDestroy = onNewPointDestroy;
 
     this.#newPointPresenter = new NewPointPresenter({
       pointListContainer: this.#listComponent,
@@ -54,9 +61,10 @@ export default class TripPointsPresenter {
   }
 
   get points() {
-    this.#filterType = this.#filterModel.filter;
+    this.#filterType = FilterType.EVERYTHING;
     const points = this.#pointsModel.get();
     const filteredPoints = filter[this.#filterType](points);
+
     return sort[this.#currentSortType](filteredPoints);
   }
 
@@ -65,14 +73,17 @@ export default class TripPointsPresenter {
   }
 
   createPoint() {
+    this.#isCreating = true;
     this.#currentSortType = SortType.DAY;
     this.#filterModel.setFilter(UpdateType.MAJOR, FilterType.EVERYTHING);
     this.#newPointPresenter.init();
+    this.#isCreating = false;
   }
 
   #renderTrip() {
     if (this.#isLoading) {
       this.#renderMessage({isLoading: true});
+      this.#handleNewPointClick();
       return;
     }
 
@@ -81,7 +92,7 @@ export default class TripPointsPresenter {
       return;
     }
 
-    if (this.points.length === 0) {
+    if (this.points.length === 0 && !this.#isCreating) {
       this.#renderMessage();
       return;
     }
@@ -180,8 +191,8 @@ export default class TripPointsPresenter {
       destinationsModel: this.#destinationsModel,
       offersModel: this.#offersModel
     });
-    const sortedEvents = sort[SortType.DAY](this.events);
-    this.#tripInfoPresenter.init(sortedEvents);
+    const sortedPoints = sort[SortType.DAY](this.points);
+    this.#tripInfoPresenter.init(sortedPoints);
   };
 
   #clearTripInfo = () => {
@@ -209,6 +220,7 @@ export default class TripPointsPresenter {
       case UpdateType.INIT:
         this.#isLoadingError = data.isError;
         this.#isLoading = false;
+        this.#handleNewPointDestroy();
         this.#clearTrip();
         this.#renderTrip();
         this.#renderTripInfo();

src/presenters/utils.js

@@ -33,7 +33,7 @@ function firstLetterToLowerCase(type) {
 
 function isBigDifference(event1, event2) {
   return event1.price !== event2.price
-    || getEventDuration(event1.dateFrom, event1.dateTo) !== getEventDuration(event2.dateFrom, event2.dateTo);
+    || getPointDuration(event1.dateFrom, event1.dateTo) !== getPointDuration(event2.dateFrom, event2.dateTo);
 }
 
 function sortByDay(event1, event2) {
@@ -156,24 +156,24 @@ const sort = {
 };
 
 export {
-  isEventPast,
-  isEventPresent,
-  isEventFuture,
-  formatStringToDateTime,
-  formatStringToShortDate,
-  formatStringToTime,
-  getPointDuration,
+  adaptToClient,
+  adaptToServer,
   firstLetterToUpperCase,
   firstLetterToLowerCase,
   updateItem,
   isEscapeKey,
+  formatStringToDateTime,
+  formatStringToShortDate,
+  formatStringToTime,
+  getPointDuration,
+  sortByDay,
   sortByTime,
   sortByPrice,
   isBigDifference,
   filter,
   NoEventsTextType,
-  adaptToClient,
-  adaptToServer,
-  sortByDay, sort, getTripTitle,
+  sort,
+  getTripTitle,
   getTripDuration,
-  getTripCost};
+  getTripCost
+  };