1
0
mirror of https://github.com/ascribe/onion.git synced 2024-11-15 01:25:17 +01:00
This commit is contained in:
ddejongh 2015-05-26 13:48:46 +02:00
parent 497e43005e
commit bcf8756cd3
7 changed files with 43 additions and 43 deletions

View File

@ -1,18 +1,18 @@
import alt from '../alt'; import alt from '../alt';
import PieceFetcher from '../fetchers/piece_fetcher'; import EditionFetcher from '../fetchers/edition_fetcher';
class PieceActions { class EditionActions {
constructor() { constructor() {
this.generateActions( this.generateActions(
'updatePiece' 'updateEdition'
); );
} }
fetchOne(pieceId) { fetchOne(editionId) {
PieceFetcher.fetchOne(pieceId) EditionFetcher.fetchOne(editionId)
.then((res) => { .then((res) => {
this.actions.updatePiece(res.piece); this.actions.updateEdition(res.edition);
}) })
.catch((err) => { .catch((err) => {
console.log(err); console.log(err);
@ -20,4 +20,4 @@ class PieceActions {
} }
} }
export default alt.createActions(PieceActions); export default alt.createActions(EditionActions);

View File

@ -4,7 +4,7 @@ import ImageViewer from './ascribe_media/image_viewer';
/** /**
* This is the component that implements display-specific functionality * This is the component that implements display-specific functionality
*/ */
let Piece = React.createClass({ let Edition = React.createClass({
//propTypes: { //propTypes: {
// title: React.PropTypes.string.isRequired // title: React.PropTypes.string.isRequired
//}, //},
@ -13,18 +13,18 @@ let Piece = React.createClass({
return ( return (
<div> <div>
<div className="col-md-7"> <div className="col-md-7">
<ImageViewer thumbnail={this.props.piece.thumbnail}/> <ImageViewer thumbnail={this.props.edition.thumbnail}/>
</div> </div>
<div className="col-md-5"> <div className="col-md-5">
<PieceHeader piece={this.props.piece}/> <EditionHeader piece={this.props.edition}/>
<PieceEdition piece={this.props.piece}/> <EditionDetails piece={this.props.edition}/>
</div> </div>
</div> </div>
); );
} }
}); });
let PieceHeader = React.createClass({ let EditionHeader = React.createClass({
//propTypes: { //propTypes: {
// title: React.PropTypes.string.isRequired // title: React.PropTypes.string.isRequired
//}, //},
@ -38,7 +38,7 @@ let PieceHeader = React.createClass({
<div>TITLE:</div> <div>TITLE:</div>
</div> </div>
<div className="col-md-10 col-xs-height col-bottom"> <div className="col-md-10 col-xs-height col-bottom">
<div className="ascribe-detail-title">{this.props.piece.title}</div> <div className="ascribe-detail-title">{this.props.edition.title}</div>
</div> </div>
</div> </div>
</div> </div>
@ -47,7 +47,7 @@ let PieceHeader = React.createClass({
<div>BY:</div> <div>BY:</div>
</div> </div>
<div className="col-md-10"> <div className="col-md-10">
<div>{this.props.piece.artist_name}</div> <div>{this.props.edition.artist_name}</div>
</div> </div>
</div> </div>
<div className="row"> <div className="row">
@ -55,7 +55,7 @@ let PieceHeader = React.createClass({
<div>DATE:</div> <div>DATE:</div>
</div> </div>
<div className="col-md-10"> <div className="col-md-10">
<div>{ this.props.piece.date_created.slice(0,4) }</div> <div>{ this.props.edition.date_created.slice(0,4) }</div>
</div> </div>
</div> </div>
<hr/> <hr/>
@ -64,7 +64,7 @@ let PieceHeader = React.createClass({
} }
}); });
let PieceEdition = React.createClass({ let EditionDetails = React.createClass({
//propTypes: { //propTypes: {
// title: React.PropTypes.string.isRequired // title: React.PropTypes.string.isRequired
//}, //},
@ -77,7 +77,7 @@ let PieceEdition = React.createClass({
<div>EDITION:</div> <div>EDITION:</div>
</div> </div>
<div className="col-md-10"> <div className="col-md-10">
<div>{ this.props.piece.edition_number } of {this.props.piece.num_editions}</div> <div>{ this.props.edition.edition_number } of {this.props.edition.num_editions}</div>
</div> </div>
</div> </div>
<div className="row"> <div className="row">
@ -85,7 +85,7 @@ let PieceEdition = React.createClass({
<div>ID:</div> <div>ID:</div>
</div> </div>
<div className="col-md-10"> <div className="col-md-10">
<div>{ this.props.piece.bitcoin_id }</div> <div>{ this.props.edition.bitcoin_id }</div>
</div> </div>
</div> </div>
<div className="row"> <div className="row">
@ -93,7 +93,7 @@ let PieceEdition = React.createClass({
<div>OWNER:</div> <div>OWNER:</div>
</div> </div>
<div className="col-md-10"> <div className="col-md-10">
<div>{ this.props.piece.owner }</div> <div>{ this.props.edition.owner }</div>
</div> </div>
</div> </div>
<hr/> <hr/>
@ -103,4 +103,4 @@ let PieceEdition = React.createClass({
}); });
export default Piece; export default Edition;

View File

@ -1,17 +1,17 @@
import React from 'react'; import React from 'react';
import PieceActions from '../actions/piece_actions'; import EditionActions from '../actions/edition_actions';
import PieceStore from '../stores/piece_store'; import EditionStore from '../stores/edition_store';
import Piece from './piece'; import Edition from './edition';
/** /**
* This is the component that implements resource/data specific functionality * This is the component that implements resource/data specific functionality
*/ */
let PieceContainer = React.createClass({ let EditionContainer = React.createClass({
getInitialState() { getInitialState() {
return PieceStore.getState(); return EditionStore.getState();
}, },
onChange(state) { onChange(state) {
@ -19,19 +19,19 @@ let PieceContainer = React.createClass({
}, },
componentDidMount() { componentDidMount() {
PieceActions.fetchOne(this.props.params.pieceId); EditionActions.fetchOne(this.props.params.editionId);
PieceStore.listen(this.onChange); EditionStore.listen(this.onChange);
}, },
componentDidUnmount() { componentDidUnmount() {
PieceStore.unlisten(this.onChange); EditionStore.unlisten(this.onChange);
}, },
render() { render() {
if('title' in this.state.piece) { if('title' in this.state.edition) {
return ( return (
<Piece piece={this.state.piece}></Piece> <Edition edition={this.state.edition}></Edition>
); );
} else { } else {
return ( return (
@ -43,4 +43,4 @@ let PieceContainer = React.createClass({
} }
}); });
export default PieceContainer; export default EditionContainer;

View File

@ -4,7 +4,7 @@ import AppConstants from '../constants/application_constants';
import FetchApiUtils from '../utils/fetch_api_utils'; import FetchApiUtils from '../utils/fetch_api_utils';
let PieceFetcher = { let EditionFetcher = {
/** /**
* Fetch one user from the API. * Fetch one user from the API.
* If no arg is supplied, load the current user * If no arg is supplied, load the current user
@ -19,4 +19,4 @@ let PieceFetcher = {
} }
}; };
export default PieceFetcher; export default EditionFetcher;

View File

@ -11,7 +11,7 @@ let PieceFetcher = {
* *
*/ */
fetchOne(pieceId) { fetchOne(pieceId) {
return fetch(AppConstants.baseUrl + 'editions/' + pieceId + '/', { return fetch(AppConstants.baseUrl + 'pieces/' + pieceId + '/', {
headers: { headers: {
'Authorization': 'Basic ' + AppConstants.debugCredentialBase64 'Authorization': 'Basic ' + AppConstants.debugCredentialBase64
} }

View File

@ -3,7 +3,7 @@ import Router from 'react-router';
import AscribeApp from './components/ascribe_app'; import AscribeApp from './components/ascribe_app';
import PieceList from './components/piece_list'; import PieceList from './components/piece_list';
import PieceContainer from './components/piece_container'; import EditionContainer from './components/edition_container';
let Route = Router.Route; let Route = Router.Route;
@ -13,7 +13,7 @@ let routes = (
<Route name="pieces" path="/pieces" handler={PieceList}> <Route name="pieces" path="/pieces" handler={PieceList}>
</Route> </Route>
<Route name="piece" path="/pieces/:pieceId" handler={PieceContainer}> <Route name="edition" path="/editions/:editionId" handler={EditionContainer}>
</Route> </Route>
</Route> </Route>
); );

View File

@ -1,16 +1,16 @@
import alt from '../alt'; import alt from '../alt';
import PieceAction from '../actions/piece_actions'; import EditionAction from '../actions/edition_actions';
class PieceStore { class EditionStore {
constructor() { constructor() {
this.piece = {}; this.edition = {};
this.bindActions(PieceAction); this.bindActions(EditionAction);
} }
onUpdatePiece(piece) { onUpdateEdition(edition) {
this.piece = piece; this.edition = edition;
} }
} }
export default alt.createStore(PieceStore); export default alt.createStore(EditionStore);