撤消/重做发送转发&使用fabric.js在canvas中引入向后功能

时间:2015-07-13 13:39:48

标签: javascript jquery html5 canvas

我使用fabric.js来创建自定义鞋子设计。我想添加撤消&重做功能进入它&我从fiddle link成功完成了这项工作。

我使用下面的代码来推送画布状态。

function changeLayer(direction) {
                    var activeObject = canvas.getActiveObject();
                    if (activeObject) {
                        if (direction == 'fore')
                            console.log(canvas.bringForward(activeObject));
                        else
                            console.log(canvas.sendBackwards(activeObject));
                    }
                    pushstate();

                }

function pushstate() {
                    if (replayFlag === false) { // i.e. user modified something..
                        var itemProps = [];
                        for (var i in selectedObject) {
                            itemProps.push({
                                "itemNum": selectedObject[i].itemNum,
                                "left": selectedObject[i].left,
                                "top": selectedObject[i].top,
                                "scaleX": selectedObject[i].scaleX,
                                "scaleY": selectedObject[i].scaleY,
                                "angle": selectedObject[i].angle,
                                "flipX": selectedObject[i].flipX,
                                "flipY": selectedObject[i].flipY,
                                "fill": selectedObject[i].fill,
                                "fontSize": selectedObject[i].fontSize,
                                "fontFamily": selectedObject[i].fontFamily,
                                "textBackgroundColor": selectedObject[i].textBackgroundColor,
                                "fontWeight": selectedObject[i].fontWeight,
                                "fontStyle": selectedObject[i].fontStyle,
                                "textDecoration": selectedObject[i].textDecoration
                            });
                        }

                        // get current object properties 
                        onObjectSelected();

                        undoHist.push({
                            "action": "modify",
                            "itemProps": itemProps
                        });
                        redoHist = [];
                    }
                }

当我向前或向后移动元素时,撤消/重做功能无法正常工作。

0 个答案:

没有答案