From 07ae7435f25afa5d7091e37dcc5222f62d1b1ce9 Mon Sep 17 00:00:00 2001 From: Robin Ward Date: Mon, 23 Jun 2014 12:37:38 -0400 Subject: [PATCH] ES6: Convert all button views --- .../navigation/category.js.handlebars | 2 +- .../discourse/templates/topic.js.handlebars | 2 +- .../{buttons/button_view.js => button.js.es6} | 13 +---- ...s => category-notifications-button.js.es6} | 10 +--- ..._button_view.js => dropdown-button.js.es6} | 10 +--- ...pic_button.js => flag-topic-button.js.es6} | 11 +---- ...y_button.js => invite-reply-button.js.es6} | 10 +--- ...ly_button.js => login-reply-button.js.es6} | 10 +--- ..._button.js => notifications-button.js.es6} | 11 +---- .../pinned_button.js => pinned-button.js.es6} | 11 +---- .../reply_button.js => reply-button.js.es6} | 10 +--- .../share_button.js => share-button.js.es6} | 10 +--- .../star_button.js => star-button.js.es6} | 10 +--- .../views/topic-footer-buttons.js.es6 | 48 +++++++++++++++++++ ...n.js => topic-notifications-button.js.es6} | 11 +---- .../views/topic_footer_buttons_view.js | 47 ------------------ app/assets/javascripts/main_include.js | 6 +-- 17 files changed, 75 insertions(+), 157 deletions(-) rename app/assets/javascripts/discourse/views/{buttons/button_view.js => button.js.es6} (71%) rename app/assets/javascripts/discourse/views/{buttons/category_notifications_button.js => category-notifications-button.js.es6} (63%) rename app/assets/javascripts/discourse/views/{buttons/dropdown_button_view.js => dropdown-button.js.es6} (87%) rename app/assets/javascripts/discourse/views/{buttons/flag_topic_button.js => flag-topic-button.js.es6} (60%) rename app/assets/javascripts/discourse/views/{buttons/invite_reply_button.js => invite-reply-button.js.es6} (63%) rename app/assets/javascripts/discourse/views/{buttons/login_reply_button.js => login-reply-button.js.es6} (51%) rename app/assets/javascripts/discourse/views/{buttons/notifications_button.js => notifications-button.js.es6} (90%) rename app/assets/javascripts/discourse/views/{buttons/pinned_button.js => pinned-button.js.es6} (89%) rename app/assets/javascripts/discourse/views/{buttons/reply_button.js => reply-button.js.es6} (73%) rename app/assets/javascripts/discourse/views/{buttons/share_button.js => share-button.js.es6} (58%) rename app/assets/javascripts/discourse/views/{buttons/star_button.js => star-button.js.es6} (71%) create mode 100644 app/assets/javascripts/discourse/views/topic-footer-buttons.js.es6 rename app/assets/javascripts/discourse/views/{buttons/topic_notifications_button.js => topic-notifications-button.js.es6} (71%) delete mode 100644 app/assets/javascripts/discourse/views/topic_footer_buttons_view.js diff --git a/app/assets/javascripts/discourse/templates/navigation/category.js.handlebars b/app/assets/javascripts/discourse/templates/navigation/category.js.handlebars index ac4d45671dc..74d4e7eb3c9 100644 --- a/app/assets/javascripts/discourse/templates/navigation/category.js.handlebars +++ b/app/assets/javascripts/discourse/templates/navigation/category.js.handlebars @@ -8,7 +8,7 @@ {{#if canChangeCategoryNotificationLevel}} - {{view Discourse.CategoryNotificationsButton category=category}} + {{view 'category-notifications-button' category=category}} {{/if}} {{#if canCreateTopic}} diff --git a/app/assets/javascripts/discourse/templates/topic.js.handlebars b/app/assets/javascripts/discourse/templates/topic.js.handlebars index a3ae5580272..c5b626b0161 100644 --- a/app/assets/javascripts/discourse/templates/topic.js.handlebars +++ b/app/assets/javascripts/discourse/templates/topic.js.handlebars @@ -94,7 +94,7 @@ {{#if postStream.loadedAllPosts}} {{view 'topic-closing' topic=model}} - {{view Discourse.TopicFooterButtonsView topicBinding="model"}} + {{view 'topic-footer-buttons' topic=model}} {{#if details.suggested_topics.length}}
diff --git a/app/assets/javascripts/discourse/views/buttons/button_view.js b/app/assets/javascripts/discourse/views/button.js.es6 similarity index 71% rename from app/assets/javascripts/discourse/views/buttons/button_view.js rename to app/assets/javascripts/discourse/views/button.js.es6 index a2daadfe8a1..d75eabaea17 100644 --- a/app/assets/javascripts/discourse/views/buttons/button_view.js +++ b/app/assets/javascripts/discourse/views/button.js.es6 @@ -1,12 +1,4 @@ -/** - This view handles rendering of a button - - @class ButtonView - @extends Discourse.View - @namespace Discourse - @module Discourse -**/ -Discourse.ButtonView = Discourse.View.extend({ +export default Discourse.View.extend({ tagName: 'button', classNameBindings: [':btn', ':standard', 'dropDownToggle'], attributeBindings: ['title', 'data-toggle', 'data-share-url'], @@ -25,7 +17,4 @@ Discourse.ButtonView = Discourse.View.extend({ } buffer.push(this.get('text')); } - }); - - diff --git a/app/assets/javascripts/discourse/views/buttons/category_notifications_button.js b/app/assets/javascripts/discourse/views/category-notifications-button.js.es6 similarity index 63% rename from app/assets/javascripts/discourse/views/buttons/category_notifications_button.js rename to app/assets/javascripts/discourse/views/category-notifications-button.js.es6 index 684138225ba..b1f9b779854 100644 --- a/app/assets/javascripts/discourse/views/buttons/category_notifications_button.js +++ b/app/assets/javascripts/discourse/views/category-notifications-button.js.es6 @@ -1,12 +1,6 @@ -/** - A button to display notification options for categories. +import NotificationsButton from 'discourse/views/notifications-button'; - @class NotificationsButton - @extends Discourse.DropdownButtonView - @namespace Discourse - @module Discourse -**/ -Discourse.CategoryNotificationsButton = Discourse.NotificationsButton.extend({ +export default NotificationsButton.extend({ classNames: ['notification-options', 'category-notification-menu'], buttonIncludesText: false, longDescriptionBinding: null, diff --git a/app/assets/javascripts/discourse/views/buttons/dropdown_button_view.js b/app/assets/javascripts/discourse/views/dropdown-button.js.es6 similarity index 87% rename from app/assets/javascripts/discourse/views/buttons/dropdown_button_view.js rename to app/assets/javascripts/discourse/views/dropdown-button.js.es6 index 38a382204e8..307183ea78a 100644 --- a/app/assets/javascripts/discourse/views/buttons/dropdown_button_view.js +++ b/app/assets/javascripts/discourse/views/dropdown-button.js.es6 @@ -1,12 +1,4 @@ -/** - This view handles rendering of a button with an associated drop down - - @class DropdownButtonView - @extends Discourse.View - @namespace Discourse - @module Discourse -**/ -Discourse.DropdownButtonView = Discourse.View.extend({ +export default Discourse.View.extend({ classNameBindings: [':btn-group', 'hidden'], shouldRerender: Discourse.View.renderIfChanged('text', 'longDescription'), diff --git a/app/assets/javascripts/discourse/views/buttons/flag_topic_button.js b/app/assets/javascripts/discourse/views/flag-topic-button.js.es6 similarity index 60% rename from app/assets/javascripts/discourse/views/buttons/flag_topic_button.js rename to app/assets/javascripts/discourse/views/flag-topic-button.js.es6 index 7c92385ec37..f6ac7241fc3 100644 --- a/app/assets/javascripts/discourse/views/buttons/flag_topic_button.js +++ b/app/assets/javascripts/discourse/views/flag-topic-button.js.es6 @@ -1,12 +1,6 @@ -/** - A button for flagging a topic +import ButtonView from 'discourse/views/button'; - @class FlagTopicButton - @extends Discourse.ButtonView - @namespace Discourse - @module Discourse -**/ -Discourse.FlagTopicButton = Discourse.ButtonView.extend({ +export default ButtonView.extend({ classNames: ['flag-topic'], textKey: 'topic.flag_topic.title', helpKey: 'topic.flag_topic.help', @@ -19,4 +13,3 @@ Discourse.FlagTopicButton = Discourse.ButtonView.extend({ buffer.push(""); } }); - diff --git a/app/assets/javascripts/discourse/views/buttons/invite_reply_button.js b/app/assets/javascripts/discourse/views/invite-reply-button.js.es6 similarity index 63% rename from app/assets/javascripts/discourse/views/buttons/invite_reply_button.js rename to app/assets/javascripts/discourse/views/invite-reply-button.js.es6 index f2c68555435..fe30c68c96b 100644 --- a/app/assets/javascripts/discourse/views/buttons/invite_reply_button.js +++ b/app/assets/javascripts/discourse/views/invite-reply-button.js.es6 @@ -1,12 +1,6 @@ -/** - A button for inviting users to reply to a topic +import ButtonView from 'discourse/views/button'; - @class InviteReplyButton - @extends Discourse.ButtonView - @namespace Discourse - @module Discourse -**/ -Discourse.InviteReplyButton = Discourse.ButtonView.extend({ +export default ButtonView.extend({ textKey: 'topic.invite_reply.title', helpKey: 'topic.invite_reply.help', attributeBindings: ['disabled'], diff --git a/app/assets/javascripts/discourse/views/buttons/login_reply_button.js b/app/assets/javascripts/discourse/views/login-reply-button.js.es6 similarity index 51% rename from app/assets/javascripts/discourse/views/buttons/login_reply_button.js rename to app/assets/javascripts/discourse/views/login-reply-button.js.es6 index e1abb3e1a42..541ab64130e 100644 --- a/app/assets/javascripts/discourse/views/buttons/login_reply_button.js +++ b/app/assets/javascripts/discourse/views/login-reply-button.js.es6 @@ -1,12 +1,6 @@ -/** - A button prompting users to login to reply to a topic +import ButtonView from 'discourse/views/button'; - @class LoginReplyButton - @extends Discourse.ButtonView - @namespace Discourse - @module Discourse -**/ -Discourse.LoginReplyButton = Discourse.ButtonView.extend({ +export default ButtonView.extend({ textKey: 'topic.login_reply', classNames: ['btn', 'btn-primary', 'create'], click: function() { diff --git a/app/assets/javascripts/discourse/views/buttons/notifications_button.js b/app/assets/javascripts/discourse/views/notifications-button.js.es6 similarity index 90% rename from app/assets/javascripts/discourse/views/buttons/notifications_button.js rename to app/assets/javascripts/discourse/views/notifications-button.js.es6 index 4126f6687a3..73ee182752b 100644 --- a/app/assets/javascripts/discourse/views/buttons/notifications_button.js +++ b/app/assets/javascripts/discourse/views/notifications-button.js.es6 @@ -1,12 +1,6 @@ -/** - A button to display notification options. +import DropdownButtonView from 'discourse/views/dropdown-button'; - @class NotificationsButton - @extends Discourse.DropdownButtonView - @namespace Discourse - @module Discourse -**/ -Discourse.NotificationsButton = Discourse.DropdownButtonView.extend({ +export default DropdownButtonView.extend({ classNames: ['notification-options'], title: '', buttonIncludesText: true, @@ -76,4 +70,3 @@ Discourse.NotificationsButton = Discourse.DropdownButtonView.extend({ } }); - diff --git a/app/assets/javascripts/discourse/views/buttons/pinned_button.js b/app/assets/javascripts/discourse/views/pinned-button.js.es6 similarity index 89% rename from app/assets/javascripts/discourse/views/buttons/pinned_button.js rename to app/assets/javascripts/discourse/views/pinned-button.js.es6 index bf56d637ac9..d3cb74e4062 100644 --- a/app/assets/javascripts/discourse/views/buttons/pinned_button.js +++ b/app/assets/javascripts/discourse/views/pinned-button.js.es6 @@ -1,12 +1,6 @@ -/** - A button to display pinned options. +import DropdownButtonView from 'discourse/views/dropdown-button'; - @class PinnedButton - @extends Discourse.DropdownButtonView - @namespace Discourse - @module Discourse -**/ -Discourse.PinnedButton = Discourse.DropdownButtonView.extend({ +export default DropdownButtonView.extend({ descriptionKey: 'help', classNames: ['pinned-options'], title: '', @@ -62,4 +56,3 @@ Discourse.PinnedButton = Discourse.DropdownButtonView.extend({ } }); - diff --git a/app/assets/javascripts/discourse/views/buttons/reply_button.js b/app/assets/javascripts/discourse/views/reply-button.js.es6 similarity index 73% rename from app/assets/javascripts/discourse/views/buttons/reply_button.js rename to app/assets/javascripts/discourse/views/reply-button.js.es6 index 5488b124e5e..b0a896a5c96 100644 --- a/app/assets/javascripts/discourse/views/buttons/reply_button.js +++ b/app/assets/javascripts/discourse/views/reply-button.js.es6 @@ -1,12 +1,6 @@ -/** - A button for replying to a topic +import ButtonView from 'discourse/views/button'; - @class ReplyButton - @extends Discourse.ButtonView - @namespace Discourse - @module Discourse -**/ -Discourse.ReplyButton = Discourse.ButtonView.extend({ +export default ButtonView.extend({ classNames: ['btn', 'btn-primary', 'create'], helpKey: 'topic.reply.help', diff --git a/app/assets/javascripts/discourse/views/buttons/share_button.js b/app/assets/javascripts/discourse/views/share-button.js.es6 similarity index 58% rename from app/assets/javascripts/discourse/views/buttons/share_button.js rename to app/assets/javascripts/discourse/views/share-button.js.es6 index 42c3ed3869b..93ccdea03af 100644 --- a/app/assets/javascripts/discourse/views/buttons/share_button.js +++ b/app/assets/javascripts/discourse/views/share-button.js.es6 @@ -1,12 +1,6 @@ -/** - A button for sharing a link to a topic +import ButtonView from 'discourse/views/button'; - @class ShareButton - @extends Discourse.ButtonView - @namespace Discourse - @module Discourse -**/ -Discourse.ShareButton = Discourse.ButtonView.extend({ +export default ButtonView.extend({ classNames: ['share'], textKey: 'topic.share.title', helpKey: 'topic.share.help', diff --git a/app/assets/javascripts/discourse/views/buttons/star_button.js b/app/assets/javascripts/discourse/views/star-button.js.es6 similarity index 71% rename from app/assets/javascripts/discourse/views/buttons/star_button.js rename to app/assets/javascripts/discourse/views/star-button.js.es6 index 0803300842a..e08bd14bc50 100644 --- a/app/assets/javascripts/discourse/views/buttons/star_button.js +++ b/app/assets/javascripts/discourse/views/star-button.js.es6 @@ -1,12 +1,6 @@ -/** - A button for starring a topic +import ButtonView from 'discourse/views/button'; - @class StarButton - @extends Discourse.ButtonView - @namespace Discourse - @module Discourse -**/ -Discourse.StarButton = Discourse.ButtonView.extend({ +export default ButtonView.extend({ classNames: ['star'], textKey: 'starred.title', helpKeyBinding: 'controller.starTooltipKey', diff --git a/app/assets/javascripts/discourse/views/topic-footer-buttons.js.es6 b/app/assets/javascripts/discourse/views/topic-footer-buttons.js.es6 new file mode 100644 index 00000000000..67cf9e879e1 --- /dev/null +++ b/app/assets/javascripts/discourse/views/topic-footer-buttons.js.es6 @@ -0,0 +1,48 @@ +import LoginReplyButton from 'discourse/views/login-reply-button'; +import FlagTopicButton from 'discourse/views/flag-topic-button'; +import StarButton from 'discourse/views/star-button'; +import ShareButton from 'discourse/views/share-button'; +import InviteReplyButton from 'discourse/views/invite-reply-button'; +import ReplyButton from 'discourse/views/reply-button'; +import PinnedButton from 'discourse/views/pinned-button'; +import TopicNotificationsButton from 'discourse/views/topic-notifications-button'; + +export default Discourse.ContainerView.extend({ + elementId: 'topic-footer-buttons', + topicBinding: 'controller.content', + + init: function() { + this._super(); + this.createButtons(); + }, + + // Add the buttons below a topic + createButtons: function() { + var topic = this.get('topic'); + if (Discourse.User.current()) { + if (!topic.get('isPrivateMessage')) { + // We hide some controls from private messages + if (this.get('topic.details.can_invite_to') && !this.get('topic.category.read_restricted')) { + this.attachViewClass(InviteReplyButton); + } + this.attachViewClass(StarButton); + this.attachViewClass(ShareButton); + if (this.get('topic.details.can_flag_topic')) { + this.attachViewClass(FlagTopicButton); + } + } + if (this.get('topic.details.can_create_post')) { + this.attachViewClass(ReplyButton); + } + this.attachViewClass(PinnedButton); + this.attachViewClass(TopicNotificationsButton); + + this.trigger('additionalButtons', this); + } else { + // If not logged in give them a login control + this.attachViewClass(LoginReplyButton); + } + } +}); + + diff --git a/app/assets/javascripts/discourse/views/buttons/topic_notifications_button.js b/app/assets/javascripts/discourse/views/topic-notifications-button.js.es6 similarity index 71% rename from app/assets/javascripts/discourse/views/buttons/topic_notifications_button.js rename to app/assets/javascripts/discourse/views/topic-notifications-button.js.es6 index 600b2da0f38..a58ae80dcc6 100644 --- a/app/assets/javascripts/discourse/views/buttons/topic_notifications_button.js +++ b/app/assets/javascripts/discourse/views/topic-notifications-button.js.es6 @@ -1,12 +1,6 @@ -/** - A button to display topic notification options. +import NotificationsButton from 'discourse/views/notifications-button'; - @class TopicNotificationsButton - @extends Discourse.NotificationsButton - @namespace Discourse - @module Discourse -**/ -Discourse.TopicNotificationsButton = Discourse.NotificationsButton.extend({ +export default NotificationsButton.extend({ longDescriptionBinding: 'topic.details.notificationReasonText', topic: Em.computed.alias('controller.model'), target: Em.computed.alias('topic'), @@ -24,4 +18,3 @@ Discourse.TopicNotificationsButton = Discourse.NotificationsButton.extend({ this.get('topic.details').updateNotifications(id); } }); - diff --git a/app/assets/javascripts/discourse/views/topic_footer_buttons_view.js b/app/assets/javascripts/discourse/views/topic_footer_buttons_view.js deleted file mode 100644 index b9d4522ec52..00000000000 --- a/app/assets/javascripts/discourse/views/topic_footer_buttons_view.js +++ /dev/null @@ -1,47 +0,0 @@ -/** - This view is used for rendering the buttons at the footer of the topic - - @class TopicFooterButtonsView - @extends Discourse.ContainerView - @namespace Discourse - @module Discourse -**/ -Discourse.TopicFooterButtonsView = Discourse.ContainerView.extend({ - elementId: 'topic-footer-buttons', - topicBinding: 'controller.content', - - init: function() { - this._super(); - this.createButtons(); - }, - - // Add the buttons below a topic - createButtons: function() { - var topic = this.get('topic'); - if (Discourse.User.current()) { - if (!topic.get('isPrivateMessage')) { - // We hide some controls from private messages - if (this.get('topic.details.can_invite_to') && !this.get('topic.category.read_restricted')) { - this.attachViewClass(Discourse.InviteReplyButton); - } - this.attachViewClass(Discourse.StarButton); - this.attachViewClass(Discourse.ShareButton); - if (this.get('topic.details.can_flag_topic')) { - this.attachViewClass(Discourse.FlagTopicButton); - } - } - if (this.get('topic.details.can_create_post')) { - this.attachViewClass(Discourse.ReplyButton); - } - this.attachViewClass(Discourse.PinnedButton); - this.attachViewClass(Discourse.TopicNotificationsButton); - - this.trigger('additionalButtons', this); - } else { - // If not logged in give them a login control - this.attachViewClass(Discourse.LoginReplyButton); - } - } -}); - - diff --git a/app/assets/javascripts/main_include.js b/app/assets/javascripts/main_include.js index 5b8325915c4..7164dad5b9c 100644 --- a/app/assets/javascripts/main_include.js +++ b/app/assets/javascripts/main_include.js @@ -23,9 +23,9 @@ //= require ./discourse/views/modal/modal_body_view //= require ./discourse/views/modal/flag_view //= require ./discourse/views/combo-box -//= require ./discourse/views/buttons/button_view -//= require ./discourse/views/buttons/dropdown_button_view -//= require ./discourse/views/buttons/notifications_button +//= require ./discourse/views/button +//= require ./discourse/views/dropdown-button +//= require ./discourse/views/notifications-button //= require ./discourse/views/pagedown-preview //= require ./discourse/routes/discourse_route //= require ./discourse/routes/discourse_restricted_user_route