diff --git a/extensions/tags/.gitignore b/extensions/tags/.gitignore
index 7f43257e7..6d7bdf860 100644
--- a/extensions/tags/.gitignore
+++ b/extensions/tags/.gitignore
@@ -4,3 +4,4 @@ composer.phar
Thumbs.db
node_modules
js/dist/*
+composer.lock
diff --git a/extensions/tags/js/src/forum/components/TagDiscussionModal.js b/extensions/tags/js/src/forum/components/TagDiscussionModal.js
index 3b020b1ac..59c6a73b8 100644
--- a/extensions/tags/js/src/forum/components/TagDiscussionModal.js
+++ b/extensions/tags/js/src/forum/components/TagDiscussionModal.js
@@ -12,6 +12,7 @@ import tagLabel from '../../common/helpers/tagLabel';
import tagIcon from '../../common/helpers/tagIcon';
import sortTags from '../../common/utils/sortTags';
import getSelectableTags from '../utils/getSelectableTags';
+import ToggleButton from './ToggleButton';
export default class TagDiscussionModal extends Modal {
oninit(vnode) {
@@ -28,6 +29,8 @@ export default class TagDiscussionModal extends Modal {
this.minSecondary = app.forum.attribute('minSecondaryTags');
this.maxSecondary = app.forum.attribute('maxSecondaryTags');
+ this.bypassReqs = false;
+
this.navigator = new KeyboardNavigatable();
this.navigator
.onUp(() => this.setIndex(this.getCurrentNumericIndex() - 1, true))
@@ -109,7 +112,7 @@ export default class TagDiscussionModal extends Modal {
}
getInstruction(primaryCount, secondaryCount) {
- if (app.forum.attribute('canBypassTagCounts')) {
+ if (this.bypassReqs) {
return '';
}
@@ -128,7 +131,7 @@ export default class TagDiscussionModal extends Modal {
if (this.tagsLoading) {
return ;
}
-
+
let tags = this.tags;
const filter = this.filter().toLowerCase();
const primaryCount = this.primaryCount();
@@ -143,11 +146,11 @@ export default class TagDiscussionModal extends Modal {
// If the number of selected primary/secondary tags is at the maximum, then
// we'll filter out all other tags of that type.
- if (primaryCount >= this.maxPrimary && !app.forum.attribute('canBypassTagCounts')) {
+ if (primaryCount >= this.maxPrimary && !this.bypassReqs) {
tags = tags.filter(tag => !tag.isPrimary() || this.selected.includes(tag));
}
- if (secondaryCount >= this.maxSecondary && !app.forum.attribute('canBypassTagCounts')) {
+ if (secondaryCount >= this.maxSecondary && !this.bypassReqs) {
tags = tags.filter(tag => tag.isPrimary() || this.selected.includes(tag));
}
@@ -225,12 +228,19 @@ export default class TagDiscussionModal extends Modal {
))}
+ {!!app.forum.attribute('canBypassTagCounts') && (
+
+ this.bypassReqs = !this.bypassReqs} isToggled={this.bypassReqs}>
+ {app.translator.trans('flarum-tags.forum.choose_tags.bypass_requirements')}
+
+
+ )}
];
}
meetsRequirements(primaryCount, secondaryCount) {
- if (app.forum.attribute('canBypassTagCounts')) {
+ if (this.bypassReqs) {
return true;
}
diff --git a/extensions/tags/js/src/forum/components/ToggleButton.js b/extensions/tags/js/src/forum/components/ToggleButton.js
new file mode 100644
index 000000000..cbf4904ff
--- /dev/null
+++ b/extensions/tags/js/src/forum/components/ToggleButton.js
@@ -0,0 +1,19 @@
+import Component from 'flarum/common/Component';
+import Button from 'flarum/common/components/Button';
+import classList from 'flarum/common/utils/classList';
+
+/**
+ * @TODO move to core
+ */
+export default class ToggleButton extends Component {
+ view(vnode) {
+ const { className, isToggled, ...attrs } = this.attrs;
+ const icon = isToggled ? 'far fa-check-circle' : 'far fa-circle';
+
+ return (
+
+ );
+ }
+}
diff --git a/extensions/tags/less/forum.less b/extensions/tags/less/forum.less
index 49f48a7d6..f1a34a8e2 100644
--- a/extensions/tags/less/forum.less
+++ b/extensions/tags/less/forum.less
@@ -4,6 +4,7 @@
@import "forum/TagDiscussionModal";
@import "forum/TagHero";
@import "forum/TagTiles";
+@import "forum/ToggleButton";
.Button--tagColored {
--button-primary-bg: var(--color);
diff --git a/extensions/tags/less/forum/TagDiscussionModal.less b/extensions/tags/less/forum/TagDiscussionModal.less
index 39e0f1c53..50e6f62f1 100644
--- a/extensions/tags/less/forum/TagDiscussionModal.less
+++ b/extensions/tags/less/forum/TagDiscussionModal.less
@@ -22,6 +22,10 @@
padding: 1px 0 0;
text-align: left;
}
+
+ &-controls {
+ padding: 20px;
+ }
}
@media @tablet, @desktop, @desktop-hd {
diff --git a/extensions/tags/less/forum/ToggleButton.less b/extensions/tags/less/forum/ToggleButton.less
new file mode 100644
index 000000000..35d43a222
--- /dev/null
+++ b/extensions/tags/less/forum/ToggleButton.less
@@ -0,0 +1,7 @@
+:root {
+ .Button--color-vars(@control-bg, @control-color, 'button-toggled');
+}
+
+.Button--toggled {
+ .Button--color-auto('button-toggled');
+}
diff --git a/extensions/tags/locale/en.yml b/extensions/tags/locale/en.yml
index b20404341..b7656c550 100644
--- a/extensions/tags/locale/en.yml
+++ b/extensions/tags/locale/en.yml
@@ -66,6 +66,7 @@ flarum-tags:
# These translations are used by the Choose Tags modal dialog.
choose_tags:
+ bypass_requirements: Bypass tag requirements
choose_primary_placeholder: "{count, plural, one {Choose a primary tag} other {Choose # primary tags}}"
choose_secondary_placeholder: "{count, plural, one {Choose 1 more tag} other {Choose # more tags}}"
edit_title: "Edit Tags for {title}"