diff --git a/ShadowEditor.Web/src/editor2/component/postProcessing/SmaaComponent.jsx b/ShadowEditor.Web/src/editor2/component/postProcessing/SmaaComponent.jsx index e69de29b..42e56b24 100644 --- a/ShadowEditor.Web/src/editor2/component/postProcessing/SmaaComponent.jsx +++ b/ShadowEditor.Web/src/editor2/component/postProcessing/SmaaComponent.jsx @@ -0,0 +1,99 @@ +import { PropertyGrid, PropertyGroup, TextProperty, DisplayProperty, CheckBoxProperty, NumberProperty, IntegerProperty } from '../../../third_party'; +import SetGeometryCommand from '../../../command/SetGeometryCommand'; + +/** + * 多重采样抗锯齿(SMAA)组件 + * @author tengge / https://github.com/tengge1 + */ +class SmaaComponent extends React.Component { + constructor(props) { + super(props); + + this.selected = null; + + this.state = { + show: false, + expanded: true, + enabled: false, + }; + + this.handleExpand = this.handleExpand.bind(this); + this.handleUpdate = this.handleUpdate.bind(this); + + this.handleChange = this.handleChange.bind(this); + } + + render() { + const { show, expanded, enabled } = this.state; + + if (!show) { + return null; + } + + return + + ; + } + + componentDidMount() { + app.on(`objectSelected.SmaaComponent`, this.handleUpdate); + app.on(`objectChanged.SmaaComponent`, this.handleUpdate); + } + + handleExpand(expanded) { + this.setState({ + expanded, + }); + } + + handleUpdate() { + const editor = app.editor; + + if (!editor.selected || editor.selected !== editor.scene) { + this.setState({ + show: false, + }); + return; + } + + this.selected = editor.selected; + + let scene = this.selected; + let postProcessing = scene.userData.postProcessing || {}; + + let state = { + show: true, + enabled: postProcessing.smaa ? postProcessing.smaa.enabled : false, + }; + + this.setState(state); + } + + handleChange(value, name) { + this.setState({ + [name]: value, + }); + + if (value === null) { + return; + } + + const { enabled } = Object.assign({}, this.state, { + [name]: value, + }); + + let scene = this.selected; + + scene.userData.postProcessing = scene.userData.postProcessing || {}; + + Object.assign(scene.userData.postProcessing, { + halftone: { + enabled, + }, + }); + + app.call(`postProcessingChanged`, this); + } +} + +export default SmaaComponent; \ No newline at end of file diff --git a/ShadowEditor.Web/src/editor2/sidebar/PropertyPanel.jsx b/ShadowEditor.Web/src/editor2/sidebar/PropertyPanel.jsx index 3a02f9ec..061019bd 100644 --- a/ShadowEditor.Web/src/editor2/sidebar/PropertyPanel.jsx +++ b/ShadowEditor.Web/src/editor2/sidebar/PropertyPanel.jsx @@ -36,6 +36,7 @@ import HalftoneComponent from '../component/postProcessing/HalftoneComponent.jsx import PixelComponent from '../component/postProcessing/PixelComponent.jsx'; import RgbShiftComponent from '../component/postProcessing/RgbShiftComponent.jsx'; import SaoComponent from '../component/postProcessing/SaoComponent.jsx'; +import SmaaComponent from '../component/postProcessing/SmaaComponent.jsx'; /** * 属性面板 @@ -84,6 +85,7 @@ class PropertyPanel extends React.Component { + ; } }