molstar
Version:
A comprehensive macromolecular library.
143 lines (142 loc) • 7.08 kB
JavaScript
/**
* Copyright (c) 2019-2021 mol* contributors, licensed under MIT, See LICENSE file for more info.
*
* @author Alexander Rose <alexander.rose@weirdbyte.de>
*/
import { __assign, __awaiter, __generator } from "tslib";
import { createPluginUI } from '../../mol-plugin-ui/react18';
import { DefaultPluginUISpec } from '../../mol-plugin-ui/spec';
import { PluginCommands } from '../../mol-plugin/commands';
import { Asset } from '../../mol-util/assets';
import { Color } from '../../mol-util/color';
import './index.html';
require('mol-plugin-ui/skin/light.scss');
var Canvas3DPresets = {
illustrative: {
canvas3d: {
postprocessing: {
occlusion: { name: 'on', params: { samples: 32, radius: 6, bias: 1.4, blurKernelSize: 15, resolutionScale: 1 } },
outline: { name: 'on', params: { scale: 1, threshold: 0.33, color: Color(0x000000) } }
},
renderer: {
ambientIntensity: 1.0,
light: []
}
}
},
occlusion: {
canvas3d: {
postprocessing: {
occlusion: { name: 'on', params: { samples: 32, radius: 6, bias: 1.4, blurKernelSize: 15, resolutionScale: 1 } },
outline: { name: 'off', params: {} }
},
renderer: {
ambientIntensity: 0.4,
light: [{ inclination: 180, azimuth: 0, color: Color.fromNormalizedRgb(1.0, 1.0, 1.0),
intensity: 0.6 }]
}
}
},
standard: {
canvas3d: {
postprocessing: {
occlusion: { name: 'off', params: {} },
outline: { name: 'off', params: {} }
},
renderer: {
ambientIntensity: 0.4,
light: [{ inclination: 180, azimuth: 0, color: Color.fromNormalizedRgb(1.0, 1.0, 1.0),
intensity: 0.6 }]
}
}
}
};
var LightingDemo = /** @class */ (function () {
function LightingDemo() {
this.radius = 5;
this.bias = 1.1;
this.preset = 'illustrative';
}
LightingDemo.prototype.init = function (target) {
return __awaiter(this, void 0, void 0, function () {
var _a;
return __generator(this, function (_b) {
switch (_b.label) {
case 0:
_a = this;
return [4 /*yield*/, createPluginUI(typeof target === 'string' ? document.getElementById(target) : target, __assign(__assign({}, DefaultPluginUISpec()), { layout: {
initial: {
isExpanded: false,
showControls: false
},
}, components: {
controls: { left: 'none', right: 'none', top: 'none', bottom: 'none' }
} }))];
case 1:
_a.plugin = _b.sent();
this.setPreset('illustrative');
return [2 /*return*/];
}
});
});
};
LightingDemo.prototype.setPreset = function (preset) {
var _a;
var props = Canvas3DPresets[preset];
if (((_a = props.canvas3d.postprocessing.occlusion) === null || _a === void 0 ? void 0 : _a.name) === 'on') {
props.canvas3d.postprocessing.occlusion.params.radius = this.radius;
props.canvas3d.postprocessing.occlusion.params.bias = this.bias;
}
PluginCommands.Canvas3D.SetSettings(this.plugin, {
settings: __assign(__assign({}, props), { renderer: __assign(__assign({}, this.plugin.canvas3d.props.renderer), props.canvas3d.renderer), postprocessing: __assign(__assign({}, this.plugin.canvas3d.props.postprocessing), props.canvas3d.postprocessing) })
});
};
LightingDemo.prototype.load = function (_a, radius, bias) {
var url = _a.url, _b = _a.format, format = _b === void 0 ? 'mmcif' : _b, _c = _a.isBinary, isBinary = _c === void 0 ? true : _c, _d = _a.assemblyId, assemblyId = _d === void 0 ? '' : _d;
return __awaiter(this, void 0, void 0, function () {
var data, trajectory, model, structure, polymer, ligand;
return __generator(this, function (_e) {
switch (_e.label) {
case 0: return [4 /*yield*/, this.plugin.clear()];
case 1:
_e.sent();
return [4 /*yield*/, this.plugin.builders.data.download({ url: Asset.Url(url), isBinary: isBinary }, { state: { isGhost: true } })];
case 2:
data = _e.sent();
return [4 /*yield*/, this.plugin.builders.structure.parseTrajectory(data, format)];
case 3:
trajectory = _e.sent();
return [4 /*yield*/, this.plugin.builders.structure.createModel(trajectory)];
case 4:
model = _e.sent();
return [4 /*yield*/, this.plugin.builders.structure.createStructure(model, assemblyId ? { name: 'assembly', params: { id: assemblyId } } : { name: 'model', params: {} })];
case 5:
structure = _e.sent();
return [4 /*yield*/, this.plugin.builders.structure.tryCreateComponentStatic(structure, 'polymer')];
case 6:
polymer = _e.sent();
if (!polymer) return [3 /*break*/, 8];
return [4 /*yield*/, this.plugin.builders.structure.representation.addRepresentation(polymer, { type: 'spacefill', color: 'illustrative' })];
case 7:
_e.sent();
_e.label = 8;
case 8: return [4 /*yield*/, this.plugin.builders.structure.tryCreateComponentStatic(structure, 'ligand')];
case 9:
ligand = _e.sent();
if (!ligand) return [3 /*break*/, 11];
return [4 /*yield*/, this.plugin.builders.structure.representation.addRepresentation(ligand, { type: 'ball-and-stick', color: 'element-symbol', colorParams: { carbonColor: { name: 'element-symbol', params: {} } } })];
case 10:
_e.sent();
_e.label = 11;
case 11:
this.radius = radius;
this.bias = bias;
this.setPreset(this.preset);
return [2 /*return*/];
}
});
});
};
return LightingDemo;
}());
window.LightingDemo = new LightingDemo();