fix all eslint violations in user_tabs.js

This commit is contained in:
Mike Greiling 2017-07-27 14:58:21 -05:00
parent a6732f59e4
commit ffa4cedab6

View file

@ -1,66 +1,59 @@
/* eslint-disable max-len, space-before-function-paren, no-underscore-dangle, consistent-return, comma-dangle, no-unused-vars, dot-notation, no-new, no-return-assign, camelcase, no-param-reassign, class-methods-use-this */
import ActivityCalendar from './activity_calendar';
/*
UserTabs
Handles persisting and restoring the current tab selection and lazily-loading
content on the Users#show page.
### Example Markup
<ul class="nav-links">
<li class="activity-tab active">
<a data-action="activity" data-target="#activity" data-toggle="tab" href="/u/username">
Activity
</a>
</li>
<li class="groups-tab">
<a data-action="groups" data-target="#groups" data-toggle="tab" href="/u/username/groups">
Groups
</a>
</li>
<li class="contributed-tab">
<a data-action="contributed" data-target="#contributed" data-toggle="tab" href="/u/username/contributed">
Contributed projects
</a>
</li>
<li class="projects-tab">
<a data-action="projects" data-target="#projects" data-toggle="tab" href="/u/username/projects">
Personal projects
</a>
</li>
<li class="snippets-tab">
<a data-action="snippets" data-target="#snippets" data-toggle="tab" href="/u/username/snippets">
</a>
</li>
</ul>
<div class="tab-content">
<div class="tab-pane" id="activity">
Activity Content
</div>
<div class="tab-pane" id="groups">
Groups Content
</div>
<div class="tab-pane" id="contributed">
Contributed projects content
</div>
<div class="tab-pane" id="projects">
Projects content
</div>
<div class="tab-pane" id="snippets">
Snippets content
</div>
</div>
<div class="loading-status">
<div class="loading">
Loading Animation
</div>
</div>
*/
/**
* UserTabs
*
* Handles persisting and restoring the current tab selection and lazily-loading
* content on the Users#show page.
*
* ### Example Markup
*
* <ul class="nav-links">
* <li class="activity-tab active">
* <a data-action="activity" data-target="#activity" data-toggle="tab" href="/u/username">
* Activity
* </a>
* </li>
* <li class="groups-tab">
* <a data-action="groups" data-target="#groups" data-toggle="tab" href="/u/username/groups">
* Groups
* </a>
* </li>
* <li class="contributed-tab">
* ...
* </li>
* <li class="projects-tab">
* ...
* </li>
* <li class="snippets-tab">
* ...
* </li>
* </ul>
*
* <div class="tab-content">
* <div class="tab-pane" id="activity">
* Activity Content
* </div>
* <div class="tab-pane" id="groups">
* Groups Content
* </div>
* <div class="tab-pane" id="contributed">
* Contributed projects content
* </div>
* <div class="tab-pane" id="projects">
* Projects content
* </div>
* <div class="tab-pane" id="snippets">
* Snippets content
* </div>
* </div>
*
* <div class="loading-status">
* <div class="loading">
* Loading Animation
* </div>
* </div>
*/
const CALENDAR_TEMPLATE = `
<div class="clearfix calendar">
@ -72,12 +65,12 @@ const CALENDAR_TEMPLATE = `
`;
export default class UserTabs {
constructor ({ defaultAction, action, parentEl }) {
constructor({ defaultAction, action, parentEl }) {
this.loaded = {};
this.defaultAction = defaultAction || 'activity';
this.action = action || this.defaultAction;
this.$parentEl = $(parentEl) || $(document);
this._location = window.location;
this.windowLocation = window.location;
this.$parentEl.find('.nav-links a')
.each((i, navLink) => {
this.loaded[$(navLink).attr('data-action')] = false;
@ -93,12 +86,10 @@ export default class UserTabs {
}
bindEvents() {
this.changeProjectsPageWrapper = this.changeProjectsPage.bind(this);
this.$parentEl.off('shown.bs.tab', '.nav-links a[data-toggle="tab"]')
.on('shown.bs.tab', '.nav-links a[data-toggle="tab"]', event => this.tabShown(event));
this.$parentEl.on('click', '.gl-pagination a', this.changeProjectsPageWrapper);
this.$parentEl
.off('shown.bs.tab', '.nav-links a[data-toggle="tab"]')
.on('shown.bs.tab', '.nav-links a[data-toggle="tab"]', event => this.tabShown(event))
.on('click', '.gl-pagination a', event => this.changeProjectsPage(event));
}
changeProjectsPage(e) {
@ -133,7 +124,7 @@ export default class UserTabs {
const loadableActions = ['groups', 'contributed', 'projects', 'snippets'];
if (loadableActions.indexOf(action) > -1) {
return this.loadTab(action, endpoint);
this.loadTab(action, endpoint);
}
}
@ -142,14 +133,13 @@ export default class UserTabs {
beforeSend: () => this.toggleLoading(true),
complete: () => this.toggleLoading(false),
dataType: 'json',
type: 'GET',
url: endpoint,
success: (data) => {
const tabSelector = `div#${action}`;
this.$parentEl.find(tabSelector).html(data.html);
this.loaded[action] = true;
return gl.utils.localTimeAgo($('.js-timeago', tabSelector));
}
gl.utils.localTimeAgo($('.js-timeago', tabSelector));
},
});
}
@ -166,10 +156,13 @@ export default class UserTabs {
url: calendarPath,
success: (activityData) => {
$calendarWrap.html(CALENDAR_TEMPLATE);
// eslint-disable-next-line no-new
new ActivityCalendar(activityData, calendarActivitiesPath);
}
},
});
// eslint-disable-next-line no-new
new gl.Activities();
this.loaded.activity = true;
}
@ -180,13 +173,13 @@ export default class UserTabs {
}
setCurrentAction(source) {
let new_state = source;
new_state = new_state.replace(/\/+$/, '');
new_state += this._location.search + this._location.hash;
let newState = source;
newState = newState.replace(/\/+$/, '');
newState += this.windowLocation.search + this.windowLocation.hash;
history.replaceState({
url: new_state
}, document.title, new_state);
return new_state;
url: newState,
}, document.title, newState);
return newState;
}
getCurrentAction() {