Current Dev State

static/js/ketcher2/script/ui/component/structeditor.jsx

@@ -0,0 +1,78 @@
+/****************************************************************************
+ * Copyright 2017 EPAM Systems
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *    http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ ***************************************************************************/
+
+import { upperFirst } from 'lodash/fp';
+import { h, Component } from 'preact';
+/** @jsx h */
+
+import Editor from '../../editor'
+
+function setupEditor(editor, props, oldProps = {}) {
+	const { struct, tool, toolOpts, options } = props;
+
+	if (struct !== oldProps.struct)
+		editor.struct(struct);
+
+	if (tool !== oldProps.tool || toolOpts !== oldProps.toolOpts)
+		editor.tool(tool, toolOpts);
+
+	if (oldProps.options && options !== oldProps.options)
+		editor.options(options);
+
+	// update handlers
+	for (let name in editor.event) {
+		if (!editor.event.hasOwnProperty(name))
+			continue;
+
+		let eventName = `on${upperFirst(name)}`;
+
+		if (props[eventName] !== oldProps[eventName]) {
+			console.info('update editor handler', eventName);
+			if (oldProps[eventName])
+				editor.event[name].remove(oldProps[eventName]);
+
+			if (props[eventName])
+				editor.event[name].add(props[eventName]);
+		}
+	}
+}
+
+class StructEditor extends Component {
+	shouldComponentUpdate() {
+		return false;
+	}
+
+	componentWillReceiveProps(props) {
+		setupEditor(this.instance, props, this.props);
+	}
+
+	componentDidMount() {
+		console.assert(this.base, "No backing element");
+		this.instance = new Editor(this.base, { ...this.props.options });
+		setupEditor(this.instance, this.props);
+		if (this.props.onInit)
+			this.props.onInit(this.instance);
+	}
+
+	render () {
+		let { Tag="div", struct, tool, toolOpts, options, ...props } = this.props;
+		return (
+			<Tag onMouseDown={ev => ev.preventDefault()} {...props}	/>
+		);
+	}
+}
+
+export default StructEditor;