1 line
9.4 KiB
JavaScript
1 line
9.4 KiB
JavaScript
"use strict";var e=function(e){return e&&e.__esModule?e["default"]:e},t=e(require("react")),o=require("atom").CompositeDisposable,a=e(require("../../common/find-node")),i=void 0,n=void 0,s=void 0,r=t.createClass({displayName:"LayerLabelView",getInitialState:function(){return{editingName:!1}},componentDidMount:function(){var e=t.findDOMNode(this.refs.label);this.onKeyDownCB=this.onKeyDown.bind(this),e.addEventListener("keydown",this.onKeyDownCB),this.disposable=new o,this.disposable.add(atom.commands.add(this.getDOMNode(),{"jibo-sdk:delete-anim-layer":this._deleteLayer,"jibo-sdk:toggle-layer-lock":this._toggleLocked,"jibo-sdk:toggle-layer-visibility":this._toggleVisibility,"jibo-sdk:delete-all-keys":this.deleteAllKeys,"jibo-sdk:move-layer-up":this.moveUp,"jibo-sdk:move-layer-down":this.moveDown,"jibo-sdk:cut-layer":this._cutLayer,"jibo-sdk:copy-layer":this._copyLayer,"jibo-sdk:paste-layer":this._pasteLayer})),this.getDOMNode().layerLabelView=this},componentWillUnmount:function(){var e=t.findDOMNode(this.refs.label);e.removeEventListener("keydown",this.onKeyDownCB),this.disposable.dispose()},componentWillReceiveProps:function(e){this.synchronizeLabelText(e)},onKeyDown:function(e){var o=t.findDOMNode(this.refs.label);if(13===e.which)this.setLayerName(),o.blur();else if(27===e.which)this.synchronizeLabelText(this.props),o.blur();else if(9===e.which){var a=void 0;a=e.shiftKey?o.parentNode.previousSibling:o.parentNode.nextSibling,a&&(a.getElementsByTagName("input")[0].disabled=!1,a.getElementsByTagName("input")[0].focus(),a.getElementsByTagName("input")[0].select(),e.preventDefault(),e.stopPropagation())}},onBlur:function(){var e=t.findDOMNode(this.refs.label);e.disabled=!0,this.setState({editingName:!1}),this.setLayerName()},onFocus:function(){this.setState({editingName:!0}),this.selectLayer(!0);var e=t.findDOMNode(this.refs.label);setTimeout(function(){e.select()},10)},setLayerName:function(){var e=t.findDOMNode(this.refs.label);""===e.value&&this.synchronizeLabelText(this.props),this.props.animationModel.getLayer(this.props.layerId).name!==e.value&&this.props.animationModel.setLayerName(this.props.layerId,e.value)},synchronizeLabelText:function(){var e=t.findDOMNode(this.refs.label),o=e.selectionStart,a=e.selectionEnd,i=e===document.activeElement;e.value=this.props.animationModel.getLayer(this.props.layerId).name,i&&(e.focus(),e.setSelectionRange(o,a))},onClick:function(){this.selectLayer(!0)},toggleVisibility:function(e){0===e.button&&(e.stopPropagation(),e.preventDefault(),this.selectLayer(),this._toggleVisibility())},_toggleVisibility:function(){this.props.animationModel.toggleLayerVisibility(this.props.layerId)},selectLayer:function(e){var t=this.props.animationModel.getLayer(this.props.layerId);t!==this.props.animationModel.getSelectedLayer()&&(this.props.animationModel.keyframeSelection._clearSelection(),this.props.animationModel.setSelection(this.props.layerId),e&&this.props.animationModel.addRedoUndoEntry())},toggleLocked:function(e){0===e.button&&(e.stopPropagation(),e.preventDefault(),this.selectLayer(),this._toggleLocked())},_toggleLocked:function(){this.props.animationModel.toggleLayerLocked(this.props.layerId)},deleteLayer:function(e){0===e.button&&(e.stopPropagation(),e.preventDefault(),this._deleteLayer())},_deleteLayer:function(){this.props.animationModel.deleteLayerById(this.props.layerId)},deleteAllKeys:function(){this.props.animationModel.deleteKeysByLayerId(this.props.layerId)},onLabelMouseDown:function(e){if(0===e.button){e.stopPropagation();var o=t.findDOMNode(this.refs.label);o!==document.activeElement,this.props.animationModel.isLayerSelected(this.props.layerId)===!1&&this.selectLayer(!0)}},onLabelClick:function(e){e.stopPropagation();var o=t.findDOMNode(this.refs.label);o!==document.activeElement&&e.preventDefault()},onLabelDoubleClick:function(){this.startEditing()},startEditing:function(){var e=this,o=t.findDOMNode(this.refs.label);o!==document.activeElement&&setTimeout(function(){o.disabled=!1,e.setState({editingName:!0}),o.focus(),o.select()},10)},moveUp:function(){this.props.animationModel.moveUp(this.props.layerId)},moveDown:function(){this.props.animationModel.moveDown(this.props.layerId)},_cutLayer:function(){this.props.animationModel.cutLayer(this.props.layerId)},_copyLayer:function(){this.props.animationModel.copyLayer(this.props.layerId)},_pasteLayer:function(){this.props.animationModel.pasteLayer(this.props.layerId)},onDragStart:function(e){e.dataTransfer.setData("animation-editor/layer-drop",this.props.layerId),e.dataTransfer.effectAllowed="move"},onDragEnterTop:function(e){var o=e.dataTransfer.getData("animation-editor/layer-drop");if(""!==o&&this.props.layerId!==o&&!this.props.animationModel.isPreviousLayer(o,this.props.layerId)){var a=t.findDOMNode(this.refs.dropTop);a.className="drop-top drag-over",this.onDropEnter(e,!0)}},onDragEnterBottom:function(e){var o=e.dataTransfer.getData("animation-editor/layer-drop");if(""!==o&&this.props.layerId!==o&&!this.props.animationModel.isNextLayer(o,this.props.layerId)){var a=t.findDOMNode(this.refs.dropBottom);a.className="drop-bottom drag-over",this.onDropEnter(e,!1)}},onDropEnter:function(e,t){var o=e.dataTransfer.getData("animation-editor/layer-drop");""!==o&&o!==this.props.layerId&&(t?(n=o,i=this.props.layerId,s=t):(n=o,i=this.props.layerId,s=t))},onDragLeaveTop:function(){var e=t.findDOMNode(this.refs.dropTop);e.className="drop-top"},onDragLeaveBottom:function(){var e=t.findDOMNode(this.refs.dropBottom);e.className="drop-bottom"},clearDragOverClasses:function(){for(var e=this.getDOMNode().parentNode.getElementsByClassName("drop-top"),t=0;t<e.length;t++)e[t].className="drop-top";for(var o=this.getDOMNode().parentNode.getElementsByClassName("drop-bottom"),t=0;t<o.length;t++)o[t].className="drop-bottom"},onDragEnd:function(){this.clearDragOverClasses(),i&&(s?this.props.animationModel.reorderToBeforeLayer(n,i):this.props.animationModel.reorderToAfterLayer(n,i),i=null,document.querySelector(".active .animation-editor").childNodes[0].focus(),this.props.animationModel.addRedoUndoEntry())},render:function(){var e=this.props.animationModel.getLayer(this.props.layerId),o={parent:{opacity:e.locked||!e.visible?.2:1},label:{"float":"left",paddingLeft:10},dropTop:{width:270,height:20,cursor:"default",position:"absolute"},dropBottom:{width:270,height:20,marginTop:20,cursor:"default",position:"absolute"}},a="animation-channel-label native-key-bindings";this.props.animationModel.isLayerSelected(e.id)&&(a+=" selected"),this.props.odd&&(a+=" odd");var i=void 0;i=e.locked?t.createElement("i",{className:"fa fa-lock locked",onMouseDownCapture:this.toggleLocked}):t.createElement("i",{className:"fa fa-unlock locked",onMouseDownCapture:this.toggleLocked});var n=void 0;n=e.visible?t.createElement("i",{className:"fa fa-eye visible",onMouseDownCapture:this.toggleVisibility}):t.createElement("i",{className:"fa fa-times visible",onMouseDownCapture:this.toggleVisibility});var s="type: "+e.type;return t.createElement("div",{draggable:"true",title:s,onDragStart:this.onDragStart,onMouseMove:this.onMouseMove,onDragEnd:this.onDragEnd,onClick:this.onClick,style:o.parent,className:a},t.createElement("div",{title:s,ref:"dropTop",onDragEnter:this.onDragEnterTop,onDragLeave:this.onDragLeaveTop,style:o.dropTop,className:"drop-top",onMouseDownCapture:this.onLabelMouseDown}),t.createElement("div",{title:s,ref:"dropBottom",onDragEnter:this.onDragEnterBottom,onDragLeave:this.onDragLeaveBottom,style:o.dropBottom,className:"drop-bottom",onMouseDownCapture:this.onLabelMouseDown}),t.createElement("div",{className:"flags"},n,i),t.createElement("div",{disabled:!0,tabIndex:this.props.tabIndex,style:o.label,ref:"label",onFocus:this.onFocus,onBlur:this.onBlur,onDoubleClickCapture:this.onLabelDoubleClick,onClickCapture:this.onLabelClick,onMouseDownCapture:this.onLabelMouseDown,type:"text"},e.name),t.createElement("i",{className:"fa fa-times delete",onMouseDownCapture:this.deleteLayer}))}});atom.contextMenu.add({"atom-pane .animation-channel-label":[{label:"Delete",command:"jibo-sdk:delete-anim-layer"},{type:"separator"},{label:"Delete All Keys",command:"jibo-sdk:delete-all-keys",shouldDisplay:function(e){var t=a.getAncestor(e.target,".animation-channel-label"),o=t&&t.layerLabelView.props,i=o?o.animationModel.getLayer(o.layerId):void 0;return i?0!==i.keyframes.length&&!i.locked:!1}},{type:"separator"},{label:"Move Up",command:"jibo-sdk:move-layer-up",shouldDisplay:function(e){var t=a.getAncestor(e.target,".animation-channel-label"),o=t&&t.layerLabelView.props;return o&&o.animationModel.canMoveUp(o.layerId)}},{label:"Move Down",command:"jibo-sdk:move-layer-down",shouldDisplay:function(e){var t=a.getAncestor(e.target,".animation-channel-label"),o=t&&t.layerLabelView.props;return o&&o.animationModel.canMoveDown(o.layerId)}},{type:"separator"},{command:"jibo-sdk:toggle-layer-lock",created:function(e){var t=a.getAncestor(e.target,".animation-channel-label"),o=t?t.layerLabelView.props:void 0;o&&o.animationModel.getLayer(o.layerId).locked?this.label="Unlock Layer":this.label="Lock Layer"}},{command:"jibo-sdk:toggle-layer-visibility",created:function(e){var t=a.getAncestor(e.target,".animation-channel-label"),o=t?t.layerLabelView.props:void 0;o&&o.animationModel.getLayer(o.layerId).visible?this.label="Hide Layer":this.label="Show Layer"}},{type:"separator"},{label:"Cut",command:"jibo-sdk:cut-layer"},{label:"Copy",command:"jibo-sdk:copy-layer"},{label:"Paste",command:"jibo-sdk:paste-layer",shouldDisplay:function(e){var t=a.getAncestor(e.target,".animation-channel-label");return t&&t.layerLabelView.props.animationModel.canPasteLayer()}}]}),module.exports=r; |