Коммит b4e9af60 создал по автору avathar's avatar avathar
Просмотр файлов

#174 исправлена проблема с дублированием диалогов в камерах

добавлен модуль getAllChildrens возвращающий потомков объекта
заголовки колонок и карточек обёрнуты с sizer
многие функции преобразованы в стрелочные и оптимизированы для раннего выхода
владелец 0d9b44ec
import ObjectWrapper from 'src/utils/objectWrapper';
import {
COLOR_LIGHT,
COLOR_PRIMARY,
COLOR_DARK,
DefaultDepth,
DragObjectDepth,
FONT_SMALL,
FONT_LARGE,
COLOR_DRAG_STROKE,
} from '../kanbans/Const';
import { ItemType } from 'src/types/kanban_types';
import { EventBus, Events } from 'src/boot/eventBus';
import { EndlessCanvas } from '../spaces-2d/EndlessCanvas';
import CreateDropDownList from '../kanbans/CreateDropDownList';
......@@ -17,32 +13,32 @@ import { createModal } from '../kanbans/CreateModal';
const CreateItem = (scene: EndlessCanvas, card: ObjectWrapper) => {
let textInput = '';
const item: ItemType = scene.rexUI.add.label({
rtl: true,
background: scene.rexUI.add
const sizer = scene.rexUI.add
.sizer({
orientation: 'x',
space: {
left: 5,
right: 0,
top: 5,
bottom: 5,
},
})
.addBackground(
//@ts-ignore
.roundRectangle({
scene.rexUI.add.roundRectangle({
radius: 10,
color: COLOR_PRIMARY,
}),
text: scene.add.text(0, 0, card.name, {
//@ts-ignore
'background',
);
const headerLabel = scene.rexUI.add.label({
text: scene.add.text(0, 0, card.name || '', {
fontSize: FONT_SMALL,
}),
// action: createIcon(),
actionSize: parseInt(FONT_LARGE),
align: 'left',
space: {
left: 5,
right: 5,
top: 5,
bottom: 5,
actionRight: 5,
},
});
const optionsArr = [
const dropDownOptions = [
{
label: 'Редактировать карточку',
id: 0,
......@@ -55,15 +51,13 @@ const CreateItem = (scene: EndlessCanvas, card: ObjectWrapper) => {
scene.store.getCurrentState.get(card.uuid).name,
).then((data) => {
//@ts-ignore
if (data.text === 'Сохранить') {
if (textInput) {
const payload = {
nomo: textInput,
uuid: card.uuid,
};
//@ts-ignore
scene.store.onEditKanvasoObjekto(payload);
}
if (data.text === 'Сохранить' && textInput) {
const payload = {
nomo: textInput,
uuid: card.uuid,
};
//@ts-ignore
scene.store.onEditKanvasoObjekto(payload);
}
});
},
......@@ -94,26 +88,27 @@ const CreateItem = (scene: EndlessCanvas, card: ObjectWrapper) => {
},
];
const dropDownButton = CreateDropDownList(scene, optionsArr);
dropDownButton.setPosition(item.width - dropDownButton.width, 0);
item.add(dropDownButton);
const dropDownButton = CreateDropDownList(scene, dropDownOptions);
item.setData('uuid', card.uuid);
sizer
.add(headerLabel, { proportion: 1, expand: true })
.add(dropDownButton, { proportion: 0, expand: true });
//@ts-ignore
item.payload = card.name;
SetDraggable(item);
SetDraggable(sizer);
EventBus.$on(Events.Change, (uuid, object) => {
if (uuid === card.uuid) {
//@ts-ignore
item.setText(scene.store.getCurrentState.get(uuid)?.name);
headerLabel.setText(scene.store.getCurrentState.get(uuid)?.name);
sizer.layout();
}
});
return item;
sizer.layout();
return sizer;
};
const SetDraggable = (item: ItemType): void => {
const SetDraggable = (item: any): void => {
item
.setDraggable({
sensor: item,
......
......@@ -4,6 +4,7 @@ import { ItemsBoxType } from 'src/types/kanban_types';
import { EventBus, Events } from 'src/boot/eventBus';
import AddDragDropItemBehavior from '../kanbans/AddDragDropItemBehavior';
import { EndlessCanvas } from '../spaces-2d/EndlessCanvas';
import { getAllChildrens } from '../utils/GetAllChildrens';
const CreateItemsBox = (
scene: EndlessCanvas,
......@@ -20,9 +21,12 @@ const CreateItemsBox = (
item: 5,
},
}) as undefined as ItemsBoxType;
//@ts-ignore
itemsBox.addBackground(scene.rexUI.add.roundRectangle({}), 'background');
itemsBox.addBackground(
//@ts-ignore
scene.rexUI.add.roundRectangle({}),
'background',
);
const itemBoxMap = new Map();
if (cards.length) {
cards.forEach((card) => {
......@@ -46,13 +50,17 @@ const CreateItemsBox = (
});
EventBus.$on(Events.Create, (parentUuid1, object) => {
if (parentUuid === parentUuid1) {
const item = CreateItem(scene, object);
itemBoxMap.set(object.uuid, item);
box.addItem(item);
box.itemsBox.getTopmostSizer().layout();
if (parentUuid !== parentUuid1) {
return;
}
const item = CreateItem(scene, object);
scene.cameras.getCamera('ui').ignore(getAllChildrens(item));
itemBoxMap.set(object.uuid, item);
box.addItem(item);
box.itemsBox.getTopmostSizer().layout();
});
return box.itemsBox;
......
......@@ -30,7 +30,6 @@ import { Router } from 'vue-router';
import UIPlugin from 'phaser3-rex-plugins/templates/ui/ui-plugin';
import CreateMainMenu from '../../main-menu/MainMenu';
import debugUpdater from 'src/apps/utils/debug/debugUpdater';
import createDebugTable from 'src/apps/utils/debug/createDebugTable';
declare const window: {
router: Router;
......@@ -279,14 +278,13 @@ class EndlessCanvas extends Phaser.Scene {
const mainMenu = CreateMainMenu(scene, buttonArray);//toolbar находится здесь потому что он должен создаваться после инициализации UI камеры
//@ts-ignore
const toolbar = CreateToolbar(scene, toolbarButtons);
createDebugTable(this);
this.cameras.main.ignore(mainMenu);
this.cameras.main.ignore(toolbar);
}
update(time: number, delta: number): void {
debugUpdater(this);
}
}
......
......@@ -38,15 +38,16 @@ class AddDragDropItemBehavior {
}
#handleDragEnd(item, pointer, dragX, dragY, dropped) {
if (!dropped) {
const previousItemsBox = item.getData('itemsBox') as ItemsBoxType;
previousItemsBox.insert(item.getData('index') as number, item, {
expand: true,
});
this.#arrangeItems(previousItemsBox);
const neighbors = GetNeighborObjects(item);
this.#logNeighbors('dragend', neighbors, item);
if (dropped) {
return;
}
const previousItemsBox = item.getData('itemsBox') as ItemsBoxType;
previousItemsBox.insert(item.getData('index') as number, item, {
expand: true,
});
this.#arrangeItems(previousItemsBox);
const neighbors = GetNeighborObjects(item);
this.#logNeighbors('dragend', neighbors, item);
}
#handleDrop(item, pointer, dropZone) {
......@@ -68,10 +69,10 @@ class AddDragDropItemBehavior {
#logNeighbors(event, neighbors, item) {
if (neighbors[0]) {
debugLog(event + ' Above', neighbors[0].text);
debugLog(`${event} Above`, neighbors[0].text);
}
if (neighbors[1]) {
debugLog(event + ' Below', neighbors[1].text);
debugLog(`${event} Below`, neighbors[1].text);
}
debugLog('Dragged Item: ', item.text);
}
......@@ -111,7 +112,7 @@ class AddDragDropItemBehavior {
}
}
addItem(item: ItemType) {
addItem(item: any) {
this.itemsBox.add(item, {
proportion: 0,
expand: true,
......
// import stretchingIcon from './Stretching_icon1.png';
const AddResizeController = (sizer): void => {
const scene = sizer.scene;
......@@ -17,28 +15,25 @@ const AddResizeController = (sizer): void => {
bottomRighterController.setInteractive({ draggable: true });
bottomRighterController.on(
'dragstart',
function (pointer: Phaser.Input.Pointer) {
dragOffsetX = pointer.x - bottomRighterController.x;
dragOffsetY = pointer.y - bottomRighterController.y;
},
);
bottomRighterController.on('dragstart', (pointer: Phaser.Input.Pointer) => {
dragOffsetX = pointer.x - bottomRighterController.x;
dragOffsetY = pointer.y - bottomRighterController.y;
});
bottomRighterController.on(
'drag',
function (pointer: Phaser.Input.Pointer, dragX, dragY) {
const topX = sizer.left,
topY = sizer.top;
const width = dragX + dragOffsetX - topX,
height = dragY + dragOffsetY - topY;
(pointer: Phaser.Input.Pointer, dragX, dragY) => {
const topX = sizer.left;
const topY = sizer.top;
const width = dragX + dragOffsetX - topX;
const height = dragY + dragOffsetY - topY;
sizer.setMinSize(width, height).layout();
},
);
// Обновляем позицию AddResizeController каждый раз, когда происходит обновление сцены
scene.events.on('update', function () {
scene.events.on('update', () => {
bottomRighterController.setPosition(
sizer.right - offsetX,
sizer.bottom - offsetY,
......
......@@ -2,16 +2,18 @@
export const COLOR_LIGHT = 0x7b_5e_57;
export const COLOR_PRIMARY = 0x4e_34_2e;
export const COLOR_DARK = 0x26_0e_04;
export const COLOR_DRAG_STROKE = 0xff0000;
export const COLOR_BLACK = 0x000000;
export const COLOR_WHITE = 0xffffff;
export const COLOR_DRAG_STROKE = 0xff_00_00;
export const COLOR_BLACK = 0x00_00_00;
export const COLOR_WHITE = 0xff_ff_ff;
export const COLOR_BACKGROUND = 0xab_cd_ef;
// Depth
export const DragObjectDepth = 1000;
export const DefaultDepth = 0;
//Font Size
export const FONT_EXTRA_SMALL = '12px';
export const FONT_SMALL = '18px';
export const FONT_ORDINARY = '20px';
export const FONT_LARGE = '24px';
export const FONT_HUGE = '32px';
// export const FONT_HUGE = '32px';
import ObjectWrapper from 'src/utils/objectWrapper';
import {
COLOR_LIGHT,
COLOR_PRIMARY,
COLOR_DARK,
FONT_SMALL,
FONT_LARGE,
COLOR_DRAG_STROKE,
DefaultDepth,
DragObjectDepth,
} from './Const';
import { DefaultDepth, DragObjectDepth } from './Const';
import CreateItemsBox from '../cards/CreateItemsBox';
import { EndlessCanvas } from '../spaces-2d/EndlessCanvas';
import { EventBus, Events } from 'src/boot/eventBus';
......@@ -42,27 +41,23 @@ const CreateColumnPanel = (scene: EndlessCanvas, column: ObjectWrapper) => {
const CreateTitle = (scene: EndlessCanvas, column: ObjectWrapper, callback) => {
let textInput = '';
const title = scene.rexUI.add.label({
rtl: true,
//@ts-ignore
background: scene.rexUI.add.roundRectangle({
color: COLOR_LIGHT,
}),
const sizer = scene.rexUI.add
.sizer({
orientation: 'x',
space: {
left: 5,
right: 0,
top: 5,
bottom: 5,
},
})
.addBackground(
scene.rexUI.add.roundRectangle(0, 0, 20, 20, 0, COLOR_LIGHT),
);
const headerLabel = scene.rexUI.add.label({
text: scene.add.text(0, 0, column.name || '', {
fontSize: FONT_SMALL,
}),
align: 'left',
//action: dropDownButton,
actionSize: parseInt(FONT_LARGE),
space: {
left: 5,
right: 5,
top: 5,
bottom: 5,
actionRight: 5,
},
});
const dropDownOptions = [
......@@ -74,20 +69,18 @@ const CreateTitle = (scene: EndlessCanvas, column: ObjectWrapper, callback) => {
textInput = text;
}).then((button) => {
//@ts-ignore
if (button.text === 'Сохранить') {
if (textInput) {
const payload = {
nomo: textInput,
//@ts-ignore
kanvasoUuid: scene.store.getKanvaso[0].node.uuid,
priskribo: textInput,
tipoId: 4,
ligiloPosedantoUuid: column.uuid,
};
if (button.text === 'Сохранить' && textInput) {
const payload = {
nomo: textInput,
//@ts-ignore
scene.store.onEditKanvasoObjekto(payload);
}
kanvasoUuid: scene.store.getKanvaso[0].node.uuid,
priskribo: textInput,
tipoId: 4,
ligiloPosedantoUuid: column.uuid,
};
//@ts-ignore
scene.store.onEditKanvasoObjekto(payload);
}
});
},
......@@ -105,15 +98,13 @@ const CreateTitle = (scene: EndlessCanvas, column: ObjectWrapper, callback) => {
scene.store.getCurrentState.get(column.uuid).name,
).then((data) => {
//@ts-ignore
if (data.text === 'Сохранить') {
if (textInput) {
const payload = {
nomo: textInput,
uuid: column.uuid,
};
//@ts-ignore
scene.store.onEditKanvasoObjekto(payload);
}
if (data.text === 'Сохранить' && textInput) {
const payload = {
nomo: textInput,
uuid: column.uuid,
};
//@ts-ignore
scene.store.onEditKanvasoObjekto(payload);
}
});
},
......@@ -144,17 +135,19 @@ const CreateTitle = (scene: EndlessCanvas, column: ObjectWrapper, callback) => {
},
];
const dropDownButton = CreateDropDownList(scene, dropDownOptions);
dropDownButton.setPosition(title.width - dropDownButton.width, 0);
title.add(dropDownButton);
EventBus.$on(Events.Change, (uuid, object) => {
if (uuid === column.uuid) {
//@ts-ignore
title.setText(scene.store.getCurrentState.get(uuid).name);
headerLabel.setText(scene.store.getCurrentState.get(uuid).name);
sizer.layout();
}
});
title.setData('uuid', column.uuid);
return title;
sizer
.add(headerLabel, { proportion: 1, expand: true })
.add(dropDownButton, { proportion: 0, expand: true });
sizer.layout();
return sizer;
};
const SetDraggable = (panel: any) => {
......
......@@ -5,6 +5,7 @@ import ObjectWrapper from 'src/utils/objectWrapper';
import { PanelsBoxType } from 'src/types/kanban_types';
import { EventBus, Events } from 'src/boot/eventBus';
import { EndlessCanvas } from '../spaces-2d/EndlessCanvas';
import { getAllChildrens } from '../utils/GetAllChildrens';
const CreateColumnPanelsBox = (
scene: EndlessCanvas,
......@@ -31,7 +32,7 @@ const CreateColumnPanelsBox = (
// 'background'
// )
const panelsBoxMap = new Map();
if (swimlane && swimlane.childrens && swimlane.childrens.length > 0) {
if (swimlane?.childrens && swimlane.childrens.length > 0) {
swimlane.childrens.forEach((column: ObjectWrapper) => {
const columnPanel = CreateColumnPanel(scene, column);
panelsBoxMap.set(column.uuid, columnPanel);
......@@ -51,13 +52,18 @@ const CreateColumnPanelsBox = (
});
EventBus.$on(Events.Create, (parentUuid1, object) => {
if (parentUuid === parentUuid1) {
const columnPanel = CreateColumnPanel(scene, object);
panelsBoxMap.set(object.uuid, columnPanel);
box.addPanel(columnPanel);
box.panelsBox.getTopmostSizer().layout();
if (parentUuid !== parentUuid1) {
return;
}
const columnPanel = CreateColumnPanel(scene, object);
scene.cameras.getCamera('ui').ignore(getAllChildrens(columnPanel));
//@ts-ignore
panelsBoxMap.set(object.uuid, columnPanel);
box.addPanel(columnPanel);
box.panelsBox.getTopmostSizer().layout();
});
return box.panelsBox;
};
......
import { COLOR_LIGHT, COLOR_PRIMARY, COLOR_DARK } from './Const';
import { COLOR_PRIMARY } from './Const';
import GetMaxTextObjectSize from './GetMaxTextObjectSize';
import CreateTextObject from './CreateTextObject';
import CreatePopupList from './CreatePopupList';
......@@ -8,11 +8,11 @@ type Options = {
label: string;
onClick: () => void;
};
const CreateDropDownList = function (
const CreateDropDownList = (
scene: EndlessCanvas,
optionsArr?: Options[],
labelText: string = '...',
) {
labelText: string = '',
) => {
const maxTextSize = GetMaxTextObjectSize(
scene,
optionsArr.map((o) => o.label),
......@@ -36,21 +36,20 @@ const CreateDropDownList = function (
let menu;
scene.rexUI.add.click(label).on('click', () => {
if (!menu || !menu.scene) {
//@ts-ignore
const menuX = label.getElement('text').getTopLeft().x;
const menuY = label.bottom;
menu = CreatePopupList(
scene,
menuX - maxTextSize.width + labelMaxTextSize.width / 2,
menuY,
optionsArr,
);
} else {
if (menu?.scene) {
menu.collapse();
menu = undefined;
return;
}
//@ts-ignore
const menuX = label.getElement('text').getTopLeft().x;
const menuY = label.bottom;
menu = CreatePopupList(
scene,
menuX - maxTextSize.width + labelMaxTextSize.width / 2,
menuY,
optionsArr,
);
});
return label;
......
......@@ -5,14 +5,20 @@ import { EndlessCanvas } from '../spaces-2d/EndlessCanvas';
import { EventBus, Events } from 'src/boot/eventBus';
import { createModal } from './CreateModal';
const CreateHeader = function (scene: EndlessCanvas, board: ObjectWrapper) {
const CreateHeader = (scene: EndlessCanvas, board: ObjectWrapper) => {
const sizer = scene.rexUI.add
.sizer({
orientation: 'x',
space: {
left: 5,
right: 0,
top: 5,
bottom: 5,
},
})
.addBackground(scene.rexUI.add.roundRectangle(0, 0, 20, 20, 0, COLOR_DARK));
const headerLabel = scene.rexUI.add.label({
text: scene.add.text(0, 0, board.name),
text: scene.add.text(0, 0, board.name || ''),
});
EventBus.$on(Events.Change, (uuid, object) => {
......@@ -28,24 +34,22 @@ const CreateHeader = function (scene: EndlessCanvas, board: ObjectWrapper) {
label: 'Добавить столбец',
id: 0,
onClick: () => {
createModal(scene, function (text) {
createModal(scene, (text) => {
textInput = text;
}).then((button) => {
//@ts-ignore
if (button.text === 'Сохранить') {
if (textInput) {
const payload = {
nomo: textInput,
//@ts-ignore
kanvasoUuid: scene.store.getKanvaso[0].node.uuid,
priskribo: textInput,
tipoId: 3,
ligiloPosedantoUuid: board.childrens[0].uuid,
};
if (button.text === 'Сохранить' && textInput) {
const payload = {
nomo: textInput,
//@ts-ignore
scene.store.onEditKanvasoObjekto(payload);
}
kanvasoUuid: scene.store.getKanvaso[0].node.uuid,
priskribo: textInput,
tipoId: 3,
ligiloPosedantoUuid: board.childrens[0].uuid,
};
//@ts-ignore
scene.store.onEditKanvasoObjekto(payload);
}
});
},
......@@ -56,22 +60,20 @@ const CreateHeader = function (scene: EndlessCanvas, board: ObjectWrapper) {
onClick: () => {
createModal(
scene,
function (text) {
(text) => {
textInput = text;
},
//@ts-ignore
scene.store.getCurrentState.get(board.uuid).name,
).then((button) => {
//@ts-ignore
if (button.text === 'Сохранить') {
if (textInput) {
const payload = {
nomo: textInput,
uuid: board.uuid,
};
//@ts-ignore
scene.store.onEditKanvasoObjekto(payload);
}
if (button.text === 'Сохранить' && textInput) {
const payload = {
nomo: textInput,
uuid: board.uuid,
};
//@ts-ignore
scene.store.onEditKanvasoObjekto(payload);
}
});
},
......
import { EndlessCanvas } from '../spaces-2d/EndlessCanvas';
import { getAllChildrens } from '../utils/GetAllChildrens';
import CreateRequestModal from './CreateRequestModal';
type ButtonAction = (textInput: string) => void;
......@@ -12,7 +13,7 @@ export function createModal(
confirmButtonText?: string,
) {
// Функция для создания и отображения модального окна
return CreateRequestModal(
const modal = CreateRequestModal(
scene,
onSubmit,
defaultContentText,
......@@ -20,7 +21,7 @@ export function createModal(
cancelButtonText,
confirmButtonText,
)
.setPosition(scene.cameras.main.midPoint.x, scene.cameras.main.midPoint.y)
.setPosition(scene.cameras.main.width / 2, scene.cameras.main.height / 2)
.layout()
.modalPromise({
manualClose: true,
......@@ -29,4 +30,6 @@ export function createModal(
out: 500,
},
});
return modal;
}
import { EndlessCanvas } from '../spaces-2d/EndlessCanvas';
import { COLOR_BLACK, FONT_SMALL } from './Const';
import { COLOR_BLACK, COLOR_DRAG_STROKE, FONT_SMALL } from './Const';
const CreateModalLabel = (scene: EndlessCanvas, text: string) => {
const normalBackground = scene.rexUI.add.roundRectangle(
......@@ -22,9 +22,9 @@ const CreateModalLabel = (scene: EndlessCanvas, text: string) => {
COLOR_BLACK,
0.0,
);
hoverBackground.setStrokeStyle(2, COLOR_BLACK); // Чёрная обводка
hoverBackground.setStrokeStyle(2, COLOR_DRAG_STROKE);
const label = scene.rexUI.add
return scene.rexUI.add
.label({
background: normalBackground,
text: scene.add.text(0, 0, text, {
......@@ -39,15 +39,13 @@ const CreateModalLabel = (scene: EndlessCanvas, text: string) => {
bottom: 5,
},
})
.on('button.over', function (button, groupName, index, pointer, event) {
.on('button.over', (button, groupName, index, pointer, event) => {
button.getElement('background').destroy();
button.setElement('background', hoverBackground);
})
.on('button.out', function (button, groupName, index, pointer, event) {
.on('button.out', (button, groupName, index, pointer, event) => {
button.getElement('background').destroy();
button.setElement('background', normalBackground);
});
return label;
};
export default CreateModalLabel;
import { COLOR_LIGHT, COLOR_PRIMARY, COLOR_DARK } from './Const';
import CreateTextObject from './CreateTextObject';
import { EndlessCanvas } from '../spaces-2d/EndlessCanvas';
import { getAllChildrens } from '../utils/GetAllChildrens';
type Options = {
id: number;
label: string;
onClick: () => void;
};
const CreatePopupList = function (
const CreatePopupList = (
scene: EndlessCanvas,
x: number,
y: number,
options: Options[],
) {
) => {
const menu = scene.rexUI.add.menu({
x,
y,
......@@ -45,6 +46,7 @@ const CreatePopupList = function (
menu.collapse();
});
scene.cameras.getCamera('ui').ignore(getAllChildrens(menu));
return menu;
};
......
import { EndlessCanvas } from '../spaces-2d/EndlessCanvas';
import { getAllChildrens } from '../utils/GetAllChildrens';
import { COLOR_BLACK, COLOR_WHITE } from './Const';
import {
COLOR_LIGHT,
......@@ -70,7 +71,7 @@ const CreateRequestModal = (
content: defaultContentText,
})
.layout()
.on('textchange', function (newText: string) {
.on('textchange', (newText: string) => {
callback(newText);
});
......@@ -135,13 +136,16 @@ const CreateRequestModal = (
content: false,
},
})
.on('button.over', function (button, groupName, index, pointer, event) {
.on('button.over', (button, groupName, index, pointer, event) => {
button.getElement('background').setStrokeStyle(1, COLOR_BLACK);
})
.on('button.out', function (button, groupName, index, pointer, event) {
.on('button.out', (button, groupName, index, pointer, event) => {
button.getElement('background').setStrokeStyle();
});
dialog.layout();
scene.cameras.main.ignore(getAllChildrens(dialog));
return dialog;
};
export default CreateRequestModal;
......@@ -48,7 +48,7 @@ const CreateSwimlanePanelBox = (
// 'background',
// );
if (board && board.childrens && board.childrens.length > 0) {
if (board?.childrens && board.childrens.length > 0) {
board.childrens.forEach((swimlane: ObjectWrapper) => {
const swimlanePanel = CreateColumnPanelsBox(scene, swimlane, board.uuid);
swimlanePanelsBox.add(swimlanePanel, {
......
import { EndlessCanvas } from '../spaces-2d/EndlessCanvas';
const CreateTextObject = function (
const CreateTextObject = (
scene: EndlessCanvas,
text: string,
fontSize: string = '20px',
): any {
return scene.add.text(0, 0, text, {
): any =>
scene.add.text(0, 0, text, {
fontSize,
});
};
export default CreateTextObject;
import { EndlessCanvas } from '../spaces-2d/EndlessCanvas';
import { COLOR_LIGHT, COLOR_PRIMARY, COLOR_DARK } from './Const';
import CreateTextObject from './CreateTextObject';
const GetMaxTextObjectSize = function (
const GetMaxTextObjectSize = (
scene: EndlessCanvas,
contentArray: string[],
fontSize?: string,
): { width: number; height: number } {
): { width: number; height: number } => {
const textObject = CreateTextObject(
scene,
'',
fontSize,
) as unknown as Phaser.GameObjects.Text;
let width = 0,
height = 0;
let width = 0;
let height = 0;
for (const content of contentArray) {
textObject.text = content;
width = Math.max(textObject.width, width);
......
const GetNeighborObjects = function (child) {
const GetNeighborObjects = (child) => {
const parent = child.getParentSizer();
const children = parent.getElement('items');
const childIndex = children.indexOf(child);
......
import { EndlessCanvas } from '../spaces-2d/EndlessCanvas';
function CreateMainMenu(scene: EndlessCanvas, buttonArray) {
let mainMenuHeight = scene.mainMenuHeight; // Ширина главного меню
const mainMenuHeight = scene.mainMenuHeight; // Ширина главного меню
const arr = [];
buttonArray.forEach((element, index) => {
const button = scene.add.image(0, 0, element.image).setDepth(1010);
......
......@@ -5,7 +5,6 @@ import { Router } from 'vue-router';
import CreateMainMenu from '../main-menu/MainMenu';
import { LoadingResources } from '../resources/LoadingResources';
import CreateToolbar from '../toolbar/CreateToolbar';
import createDebugTable from '../utils/debug/createDebugTable';
import debugUpdater from '../utils/debug/debugUpdater';
import { mainMenuButtons } from '../main-menu/mainMenuButtons';
import { toolbarButtons } from '../toolbar/toolbarButtons';
......@@ -14,6 +13,7 @@ import addControls from './controls';
import domElement from './domElement';
import createUiCamera from './createUiCamera';
import createGrid from './createGrid';
import { COLOR_BACKGROUND } from '../kanbans/Const';
export declare const window: {
router: Router;
......@@ -26,8 +26,8 @@ export class EndlessCanvas extends Phaser.Scene {
store: any;
router: Router;
isDark: boolean;
debugTable: Phaser.GameObjects.Text;
keys: object;
debug: Phaser.GameObjects.Text[];
constructor() {
super({
......@@ -50,7 +50,7 @@ export class EndlessCanvas extends Phaser.Scene {
right: 'right',
space: 'SPACE',
shift: 'SHIFT',
ctrl: Phaser.Input.Keyboard.KeyCodes.CTRL,
ctrl: 'CTRL',
alt: 'ALT',
});
......@@ -85,8 +85,10 @@ export class EndlessCanvas extends Phaser.Scene {
// Скрываем экран загрузки здесь, потому что на этом этапе preload уже завершен
document.getElementById('loading-screen').style.display = 'none';
this.cameras.main.setBackgroundColor('#abcdef');
this.cameras.main.setBackgroundColor(COLOR_BACKGROUND);
createGrid(this);
const parent = this.sys.game.canvas.parentElement;
const parentWidth = parent.offsetWidth;
const parentHeight = parent.offsetHeight;
......@@ -117,8 +119,6 @@ export class EndlessCanvas extends Phaser.Scene {
const mainMenu = CreateMainMenu(this, mainMenuButtons(this));
const toolbar = CreateToolbar(this, toolbarButtons(this));
// подключение таблички с отладочными данными (отображается при флаге debug в LocalStorage)
createDebugTable(this);
// кнопки для зума
zoomButtons(this);
......
Поддерживает Markdown
0% или .
You are about to add 0 people to the discussion. Proceed with caution.
Сначала завершите редактирование этого сообщения!
Пожалуйста, зарегистрируйтесь или чтобы прокомментировать