ascribe/onion
1
0
Fork 0
mirror of https://github.com/ascribe/onion.git synced 2024-06-29 00:58:03 +02:00
Code Issues Releases Wiki Activity

add dynamic links to piece list item depending on wether editions exist or not

Browse Source
This commit is contained in:
Tim Daubenschütz 2015-07-09 17:28:21 +02:00
parent d051198676
commit 5f459aa139
3 changed files with 31 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
js/components/ascribe_accordion_list/accordion_list_item.js
View File

@ -3,7 +3,6 @@
import React from 'react';
import Router from 'react-router';
import PieceListStore from '../../stores/piece_list_store';
import PieceListActions from '../../actions/piece_list_actions';
import Glyphicon from 'react-bootstrap/lib/Glyphicon';
@ -14,6 +13,8 @@ import AccordionListItemEditionWidget from './accordion_list_item_edition_widget
import { getLangText } from '../../utils/lang_utils';
let Link = Router.Link;
let AccordionListItem = React.createClass({
propTypes: {
className: React.PropTypes.string,
@ -45,20 +46,39 @@ let AccordionListItem = React.createClass({
},
render() {
let linkData;
if(this.props.content.num_editions === 0) {
linkData = {
to: 'piece',
params: {
pieceId: this.props.content.id
}
};
} else {
linkData = {
to: 'edition',
params: {
editionId: this.props.content.firstEdition ? this.props.content.firstEdition.bitcoin_id : 0
}
};
}
return (
<div className="row">
<div className={this.props.className}>
<div className="wrapper">
<div className="col-xs-4 col-sm-3 col-md-2 col-lg-2 clear-paddings">
<div className="thumbnail-wrapper" onClick={this.handleClick}>
<img src={this.props.content.thumbnail} />
<div className="thumbnail-wrapper">
<Link {...linkData}>
<img src={this.props.content.thumbnail} />
</Link>
</div>
</div>
<div className="col-xs-8 col-sm-9 col-md-9 col-lg-9 col-md-offset-1 col-lg-offset-1 accordion-list-item-header">
<OverlayTrigger delay={500} placement="left"
overlay={<Tooltip>{this.props.content.title}</Tooltip>}>
<h1 className="truncate" onClick={this.handleClick}>{this.props.content.title}</h1>
</OverlayTrigger>
<Link {...linkData}>
<h1 className="truncate">{this.props.content.title}</h1>
</Link>
<h3>{getLangText('by %s', this.props.content.artist_name)}</h3>
<div>
<span>{this.props.content.date_created.split('-')[0]}</span>

2
js/components/ascribe_accordion_list/accordion_list_item_edition_widget.js
View File

@ -6,7 +6,6 @@ import EditionListActions from '../../actions/edition_list_actions';
import EditionListStore from '../../stores/edition_list_store';
import { getLangText } from '../../utils/lang_utils';
import { mergeOptions } from '../../utils/general_utils';
let AccordionListItemEditionWidget = React.createClass({
propTypes: {
@ -75,7 +74,6 @@ let AccordionListItemEditionWidget = React.createClass({
let numEditions = piece.num_editions;
if(numEditions === 1) {
//let firstEditionId = piece && piece.firstEdition ? ', ' + piece.firstEdition.bitcoin_id : '';
let editionMapping = piece && piece.firstEdition ? piece.firstEdition.edition_number + '/' + piece.num_editions : '';
return (

4
sass/ascribe_accordion_list.scss
View File

@ -58,6 +58,10 @@ $ascribe-accordion-list-font: 'Source Sans Pro';
}
}
.accordion-list-item-header > a {
text-decoration: none;
}
.ascribe-accordion-list-loading {
padding-top: 30%;
padding-bottom: 30%;