1 line
5.7 KiB
JavaScript
1 line
5.7 KiB
JavaScript
"use strict";var e=function(e){return e&&e.__esModule?e["default"]:e},t=e(require("react")),n=require("animation-utilities"),i=n.RobotInfo,r=n.JiboConfig,o=n.visualize,a=n.THREE,s=e(require("path")),l=e(require("../../controllers/vertex-controller")),h=e(require("../../controllers/scale-translate-controller")),d=e(require("../../controllers/rotation-controller")),c=e(require("./mode-select")),p=e(require("./eye-layer")),u=e(require("lodash")),y={vertex:l,str:h,rotation:d},f=new r,v=1280/720,m=t.createClass({displayName:"layout-child",getInitialState:function(){return{disabled:!0,mode:"str"}},render:function(){var e={face:{width:this.props.width,height:this.props.height,cursor:this.state.disabled?"not-allowed":"pointer"},div:{position:"relative"},container:{top:0,bottom:0,left:0,right:0,position:"absolute"}},n=this.props.height-40;return v<this.props.width/n?(e.div.height=n,e.div.width=v*n,e.div.left=.5*(this.props.width-e.div.width),e.div.right=.5*(this.props.width-e.div.width)):(e.div.height=this.props.width/v,e.div.width=this.props.width,e.div.top=.5*(n-e.div.height),e.div.bottom=.5*(n-e.div.height)),t.createElement("div",{className:"face",onWheel:this.onWheel,style:e.face},t.createElement(c,{disabled:this.state.disabled,onSelect:this.onSelectMode}),t.createElement("div",{style:e.div},t.createElement("div",{ref:"container",style:e.container,className:"face-view"})))},getIntersectionAtHeight:function(e,n,i){var r=t.findDOMNode(this.refs.container),o=new a.Vector3;o.set(e/r.clientWidth*2-1,2*-(n/r.clientHeight)+1,.5);var s=this.renderer.scene.getCamera();return o.unproject(s),o.z=i,o},drawBounds:function(){var e=t.findDOMNode(this.refs.container);if(e)for(var n=e.getBoundingClientRect(),i=this.getIntersectionAtHeight(0,0,.5),r=this.getIntersectionAtHeight(n.width,0,.5),o=this.getIntersectionAtHeight(0,n.height,.5),s=this.getIntersectionAtHeight(n.width,n.height,.5),l=new a.LineBasicMaterial({color:11842740,linewidth:2}),h=[i,r,r,s,s,o,o,i];h.length;){var d=new a.Geometry;d.vertices.push(h.shift()),d.vertices.push(h.shift());var c=new a.Line(d,l);this.renderer.scene.getScene().add(c)}},onWheel:function(e){var t=e.nativeEvent.wheelDelta/1200;this.currentScale-=t,this.currentScale<1&&(this.currentScale=1);var n=this.renderer.scene.getCamera();n.left=this.originalCamera.left*this.currentScale,n.right=this.originalCamera.right*this.currentScale,n.top=this.originalCamera.top*this.currentScale,n.bottom=this.originalCamera.bottom*this.currentScale,n.updateProjectionMatrix()},componentWillMount:function(){},componentDidMount:function(){var e=this;this.lastLayerType="";var n=t.findDOMNode(this.refs.container);i.createInfo(f,function(t){e.robotInfo=t,o.createRobotRenderer(t,n,o.DisplayType.EYE,function(n){e.renderer=n,n.display(t.getDefaultDOFValues()),e.drawBounds(),e.init();var i=e.renderer.scene.getCamera();e.originalCamera={left:i.left,right:i.right,top:i.top,bottom:i.bottom},e.currentScale=1,e.onSelectMode(e.state.mode),e.onDataChanged(),e.onDataChangedBind=e.onDataChanged.bind(e),e.props.animationModel.on("ondatachanged",e.onDataChangedBind)})})},init:function(){this.eyeLayer=new p(this.renderer,this.props.animationModel,!1),this.eyeOverlayLayer=new p(this.renderer,this.props.animationModel,!0)},componentWillUnmount:function(){this.eyeLayer&&this.eyeLayer.dispose(),this.eyeOverlayLayer&&this.eyeOverlayLayer.dispose(),this.onDataChangedBind&&this.props.animationModel.removeListener("ondatachanged",this.onDataChangedBind)},onDataChanged:function(){var e=this,t=this.props.animationModel.getSelectedLayer(),n=this.state.disabled;if(this.props.animationModel.keyframeSelection.isMultiSelect()||!this.props.animationModel.isLayerOfTypeSelected(["Eye","Overlay"])||!t.visible||t.locked)this.controller&&this.controller.dispose(),this.setState({disabled:!0});else{this.setState({disabled:!1});var i=this.props.animationModel.keyframeSelection.getSelectionLayerType();(this.controller instanceof y[this.state.mode]==!1||n===!0||this.lastLayerType!==i)&&this.onSelectMode(this.state.mode)}if(this.robotInfo){if(!this.props.animationModel.keyframeSelection.isMultiSelect()&&this.props.animationModel.isLayerOfTypeSelected(["Eye","Overlay"])){var r=this.props.animationModel.evaluateAllLayersFiltered(function(e){return"Eye"===e.type||"Overlay"===e.type})[t.type];r=r?r:this.props.animationModel.getDefaultPropsForLayerType("Eye"),this.controller.setProps(r)}var o=this.props.animationModel.evaluateAllDOFLayers();o=u.extend({},u.cloneDeep(this.robotInfo.getDefaultDOFValues()),u.cloneDeep(o)),o={eyeTextureInfixBn_r:s.resolve(this.props.animationModel.projectRoot,o.eyeTextureInfixBn_r),overlayTextureInfixBn_r:s.resolve(this.props.animationModel.projectRoot,o.overlayTextureInfixBn_r),eye_redChannelBn_r:o.eye_redChannelBn_r,eye_greenChannelBn_r:o.eye_greenChannelBn_r,eye_blueChannelBn_r:o.eye_blueChannelBn_r,overlay_redChannelBn_r:o.overlay_redChannelBn_r,overlay_greenChannelBn_r:o.overlay_greenChannelBn_r,overlay_blueChannelBn_r:o.overlay_blueChannelBn_r,screenBG_redChannelBn_r:o.screenBG_redChannelBn_r,screenBG_greenChannelBn_r:o.screenBG_greenChannelBn_r,screenBG_blueChannelBn_r:o.screenBG_blueChannelBn_r,screenBGTextureInfixBn_r:s.resolve(this.props.animationModel.projectRoot,o.screenBGTextureInfixBn_r)},this.renderer.display(o),window.requestAnimationFrame(function(){e.controller&&e.controller.scaleSpheres()})}},onSelectMode:function(e){var n=t.findDOMNode(this.refs.container);this.controller&&this.controller.dispose(),this.controller=new y[e](this.renderer,n,this.robotInfo,this.props.animationModel,!this.props.animationModel.keyframeSelection.isMultiSelect()&&this.props.animationModel.isLayerOfTypeSelected("Overlay")),this.state.mode=e,this.lastLayerType=this.props.animationModel.keyframeSelection.getSelectionLayerType()}});module.exports=m; |