Skip to content

Commit

Permalink
Merge pull request #7 from artyomp1506/module6-task1
Browse files Browse the repository at this point in the history
  • Loading branch information
keksobot authored Dec 10, 2024
2 parents 8a79550 + 64d11ab commit aab1cb7
Show file tree
Hide file tree
Showing 8 changed files with 95 additions and 36 deletions.
2 changes: 1 addition & 1 deletion src/main.js
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ let mainTrip = header.querySelector(".trip-main")
console.log(filter)
let events = body.querySelector(".trip-events")
let destinationModel = new DestinationModel()
let destinations = destinationModel.getDestination()
let destinations = destinationModel.all
//console.log(destinations)
let offersModel = new OfferModel()
let offers = offersModel.getOffers()
Expand Down
9 changes: 5 additions & 4 deletions src/mocks/consts.js
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ const CITIES = [
'Saint Petersburg',
'Copenhagen'
];
const CITIES_COUNT = 6

const DESCRIPTIONS = [
'Lorem ipsum dolor sit amet, consectetur adipiscing elit.',
Expand Down Expand Up @@ -46,8 +47,8 @@ const POINT_OFFERS = [
'Order Uber',
];

const POINTS_COUNT = 5;
const DESTINATIONS_COUNT = 5;
const OFFERS_COUNT = 5;
const POINTS_COUNT = 10;
const DESTINATIONS_COUNT = 10;
const OFFERS_COUNT = 10;

export{CITIES, DESCRIPTIONS, PRICE, DURATION, TYPES, POINTS_COUNT, POINT_OFFERS, DESTINATIONS_COUNT, OFFERS_COUNT};
export{CITIES, DESCRIPTIONS, PRICE, DURATION, TYPES, POINTS_COUNT, POINT_OFFERS, DESTINATIONS_COUNT, OFFERS_COUNT, CITIES_COUNT};
13 changes: 8 additions & 5 deletions src/mocks/destination.js
Original file line number Diff line number Diff line change
@@ -1,13 +1,16 @@
import { getRandomNumber, getRandomValue } from '../utils.js';
import { CITIES, DESCRIPTIONS } from './consts.js';
export function generateDestination()
import { CITIES, DESCRIPTIONS, DESTINATIONS_COUNT, CITIES_COUNT } from './consts.js';
export function generateDestinations()
{
return {
let destinations = []
for (let i=0; i<DESTINATIONS_COUNT; i++)
destinations.push({
id: crypto.randomUUID(),
name: getRandomValue(CITIES),
name: CITIES[i%CITIES_COUNT],
description: getRandomValue(DESCRIPTIONS),
pictures: Array.from({length: getRandomNumber(1, 5)}, () => ({
src: `https://loremflickr.com/248/152?random=${crypto.randomUUID()}`,
description: getRandomValue(DESCRIPTIONS)}))
}
})
return destinations
}
6 changes: 3 additions & 3 deletions src/model/destination_model.js
Original file line number Diff line number Diff line change
@@ -1,11 +1,11 @@
import { DESTINATIONS_COUNT } from "../mocks/consts"
import { generateDestination } from "../mocks/destination"
import { generateDestinations } from "../mocks/destination"

export class DestinationModel {
constructor() {
this.destinations = Array.from({length: DESTINATIONS_COUNT}, generateDestination)
this.destinations = generateDestinations()
}
getDestination() {
get all() {
return this.destinations
}
getById(id)
Expand Down
19 changes: 14 additions & 5 deletions src/presenter/point-pesenter.js
Original file line number Diff line number Diff line change
Expand Up @@ -11,8 +11,9 @@ export default class PointPresenter {
point = null
pointComponent = null
editComponent = null
constructor(destination, offer, container, handleDataChange, handleModeChange) {
constructor(destination, destinations, offer, container, handleDataChange, handleModeChange) {
this.destination = destination;
this.destinations = destinations;
this.offer = offer;
this.container = container;
this.#handleDataChange = handleDataChange;
Expand All @@ -26,6 +27,7 @@ export default class PointPresenter {


#renderPoint() {
console.log(this.point)
const prevPointComponent = this.pointComponent;
const prevPointEditComponent = this.editComponent;
const escKeyDownHandler = (evt) => {
Expand All @@ -37,7 +39,7 @@ export default class PointPresenter {
};
this.pointComponent = new RoutePointView(
this.point,
this.destination,
this.destinations.find(destination=>destination.id==this.point.destinationId),
this.offer,
() => {
this.replaceCardToForm()
Expand All @@ -49,18 +51,20 @@ export default class PointPresenter {
this.editComponent = new EditPointView(
this.point,
this.destination,
this.destinations,
this.offer,
this.#handleFormSubmit
this.#handleFormSubmit,
this.#handleFormClose
)
//console.log(point)

if (prevPointComponent === null || prevPointEditComponent === null) {
if (prevPointComponent === null || prevPointEditComponent === null) {
render(
this.pointComponent,
this.container.element
);
return
}
}
if (this.mode === Mode.DEFAULT) {
replace(this.pointComponent, prevPointComponent);
}
Expand Down Expand Up @@ -95,5 +99,10 @@ export default class PointPresenter {
this.#handleDataChange(point)
this.replaceFormToCard()
}
#handleFormClose = (evt) =>
{
//evt.preventDefault()
this.replaceFormToCard()
}

}
2 changes: 2 additions & 0 deletions src/presenter/trip-presenter.js
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,7 @@ export default class TripPresenter {
render(this.eventListComponent, this.container);
this.points.forEach((point) => {
const presenter = new PointPresenter(this.destinationsModel.getById(point.destinationId),
this.destinationsModel.all,
this.offersModel.getOfferByType(point.type), this.eventListComponent, this.#handlePointChange, this.#handleModeChange)
this.pointPresenters.set(point.id, presenter)
presenter.init(point)
Expand All @@ -32,6 +33,7 @@ export default class TripPresenter {
#handlePointChange = (updatedPoint) => {
//console.log('изменено')
this.points = updateItem(this.points, updatedPoint)
console.log(updatedPoint.id)
this.pointPresenters.get(updatedPoint.id).init(updatedPoint)
}
#handleModeChange = () => {
Expand Down
15 changes: 8 additions & 7 deletions src/templates/edit-template.js
Original file line number Diff line number Diff line change
@@ -1,8 +1,9 @@
import { CITIES, TYPES } from "../mocks/consts";
export function createEditTemplate(point, destination, offers) {
console.log(point)
const { type} = point;
console.log('Данные формы')
//console.log(point)

//console.log(destination)
console.log(offers)

Expand Down Expand Up @@ -30,7 +31,7 @@ export function createEditTemplate(point, destination, offers) {
<label class="event__label event__type-output" for="event-destination-1">
${type}
</label>
<input class="event__input event__input--destination" id="event-destination-1" type="text" name="event-destination" value="${destination.name}" list="destination-list-1">
<input class="event__input event__input--destination" id="event-destination-1" type="text" name="event-destination" value=${destination.name} list="destination-list-1">
${createDestinationListTemplate()}
</div>
Expand Down Expand Up @@ -61,7 +62,7 @@ export function createEditTemplate(point, destination, offers) {
<h3 class="event__section-title event__section-title--offers">Offers</h3>
<div class="event__available-offers">
${createPointOffer(offers)}
${createPointOffer(offers, type)}
</div>
</section>
Expand Down Expand Up @@ -94,16 +95,16 @@ function createPointTypesListElement(currentType) {
function createDestinationListTemplate()
{
return `<datalist id="destination-list-1">
${CITIES.map((city)=>`<option value="${city}"</option>`)}
${CITIES.map((city)=>`<option value="${city}">`).join('')}
</datalist>`
}
function createPointOffer(offers)
function createPointOffer(offers, type)
{
let result=''
offers.forEach((offer, index) => {
result+=`<div class="event__offer-selector">
<input class="event__offer-checkbox visually-hidden" id="event-offer-luggage-${index+1}" type="checkbox" name="event-offer-luggage" checked>
<label class="event__offer-label" for="event-offer-luggage-${index+1}">
<input class="event__offer-checkbox visually-hidden" id="event-offer-${type}-${index+1}" type="checkbox" name="event-offer-luggage" checked>
<label class="event__offer-label" for="event-offer-${type}-${index+1}">
<span class="event__offer-title">${offer.title}</span>
&plus;&euro;&nbsp;
<span class="event__offer-price">${offer.price}</span>
Expand Down
65 changes: 54 additions & 11 deletions src/view/editing-view.js
Original file line number Diff line number Diff line change
@@ -1,26 +1,69 @@
import { createElement } from "../render"
import {createEditTemplate} from "../templates/edit-template.js"
import AbstractView from '../framework/view/abstract-view.js'
export default class EditPointView extends AbstractView {
#onFormSubitHandler = null
import AbstractStatefullView from "../framework/view/abstract-stateful-view.js"
import { DestinationModel } from "../model/destination_model.js"
import { CITIES } from "../mocks/consts.js"
export default class EditPointView extends AbstractStatefullView {
#onFormSubmitHandler = null
#onFormCloseHandler = null
#point = null
#destination = null
#offers =null
constructor(point, destination, offers, onFormSubmit) {
#destinations = null
#offers = null
constructor(point, destination, destinations, offers, onFormSubmit, onFormClose) {
super()
this.#point = point
this._setState(EditPointView.parsePointToState({point}))
this.#destination = destination
this.#destinations = destinations
this.#offers = offers
this.#onFormSubitHandler = onFormSubmit
this.element.querySelector('.event__rollup-btn').addEventListener('click', this.#clickSubmitHandle)
this.element.querySelector('form').addEventListener('submit', this.#clickSubmitHandle)
this.#onFormSubmitHandler = onFormSubmit
this.#onFormCloseHandler = onFormClose
this._restoreHandlers()

}

get template() {
return createEditTemplate(this.#point, this.#destination, this.#offers)
console.log(this._state)
return createEditTemplate(this._state.point, this.#destinations.find(destination=>destination.id==this._state.point.destinationId), this.#offers)
}
_restoreHandlers() {
this.element.querySelector('.event__rollup-btn').addEventListener('click', this.#clickCloseHandle)
this.element.querySelector('form').addEventListener('submit', this.#clickSubmitHandle)
this.element.querySelector('.event__type-group').addEventListener('change', this.#changeEventTypeHandler)
this.element.querySelector('.event__input--destination').addEventListener('change', this.#changeDestinationHandler)
this.element.querySelector('.event__input--price').addEventListener('change', this.#changePriceHandler)
}
#changeEventTypeHandler = (evt) => {
console.log(this._state)
this.updateElement({point: {...this._state.point,
type: evt.target.value,
offers: []
}})
}
#clickSubmitHandle = (evt) =>
{
evt.preventDefault()
this.#onFormSubitHandler(this.#point)
this.#onFormSubmitHandler(this._state.point)
}
#clickCloseHandle = (evt) =>
{
evt.preventDefault()
this.#onFormCloseHandler()
}
#changeDestinationHandler = (evt) =>
{
evt.preventDefault()
console.log(this.#destinations)
let destination = this.#destinations.find((distination)=> distination.name == evt.target.value).id

this.updateElement({point: {...this._state.point, destinationId: destination} })
}
#changePriceHandler = (evt) =>
{
evt.preventDefault()
this._state.basePrice = evt.target.value
this.updateElement({point:{...this._state.point, basePrice: this._state.basePrice}} )

}
static parsePointToState = (point) => (point)
}

0 comments on commit aab1cb7

Please sign in to comment.