From f8d3764d5eb555e3b7ff2d21916e22988588f69c Mon Sep 17 00:00:00 2001
From: Robin Ward <robin.ward@gmail.com>
Date: Wed, 14 Jan 2015 15:36:38 -0500
Subject: [PATCH] Convert many buttons to `d-button`
---
.../javascripts/admin/templates/dashboard.hbs | 4 ++--
.../javascripts/admin/templates/reports.hbs | 2 +-
.../discourse/components/d-button.js.es6 | 21 +++++++++++++++----
.../discourse/templates/header.hbs | 8 ++-----
.../discourse/templates/topic-entrance.hbs | 13 ++++++------
.../discourse/templates/topic-progress.hbs | 21 +++++++++++--------
.../javascripts/discourse/templates/topic.hbs | 8 +++----
.../discourse/templates/user-dropdown.hbs | 2 +-
.../discourse/templates/user/user.hbs | 9 +++-----
app/assets/stylesheets/common/base/topic.scss | 10 +++++++--
10 files changed, 57 insertions(+), 41 deletions(-)
diff --git a/app/assets/javascripts/admin/templates/dashboard.hbs b/app/assets/javascripts/admin/templates/dashboard.hbs
index b788bb08f..a2e8479f9 100644
--- a/app/assets/javascripts/admin/templates/dashboard.hbs
+++ b/app/assets/javascripts/admin/templates/dashboard.hbs
@@ -118,7 +118,7 @@
</p>
<p class="actions">
<small>{{i18n 'admin.dashboard.last_checked'}}: {{problemsTimestamp}}</small>
- <button {{action "refreshProblems"}} class="btn btn-small"><i class="fa fa-refresh"></i>{{i18n 'admin.dashboard.refresh_problems'}}</button>
+ {{d-button action="refreshProblems" class="btn-small" icon="refresh" label="admin.dashboard.refresh_problems"}}
</p>
</div>
<div class="clearfix"></div>
@@ -130,7 +130,7 @@
<div class="problem-messages">
<p>
{{i18n 'admin.dashboard.no_problems'}}
- <button {{action "refreshProblems"}} class="btn btn-small"><i class="fa fa-refresh"></i>{{i18n 'admin.dashboard.refresh_problems'}}</button>
+ {{d-button action="refreshProblems" class="btn-small" icon="refresh" label="admin.dashboard.refresh_problems"}}
</p>
</div>
<div class="clearfix"></div>
diff --git a/app/assets/javascripts/admin/templates/reports.hbs b/app/assets/javascripts/admin/templates/reports.hbs
index 98e709740..e4fdc87cb 100644
--- a/app/assets/javascripts/admin/templates/reports.hbs
+++ b/app/assets/javascripts/admin/templates/reports.hbs
@@ -3,7 +3,7 @@
<div>
{{i18n 'admin.dashboard.reports.start_date'}} {{input type="date" value=startDate}}
{{i18n 'admin.dashboard.reports.end_date'}} {{input type="date" value=endDate}}
- <button {{action "refreshReport"}} class='btn btn-primary'>{{i18n 'admin.dashboard.reports.refresh_report'}}</button>
+ {{d-button action="refreshReport" class="btn-primary" label="admin.dashboard.reports.refresh_report" icon="refresh"}}
</div>
<div class='view-options'>
diff --git a/app/assets/javascripts/discourse/components/d-button.js.es6 b/app/assets/javascripts/discourse/components/d-button.js.es6
index b5a306dab..fa923a2ca 100644
--- a/app/assets/javascripts/discourse/components/d-button.js.es6
+++ b/app/assets/javascripts/discourse/components/d-button.js.es6
@@ -3,13 +3,26 @@ import { iconHTML } from 'discourse/helpers/fa-icon';
export default Ember.Component.extend({
tagName: 'button',
classNameBindings: [':btn'],
+ attributeBindings: ['disabled', 'translatedTitle:title'],
+
+ translatedTitle: function() {
+ var label = this.get('label');
+ if (label) {
+ return I18n.t(this.get('label'));
+ }
+ }.property('label'),
render: function(buffer) {
- var icon = this.get('icon');
- if (icon) {
- buffer.push(iconHTML(icon) + ' ');
+ var title = this.get('translatedTitle'),
+ icon = this.get('icon');
+
+ if (title || icon) {
+ if (icon) { buffer.push(iconHTML(icon) + ' '); }
+ if (title) { buffer.push(title); }
+ } else {
+ // If no label or icon is present, yield
+ return this._super();
}
- buffer.push(I18n.t(this.get('label')));
},
click: function() {
diff --git a/app/assets/javascripts/discourse/templates/header.hbs b/app/assets/javascripts/discourse/templates/header.hbs
index d7f3412e2..0cffe50fe 100644
--- a/app/assets/javascripts/discourse/templates/header.hbs
+++ b/app/assets/javascripts/discourse/templates/header.hbs
@@ -6,13 +6,9 @@
<div class='panel clearfix'>
{{#unless currentUser}}
{{#if showSignUpButton}}
- <button {{action "showCreateAccount"}} class='btn btn-primary btn-small sign-up-button'>
- {{i18n 'sign_up'}}
- </button>
+ {{d-button action="showCreateAccount" class="btn-primary btn-small sign-up-button" label="sign_up"}}
{{/if}}
- <button {{action "showLogin"}} class='btn btn-primary btn-small login-button'>
- {{fa-icon "user"}} {{i18n 'log_in'}}
- </button>
+ {{d-button action="showLogin" class="btn-primary btn-small login-button" icon="user" label="log_in"}}
{{/unless}}
<ul class='icons clearfix' role='navigation'>
{{#if currentUser}}
diff --git a/app/assets/javascripts/discourse/templates/topic-entrance.hbs b/app/assets/javascripts/discourse/templates/topic-entrance.hbs
index 8613848bb..3dbe96f87 100644
--- a/app/assets/javascripts/discourse/templates/topic-entrance.hbs
+++ b/app/assets/javascripts/discourse/templates/topic-entrance.hbs
@@ -1,6 +1,7 @@
-<button {{action "enterTop"}} class='btn full no-text jump-top'>
- <i class='fa fa-caret-up'></i> {{{topDate}}}
-</button>
-<button {{action "enterBottom"}} class='btn full no-text jump-bottom'>
- {{{bottomDate}}} <i class='fa fa-caret-down'></i>
-</button>
+{{#d-button action="enterTop" class="full no-text jump-top"}}
+ {{fa-icon 'caret-up'}} {{{topDate}}}
+{{/d-button}}
+
+{{#d-button action="enterBottom" class="full no-text jump-button"}}
+ {{{bottomDate}}} {{fa-icon 'caret-down'}}
+{{/d-button}}
diff --git a/app/assets/javascripts/discourse/templates/topic-progress.hbs b/app/assets/javascripts/discourse/templates/topic-progress.hbs
index ab575a641..b89137608 100644
--- a/app/assets/javascripts/discourse/templates/topic-progress.hbs
+++ b/app/assets/javascripts/discourse/templates/topic-progress.hbs
@@ -1,16 +1,19 @@
{{#if expanded}}
<nav id='topic-progress-expanded'>
- <button {{action "jumpTop"}} {{bind-attr disabled=jumpTopDisabled}} class='btn full no-text'>
- <i class="fa fa-caret-up"></i>
- {{i18n 'topic.progress.go_top'}}
- </button>
+ {{d-button action="jumpTop"
+ disabled=jumpTopDisabled
+ class="full no-text"
+ icon="caret-up"
+ label="topic.progress.go_top"}}
<div class='jump-form'>
- {{input value=toPostIndex}} <button {{action "jumpPost"}} class='btn'>{{i18n 'topic.progress.go'}}</button>
+ {{input value=toPostIndex}}
+ {{d-button action="jumpPost" label="topic.progress.go"}}
</div>
- <button {{action "jumpBottom"}} {{bind-attr disabled=jumpBottomDisabled}} class='btn full no-text jump-bottom'>
- {{i18n 'topic.progress.go_bottom'}}
- <i class="fa fa-caret-down"></i>
- </button>
+ {{d-button action="jumpBottom"
+ disabled=jumpBottomDisabled
+ class="full no-text jump-bottom"
+ icon="caret-down"
+ label="topic.progress.go_bottom"}}
</nav>
{{/if}}
<nav id='topic-progress' title="{{i18n 'topic.progress.title'}}" {{bind-attr class="hideProgress:hidden"}}>
diff --git a/app/assets/javascripts/discourse/templates/topic.hbs b/app/assets/javascripts/discourse/templates/topic.hbs
index 252a1cdc6..8af8ac195 100644
--- a/app/assets/javascripts/discourse/templates/topic.hbs
+++ b/app/assets/javascripts/discourse/templates/topic.hbs
@@ -22,8 +22,8 @@
{{plugin-outlet "edit-topic"}}
- <button class='btn btn-primary btn-small no-text' {{action "finishedEditingTopic"}}>{{fa-icon "check"}}</button>
- <button class='btn btn-small no-text' {{action "cancelEditingTopic"}}>{{fa-icon "times"}}</button>
+ {{d-button action="finishedEditingTopic" class="btn-primary btn-small no-text" icon="check"}}
+ {{d-button action="cancelEditingTopic" class="btn-small no-text" icon="times"}}
{{else}}
<h1>
{{#unless is_warning}}
@@ -118,10 +118,10 @@
<div>{{message}}</div>
{{#if noRetry}}
{{#unless currentUser}}
- <button {{action "showLogin"}} class='btn btn-primary topic-retry'>{{fa-icon "user"}} {{i18n 'log_in'}}</button>
+ {{d-button action="showLogin" class="btn-primary topic-retry" icon="user" label="log_in"}}
{{/unless}}
{{else}}
- <button class="btn btn-primary topic-retry" {{action "retryLoading"}}>{{fa-icon "refresh"}} {{i18n 'errors.buttons.again'}}</button>
+ {{d-button action="retryLoading" class="btn-primary topic-retry" icon="refresh" label="errors.buttons.again"}}
{{/if}}
</div>
{{loading-spinner condition=retrying}}
diff --git a/app/assets/javascripts/discourse/templates/user-dropdown.hbs b/app/assets/javascripts/discourse/templates/user-dropdown.hbs
index 9b3323d40..12d2fe78d 100644
--- a/app/assets/javascripts/discourse/templates/user-dropdown.hbs
+++ b/app/assets/javascripts/discourse/templates/user-dropdown.hbs
@@ -8,6 +8,6 @@
</li>
<li>{{#link-to 'userActivity.bookmarks' currentUser}}{{i18n 'user.bookmarks'}}{{/link-to}}</li>
<li>{{#link-to 'preferences' currentUser}}{{i18n 'user.preferences'}}{{/link-to}}</li>
- <li><button {{action "logout"}} class='btn btn-danger right logout'><i class='fa fa-sign-out'></i>{{i18n 'user.log_out'}}</button></li>
+ <li>{{d-button action="logout" class="btn-danger right logout" icon="sign-out" label="user.log_out"}}</li>
</ul>
</section>
diff --git a/app/assets/javascripts/discourse/templates/user/user.hbs b/app/assets/javascripts/discourse/templates/user/user.hbs
index 7c64ec6e6..6f54dbfcd 100644
--- a/app/assets/javascripts/discourse/templates/user/user.hbs
+++ b/app/assets/javascripts/discourse/templates/user/user.hbs
@@ -117,7 +117,7 @@
{{#if email}}
{{email}}
{{else}}
- <button class="btn btn-primary" title="{{i18n 'admin.users.check_email.title'}}" {{action "checkEmail" this}}>{{fa-icon "envelope-o"}} {{i18n 'admin.users.check_email.text'}}</button>
+ {{d-button action="checkEmail" icon="envelope-o" label="admin.users.check_email.text" class="btn-primary"}}
{{/if}}
</dd>
{{/if}}
@@ -130,10 +130,7 @@
</dd>
{{/if}}
{{#if canDeleteUser}}
- <button class="btn btn-danger" {{action "adminDelete"}}>
- <i class="fa fa-exclamation-triangle"></i>
- {{i18n 'user.admin_delete'}}
- </button>
+ {{d-button action="adminDelete" icon="exclamation-triangle" label="user.admin_delete" class="btn-danger"}}
{{/if}}
</dl>
{{plugin-outlet "user-profile-secondary"}}
@@ -192,7 +189,7 @@
{{#if viewingSelf}}
<div class='user-archive'>
- <button {{action "exportUserArchive"}} class="btn" title="{{i18n 'user.download_archive'}}">{{fa-icon "download"}} {{i18n 'user.download_archive'}}</button>
+ {{d-button action="exportUserArchive" label="user.download_archive" icon="download"}}
</div>
{{/if}}
</section>
diff --git a/app/assets/stylesheets/common/base/topic.scss b/app/assets/stylesheets/common/base/topic.scss
index 0bb00feee..1afcedb7f 100644
--- a/app/assets/stylesheets/common/base/topic.scss
+++ b/app/assets/stylesheets/common/base/topic.scss
@@ -1,10 +1,16 @@
#topic-title {
- .title-wrapper {float: left; width: 90%;}
+ .title-wrapper {
+ float: left;
+ width: 90%;
+ .btn-small {
+ margin: 0 6px 0 0;
+ }
+ }
a.badge-category {
margin-top: 5px;
- }
+ }
a.edit-topic i { font-size: 0.8em; }
}