diff --git a/frontend/mvc/controller/Controller.ts b/frontend/mvc/controller/Controller.ts index b8a4c25..9742f42 100644 --- a/frontend/mvc/controller/Controller.ts +++ b/frontend/mvc/controller/Controller.ts @@ -1,5 +1,6 @@ -import IModel from '../model/IModel'; -import IView from '../view/IView'; +import { IModel } from '../model/IModel'; +import { IView } from '../view/IView'; + class Controller { model: IModel; @@ -15,32 +16,32 @@ class Controller { this.setRunning(false); } setSubscription():void { - this.model.matrixChanged.attach((sender, { isResized, matrix }) => { - if (isResized) { this.view.initTable(matrix); } + this.model.matrixChanged.attach((sender, { resized , matrix }) => { + if (resized) { this.view.initTable(matrix); } else { this.view.changeTable(matrix); } }); this.view.tableCellChanged.attach((sender, { row, cell }) => { this.model.toggleCell(row, cell); }); - this.view.startEvent.attach(() => { + this.view.started.attach(() => { this.setRunning(true); this.anim(); }); - this.view.pauseEvent.attach(() => { + this.view.paused.attach(() => { this.setRunning(false); }); - this.view.clearEvent.attach(() => { + this.view.cleared.attach(() => { this.model.clearMatrix(); this.setRunning(false); }); - this.view.speedChanged.attach((sender, { value }) => { + this.view.speedChanged.attach((sender, value) => { this.fps = value; }); - this.view.widthChanged.attach((sender, { value }) => { + this.view.widthChanged.attach((sender, value) => { this.setRunning(false); this.model.setWidthMatrix(value); }); - this.view.heightChanged.attach((sender, { value }) => { + this.view.heightChanged.attach((sender, value) => { this.setRunning(false); this.model.setHeightMatrix(value); }); diff --git a/frontend/mvc/model/IModel.ts b/frontend/mvc/model/IModel.ts index 3024706..d3ceb81 100644 --- a/frontend/mvc/model/IModel.ts +++ b/frontend/mvc/model/IModel.ts @@ -1,8 +1,13 @@ import IEventSender from '../utils/IEventSender'; +type matrixChangedMessage = { + matrix: boolean[][]; + resized?: boolean; +}; + interface IModel { matrix: boolean[][]; - matrixChanged: IEventSender; + matrixChanged: IEventSender; setWidthMatrix(newValue: number): void; setHeightMatrix(newValue: number): void; clearMatrix(): void; @@ -11,4 +16,4 @@ interface IModel { toggleCell(row: number, column: number): void; } -export default IModel; +export { IModel, matrixChangedMessage }; diff --git a/frontend/mvc/model/Model.ts b/frontend/mvc/model/Model.ts index f7d855a..4433dcb 100644 --- a/frontend/mvc/model/Model.ts +++ b/frontend/mvc/model/Model.ts @@ -1,5 +1,5 @@ -import Event from '../utils/EventSender'; -import IModel from './IModel'; +import EventSender from '../utils/EventSender'; +import { IModel, matrixChangedMessage } from './IModel'; import '../../scripts/arrayFrom-polyfill'; class Model implements IModel{ @@ -7,13 +7,13 @@ class Model implements IModel{ rows: number; columns: number; stateHistory: boolean[][][]; - matrixChanged: Event; + matrixChanged: EventSender; constructor(rows: number = 10, columns: number = 10) { this.initMatrix(rows, columns); this.rows = rows; this.columns = columns; this.stateHistory = []; - this.matrixChanged = new Event(this); + this.matrixChanged = new EventSender(this); } initMatrix(rows: number, columns: number): void { this.matrix = Array.from(Array(rows), () => Array.from(Array(columns), () => false)); @@ -30,7 +30,7 @@ class Model implements IModel{ }); this.columns = newWidth; this.stateHistory = []; - this.matrixChanged.notify({ matrix: this.matrix, isResized: true }); + this.matrixChanged.notify({ matrix: this.matrix, resized: true }); } setHeightMatrix(newHeight: number): void { this.matrix = Array.from(Array(newHeight), (row, i) => { @@ -39,7 +39,7 @@ class Model implements IModel{ }); this.rows = newHeight; this.stateHistory = []; - this.matrixChanged.notify({ matrix: this.matrix, isResized: true }); + this.matrixChanged.notify({ matrix: this.matrix, resized: true }); } clearMatrix(): void { this.initMatrix(this.rows, this.columns); diff --git a/frontend/mvc/utils/EventSender.ts b/frontend/mvc/utils/EventSender.ts index 260a8db..a701ea8 100644 --- a/frontend/mvc/utils/EventSender.ts +++ b/frontend/mvc/utils/EventSender.ts @@ -1,16 +1,16 @@ import IEventSender from './IEventSender'; -class EventSender implements IEventSender { +class EventSender implements IEventSender { sender: object; - listeners: Array<(a, b) => void>; + listeners: Array<(a: object, b: T) => void>; constructor(sender: object) { this.sender = sender; this.listeners = []; } - attach(listener: (a, b) => void): void { + attach(listener: (a: object, b: T) => void): void { this.listeners.push(listener); } - notify(args: object): void { + notify(args: T): void { this.listeners.forEach((listener) => { listener(this.sender, args); }); diff --git a/frontend/mvc/utils/IEventSender.ts b/frontend/mvc/utils/IEventSender.ts index 41127cf..088a716 100644 --- a/frontend/mvc/utils/IEventSender.ts +++ b/frontend/mvc/utils/IEventSender.ts @@ -1,5 +1,5 @@ -interface IEventSender { - attach(listener: (a, b) => void): void; - notify(args: object): void; +interface IEventSender { + attach(listener: (a: object, b: T) => void): void; + notify(args: T): void; } export default IEventSender; diff --git a/frontend/mvc/view/IView.ts b/frontend/mvc/view/IView.ts index c37cb64..fd8964b 100644 --- a/frontend/mvc/view/IView.ts +++ b/frontend/mvc/view/IView.ts @@ -1,16 +1,22 @@ import IEventSender from '../utils/IEventSender'; +type tableCellAddress = { + row: number; + cell:number; +}; + + interface IView { - tableCellChanged: IEventSender; - startEvent: IEventSender; - pauseEvent: IEventSender; - clearEvent: IEventSender; - widthChanged: IEventSender; - heightChanged: IEventSender; - speedChanged: IEventSender; + tableCellChanged: IEventSender; + started: IEventSender; + paused: IEventSender; + cleared: IEventSender; + widthChanged: IEventSender; + heightChanged: IEventSender; + speedChanged: IEventSender; setStatus(running: boolean): void; initTable(matrix: boolean[][]): void; changeTable(matrix: boolean[][]): void; } -export default IView; +export { IView, tableCellAddress }; diff --git a/frontend/mvc/view/View.ts b/frontend/mvc/view/View.ts index 12e39eb..16d7061 100644 --- a/frontend/mvc/view/View.ts +++ b/frontend/mvc/view/View.ts @@ -1,5 +1,5 @@ import EventSender from '../utils/EventSender'; -import IView from './IView'; +import { IView, tableCellAddress } from './IView'; const CLASS_CEIL = 'game__ceil'; const CLASS_CEIL_LIVE = 'game__ceil_live'; @@ -15,13 +15,13 @@ class View implements IView{ $sliderHeight: JQuery; $status: JQuery; - tableCellChanged: EventSender; - startEvent: EventSender; - pauseEvent: EventSender; - clearEvent: EventSender; - widthChanged: EventSender; - heightChanged: EventSender; - speedChanged: EventSender; + tableCellChanged: EventSender; + started: EventSender; + paused: EventSender; + cleared: EventSender; + widthChanged: EventSender; + heightChanged: EventSender; + speedChanged: EventSender; constructor() { this.initDOMElements(); this.initEvents(); @@ -39,13 +39,13 @@ class View implements IView{ this.$status = this.$controls.find('.js-game__status'); } initEvents(): void { - this.tableCellChanged = new EventSender(this); - this.startEvent = new EventSender(this); - this.pauseEvent = new EventSender(this); - this.clearEvent = new EventSender(this); - this.widthChanged = new EventSender(this); - this.heightChanged = new EventSender(this); - this.speedChanged = new EventSender(this); + this.tableCellChanged = new EventSender(this); + this.started = new EventSender(this); + this.paused = new EventSender(this); + this.cleared = new EventSender(this); + this.widthChanged = new EventSender(this); + this.heightChanged = new EventSender(this); + this.speedChanged = new EventSender(this); } initHandlers(): void { this.$table.on('click.view', 'td', ({ target }) => { @@ -54,25 +54,25 @@ class View implements IView{ this.tableCellChanged.notify({ row, cell }); }); this.$buttonStart.on('click.view', () => { - this.startEvent.notify({}); + this.started.notify(null); }); this.$buttonPause.on('click.view', () => { - this.pauseEvent.notify({}); + this.paused.notify(null); }); this.$buttonClear.on('click.view', () => { - this.clearEvent.notify({}); + this.cleared.notify(null); }); this.$sliderSpeed.on('change.view', ({ target }) => { const value: number = Number($(target).val()); - this.speedChanged.notify({ value }); + this.speedChanged.notify(value); }); this.$sliderWidth.on('change.view', ({ target }) => { const value: number = Number($(target).val()); - this.widthChanged.notify({ value }); + this.widthChanged.notify(value); }); this.$sliderHeight.on('change.view', ({ target }) => { const value: number = Number($(target).val()); - this.heightChanged.notify({ value }); + this.heightChanged.notify(value); }); } setButtons(running: boolean): void {