summaryrefslogtreecommitdiff
path: root/animism-align/frontend/common/miscellaneous.component.js
diff options
context:
space:
mode:
Diffstat (limited to 'animism-align/frontend/common/miscellaneous.component.js')
-rw-r--r--animism-align/frontend/common/miscellaneous.component.js82
1 files changed, 0 insertions, 82 deletions
diff --git a/animism-align/frontend/common/miscellaneous.component.js b/animism-align/frontend/common/miscellaneous.component.js
deleted file mode 100644
index 4eb23f1..0000000
--- a/animism-align/frontend/common/miscellaneous.component.js
+++ /dev/null
@@ -1,82 +0,0 @@
-import React, { Component } from 'react';
-import { Link } from 'react-router-dom'
-import { clamp, percent } from '../util'
-
-export const Loader = () => (
- <div>
- <div className='circular-loader color'>
- <div className="stroke">
- <div className="stroke-left"></div>
- <div className="stroke-right"></div>
- </div>
- </div>
- </div>
-)
-
-export const Swatch = ({ color }) => (
- <div
- className='swatch'
- style={{ backgroundColor: color ? 'rgb(' + color.join(',') + ')' : 'transparent' }}
- />
-)
-
-export const Dot = ({ color }) => (
- <div
- className='dot'
- style={{ backgroundColor: color }}
- />
-)
-
-export const Columns = ({ count, margin, width, object, children, className }) => {
- if (!object || !object.length) object = children
- if (!object || !object.length) return null
- margin = margin || 380
- width = width || 250
- count = count || Math.floor((window.innerWidth - margin) / width)
- let columns = []
- let len = object.length
- let j = 0
- for (let i = 0; i < count; i++) {
- let column_len = len * (i + 1) / count
- let column = []
- for (; j < column_len; j++) {
- column.push(<div key={j}>{object[j]}</div>)
- }
- columns.push(<div key={"col_" + i + "_" + j} className='column' style={{ width }}>{column}</div>)
- if (j >= len) break
- }
- return (
- <div className={'row columnCells ' + className}>
- {columns}
- </div>
- )
-}
-
-export const Statistic = ({ name, value, link }) => (
- <div className='statistic row'>
- <div className='title'>{link ? <Link to={link}>{name}</Link> : name}</div>
- <div className='int'>{value}</div>
- </div>
-)
-
-export const Detections = ({ detections, labels }) => (
- (detections || []).map(({ label, rect }, i) => (
- <div
- className='rect'
- key={i}
- style={{
- left: percent(clamp(rect.x1)),
- width: percent(clamp(rect.x2 - rect.x1, 0, Math.min(1.0, 1.0 - rect.x1))),
- top: percent(clamp(rect.y1)),
- height: percent(clamp(rect.y2 - rect.y1, 0, Math.min(1.0, 1.0 - rect.y1))),
- }}>
- {labels && <span>{label.replace(/_/g, ' ')}</span>}
- </div>
- )
-))
-
-export const Progress = ({ current, total }) => (
- <div className='progress'>
- <div className='bar' style={{ width: Math.round(100 * current / total) + '%' }} />
- </div>
-)