From 7eb3c04ef85fa0311bdf30b24df2aba102757878 Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Tue, 19 Mar 2019 20:45:24 +0100 Subject: rebuild site --- scraper/client/search/browse.component.js | 77 --------- scraper/client/search/index.js | 17 -- scraper/client/search/panicButton.component.js | 49 ------ scraper/client/search/search.actions.js | 162 ----------------- scraper/client/search/search.container.js | 101 ----------- scraper/client/search/search.css | 230 ------------------------- scraper/client/search/search.menu.js | 96 ----------- scraper/client/search/search.meta.js | 68 -------- scraper/client/search/search.query.js | 227 ------------------------ scraper/client/search/search.reducer.js | 84 --------- scraper/client/search/search.results.js | 49 ------ scraper/client/search/search.safety.js | 17 -- 12 files changed, 1177 deletions(-) delete mode 100644 scraper/client/search/browse.component.js delete mode 100644 scraper/client/search/index.js delete mode 100644 scraper/client/search/panicButton.component.js delete mode 100644 scraper/client/search/search.actions.js delete mode 100644 scraper/client/search/search.container.js delete mode 100644 scraper/client/search/search.css delete mode 100644 scraper/client/search/search.menu.js delete mode 100644 scraper/client/search/search.meta.js delete mode 100644 scraper/client/search/search.query.js delete mode 100644 scraper/client/search/search.reducer.js delete mode 100644 scraper/client/search/search.results.js delete mode 100644 scraper/client/search/search.safety.js (limited to 'scraper/client/search') diff --git a/scraper/client/search/browse.component.js b/scraper/client/search/browse.component.js deleted file mode 100644 index e9ddb04e..00000000 --- a/scraper/client/search/browse.component.js +++ /dev/null @@ -1,77 +0,0 @@ -import React, { Component } from 'react' -import { Link, withRouter } from 'react-router-dom' -import { bindActionCreators } from 'redux' -import { connect } from 'react-redux' - -import { Loader, Keyframes, Video } from '../common' -// import { Coco } from '../metadata' -import * as searchActions from './search.actions' -import * as metadataActions from '../metadata/metadata.actions' -import SearchMeta from './search.meta' - -class Browse extends Component { - componentDidMount() { - this.browse() - } - - componentDidUpdate(prevProps) { - if (prevProps.match.params !== this.props.match.params) { - this.browse() - } - } - - browse() { - const { hash } = this.props.match.params - if (hash) { - this.props.searchActions.browse(hash) - } - if (hash) { - this.props.metadataActions.fetchMetadata(hash) - } - } - - render() { - const { browse, options } = this.props - console.log('browse', browse) - - if (!browse || browse.reset || browse.loading) { - return

Loading keyframes...

- } - return ( -
-

Video Preview

-
- ) - } -} - -const mapStateToProps = state => ({ - browse: state.search.browse, - options: state.search.options, - metadata: state.metadata, -}) - -const mapDispatchToProps = dispatch => ({ - searchActions: bindActionCreators({ ...searchActions }, dispatch), - metadataActions: bindActionCreators({ ...metadataActions }, dispatch), -}) - -export default withRouter(connect(mapStateToProps, mapDispatchToProps)(Browse)) diff --git a/scraper/client/search/index.js b/scraper/client/search/index.js deleted file mode 100644 index 99c2b74b..00000000 --- a/scraper/client/search/index.js +++ /dev/null @@ -1,17 +0,0 @@ -import Menu from './search.menu' -import Container from './search.container' -import Meta from './search.meta' -import Query from './search.query' -import Results from './search.results' -import Browse from './browse.component' - -import './search.css' - -export { - Menu, - Container, - Meta, - Query, - Results, - Browse, -} diff --git a/scraper/client/search/panicButton.component.js b/scraper/client/search/panicButton.component.js deleted file mode 100644 index a12c817b..00000000 --- a/scraper/client/search/panicButton.component.js +++ /dev/null @@ -1,49 +0,0 @@ -import React, { Component } from 'react' -import { withRouter } from 'react-router-dom' -import { bindActionCreators } from 'redux' -import { connect } from 'react-redux' - -import * as actions from './search.actions' - -class PanicButton extends Component { - constructor() { - super() - this.keydown = this.keydown.bind(this) - } - - componentDidMount() { - document.addEventListener('keydown', this.keydown) - } - - componentWillUnmount() { - document.removeEventListener('keydown', this.keydown) - } - - keydown(e) { - if (e.keyCode === 27) { - this.panic() - } - } - - panic() { - this.props.actions.panic() - this.props.history.push('/search/') - } - - render() { - return ( - - ) - } -} - -const mapStateToProps = state => ({ -}) - -const mapDispatchToProps = dispatch => ({ - actions: bindActionCreators({ panic: actions.panic }, dispatch) -}) - -export default withRouter(connect(mapStateToProps, mapDispatchToProps)(PanicButton)) diff --git a/scraper/client/search/search.actions.js b/scraper/client/search/search.actions.js deleted file mode 100644 index 95cea433..00000000 --- a/scraper/client/search/search.actions.js +++ /dev/null @@ -1,162 +0,0 @@ -// import fetchJsonp from 'fetch-jsonp' -import * as types from '../types' -// import { hashPath } from '../util' -import { store, history } from '../store' -import { post, pad, verify, preloadImage } from '../util' -import querystring from 'query-string' - -// urls - -const url = { - upload: () => process.env.API_HOST + '/search/api/upload', - search: () => process.env.API_HOST + '/search/api/fetch', - searchByVerifiedFrame: (verified, hash, frame) => process.env.API_HOST + '/search/api/search/' + verified + '/' + hash + '/' + pad(frame, 6), - searchByFrame: (hash, frame) => process.env.API_HOST + '/search/api/search/' + hash + '/' + pad(frame, 6), - browse: hash => process.env.API_HOST + '/search/api/list/' + hash, - random: () => process.env.API_HOST + '/search/api/random', - check: () => process.env.API_HOST + '/api/images/import/search', -} -export const publicUrl = { - browse: hash => '/search/browse/' + hash, - searchByVerifiedFrame: (verified, hash, frame) => '/search/keyframe/' + verify(verified) + '/' + hash + '/' + pad(frame, 6), - searchByFrame: (hash, frame) => '/search/keyframe/' + hash + '/' + pad(frame, 6), - review: () => '/search/review/' -} - -// standard loading events - -const loading = (tag, offset) => ({ - type: types.search.loading, - tag, - offset -}) -const loaded = (tag, data, offset = 0) => ({ - type: types.search.loaded, - tag, - data, - offset -}) -const error = (tag, err) => ({ - type: types.search.error, - tag, - err -}) - -// search UI functions - -export const panic = () => dispatch => { - history.push('/search/') - dispatch({ type: types.search.panic }) -} -export const updateOptions = opt => dispatch => { - dispatch({ type: types.search.update_options, opt }) -} - -// API functions - -export const upload = (file, query) => dispatch => { - const { options } = store.getState().search - const tag = 'query' - const fd = new FormData() - fd.append('query_img', file) - fd.append('limit', options.perPage) - if (!query) { - dispatch(loading(tag)) - } - post(url.upload(), fd) - .then(data => { - if (query) { - const { timing } = data.query - data.query = { - ...query, - timing, - } - let qs = {} - if (data.query.crop) { - let { x, y, w, h } = data.query.crop - qs.crop = [x, y, w, h].map(n => parseInt(n, 10)).join(',') - } - if (query.url && !query.hash) { - qs.url = query.url - } - // history.push(window.location.pathname + '#' + querystring.stringify(qs)) - // window.location.hash = querystring.stringify(qs) - } else if (data.query.url && !window.location.search.match(data.query.url)) { - history.push('/search/?url=' + data.query.url) - } - dispatch(loaded(tag, data)) - }) - .catch(err => dispatch(error(tag, err))) -} -export const searchByVerifiedFrame = (verified, hash, frame, offset = 0) => dispatch => { - const { options } = store.getState().search - const tag = 'query' - dispatch(loading(tag, offset)) - const qs = querystring.stringify({ limit: options.perPage, offset }) - preloadImage({ verified, hash, frame }) - fetch(url.searchByVerifiedFrame(verified, hash, frame) + '?' + qs, { - method: 'GET', - mode: 'cors', - }) - .then(data => data.json()) - .then(data => dispatch(loaded(tag, data, offset))) - .catch(err => dispatch(error(tag, err))) -} -export const searchByFrame = (hash, frame, offset = 0) => dispatch => { - const { options } = store.getState().search - const tag = 'query' - dispatch(loading(tag, offset)) - const qs = querystring.stringify({ limit: options.perPage, offset }) - preloadImage({ verified: false, hash, frame }) - fetch(url.searchByFrame(hash, frame) + '?' + qs, { - method: 'GET', - mode: 'cors', - }) - .then(data => data.json()) - .then(data => dispatch(loaded(tag, data, offset))) - .catch(err => dispatch(error(tag, err))) -} -export const search = (uri, offset = 0) => dispatch => { - const { options } = store.getState().search - const tag = 'query' - dispatch(loading(tag, offset)) - const qs = querystring.stringify({ url: uri, limit: options.perPage, offset }) - if (uri.indexOf('static') === 0) { - preloadImage({ uri }) - } - fetch(url.search(uri) + '?' + qs, { - method: 'GET', - mode: 'cors', - }) - .then(data => data.json()) - .then(data => dispatch(loaded(tag, data, offset))) - .catch(err => dispatch(error(tag, err))) -} -export const browse = hash => dispatch => { - const tag = 'browse' - dispatch(loading(tag)) - fetch(url[tag](hash), { - method: 'GET', - mode: 'cors', - }) - .then(data => data.json()) - .then(data => dispatch(loaded(tag, data))) - .catch(err => dispatch(error(tag, err))) -} -export const random = () => dispatch => { - const { options } = store.getState().search - const qs = querystring.stringify({ limit: options.perPage }) - const tag = 'query' - dispatch(loading(tag)) - fetch(url.random() + '?' + qs, { - method: 'GET', - mode: 'cors', - }) - .then(data => data.json()) - .then(data => { - dispatch(loaded(tag, data)) - history.push(publicUrl.searchByVerifiedFrame(data.query.verified, data.query.hash, data.query.frame)) - // window.history.pushState(null, 'VSearch: Results', publicUrl.searchByVerifiedFrame(data.query.verified, data.query.hash, data.query.frame)) - }) - .catch(err => dispatch(error(tag, err))) -} diff --git a/scraper/client/search/search.container.js b/scraper/client/search/search.container.js deleted file mode 100644 index 965d7c8e..00000000 --- a/scraper/client/search/search.container.js +++ /dev/null @@ -1,101 +0,0 @@ -import React, { Component } from 'react' -import { withRouter } from 'react-router-dom' -import { bindActionCreators } from 'redux' -import { connect } from 'react-redux' -import * as querystring from 'querystring' - -import * as searchActions from './search.actions' -import * as metadataActions from '../metadata/metadata.actions' - -import SearchQuery from './search.query' -import SearchResults from './search.results' -import SearchSafety from './search.safety' - -class SearchContainer extends Component { - componentDidMount() { - const qs = querystring.parse(this.props.location.search.substr(1)) - if (qs && qs.url) { - this.props.searchActions.search(qs.url) - } else { - this.searchByHash() - } - } - - componentDidUpdate(prevProps) { - if (prevProps.match.params !== this.props.match.params && JSON.stringify(this.props.match.params) !== JSON.stringify(prevProps.match.params)) { - this.searchByHash() - } - // const qsOld = querystring.parse(prevProps.location.search.substr(1)) - // const qsNew = querystring.parse(this.props.location.search.substr(1)) - // if (qsOld && qsNew && qsNew.url && qsNew.url !== qsOld.url) { - // this.props.actions.search(qsNew.url) - // } - } - - searchByHash(offset = 0) { - const { verified, hash, frame } = this.props.match.params - if (verified && hash && frame) { - this.props.searchActions.searchByVerifiedFrame(verified, hash, frame, offset) - } else if (hash && frame) { - this.props.searchActions.searchByFrame(hash, frame, offset) - } - if (hash && !offset) { - this.props.metadataActions.fetchMetadata(hash) - } - } - - searchByOffset() { - const offset = this.props.query.results.length - const qs = querystring.parse(this.props.location.search.substr(1)) - if (qs && qs.url) { - this.props.searchActions.search(qs.url, offset) - } - else { - this.searchByHash(offset) - } - } - - render() { - const { query, results, loadingMore } = this.props.query - const options = this.props.options - // console.log('search container', query, results, loadingMore) - let showLoadMore = true - if (!query || query.reset || query.loading || !results || !results.length) { - showLoadMore = false - } - let isWide = (results && results.length > Math.min(options.perPage, 30)) - let isMoreLoaded = (results && results.length > options.perPage) - return ( -
- - - {showLoadMore - ? !loadingMore - ? - :
{'Loading more results...'}
- :
-
- } - {!isMoreLoaded && } -
- ) - } -} - -const mapStateToProps = state => ({ - query: state.search.query, - options: state.search.options, - metadata: state.metadata, -}) - -const mapDispatchToProps = dispatch => ({ - searchActions: bindActionCreators({ ...searchActions }, dispatch), - metadataActions: bindActionCreators({ ...metadataActions }, dispatch), -}) - -export default withRouter(connect(mapStateToProps, mapDispatchToProps)(SearchContainer)) diff --git a/scraper/client/search/search.css b/scraper/client/search/search.css deleted file mode 100644 index 280e53fe..00000000 --- a/scraper/client/search/search.css +++ /dev/null @@ -1,230 +0,0 @@ -.btn span { - font-size: large; -} -.row { - display: flex; - flex-direction: row; -} -.column { - display: flex; - flex-direction: column; -} - -.searchContainer h3 { - padding: 0; - margin-top: 0; - margin-bottom: 5px; - margin-left: 3px; -} -.searchContainer h4 { - margin-left: 0; - width: 100%; -} -.searchContainer .subtitle { - display: block; - margin-left: 3px; - margin-bottom: 10px; -} -.searchForm { - display: flex; - justify-content: space-between; - align-items: center; - width: 100%; - padding: 20px; - background: #eee; -} -.searchForm .row { - align-items: center; -} - -.searchMeta { - display: flex; - flex-direction: column; - font-size: 14px; - line-height: 18px; - padding: 0; -} -.searchMeta span { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - max-width: calc(100vw - 23px - 640px - 30px); -} - -.keyframe .thumbnail { - position: relative; - cursor: pointer; -} -.keyframe .searchButtons { - position: absolute; - bottom: 0; left: 0; - padding: 0 5px 15px 5px; - width: 100%; - text-align: center; - opacity: 0; - transition: all 0.2s; -} -.desktop .keyframe .thumbnail:hover .searchButtons, -.mobile .keyframe .searchButtons { - opacity: 1; -} -.keyframe .searchButtons .btn { - margin-right: 0; - height: auto; - padding: 0.15rem 0.3rem; -} -.keyframe a { - text-decoration: none; -} - -.body > div.searchForm { - padding-bottom: 20px; -} -.upload { - position: relative; - cursor: pointer; -} -.upload .btn { - pointer-events: none; - cursor: pointer; -} -.upload input { - position: absolute; - top: 0; left: 0; - width: 100%; height: 100%; - opacity: 0; - cursor: pointer; -} - -.reviewSaved, -.browseComponent, -.searchQuery { - margin: 0px 10px; - padding: 13px; -} -.searchQuery img { - cursor: crosshair; - user-select: none; - max-width: 640px; - max-height: 480px; -} -.searchContainer .searchQuery h3 { - margin-left: 0; - margin-bottom: 10px; -} - -.searchBox { - min-width: 640px; - margin: 0 10px 0 0; - background-color: #eee; - position: relative; -} -.searchBox img { - display: block; -} -.searchBox .box { - position: absolute; - cursor: crosshair; - border: 1px solid #11f; - background-color: rgba(16,16,255,0.1); -} - -.searchResults { - margin: 0 20px 20px 20px; - display: flex; - flex-direction: row; - flex-wrap: wrap; -} -.searchResultsHeading { - width: 100%; -} -.searchOptions .row { - font-size: 12px; - margin-left: 10px; -} -.searchOptions input { - font-size: 12px; - margin-right: 5px; - font-family: Helvetica, sans-serif; -} -.searchOptions input[type=text], -.searchOptions input[type=number] { - width: 30px; - text-align: right; -} -.keyframeGroup { - max-width: 650px; - display: flex; - flex-direction: row; - flex-wrap: wrap; - align-items: flex-start; - align-content: flex-start; - justify-content: flex-start; -} -.keyframeGroup h4 a { - color: #888; - text-decoration: none -} -.keyframeGroup h4 a:hover { - text-decoration: underline -} - -/* load more button that gets bigger */ - -.loadMore { - width: 400px; - margin: 20px; - height: 40px; - transition: all; -} -.loadMore.wide { - width: calc(100% - 40px); - margin: 20px; - height: 100px; -} -.loadingMore { - margin: 20px 20px 200px 20px; -} - -/* health and safety warning */ - -.safety div { - display: inline-block; - margin: 20px 20px; - padding: 10px; - background: #fff8e8; - color: #111; - box-shadow: 0 1px 2px rgba(0,0,0,0.2); - font-size: 13px; - line-height: 1.4; -} -.safety ul { - margin: 0; - padding: 0 21px; -} -.safety li { - padding: 1px 0 0 0; -} -.safety h4 { - margin-top: 5px; -} - -/* browser section */ - -.browseComponent h3 { - margin-bottom: 10px; -} -.browseComponent .buttons { - margin-top: 10px; -} - -/* disable twiddle button on input[type=number] */ - -input::-webkit-outer-spin-button, -input::-webkit-inner-spin-button { - -webkit-appearance: none; - margin: 0; -} -input[type='number'] { - -moz-appearance:textfield; -} diff --git a/scraper/client/search/search.menu.js b/scraper/client/search/search.menu.js deleted file mode 100644 index f5f9423e..00000000 --- a/scraper/client/search/search.menu.js +++ /dev/null @@ -1,96 +0,0 @@ -import React, { Component } from 'react' -import { Link } from 'react-router-dom' -import { bindActionCreators } from 'redux' -import { connect } from 'react-redux' - -import * as actions from './search.actions' -import PanicButton from './panicButton.component' - -class SearchMenu extends Component { - upload(e) { - const files = e.dataTransfer ? e.dataTransfer.files : e.target.files - let i - let file - for (i = 0; i < files.length; i++) { - file = files[i] - if (file && file.type.match('image.*')) break - } - if (!file) return - this.props.actions.upload(file) - } - - random() { - this.props.actions.random() - } - - render() { - const { savedCount, options } = this.props - return ( -
-
-
- - -
- - - - - -
- -
- - - -
-
- ) - } -} - -const mapStateToProps = state => ({ - options: state.search.options, - savedCount: state.review.count, -}) - -const mapDispatchToProps = dispatch => ({ - actions: bindActionCreators({ ...actions }, dispatch) -}) - -export default connect(mapStateToProps, mapDispatchToProps)(SearchMenu) diff --git a/scraper/client/search/search.meta.js b/scraper/client/search/search.meta.js deleted file mode 100644 index b4eaeaad..00000000 --- a/scraper/client/search/search.meta.js +++ /dev/null @@ -1,68 +0,0 @@ -import React, { Component } from 'react' -import { Link } from 'react-router-dom' -import { bindActionCreators } from 'redux' -import { connect } from 'react-redux' -import { format } from 'date-fns' - -import { timestamp } from '../util' -import * as searchActions from './search.actions' - -class SearchMeta extends Component { - render() { - const { query, metadata, sugarcube } = this.props - if (!query || !metadata || !metadata.mediainfo || metadata.metadata === 'loading') { - return
- } - const sugarcubeId = metadata.mediainfo.sugarcube_id - const { video } = metadata.mediainfo.metadata.mediainfo - const { x, y, w, h } = query.crop || {} - return ( -
- {'verified' in query && - - {query.verified ? 'verified' : 'unverified'} - - } - {query.hash && - - {'sha256: '} - {query.hash} - - } - {query.frame && - - {'Frame: '} - {timestamp(query.frame, video.frame_rate)} - {' / '} - {timestamp(video.duration / 1000, 1)} - - } - {query.crop && - - {'Crop: '}{parseInt(w, 10) + 'x' + parseInt(h, 10) + ' @ (' + parseInt(x, 10) + ', ' + parseInt(y, 10) + ')'} - - } - {!!(video && video.encoded_date) && - - {'Date: '}{format(new Date(video.encoded_date), "DD-MMM-YYYY")} - - } - {!!(sugarcube && sugarcubeId) && - - sugarcube: {sugarcubeId} - - } -
- ) - } -} - -const mapStateToProps = state => ({ - metadata: state.metadata, -}) - -const mapDispatchToProps = dispatch => ({ - actions: bindActionCreators({ ...searchActions }, dispatch), -}) - -export default connect(mapStateToProps, mapDispatchToProps)(SearchMeta) diff --git a/scraper/client/search/search.query.js b/scraper/client/search/search.query.js deleted file mode 100644 index 276f1943..00000000 --- a/scraper/client/search/search.query.js +++ /dev/null @@ -1,227 +0,0 @@ -import React, { Component } from 'react' -import { Link } from 'react-router-dom' -import { bindActionCreators } from 'redux' -import { connect } from 'react-redux' -import toBlob from 'data-uri-to-blob' - -import { clamp, px } from '../util' -import { Loader } from '../common' - -import * as searchActions from './search.actions' -import SearchMeta from './search.meta' - -const defaultState = { - dragging: false, - draggingBox: false, - bounds: null, - mouseX: 0, - mouseY: 0, - box: { - x: 0, - y: 0, - w: 0, - h: 0, - } -} - -class SearchQuery extends Component { - state = { - ...defaultState - } - - constructor() { - super() - this.handleMouseDown = this.handleMouseDown.bind(this) - this.handleMouseDownOnBox = this.handleMouseDownOnBox.bind(this) - this.handleMouseMove = this.handleMouseMove.bind(this) - this.handleMouseUp = this.handleMouseUp.bind(this) - } - - componentDidMount() { - document.body.addEventListener('mousemove', this.handleMouseMove) - document.body.addEventListener('mouseup', this.handleMouseUp) - } - - componentDidUpdate(prevProps) { - // console.log(this.props.query.query, !prevProps.query.query) - if (this.state.bounds && (!this.props.query.query || !prevProps.query.query || this.props.query.query.url !== prevProps.query.query.url)) { - this.setState({ ...defaultState }) - } - } - - componentWillUnmount() { - document.body.removeEventListener('mousemove', this.handleMouseMove) - document.body.removeEventListener('mouseup', this.handleMouseUp) - } - - handleMouseDown(e) { - e.preventDefault() - const bounds = this.imgRef.getBoundingClientRect() - const mouseX = e.pageX - const mouseY = e.pageY - const x = mouseX - bounds.left - const y = mouseY - bounds.top - const w = 1 - const h = 1 - this.setState({ - dragging: true, - bounds, - mouseX, - mouseY, - box: { - x, y, w, h, - } - }) - } - - handleMouseDownOnBox(e) { - const bounds = this.imgRef.getBoundingClientRect() - const mouseX = e.pageX - const mouseY = e.pageY - this.setState({ - draggingBox: true, - bounds, - mouseX, - mouseY, - initialBox: { - ...this.state.box - }, - box: { - ...this.state.box - } - }) - } - - handleMouseMove(e) { - const { - dragging, draggingBox, - bounds, mouseX, mouseY, initialBox, box - } = this.state - if (dragging) { - e.preventDefault() - let { x, y } = box - let w = clamp(e.pageX - mouseX, 0, bounds.width - x) - let h = clamp(e.pageY - mouseY, 0, bounds.height - y) - this.setState({ - box: { - x, y, w, h, - } - }) - } else if (draggingBox) { - e.preventDefault() - let { x, y, w, h } = initialBox - let dx = (e.pageX - mouseX) - let dy = (e.pageY - mouseY) - this.setState({ - box: { - x: clamp(x + dx, 0, bounds.width - w), - y: clamp(y + dy, 0, bounds.height - h), - w, - h, - } - }) - } - } - - handleMouseUp(e) { - const { actions } = this.props - const { dragging, draggingBox, bounds, box } = this.state - if (!dragging && !draggingBox) return - e.preventDefault() - const { x, y, w, h } = box - // console.log(x, y, w, h) - const img = this.imgRef - const canvas = document.createElement('canvas') - const ctx = canvas.getContext('2d') - const ratio = img.naturalWidth / bounds.width - canvas.width = w * ratio - canvas.height = h * ratio - if (w < 10 || h < 10) { - this.setState({ dragging: false, draggingBox: false, box: { x: 0, y: 0, w: 0, h: 0 } }) - return - } - this.setState({ dragging: false, draggingBox: false }) - // query_div.appendChild(canvas) - const newImage = new Image() - let loaded = false - newImage.onload = () => { - if (loaded) return - loaded = true - newImage.onload = null - ctx.drawImage( - newImage, - Math.round(x * ratio), - Math.round(y * ratio), - Math.round(w * ratio), - Math.round(h * ratio), - 0, 0, canvas.width, canvas.height - ) - const blob = toBlob(canvas.toDataURL('image/jpeg', 0.9)) - actions.upload(blob, { - ...this.props.query.query, - crop: { - x, y, w, h, - } - }) - } - // console.log(img.src) - newImage.crossOrigin = 'anonymous' - newImage.src = img.src - if (newImage.complete) { - newImage.onload() - } - } - - render() { - const { query } = this.props.query - const { box } = this.state - const { x, y, w, h } = box - if (!query) return null - if (query.loading) { - return

Loading results...

- } - let { url } = query - if (url && url.indexOf('static') === 0) { - url = '/search/' + url - } - return ( -
-
- this.imgRef = ref} - onMouseDown={this.handleMouseDown} - crossOrigin='anonymous' - /> - {!!w && -
- } -
-
-

Your Query

- -
-
- ) - } -} - -const mapStateToProps = state => ({ - query: state.search.query, - options: state.search.options, -}) - -const mapDispatchToProps = dispatch => ({ - actions: bindActionCreators({ ...searchActions }, dispatch), -}) - -export default connect(mapStateToProps, mapDispatchToProps)(SearchQuery) diff --git a/scraper/client/search/search.reducer.js b/scraper/client/search/search.reducer.js deleted file mode 100644 index b9de60bd..00000000 --- a/scraper/client/search/search.reducer.js +++ /dev/null @@ -1,84 +0,0 @@ -import * as types from '../types' -import session from '../session' - -const initialState = () => ({ - query: { reset: true }, - browse: { reset: true }, - options: { - thumbnailSize: session('thumbnailSize') || 'th', - perPage: parseInt(session('perPage'), 10) || 50, - groupByHash: session('groupByHash'), - } -}) - -const loadingState = { - query: { - query: { loading: true }, - results: [] - }, - loading: { - loading: true - } -} - -export default function searchReducer(state = initialState(), action) { - // console.log(action.type, action) - switch (action.type) { - case types.search.loading: - if (action.tag === 'query' && action.offset) { - return { - ...state, - query: { - ...state.query, - loadingMore: true, - } - } - } - return { - ...state, - [action.tag]: loadingState[action.tag] || loadingState.loading, - } - - case types.search.loaded: - if (action.tag === 'query' && action.offset) { - return { - ...state, - query: { - query: action.data.query, - results: [ - ...state.query.results, - ...action.data.results, - ], - loadingMore: false, - } - } - } - return { - ...state, - [action.tag]: action.data, - } - - case types.search.error: - return { - ...state, - [action.tag]: { error: action.err }, - } - - case types.search.panic: - return { - ...initialState(), - } - - case types.search.update_options: - session.setAll(action.opt) - return { - ...state, - options: { - ...action.opt, - } - } - - default: - return state - } -} diff --git a/scraper/client/search/search.results.js b/scraper/client/search/search.results.js deleted file mode 100644 index 8b9e0c5e..00000000 --- a/scraper/client/search/search.results.js +++ /dev/null @@ -1,49 +0,0 @@ -import React, { Component } from 'react' -import { Link, withRouter } from 'react-router-dom' -import { bindActionCreators } from 'redux' -import { connect } from 'react-redux' -import * as querystring from 'querystring' - -import { Keyframes } from '../common' -import * as searchActions from './search.actions' - -function SearchResults({ query, results, options }) { - if (!query || query.reset || query.loading || !results) { - return
- } - if (!query.loading && !results.length) { - return

No results

- } - return ( -
-
-
-

Search Results

- - {'Searched 10,523,176 frames from 576,234 videos (took '}{query.timing.toFixed(2)}{' ms)'} - -
-
- -
- ) -} - -const mapStateToProps = state => ({ - query: state.search.query.query, - results: state.search.query.results, - options: state.search.options, -}) - -const mapDispatchToProps = dispatch => ({ - searchActions: bindActionCreators({ ...searchActions }, dispatch), -}) - -export default withRouter(connect(mapStateToProps, mapDispatchToProps)(SearchResults)) diff --git a/scraper/client/search/search.safety.js b/scraper/client/search/search.safety.js deleted file mode 100644 index b4f92664..00000000 --- a/scraper/client/search/search.safety.js +++ /dev/null @@ -1,17 +0,0 @@ -import React from 'react' - -export default function SearchWarning() { - return ( -
-
-

Safety Tips

-
    -
  • Look away if you see something traumatic
    • -
  • Hit ESC to activate panic mode (hides all images)
    • -
  • Use thumbnails to reduce details
    • -
  • Take breaks and refresh yourself with positive imagery
    • -
-
-
- ) -} -- cgit v1.2.3-70-g09d2