solrkit
Version:
  UI Components for Solr, using TypeScript + React
107 lines • 7.68 kB
JavaScript
var __extends = (this && this.__extends) || (function () {
var extendStatics = Object.setPrototypeOf ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
function (d, b) { for (var p in b)
if (b.hasOwnProperty(p))
d[p] = b[p]; };
return function (d, b) {
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
})();
var __assign = (this && this.__assign) || Object.assign || function (t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s)
if (Object.prototype.hasOwnProperty.call(s, p))
t[p] = s[p];
}
return t;
};
import * as React from 'react';
import { DetailLayout } from '../../../layout/DetailLayout';
import { SearchBox } from '../../../component/SearchBox';
import { AppDataStore } from './data/AppDataStore';
import { databind } from '../../../context/DataBinding';
import { Dropdown } from 'semantic-ui-react';
import { get } from 'lodash';
function hrefs(links) {
return links.map(function (link) {
return (React.createElement("p", null, React.createElement("a", { href: link }, link)));
});
}
var train1options = [
{ key: 'Transom', text: 'Transom' },
{ key: 'Rose', text: 'Rose' },
{ key: 'Arched', text: 'Arched' }
];
var train2options = [
{ key: 'Tiffany', text: 'Tiffany' },
{ key: 'Meyer', text: 'Zettler' },
{ key: 'Boos', text: 'Boos' },
{ key: 'D\'Ascenzo', text: 'D\'Ascenzo' },
{ key: 'Ballano', text: 'Ballano' }
];
var DocumentDetails = (function (_super) {
__extends(DocumentDetails, _super);
function DocumentDetails() {
var _this = _super.call(this) || this;
_this.setValue = _this.setValue.bind(_this);
return _this;
}
DocumentDetails.prototype.setValue = function (attr) {
var self = this;
return function (event) {
dataStore.windows.doUpdate(self.props.id, attr, get(event, 'currentTarget.textContent', ''));
event.stopPropagation();
};
};
DocumentDetails.prototype.render = function () {
// [[214, 269, 250, 233], [262, 305, 298, 269]]
var rects = JSON.parse(this.props.faces).map(function (_a) {
var top = _a[0], right = _a[1], bottom = _a[2], left = _a[3];
return (React.createElement("div", { style: {
position: 'absolute',
top: (top + 14) + 'px',
left: (left + 14) + 'px',
width: (right - left) + 'px',
height: (bottom - top) + 'px',
borderWidth: '4px',
borderColor: 'red',
borderStyle: 'solid'
} }));
});
return (React.createElement("div", null, React.createElement("div", { style: { float: 'left' } }, React.createElement("img", { style: { maxWidth: '800px' }, src: this.props.url }), rects), React.createElement("div", { style: { float: 'left', paddingLeft: '20px' } }, React.createElement("b", null, "URL:"), " ", this.props.url, React.createElement("br", null), React.createElement("b", null, "Width:"), " ", this.props.width, React.createElement("br", null), React.createElement("b", null, "Height:"), " ", this.props.height, React.createElement("br", null), React.createElement("b", null, "Aspect:"), " ", this.props.aspect / 100.0, React.createElement("br", null), React.createElement("b", null, "Faces:"), " ", this.props.face_count, React.createElement("br", null), React.createElement("b", null, "Tags (ResNet 50):"), " ", (this.props.resnet50_tags || []).join(', '), React.createElement("br", null), React.createElement("b", null, "Tags (Google Vision):"), " ", (this.props.gv_labels || []).join(', '), React.createElement("br", null), React.createElement("b", null, "Job:"), " ", this.props.place, React.createElement("br", null), React.createElement("b", null, "Inscription (Google Vision):"), " ", (this.props.gv_inscription || []).join(', '), React.createElement("br", null), React.createElement("b", null, "Full Matching Images (Google Vision):"), hrefs(this.props.gv_full_matching_images || []), React.createElement("br", null), React.createElement("b", null, "Partial Matching Images (Google Vision):"), hrefs(this.props.gv_partial_matching_images || []), React.createElement("br", null), React.createElement("b", null, "Pages matching Images (Google Vision):"), hrefs(this.props.gv_pages_matching_images || []), React.createElement("br", null), React.createElement("b", null, "Train 1: "), React.createElement(Dropdown, { placeholder: "Window Type", search: true, selection: true, options: train1options, onChange: this.setValue('train_1') }), React.createElement("br", null), React.createElement("b", null, "Prediction 1: "), this.props.prediction_1, " ", this.props.confidence_1, "%", React.createElement("br", null), this.props.train_1, React.createElement("b", null, "Train 2: "), this.props.train_2, React.createElement(Dropdown, { placeholder: "Style", search: true, selection: true, onChange: this.setValue('train_2'), options: train2options }), React.createElement("br", null), React.createElement("b", null, "Prediction 2: "), this.props.prediction_2, " ", this.props.confidence_2, "%", React.createElement("br", null), React.createElement("b", null, "Train 3: "), this.props.train_3, React.createElement("br", null), React.createElement("b", null, "Prediction 3: "), this.props.prediction_3, " ", this.props.confidence_3, "%", React.createElement("br", null), React.createElement("b", null, "Train 4: "), this.props.train_4, React.createElement("br", null), React.createElement("b", null, "Prediction 4: "), this.props.prediction_4, " ", this.props.confidence_4, "%", React.createElement("br", null), React.createElement("b", null, "Train 5: "), this.props.train_5, React.createElement("br", null), React.createElement("b", null, "Prediction 5: "), this.props.prediction_5, " ", this.props.confidence_5, "%", React.createElement("br", null))));
};
return DocumentDetails;
}(React.Component));
var dataStore = new AppDataStore();
var DetailPageApp = (function (_super) {
__extends(DetailPageApp, _super);
function DetailPageApp() {
var _this = _super.call(this) || this;
_this.left = databind(dataStore.windows.onGet, dataStore.windows, function (talk) { return (React.createElement(DocumentDetails, __assign({}, talk))); });
_this.header = databind(dataStore.windows.onGet, dataStore.windows, function (talk) { return (React.createElement(SearchBox, { placeholder: "Search...", loading: false })); });
return _this;
}
DetailPageApp.prototype.init = function () {
dataStore.windows.doGet(this.props.id.replace(/_/g, '/'));
};
DetailPageApp.prototype.componentWillReceiveProps = function () {
this.init();
};
DetailPageApp.prototype.componentDidMount = function () {
this.init();
};
DetailPageApp.prototype.componentWillUnmount = function () {
dataStore.clearEvents();
};
DetailPageApp.prototype.render = function () {
return (React.createElement(DetailLayout, { leftComponent: this.left, rightComponent: this.right, headerComponent: this.header }));
};
return DetailPageApp;
}(React.Component));
export { DetailPageApp };
//# sourceMappingURL=DetailPage.js.map
//# sourceMappingURL=DetailPage.js.map