This repository has been archived by the owner on Jan 24, 2019. It is now read-only.
Discover View #1622
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -5,23 +5,19 @@ | |
| "main": "index.js", | ||
| "scripts": { | ||
| "start": "npm run build && npm-run-all --parallel webserver watch:**", | ||
| "build": "npm-run-all build:**", | ||
| "build:clean": "rimraf app/src/main/assets/www/ && mkdirp app/src/main/assets/www/", | ||
| "build:static": "mkdirp www_src/static/ && mkdirp app/src/main/assets/ && ncp www_src/static/ app/src/main/assets/www/", | ||
| "build:js": "webpack", | ||
| "build:css": "npm run watch:css -- --no-watch", | ||
| "build:html": "node ./npm_tasks/bin/build-html", | ||
| "test": "npm-run-all test:**", | ||
| "test:mocha": "mocha -R spec npm_tasks/tests", | ||
| "test:lint": "jsxhint --harmony --config .jshintrc \"www_src/**/*.{js,jsx}\"", | ||
| "watch:static": "watch \"npm run build:static\" www_src/static", | ||
| "watch:js": "npm run build:js -- -d --watch", | ||
| "watch:css": "autoless --source-map --autoprefix \"last 2 versions, android >= 4.2\" www_src app/src/main/assets/www", | ||
| "watch:html": "watch \"npm run build:html\" www_src/html", | ||
| "webserver": "live-server ./app/src/main/assets/www --port=4242" | ||
| }, | ||
| "repository": { | ||
|
|
@@ -64,6 +60,8 @@ | |
| "lodash.defaults": "3.1.1", | ||
| "react": "0.13.1", | ||
| "react-hammerjs": "0.2.2", | ||
| "react-imageloader": "1.2.0", | ||
| "react-loadermixin": "1.0.4", | ||
|
There was a problem hiding this comment.
There was a problem hiding this comment. Looks like a dep. bug in image-loader. Filed hzdg/react-imageloader#13 |
||
| "xhr": "2.0.1" | ||
| } | ||
| } | ||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,43 +1,43 @@ | ||
| var React = require('react/addons'); | ||
| var ImageLoader = require('react-imageloader'); | ||
|
|
||
| var api = require('../../lib/api.js'); | ||
| var render = require('../../lib/render.jsx'); | ||
| var Link = require('../../components/link/link.jsx'); | ||
|
|
||
| var Discover = React.createClass({ | ||
| mixins: [], | ||
| getInitialState: function () { | ||
| this.list = require('./mock.json'); | ||
|
|
||
| return { | ||
| list: this.list | ||
| }; | ||
| }, | ||
| render: function () { | ||
| var cards = this.state.list.map( project => { | ||
| return ( | ||
| <Link url={"/map/" + project.id} href="/pages/map" key={project.id} className="card"> | ||
| <div className="thumbnail"> | ||
| <ImageLoader src={project.thumbnail[480]}> | ||
| // @todo Show image error icon / graphic | ||
| </ImageLoader> | ||
| </div> | ||
|
|
||
| <div className="meta"> | ||
|
There was a problem hiding this comment. might be worth turning this into a There was a problem hiding this comment. might be worth creating a |
||
| <div className="title">{project.title}</div> | ||
| <div className="author">{project.author.username}</div> | ||
| </div> | ||
| </Link> | ||
| ); | ||
| }); | ||
|
|
||
| return ( | ||
| <div id="discover"> | ||
|
There was a problem hiding this comment. ideally, we don't rely on There was a problem hiding this comment. Yup! Sounds good. I was following the pattern we were using in a few other views but totally agree. |
||
| {cards} | ||
| </div> | ||
| ); | ||
| } | ||
| }); | ||
|
|
||
| render(Discover); | ||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,3 +1,46 @@ | ||
| #discover { | ||
| display: block; | ||
| position: relative; | ||
|
|
||
| width: 100%; | ||
| height: 100%; | ||
| padding: 20px 0; | ||
|
|
||
| .card { | ||
| display: block; | ||
| position: relative; | ||
|
|
||
| width: calc(100% - 10px); | ||
| margin: 0 auto 20px auto; | ||
|
|
||
| color: @slate; | ||
| text-decoration: none; | ||
| background-color: white; | ||
| box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.3); | ||
|
|
||
| .thumbnail { | ||
| padding: 6px 0 0 0; | ||
|
|
||
| img { | ||
| display: block; | ||
| position: relative; | ||
|
|
||
| width: calc(100% - 4px); | ||
| margin: 0 auto; | ||
| background: #efefef; | ||
| } | ||
| } | ||
|
|
||
| .meta { | ||
| width: calc(100% - 2px); | ||
| margin: 6px auto; | ||
| padding: 2px 0 10px 10px; | ||
| font-size: 1.2rem; | ||
| } | ||
|
|
||
| .author { | ||
| color: @blue; | ||
| font-size: 1rem; | ||
| } | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,126 @@ | ||
| [ | ||
| { | ||
| "id": 1, | ||
| "version": 1, | ||
| "title": "The Birds of the Amazon", | ||
| "featured": true, | ||
|
There was a problem hiding this comment. No description? Might be valuable information to have for the discover view. There was a problem hiding this comment. Not included in design spec. |
||
| "history": { | ||
| "created_at": "2015-04-20T16:11:13.961Z", | ||
| "updated_at": "2015-04-20T16:11:13.961Z", | ||
| "deleted_at": null | ||
| }, | ||
| "thumbnail": { | ||
| "480": "https://webmaker-app-mock.s3.amazonaws.com/tucker_000.jpg" | ||
| }, | ||
| "author": { | ||
| "id": 1234, | ||
| "username": "billmurray", | ||
| "locale": { | ||
|
There was a problem hiding this comment. this feels like being specific in a way that is going to break the moment a country stops existing. Which has kind of happend lots of times in the last 20 years. Just keeping the locale a single code string feels much safer. There was a problem hiding this comment. Not being used at the moment, but included to keep consistency with @cadecairos API design. I'll keep as to maintain some continuity but we have lots of opportunities to modify this before launch. There was a problem hiding this comment. hmm, this feels like the API design might be too specific, in that case. Worth looking at there. |
||
| "language": "en", | ||
| "country": "US" | ||
| }, | ||
| "history": { | ||
| "created_at": "2015-04-20T16:11:13.961Z", | ||
| "updated_at": "2015-04-20T16:11:13.961Z", | ||
| "deleted_at": null | ||
| }, | ||
| "permissions": { | ||
| "staff": false, | ||
| "moderator": false | ||
| } | ||
| } | ||
| }, | ||
| { | ||
| "id": 2, | ||
| "version": 1, | ||
| "title": "Something else", | ||
| "featured": true, | ||
| "history": { | ||
| "created_at": "2015-04-20T16:11:13.961Z", | ||
| "updated_at": "2015-04-20T16:11:13.961Z", | ||
| "deleted_at": null | ||
| }, | ||
| "thumbnail": { | ||
| "480": "https://webmaker-app-mock.s3.amazonaws.com/tucker_000.jpg" | ||
| }, | ||
| "author": { | ||
| "id": 1234, | ||
| "username": "billmurray", | ||
| "locale": { | ||
| "language": "en", | ||
| "country": "US" | ||
| }, | ||
| "history": { | ||
| "created_at": "2015-04-20T16:11:13.961Z", | ||
| "updated_at": "2015-04-20T16:11:13.961Z", | ||
| "deleted_at": null | ||
| }, | ||
| "permissions": { | ||
| "staff": false, | ||
| "moderator": false | ||
| } | ||
| } | ||
| }, | ||
| { | ||
| "id": 3, | ||
| "version": 1, | ||
| "title": "Something else", | ||
| "featured": true, | ||
| "history": { | ||
| "created_at": "2015-04-20T16:11:13.961Z", | ||
| "updated_at": "2015-04-20T16:11:13.961Z", | ||
| "deleted_at": null | ||
| }, | ||
| "thumbnail": { | ||
| "480": "https://webmaker-app-mock.s3.amazonaws.com/tucker_000.jpg" | ||
| }, | ||
| "author": { | ||
| "id": 1234, | ||
| "username": "billmurray", | ||
| "locale": { | ||
| "language": "en", | ||
| "country": "US" | ||
| }, | ||
| "history": { | ||
| "created_at": "2015-04-20T16:11:13.961Z", | ||
| "updated_at": "2015-04-20T16:11:13.961Z", | ||
| "deleted_at": null | ||
| }, | ||
| "permissions": { | ||
| "staff": false, | ||
| "moderator": false | ||
| } | ||
| } | ||
| }, | ||
| { | ||
| "id": 4, | ||
| "version": 1, | ||
| "title": "Something else", | ||
| "featured": true, | ||
| "history": { | ||
| "created_at": "2015-04-20T16:11:13.961Z", | ||
| "updated_at": "2015-04-20T16:11:13.961Z", | ||
| "deleted_at": null | ||
| }, | ||
| "thumbnail": { | ||
| "480": "https://webmaker-app-mock.s3.amazonaws.com/tucker_000.jpg" | ||
| }, | ||
| "author": { | ||
| "id": 1234, | ||
| "username": "billmurray", | ||
| "locale": { | ||
| "language": "en", | ||
| "country": "US" | ||
| }, | ||
| "history": { | ||
| "created_at": "2015-04-20T16:11:13.961Z", | ||
| "updated_at": "2015-04-20T16:11:13.961Z", | ||
| "deleted_at": null | ||
| }, | ||
| "permissions": { | ||
| "staff": false, | ||
| "moderator": false | ||
| } | ||
| } | ||
| } | ||
| ] | ||
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
let's also add a short section in the README.md here along the lines of "dependencies for common tasks" so people don't reinvent the wheel all the time, and have a quick place to find out what we use for which purpose
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Totally agree. 👍
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Added.