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

A core library for creating shape-based graphic editors

'use strict';

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

var _uniqueId = require('../../utils/unique-id');

var _uniqueId2 = _interopRequireDefault(_uniqueId);

var _modes = require('../../declarations/modes');

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

var _historyEvent = require('../../history/history-event');

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

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

var _icepick = require('icepick');

var i = _interopRequireWildcard(_icepick);

var _object = require('object.pick');

var _object2 = _interopRequireDefault(_object);

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; } }

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

var DRAWN_SHAPE_ID = exports.DRAWN_SHAPE_ID = '___';
var REDUCERS = [drawingModeEnterReducer, drawingModeStateReducer, drawingPreviewStateReducer];
function drawStateReducer(currentState, ev) {
    return REDUCERS.reduce(function (res, fn) {
        return fn(res, ev);
    }, currentState);
}
function drawingModeEnterReducer(currentState, ev) {
    var mode = currentState.mode;

    if (!((0, _input.isEditorInputEvent)(ev) && (0, _modes.isDrawingShapeMode)(mode))) {
        return currentState;
    } else {
        if ((0, _input.isMouseDownEvent)(ev) && ev.payload.button === _input.ButtonType.Left && !mode.payload.drawing) {
            // start drawing
            var shapeType = mode.payload.shapeType;

            var shapeDeclaration = currentState.shapesDeclarations[shapeType];

            var _ref = shapeDeclaration.ignoreGrid ? ev.payload : (0, _grid.snapCoordsIfNeeded)(currentState.grid, ev.payload);

            var x = _ref.x;
            var y = _ref.y;

            var drawingGenerator = shapeDeclaration.draw({ startX: x, startY: y });
            var drawnKeyPoints = drawingGenerator.next().value;
            return i.merge(currentState, {
                mode: { payload: {
                        drawing: true,
                        drawingGenerator: drawingGenerator,
                        drawnKeyPoints: drawnKeyPoints
                    }
                }
            });
        }
        return currentState;
    }
}
function drawingModeStateReducer(currentState, ev) {
    var mode = currentState.mode;

    if (!((0, _input.isEditorInputEvent)(ev) && (0, _modes.isDrawingShapeMode)(mode) && mode.payload.drawing)) {
        return currentState;
    } else {
        // drawing process : iterate on the .draw() generator until done
        // snap event to grid if needed
        var shapeDeclaration = currentState.shapesDeclarations[mode.payload.shapeType];
        var castEv = shapeDeclaration.ignoreGrid ? ev : (0, _grid.snapEditorInputEventCoordsIfNeeded)(currentState.grid, ev);

        var _mode$payload$drawing = mode.payload.drawingGenerator.next(castEv);

        var done = _mode$payload$drawing.done;
        var newlyDrawnKeyPoints = _mode$payload$drawing.value;

        if (done || (0, _input.isMouseLeaveEvent)(ev)) {
            var shapesDeclarations = currentState.shapesDeclarations;
            var graphicalContextData = currentState.graphicalContextData;
            var shapeType = mode.payload.shapeType;
            // TODO get shape data in another function

            var _shapeDeclaration = shapesDeclarations[shapeType];
            // TODO extract
            var graphicalContextParamsTypes = _shapeDeclaration.graphicalContextParams;
            var mergedValue = (0, _object2.default)(graphicalContextData, graphicalContextParamsTypes);
            var id = (0, _uniqueId2.default)();
            var shapeData = {
                type: shapeType, id: id,
                graphicalContextData: mergedValue,
                keyPoints: newlyDrawnKeyPoints
            };
            // push history action to the queue and update mode
            // const { editorActionsQueue } = currentState;
            var previewedEvent = (0, _historyEvent.shapeAddEvent)(shapeData);
            var _shapesDeclarations$s = shapesDeclarations[shapeType];
            var hasSubSelectedMode = _shapesDeclarations$s.hasSubSelectedMode;
            var noSelectAfterDrawn = _shapesDeclarations$s.noSelectAfterDrawn;

            var assocedQueue = i.chain(currentState).assoc('editorActionsQueue', i.push(currentState.editorActionsQueue, (0, _editorAction.pushHistoryEventAction)((0, _historyEvent.shapeAddEvent)(shapeData)))).assoc('previewedHistoryEvents', [previewedEvent]).value();
            if (!noSelectAfterDrawn) {
                var nextMode = hasSubSelectedMode ? (0, _modes.modeSubSelected)(id) : (0, _modes.modeSelected)([id]);
                return i.assoc(assocedQueue, 'mode', nextMode);
            } else {
                return i.assocIn(assocedQueue, ['mode', 'payload', 'drawing'], false);
            }
        } else {
            return i.merge(currentState, {
                mode: { payload: { drawnKeyPoints: newlyDrawnKeyPoints } }
            });
        }
    }
}
function drawingPreviewStateReducer(currentState, ev) {
    var mode = currentState.mode;

    if (!((0, _modes.isDrawingShapeMode)(mode) && mode.payload.drawing)) {
        return currentState;
    } else {
        var graphicalContextData = currentState.graphicalContextData;
        var _mode$payload = mode.payload;
        var shapeType = _mode$payload.shapeType;
        var drawnKeyPoints = _mode$payload.drawnKeyPoints;

        var shapeDeclaration = currentState.shapesDeclarations[mode.payload.shapeType];
        var customParams = shapeDeclaration.initialCustomParams || null;
        // set custom params to initial
        var shapeData = {
            type: shapeType,
            id: DRAWN_SHAPE_ID,
            graphicalContextData: graphicalContextData,
            keyPoints: drawnKeyPoints
        };
        if (customParams) {
            shapeData = i.assoc(shapeData, 'customParams', customParams);
        }
        var event = (0, _historyEvent.shapeAddEvent)(shapeData);
        return i.assoc(currentState, 'previewedHistoryEvents', [event]);
    }
}