diff --git a/frontend/comp/ImageWall.jsx b/frontend/comp/ImageWall.jsx
index 0e7d5f9..beb545a 100644
--- a/frontend/comp/ImageWall.jsx
+++ b/frontend/comp/ImageWall.jsx
@@ -1,8 +1,21 @@
import React from 'react';
+import classnames from 'classnames';
+const blockstack = require( 'blockstack' );
class OneImage extends React.Component {
-
+
+ constructor() {
+ super();
+ this.state = { imageData: null };
+ }
+
+ componentWillMount() {
+ blockstack.getFile(this.props.path, { username: this.props.username }).then((imageData) => {
+ this.setState({ imageData });
+ })
+ }
+
render() {
return (
- { this.props.images.map((image, index) => {
- return (
);
+ const style = this.props.show ? {} : { display: 'None'};
+ return (
+ { this.props.imageInfos.map((imageInfo, index) => {
+ return ();
})}
)
}
-}
\ No newline at end of file
+}
diff --git a/frontend/css/main.scss b/frontend/css/main.scss
index 87648c8..6447d55 100644
--- a/frontend/css/main.scss
+++ b/frontend/css/main.scss
@@ -30,3 +30,8 @@ nav.navbar {
display: flex;
}
}
+
+.image.loading img {
+ width: auto;
+ margin: 1em auto;
+}
diff --git a/frontend/img/loading.gif b/frontend/img/loading.gif
new file mode 100644
index 0000000..0424aa4
Binary files /dev/null and b/frontend/img/loading.gif differ
diff --git a/frontend/index.jsx b/frontend/index.jsx
index 6ff0df7..2a73bef 100644
--- a/frontend/index.jsx
+++ b/frontend/index.jsx
@@ -73,18 +73,9 @@ class App extends React.Component {
this.setState({index: indexJson});
}
})
- .then(() => {
- let promises = this.state.index.images.map((image) => {
- return this.fetchFile(image.path)
- })
- return Promise.all(promises)
- })
- .then((images) => {
- this.setState({ images: images })
- })
- .catch((e) => {
- console.error(e)
- })
+ .catch((e) => {
+ console.error(e)
+ })
}
loadAESKey() {
@@ -195,9 +186,7 @@ class App extends React.Component {
console.log('Subscribers indexData is', indexData);
data.images.forEach((indexEntry) => {
if (!this.subscriberImageLoaded({...indexEntry, username})) {
- blockstack.getFile(indexEntry.path, {username}).then((imageData) => {
- this.updateFeed({path: indexEntry.path, username: username, image: imageData, created: indexEntry.created});
- })
+ this.updateFeed({path: indexEntry.path, username: username, created: indexEntry.created});
}
})
}).catch(err => {
@@ -245,7 +234,7 @@ class App extends React.Component {
-
+
-
@@ -262,25 +251,21 @@ class App extends React.Component {
- { this.state.tab === 'my' ?
-
-
-
:
- imageData.image)} />
+
+
- }
-
+
Start again with a fresh wall
-
+
{ this.state.loggedIn ? : '' }
-
+
Made with 💙 and 🍕 in Berlin.
Thanks to
blockstack!
-
-
diff --git a/package-lock.json b/package-lock.json
index 1a42918..b280845 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1793,6 +1793,11 @@
}
}
},
+ "classnames": {
+ "version": "2.2.5",
+ "resolved": "https://registry.npmjs.org/classnames/-/classnames-2.2.5.tgz",
+ "integrity": "sha1-+zgB1FNGdknvNgPH1hoCvRKb3m0="
+ },
"clean-css": {
"version": "4.1.9",
"resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.1.9.tgz",
diff --git a/package.json b/package.json
index 5e30847..a7a7bfc 100644
--- a/package.json
+++ b/package.json
@@ -25,6 +25,7 @@
"blockstack": "^0.15.1",
"bulma": "^0.6.2",
"cash-dom": "^1.3.5",
+ "classnames": "^2.2.5",
"copy-webpack-plugin": "^4.5.0",
"handlebars": "^4.0.10",
"handlebars-template-loader": "^0.8.0",