FIX: keeps as much as possible the same api for select-box components

This commit is contained in:
Joffrey JAFFEUX 2017-09-09 20:29:07 +02:00 committed by GitHub
parent e6d3bbfa1d
commit 950b9e9eaf
28 changed files with 68 additions and 70 deletions

View File

@ -122,7 +122,7 @@
<div>
<label>{{i18n 'groups.notification_level'}}</label>
{{notification-options i18nPrefix='groups.notifications' value=model.default_notification_level}}
{{notifications-button i18nPrefix='groups.notifications' value=model.default_notification_level}}
<div class='clearfix'></div>
</div>

View File

@ -4,7 +4,7 @@ import computed from "ember-addons/ember-computed-decorators";
import { observes } from "ember-addons/ember-computed-decorators";
export default DropdownSelectBoxComponent.extend({
classNames: ["categories-admin-actions"],
classNames: ["categories-admin-dropdown"],
icon: `${iconHTML('bars')}${iconHTML('caret-down')}`.htmlSafe(),

View File

@ -1,10 +1,10 @@
import NotificationOptionsComponent from "discourse/components/notification-options";
import { observes } from "ember-addons/ember-computed-decorators";
import NotificationOptionsComponent from "discourse/components/notifications-button";
import { on, observes } from "ember-addons/ember-computed-decorators";
import computed from "ember-addons/ember-computed-decorators";
import { iconHTML } from "discourse-common/lib/icon-library";
export default NotificationOptionsComponent.extend({
classNames: ["category-notification-options"],
classNames: ["category-notifications-button"],
classNameBindings: ["hidden:is-hidden"],
hidden: Ember.computed.or("category.deleted", "site.isMobileDevice"),

View File

@ -1,8 +1,8 @@
import NotificationOptionsComponent from "discourse/components/notification-options";
import NotificationOptionsComponent from "discourse/components/notifications-button";
import { observes } from "ember-addons/ember-computed-decorators";
export default NotificationOptionsComponent.extend({
classNames: ["group-notification-options"],
classNames: ["group-notifications-button"],
value: Em.computed.alias("group.group_user.notification_level"),

View File

@ -5,7 +5,7 @@ import { buttonDetails } from "discourse/lib/notification-levels";
import { allLevels } from "discourse/lib/notification-levels";
export default DropdownSelectBoxComponent.extend({
classNames: ["notification-options"],
classNames: ["notifications-button"],
i18nPrefix: "",
i18nPostfix: "",
@ -14,6 +14,8 @@ export default DropdownSelectBoxComponent.extend({
fullWidthOnMobile: true,
content: allLevels,
value: Em.computed.alias("notificationLevel"),
@computed("value")
icon(value) {
const details = buttonDetails(value);

View File

@ -1,10 +1,10 @@
import NotificationOptionsComponent from "discourse/components/notification-options";
import NotificationOptionsComponent from "discourse/components/notifications-button";
import { observes } from "ember-addons/ember-computed-decorators";
import computed from "ember-addons/ember-computed-decorators";
import { iconHTML } from "discourse-common/lib/icon-library";
export default NotificationOptionsComponent.extend({
classNames: ["tag-notification-options"],
classNames: ["tag-notifications-button"],
i18nPrefix: "tagging.notifications",

View File

@ -1,9 +0,0 @@
export default Ember.Component.extend({
layoutName: "components/topic-notification-options-button",
classNames: ["topic-notification-options-button"],
showFullTitle: true,
appendReason: true,
});

View File

@ -0,0 +1,9 @@
export default Ember.Component.extend({
layoutName: "components/topic-notifications-button",
classNames: ["topic-notifications-button"],
showFullTitle: true,
appendReason: true,
});

View File

@ -1,10 +1,10 @@
import NotificationOptionsComponent from "discourse/components/notification-options";
import NotificationOptionsComponent from "discourse/components/notifications-button";
import { observes, on } from "ember-addons/ember-computed-decorators";
import computed from "ember-addons/ember-computed-decorators";
import { topicLevels, buttonDetails } from "discourse/lib/notification-levels";
export default NotificationOptionsComponent.extend({
classNames: ["topic-notification-options"],
classNames: ["topic-notifications-options"],
content: topicLevels,
i18nPrefix: "topic.notifications",
@ -16,7 +16,7 @@ export default NotificationOptionsComponent.extend({
@on("didInsertElement")
_bindGlobalLevelChanged() {
this.appEvents.on("topic-notifications-options:changed", (msg) => {
this.appEvents.on("topic-notifications-button:changed", (msg) => {
if (msg.type === "notification") {
if (this.get("topic.details.notification_level") !== msg.id) {
this.get("topic.details").updateNotifications(msg.id);
@ -27,12 +27,12 @@ export default NotificationOptionsComponent.extend({
@on("willDestroyElement")
_unbindGlobalLevelChanged() {
this.appEvents.off("topic-notifications-options:changed");
this.appEvents.off("topic-notifications-button:changed");
},
@observes("value")
_notificationLevelChanged() {
this.appEvents.trigger("topic-notifications-options:changed", {type: "notification", id: this.get("value")});
this.appEvents.trigger("topic-notifications-button:changed", {type: "notification", id: this.get("value")});
},
@observes("topic.details.notification_level")

View File

@ -198,19 +198,19 @@ export default {
},
setTrackingToMuted(event) {
this.appEvents.trigger('topic-notifications-options:changed', {type: 'notification', id: 0, event});
this.appEvents.trigger('topic-notifications-button:changed', {type: 'notification', id: 0, event});
},
setTrackingToRegular(event) {
this.appEvents.trigger('topic-notifications-options:changed', {type: 'notification', id: 1, event});
this.appEvents.trigger('topic-notifications-button:changed', {type: 'notification', id: 1, event});
},
setTrackingToTracking(event) {
this.appEvents.trigger('topic-notifications-options:changed', {type: 'notification', id: 2, event});
this.appEvents.trigger('topic-notifications-button:changed', {type: 'notification', id: 2, event});
},
setTrackingToWatching(event) {
this.appEvents.trigger('topic-notifications-options:changed', {type: 'notification', id: 3, event});
this.appEvents.trigger('topic-notifications-button:changed', {type: 'notification', id: 3, event});
},
sendToTopicListItemView(action) {

View File

@ -77,7 +77,7 @@
{{pinned-button topic=topic}}
</div>
{{topic-notification-options-button topic=topic}}
{{topic-notifications-button topic=topic}}
{{plugin-outlet name="after-topic-footer-buttons"
args=(hash topic=topic)

View File

@ -1,4 +1,4 @@
{{topic-notification-options topic=topic showFullTitle=showFullTitle}}
{{topic-notifications-options topic=topic showFullTitle=showFullTitle}}
{{#if appendReason}}
<p class="reason">

View File

@ -18,7 +18,7 @@
{{navigation-bar navItems=navItems filterMode=filterMode category=category}}
{{#if currentUser}}
{{category-notification-options category=category}}
{{category-notifications-button category=category}}
{{/if}}
{{create-topic-button

View File

@ -6,8 +6,8 @@
<div class="container">
{{#if tagNotification}}
{{#unless additionalTags}}
{{tag-notification-options action="changeTagNotification"
value=tagNotification.notification_level}}
{{tag-notifications-button action="changeTagNotification"
notificationLevel=tagNotification.notification_level}}
{{/unless}}
{{/if}}

View File

@ -8,6 +8,6 @@
{{i18n "topic.unsubscribe.change_notification_state"}}
</p>
{{topic-notification-options-button topic=model}}
{{topic-notifications-button topic=model}}
</div>
</div>

View File

@ -73,7 +73,7 @@
{{/if}}
{{#if isGroup}}
{{group-notification-options group=group user=model}}
{{group-notifications-button group=group user=model}}
{{/if}}
</div>

View File

@ -315,7 +315,7 @@ createWidget('timeline-footer-controls', {
if (currentUser) {
controls.push(new ComponentConnector(this,
'topic-notification-options-button',
'topic-notifications-button',
{
topic,
appendReason: false,

View File

@ -16,10 +16,12 @@
}
.select-box {
float: right;
margin-top: 0;
margin-left: 5px;
position: relative;
align-self: center;
&.categories-admin-dropdown, &.category-notifications-button, &.tag-notifications-button {
float: right;
margin-left: 8px;
}
}
}

View File

@ -123,7 +123,7 @@
}
.topic-unsubscribe {
.notification-options {
.notifications-button {
display: inline-block;
float: none;
line-height: 2em;

View File

@ -1,9 +0,0 @@
.categories-admin-actions.categories-admin-actions.categories-admin-actions {
.select-box-body {
min-width: auto;
}
.select-box-row .icons .d-icon {
color: dark-light-choose(scale-color($primary, $lightness: 40%), scale-color($secondary, $lightness: 60%));
}
}

View File

@ -0,0 +1,13 @@
.categories-admin-dropdown.categories-admin-dropdown.categories-admin-dropdown {
.select-box-body {
min-width: auto;
}
.select-box-row .icons {
align-self: flex-start;
.d-icon {
color: dark-light-choose(scale-color($primary, $lightness: 40%), scale-color($secondary, $lightness: 60%));
}
}
}

View File

@ -1,3 +0,0 @@
.category-notification-options.category-notification-options.is-hidden {
display: none;
}

View File

@ -0,0 +1,3 @@
.category-notification-button.category-notification-button.is-hidden {
display: none;
}

View File

@ -1,4 +1,4 @@
.notification-options.notification-options.notification-options {
.notifications-button.notifications-button.notifications-button {
.select-box-body {
min-width: 550px;
max-width: 550px;

View File

@ -1,5 +1,5 @@
#topic-footer-buttons {
.topic-notification-options-button {
.topic-notifications-button {
min-width: auto;
margin: 10px 0 15px 0;
@ -14,17 +14,17 @@
}
}
.topic-notification-options-button .topic-notification-options {
.topic-notifications-button .topic-notifications-options {
min-width: auto;
}
.topic-notification-options-button {
.topic-notifications-button {
display: inline-flex;
justify-content: flex-start;
align-items: center;
margin: 0;
.topic-notification-options, .reason {
.topic-notifications-options, .reason {
display: inline-flex;
}
}

View File

@ -451,16 +451,6 @@ a.star {
}
}
.topic-notifications-container {
.btn {
@include topic-footer-button;
}
.notification-options p {
@include topic-footer-buttons-text;
display: inline-block;
}
}
#topic-footer-button {
width: 757px;
}

View File

@ -19,7 +19,7 @@ acceptance("Topic Notifications button", {
QUnit.test("Updating topic notification level", assert => {
visit("/t/internationalization-localization/280");
const notificationOptions = "#topic-footer-buttons .topic-notification-options";
const notificationOptions = "#topic-footer-buttons .topic-notifications-options";
andThen(() => {
assert.ok(
@ -40,7 +40,7 @@ QUnit.test("Updating topic notification level", assert => {
// TODO: tgxworld I can't figure out why the topic timeline doesn't show when
// running the tests in phantomjs
// ok(
// exists(".timeline-footer-controls .notification-options .watching"),
// exists(".timeline-footer-controls .notifications-button .watching"),
// 'it should display the right notification level in topic timeline'
// );
});