ascribe/onion
1
0
Fork 0
mirror of https://github.com/ascribe/onion.git synced 2024-12-22 09:23:13 +01:00
Code Issues Releases Wiki Activity

Hide unnecessary items from the piece and edition details in print

Browse Source
This commit is contained in:
Brett Sun 2015-12-23 09:39:02 +01:00
parent 8ec7023b8f
commit 6c9e108b72
4 changed files with 35 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
js/components/ascribe_detail/detail_property.js
View File

@ -1,9 +1,10 @@
'use strict';
import React from 'react';
import classNames from 'classnames';
let DetailProperty = React.createClass({
const DetailProperty = React.createClass({
propTypes: {
label: React.PropTypes.string,
value: React.PropTypes.oneOfType([
@ -12,6 +13,7 @@ let DetailProperty = React.createClass({
React.PropTypes.element
]),
separator: React.PropTypes.string,
className: React.PropTypes.string,
labelClassName: React.PropTypes.string,
valueClassName: React.PropTypes.string,
ellipsis: React.PropTypes.bool,
@ -30,24 +32,23 @@ let DetailProperty = React.createClass({
},
render() {
let styles = {};
const { labelClassName,
label,
separator,
valueClassName,
children,
value } = this.props;
const {
children,
className,
label,
labelClassName,
separator,
valueClassName,
value } = this.props;
if(this.props.ellipsis) {
styles = {
whiteSpace: 'nowrap',
overflow: 'hidden',
textOverflow: 'ellipsis'
};
}
const styles = this.props.ellipsis ? {
whiteSpace: 'nowrap',
overflow: 'hidden',
textOverflow: 'ellipsis'
} : null;
return (
<div className="row ascribe-detail-property">
<div className={classNames('row ascribe-detail-property', className)}>
<div className="row-same-height">
<div className={labelClassName}>
{label} {separator}

25
js/components/ascribe_detail/edition.js
View File

@ -16,7 +16,7 @@ import CollapsibleParagraph from './../ascribe_collapsible/collapsible_paragraph
import Form from './../ascribe_forms/form';
import Property from './../ascribe_forms/property';
import EditionDetailProperty from './detail_property';
import DetailProperty from './detail_property';
import LicenseDetail from './license_detail';
import FurtherDetails from './further_details';
@ -63,10 +63,10 @@ let Edition = React.createClass({
</Col>
<Col md={6} className="ascribe-edition-details ascribe-print-col-right">
<div className="ascribe-detail-header">
<hr style={{marginTop: 0}}/>
<hr className="hidden-print" style={{marginTop: 0}}/>
<h1 className="ascribe-detail-title">{this.props.edition.title}</h1>
<EditionDetailProperty label="BY" value={this.props.edition.artist_name} />
<EditionDetailProperty label="DATE" value={Moment(this.props.edition.date_created, 'YYYY-MM-DD').year()} />
<DetailProperty label="BY" value={this.props.edition.artist_name} />
<DetailProperty label="DATE" value={Moment(this.props.edition.date_created, 'YYYY-MM-DD').year()} />
<hr/>
</div>
<EditionSummary
@ -169,10 +169,10 @@ let EditionSummary = React.createClass({
let status = null;
if (this.props.edition.status.length > 0){
let statusStr = this.props.edition.status.join(', ').replace(/_/g, ' ');
status = <EditionDetailProperty label="STATUS" value={ statusStr }/>;
status = <DetailProperty label="STATUS" value={ statusStr }/>;
if (this.props.edition.pending_new_owner && this.props.edition.acl.acl_withdraw_transfer){
status = (
<EditionDetailProperty label="STATUS" value={ statusStr } />
<DetailProperty label="STATUS" value={ statusStr } />
);
}
}
@ -183,14 +183,14 @@ let EditionSummary = React.createClass({
let { actionPanelButtonListType, edition, currentUser } = this.props;
return (
<div className="ascribe-detail-header">
<EditionDetailProperty
<DetailProperty
label={getLangText('EDITION')}
value={ edition.edition_number + ' ' + getLangText('of') + ' ' + edition.num_editions} />
<EditionDetailProperty
<DetailProperty
label={getLangText('ID')}
value={ edition.bitcoin_id }
ellipsis={true} />
<EditionDetailProperty
<DetailProperty
label={getLangText('OWNER')}
value={ edition.owner } />
<LicenseDetail license={edition.license_type}/>
@ -201,14 +201,15 @@ let EditionSummary = React.createClass({
`AclInformation` would show up
*/}
<AclProxy show={currentUser && currentUser.email && Object.keys(edition.acl).length > 1}>
<EditionDetailProperty
label={getLangText('ACTIONS')}>
<DetailProperty
label={getLangText('ACTIONS')}
className="hidden-print">
<EditionActionPanel
actionPanelButtonListType={actionPanelButtonListType}
edition={edition}
currentUser={currentUser}
handleSuccess={this.handleSuccess} />
</EditionDetailProperty>
</DetailProperty>
</AclProxy>
<hr/>
</div>

2
js/components/ascribe_detail/media_container.js
View File

@ -114,7 +114,7 @@ let MediaContainer = React.createClass({
url={content.digital_work.url}
extraData={extraData}
encodingStatus={content.digital_work.isEncoding} />
<p className="text-center">
<p className="text-center hidden-print">
<span className="ascribe-social-button-list">
<FacebookShareButton />
<TwitterShareButton

6
js/components/ascribe_detail/piece_container.js
View File

@ -219,7 +219,9 @@ let PieceContainer = React.createClass({
no more than 1 key, we're hiding the `DetailProperty` actions as otherwise
`AclInformation` would show up
*/}
<DetailProperty label={getLangText('ACTIONS')}>
<DetailProperty
label={getLangText('ACTIONS')}
className="hidden-print">
<AclButtonList
className="ascribe-button-list"
availableAcls={piece.acl}
@ -257,7 +259,7 @@ let PieceContainer = React.createClass({
loadPiece={this.loadPiece}
header={
<div className="ascribe-detail-header">
<hr style={{marginTop: 0}}/>
<hr className="hidden-print" style={{marginTop: 0}}/>
<h1 className="ascribe-detail-title">{this.state.piece.title}</h1>
<DetailProperty label="BY" value={this.state.piece.artist_name} />
<DetailProperty label="DATE" value={Moment(this.state.piece.date_created, 'YYYY-MM-DD').year() } />