diff options
author | ArthurHoaro <arthur@hoa.ro> | 2020-10-10 17:40:26 +0200 |
---|---|---|
committer | ArthurHoaro <arthur@hoa.ro> | 2020-10-27 20:11:30 +0100 |
commit | 5d8de7587d67b5c3e5d1fed8562d9b87ecde80c1 (patch) | |
tree | 2236e571035332a63f87a09222f2278b93f63515 /assets/default | |
parent | b8e5a253ab5521ce2be6c0d3e04e0101527df3c1 (diff) | |
download | Shaarli-5d8de7587d67b5c3e5d1fed8562d9b87ecde80c1.tar.gz Shaarli-5d8de7587d67b5c3e5d1fed8562d9b87ecde80c1.tar.zst Shaarli-5d8de7587d67b5c3e5d1fed8562d9b87ecde80c1.zip |
Feature: bulk creation of bookmarks
This changes creates a new form in addlink page allowing to create
multiple bookmarks at once more easily. It focuses on re-using as much
existing code and template component as possible.
These changes includes:
- a new form in addlink (hidden behind a button by default),
containing a text area for URL, and tags/private status to apply to
created links
- this form displays a new template called editlink.batch, itself
including editlink template multiple times
- User interation in this new templates are handle by a new JS script
(shaare-batch.js) making AJAX requests, and therefore does not need page
reloading
- ManageShaareController has been split into 3 distinct controllers:
+ ShaareAdd: displays addlink template
+ ShaareManage: various operation applied on existing shaares
(change visibility, pin, deletion, etc.)
+ ShaarePublish: handles creation/edit forms and saving Shaare's
form
- Updated translations
Fixes #137
Diffstat (limited to 'assets/default')
-rw-r--r-- | assets/default/js/base.js | 21 | ||||
-rw-r--r-- | assets/default/scss/shaarli.scss | 49 |
2 files changed, 70 insertions, 0 deletions
diff --git a/assets/default/js/base.js b/assets/default/js/base.js index 7f6b9637..9161b4fc 100644 --- a/assets/default/js/base.js +++ b/assets/default/js/base.js | |||
@@ -634,4 +634,25 @@ function init(description) { | |||
634 | }); | 634 | }); |
635 | }); | 635 | }); |
636 | } | 636 | } |
637 | |||
638 | const bulkCreationButton = document.querySelector('.addlink-batch-show-more-block'); | ||
639 | if (bulkCreationButton != null) { | ||
640 | const toggleBulkCreationVisibility = (showMoreBlockElement, formElement) => { | ||
641 | if (bulkCreationButton.classList.contains('pure-u-0')) { | ||
642 | showMoreBlockElement.classList.remove('pure-u-0'); | ||
643 | formElement.classList.add('pure-u-0'); | ||
644 | } else { | ||
645 | showMoreBlockElement.classList.add('pure-u-0'); | ||
646 | formElement.classList.remove('pure-u-0'); | ||
647 | } | ||
648 | }; | ||
649 | |||
650 | const bulkCreationForm = document.querySelector('.addlink-batch-form-block'); | ||
651 | |||
652 | toggleBulkCreationVisibility(bulkCreationButton, bulkCreationForm); | ||
653 | bulkCreationButton.querySelector('a').addEventListener('click', (e) => { | ||
654 | e.preventDefault(); | ||
655 | toggleBulkCreationVisibility(bulkCreationButton, bulkCreationForm); | ||
656 | }); | ||
657 | } | ||
637 | })(); | 658 | })(); |
diff --git a/assets/default/scss/shaarli.scss b/assets/default/scss/shaarli.scss index 7dc61903..7c85dee8 100644 --- a/assets/default/scss/shaarli.scss +++ b/assets/default/scss/shaarli.scss | |||
@@ -1023,6 +1023,10 @@ body, | |||
1023 | &.button-red { | 1023 | &.button-red { |
1024 | background: $red; | 1024 | background: $red; |
1025 | } | 1025 | } |
1026 | |||
1027 | &.button-grey { | ||
1028 | background: $light-grey; | ||
1029 | } | ||
1026 | } | 1030 | } |
1027 | 1031 | ||
1028 | .submit-buttons { | 1032 | .submit-buttons { |
@@ -1083,6 +1087,11 @@ body, | |||
1083 | position: absolute; | 1087 | position: absolute; |
1084 | right: 5%; | 1088 | right: 5%; |
1085 | } | 1089 | } |
1090 | |||
1091 | &.button-grey { | ||
1092 | position: absolute; | ||
1093 | left: 5%; | ||
1094 | } | ||
1086 | } | 1095 | } |
1087 | } | 1096 | } |
1088 | } | 1097 | } |
@@ -1750,6 +1759,46 @@ form { | |||
1750 | } | 1759 | } |
1751 | } | 1760 | } |
1752 | 1761 | ||
1762 | // Batch creation | ||
1763 | input[name='save_edit_batch'] { | ||
1764 | @extend %page-form-button; | ||
1765 | } | ||
1766 | |||
1767 | .addlink-batch-show-more { | ||
1768 | display: flex; | ||
1769 | align-items: center; | ||
1770 | margin: 20px 0 8px; | ||
1771 | |||
1772 | a { | ||
1773 | color: var(--main-color); | ||
1774 | text-decoration: none; | ||
1775 | } | ||
1776 | |||
1777 | &::before, | ||
1778 | &::after { | ||
1779 | content: ""; | ||
1780 | flex-grow: 1; | ||
1781 | background: rgba(0, 0, 0, 0.35); | ||
1782 | height: 1px; | ||
1783 | font-size: 0; | ||
1784 | line-height: 0; | ||
1785 | } | ||
1786 | |||
1787 | &::before { | ||
1788 | margin: 0 16px 0 0; | ||
1789 | } | ||
1790 | |||
1791 | &::after { | ||
1792 | margin: 0 0 0 16px; | ||
1793 | } | ||
1794 | } | ||
1795 | |||
1796 | .addlink-batch-form-block { | ||
1797 | .pure-alert { | ||
1798 | margin: 25px 0 0 0; | ||
1799 | } | ||
1800 | } | ||
1801 | |||
1753 | // Print rules | 1802 | // Print rules |
1754 | @media print { | 1803 | @media print { |
1755 | .shaarli-menu { | 1804 | .shaarli-menu { |