@gorpacrate/core-graphics
Version:
A core library for creating shape-based graphic editors
122 lines (120 loc) • 6.36 kB
JavaScript
"use strict";
exports.__esModule = true;
var i = require("icepick");
var declarations_1 = require("../../declarations");
var editor_action_1 = require("../../editor-state/editor-action");
var history_events_wrappers_1 = require("../../history/history-events-wrappers");
var bounding_box_1 = require("../../utils/bounding-box");
var grid_1 = require("../../utils/grid");
var transform_1 = require("../../utils/transform");
var input_1 = require("../events/input");
var REDUCERS = [
resizeModeEnterReducer,
resizeModeUpdateReducer,
resizePreviewEventsReducer,
resizeFinishReducer
];
function resizeStateReducer(currentState, ev) {
return REDUCERS.reduce(function (res, fn) { return fn(res, ev); }, currentState);
}
exports["default"] = resizeStateReducer;
function getMinResizeDims(params) {
var ids = params.ids, scene = params.scene, shapesDeclarations = params.shapesDeclarations;
if (ids.length === 1) {
var id = ids[0];
var type = (scene.shapes[id]).type;
if (type && shapesDeclarations[type]) {
var shapeDecl = shapesDeclarations[type];
if (typeof shapeDecl.minResizeHeight !== 'undefined' && typeof shapeDecl.minResizeWidth !== 'undefined') {
return { minWidth: shapeDecl.minResizeWidth, minHeight: shapeDecl.minResizeHeight };
}
}
}
return { minWidth: 1, minHeight: 1 };
}
// util fn for getting event
function getResizeEvent(params) {
var shapesDeclarations = params.shapesDeclarations, modifierKeys = params.modifierKeys, scene = params.scene, mode = params.mode;
var _a = mode.payload, ids = _a.ids, handle = _a.handle, bb = _a.bb, pStart = _a.pStart, pEnd = _a.pEnd, forceProportional = _a.forceProportional;
var pOrigin = transform_1.getResizeOrigin({ handle: handle, bb: bb });
var proportional = forceProportional || modifierKeys[input_1.SceneModifierKey.Shift];
var _b = getMinResizeDims({ shapesDeclarations: shapesDeclarations, scene: scene, ids: ids }), minWidth = _b.minWidth, minHeight = _b.minHeight;
return history_events_wrappers_1.getShapesScaleEvent({
shapesData: scene.shapes, ids: ids,
pOrigin: pOrigin, pStart: pStart, pEnd: pEnd,
proportional: proportional, minWidth: minWidth, minHeight: minHeight
});
}
// util for getting [force proportional] param
/*
function mustForceProportional(params: { shapesDeclarations: IShapesDeclarations, scene: IScene, ids: string[] }) {
const { shapesDeclarations, scene, ids } = params;
const hasResizeProportionalOnlyShapes = ids.map(id => scene.shapes[id].type) // types
.map(type => shapesDeclarations[type]) // declarations
.map(decl => decl.resizeProportionalOnly) // bools
.reduce( (a, b) => (!!a || !!b), false); // 'some'
return hasResizeProportionalOnlyShapes;
}
*/
function mustForceProportional(params) {
var shapesDeclarations = params.shapesDeclarations, scene = params.scene, ids = params.ids;
if (ids.length === 1) {
var id = ids[0];
var type = scene.shapes[id].type;
return !!shapesDeclarations[type].resizeProportionalOnly;
}
return true;
}
// entering resizing mode
function resizeModeEnterReducer(currentState, ev) {
var mode = currentState.mode;
if (declarations_1.isSelectedMode(mode) && input_1.isEditorInputEvent(ev) && input_1.isShapeResizeHandleMouseDownEvent(ev)) {
var shapesDeclarations = currentState.shapesDeclarations, mouse = currentState.mouse, grid = currentState.grid;
var scene = currentState.persistedScene;
var ids = mode.payload.ids;
var handle = ev.payload.handle;
var _a = grid_1.snapCoordsIfNeeded(grid, mouse), x = _a.x, y = _a.y;
var pEnd = { x: x, y: y };
var bb = bounding_box_1.getShapesBoundingBox({ shapesDeclarations: shapesDeclarations, scene: scene, ids: ids });
// get handle coords
var pStart = bounding_box_1.getShapeResizeHandleCoords(bb, handle);
// forceProportional ?
var forceProportional = mustForceProportional({ shapesDeclarations: shapesDeclarations, ids: ids, scene: scene });
// let the shit begin
var nextMode = declarations_1.modeResizing({ ids: ids, handle: handle, bb: bb, pStart: pStart, pEnd: pEnd, forceProportional: forceProportional });
return i.assoc(currentState, 'mode', nextMode);
}
return currentState;
}
// updating mode
function resizeModeUpdateReducer(currentState, ev) {
var mode = currentState.mode, mouse = currentState.mouse;
if (declarations_1.isResizingMode(mode) && mouse.down && input_1.isEditorInputEvent(ev) && input_1.isMouseMoveEvent(ev)) {
var _a = grid_1.snapEditorInputEventCoordsIfNeeded(currentState.grid, ev).payload, x = _a.x, y = _a.y;
return i.assocIn(currentState, ['mode', 'payload', 'pEnd'], { x: x, y: y });
}
return currentState;
}
// updating preview events
function resizePreviewEventsReducer(currentState) {
var mode = currentState.mode, mouse = currentState.mouse, persistedScene = currentState.persistedScene, modifierKeys = currentState.modifierKeys, shapesDeclarations = currentState.shapesDeclarations;
if (declarations_1.isResizingMode(mode) && mouse.down) {
var event_1 = getResizeEvent({ shapesDeclarations: shapesDeclarations, modifierKeys: modifierKeys, scene: persistedScene, mode: mode });
return i.assoc(currentState, 'previewedHistoryEvents', [event_1]);
}
return currentState;
}
function resizeFinishReducer(currentState, ev) {
var mode = currentState.mode, shapesDeclarations = currentState.shapesDeclarations, modifierKeys = currentState.modifierKeys, persistedScene = currentState.persistedScene;
if (declarations_1.isResizingMode(mode) && input_1.isEditorInputEvent(ev) && input_1.isMouseUpEvent(ev)) {
var event_2 = getResizeEvent({ shapesDeclarations: shapesDeclarations, modifierKeys: modifierKeys, scene: persistedScene, mode: mode });
var action = editor_action_1.pushHistoryEventAction(event_2);
var ids = mode.payload.ids;
return i.chain(currentState)
.assoc('editorActionsQueue', i.push(currentState.editorActionsQueue, action))
.assoc('mode', declarations_1.modeSelected(ids))
.value();
}
return currentState;
}
//# sourceMappingURL=resize.js.map