solrkit
Version:
  UI Components for Solr, using TypeScript + React
198 lines • 9.21 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