8.10. Additional functionality

src/constants.js

@@ -87,8 +87,8 @@ export const UpdateType = {
 export const DEFAULT_POINT = {
   id: 0,
   basePrice: 0,
-  dateFrom: new Date().toISOString(),
-  dateTo: new Date().toISOString(),
+  dateFrom: '',
+  dateTo: '',
   destination: 0,
   isFavorite: false,
   offers: [],
@@ -110,7 +110,7 @@ export const Method = {
 
 export const END_POINT = 'https://24.objects.htmlacademy.pro/big-trip';
 
-export const Authorization = 'Basic FE49wwUYuvTvhn9vBjwv4';
+export const AUTHORIZATION = 'Basic FE49wwUYuvTvhn9vBjwv4';
 
 export const LIMIT_DISPLAYED_DESTINATIONS = 3;
 

src/main.js

@@ -3,14 +3,14 @@ import PointModel from './model/point-model.js';
 import FilterModel from './model/filter-model.js';
 import FilterPresenter from './presenter/filter-presenter.js';
 import PointsApiService from './server/points-api-service.js';
-import { END_POINT, Authorization } from './constants.js';
+import { END_POINT, AUTHORIZATION } from './constants.js';
 import TripInfoPresenter from './presenter/trip-info-presenter';
 
 const tripMainElement = document.querySelector('.trip-main');
 const tripEventsElement = document.querySelector('.trip-events');
 const filtersElement = document.querySelector('.trip-controls__filters');
 
-const pointsApiService = new PointsApiService(END_POINT, Authorization);
+const pointsApiService = new PointsApiService(END_POINT, AUTHORIZATION);
 const pointModel = new PointModel({ pointsApiService });
 const filterModel = new FilterModel();
 

src/model/point-model.js

@@ -59,7 +59,7 @@ export default class PointModel extends Observable {
   async updatePoint(updateType, point) {
     const updatedPoint = await this.#pointsApiService.updatePoint(point);
     this.#points = updateItem(this.#points, updatedPoint);
-    this._notify(updateType, updatedPoint.id);
+    this._notify(updateType, updatedPoint);
   }
 
   async addPoint(updateType, point) {

src/presenter/main-presenter.js

@@ -207,7 +207,7 @@ export default class MainPresenter {
         try {
           await this.#pointModel.addPoint(updateType, point);
         } catch (err) {
-          this.#pointPresenters.setAborting();
+          this.#newPointPresenter.setAborting();
         }
         break;
       case UserAction.DELETE_POINT:

src/presenter/new-point-presenter.js

@@ -31,7 +31,7 @@ export default class NewPointPresenter {
       destinations: this.#pointModel.destinations,
       onEditClick: this.#handleCloseClick,
       onFormSubmit: this.#handleFormSubmit,
-      onDeleteClick: this.#handleCancelClick
+      onFormReset: this.#handleFormReset
     });
 
     render(this.#eventEditorComponent, this.#listComponent, RenderPosition.AFTERBEGIN);
@@ -75,7 +75,7 @@ export default class NewPointPresenter {
     this.destroy();
   };
 
-  #handleCancelClick = () => {
+  #handleFormReset = () => {
     this.destroy();
   };
 

src/presenter/point-presenter.js

@@ -9,7 +9,7 @@ export default class PointPresenter {
   #eventComponent = null;
   #eventEditorComponent = null;
 
-  #point = [];
+  #point = null;
   #offers = [];
   #destinations = [];
 
@@ -46,7 +46,7 @@ export default class PointPresenter {
       destinations: this.#destinations,
       onEditClick: this.#handleCloseClick,
       onFormSubmit: this.#handleFormSubmit,
-      onDeleteClick: this.#handleDeleteClick
+      onFormReset: this.#handleFormReset
     });
 
     if (prevEventComponent === null || prevEventEditorComponent === null) {
@@ -160,7 +160,7 @@ export default class PointPresenter {
     );
   };
 
-  #handleDeleteClick = (point) => {
+  #handleFormReset = (point) => {
     this.#handleDataChange(
       UserAction.DELETE_POINT,
       UpdateType.MINOR,

src/utils/general.js

@@ -5,8 +5,6 @@ import { DateFormat } from '../constants.js';
 
 export const getRandomInteger = (min = 1, max = 100) => Math.round(Math.random() * Math.abs(max - min)) + min;
 
-export const getRandomArrayElement = (array) => array[getRandomInteger(0, array.length - 1)];
-
 dayjs.extend(duration);
 dayjs.extend(minMax);
 

src/view/event-editor-view.js

@@ -207,11 +207,11 @@ const createEventEditorTemplate = (point, offers, destinations)=> {
           <button
             class="event__save-btn  btn  btn--blue"
             type="submit"
-            ${isDisabled ? 'disabled' : ''}>${isSaving ? 'Ssving...' : 'Save'}</button>
+            ${isSaving ? 'disabled' : ''}>${isSaving ? 'Saving...' : 'Save'}</button>
 
           <button
             class="event__reset-btn"
-            type="reset" ${isDisabled ? 'disabled' : ''}>${setButtonValue()}</button>
+            type="reset">${setButtonValue()}</button>
 
           ${createRollupButtonTemplate(point.id)}
         </header>
@@ -226,20 +226,20 @@ export default class EventEditorView extends AbstractStatefulView {
 
   #handleFormSubmit = null;
   #handleEditClick = null;
-  #handleDeleteClick = null;
+  #handleFormReset = null;
 
   #dateFromPicker = null;
   #dateToPicker = null;
 
-  constructor({ point, offers, destinations, onEditClick, onFormSubmit, onDeleteClick }) {
+  constructor({ point, offers, destinations, onEditClick, onFormSubmit, onFormReset }) {
     super();
     this._setState(EventEditorView.parsePointToState(point));
     this.#offers = offers;
     this.#destinations = destinations;
 
     this.#handleEditClick = onEditClick;
     this.#handleFormSubmit = onFormSubmit;
-    this.#handleDeleteClick = onDeleteClick;
+    this.#handleFormReset = onFormReset;
 
     this._restoreHandlers();
   }
@@ -274,11 +274,11 @@ export default class EventEditorView extends AbstractStatefulView {
   _restoreHandlers() {
     this.element.querySelector('.event__rollup-btn')?.addEventListener('click', this.#editClickHandler);
     this.element.querySelector('form').addEventListener('submit', this.#formSubmitHandler);
-    this.element.querySelector('form').addEventListener('reset', this.#formDeleteClickHandler);
-    this.element.querySelector('.event__type-group').addEventListener('change', this.#changeTypeHandler);
-    this.element.querySelector('.event__input--destination').addEventListener('change', this.#changeDestinationHandler);
-    this.element.querySelector('.event__available-offers')?.addEventListener('change', this.#changeAvailableOffersHandler);
-    this.element.querySelector('.event__field-group--price').addEventListener('input', this.#changePriceHandler);
+    this.element.querySelector('form').addEventListener('reset', this.#formResetHandler);
+    this.element.querySelector('.event__type-group').addEventListener('change', this.#typeChangeHandler);
+    this.element.querySelector('.event__input--destination').addEventListener('change', this.#destinationChangeHandler);
+    this.element.querySelector('.event__available-offers')?.addEventListener('change', this.#availableOffersChangeHandler);
+    this.element.querySelector('.event__field-group--price').addEventListener('input', this.#priceInputHandler);
 
     this.#setDatePicker();
   }
@@ -303,13 +303,13 @@ export default class EventEditorView extends AbstractStatefulView {
 
   #editClickHandler = () => this.#handleEditClick();
 
-  #changeTypeHandler = (event) => {
+  #typeChangeHandler = (event) => {
     this.updateElement({
       type: event.target.value
     });
   };
 
-  #changeDestinationHandler = (event) => {
+  #destinationChangeHandler = (event) => {
     const newDestination = this.#destinations.find((destination) => destination.name === event.target.value);
 
     if (newDestination) {
@@ -321,15 +321,15 @@ export default class EventEditorView extends AbstractStatefulView {
     event.target.value = '';
   };
 
-  #changeAvailableOffersHandler = () => {
+  #availableOffersChangeHandler = () => {
     const selectedOffers = this.element.querySelectorAll('.event__offer-checkbox:checked');
 
     this._setState({
       offers: Array.from(selectedOffers).map((item) => item.dataset.offerId)
     });
   };
 
-  #changePriceHandler = (event) => {
+  #priceInputHandler = (event) => {
     this._setState({
       basePrice: parseInt(event.target.value, 10)
     });
@@ -366,8 +366,8 @@ export default class EventEditorView extends AbstractStatefulView {
     });
   };
 
-  #formDeleteClickHandler = (event) => {
+  #formResetHandler = (event) => {
     event.preventDefault();
-    this.#handleDeleteClick(EventEditorView.parseStateToPoint(this._state));
+    this.#handleFormReset(EventEditorView.parseStateToPoint(this._state));
   };
 }

src/view/events-item-view.js

@@ -67,7 +67,7 @@ const createEventItemTemplate = (point, offers, destinations) => {
 };
 
 export default class EventsItemView extends AbstractView {
-  #point = [];
+  #point = null;
   #destinations = [];
   #offers = [];