ES6: Convert all button views

app/assets/javascripts/discourse/templates/navigation/category.js.handlebars

@@ -8,7 +8,7 @@
 </ul>
 
 {{#if canChangeCategoryNotificationLevel}}
-  {{view Discourse.CategoryNotificationsButton category=category}}
+  {{view 'category-notifications-button' category=category}}
 {{/if}}
 
 {{#if canCreateTopic}}

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}}
               <div id='suggested-topics'>

app/assets/javascripts/discourse/views/button.js.es6

@@ -1,12 +1,4 @@
-/**
+export default Discourse.View.extend({
-  This view handles rendering of a button
-
-  @class ButtonView
-  @extends Discourse.View
-  @namespace Discourse
-  @module Discourse
-**/
-Discourse.ButtonView = 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'));
   }
-
 });
-
-

app/assets/javascripts/discourse/views/category-notifications-button.js.es6

@@ -1,12 +1,6 @@
-/**
+import NotificationsButton from 'discourse/views/notifications-button';
-  A button to display notification options for categories.
 
-  @class NotificationsButton
+export default NotificationsButton.extend({
-  @extends Discourse.DropdownButtonView
-  @namespace Discourse
-  @module Discourse
-**/
-Discourse.CategoryNotificationsButton = Discourse.NotificationsButton.extend({
   classNames: ['notification-options', 'category-notification-menu'],
   buttonIncludesText: false,
   longDescriptionBinding: null,

app/assets/javascripts/discourse/views/dropdown-button.js.es6

@@ -1,12 +1,4 @@
-/**
+export default Discourse.View.extend({
-  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({
   classNameBindings: [':btn-group', 'hidden'],
   shouldRerender: Discourse.View.renderIfChanged('text', 'longDescription'),
 

app/assets/javascripts/discourse/views/flag-topic-button.js.es6

@@ -1,12 +1,6 @@
-/**
+import ButtonView from 'discourse/views/button';
-  A button for flagging a topic
 
-  @class FlagTopicButton
+export default ButtonView.extend({
-  @extends Discourse.ButtonView
-  @namespace Discourse
-  @module Discourse
-**/
-Discourse.FlagTopicButton = Discourse.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("<i class='fa fa-flag'></i>");
   }
 });
-

app/assets/javascripts/discourse/views/invite-reply-button.js.es6

@@ -1,12 +1,6 @@
-/**
+import ButtonView from 'discourse/views/button';
-  A button for inviting users to reply to a topic
 
-  @class InviteReplyButton
+export default ButtonView.extend({
-  @extends Discourse.ButtonView
-  @namespace Discourse
-  @module Discourse
-**/
-Discourse.InviteReplyButton = Discourse.ButtonView.extend({
   textKey: 'topic.invite_reply.title',
   helpKey: 'topic.invite_reply.help',
   attributeBindings: ['disabled'],

app/assets/javascripts/discourse/views/login-reply-button.js.es6

@@ -1,12 +1,6 @@
-/**
+import ButtonView from 'discourse/views/button';
-  A button prompting users to login to reply to a topic
 
-  @class LoginReplyButton
+export default ButtonView.extend({
-  @extends Discourse.ButtonView
-  @namespace Discourse
-  @module Discourse
-**/
-Discourse.LoginReplyButton = Discourse.ButtonView.extend({
   textKey: 'topic.login_reply',
   classNames: ['btn', 'btn-primary', 'create'],
   click: function() {

app/assets/javascripts/discourse/views/notifications-button.js.es6

@@ -1,12 +1,6 @@
-/**
+import DropdownButtonView from 'discourse/views/dropdown-button';
-  A button to display notification options.
 
-  @class NotificationsButton
+export default DropdownButtonView.extend({
-  @extends Discourse.DropdownButtonView
-  @namespace Discourse
-  @module Discourse
-**/
-Discourse.NotificationsButton = Discourse.DropdownButtonView.extend({
   classNames: ['notification-options'],
   title: '',
   buttonIncludesText: true,
@@ -76,4 +70,3 @@ Discourse.NotificationsButton = Discourse.DropdownButtonView.extend({
   }
 
 });
-

app/assets/javascripts/discourse/views/pinned-button.js.es6

@@ -1,12 +1,6 @@
-/**
+import DropdownButtonView from 'discourse/views/dropdown-button';
-  A button to display pinned options.
 
-  @class PinnedButton
+export default DropdownButtonView.extend({
-  @extends Discourse.DropdownButtonView
-  @namespace Discourse
-  @module Discourse
-**/
-Discourse.PinnedButton = Discourse.DropdownButtonView.extend({
   descriptionKey: 'help',
   classNames: ['pinned-options'],
   title: '',
@@ -62,4 +56,3 @@ Discourse.PinnedButton = Discourse.DropdownButtonView.extend({
   }
 
 });
-

app/assets/javascripts/discourse/views/reply-button.js.es6

@@ -1,12 +1,6 @@
-/**
+import ButtonView from 'discourse/views/button';
-  A button for replying to a topic
 
-  @class ReplyButton
+export default ButtonView.extend({
-  @extends Discourse.ButtonView
-  @namespace Discourse
-  @module Discourse
-**/
-Discourse.ReplyButton = Discourse.ButtonView.extend({
   classNames: ['btn', 'btn-primary', 'create'],
   helpKey: 'topic.reply.help',
 

app/assets/javascripts/discourse/views/share-button.js.es6

@@ -1,12 +1,6 @@
-/**
+import ButtonView from 'discourse/views/button';
-  A button for sharing a link to a topic
 
-  @class ShareButton
+export default ButtonView.extend({
-  @extends Discourse.ButtonView
-  @namespace Discourse
-  @module Discourse
-**/
-Discourse.ShareButton = Discourse.ButtonView.extend({
   classNames: ['share'],
   textKey: 'topic.share.title',
   helpKey: 'topic.share.help',

app/assets/javascripts/discourse/views/star-button.js.es6

@@ -1,12 +1,6 @@
-/**
+import ButtonView from 'discourse/views/button';
-  A button for starring a topic
 
-  @class StarButton
+export default ButtonView.extend({
-  @extends Discourse.ButtonView
-  @namespace Discourse
-  @module Discourse
-**/
-Discourse.StarButton = Discourse.ButtonView.extend({
   classNames: ['star'],
   textKey: 'starred.title',
   helpKeyBinding: 'controller.starTooltipKey',

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);
+    }
+  }
+});
+
+

app/assets/javascripts/discourse/views/topic-notifications-button.js.es6

@@ -1,12 +1,6 @@
-/**
+import NotificationsButton from 'discourse/views/notifications-button';
-  A button to display topic notification options.
 
-  @class TopicNotificationsButton
+export default NotificationsButton.extend({
-  @extends Discourse.NotificationsButton
-  @namespace Discourse
-  @module Discourse
-**/
-Discourse.TopicNotificationsButton = Discourse.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);
   }
 });
-

app/assets/javascripts/discourse/views/topic_footer_buttons_view.js

@@ -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);
-    }
-  }
-});
-
-

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/button
-//= require ./discourse/views/buttons/dropdown_button_view
+//= require ./discourse/views/dropdown-button
-//= require ./discourse/views/buttons/notifications_button
+//= require ./discourse/views/notifications-button
 //= require ./discourse/views/pagedown-preview
 //= require ./discourse/routes/discourse_route
 //= require ./discourse/routes/discourse_restricted_user_route