Merge branch 'main' into tidy-header

bookwyrm/static/css/bookwyrm.css

@@ -25,6 +25,10 @@ body {
     overflow: visible;
 }
 
+.card.has-border {
+    border: 1px solid #eee;
+}
+
 .scroll-x {
     overflow: hidden;
     overflow-x: auto;
@@ -140,6 +144,34 @@ input[type=file]::file-selector-button:hover {
     color: #363636;
 }
 
+details .dropdown-menu {
+    display: block !important;
+}
+
+details.dropdown[open] summary.dropdown-trigger::before {
+    content: "";
+    position: fixed;
+    top: 0;
+    bottom: 0;
+    left: 0;
+    right: 0;
+}
+
+summary::marker {
+    content: none;
+}
+
+.detail-pinned-button summary {
+    position: absolute;
+    right: 0;
+}
+
+.detail-pinned-button form {
+    float: left;
+    width: -webkit-fill-available;
+    margin-top: 1em;
+}
+
 /** Shelving
  ******************************************************************************/
 

bookwyrm/static/css/fonts/icomoon.svg

@@ -46,4 +46,5 @@
 <glyph unicode="&#xe9d9;" glyph-name="star-full" d="M1024 562.95l-353.78 51.408-158.22 320.582-158.216-320.582-353.784-51.408 256-249.538-60.432-352.352 316.432 166.358 316.432-166.358-60.434 352.352 256.002 249.538z" />
 <glyph unicode="&#xe9da;" glyph-name="heart" d="M755.188 896c-107.63 0-200.258-87.554-243.164-179-42.938 91.444-135.578 179-243.216 179-148.382 0-268.808-120.44-268.808-268.832 0-301.846 304.5-380.994 512.022-679.418 196.154 296.576 511.978 387.206 511.978 679.418 0 148.392-120.43 268.832-268.812 268.832z" />
 <glyph unicode="&#xea0a;" glyph-name="plus" d="M992 576h-352v352c0 17.672-14.328 32-32 32h-192c-17.672 0-32-14.328-32-32v-352h-352c-17.672 0-32-14.328-32-32v-192c0-17.672 14.328-32 32-32h352v-352c0-17.672 14.328-32 32-32h192c17.672 0 32 14.328 32 32v352h352c17.672 0 32 14.328 32 32v192c0 17.672-14.328 32-32 32z" />
+<glyph unicode="&#xea36;" glyph-name="download" d="M512-32l480 480h-288v512h-384v-512h-288z" />
 </font></defs></svg>

bookwyrm/static/css/vendor/icons.css

@@ -1,10 +1,10 @@
 @font-face {
   font-family: 'icomoon';
-  src:  url('../fonts/icomoon.eot?36x4a3');
-  src:  url('../fonts/icomoon.eot?36x4a3#iefix') format('embedded-opentype'),
-    url('../fonts/icomoon.ttf?36x4a3') format('truetype'),
-    url('../fonts/icomoon.woff?36x4a3') format('woff'),
-    url('../fonts/icomoon.svg?36x4a3#icomoon') format('svg');
+  src:  url('../fonts/icomoon.eot?r7jc98');
+  src:  url('../fonts/icomoon.eot?r7jc98#iefix') format('embedded-opentype'),
+    url('../fonts/icomoon.ttf?r7jc98') format('truetype'),
+    url('../fonts/icomoon.woff?r7jc98') format('woff'),
+    url('../fonts/icomoon.svg?r7jc98#icomoon') format('svg');
   font-weight: normal;
   font-style: normal;
   font-display: block;
@@ -142,3 +142,6 @@
 .icon-spinner:before {
   content: "\e97a";
 }
+.icon-download:before {
+  content: "\ea36";
+}

bookwyrm/static/js/bookwyrm.js

@@ -72,6 +72,9 @@ let BookWyrm = new class {
             document.querySelectorAll('input[type="file"]').forEach(
                 bookwyrm.disableIfTooLarge.bind(bookwyrm)
             );
+            document.querySelectorAll('[data-copytext]').forEach(
+                bookwyrm.copyText.bind(bookwyrm)
+            );
         });
     }
 
@@ -126,9 +129,44 @@ let BookWyrm = new class {
      * @return {undefined}
      */
     updateCountElement(counter, data) {
+        let count = data.count;
+        const count_by_type = data.count_by_type;
         const currentCount = counter.innerText;
-        const count = data.count;
         const hasMentions = data.has_mentions;
+        const allowedStatusTypesEl = document.getElementById('unread-notifications-wrapper');
+
+        // If we're on the right counter element
+        if (counter.closest('[data-poll-wrapper]').contains(allowedStatusTypesEl)) {
+            const allowedStatusTypes = JSON.parse(allowedStatusTypesEl.textContent);
+
+            // For keys in common between allowedStatusTypes and count_by_type
+            // This concerns 'review', 'quotation', 'comment'
+            count = allowedStatusTypes.reduce(function(prev, currentKey) {
+                const currentValue = count_by_type[currentKey] | 0;
+
+                return prev + currentValue;
+            }, 0);
+
+            // Add all the "other" in count_by_type if 'everything' is allowed
+            if (allowedStatusTypes.includes('everything')) {
+                // Clone count_by_type with 0 for reviews/quotations/comments
+                const count_by_everything_else = Object.assign(
+                    {},
+                    count_by_type,
+                    {review: 0, quotation: 0, comment: 0}
+                );
+
+                count = Object.keys(count_by_everything_else).reduce(
+                    function(prev, currentKey) {
+                        const currentValue =
+                            count_by_everything_else[currentKey] | 0
+
+                        return prev + currentValue;
+                    },
+                    count
+                );
+            }
+        }
 
         if (count != currentCount) {
             this.addRemoveClass(counter.closest('[data-poll-wrapper]'), 'is-hidden', count < 1);
@@ -470,6 +508,21 @@ let BookWyrm = new class {
         handleModalOpen(modal);
     }
 
+    /**
+     * Display pop up window.
+     *
+     * @param {string} url Url to open
+     * @param {string} windowName windowName
+     * @return {undefined}
+     */
+    displayPopUp(url, windowName) {
+        window.open(
+            url,
+            windowName,
+            "left=100,top=100,width=430,height=600"
+        );
+    }
+
     duplicateInput (event ) {
         const trigger = event.currentTarget;
         const input_id = trigger.dataset['duplicate']
@@ -489,4 +542,38 @@ let BookWyrm = new class {
         parent.appendChild(label)
         parent.appendChild(input)
     }
+
+    /**
+     * Set up a "click-to-copy" component from a textarea element
+     * with `data-copytext`, `data-copytext-label`, `data-copytext-success`
+     * attributes.
+     *
+     * @param  {object}  node - DOM node of the text container
+     * @return {undefined}
+     */
+
+    copyText(textareaEl) {
+        const text = textareaEl.textContent;
+
+        const copyButtonEl = document.createElement('button');
+
+        copyButtonEl.textContent = textareaEl.dataset.copytextLabel;
+        copyButtonEl.classList.add(
+            "mt-2",
+            "button",
+            "is-small",
+            "is-fullwidth",
+            "is-primary",
+            "is-light"
+        );
+        copyButtonEl.addEventListener('click', () => {
+            navigator.clipboard.writeText(text).then(function() {
+                textareaEl.classList.add('is-success');
+                copyButtonEl.classList.replace('is-primary', 'is-success');
+                copyButtonEl.textContent = textareaEl.dataset.copytextSuccess;
+            });
+        });
+
+        textareaEl.parentNode.appendChild(copyButtonEl)
+    }
 }();

bookwyrm/static/js/status_cache.js

@@ -210,10 +210,10 @@ let StatusCache = new class {
             .forEach(item => BookWyrm.addRemoveClass(item, "is-hidden", true));
 
         // Close menu
-        let menu = button.querySelector(".dropdown-trigger[aria-expanded=true]");
+        let menu = button.querySelector("details[open]");
 
         if (menu) {
-            menu.click();
+            menu.removeAttribute("open");
         }
     }