core-graphics/lib/editor-state/reducer/resize.js

A core library for creating shape-based graphic editors

'use strict';

Object.defineProperty(exports, "__esModule", {
    value: true
});
exports.default = resizeStateReducer;

var _boundingBox = require('../../utils/bounding-box');

var _transform = require('../../utils/transform');

var _input = require('../events/input');

var _declarations = require('../../declarations');

var _editorAction = require('../../editor-state/editor-action');

var _historyEventsWrappers = require('../../history/history-events-wrappers');

var _grid = require('../../utils/grid');

var _icepick = require('icepick');

var i = _interopRequireWildcard(_icepick);

function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } }

var REDUCERS = [resizeModeEnterReducer, resizeModeUpdateReducer, resizePreviewEventsReducer, resizeFinishReducer];
function resizeStateReducer(currentState, ev) {
    return REDUCERS.reduce(function (res, fn) {
        return fn(res, ev);
    }, currentState);
}
function getMinResizeDims(params) {
    var ids = params.ids;
    var scene = params.scene;
    var shapesDeclarations = params.shapesDeclarations;

    if (ids.length === 1) {
        var id = ids[0];
        var type = scene.shapes[id].type;
        if (type && shapesDeclarations[type] && typeof shapesDeclarations[type].minResizeWidth !== 'undefined' && typeof shapesDeclarations[type].minResizeHeight !== 'undefined') {
            var _shapesDeclarations$t = shapesDeclarations[type];
            var minResizeWidth = _shapesDeclarations$t.minResizeWidth;
            var minResizeHeight = _shapesDeclarations$t.minResizeHeight;

            return { minWidth: minResizeWidth, minHeight: minResizeHeight };
        } else {
            return { minWidth: 1, minHeight: 1 };
        }
    }
    if (ids.length > 1) {
        return { minWidth: 1, minHeight: 1 };
    }
}
// util fn for getting event
function getResizeEvent(params) {
    var shapesDeclarations = params.shapesDeclarations;
    var modifierKeys = params.modifierKeys;
    var scene = params.scene;
    var mode = params.mode;
    var _mode$payload = mode.payload;
    var ids = _mode$payload.ids;
    var handle = _mode$payload.handle;
    var bb = _mode$payload.bb;
    var pStart = _mode$payload.pStart;
    var pEnd = _mode$payload.pEnd;
    var forceProportional = _mode$payload.forceProportional;

    var pOrigin = (0, _transform.getResizeOrigin)({ handle: handle, bb: bb });
    var proportional = forceProportional || modifierKeys[_input.SceneModifierKey.Shift];

    var _getMinResizeDims = getMinResizeDims({ shapesDeclarations: shapesDeclarations, scene: scene, ids: ids });

    var minWidth = _getMinResizeDims.minWidth;
    var minHeight = _getMinResizeDims.minHeight;

    return (0, _historyEventsWrappers.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;
    var scene = params.scene;
    var 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 ((0, _declarations.isSelectedMode)(mode) && (0, _input.isEditorInputEvent)(ev) && (0, _input.isShapeResizeHandleMouseDownEvent)(ev)) {
        var shapesDeclarations = currentState.shapesDeclarations;
        var mouse = currentState.mouse;
        var grid = currentState.grid;

        var scene = currentState.persistedScene;
        var ids = mode.payload.ids;
        var handle = ev.payload.handle;

        var _snapCoordsIfNeeded = (0, _grid.snapCoordsIfNeeded)(grid, mouse);

        var x = _snapCoordsIfNeeded.x;
        var y = _snapCoordsIfNeeded.y;

        var pEnd = { x: x, y: y };
        var bb = (0, _boundingBox.getShapesBoundingBox)({ shapesDeclarations: shapesDeclarations, scene: scene, ids: ids });
        // get handle coords
        var pStart = (0, _boundingBox.getShapeResizeHandleCoords)(bb, handle);
        // forceProportional ?
        var forceProportional = mustForceProportional({ shapesDeclarations: shapesDeclarations, ids: ids, scene: scene });
        // let the shit begin
        var nextMode = (0, _declarations.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;
    var mouse = currentState.mouse;

    if ((0, _declarations.isResizingMode)(mode) && mouse.down && (0, _input.isEditorInputEvent)(ev) && (0, _input.isMouseMoveEvent)(ev)) {
        var _snapEditorInputEvent = (0, _grid.snapEditorInputEventCoordsIfNeeded)(currentState.grid, ev).payload;
        var x = _snapEditorInputEvent.x;
        var y = _snapEditorInputEvent.y;

        return i.assocIn(currentState, ['mode', 'payload', 'pEnd'], { x: x, y: y });
    }
    return currentState;
}
// updating preview events
function resizePreviewEventsReducer(currentState, ev) {
    var mode = currentState.mode;
    var mouse = currentState.mouse;
    var persistedScene = currentState.persistedScene;
    var modifierKeys = currentState.modifierKeys;
    var shapesDeclarations = currentState.shapesDeclarations;

    if ((0, _declarations.isResizingMode)(mode) && mouse.down) {
        var event = getResizeEvent({ shapesDeclarations: shapesDeclarations, modifierKeys: modifierKeys, scene: persistedScene, mode: mode });
        return i.assoc(currentState, 'previewedHistoryEvents', [event]);
    }
    return currentState;
}
function resizeFinishReducer(currentState, ev) {
    var mode = currentState.mode;
    var shapesDeclarations = currentState.shapesDeclarations;
    var modifierKeys = currentState.modifierKeys;
    var persistedScene = currentState.persistedScene;

    if ((0, _declarations.isResizingMode)(mode) && (0, _input.isEditorInputEvent)(ev) && (0, _input.isMouseUpEvent)(ev)) {
        var event = getResizeEvent({ shapesDeclarations: shapesDeclarations, modifierKeys: modifierKeys, scene: persistedScene, mode: mode });
        var action = (0, _editorAction.pushHistoryEventAction)(event);
        var ids = mode.payload.ids;

        return i.chain(currentState).assoc('editorActionsQueue', i.push(currentState.editorActionsQueue, action)).assoc('mode', (0, _declarations.modeSelected)(ids)).value();
    }
    return currentState;
}