Skip to content
This repository was archived by the owner on Sep 17, 2020. It is now read-only.

Commit b2e598a

Browse files
m4rk3rm4rk3r
committed
Initial implemenatation of native app ui
- Integrate react components from new frontend - Add drag/drop file support - Work towards proxy replay
1 parent be2542f commit b2e598a

File tree

106 files changed

+15950
-3
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

106 files changed

+15950
-3
lines changed

‎.babelrc

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
{
2+
"presets": [
3+
["env", {
4+
"targets": { "node": 7 },
5+
"useBuiltIns": true
6+
}],
7+
"stage-0",
8+
"react"
9+
],
10+
"plugins": ["add-module-exports", "dynamic-import-webpack"],
11+
"env": {
12+
"production": {
13+
"presets": ["react-optimize"],
14+
"plugins": ["babel-plugin-dev-expression"]
15+
},
16+
"development": {
17+
"plugins": [
18+
"transform-class-properties",
19+
"transform-es2015-classes",
20+
]
21+
}
22+
}
23+
}

‎.gitignore

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,6 @@
1+
*.DS_Store
2+
*~
3+
14
node_modules
25
python-binaries/webrecorder
6+
dll

‎app/.eslintrc

Lines changed: 80 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,80 @@
1+
{
2+
"extends": "eslint-config-airbnb",
3+
"parser": "babel-eslint",
4+
"env": {
5+
"browser": true,
6+
"node": true,
7+
"mocha": true,
8+
},
9+
"rules": {
10+
"camelcase": 1,
11+
"max-len": [0, 800, 2],
12+
"react/no-multi-comp": 0,
13+
"import/default": 0,
14+
"import/no-duplicates": 0,
15+
"import/named": 0,
16+
"import/namespace": 0,
17+
"import/no-unresolved": 0,
18+
"import/no-named-as-default": 2,
19+
"comma-dangle": 0,
20+
"comma-spacing": 1,
21+
"indent": [2, 2, {"SwitchCase": 1}],
22+
"no-console": 0,
23+
"no-alert": 0,
24+
"global-require": 0,
25+
"import/no-extraneous-dependencies": 0,
26+
"import/extensions": 0,
27+
"react/no-unescaped-entities": 0,
28+
"react/jsx-no-target-blank": 0,
29+
"react/jsx-filename-extension": [1, { "extensions": [".js", ".jsx"] }],
30+
"react/jsx-closing-bracket-location": 0,
31+
"react/forbid-prop-types": 0,
32+
"react/prefer-stateless-function": 0,
33+
"react/prop-types": 1,
34+
"react/no-unused-prop-types": 0,
35+
"react/no-did-mount-set-state": 1,
36+
"react/require-default-props": 0,
37+
"spaced-comment": 0,
38+
"no-unused-vars": 1,
39+
"keyword-spacing": 0,
40+
"curly": 0,
41+
"arrow-body-style": 0,
42+
"semi": 1,
43+
"no-useless-escape": 0,
44+
"no-param-reassign": 1,
45+
"vars-on-top": 1,
46+
"no-shadow": 1,
47+
"class-methods-use-this": 1,
48+
"prefer-template": 1,
49+
"no-bitwise": 0,
50+
"no-plusplus": 1,
51+
"jsx-a11y/no-static-element-interactions": 1,
52+
"object-curly-spacing":1,
53+
"import/prefer-default-export": 1,
54+
"new-cap": 0,
55+
"quote-props": 1,
56+
"quotes": 1,
57+
"no-underscore-dangle": 0
58+
},
59+
"plugins": [
60+
"react", "import"
61+
],
62+
"settings": {
63+
"import/parser": "babel-eslint",
64+
"import/resolver": {
65+
"webpack": {
66+
"config": "webpack/webpack.config.eslint.js",
67+
"moduleDirectory": ["node_modules", "app"]
68+
}
69+
}
70+
},
71+
"globals": {
72+
"__DEVELOPMENT__": true,
73+
"__CLIENT__": true,
74+
"__SERVER__": true,
75+
"__PLAYER__": true,
76+
"__DEVTOOLS__": true,
77+
"socket": true,
78+
"webpackIsomorphicTools": true
79+
}
80+
}

‎app/app.global.scss

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
2+
html {
3+
font-size: 62.5%;
4+
}
5+
6+
html, body {
7+
margin: 0;
8+
padding: 0;
9+
height: 100%;
10+
}
11+
12+
#root {
13+
height: 100%;
14+
}
15+
16+
/* animations */
17+
@keyframes spin {
18+
from {transform: rotate(0deg);}
19+
to {transform: rotate(360deg);}
20+
}
21+
22+
ul {
23+
margin: 0;
24+
padding: 0;
25+
26+
li {
27+
list-style-type: none;
28+
}
29+
}

‎app/app.html

Lines changed: 46 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,46 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8">
5+
<title>webrecorder player</title>
6+
<script>
7+
(function () {
8+
if (!process.env.HOT) {
9+
const link = document.createElement('link');
10+
link.rel = 'stylesheet';
11+
link.href = './dist/style.css';
12+
// HACK: Writing the script path should be done with webpack
13+
document.getElementsByTagName('head')[0].appendChild(link);
14+
}
15+
}());
16+
</script>
17+
</head>
18+
<body>
19+
<div id="root"></div>
20+
<script>
21+
{
22+
const scripts = [];
23+
24+
// Dynamically insert the DLL script in development env in the
25+
// renderer process
26+
if (process.env.NODE_ENV === 'development') {
27+
scripts.push('../dll/renderer.dev.dll.js');
28+
}
29+
30+
// Dynamically insert the bundled app script in the renderer process
31+
const port = process.env.PORT || 1212;
32+
scripts.push(
33+
(process.env.HOT)
34+
? 'http://localhost:' + port + '/dist/renderer.dev.js'
35+
: './dist/renderer.prod.js'
36+
);
37+
38+
document.write(
39+
scripts
40+
.map(script => '<script defer src="' + script + '"><\/script>')
41+
.join('')
42+
);
43+
}
44+
</script>
45+
</body>
46+
</html>

‎app/components/CollectionDetailUI/columns.js

Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
import React from 'react';
2+
import { Link } from 'react-router';
3+
4+
import EditableString from 'components/EditableString';
5+
import TimeFormat from 'components/TimeFormat';
6+
import { capitalize, remoteBrowserMod } from 'helpers/utils';
7+
8+
9+
export function BrowserRenderer({ cellData, columnData: { browsers } }) {
10+
if (!__PLAYER__ && typeof cellData !== 'undefined') {
11+
const browserObj = browsers.getIn(['browsers', cellData]);
12+
13+
if (!browserObj) {
14+
return null;
15+
}
16+
17+
const browserName = capitalize(browserObj.get('name'));
18+
const browserVrs = browserObj.get('version');
19+
return (
20+
<span>
21+
<img src={`/api/browsers/browsers/${cellData}/icon`} alt={`Recorded with ${browserName} version ${browserVrs}`} />
22+
{ ` ${browserName} v${browserVrs}` }
23+
</span>
24+
);
25+
}
26+
return null;
27+
}
28+
29+
export function LinkRenderer({ cellData, rowData, columnData: { collection } }) {
30+
return (
31+
<Link to={`/${collection.get('user')}/${collection.get('id')}/${remoteBrowserMod(rowData.get('browser'), rowData.get('timestamp'))}/${rowData.get('url')}`}>
32+
<EditableString
33+
string={cellData || 'Untitled document'}
34+
className="edit-coll-title" />
35+
</Link>
36+
);
37+
}
38+
39+
export function TagRenderer({ cellData }) {
40+
return [
41+
<span key="a">#page</span>
42+
];
43+
}
44+
45+
export function TimestampRenderer({ cellData }) {
46+
return <TimeFormat dt={cellData} />;
47+
}

‎app/components/CollectionDetailUI/header.js

Whitespace-only changes.

0 commit comments

Comments
 (0)