forked from enviPath/enviPy
115 lines
3.4 KiB
JavaScript
115 lines
3.4 KiB
JavaScript
/****************************************************************************
|
|
* 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 { h, Component } from 'preact';
|
|
import { connect } from 'preact-redux';
|
|
/** @jsx h */
|
|
|
|
import Dialog from '../component/dialog';
|
|
import Input from '../component/input';
|
|
import StructEditor from '../component/structeditor';
|
|
import { storage } from '../utils';
|
|
|
|
import { initAttach, setAttachPoints, setTmplName } from '../state/templates';
|
|
|
|
const EDITOR_STYLES = {
|
|
selectionStyle: { fill: '#47b3ec', stroke: 'none' },
|
|
highlightStyle: { stroke: '#1a7090', 'stroke-width': 1.2 }
|
|
};
|
|
|
|
class Attach extends Component {
|
|
constructor({ onInit, ...props }) {
|
|
super();
|
|
this.tmpl = initTmpl(props.tmpl);
|
|
onInit(this.tmpl.struct.name, this.tmpl.props);
|
|
this.onResult = this.onResult.bind(this);
|
|
}
|
|
|
|
onResult() {
|
|
const { name, atomid, bondid } = this.props;
|
|
return name && (
|
|
name !== this.tmpl.struct.name ||
|
|
atomid !== this.tmpl.props.atomid ||
|
|
bondid !== this.tmpl.props.bondid
|
|
) ? { name, attach: { atomid, bondid } } : null;
|
|
}
|
|
|
|
render() {
|
|
const {
|
|
name, atomid, bondid,
|
|
onNameEdit, onAttachEdit, ...prop
|
|
} = this.props;
|
|
const struct = this.tmpl.struct;
|
|
const options = Object.assign(EDITOR_STYLES, { scale: getScale(struct) });
|
|
|
|
return (
|
|
<Dialog title="Template Edit" className="attach"
|
|
result={this.onResult} params={prop}>
|
|
<label>Template name:
|
|
<Input value={name} onChange={onNameEdit}/>
|
|
</label>
|
|
<label>Choose attachment atom and bond:</label>
|
|
<StructEditor className="editor"
|
|
struct={struct}
|
|
onAttachEdit={onAttachEdit}
|
|
tool="attach" toolOpts={{ atomid, bondid }}
|
|
options={options}/>
|
|
{!storage.isAvailable() ? <div className="warning">{storage.warningMessage}</div> : null}
|
|
</Dialog>
|
|
);
|
|
}
|
|
}
|
|
|
|
export default connect(
|
|
store => ({ ...store.templates.attach }),
|
|
dispatch => ({
|
|
onInit: (name, ap) => dispatch(initAttach(name, ap)),
|
|
onAttachEdit: ap => dispatch(setAttachPoints(ap)),
|
|
onNameEdit: name => dispatch(setTmplName(name))
|
|
})
|
|
)(Attach);
|
|
|
|
function initTmpl(tmpl) {
|
|
const normTmpl = {
|
|
struct: structNormalization(tmpl.struct),
|
|
props: {
|
|
atomid: +tmpl.props.atomid || 0,
|
|
bondid: +tmpl.props.bondid || 0
|
|
}
|
|
};
|
|
normTmpl.struct.name = tmpl.struct.name;
|
|
return normTmpl;
|
|
}
|
|
|
|
function structNormalization(struct) {
|
|
const normStruct = struct.clone();
|
|
const cbb = normStruct.getCoordBoundingBox();
|
|
normStruct.atoms.each(function (aid, atom) { // only atoms ?? mb arrow etc ...
|
|
atom.pp = atom.pp.sub(cbb.min);
|
|
});
|
|
return normStruct;
|
|
}
|
|
|
|
function getScale(struct) {
|
|
const cbb = struct.getCoordBoundingBox();
|
|
const VIEW_SIZE = 200;
|
|
let scale = VIEW_SIZE / Math.max(cbb.max.y - cbb.min.y, cbb.max.x - cbb.min.x);
|
|
|
|
if (scale < 35) scale = 35;
|
|
if (scale > 75) scale = 75;
|
|
return scale;
|
|
}
|