Skip to content

Commit

Permalink
clean
Browse files Browse the repository at this point in the history
  • Loading branch information
@panaC
panaC committed Nov 23, 2023
1 parent 4b36b03 commit b02e398
Show file tree
Hide file tree
Showing 13 changed files with 415 additions and 377 deletions.
10 changes: 5 additions & 5 deletions src/renderer/common/components/dialog/publicationInfos/LcpInfo.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -102,7 +102,7 @@ class LcpInfo extends React.Component<IProps, undefined> {

return (
<>
<div className="publicationInfo-heading">
<div className={stylesGlobal.heading}>
<h3>LCP</h3>
</div>
<div className={classNames(stylesBookDetailsDialog.allowUserSelect)}>
Expand Down Expand Up @@ -134,24 +134,24 @@ class LcpInfo extends React.Component<IProps, undefined> {
}

{lcpRightsStartDateStr && <>
<strong>{__("publication.lcpStart")}: </strong><span>{lcpRightsStartDateStr}</span>
<strong>{__("publication.lcpStart")}: </strong><i>{lcpRightsStartDateStr}</i>
<br />
</>}

{lcpRightsEndDateStr && <>
<strong>{__("publication.lcpEnd")}: </strong><span>{lcpRightsEndDateStr}</span>
<strong>{__("publication.lcpEnd")}: </strong><i>{lcpRightsEndDateStr}</i>
<br />
<br />
</>}

{lcpRightsCopy ? <>
<strong>{__("publication.lcpRightsCopy")}: </strong>
<span>{lcpRightsCopies} / {lcpRightsCopy}</span><br />
<i>{lcpRightsCopies} / {lcpRightsCopy}</i><br />
</> : undefined}

{lcpRightsPrint ? <>
<strong>{__("publication.lcpRightsPrint")}: </strong>
<span>0 / {lcpRightsPrint}</span><br />
<i>0 / {lcpRightsPrint}</i><br />
</> : undefined}
</div>
</>
Expand Down
17 changes: 7 additions & 10 deletions src/renderer/common/components/dialog/publicationInfos/PublicationInfoDescription.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,12 +12,9 @@ import * as React from "react";
import { I18nTyped, Translator } from "readium-desktop/common/services/translator";
import { TPublication } from "readium-desktop/common/type/publication.type";
import * as stylesBookDetailsDialog from "readium-desktop/renderer/assets/styles/bookDetailsDialog.css";
// import * as stylesBlocks from "readium-desktop/renderer/assets/styles/components/blocks.css";
// import * as stylesButtons from "readium-desktop/renderer/assets/styles/components/buttons.css";
// import * as stylesGlobal from "readium-desktop/renderer/assets/styles/global.css";
import SVG from "../../SVG";
import * as ChevronDown from "readium-desktop/renderer/assets/icons/chevron-down.svg";
import * as ChevronUp from "readium-desktop/renderer/assets/icons/chevron-up.svg";
import * as stylesBlocks from "readium-desktop/renderer/assets/styles/components/blocks.css";
import * as stylesButtons from "readium-desktop/renderer/assets/styles/components/buttons.css";
import * as stylesGlobal from "readium-desktop/renderer/assets/styles/global.css";

// Logger
const debug = debug_("readium-desktop:renderer:publicationInfoDescription");
Expand Down Expand Up @@ -71,14 +68,15 @@ export default class PublicationInfoDescription extends React.Component<IProps,
if (!textSanitize) return <></>;
return (
<>
<div className="publicationInfo-description-header">
<div className={stylesGlobal.heading}>
<h3>{__("catalog.description")}</h3>
</div>
<div className="publicationInfo-description-bloc">
<div className={classNames(stylesBlocks.block_line, stylesBlocks.description_see_more)}>
<div
ref={this.descriptionWrapperRef}
className={classNames(
stylesBookDetailsDialog.descriptionWrapper,
this.state.needSeeMore && stylesGlobal.mb_30,
this.state.needSeeMore && stylesBookDetailsDialog.hideEnd,
this.state.seeMore && stylesBookDetailsDialog.seeMore,
)}
Expand All @@ -92,8 +90,7 @@ export default class PublicationInfoDescription extends React.Component<IProps,
</div>
{
this.state.needSeeMore &&
<button aria-hidden className="publicationInfo-description-bloc-seeMore" onClick={this.toggleSeeMore}>
<SVG ariaHidden svg={this.state.seeMore ? ChevronUp : ChevronDown} />
<button aria-hidden className={stylesButtons.button_see_more} onClick={this.toggleSeeMore}>
{
this.state.seeMore
? __("publication.seeLess")
Expand Down
4 changes: 2 additions & 2 deletions src/renderer/common/components/dialog/publicationInfos/formatPublicationLanguage.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -45,12 +45,12 @@ export const FormatPublicationLanguage: React.FC<IProps> = (props) => {
const note = (lang !== ll) ? ` (${lang})` : "";
const suffix = ((index < (publicationViewMaybeOpds.languages.length - 1)) ? ", " : "");

return (<span
return (<i
key={"lang-" + index}
className={stylesBookDetailsDialog.allowUserSelect}
>
{ll + note + suffix}
</span>);
</i>);

});

Expand Down
2 changes: 1 addition & 1 deletion src/renderer/common/components/dialog/publicationInfos/formatPublisherDate.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@ export const FormatPublisherDate: React.FC<IProps> = (props) => {
if (date) {
formatedPublishedDateComponent = (
<div>
<strong>{__("catalog.released")}: </strong> <span className={stylesBookDetailsDialog.allowUserSelect}>{date}</span>
<strong>{__("catalog.released")}</strong> <i className={stylesBookDetailsDialog.allowUserSelect}>{date}</i>
</div>
);
}
Expand Down
82 changes: 39 additions & 43 deletions src/renderer/common/components/dialog/publicationInfos/publicationInfoContent.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,8 +13,8 @@ import { TPublication } from "readium-desktop/common/type/publication.type";
import { formatTime } from "readium-desktop/common/utils/time";
import { IOpdsBaseLinkView } from "readium-desktop/common/views/opds";
import * as stylesBookDetailsDialog from "readium-desktop/renderer/assets/styles/bookDetailsDialog.css";
// import * as stylesColumns from "readium-desktop/renderer/assets/styles/components/columns.css";
import "readium-desktop/renderer/assets/styles/publicationInfos.scss";
import * as stylesColumns from "readium-desktop/renderer/assets/styles/components/columns.css";
import * as stylesPublications from "readium-desktop/renderer/assets/styles/components/publications.css";
import * as stylesGlobal from "readium-desktop/renderer/assets/styles/global.css";

import { TaJsonDeserialize } from "@r2-lcp-js/serializable";
Expand All @@ -30,8 +30,6 @@ import PublicationInfoDescription from "./PublicationInfoDescription";
import { convertMultiLangStringToString, langStringIsRTL } from "readium-desktop/renderer/common/language-string";
import PublicationInfoA11y from "./publicationInfoA11y";
import { PublicationView } from "readium-desktop/common/views/publication";
import SVG from "../../SVG";
import * as OnGoingBookIcon from "readium-desktop/renderer/assets/icons/ongoingBook-icon.svg";

export interface IProps {
publicationViewMaybeOpds: TPublication;
Expand Down Expand Up @@ -306,21 +304,21 @@ const Progression = (props: {
}

return (
<section className="publicationInfo-progressionWrapper">
<div className="publicationInfo-heading">
<h3 ref={focusRef} tabIndex={focusWhereAmI ? -1 : 0}>{`${__("publication.progression.title")} `}</h3>
</div>
<div className="publicationInfo-progressionContainer">
{(txtProgression ? (<p className={stylesBookDetailsDialog.allowUserSelect}><SVG ariaHidden svg={OnGoingBookIcon} />
{txtProgression}
</p>) : <></>)}
{(txtPagination ? (<p className={stylesBookDetailsDialog.allowUserSelect}>
{txtPagination}
</p>) : <></>)}
{(txtHeadings ? (<><div style={{lineHeight: "2em"}} className={stylesBookDetailsDialog.allowUserSelect}>
{txtHeadings}
</div></>) : <></>)}
</div>
<section>
<div className={stylesGlobal.heading}>
<h3 ref={focusRef} tabIndex={focusWhereAmI ? -1 : 0}>{`${__("publication.progression.title")}: `}</h3>
</div>
<>
{(txtProgression ? (<p><i className={stylesBookDetailsDialog.allowUserSelect}>
{txtProgression}
</i></p>) : <></>)}
{(txtPagination ? (<p><i className={stylesBookDetailsDialog.allowUserSelect}>
{txtPagination}
</i></p>) : <></>)}
{(txtHeadings ? (<><div style={{lineHeight: "2em"}} className={stylesBookDetailsDialog.allowUserSelect}>
{txtHeadings}
</div></>) : <></>)}
</>
</section>
);

Expand Down Expand Up @@ -355,9 +353,9 @@ export const PublicationInfoContent: React.FC<React.PropsWithChildren<IProps>> =

return (
<>
<div className="publicationInfo-container">
<div className="publicationInfo-leftSide">
<div className="publicationInfo-leftSide-coverWrapper">
<div className={stylesColumns.row}>
<div className={stylesColumns.col_book_img}>
<div className={stylesPublications.publication_image_wrapper}>
<Cover
publicationViewMaybeOpds={publicationViewMaybeOpds}
onClick={() => toggleCoverZoomCb(coverZoom)}
Expand All @@ -367,11 +365,9 @@ export const PublicationInfoContent: React.FC<React.PropsWithChildren<IProps>> =
}
></Cover>
</div>
<div className="publicationInfo-leftSide-buttonsWrapper">
{ ControlComponent && <ControlComponent /> }
</div>
</div>
<div className="publicationInfo-rightSide">
<div className={stylesColumns.col}>
<section>
<h2 className={classNames(stylesBookDetailsDialog.allowUserSelect, stylesGlobal.my_10)}
dir={pubTitleIsRTL ? "rtl" : undefined}>
Expand All @@ -388,74 +384,74 @@ export const PublicationInfoContent: React.FC<React.PropsWithChildren<IProps>> =
<PublicationInfoDescription publicationViewMaybeOpds={publicationViewMaybeOpds} __={__} translator={props.translator} />
</section>
<section>
<div className="publicationInfo-heading">
<div className={stylesGlobal.heading}>
<h3>{__("catalog.moreInfo")}</h3>
</div>
<div className="publicationInfo-moreInfo-content">
<div>
<FormatPublisherDate publicationViewMaybeOpds={publicationViewMaybeOpds} __={__} />
{
publicationViewMaybeOpds.publishers?.length ?
<div>
<>
<strong>{`${__("catalog.publisher")}: `}</strong>
<span className={stylesBookDetailsDialog.allowUserSelect}>
<i className={stylesBookDetailsDialog.allowUserSelect}>
<FormatContributorWithLink
contributors={publicationViewMaybeOpds.publishers}
translator={translator}
onClickLinkCb={onClikLinkCb}
/>
</span>
</i>
<br />
</div> : undefined
</> : undefined
}
{
publicationViewMaybeOpds.languages?.length ?
<div>
<>
<strong>{`${__("catalog.lang")}: `}</strong>
<FormatPublicationLanguage publicationViewMaybeOpds={publicationViewMaybeOpds} __={__} />
<br />
</div> : undefined
</> : undefined
}
{
publicationViewMaybeOpds.numberOfPages ?
<div>
<>
<strong>{`${__("catalog.numberOfPages")}: `}</strong>
<span className={stylesBookDetailsDialog.allowUserSelect}>
<i className={stylesBookDetailsDialog.allowUserSelect}>
{publicationViewMaybeOpds.numberOfPages}
</span>
</i>
<br />

</div> : undefined
</> : undefined
}
<Duration
__={__}
duration={publicationViewMaybeOpds.duration}
/>
{
publicationViewMaybeOpds.nbOfTracks ?
<div>
<>
<strong>{`${__("publication.audio.tracks")}: `}</strong>
<i className={stylesBookDetailsDialog.allowUserSelect}>
{publicationViewMaybeOpds.nbOfTracks}
</i>
<br />

</div> : undefined
</> : undefined
}
</div>
</section>
<section>
<div className="publicationInfo-heading">
<div className={stylesGlobal.heading}>
<h3>{__("publication.accessibility.name")}</h3>
</div>
<div>
<PublicationInfoA11y publicationViewMaybeOpds={publicationViewMaybeOpds}></PublicationInfoA11y>
</div>
</section>
{(publicationViewMaybeOpds.lcp ? <section className="publicationInfo-lcpInfo-content">
{(publicationViewMaybeOpds.lcp ? <section>
<LcpInfo publicationLcp={publicationViewMaybeOpds} />
</section> : <></>)}
<section className="publicationInfo-tagContainer">
<div className="publicationInfo-heading">
<section>
<div className={stylesGlobal.heading}>
<h3>{__("catalog.tags")}</h3>
</div>
<TagManagerComponent />
Expand Down
25 changes: 9 additions & 16 deletions src/renderer/common/components/dialog/publicationInfos/tag/AddTag.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,9 +12,6 @@ import { IOpdsTagView } from "readium-desktop/common/views/opds";
import * as stylesButtons from "readium-desktop/renderer/assets/styles/components/buttons.css";
import * as stylesTags from "readium-desktop/renderer/assets/styles/components/tags.css";
import { TChangeEventOnInput, TFormEvent } from "readium-desktop/typings/react";
import SVG from "../../../SVG";
import * as AddTagIcon from "readium-desktop/renderer/assets/icons/addTag-icon.svg";


// eslint-disable-next-line @typescript-eslint/no-empty-interface
interface IProps {
Expand Down Expand Up @@ -48,22 +45,18 @@ export default class AddTag extends React.Component<IProps, IState> {
return (
this.props.pubId
? <form onSubmit={this.addTag}>
<div className="form_group">
<label>{__("catalog.tag")}</label>
<input
type="text"
className={stylesTags.tag_inputs}
title={__("catalog.addTags")}
// placeholder={__("catalog.addTags")}
onChange={this.handleChangeName}
value={this.state.newTagName}
/>
</div>
<input
type="text"
className={stylesTags.tag_inputs}
title={__("catalog.addTags")}
placeholder={__("catalog.addTags")}
onChange={this.handleChangeName}
value={this.state.newTagName}
/>
<button
type="submit"
className={stylesButtons.button_primary_blue}
className={stylesButtons.button_primary_small}
>
<SVG ariaHidden svg={AddTagIcon} />
{__("catalog.addTagsButton")}
</button>
</form>
Expand Down
Loading

0 comments on commit b02e398

Please sign in to comment.