forked from prehistoric-systems/comixify
Add placeholder description, API description, acknowledgements
This commit is contained in:
Adam Svystun
parent
4a16d2f278
commit
92aad16b85
6 changed files with 97 additions and 15 deletions
|
|
@ -5,9 +5,11 @@ import Dropzone from "react-dropzone";
|
|||
import { BarLoader } from "react-spinners";
|
||||
import { css } from "react-emotion";
|
||||
|
||||
const COMIXIFY_API = "/comixify/";
|
||||
const MAX_FILE_SIZE = 50000000;
|
||||
const PERMITTED_VIDEO_EXTENSIONS = "video/*";
|
||||
import {
|
||||
COMIXIFY_API,
|
||||
MAX_FILE_SIZE,
|
||||
PERMITTED_VIDEO_EXTENSIONS
|
||||
} from "./constants";
|
||||
|
||||
class App extends React.Component {
|
||||
static appStates = {
|
||||
|
|
@ -83,8 +85,7 @@ class App extends React.Component {
|
|||
App.appStates.FINISHED
|
||||
].includes(state);
|
||||
return (
|
||||
<div className="wrap">
|
||||
<h1>Comixify</h1>
|
||||
<div>
|
||||
{state === App.appStates.FINISHED && [
|
||||
<img key="1" src={result_comics} />,
|
||||
<p key="2">Go again:</p>
|
||||
|
|
@ -122,4 +123,4 @@ class App extends React.Component {
|
|||
}
|
||||
}
|
||||
|
||||
ReactDOM.render(<App />, document.getElementById("root"));
|
||||
ReactDOM.render(<App />, document.getElementById("demo"));
|
||||
|
|
|
|||
3
frontend/client/constants.js
Normal file
3
frontend/client/constants.js
Normal file
|
|
@ -0,0 +1,3 @@
|
|||
export const COMIXIFY_API = "/comixify/";
|
||||
export const MAX_FILE_SIZE = 50000000;
|
||||
export const PERMITTED_VIDEO_EXTENSIONS = "video/*";
|
||||
|
|
@ -10,14 +10,25 @@ body {
|
|||
}
|
||||
|
||||
.wrap {
|
||||
padding: 1rem;
|
||||
margin: 2rem auto 0 auto;
|
||||
max-width: 700px;
|
||||
background: white;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.section {
|
||||
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04);
|
||||
border: 1px solid rgba(0, 0, 0, 0.09);
|
||||
border-radius: 3px;
|
||||
box-sizing: border-box;
|
||||
background: white;
|
||||
margin-bottom: 1rem;
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
.authors {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
max-width: 500px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
img {
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -9,7 +9,76 @@
|
|||
</head>
|
||||
<body>
|
||||
|
||||
<div id="root"></div>
|
||||
|
||||
<div class="wrap">
|
||||
<div class="section">
|
||||
<h1>Comixify</h1>
|
||||
<div class="authors">
|
||||
<div>
|
||||
Author 1
|
||||
</div>
|
||||
<div>
|
||||
Author 2
|
||||
</div>
|
||||
<div>
|
||||
Author 3
|
||||
</div>
|
||||
<div>
|
||||
Author 4
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<h3>Abstract</h3>
|
||||
<div>
|
||||
Lorem ipsum eiusmod esse laboris tempor laboris aliquip laborum anim enim reprehenderit consequat sed mollit eiusmod dolore qui duis exercitation adipisicing exercitation in. Sint in occaecat ut incididunt eiusmod consectetur sint quis dolore nostrud laboris sit ut in aute. Ex non dolore ut ullamco ut ea ad dolore. Lorem ipsum cupidatat occaecat veniam consectetur sunt in id incididunt esse. Elit non deserunt laborum anim dolor ut cillum reprehenderit anim veniam incididunt ea aute commodo in dolor. Elit esse nisi anim duis sunt tempor pariatur anim et laborum laborum aute in excepteur cupidatat duis veniam. Voluptate labore ad consectetur ut amet dolor nisi eiusmod consectetur sit in. Laborum in excepteur dolore dolore nulla mollit cillum occaecat ut pariatur non.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section">
|
||||
<h3>Demo</h3>
|
||||
<div id="demo"></div>
|
||||
</div>
|
||||
<div class="section">
|
||||
<h3>API</h3>
|
||||
<div>
|
||||
<h4>Request:</h4>
|
||||
<p>
|
||||
<i>Path:</i>
|
||||
<a href="http://comixify.ii.pw.edu.pl/comixify/">http://comixify.ii.pw.edu.pl/comixify/</a>
|
||||
</p>
|
||||
<p><i>Method:</i> <strong>POST</strong></p>
|
||||
<p><i>Data:</i>
|
||||
<br>
|
||||
<code>
|
||||
{
|
||||
<br>
|
||||
    file: video/mp4
|
||||
<br>
|
||||
}
|
||||
</code>
|
||||
</p>
|
||||
|
||||
<i>* Max size of video is 50 MB</i>
|
||||
|
||||
<h4>Respose:</h4>
|
||||
<code>
|
||||
{
|
||||
<br>
|
||||
    status: string,<br>
|
||||
    comic: string
|
||||
<br>
|
||||
}
|
||||
</code>
|
||||
<p>comic - url to result comics</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section">
|
||||
<h3>Acknowledgements</h3>
|
||||
<div>
|
||||
We would like to thank Google for giving us free credits for Google Cloud.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script type="text/javascript" src="{% static 'frontend/js/app.client.js' %}"></script>
|
||||
|
||||
</body>
|
||||
|
|
|
|||
|
|
@ -6,10 +6,8 @@
|
|||
"scripts": {
|
||||
"test": "echo \"Error: no test specified\" && exit 1",
|
||||
"build": "webpack --config ./frontend/client/webpack.config.js",
|
||||
"build:watch":
|
||||
"webpack --config ./frontend/client/webpack.config.js --watch",
|
||||
"build:prod":
|
||||
"NODE_ENV=production webpack --config ./frontend/client/webpack.config.js"
|
||||
"build:watch": "webpack --config ./frontend/client/webpack.config.js --watch",
|
||||
"build:prod": "NODE_ENV=production webpack --config ./frontend/client/webpack.config.js"
|
||||
},
|
||||
"repository": {
|
||||
"type": "git",
|
||||
|
|
|
|||
Loading…
Reference in a new issue