archive-gh-me/ShadowEditor
1
0
Fork 0
mirror of https://github.com/tengge1/ShadowEditor.git synced 2026-02-01 16:08:17 +00:00
Code Issues Projects Releases Wiki Activity

PixelComponent

Browse Source
This commit is contained in:
liteng 2019-08-01 07:37:14 +08:00
parent 8b96d9dbe3
commit 2c9590420f
7 changed files with 115 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
ShadowEditor.Web/src/editor2/component/postProcessing/AfterimageComponent.jsx
View File

@ -38,8 +38,8 @@ class AfterimageComponent extends React.Component {
}
componentDidMount() {
app.on(`objectSelected.AfterimageComponent`, this.handleUpdate.bind(this));
app.on(`objectChanged.AfterimageComponent`, this.handleUpdate.bind(this));
app.on(`objectSelected.AfterimageComponent`, this.handleUpdate);
app.on(`objectChanged.AfterimageComponent`, this.handleUpdate);
}
handleExpand(expanded) {

4
ShadowEditor.Web/src/editor2/component/postProcessing/BokehComponent.jsx
View File

@ -42,8 +42,8 @@ class BokehComponent extends React.Component {
}
componentDidMount() {
app.on(`objectSelected.BokehComponent`, this.handleUpdate.bind(this));
app.on(`objectChanged.BokehComponent`, this.handleUpdate.bind(this));
app.on(`objectSelected.BokehComponent`, this.handleUpdate);
app.on(`objectChanged.BokehComponent`, this.handleUpdate);
}
handleExpand(expanded) {

4
ShadowEditor.Web/src/editor2/component/postProcessing/DotScreenComponent.jsx
View File

@ -38,8 +38,8 @@ class DotScreenComponent extends React.Component {
}
componentDidMount() {
app.on(`objectSelected.DotScreenComponent`, this.handleUpdate.bind(this));
app.on(`objectChanged.DotScreenComponent`, this.handleUpdate.bind(this));
app.on(`objectSelected.DotScreenComponent`, this.handleUpdate);
app.on(`objectChanged.DotScreenComponent`, this.handleUpdate);
}
handleExpand(expanded) {

4
ShadowEditor.Web/src/editor2/component/postProcessing/FxaaComponent.jsx
View File

@ -36,8 +36,8 @@ class FxaaComponent extends React.Component {
}
componentDidMount() {
app.on(`objectSelected.FxaaComponent`, this.handleUpdate.bind(this));
app.on(`objectChanged.FxaaComponent`, this.handleUpdate.bind(this));
app.on(`objectSelected.FxaaComponent`, this.handleUpdate);
app.on(`objectChanged.FxaaComponent`, this.handleUpdate);
}
handleExpand(expanded) {

4
ShadowEditor.Web/src/editor2/component/postProcessing/GlitchComponent.jsx
View File

@ -38,8 +38,8 @@ class GlitchComponent extends React.Component {
}
componentDidMount() {
app.on(`objectSelected.GlitchComponent`, this.handleUpdate.bind(this));
app.on(`objectChanged.GlitchComponent`, this.handleUpdate.bind(this));
app.on(`objectSelected.GlitchComponent`, this.handleUpdate);
app.on(`objectChanged.GlitchComponent`, this.handleUpdate);
}
handleExpand(expanded) {

4
ShadowEditor.Web/src/editor2/component/postProcessing/HalftoneComponent.jsx
View File

@ -69,8 +69,8 @@ class HalftoneComponent extends React.Component {
}
componentDidMount() {
app.on(`objectSelected.HalftoneComponent`, this.handleUpdate.bind(this));
app.on(`objectChanged.HalftoneComponent`, this.handleUpdate.bind(this));
app.on(`objectSelected.HalftoneComponent`, this.handleUpdate);
app.on(`objectChanged.HalftoneComponent`, this.handleUpdate);
}
handleExpand(expanded) {

103
ShadowEditor.Web/src/editor2/component/postProcessing/PixelComponent.jsx
View File

@ -0,0 +1,103 @@
import { PropertyGrid, PropertyGroup, TextProperty, DisplayProperty, CheckBoxProperty, NumberProperty, IntegerProperty } from '../../../third_party';
import SetGeometryCommand from '../../../command/SetGeometryCommand';
/**
* 像素特效组件
* @author tengge / https://github.com/tengge1
*/
class PixelComponent extends React.Component {
constructor(props) {
super(props);
this.selected = null;
this.state = {
show: false,
expanded: true,
enabled: false,
pixelSize: 8,
};
this.handleExpand = this.handleExpand.bind(this);
this.handleUpdate = this.handleUpdate.bind(this);
this.handleChange = this.handleChange.bind(this);
}
render() {
const { show, expanded, enabled, pixelSize } = this.state;
if (!show) {
return null;
}
return <PropertyGroup title={L_PIXEL_EFFECT} show={show} expanded={expanded} onExpand={this.handleExpand}>
<CheckBoxProperty label={L_ENABLE_STATE} name={'enabled'} value={enabled} onChange={this.handleChange}></CheckBoxProperty>
<NumberProperty label={L_PIXEL_SIZE} name={'pixelSize'} value={pixelSize} onChange={this.handleChange}></NumberProperty>
</PropertyGroup>;
}
componentDidMount() {
app.on(`objectSelected.PixelComponent`, this.handleUpdate);
app.on(`objectChanged.PixelComponent`, 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.pixel ? postProcessing.pixel.enabled : false,
pixelSize: postProcessing.pixel ? postProcessing.pixel.pixelSize : this.state.pixelSize,
};
this.setState(state);
}
handleChange(value, name) {
this.setState({
[name]: value,
});
if (value === null) {
return;
}
const { enabled, pixelSize } = Object.assign({}, this.state, {
[name]: value,
});
let scene = this.selected;
scene.userData.postProcessing = scene.userData.postProcessing || {};
Object.assign(scene.userData.postProcessing, {
halftone: {
enabled,
pixelSize,
},
});
app.call(`postProcessingChanged`, this);
}
}
export default PixelComponent;