Skip to content
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.

Commit 2286e6e

Browse files
andrew-polkandrew-polk
authoredNov 20, 2019
Merge pull request #385 from BloomBooks/HarvestPanel
Use HarvestArtifactUserControl on book detail page (BL-7679)
2 parents a2edb2c + 28d4ea0 commit 2286e6e

File tree

6 files changed

+160
-104
lines changed

6 files changed

+160
-104
lines changed
 

‎src/app/modules/common/services.js

+4-1
Original file line numberDiff line numberDiff line change
@@ -89,6 +89,7 @@ angular.module('BloomLibraryApp.services', ['restangular'])
8989
restangularConfigurer.setDefaultHeaders(headers);
9090
};
9191

92+
var sessionTokenKey = 'X-Parse-Session-Token';
9293
factory = {
9394

9495
userName: function () { return userNameX; },
@@ -102,7 +103,6 @@ angular.module('BloomLibraryApp.services', ['restangular'])
102103
config: function () { return restangularConfig; },
103104

104105
setSession: function (sessionToken) {
105-
var sessionTokenKey = 'X-Parse-Session-Token';
106106
if (sessionToken) {
107107
headers[sessionTokenKey] = sessionToken;
108108
isLoggedIn = true;
@@ -111,6 +111,9 @@ angular.module('BloomLibraryApp.services', ['restangular'])
111111
delete headers[sessionTokenKey];
112112
isLoggedIn = false;
113113
}
114+
},
115+
getSession: function() {
116+
return headers[sessionTokenKey];
114117
},
115118

116119
login: function (username, password, successCallback, errorCallback) {

‎src/app/modules/detail/detail-controller.js

+39-9
Original file line numberDiff line numberDiff line change
@@ -134,7 +134,6 @@
134134
"bookService",
135135
"bookCountService",
136136
"bookSizeService",
137-
"sharedService",
138137
"tagService",
139138
"pageService",
140139
"$modal",
@@ -147,23 +146,30 @@
147146
bookService,
148147
bookCountService,
149148
bookSizeService,
150-
sharedService,
151149
tagService,
152150
pageService,
153151
$modal,
154152
$window
155153
) {
154+
155+
$scope.isCurrentUserBookUploader = function(book, authService) {
156+
return authService.isLoggedIn() &&
157+
(authService.userName().toLowerCase() == book.uploader.username.toLowerCase());
158+
};
159+
156160
// A fairly crude way of testing for IOS, where a click on a button that has a tooltip just
157161
// shows the tooltip, to the dismay of anyone expecting the button to work.
158162
$scope.showTooltips =
159163
!navigator.platform || !/iPad|iPhone|iPod/.test(navigator.platform);
160-
$scope.canDeleteBook = false; // until we get the book and may make it true
164+
$scope.canModifyBook = false; // until we get the book and may make it true
161165
$scope.location = window.location.href; // make available to embed in mailto: links
162166
//get the book for which we're going to show the details
163167
bookService.getBookById($stateParams.bookId).then(function(book) {
164168
tagService.hideSystemTags(book);
165169
$scope.book = book;
166-
pageService.setTitle(_localize("{bookTitle} - Details", { bookTitle: book.title }));
170+
pageService.setTitle(
171+
_localize("{bookTitle} - Details", { bookTitle: book.title })
172+
);
167173

168174
for (var i = 0; i < $scope.book.langPointers.length; i++) {
169175
var l = $scope.book.langPointers[i];
@@ -191,11 +197,28 @@
191197
$scope.showRead = bookService.showRead(book);
192198
$scope.showHarvestedPdf = bookService.showHarvestedPdf(book);
193199

194-
$scope.canDeleteBook =
195-
authService.isLoggedIn() &&
196-
(authService.userName().toLowerCase() ==
197-
book.uploader.username.toLowerCase() ||
198-
authService.isUserAdministrator());
200+
var isCurrentUserBookUploader = $scope.isCurrentUserBookUploader(book, authService);
201+
$scope.canModifyBook = isCurrentUserBookUploader || authService.isUserAdministrator();
202+
203+
if ($scope.canModifyBook) {
204+
setupHarvestPanel(
205+
{
206+
bookId: $stateParams.bookId,
207+
currentSession: authService.getSession(),
208+
currentUserIsUploader: isCurrentUserBookUploader,
209+
currentUserIsAdmin: authService.isUserAdministrator(),
210+
onChange: function() {
211+
// When the user updates which artifacts should be displayed,
212+
// we need to update the actual artifact download buttons in the
213+
// main (upper) part of the book detail page.
214+
// Unfortunately, the only way I know of to update them
215+
// from this context is to refresh the whole page.
216+
$state.reload();
217+
}
218+
}
219+
);
220+
}
221+
199222
$scope.downloadSize = 0; // hidden until we set a value
200223
//Get related books
201224
bookService
@@ -307,3 +330,10 @@
307330
}
308331
]);
309332
})(); // end wrap-everything function
333+
334+
function setupHarvestPanel(props) {
335+
window.NextBloomLibrary.connectHarvestArtifactUserControl(
336+
document.getElementById("harvestPanel"),
337+
props
338+
);
339+
}

‎src/app/modules/detail/detail.less

+21-2
Original file line numberDiff line numberDiff line change
@@ -72,7 +72,7 @@
7272
}
7373
}
7474

75-
.detail {
75+
.detail .main {
7676
.detailCol2 {
7777
width: calc(~"100% - " (@image-width + @image-right-margin));
7878
display: inline-block;
@@ -154,7 +154,7 @@ i.abuseIcon {
154154
background-size: @icon-button-size @icon-button-size; // so it scales the image rather than clipping
155155
}
156156

157-
.detail {
157+
.detail .main {
158158
a.read {
159159
width: 100%;
160160
@media (min-width: @phoneMinWidth) {
@@ -311,3 +311,22 @@ i.abuseIcon {
311311
i.inBookshelf {
312312
background-color: green;
313313
}
314+
315+
// The harvest panel is pulled in from BloomLibrary2 as a react component.
316+
// A few of the styles don't work well in this context and need to be adjusted.
317+
#harvestPanel {
318+
margin-top: 20px;
319+
.MuiInputBase-root {
320+
font-size: 1em //must override 1rem which is too small in bloomlibrary.org
321+
}
322+
.MuiFormHelperText-root {
323+
font-size: 0.75em //must override 0.75rem which is too small in bloomlibrary.org
324+
}
325+
.MuiButton-root {
326+
font-size: 0.875em //must override 0.875rem which is too small in bloomlibrary.org
327+
}
328+
}
329+
// The select box menu is actually added to the dom outside #harvestPanel...
330+
.MuiPopover-root .MuiMenuItem-root {
331+
font-size: 1em //must override 1rem which is too small in bloomlibrary.org
332+
}

‎src/app/modules/detail/detail.tpl.pug

+93-91
Original file line numberDiff line numberDiff line change
@@ -9,102 +9,104 @@ div.modal-dialog
99
a(ui-sref="browse")
1010
<i class="material-icons">arrow_back</i>&nbsp;&nbsp;Return to the Library
1111
div.modal-body(role="dialog" aria-label="Details of the book")
12-
div.detailCol1
13-
img.book-cover(ng-src="{{book.baseUrl | makeDetailSizedThumbnailUrl}}" alt="Cover thumbnail")
14-
div.detailCol2.largeScreenOnly
15-
h1.title.notranslate {{book.title}}
16-
div.summary(ng-hide="!book.summary")
17-
span.fori18n Summary:
18-
= ' '
19-
span.notranslate {{book.summary}}
20-
div.detailPages.largeScreenOnly
21-
span.fori18n Pages:
22-
= ' '
23-
span.notranslate {{book.pageCount}}
24-
div.largeScreenOnly.languages(ng-show="book.langPointers.length")
25-
span.fori18n Languages:
26-
= ' '
27-
span(ng-repeat="lang in book.langPointers")
28-
a(ng-href="{{lang.href}}" target="_blank") {{lang.name}}
29-
span(ng-hide="$last") ,
30-
= ' '
31-
div.largeScreenOnly.copyright.notranslate {{book.copyright}}
32-
div.largeScreenOnly.license
33-
span.fori18n License:
34-
= ' '
35-
span.notranslate
12+
div.main
13+
div.detailCol1
14+
img.book-cover(ng-src="{{book.baseUrl | makeDetailSizedThumbnailUrl}}" alt="Cover thumbnail")
15+
div.detailCol2.largeScreenOnly
16+
h1.title.notranslate {{book.title}}
17+
div.summary(ng-hide="!book.summary")
18+
span.fori18n Summary:
3619
= ' '
37-
a(href="javascript:void(null);" ng-click="showLicense()") {{book.license}}
38-
span(ng-hide="!book.licenseNotes") . (
39-
| {{book.licenseNotes}}
40-
span(ng-hide="!book.licenseNotes") )
41-
div.status
42-
// Don't use updatedAt here because it is changed by things other than uploading, for example, when the librarian adds a tag (BL-2737).
43-
span.fori18n Uploaded:
44-
= ' '
45-
span.notranslate {{book.createdAt | cleanDate}}
46-
= ' '
47-
span.fori18n by
48-
= ' '
49-
span.notranslate
50-
a(ng-show="canReportViolation" href="mailto:{{book.uploader.username}}?subject=A%20request%20about%20a%20book%20you%20contributed%20to%20bloomlibrary.org:%20{{book.title}}%20({{book.objectId}})&body=This%20book%20may%20be%20found%20at%20{{location}}.") {{book.uploader.username | obfuscate}}
51-
a(ng-hide="canReportViolation" href="" ng-click="showPleaseLogIn()") {{book.uploader.username | obfuscate}}
52-
div.largeScreenOnly.tags(ng-show="book.tags.length")
53-
span.fori18n Tags:
54-
= ' '
55-
span(ng-repeat="tag in book.tags")
56-
i.icon-tag(tx-content="exclude")
57-
span(tx-content="include") {{tag | getDisplayName | getCleanBookshelfName}}
58-
span(ng-hide="$last")
59-
= ' '
60-
.downloadSize(ng-show="downloadSize")
61-
span.notranslate {{downloadSize | addMbLabel}}
62-
div.largeScreenOnly.relatedBooks(ng-show="book.relatedBooks")
63-
span.fori18n Related Books:
64-
= ' '
65-
span.notranslate(ng-repeat="relBook in book.relatedBooks")
66-
a(ui-sref="browse.detail({bookId: relBook.objectId})") {{relBook.title}}
67-
span(ng-hide="$last") ,
20+
span.notranslate {{book.summary}}
21+
div.detailPages.largeScreenOnly
22+
span.fori18n Pages:
23+
= ' '
24+
span.notranslate {{book.pageCount}}
25+
div.largeScreenOnly.languages(ng-show="book.langPointers.length")
26+
span.fori18n Languages:
27+
= ' '
28+
span(ng-repeat="lang in book.langPointers")
29+
a(ng-href="{{lang.href}}" target="_blank") {{lang.name}}
30+
span(ng-hide="$last") ,
31+
= ' '
32+
div.largeScreenOnly.copyright.notranslate {{book.copyright}}
33+
div.largeScreenOnly.license
34+
span.fori18n License:
35+
= ' '
36+
span.notranslate
6837
= ' '
69-
div.unfloat
70-
.actions
71-
a.largeScreenOnly(tabIndex="-1" ng-hide="canReportViolation" href="" ng-click="showPleaseLogIn()" aria-label="Report a concern about this book")
72-
i.abuseIcon(ng-attr-tabIndex="{{canReportViolation ? -1 : 0}}" tooltip="{{showTooltips? 'Report a concern about this book':''}}" tooltip-placement="right")
73-
a.largeScreenOnly(tabIndex="-1" ng-show="canReportViolation" ui-sref="browse.detail.reportbook" aria-label="Report a concern about this book")
74-
i.abuseIcon(ng-attr-tabIndex="{{canReportViolation ? 0 : -1}}" tooltip="{{showTooltips? 'Report a concern about this book':''}}" tooltip-placement="right")
75-
a.largeScreenOnly(tabIndex="-1" href="" ng-click="showDeleteDialog()" aria-label="Delete this book")
76-
i(ng-attr-tabIndex="{{canDeleteBook ? 0 : -1}}" tooltip="{{showTooltips? 'Delete this book':''}}" tooltip-placement="right" ng-class="{'icon-trash': true, 'icon-hidden':!canDeleteBook}")
38+
a(href="javascript:void(null);" ng-click="showLicense()") {{book.license}}
39+
span(ng-hide="!book.licenseNotes") . (
40+
| {{book.licenseNotes}}
41+
span(ng-hide="!book.licenseNotes") )
42+
div.status
43+
// Don't use updatedAt here because it is changed by things other than uploading, for example, when the librarian adds a tag (BL-2737).
44+
span.fori18n Uploaded:
45+
= ' '
46+
span.notranslate {{book.createdAt | cleanDate}}
47+
= ' '
48+
span.fori18n by
49+
= ' '
50+
span.notranslate
51+
a(ng-show="canReportViolation" href="mailto:{{book.uploader.username}}?subject=A%20request%20about%20a%20book%20you%20contributed%20to%20bloomlibrary.org:%20{{book.title}}%20({{book.objectId}})&body=This%20book%20may%20be%20found%20at%20{{location}}.") {{book.uploader.username | obfuscate}}
52+
a(ng-hide="canReportViolation" href="" ng-click="showPleaseLogIn()") {{book.uploader.username | obfuscate}}
53+
div.largeScreenOnly.tags(ng-show="book.tags.length")
54+
span.fori18n Tags:
55+
= ' '
56+
span(ng-repeat="tag in book.tags")
57+
i.icon-tag(tx-content="exclude")
58+
span(tx-content="include") {{tag | getDisplayName | getCleanBookshelfName}}
59+
span(ng-hide="$last")
60+
= ' '
61+
.downloadSize(ng-show="downloadSize")
62+
span.notranslate {{downloadSize | addMbLabel}}
63+
div.largeScreenOnly.relatedBooks(ng-show="book.relatedBooks")
64+
span.fori18n Related Books:
65+
= ' '
66+
span.notranslate(ng-repeat="relBook in book.relatedBooks")
67+
a(ui-sref="browse.detail({bookId: relBook.objectId})") {{relBook.title}}
68+
span(ng-hide="$last") ,
69+
= ' '
70+
div.unfloat
71+
.actions
72+
a.largeScreenOnly(tabIndex="-1" ng-hide="canReportViolation" href="" ng-click="showPleaseLogIn()" aria-label="Report a concern about this book")
73+
i.abuseIcon(ng-attr-tabIndex="{{canReportViolation ? -1 : 0}}" tooltip="{{showTooltips? 'Report a concern about this book':''}}" tooltip-placement="right")
74+
a.largeScreenOnly(tabIndex="-1" ng-show="canReportViolation" ui-sref="browse.detail.reportbook" aria-label="Report a concern about this book")
75+
i.abuseIcon(ng-attr-tabIndex="{{canReportViolation ? 0 : -1}}" tooltip="{{showTooltips? 'Report a concern about this book':''}}" tooltip-placement="right")
76+
a.largeScreenOnly(tabIndex="-1" href="" ng-click="showDeleteDialog()" aria-label="Delete this book")
77+
i(ng-attr-tabIndex="{{canModifyBook ? 0 : -1}}" tooltip="{{showTooltips? 'Delete this book':''}}" tooltip-placement="right" ng-class="{'icon-trash': true, 'icon-hidden':!canModifyBook}")
7778

78-
a.read(ng-show="showRead" tabIndex="-1" ui-sref="readBook({bookId: $stateParams.bookId})" tooltip="{{showTooltips? 'Read now in your browser':''}}" analytics-on analytics-event="GetBook" analytics-book="{{book.objectId}}" analytics-type="read")
79-
button.btn.btn-primary(type="button")
80-
//- helpful for multiline button formatting (see less)
81-
.iconAndLabel
82-
img.icon(src="/assets/readIcon.svg")
83-
span Read
84-
.downloads
85-
a.shellbook.desktopOnly(tabIndex="-1" ng-click="onDownloadShell(book)" tooltip="{{showTooltips? 'Download to the Bloom software on your computer, so that you can use it as a shell book.':''}}" analytics-on analytics-event="GetBook" analytics-book="{{book.objectId}}" analytics-type="shell")
86-
button.btn.btn-default(type="button")
87-
//- helpful for multiline button formatting (see less)
88-
span
89-
.subtext Make a version in <em>your</em> language!
90-
img.icon(src="/assets/shellDownloadIcon.svg")
91-
span Download into Bloom Editor
92-
.download-buttons
79+
a.read(ng-show="showRead" tabIndex="-1" ui-sref="readBook({bookId: $stateParams.bookId})" tooltip="{{showTooltips? 'Read now in your browser':''}}" analytics-on analytics-event="GetBook" analytics-book="{{book.objectId}}" analytics-type="read")
80+
button.btn.btn-primary(type="button")
81+
//- helpful for multiline button formatting (see less)
82+
.iconAndLabel
83+
img.icon(src="/assets/readIcon.svg")
84+
span Read
85+
.downloads
86+
a.shellbook.desktopOnly(tabIndex="-1" ng-click="onDownloadShell(book)" tooltip="{{showTooltips? 'Download to the Bloom software on your computer, so that you can use it as a shell book.':''}}" analytics-on analytics-event="GetBook" analytics-book="{{book.objectId}}" analytics-type="shell")
87+
button.btn.btn-default(type="button")
88+
//- helpful for multiline button formatting (see less)
89+
span
90+
.subtext Make a version in <em>your</em> language!
91+
img.icon(src="/assets/shellDownloadIcon.svg")
92+
span Download into Bloom Editor
93+
.download-buttons
9394

94-
a(ng-hide="showHarvestedPdf" ng-href="{{pdfPreviewUrl}}" target="_blank" analytics-on analytics-event="GetBook" analytics-book="{{book.objectId}}" analytics-type="pdf-nonharvested")
95-
img(src="/assets/pdf.png" alt="Download PDF")
95+
a(ng-hide="showHarvestedPdf" ng-href="{{pdfPreviewUrl}}" target="_blank" analytics-on analytics-event="GetBook" analytics-book="{{book.objectId}}" analytics-type="pdf-nonharvested")
96+
img(src="/assets/pdf.png" alt="Download PDF")
9697

97-
a(ng-show="showHarvestedPdf" ng-href="{{pdfDownloadUrl}}" target="_blank" download="{{book.title}}" analytics-on analytics-event="GetBook" analytics-book="{{book.objectId}}" analytics-type="pdf")
98-
img(src="/assets/pdf.png" alt="Download PDF")
98+
a(ng-show="showHarvestedPdf" ng-href="{{pdfDownloadUrl}}" target="_blank" download="{{book.title}}" analytics-on analytics-event="GetBook" analytics-book="{{book.objectId}}" analytics-type="pdf")
99+
img(src="/assets/pdf.png" alt="Download PDF")
99100

100-
a(ng-show="showEpub" ng-href="{{epubUrl}}" download="{{book.title}}" analytics-on analytics-event="GetBook" analytics-book="{{book.objectId}}" analytics-type="epub")
101-
img(src="/assets/epub.png" alt="Download ePUB")
101+
a(ng-show="showEpub" ng-href="{{epubUrl}}" download="{{book.title}}" analytics-on analytics-event="GetBook" analytics-book="{{book.objectId}}" analytics-type="epub")
102+
img(src="/assets/epub.png" alt="Download ePUB")
102103

103-
a.hideOnIOS.bloomReaderDownload(ng-show="showBloomReader" tabIndex="-1" ng-href="{{digitalDownloadUrl}}" tooltip="Use with Bloom's companion Android app, Bloom Reader" download="{{book.title}}" analytics-on analytics-event="GetBook" analytics-book="{{book.objectId}}" analytics-type="bloomd")
104-
img(src="/assets/bloomd.png" alt="Download version for Bloom Reader app")
105-
div Bloom Reader
104+
a.hideOnIOS.bloomReaderDownload(ng-show="showBloomReader" tabIndex="-1" ng-href="{{digitalDownloadUrl}}" tooltip="Use with Bloom's companion Android app, Bloom Reader" download="{{book.title}}" analytics-on analytics-event="GetBook" analytics-book="{{book.objectId}}" analytics-type="bloomd")
105+
img(src="/assets/bloomd.png" alt="Download version for Bloom Reader app")
106+
div Bloom Reader
106107

107-
.playStore.hideOnIOS
108-
//- h2 Get Bloom Reader
109-
a(ng-show="showBloomReader" href='https://play.google.com/store/apps/details?id=org.sil.bloom.reader&pcampaignid=MKT-Other-global-all-co-prtnr-py-PartBadge-Mar2515-1')
110-
img(alt='Get it on Google Play' src='https://play.google.com/intl/en_us/badges/images/generic/en_badge_web_generic.png')
108+
.playStore.hideOnIOS
109+
//- h2 Get Bloom Reader
110+
a(ng-show="showBloomReader" href='https://play.google.com/store/apps/details?id=org.sil.bloom.reader&pcampaignid=MKT-Other-global-all-co-prtnr-py-PartBadge-Mar2515-1')
111+
img(alt='Get it on Google Play' src='https://play.google.com/intl/en_us/badges/images/generic/en_badge_web_generic.png')
112+
#harvestPanel

‎src/app/modules/readBook/readBook-controller.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -48,7 +48,7 @@
4848
// shows the tooltip, to the dismay of anyone expecting the button to work.
4949
$scope.showTooltips =
5050
!navigator.platform || !/iPad|iPhone|iPod/.test(navigator.platform);
51-
$scope.canDeleteBook = false; // until we get the book and may make it true
51+
$scope.canModifyBook = false; // until we get the book and may make it true
5252
$scope.location = window.location.href; // make available to embed in mailto: links
5353
//get the book for which we're going to show the details
5454
bookService.getBookById($stateParams.bookId).then(function(book) {

‎src/index.html

+2
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,8 @@
2424
property="og:description"
2525
content="Let's make hundreds of books for every kid, in every language."
2626
/>
27+
<!--from BloomLibrary2-->
28+
<script src="assets/externalComponents/HarvesterArtifactUserControlBundle.js"></script>
2729

2830
<!-- font awesome from BootstrapCDN -->
2931
<link

0 commit comments

Comments
 (0)
Please sign in to comment.